/* Web app shell: dark sidebar + toned canvas. Only what is unique to the desktop surface. */
body[data-role="web"]{display:grid;grid-template-columns:248px minmax(0,1fr);min-height:100vh;background:var(--bg)}
body[data-role="web"] #site-footer{display:none}
.side{position:sticky;top:0;height:100vh;background:var(--drench);color:var(--on-drench);padding:22px 16px calc(var(--pocbar-h) + 16px);display:flex;flex-direction:column;gap:4px;overflow-y:auto;scrollbar-width:none}
.side .wm{display:flex;align-items:center;gap:10px;font-family:var(--font-display);font-size:var(--t-22);font-weight:600;color:#fff;text-decoration:none;padding:4px 10px 22px}
.side .wm i{width:32px;height:32px;border-radius:9px;background:var(--primary);display:grid;place-items:center;flex:none}
.side nav{display:flex;flex-direction:column;gap:4px}
.side nav a{display:flex;align-items:center;gap:12px;height:40px;padding:0 12px;border-radius:10px;color:oklch(0.85 0.02 160);font-size:var(--t-14);font-weight:500;text-decoration:none;transition:background var(--dur-1) var(--ease),color var(--dur-1) var(--ease)}
.side nav a:hover{background:oklch(1 0 0/.07);color:#fff}
.side nav a[aria-current="page"]{background:oklch(1 0 0/.13);color:#fff}
.side nav a .count{margin-left:auto}
.side .grp{font-size:var(--t-11);font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:oklch(0.64 0.02 160);padding:18px 12px 6px}
.side .me{margin-top:auto;display:flex;align-items:center;gap:10px;padding:12px;border-radius:12px;background:oklch(1 0 0/.07);border:0;color:#fff;font:inherit;text-align:left;cursor:pointer;width:100%}
.side .me:hover{background:oklch(1 0 0/.12)}
.side .me b{display:block;font-size:var(--t-13);font-weight:600}
.side .me small{color:oklch(0.76 0.02 160);font-size:var(--t-12)}
.side .me .ico{margin-left:auto;color:oklch(0.76 0.02 160)}
.app-main{padding:28px 36px calc(var(--pocbar-h) + 48px);max-width:1360px;width:100%;min-width:0}
.app-main.narrow{max-width:1040px}
.topbar{display:flex;align-items:center;gap:14px;margin-bottom:26px}
.topbar .search{flex:1;max-width:460px}
.topbar .search .input{height:42px;border-radius:11px}
.topbar .search kbd{position:absolute;right:12px;top:50%;transform:translateY(-50%);font:500 var(--t-12) var(--font-body);border:var(--rule);border-radius:6px;padding:2px 6px;color:var(--muted);background:var(--surface)}
.topbar .date{color:var(--muted);font-size:var(--t-14);margin-left:auto;white-space:nowrap}
.topbar .btn-icon{width:42px;height:42px;border-radius:11px;position:relative}
.topbar .dot{position:absolute;top:9px;right:9px;width:8px;height:8px;border-radius:50%;background:var(--danger);border:2px solid var(--surface)}
.split{display:grid;grid-template-columns:minmax(320px,5fr) minmax(0,7fr);gap:var(--s-5);align-items:start}
@media (max-width:1100px){.split{grid-template-columns:1fr}}
.lanes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s-5)}
@media (max-width:960px){.lanes{grid-template-columns:1fr}}
.month{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));border:var(--rule);border-radius:12px;overflow:hidden}
.month .dow{font-size:var(--t-11);font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);padding:var(--s-2) var(--s-3);border-right:var(--rule);border-bottom:var(--rule);background:var(--surface-2)}
.month .day{min-height:100px;padding:var(--s-2);border-right:var(--rule);border-bottom:var(--rule);font-size:var(--t-12)}
.month .dow:nth-child(7n),.month .day:nth-child(7n){border-right:0}
.month .day.off{background:var(--surface-2);color:var(--muted)}
.month .day.today .d{background:var(--primary);color:var(--on-primary)}
.month .d{display:inline-flex;width:24px;height:24px;align-items:center;justify-content:center;border-radius:50%;font-variant-numeric:tabular-nums;font-weight:600;margin-bottom:4px}
.month .ev{display:block;font-size:var(--t-11);font-weight:500;line-height:1.3;padding:3px 6px;margin-top:3px;border-radius:6px;background:var(--primary-soft);color:var(--primary-strong);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;cursor:pointer}
.month .ev.bad{background:var(--danger-soft);color:var(--danger-ink)}
.month .ev.accent{background:var(--accent-soft);color:var(--warning-ink)}
.month .ev.muted{background:var(--surface-3);color:var(--muted)}
.ask-thread{max-width:820px}
.ask-q{font-family:var(--font-display);font-size:var(--t-22);font-weight:500;padding:var(--s-4) 0 var(--s-3)}
.ask-a{padding:var(--s-4) var(--s-5);border-radius:14px;background:var(--surface);border:var(--rule);box-shadow:var(--elev-card);font-size:var(--t-15);line-height:1.6;margin-bottom:var(--s-4)}
.ask-a .cites{display:flex;gap:var(--s-2);flex-wrap:wrap;margin-top:var(--s-3);align-items:center}
.ask-bar{display:flex;gap:var(--s-2);margin-top:var(--s-4)}
.ask-bar .input{height:48px;font-size:var(--t-15);border-radius:12px}
.ask-bar .btn{height:48px;border-radius:12px}
@media (max-width:900px){body[data-role="web"]{grid-template-columns:1fr}.side{position:static;height:auto;flex-direction:row;flex-wrap:wrap;align-items:center;padding:12px 16px}.side .wm{padding:0 8px 0 0}.side nav{flex-direction:row;flex-wrap:wrap}.side .grp{display:none}.side .me{margin-top:0;width:auto;margin-left:auto}.app-main{padding:20px 20px calc(var(--pocbar-h) + 32px)}}