/* ============ THE PIT — the concert visualiser page ============ */
html[data-theme="dark"] body[data-page="pit"],body[data-page="pit"]{background:#000}
body[data-page="pit"] .living-bg,body[data-page="pit"] .flash-bg,body[data-page="pit"] #cursorFx{display:none !important}
.pit-stage{position:fixed;inset:var(--nav-h,60px) 0 0 0;background:#000;overflow:hidden;cursor:crosshair}
.pit-stage canvas{display:block;width:100%;height:100%}
.pit-stage:fullscreen{inset:0}

/* the door in: user gesture for fullscreen and the mic, and the strobe warning */
.pit-door{position:absolute;inset:0;z-index:5;display:grid;place-items:center;text-align:center;background:radial-gradient(60% 50% at 50% 40%,rgba(141,242,80,.10),transparent 70%),#000;padding:1.5rem}
.pit-door[hidden]{display:none}
.pit-door .k{font-family:var(--font-mono);font-size:.72rem;letter-spacing:.22em;text-transform:uppercase;color:#8DF250;margin:0 0 .6rem}
.pit-door h1{font-family:var(--font-display);font-weight:800;font-size:clamp(2.6rem,7vw,5.4rem);letter-spacing:-.03em;line-height:.95;margin:0 0 .8rem;color:#EEF3E9}
.pit-door p{color:#C3CAD5;max-width:44ch;margin:0 auto 1.2rem;line-height:1.6}
.pit-door .warn{font-family:var(--font-mono);font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:#D8B36A;margin-bottom:1.2rem}
.pit-door .btn{min-height:52px;padding:.8rem 1.6rem;font-size:1rem}
.pit-door .row{display:flex;gap:.6rem;justify-content:center;flex-wrap:wrap}

/* the desk */
.pit-hud{position:absolute;left:0;right:0;bottom:0;z-index:4;display:flex;align-items:center;justify-content:space-between;gap:.6rem;padding:.8rem 1rem;background:linear-gradient(to top,rgba(0,0,0,.72),transparent);transition:opacity .4s,transform .4s}
.pit-hud.idle{opacity:0;transform:translateY(8px);pointer-events:none}
.pit-hud.hidden{display:none}
.pit-hud .grp{display:flex;align-items:center;gap:.4rem;flex-wrap:wrap}
.pit-btn{min-height:40px;padding:.45rem .9rem;border-radius:99px;border:1px solid rgba(238,243,233,.22);background:rgba(6,8,16,.55);color:#EEF3E9;font-family:var(--font-mono);font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;cursor:pointer;backdrop-filter:blur(8px)}
.pit-btn:hover{border-color:#8DF250;color:#8DF250}
.pit-btn.on{background:#8DF250;color:#060810;border-color:#8DF250}
.pit-btn.big{min-height:48px;padding:.6rem 1.3rem;font-weight:600}
.pit-bpm{display:flex;align-items:center;gap:.5rem;font-family:var(--font-mono);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:#C3CAD5}
.pit-bpm b{font-family:var(--font-display);font-weight:800;font-size:1.6rem;color:#8DF250;letter-spacing:-.02em}
.pit-dots{display:flex;gap:.3rem}
.pit-dot{width:8px;height:8px;border-radius:50%;background:rgba(238,243,233,.22)}
.pit-dot.on{background:#8DF250;box-shadow:0 0 12px #8DF250}
.pit-note{position:absolute;left:0;right:0;top:.8rem;z-index:4;text-align:center;font-family:var(--font-mono);font-size:.69rem;letter-spacing:.12em;text-transform:uppercase;color:rgba(238,243,233,.6);pointer-events:none}
.pit-keys{position:absolute;right:1rem;top:.8rem;z-index:4;font-family:var(--font-mono);font-size:.69rem;letter-spacing:.08em;color:rgba(238,243,233,.45);text-align:right;line-height:1.7;pointer-events:none}
@media(max-width:760px){.pit-keys{display:none}.pit-hud{flex-direction:column;align-items:stretch}.pit-hud .grp{justify-content:center}}
@media(prefers-reduced-motion:reduce){.pit-hud{transition:none}}