:root{--void: #030304;--signal: #e9e6dd;--dim: #5c6070;--glow: #ffcf8a;--neon: #ff8a2a;--neon-hi: #ffe6bf;--line: rgba(160, 120, 106, .35);--mono: "Roboto Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;color-scheme:dark}*{box-sizing:border-box}html,body{margin:0;background:var(--void);color:var(--signal)}body{font-family:var(--mono);font-weight:300;font-size:14px;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));-webkit-font-smoothing:antialiased}button{font:inherit}#track{height:2400vh}.stage{position:fixed;top:0;right:0;bottom:0;left:0;overflow:hidden}canvas{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;display:block}.hud{position:fixed;left:0;right:0;z-index:5;display:flex;justify-content:space-between;gap:12px;padding-left:max(20px,env(safe-area-inset-left,0px));padding-right:max(20px,env(safe-area-inset-right,0px));font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--dim);pointer-events:none}.hud.top{top:calc(env(safe-area-inset-top,0px) + 20px);align-items:flex-start}.hud.bottom{bottom:calc(env(safe-area-inset-bottom,0px) + 20px);align-items:flex-end;flex-wrap:wrap;row-gap:14px}.brand{display:flex;flex-direction:column;gap:8px}.mark{color:var(--signal);letter-spacing:.6em;font-weight:500;font-size:13px}.slogan{font-size:10px;letter-spacing:.22em;text-transform:none;color:var(--glow)}.navcol{display:flex;flex-direction:column;gap:10px;min-width:0}.nav{display:flex;flex-direction:column;gap:4px;font-size:10px;letter-spacing:.14em;color:var(--glow);font-variant-numeric:tabular-nums}.nav b{font-weight:400;color:var(--dim);margin-right:10px}.hint{opacity:.9}.rightcol{display:flex;flex-direction:column;align-items:flex-end;gap:10px}.apbtn{pointer-events:auto;font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--dim);background:none;border:1px solid var(--line);padding:7px 12px;cursor:pointer;transition:color .3s,border-color .3s,box-shadow .3s,background .3s}.apbtn:hover{color:var(--signal)}.apbtn.on{color:var(--void);background:var(--glow);border-color:var(--glow);box-shadow:0 0 14px #ffbe6e73}.apbtn.warp-on{background:var(--neon-hi);color:#1a0800;border-color:var(--neon-hi);box-shadow:0 0 16px var(--neon),0 0 34px #ff8a2a80}.idxbtn{pointer-events:auto;font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:var(--glow);background:none;border:0;padding:6px 0;cursor:pointer}.idxbtn:hover{color:var(--signal)}:is(.apbtn,.idxbtn,.btn,.win,.idxlist button):focus-visible{outline:1px solid var(--signal);outline-offset:3px}.win{position:absolute;left:0;top:0;width:220px;transform-origin:0 0;border:0;background:#080610d1;padding:14px 14px 12px;display:flex;flex-direction:column;gap:10px;cursor:pointer;color:inherit;text-align:left;opacity:0;will-change:transform,opacity}.win .id{font-size:9px;letter-spacing:.24em;color:#b9bdd0;text-transform:uppercase}.win .co{font-size:9px;letter-spacing:.12em;line-height:1.6;color:var(--glow);white-space:pre;font-variant-numeric:tabular-nums;opacity:.85}.win .ln{font-size:15px;line-height:1.3;color:var(--signal);font-weight:400}.win .st{font-size:9px;letter-spacing:.2em;text-transform:uppercase;color:var(--glow)}.win.sealed{cursor:default}.win.sealed .ln{color:#c9cfe6}.end{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);text-align:center;pointer-events:none;width:min(90vw,520px)}.end p{font-size:clamp(18px,3.8vw,28px);letter-spacing:.2em;text-transform:uppercase;margin:0;font-weight:400;text-wrap:balance}.end small{display:block;margin-top:16px;letter-spacing:.14em;font-size:11px;color:var(--glow);line-height:1.7}.end .warpgo{margin-top:22px;background:none;color:var(--neon-hi);border:1px solid var(--neon);box-shadow:0 0 18px #ff8a2a73,inset 0 0 12px #ff8a2a33;text-shadow:0 0 8px var(--neon)}.end .warpgo:hover{background:#ff8a2a26}.drum{position:fixed;top:50%;transform:translateY(-50%);right:max(16px,env(safe-area-inset-right,0px));width:130px;height:min(62vh,460px);z-index:6;pointer-events:none;-webkit-mask-image:linear-gradient(transparent,#000 22%,#000 78%,transparent);mask-image:linear-gradient(transparent,#000 22%,#000 78%,transparent)}.drum .track{position:absolute;left:16px;top:0;bottom:0;width:2px;background:linear-gradient(transparent,var(--neon) 30%,var(--neon) 70%,transparent);box-shadow:0 0 10px var(--neon),0 0 22px #ff8a2a80}.drum .tk{position:absolute;left:22px;top:50%;width:10px;height:1px;background:var(--neon);box-shadow:0 0 6px var(--neon);transform-origin:left center}.drum .yr{position:absolute;left:38px;top:50%;font-size:26px;font-weight:300;line-height:1;letter-spacing:.06em;color:var(--neon);transform-origin:left center;white-space:nowrap;font-variant-numeric:tabular-nums;text-shadow:0 0 6px rgba(255,138,42,.9),0 0 18px rgba(255,138,42,.5)}.drum .now{position:absolute;left:38px;top:50%;transform:translateY(-50%);font-size:32px;font-weight:400;line-height:1;letter-spacing:.06em;color:var(--neon-hi);white-space:nowrap;font-variant-numeric:tabular-nums;text-shadow:0 0 8px #ffb35c,0 0 22px var(--neon),0 0 44px rgba(255,138,42,.6)}.drum .ptr{position:absolute;left:0;top:50%;transform:translateY(-50%);width:0;height:0;border-left:11px solid var(--neon-hi);border-top:7px solid transparent;border-bottom:7px solid transparent;filter:drop-shadow(0 0 6px var(--neon)) drop-shadow(0 0 14px var(--neon))}.drum .ptr:after{content:"";position:absolute;left:4px;top:-1px;width:26px;height:2px;background:var(--neon-hi);box-shadow:0 0 8px var(--neon)}.veil{position:fixed;top:0;right:0;bottom:0;left:0;background:#030304f2;z-index:20;display:flex;align-items:center;justify-content:center;overflow-y:auto;padding:calc(env(safe-area-inset-top,0px) + 24px) max(20px,env(safe-area-inset-right,0px)) calc(env(safe-area-inset-bottom,0px) + 24px) max(20px,env(safe-area-inset-left,0px))}.panel{width:min(100%,520px);display:flex;flex-direction:column;gap:24px;margin:auto}.panel .id{font-size:10px;letter-spacing:.3em;text-transform:uppercase;color:var(--dim);display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}.poem{font-size:clamp(17px,3.6vw,22px);line-height:1.7;margin:0;white-space:pre-line;font-weight:400}.meta{font-size:11px;letter-spacing:.12em;color:var(--dim);line-height:1.7;border-top:1px solid var(--line);padding-top:16px}.actions{display:flex;gap:12px;flex-wrap:wrap;align-items:center}.btn{font-size:11px;letter-spacing:.3em;text-transform:uppercase;padding:14px 22px;background:var(--signal);color:var(--void);border:0;cursor:pointer}.btn:disabled{opacity:.5;cursor:wait}.btn.ghost{background:transparent;color:var(--dim);border:1px solid var(--line)}.btn.ghost:hover{color:var(--signal)}.idxlist{display:flex;flex-direction:column;gap:4px}.idxlist button{font-size:clamp(18px,4vw,26px);letter-spacing:.3em;text-transform:uppercase;text-align:left;color:var(--signal);background:none;border:0;border-bottom:1px solid var(--line);padding:14px 0;cursor:pointer}.idxlist button:hover{color:var(--glow)}.sect{display:flex;flex-direction:column;gap:14px;max-height:55vh;overflow-y:auto;max-width:62ch}.sect p{margin:0;font-size:13px;line-height:1.8}.sect .draft{font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--glow)}.order{display:flex;flex-direction:column;gap:14px}.formlead{margin:0 0 4px;font-size:15px;letter-spacing:.06em}.order label{display:flex;flex-direction:column;gap:6px;font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:var(--dim);min-width:0}.order input:not([type=checkbox]){font:inherit;font-size:14px;letter-spacing:.04em;color:var(--signal);background:#ffffff08;border:0;border-bottom:1px solid var(--line);padding:10px 2px;outline:none;width:100%}.order input:focus{border-bottom-color:var(--glow)}.order small{text-transform:none;letter-spacing:.06em;font-size:11px;color:var(--dim)}.order .row{display:grid;grid-template-columns:1fr 2fr;gap:14px}.order .check{flex-direction:row;align-items:flex-start;gap:12px;text-transform:none;letter-spacing:.04em;font-size:12px;line-height:1.6;color:var(--signal);cursor:pointer}.order .check input{margin-top:3px;accent-color:var(--neon);width:16px;height:16px;flex:none}.err{margin:0;font-size:12px;color:#ff9a7a;line-height:1.6}@media (max-width: 560px){.hud.top{top:calc(env(safe-area-inset-top,0px) + 16px)}.mark{font-size:12px;letter-spacing:.5em}.slogan{font-size:9px;letter-spacing:.16em}.hud.bottom{flex-direction:column;align-items:stretch;gap:12px;bottom:calc(env(safe-area-inset-bottom,0px) + 14px)}.nav{font-size:9px;letter-spacing:.1em;gap:3px}.nav b{margin-right:6px}.hint{display:none}.rightcol{flex-direction:row;align-items:center;justify-content:space-between;gap:8px;width:100%}.apbtn{font-size:9px;letter-spacing:.14em;padding:8px 9px}.idxbtn{font-size:9px;letter-spacing:.22em;padding:8px 0}.drum{width:82px;height:min(44vh,320px);right:0}.drum .track{left:10px}.drum .tk{left:14px;width:7px}.drum .ptr{border-left-width:8px;border-top-width:5px;border-bottom-width:5px}.drum .ptr:after{width:16px;left:3px}.drum .yr,.drum .now{left:24px}.drum .yr{font-size:13px}.drum .now{font-size:17px}.end{left:calc(50% - 38px);width:calc(100vw - 120px)}.end p{font-size:20px}.end small{font-size:10px;letter-spacing:.08em}.end .warpgo{padding:12px 16px;font-size:10px;letter-spacing:.22em}.win{width:200px;padding:12px 12px 10px;gap:8px}.order .row{grid-template-columns:1fr}}@media (prefers-reduced-motion: reduce){*{scroll-behavior:auto!important}}
