.xp{background-color:var(--ink);min-height:100svh;position:relative;overflow-x:clip}.xp-bar{z-index:20;height:var(--nav-h);padding:0 var(--gutter);background-color:var(--ink);border-bottom:1px solid var(--ink-line);align-items:center;gap:1rem;display:flex;position:fixed;top:0;left:0;right:0}.xp-mark{color:var(--red);font-size:1.5rem}.xp-title{white-space:nowrap;text-overflow:ellipsis;min-width:0;color:var(--on-ink-muted);flex-shrink:1;overflow:hidden}.xp-rail{flex:auto;justify-content:center;align-items:center;gap:.75rem;min-width:0;display:flex}.xp-rail ol{align-items:center;display:flex}.xp-rail a{padding:.75rem .2rem;display:block}.xp-rail a:before{content:"";background-color:var(--ink-line);width:14px;height:2px;transition:background-color .2s;display:block}.xp-rail li[data-active=true] a:before{background-color:var(--red)}@media (hover:hover){.xp-rail a:hover:before{background-color:var(--on-ink)}}.xp-rail-now{white-space:nowrap;text-overflow:ellipsis;min-width:0;color:var(--accent-text);overflow:hidden}.xp-bar-actions{flex-shrink:0;align-items:center;gap:.25rem;display:flex}.xp-bar-button{min-height:36px;color:var(--on-ink-muted);cursor:pointer;background:0 0;border:0;align-items:center;padding:0 .6rem;display:inline-flex}@media (hover:hover){.xp-bar-button:hover{color:var(--accent-text)}}.xp-bar-button[aria-pressed=true]{color:var(--accent-text)}.xp-stats{z-index:21;top:calc(var(--nav-h) + .5rem);right:var(--gutter);background-color:var(--ink-raised);border:1px solid var(--ink-line);gap:.25rem;min-width:13rem;padding:.75rem;display:grid;position:fixed}.xp-stats>div{justify-content:space-between;gap:1rem;display:flex}.xp-stats dt{color:var(--on-ink-muted)}.xp-stage{display:none}.xp-track{padding-top:var(--nav-h);position:relative}.xp-beat{padding:clamp(40px, 8vw, 96px) var(--gutter);scroll-margin-top:var(--nav-h);border-bottom:1px solid var(--ink-line)}.xp-card{max-width:46rem}.xp-kicker{color:var(--accent-text)}.xp-headline{color:var(--red);margin-top:.6rem;font-size:clamp(2.5rem,6vw,4.25rem)}.xp-headline .serif-accent{color:var(--on-ink)}.xp-body{flex-direction:column;gap:.6rem;margin-top:.9rem;line-height:1.4;display:flex}.xp-note{color:var(--on-ink-muted);margin-top:.9rem;font-size:.86em;line-height:1.35}.xp-controls{flex-wrap:wrap;gap:.5rem;margin-top:1rem;display:flex}.xp-controls .button{min-height:46px;padding:0 1rem;font-size:.72rem}.xp-lite{max-width:46rem;margin-top:1.5rem}.xp-fields{flex:100%;gap:.6rem;display:grid}.xp-field{gap:.25rem;display:grid}.xp-field span{color:var(--on-ink-muted)}.xp-field input,.xp-field select{width:100%;min-height:46px;font-family:var(--mono);color:var(--on-ink);background-color:var(--ink);border:1px solid var(--ink-line);border-radius:0;padding:0 .75rem;font-size:1rem}.xp-field input:focus{outline:2px solid var(--accent-text);outline-offset:0;border-color:#0000}.xp-hud{z-index:5;padding:.75rem var(--gutter);color:var(--on-ink-muted);background-color:var(--ink-raised);border-top:1px solid var(--ink-line);text-transform:none;position:sticky;bottom:0}.xp-log{gap:.15rem;display:grid}.xp-log li{overflow-wrap:anywhere}.xp-log li:last-child{color:var(--on-ink)}.xp-log li[data-tone=bad]{color:var(--accent-text)}.xp-log li[data-tone=data]{color:var(--on-ink)}.xp-end{z-index:2;padding:clamp(48px, 8vw, 96px) var(--gutter);background-color:var(--ink);border-top:2px solid var(--red);position:relative}.xp-end-links{flex-wrap:wrap;gap:.5rem 1.5rem;margin-top:1.25rem;display:flex}:root[data-stack="3d"] .xp-stage{z-index:0;background-color:var(--ink);height:100svh;display:block;position:sticky;top:0;overflow:hidden}:root[data-stack="3d"] .xp-stage canvas{opacity:0;transition:opacity .5s}:root[data-stack="3d"] .xp-stage[data-ready=true] canvas{opacity:1}:root[data-stack="3d"] .xp-track{z-index:1;pointer-events:none;margin-top:-100svh;padding-top:0}:root[data-stack="3d"] .xp-lite{display:none}:root[data-stack="3d"] .xp-beat{min-height:var(--beat-h,120svh);border-bottom:0;padding:0}:root[data-stack="3d"] .xp-card{top:calc(var(--nav-h) + .75rem);width:min(27rem,32vw);max-height:calc(100svh - var(--nav-h) - 1.5rem);margin-left:var(--gutter);background-color:var(--ink);border:1px solid var(--ink-line);border-top:2px solid var(--red);pointer-events:auto;scrollbar-width:thin;padding:1.1rem 1.25rem 1.25rem;position:sticky;overflow-y:auto}:root[data-stack="3d"] .xp-headline{font-size:clamp(2rem,3.6vw,3.5rem)}:root[data-stack="3d"] .xp-body{font-size:.95em}:root[data-stack="3d"] .xp-hud{top:calc(var(--nav-h) + .75rem);right:var(--gutter);background-color:var(--ink);border:1px solid var(--ink-line);pointer-events:none;width:min(25rem,30vw);padding:.6rem .75rem;position:fixed;bottom:auto}@media (max-width:759px),(orientation:portrait){.xp-title{display:none}.xp-rail{justify-content:flex-start}.xp-rail ol{display:none}.xp-rail-now{font-size:.66rem}.xp-bar-actions{gap:0}.xp-bar-button{padding:0 .4rem;font-size:.66rem}:root[data-stack="3d"] .xp-beat{flex-direction:column;justify-content:flex-end;display:flex}:root[data-stack="3d"] .xp-card{width:100%;max-height:42svh;padding:.8rem var(--gutter) max(.9rem, env(safe-area-inset-bottom));border-width:2px 0 0;border-top-color:var(--red);margin-left:0;position:sticky;top:auto;bottom:0}:root[data-stack="3d"] .xp-headline{margin-top:.3rem;font-size:clamp(1.65rem,7vw,2.75rem)}:root[data-stack="3d"] .xp-body{gap:.4rem;margin-top:.5rem;font-size:.92em;line-height:1.3}:root[data-stack="3d"] .xp-controls{margin-top:.6rem}:root[data-stack="3d"] .xp-note{margin-top:.5rem}:root[data-stack="3d"] .xp-hud{top:var(--nav-h);width:auto;padding:.4rem var(--gutter);border-width:0 0 1px;font-size:.66rem;left:0;right:0}:root[data-stack="3d"] .xp-log li:not(:nth-last-child(-n+2)){display:none}}@media (min-width:760px) and (orientation:portrait){:root[data-stack="3d"] .xp-card{max-height:34svh}:root[data-stack="3d"] .xp-log li:not(:nth-last-child(-n+3)){display:none}}@media (max-height:559px) and (orientation:landscape){.xp-title,.xp-rail ol{display:none}:root[data-stack="3d"] .xp-card{width:min(40vw,22rem);padding:.6rem .75rem}:root[data-stack="3d"] .xp-headline{font-size:1.5rem}:root[data-stack="3d"] .xp-body{margin-top:.4rem;font-size:.85em}:root[data-stack="3d"] .xp-hud{width:min(40vw,22rem);padding:.35rem .5rem;font-size:.62rem;top:auto;bottom:.5rem}:root[data-stack="3d"] .xp-log li:not(:last-child){display:none}}@media (min-width:1800px){:root[data-stack="3d"] .xp-card{width:min(32rem,26vw)}:root[data-stack="3d"] .xp-hud{width:min(30rem,24vw)}}