:root{color-scheme:light;--bg:#eff2fa;--card:#fff;--soft:#f2f3fc;--text:#19213b;--muted:#596480;--line:#d8deed;--accent:#484cc3;--on:#fff;--tint:#e9ebff;--hero:url('light.jpg')}
:root[data-theme=dark]{color-scheme:dark;--bg:#080e25;--card:#141b37;--soft:#1b2242;--text:#f0f2ff;--muted:#b4bdd7;--line:#323b58;--accent:#b7bdff;--on:#182048;--tint:#2a315a;--hero:url('dark.jpg')}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:16px/1.48 Roboto,system-ui,sans-serif}h1,h2,h3,p{margin:0}h1{font-size:clamp(28px,5vw,42px);line-height:1.12;letter-spacing:-.045em}h2{font-size:20px;letter-spacing:-.02em}h3{font-size:16px}.muted,small{font-size:13px;color:var(--muted)}button,input,select,textarea{font:inherit}button{cursor:pointer;color:inherit;background:transparent;border:0;border-radius:12px;min-height:43px;padding:8px 12px}button:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:2px}button:disabled{opacity:.55}.primary{background:var(--accent);color:var(--on);font-weight:650}.soft,.selected{background:var(--tint);color:var(--accent)}.line{background:var(--soft);border:1px solid var(--line)}a{color:var(--accent);overflow-wrap:anywhere}
.brand{display:inline-flex;align-items:center;gap:10px;letter-spacing:.14em;font-weight:800}.brand img{width:38px;height:38px;border-radius:11px}.top{position:sticky;top:0;background:var(--card);border-bottom:1px solid var(--line);z-index:3}.top>div,.layout{max-width:1180px;margin:auto}.top>div,.spread{display:flex;align-items:center;justify-content:space-between;gap:8px}.top>div{padding:8px 18px}.layout{display:grid;grid-template-columns:172px minmax(0,660px) minmax(170px,1fr);gap:22px;padding:24px 18px 80px}.side,.rail{align-self:start;position:sticky;top:86px;display:grid;gap:7px}.side button,.rail button{text-align:left}main{min-width:0}.card{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:18px;box-shadow:0 4px 20px #282e5208}.stack{display:grid;gap:12px}.row,.chips,.tabs,.stories,.actions{display:flex;align-items:center;gap:6px}.row,.actions{flex-wrap:wrap}.tabs,.chips,.stories{overflow-x:auto;scrollbar-width:thin}.tabs,.chips{margin:12px 0}.tabs{border-bottom:1px solid var(--line)}.tabs button,.chips button{flex:none}.tabs button.active{border-radius:0;border-bottom:2px solid var(--accent);font-weight:700;color:var(--accent)}.chips button{font-size:13px;background:var(--card);border:1px solid var(--line)}.chips button.selected{background:var(--tint)}.hero{background:var(--hero) center/cover,var(--soft);padding:25px 20px;border:1px solid var(--line);border-radius:22px;margin-bottom:16px}.hero h1,.hero p{background:var(--card);padding:5px 10px;border-radius:10px;width:fit-content}.hero p{font-size:14px;margin-top:6px;color:var(--muted)}.title{margin:4px 0 16px}.stories{padding:7px 0}.story{width:73px;flex:none;text-align:center;padding:4px}.story strong{height:48px;width:48px;margin:0 auto 4px;display:grid;place-items:center;border:2px solid var(--accent);background:var(--tint);color:var(--accent);border-radius:50%}.story small{display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.avatar{width:42px;height:42px;border-radius:14px;display:inline-grid;place-items:center;background:var(--tint);color:var(--accent);font-weight:700;overflow:hidden}.avatar img{width:100%;height:100%;object-fit:cover}.author{display:flex;align-items:center;gap:9px;text-align:left;padding:0}.author small{display:block}.tag{font-weight:650;font-size:12px;color:var(--accent)}.body{white-space:pre-line;overflow-wrap:anywhere;margin:12px 0}.actions{border-top:1px solid var(--line);margin-top:13px}.actions button{padding:6px;font-size:13px;color:var(--muted)}.media{max-width:100%;max-height:65vh;object-fit:contain;display:block;margin:10px auto;border-radius:12px}.kv{margin:10px 0}.kv dt{font-size:12px;margin-top:9px;color:var(--muted);font-weight:650}.kv dd{margin:3px 0;overflow-wrap:anywhere;white-space:pre-line}.bottom{display:none}.icon{width:19px;height:19px;margin-right:6px;vertical-align:-4px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linejoin:round;stroke-linecap:round}.search{display:flex;align-items:center;border:1px solid var(--line);background:var(--card);border-radius:14px;padding:2px 12px}.search:focus-within{border-color:var(--accent)}.search input,.search input:focus-visible{outline:none;border:0;box-shadow:none;background:transparent}
label{display:grid;gap:6px;font-weight:600;margin:7px 0}input,select,textarea{width:100%;min-width:0;font-size:16px;border:1px solid var(--line);border-radius:11px;background:var(--soft);color:var(--text);padding:10px 12px}textarea{min-height:72px;resize:vertical}input:focus-visible,textarea:focus-visible,select:focus-visible{outline:2px solid var(--accent)}dialog{width:min(530px,95vw);border:1px solid var(--line);background:var(--card);color:var(--text);border-radius:20px;padding:18px;max-height:90dvh;overflow:auto}dialog::backdrop{background:#040a22a6}dialog header{display:flex;align-items:center;justify-content:space-between}form{display:grid;gap:8px}.error{color:#bd3b58}.pick{position:relative;display:inline-flex;padding:8px 10px;margin:4px;border:1px solid var(--line);border-radius:12px;font-size:14px}.pick input{position:absolute;inset:0;opacity:0;cursor:pointer}.tree{padding-left:16px}.tree button{display:block}.empty{color:var(--muted);font-size:14px}.login{min-height:100dvh;background:var(--hero) center/cover;display:grid;place-items:center;padding:20px}.login .card{width:min(100%,415px);padding:26px}.banner{background:var(--tint);padding:8px 15px;font-size:13px}.metric{font-size:40px;font-weight:750}#notice:not(:empty){position:fixed;z-index:10;bottom:85px;left:50%;transform:translateX(-50%);max-width:90vw;border-radius:12px;background:var(--text);color:var(--card);padding:10px 14px}
@media(max-width:1000px){.layout{grid-template-columns:165px minmax(0,660px);justify-content:center}.rail{display:none}}
@media(max-width:700px){.layout{display:block;max-width:640px;padding:13px 14px calc(88px + env(safe-area-inset-bottom))}.side{display:none}.top>div{padding:7px 14px}.card{padding:15px}.bottom{display:flex;position:fixed;bottom:0;left:0;right:0;align-items:center;background:var(--card);border-top:1px solid var(--line);padding:4px 0 max(5px,env(safe-area-inset-bottom));z-index:4}.bottom button{display:grid;flex:1;place-items:center;gap:3px;font-size:11px;padding:5px 1px}.bottom .icon{margin:0}.bottom .primary{flex:0 0 53px}.bottom .active{color:var(--accent)}.hero{padding:20px 14px}}
