:root{--void:#080808;--void-2:#111110;--void-3:#1a1a18;--snow:#f2f0eb;--dust:#888480;--mist:#3a3a37;--lime:#c8ff00;--danger:#ff4d4d;--font-display:"Playfair Display", Georgia, serif;--font-body:"DM Sans", system-ui, sans-serif;--font-mono:"Space Mono", monospace}*,:before,:after{box-sizing:border-box}html,body{background:var(--void);color:var(--snow);font-family:var(--font-body);-webkit-font-smoothing:antialiased;margin:0;padding:0;font-size:16px}#root{min-height:100vh}button,input,textarea{font-family:inherit}:focus-visible{outline:2px solid var(--lime);outline-offset:3px}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.001ms!important;animation-duration:.001ms!important}}.app{flex-direction:column;min-height:100vh;display:flex}.site-header{z-index:100;-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--mist);background:#080808e0;position:sticky;top:0}.site-header__inner{justify-content:space-between;align-items:center;max-width:1280px;height:64px;margin:0 auto;padding:0 32px;display:flex}.site-header__brand{align-items:center;gap:10px;display:flex}.site-header__logo{color:var(--lime);font-size:18px;line-height:1}.site-header__name{font-family:var(--font-display);letter-spacing:-.01em;color:var(--snow);font-size:20px;font-weight:700}.site-header__nav{align-items:center;gap:24px;display:flex}.site-header__count{font-family:var(--font-mono);color:var(--dust);letter-spacing:.04em;font-size:12px}.site-header__upload-btn{background:var(--lime);color:var(--void);cursor:pointer;letter-spacing:.01em;border:none;border-radius:100px;padding:10px 20px;font-size:13px;font-weight:600;transition:filter .15s,transform .1s}.site-header__upload-btn:hover{filter:brightness(1.08);transform:translateY(-1px)}.site-main{flex:1;width:100%;max-width:1280px;margin:0 auto;padding:0 32px 80px}.hero{border-bottom:1px solid var(--mist);max-width:680px;margin-bottom:60px;padding:80px 0 60px}.hero__headline{font-family:var(--font-display);letter-spacing:-.03em;color:var(--snow);margin:0 0 20px;font-size:clamp(48px,7vw,88px);font-weight:900;line-height:1}.hero__headline em{color:var(--lime);font-style:italic}.hero__sub{font-family:var(--font-body);color:var(--dust);letter-spacing:.01em;margin:0;font-size:16px;font-weight:300}.feed-grid{columns:3;column-gap:16px}@media (width<=900px){.feed-grid{columns:2}}@media (width<=560px){.feed-grid{columns:1}.site-main{padding:0 20px 60px}.site-header__inner{padding:0 20px}.hero{padding:48px 0 40px}}.post-card{break-inside:avoid;opacity:0;animation:.5s forwards card-in;animation-delay:var(--delay,0s);margin-bottom:16px;transform:translateY(20px)}@keyframes card-in{to{opacity:1;transform:translateY(0)}}.post-card__frame{background:var(--void-3);cursor:pointer;border-radius:4px;position:relative;overflow:hidden}.post-card__skeleton{background:linear-gradient(110deg, var(--void-3) 30%, var(--mist) 50%, var(--void-3) 70%);background-size:200% 100%;width:100%;padding-bottom:75%;animation:1.5s ease-in-out infinite shimmer}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.post-card--skeleton .post-card__frame{min-height:260px}.post-card__img{opacity:0;width:100%;transition:opacity .4s;display:block}.post-card__img--loaded{opacity:1}.post-card__overlay{opacity:0;background:linear-gradient(#0000 30%,#08080866 60%,#080808eb 100%);align-items:flex-end;padding:20px;transition:opacity .25s;display:flex;position:absolute;inset:0}.post-card__frame:hover .post-card__overlay{opacity:1}.post-card__caption{font-family:var(--font-display);color:var(--snow);margin:0;font-size:18px;font-style:italic;line-height:1.3;transition:transform .25s;transform:translateY(8px)}.post-card__frame:hover .post-card__caption{transform:translateY(0)}.post-card__index{font-family:var(--font-mono);color:var(--lime);letter-spacing:.06em;background:#080808b3;border-radius:3px;padding:4px 8px;font-size:11px;position:absolute;top:12px;right:12px}.feed-state{text-align:center;color:var(--dust);padding:100px 0}.feed-state__icon{color:var(--mist);margin-bottom:20px;font-size:32px;display:block}.feed-state__title{font-family:var(--font-display);color:var(--snow);margin:0 0 8px;font-size:24px;font-weight:700}.feed-state__body{color:var(--dust);margin:0;font-size:15px}.panel-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:200;background:#080808b3;justify-content:flex-end;animation:.2s overlay-in;display:flex;position:fixed;inset:0}@keyframes overlay-in{0%{opacity:0}to{opacity:1}}.upload-panel{background:var(--void-2);border-left:1px solid var(--mist);flex-direction:column;width:400px;max-width:100vw;height:100vh;animation:.28s cubic-bezier(.4,0,.2,1) panel-in;display:flex;overflow-y:auto}@keyframes panel-in{0%{transform:translate(100%)}to{transform:translate(0)}}.upload-panel__header{flex-shrink:0;justify-content:space-between;align-items:center;padding:28px 28px 0;display:flex}.upload-panel__eyebrow{font-family:var(--font-mono);text-transform:uppercase;letter-spacing:.12em;color:var(--lime);font-size:11px}.upload-panel__close{color:var(--dust);cursor:pointer;background:0 0;border:none;border-radius:4px;padding:4px 8px;font-size:16px;transition:color .15s,background .15s}.upload-panel__close:hover{color:var(--snow);background:var(--mist)}.upload-panel__form{flex-direction:column;flex:1;gap:16px;padding:20px 28px 40px;display:flex}.dropzone{border:1.5px dashed var(--mist);cursor:pointer;background:var(--void-3);border-radius:6px;justify-content:center;align-items:center;min-height:220px;transition:border-color .15s,background .15s;display:flex;position:relative;overflow:hidden}.dropzone:hover,.dropzone--active{border-color:var(--lime);background:#c8ff0008}.dropzone--filled{border-style:solid;border-color:var(--mist);min-height:0}.dropzone__empty{text-align:center;color:var(--dust);padding:24px}.dropzone__icon{color:var(--mist);margin-bottom:10px;font-size:28px;display:block}.dropzone__empty p{color:var(--snow);margin:0 0 4px;font-size:14px}.dropzone__sub{color:var(--dust);font-size:12px}.dropzone__preview{object-fit:cover;width:100%;max-height:340px;display:block}.dropzone__input{opacity:0;cursor:pointer;position:absolute;inset:0}.dropzone__change{border:1px solid var(--mist);color:var(--dust);cursor:pointer;background:0 0;border-radius:4px;align-self:flex-start;padding:6px 12px;font-size:12px;transition:border-color .15s,color .15s}.dropzone__change:hover{border-color:var(--snow);color:var(--snow)}.caption-wrap{flex-direction:column;gap:6px;display:flex;position:relative}.caption-wrap__label{font-family:var(--font-mono);text-transform:uppercase;letter-spacing:.1em;color:var(--dust);font-size:11px}.caption-wrap__input{background:var(--void-3);border:1px solid var(--mist);color:var(--snow);resize:none;border-radius:6px;padding:12px 14px;font-size:14px;line-height:1.5;transition:border-color .15s}.caption-wrap__input::placeholder{color:var(--dust)}.caption-wrap__input:focus{border-color:var(--lime);outline:none}.caption-wrap__count{font-family:var(--font-mono);color:var(--mist);text-align:right;font-size:11px}.upload-panel__error{color:var(--danger);margin:0;font-size:13px}.publish-btn{background:var(--lime);color:var(--void);cursor:pointer;letter-spacing:.02em;border:none;border-radius:6px;margin-top:auto;padding:14px;font-size:14px;font-weight:700;transition:filter .15s,transform .1s}.publish-btn:hover:not(:disabled){filter:brightness(1.08);transform:translateY(-1px)}.publish-btn:disabled{opacity:.65;cursor:progress}.publish-btn__inner{justify-content:center;align-items:center;gap:10px;display:flex}.spinner{border:2px solid #0808084d;border-top-color:var(--void);border-radius:50%;width:14px;height:14px;animation:.7s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.toast-stack{z-index:300;flex-direction:column;gap:10px;display:flex;position:fixed;bottom:28px;right:28px}.toast{background:var(--snow);color:var(--void);border-radius:6px;max-width:320px;padding:12px 20px;font-size:13px;font-weight:500;animation:.25s cubic-bezier(.4,0,.2,1) toast-in;box-shadow:0 8px 24px #0006}.toast--error{background:var(--danger);color:#fff}@keyframes toast-in{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.site-footer{border-top:1px solid var(--mist);font-family:var(--font-mono);color:var(--dust);letter-spacing:.04em;justify-content:space-between;padding:24px 32px;font-size:11px;display:flex}@media (width<=560px){.site-footer{flex-direction:column;gap:6px;padding:20px}}
