:root{color-scheme:dark;--bg:#111014;--panel:#1d1a20;--muted:#aaa3ad;--orange:#ff7a24;--line:#353039}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:#faf6f2;font:15px/1.5 system-ui,sans-serif}button,input,textarea,select{font:inherit}button,a,input,textarea,select{-webkit-tap-highlight-color:transparent}button{cursor:pointer;border:0;color:inherit;background:none}a{color:var(--orange);text-decoration:none}header{height:76px;padding:12px 24px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);position:fixed;inset:0 0 auto;background:#111014f5;z-index:10}.logo{font-size:30px;font-weight:950;letter-spacing:-2px;color:white}.logo span{color:var(--orange)}.countdown{text-align:right;font-size:12px;letter-spacing:1px;color:var(--orange)}.countdown b{display:block;font-size:17px;letter-spacing:2px;color:white}main{padding-top:76px;padding-bottom:82px}nav{position:fixed;inset:auto 0 0;height:80px;padding-bottom:env(safe-area-inset-bottom);display:flex;align-items:center;justify-content:space-evenly;border-top:1px solid var(--line);background:#111014f5;z-index:10}nav[hidden]{display:none}nav button{min-width:65px;display:grid;justify-items:center;gap:2px;color:var(--muted)}nav i{font-size:24px}nav small{font-size:10px}.add{background:var(--orange);color:#150d09;border-radius:16px;padding:8px 16px;min-width:60px}h1,h2,h3{line-height:1.15}h1{font-size:34px;letter-spacing:-1px}h2{font-size:25px}.eyebrow{font-size:11px;font-weight:700;color:var(--orange);letter-spacing:2px;text-transform:uppercase}.muted{color:var(--muted)}.wrap{max-width:760px;margin:auto;padding:28px 22px}.login{max-width:420px;padding-top:8vh}.card{background:var(--panel);border:1px solid var(--line);border-radius:20px;padding:22px;margin:16px 0}.primary{background:var(--orange);color:#19100a;font-weight:750;border-radius:12px;padding:13px 20px}.secondary{border:1px solid var(--line);padding:11px 16px;border-radius:12px}.danger{color:#ffa39a}label{display:block;color:var(--muted);font-size:13px;margin:14px 0 6px}input,textarea,select{display:block;width:100%;border:1px solid #49414d;border-radius:10px;background:#131115;color:white;padding:12px}input[type=checkbox]{display:inline;width:auto;margin-right:8px}textarea{min-height:100px;resize:vertical}form>.primary{margin-top:18px;width:100%}.feed{height:calc(100dvh - 156px);overflow-y:auto;scroll-snap-type:y mandatory;max-width:560px;margin:auto;overscroll-behavior:contain}.post{height:calc(100dvh - 156px);position:relative;scroll-snap-align:start;overflow:hidden;background:#211923}.post img,.post video{height:100%;width:100%;object-fit:contain;background:#080709}.shade{position:absolute;inset:45% 0 0;background:linear-gradient(transparent,#000d);pointer-events:none}.caption{position:absolute;bottom:25px;left:22px;right:86px}.username{font-weight:750;font-size:17px;padding:0}.caption h2{font-size:22px;margin:8px 0}.caption p{margin:4px 0;color:#ddd5dc;font-size:13px;max-height:65px;overflow:auto}.actions{position:absolute;right:17px;bottom:40px;display:grid;gap:22px}.actions button{display:grid;gap:3px;justify-items:center;text-shadow:0 2px 6px #000}.actions i{font-size:31px}.liked{color:var(--orange)}.vote{margin-top:13px;padding:9px 14px;font-size:13px}.back{margin-bottom:18px;padding:0;color:var(--orange)}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:5px}.grid button{padding:0;position:relative;aspect-ratio:3/4;background:var(--panel);overflow:hidden;border-radius:7px}.grid img,.grid video{width:100%;height:100%;object-fit:cover}.grid small{position:absolute;bottom:4px;left:5px;text-shadow:0 1px 4px #000}.empty{text-align:center;max-width:430px;margin:10vh auto;padding:25px}.empty i{font-size:52px;color:var(--orange)}.empty h2{font-size:28px}dialog{border:1px solid var(--line);border-radius:24px 24px 0 0;background:var(--panel);color:white;width:min(100%,600px);max-height:85dvh;padding:30px 23px;margin:auto auto 0}dialog::backdrop{background:#000a}.close{position:absolute;top:13px;right:13px;padding:8px}.comment{border-bottom:1px solid var(--line);padding:13px 0}.comment p{white-space:pre-wrap;overflow-wrap:anywhere}.comment small{color:var(--muted)}#toast{position:fixed;top:85px;left:50%;transform:translateX(-50%);width:max-content;max-width:90%;background:#3c3030;color:white;padding:13px 20px;border:1px solid #9b6b49;border-radius:12px;z-index:99}.row{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.row>*{flex:1}.listrow{padding:14px 0;border-bottom:1px solid var(--line);overflow-wrap:anywhere}.listrow button{font-size:12px;color:var(--orange);padding:8px}.preview{max-height:250px;width:100%;object-fit:contain;margin-top:16px}.adminwrap{max-width:1100px}.tabs{display:flex;gap:9px;flex-wrap:wrap;margin:18px 0}.tabs button{border:1px solid var(--line);border-radius:10px;padding:9px 13px}.rank{font-size:22px;font-weight:bold;color:var(--orange)}button:focus-visible,a:focus-visible{outline:2px solid var(--orange);outline-offset:4px}button:disabled{opacity:.5;cursor:wait}.hint{font-size:12px;color:var(--muted)}@media(min-width:700px){.feed{border-inline:1px solid var(--line)}header{padding-inline:calc((100% - 1000px)/2 + 24px)}nav{justify-content:center;gap:100px}}

/* HC26 immersive feed update */
:root{--feed-width:min(100vw,560px)}
header{border:0;background:linear-gradient(180deg,#111014 0%,#111014ed 48%,#11101400 100%);height:92px;padding:16px 22px 28px;align-items:flex-start}
.logo{font-size:28px;line-height:1;letter-spacing:-1.8px;text-shadow:0 2px 12px #0008}
.countdown{font-size:9px;line-height:1.6;letter-spacing:1.5px;padding:0;text-shadow:0 2px 10px #000}
.countdown b{font-size:14px;letter-spacing:1px;font-variant-numeric:tabular-nums}
main{padding-top:82px;padding-bottom:90px}
nav{border:0;height:calc(68px + env(safe-area-inset-bottom));padding:4px 28px calc(8px + env(safe-area-inset-bottom));background:transparent;isolation:isolate;gap:0;justify-content:space-around}
nav::before{content:"";position:absolute;inset:-65px 0 0;background:linear-gradient(0deg,#111014 0%,#111014ed 35%,#11101480 65%,#11101400 100%);z-index:-1;pointer-events:none}
nav button{min-width:44px;min-height:44px;display:flex;align-items:center;justify-content:center;padding:0;color:#ddd7dd}
nav i{font-size:22px}
nav button[aria-current="page"]{color:var(--orange)}
nav .add{min-width:44px;width:44px;min-height:38px;height:38px;border-radius:12px;background:var(--orange);color:#1a0e07;box-shadow:0 3px 16px #0004}
nav .add i{font-size:24px}
body[data-page="home"] main{padding:0}
body[data-page="home"] header{width:var(--feed-width);left:50%;right:auto;transform:translateX(-50%);height:122px;padding:calc(20px + env(safe-area-inset-top)) 22px 50px;background:linear-gradient(180deg,#000b 0%,#0007 44%,transparent 100%);pointer-events:none}
body[data-page="home"] header>*{pointer-events:auto}
body[data-page="home"] nav{width:var(--feed-width);left:50%;right:auto;transform:translateX(-50%)}
.feed{height:100dvh;width:var(--feed-width);border:0;scrollbar-width:none}
.feed::-webkit-scrollbar{display:none}
.feed>.post{height:100dvh;min-height:100dvh;border:0}
.feed .caption{bottom:calc(92px + env(safe-area-inset-bottom));left:22px;right:80px}
.feed .actions{bottom:calc(118px + env(safe-area-inset-bottom));right:18px;gap:18px}
.actions i{font-size:28px}
.actions button{min-height:44px;min-width:44px}
.shade{inset:40% 0 0;background:linear-gradient(180deg,transparent 0%,#0005 52%,#000d 100%)}
.card,dialog{border:0}
.comment,.listrow{border:0;margin-bottom:8px}
.review-post{height:min(59dvh,540px);border-radius:16px;isolation:isolate}
.review-post .caption{bottom:20px;right:24px;left:18px}
.review-post .caption p{max-height:66px}
.review-brand{position:absolute;top:0;left:0;right:0;display:flex;justify-content:space-between;padding:20px 18px 60px;background:linear-gradient(#000b,transparent);pointer-events:none}
.review-brand .logo{font-size:24px}
.review-brand .countdown{font-size:8px}
.review-brand .countdown b{font-size:12px}
.review-controls{display:flex;gap:12px;margin-top:18px}
.review-controls button{flex:1}
.review-hint{margin:0 0 12px}
@media(min-width:700px){header{padding-inline:max(22px,calc((100vw - 1000px)/2 + 24px))}nav{justify-content:center;gap:90px}.feed{border:0}body[data-page="home"] nav{justify-content:space-around;gap:0}}
.feed>.post>img,.feed>.post>video,.review-post>img,.review-post>video{object-fit:cover}
