:root{--bg:#07060a;--ch:#14121a;--ch2:#1c1824;--red:#e0245e;--pur:#8b5cf6;--cy:#3dd6e6;--tx:#f1eff5;--mu:#a59fb3;--bd:#2d2740}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:radial-gradient(1200px 600px at 15% -10%,#2a0f2e55,transparent),radial-gradient(900px 500px at 100% 0,#1a145055,transparent),var(--bg);color:var(--tx);font:16px/1.6 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;overflow-x:hidden}
main,.top{max-width:1100px;margin:0 auto;padding:0 clamp(12px,4vw,28px)}
.top{display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px;padding-top:16px;padding-bottom:6px}
.mark{font-weight:700;letter-spacing:.08em;color:var(--red)}.tag{color:var(--mu);font-size:.8rem}
code{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:.85em;color:var(--cy);word-break:break-all}
.hero{text-align:center;padding:28px 0 8px}
h1{font:600 clamp(1.1rem,3vw,1.5rem) Georgia,serif;letter-spacing:.14em;text-transform:uppercase;margin:0 0 8px;color:var(--mu)}
.start{margin:0 0 18px;color:var(--tx)}.start small{color:var(--mu)}
.cal{font:700 clamp(1.15rem,5.4vw,3rem)/1.2 ui-monospace,Menlo,Consolas,monospace;background:linear-gradient(90deg,var(--red),var(--pur));-webkit-background-clip:text;background-clip:text;color:transparent;overflow-x:auto;padding:6px 0;white-space:nowrap}
.lbl{margin:2px 0 0;color:var(--mu);font-size:.78rem}
.now{margin-top:14px;color:var(--mu)}.now b{color:var(--tx);font-variant-numeric:tabular-nums}
.notice{border:1px solid var(--red);color:#ffb3c9;border-radius:10px;padding:8px 12px;margin:0 0 14px}
.status,.panel,.story,.info{background:linear-gradient(160deg,var(--ch2),var(--ch));border:1px solid var(--bd);border-radius:14px;padding:14px 16px;box-shadow:0 10px 30px #0008}
.status{margin:18px 0}.status p{margin:0 0 6px}
.dot{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:8px;background:var(--pur)}
.dot.ok{background:var(--cy)}.dot.bad{background:var(--red)}
.detail{display:grid;grid-template-columns:max-content 1fr;gap:2px 14px;margin:0;font-size:.88rem}
.detail dt{color:var(--mu)}.detail dd{margin:0;overflow-wrap:anywhere}
.hide-detail .detail{display:none}
.panels{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:12px}
.panel{min-width:0}.panel.wide{grid-column:1/-1}
h2{margin:0 0 6px;font-size:.8rem;letter-spacing:.14em;text-transform:uppercase;color:var(--cy);font-weight:600}
.num{overflow-x:auto;padding-bottom:4px}
.num b{font:600 clamp(1rem,4.2vw,1.55rem) ui-monospace,Menlo,Consolas,monospace;white-space:nowrap;font-variant-numeric:tabular-nums}
.controls{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:18px 0}
button{font:inherit;font-size:.88rem;color:var(--tx);background:var(--ch2);border:1px solid var(--pur);border-radius:999px;padding:9px 14px;cursor:pointer;min-height:40px}
button:hover,button:focus-visible{border-color:var(--cy);outline:none;box-shadow:0 0 0 2px #3dd6e633}
#toast{color:var(--cy);font-size:.85rem}
.story{margin:8px 0 18px;padding:clamp(16px,5vw,38px);border-top:2px solid var(--red);background:linear-gradient(160deg,#241532,#100d16)}
.story h2{font:700 clamp(1.5rem,6vw,2.6rem)/1.15 Georgia,"Times New Roman",serif;letter-spacing:0;text-transform:none;color:var(--tx);margin:0}
.sub{font:italic 1.05rem Georgia,serif;color:#d6b8ff;margin:6px 0 18px}
blockquote{margin:0;max-width:68ch;font:1.1rem/1.85 Georgia,"Times New Roman",serif;overflow-wrap:break-word}
blockquote p{margin:0 0 1em}
mark{background:none;color:#ff7aa2;font-weight:700;border-bottom:1px solid #e0245e66}
#short{max-width:68ch;font:1.1rem/1.8 Georgia,serif}.fine{color:var(--mu);font-size:.8rem;margin:10px 0 0}
.info{margin-bottom:16px;font-size:.9rem;color:var(--mu)}.info summary{cursor:pointer;color:var(--tx)}
footer{text-align:center;color:var(--mu);letter-spacing:.2em;font-size:.72rem;text-transform:uppercase;padding:14px 0 28px}
[hidden]{display:none!important}
@media (prefers-reduced-motion:no-preference){.dot{transition:background .4s}.story{transition:opacity .3s}}