:root{--blue:#1d4f9c;--blue2:#0f2f63;--red:#9b1d1d;--gold:#d6b25a;--gold2:#f1dc9a;--marble:#efece4;--ink:#0b1020}
*{box-sizing:border-box}
html,body{margin:0;background:var(--ink);color:#f3efe6;font:16px/1.7 "Noto Serif SC","Songti SC","STSong",serif;-webkit-text-size-adjust:100%}
a{color:var(--gold2)}
#stage{position:fixed;inset:0;width:100vw;height:100vh;height:100dvh;z-index:0;touch-action:pan-y;display:block}
#hud{position:fixed;top:8px;right:8px;z-index:5;display:flex;gap:6px}
#hud button{font:inherit;font-size:.8rem;background:rgba(15,30,60,.75);color:var(--gold2);border:1px solid var(--gold);border-radius:99px;padding:4px 12px;cursor:pointer}
#hud button.on{background:var(--gold);color:#132}
#progress{position:fixed;left:0;top:0;height:3px;background:linear-gradient(90deg,var(--gold),#7fb4ff);z-index:6;width:0}
#tag{position:fixed;left:8px;top:8px;z-index:5;font-size:.7rem;color:#cdd6ea;background:rgba(10,16,32,.55);padding:2px 8px;border-radius:6px}
.wrap{position:relative;z-index:2;pointer-events:none}
.intro,.after{pointer-events:auto;background:linear-gradient(180deg,rgba(11,16,32,0) 0,rgba(11,16,32,.92) 22%,rgba(11,16,32,.97));padding:0 18px}
.intro{min-height:100vh;display:flex;flex-direction:column;justify-content:flex-end;padding-bottom:9vh;background:linear-gradient(180deg,rgba(11,16,32,0) 45%,rgba(11,16,32,.9) 80%)}
.intro h1{font-size:2rem;letter-spacing:.18em;margin:.2em 0;color:var(--gold2)}
.intro p{margin:.2em 0;color:#dfe6f4}
.hint{font-size:.85rem;color:#b9c6e2;animation:bob 1.6s infinite}
@keyframes bob{50%{transform:translateY(5px)}}
.step{height:96vh;display:flex;align-items:flex-end;padding:0 10px 4vh}
.card{pointer-events:auto;max-width:560px;margin:0 auto;width:100%;background:rgba(9,16,36,.86);border:1px solid rgba(214,178,90,.55);border-radius:14px;padding:12px 14px;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);box-shadow:0 8px 24px rgba(0,0,0,.4);opacity:.45;transition:opacity .3s}
.step.active .card{opacity:1}
.card h2{margin:0 0 2px;font-size:1.12rem;color:var(--gold2);letter-spacing:.06em}
.card .no{font-size:.75rem;color:#9fb3d8}
.poem{color:#ffd9a8;font-style:italic;margin:.2em 0}
.f{font-family:"Cambria Math","STIX Two Math","Times New Roman",serif;background:rgba(214,178,90,.12);border-left:3px solid var(--gold);padding:4px 8px;margin:5px 0;border-radius:4px;font-size:.92rem;word-break:break-word}
.est{font-size:.72rem;color:#9fc0ff}
.todo{color:#ffb070;font-weight:bold}
.note{font-size:.8rem;color:#b8c3da}
.after{padding-top:40px;padding-bottom:60px}
.after h2{color:var(--gold2)}
.after ol li{font-size:.84rem;margin:4px 0;word-break:break-all}
.disc{border:1px dashed var(--gold);border-radius:10px;padding:10px;font-size:.86rem;background:rgba(40,30,10,.35)}
#nogl{display:none;position:fixed;inset:0;z-index:1;padding:30vh 24px 0;text-align:center;color:#dfe6f4;background:#0b1020}
sup{font-size:.65em;color:var(--gold2)}
table{border-collapse:collapse;width:100%;font-size:.84rem}td,th{border-bottom:1px solid #2a3556;padding:4px;text-align:left}
.step{height:80vh;padding:0}
.step .card{display:none}
#cap{position:fixed;left:8px;right:8px;bottom:calc(8px + env(safe-area-inset-bottom));z-index:4;max-height:40vh;overflow:auto;opacity:0;transition:opacity .35s;pointer-events:auto;margin:0 auto;max-width:560px}
#cap.show{opacity:1}
#cap .card,#cap{display:block}