* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, 'Helvetica Neue', Arial, 'Noto Sans', 'Apple Color Emoji', 'Segoe UI Emoji'; background: #0f1115; color: #e6e8ee; }

header { position: sticky; top: 0; z-index: 10; background: rgba(15,17,21,0.85); backdrop-filter: blur(6px); border-bottom: 1px solid #1f2330; }
.header-inner { max-width: 1100px; margin: 0 auto; padding: 14px 16px; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.brand { font-weight: 700; font-size: 16px; color: #c6d0f5; }
.counter { font-variant-numeric: tabular-nums; color: #95a0b6; }

main { max-width: 1600px; margin: 0 auto; padding: 16px; }

.upload { display: grid; grid-template-columns: 1fr; gap: 10px; padding: 12px; border: 1px solid #1f2330; border-radius: 12px; background: #141823; }
.upload form { display: grid; gap: 10px; grid-template-columns: 1fr auto; align-items: center; }
.upload .row { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }

input[type="text"], input[type="url"], input[type="file"] { width: 100%; padding: 10px 12px; background: #0b0e14; color: #e6e8ee; border: 1px solid #1f2330; border-radius: 10px; }
button { padding: 10px 14px; border-radius: 10px; border: 1px solid #2b3142; background: #1f2432; color: #e6e8ee; cursor: pointer; }
button:hover { background: #252c3e; }
.small { color: #7d8799; font-size: 12px; }

.gallery { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; margin-top: 16px; }
@media (max-width: 1200px) { .gallery { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (max-width: 1000px) { .gallery { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 900px) { .gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { .gallery { grid-template-columns: 1fr; } }

.card { background: #0b0e14; border: 1px solid #1f2330; border-radius: 15px; overflow: hidden; display: flex; align-items: center; justify-content: center; aspect-ratio: 1 / 1; }
.card img { width: 100%; height: 100%; display: block; object-fit: contain; object-position: center; background: #0b0e14; }

.end { text-align: center; color: #6b7383; padding: 20px 0; }
