:root{--bg:#fff;--bg2:#f3f4f6;--card:#fff;--tx:#0f1115;--m:#6b7280;--bd:#e5e7eb;--ac:#1d9bf0;--pri:#0f1115;--pt:#fff;--rd:20px}
[data-theme=dark]{--bg:#0b0d11;--bg2:#171a21;--card:#10131a;--tx:#f3f4f6;--m:#8b93a1;--bd:#242936;--ac:#4cb3ff;--pri:#f3f4f6;--pt:#0b0d11}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--tx);font:15px/1.4 Inter,system-ui,-apple-system,Segoe UI,sans-serif}
a{color:inherit;text-decoration:none}.m{color:var(--m)}.i{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
button,input,textarea{font:inherit;color:inherit}button{cursor:pointer}
.shell{display:grid;grid-template-columns:275px minmax(0,600px) 350px;justify-content:center;gap:24px;max-width:1280px;margin:auto}
#side{position:sticky;top:0;height:100vh;padding:16px 8px;display:flex;flex-direction:column;gap:4px}
.logo{display:flex;align-items:center;gap:10px;font-size:24px;font-weight:800;padding:8px 14px}.logo img{width:38px;border-radius:10px}
#side a.n{display:flex;align-items:center;gap:16px;padding:12px 16px;border-radius:999px;font-size:17px;position:relative}
#side a.n:hover,#side a.on{background:var(--bg2)}#side a.on{font-weight:700}
.bd{background:var(--ac);color:#fff;border-radius:999px;font-size:11px;padding:1px 6px;font-weight:700}
.btn{background:var(--pri);color:var(--pt);border:0;border-radius:999px;padding:9px 20px;font-weight:700}.btn.sm{padding:6px 14px;font-size:14px}.btn.ghost{background:none;color:var(--tx);border:1px solid var(--bd)}.btn:disabled{opacity:.5}
.big{width:100%;padding:14px;font-size:16px;margin-top:12px}
.me{margin-top:auto;display:flex;align-items:center;gap:10px;padding:10px;border-radius:999px;cursor:pointer}.me:hover{background:var(--bg2)}.me b{display:block}
.av{width:44px;height:44px;border-radius:50%;background:var(--pri);color:var(--pt);display:inline-grid;place-items:center;font-weight:700;object-fit:cover;flex:none}
main{border-inline:1px solid var(--bd);min-height:100vh}
.top{position:sticky;top:0;z-index:5;background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(12px);display:flex;gap:10px;align-items:center;padding:12px 16px}
.top input{flex:1;background:var(--bg2);border:0;border-radius:999px;padding:11px 18px;outline:0}
.ib{background:none;border:0;padding:8px;border-radius:50%;color:var(--m);display:inline-flex}.ib:hover{background:var(--bg2);color:var(--tx)}
.tabs{display:flex;border-bottom:1px solid var(--bd)}.tabs a{flex:1;text-align:center;padding:14px;color:var(--m);cursor:pointer;font-weight:600}.tabs a.on{color:var(--tx);box-shadow:inset 0 -3px var(--tx)}
.cmp{display:flex;gap:12px;padding:16px;border-bottom:1px solid var(--bd)}.cmp textarea{width:100%;border:0;background:none;resize:none;outline:0;font-size:18px;min-height:56px}
.cr{display:flex;align-items:center;gap:4px}.cr .btn{margin-left:auto}#pv img,#pv video,.media{max-width:100%;max-height:520px;border-radius:var(--rd);margin-top:8px;border:1px solid var(--bd);display:block}
.post{display:flex;gap:12px;padding:16px;border-bottom:1px solid var(--bd)}.post:hover{background:color-mix(in srgb,var(--bg2) 40%,transparent)}.pb{flex:1;min-width:0}
.ph{display:flex;align-items:center;gap:4px}.ph a{flex:1}.tx{white-space:pre-wrap;word-break:break-word;margin-top:2px;cursor:pointer}.tx a{color:var(--ac)}
.ac{display:flex;justify-content:space-between;margin-top:8px;max-width:420px}.ac button{background:none;border:0;display:flex;gap:6px;align-items:center;color:var(--m);padding:6px;border-radius:999px;font-size:13px}
.ac button:hover{color:var(--ac)}.ac .lk.on{color:#f43f5e}.ac .lk.on .i{fill:#f43f5e}.ac .bm.on{color:var(--ac)}.ac .bm.on .i{fill:var(--ac)}
.note{padding:40px 16px;text-align:center;color:var(--m)}h2.t{margin:0;padding:14px 16px;font-size:20px;border-bottom:1px solid var(--bd)}
#rail{padding:12px 0;position:sticky;top:0;height:100vh;overflow:auto}.box{background:var(--bg2);border-radius:var(--rd);padding:14px 16px;margin-bottom:16px}.box h3{margin:0 0 10px;font-size:20px}
.row{display:flex;align-items:center;gap:10px;padding:8px 0}.row>div{flex:1;min-width:0}.row b,.row span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rg{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.rg video{width:100%;aspect-ratio:9/14;object-fit:cover;border-radius:12px;background:#000}
.pf{padding:16px;border-bottom:1px solid var(--bd)}.pf .av{width:84px;height:84px;font-size:28px}.pf .st{display:flex;gap:16px;color:var(--m);margin:8px 0}.pf .st b{color:var(--tx)}
.form{display:flex;flex-direction:column;gap:10px;padding:16px}.form input,.form textarea,.cf input{background:var(--bg2);border:1px solid var(--bd);border-radius:12px;padding:12px;outline:0}
.cf{display:flex;gap:8px;padding:12px 16px;border-bottom:1px solid var(--bd)}.cf input{flex:1;border-radius:999px;padding:10px 16px}
.cv{display:flex;gap:12px;padding:14px 16px;align-items:center;border-bottom:1px solid var(--bd)}
.chat{display:flex;flex-direction:column;height:calc(100vh - 118px)}#ms{flex:1;overflow:auto;padding:16px;display:flex;flex-direction:column;gap:6px}
.bb{max-width:75%;padding:9px 14px;border-radius:18px;background:var(--bg2);align-self:flex-start;word-break:break-word}.bb.me2{background:var(--ac);color:#fff;align-self:flex-end}.bb img{max-width:100%;border-radius:12px}.bb small{display:block;opacity:.7;font-size:11px}
.reels{height:calc(100vh - 62px);overflow-y:scroll;scroll-snap-type:y mandatory}.reel{height:100%;scroll-snap-align:start;position:relative;background:#000;display:flex;justify-content:center}
.reel video{height:100%;max-width:100%;object-fit:contain}.rc{position:absolute;left:16px;bottom:20px;color:#fff;text-shadow:0 1px 4px #000;max-width:70%}.rs{position:absolute;right:12px;bottom:30px;display:flex;flex-direction:column;gap:12px}.rs button{background:#0008;color:#fff;border-radius:50%;width:48px;height:48px;border:0;display:grid;place-items:center}
.auth{max-width:400px;margin:8vh auto;padding:28px;border:1px solid var(--bd);border-radius:24px}.auth h1{margin:8px 0 4px}.err{color:#ef4444;min-height:20px}
.toast{position:fixed;bottom:80px;left:50%;transform:translateX(-50%);background:var(--pri);color:var(--pt);padding:10px 18px;border-radius:999px;z-index:99}
#bn{display:none}
@media(max-width:1100px){.shell{grid-template-columns:72px minmax(0,600px);gap:0}#rail{display:none}#side a.n span,.me div,#side .btn.p,.logo span{display:none}#side a.n{justify-content:center;padding:12px}}
@media(max-width:700px){.shell{display:block}#side{display:none}main{border:0;padding-bottom:64px}#bn{display:flex;position:fixed;bottom:0;left:0;right:0;background:var(--bg);border-top:1px solid var(--bd);justify-content:space-around;padding:8px 0 calc(8px + env(safe-area-inset-bottom));z-index:9}#bn a{padding:8px;position:relative}#bn a.on{color:var(--ac)}.chat{height:calc(100vh - 190px)}}