:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--ink:#f7eee4;--dim:#f7eee4ad;--faint:#f7eee43b;--veil:#0c0c0d57;--card:#1412115c;--paper-dark:#11100f;--rust:#c06b4d;--sage:#93aa8d;--gold:#c8ad62}*{box-sizing:border-box}html,body,#app{background:var(--paper-dark);min-height:100%;color:var(--ink);margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;overflow:hidden}button{color:inherit;font:inherit}#app{position:fixed;inset:0}#camera,#landmarks{object-fit:cover;width:100%;height:100%;position:absolute;inset:0;transform:scaleX(-1)}#camera{filter:contrast(1.04)saturate(.9)brightness(.72)}#landmarks{pointer-events:none}.start-card[hidden]{display:none}.start-card{z-index:10;color:#1c1410;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none;background:#faf7f2;border:none;border-radius:0;place-content:end start;padding:clamp(28px,6vw,88px) clamp(24px,6vw,96px) clamp(36px,8vh,88px);font-family:Inter,ui-sans-serif,system-ui,sans-serif;display:grid;position:fixed;inset:0;overflow:hidden}.start-card:before{content:"";pointer-events:none;border:1px solid #1c141024;position:absolute;inset:clamp(14px,2vw,30px)}.start-card-inner{max-width:min(560px,100vw - 64px);position:relative}.kicker,.eyebrow,.guide-kicker{color:var(--rust);margin:0 0 5px;font-family:Georgia,Times New Roman,serif;font-size:1.1rem;font-style:italic}.start-card .kicker{color:#b35a3e;letter-spacing:.01em;margin-bottom:14px}h1,h2,h3{letter-spacing:0;margin:0;font-family:Georgia,Times New Roman,serif;font-weight:500}.start-card h1{color:#1a110a;margin:0 0 28px;font-size:clamp(3.4rem,11vw,8.2rem);line-height:.86}.start-flourish{color:#b35a3e;margin-left:.08em;display:inline-block;transform:translateY(-.05em)}.start-card .lede{color:#1c1410c7;max-width:32ch;margin:0 0 30px;font-size:clamp(1rem,1.2vw,1.08rem);line-height:1.5}.start-card p{line-height:1.55}.begin,.mute{border:1px solid var(--ink);cursor:pointer;background:#f7eee414;border-radius:999px;min-height:42px;padding:9px 16px}.start-card .begin{color:#faf7f2;letter-spacing:.01em;background:#1a110a;border:1px solid #1a110a;border-radius:2px;min-width:0;margin-top:4px;padding:12px 26px 13px;font-family:Georgia,Times New Roman,serif;font-size:1.05rem;font-style:italic;transition:transform .18s cubic-bezier(.2,.7,.2,1),box-shadow .18s cubic-bezier(.2,.7,.2,1);box-shadow:4px 4px #b35a3e38}.start-card .begin:hover{transform:translate(-1px,-1px);box-shadow:6px 6px #b35a3e47}.start-card .small{color:#1c141080;margin:26px 0 0;font-size:.88rem;font-style:italic}.small{font-size:.88rem}.hud{pointer-events:none;position:absolute;inset:0}.topline{text-align:left;width:min(360px,100vw - 200px);position:absolute;top:28px;left:clamp(20px,3.5vw,44px)}.topline>div{flex-direction:column;gap:2px;display:flex}.eyebrow{letter-spacing:.02em;margin-bottom:2px}#chord-label{width:max-content;max-width:100%;font-size:clamp(2.4rem,5.8vw,5rem);line-height:.88;display:inline-block;position:relative}#chord-label:after{content:"";background:var(--rust);opacity:.55;border-radius:2px;height:2px;position:absolute;bottom:-6px;left:2%;right:8%;transform:rotate(-.7deg)}#reason-label{color:var(--dim);max-width:32ch;margin:14px 0 0;font-size:.88rem;font-style:italic}.mute{position:absolute;top:30px;right:clamp(20px,3.5vw,44px)}.mute,.help,.debug-toggle{pointer-events:auto}.mute[aria-pressed=true]{background:var(--rust);border-color:var(--rust);color:#160d09}.circle{color:#f7eee461;letter-spacing:.02em;background:0 0;border:none;gap:clamp(10px,2vw,22px);padding:0;font-family:Georgia,Times New Roman,serif;font-size:clamp(.88rem,1.5vw,1.1rem);display:flex;position:absolute;top:128px;left:50%;transform:translate(-50%)}.circle span{text-align:center;min-width:1.7ch;transition:color .22s cubic-bezier(.2,.7,.2,1),transform .22s cubic-bezier(.2,.7,.2,1)}.circle .active{color:var(--rust);font-style:italic;transform:translateY(-3px)rotate(-2deg)}.side-guide{width:min(190px,19vw);box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none;background:0 0;border:none;border-radius:0;padding:0;font-size:.86rem;position:absolute;top:170px}.left-guide{left:clamp(20px,3.5vw,44px)}.right-guide{text-align:right;right:clamp(20px,3.5vw,44px)}.guide-kicker{letter-spacing:.01em;font-size:.95rem}.side-guide h3{color:var(--ink);margin-bottom:14px;font-size:clamp(1.25rem,1.8vw,1.65rem);line-height:.95}dl{gap:5px;margin:0;display:grid}dl div{grid-template-columns:54px 1fr;align-items:baseline;gap:12px;display:grid}.right-guide dl div{grid-template-columns:1fr 54px}.right-guide dt{order:2;justify-self:end}.right-guide dd{text-align:right;order:1}dt{color:var(--dim);background:0 0;justify-self:start;padding:0;font-size:.84rem;font-style:italic;line-height:1.2}dd{color:var(--ink);margin:0;font-family:Georgia,Times New Roman,serif;font-size:1rem}.guide-note{color:var(--dim);margin:16px 0 4px;font-size:.8rem;font-style:italic}.levels{color:var(--rust);gap:12px;margin:0;font-size:.82rem;display:flex}.right-guide .guide-note,.right-guide .levels{justify-content:flex-end}.meters{-webkit-backdrop-filter:none;backdrop-filter:none;background:0 0;border:none;gap:8px;width:min(360px,100vw - 60px);padding:0;display:grid;position:absolute;bottom:22px;left:50%;transform:translate(-50%)}.meters label{color:var(--dim);letter-spacing:.01em;grid-template-columns:68px 1fr;align-items:center;gap:12px;font-size:.78rem;font-style:italic;display:grid}meter{appearance:none;background:#f7eee41f;border:none;border-radius:999px;width:100%;height:3px;overflow:hidden}meter::-webkit-meter-bar{background:#f7eee41f;border:none;border-radius:999px}meter::-webkit-meter-optimum-value{background:var(--rust);border-radius:999px}meter::-moz-meter-bar{background:var(--rust);border-radius:999px}.help{width:min(310px,100vw - 36px);color:var(--dim);font-size:.9rem;position:absolute;bottom:18px;right:20px}.help summary{cursor:pointer;color:var(--ink)}.debug-toggle{color:var(--dim);font-size:.9rem;position:absolute;bottom:18px;left:20px}.debug-panel{border:1px solid var(--faint);color:#cfe3c8;pointer-events:auto;background:#000000ad;width:min(420px,100vw - 36px);max-height:30vh;padding:12px;font-size:.78rem;position:absolute;bottom:52px;left:18px;overflow:auto}.status{color:#f7eee48a;background:#0000003d;border-radius:999px;padding:3px 8px;font-size:.76rem;position:absolute;top:14px;left:16px}@media (width<=880px){.side-guide{width:min(190px,42vw);font-size:.8rem;top:auto;bottom:74px}.side-guide h3{font-size:1.35rem}dl div{grid-template-columns:58px 1fr}.help{display:none}}@media (width<=620px){.side-guide{display:none}.circle{top:118px}}