:root{color:#202427;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;--ink:#202427;--muted:#697074;--line:#d7d3c8;--paper:#fffcf4;--teal:#008c8c;--teal-deep:#006f70;--coral:#e65346;--mint:#cdeee4;--gold:#f3cb45;--shadow:0 22px 60px #2024271f;background:#f6f5f1;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}body{min-width:320px;min-height:100vh;margin:0}button,input{font:inherit}button{cursor:pointer}.app-shell{background:radial-gradient(circle at 15% 15%,#008c8c21,#0000 28%),radial-gradient(circle at 88% 8%,#e653461f,#0000 26%),linear-gradient(135deg,#f8f6ef 0%,#ecf6f2 100%);min-height:100vh;padding:24px}.practice-panel{width:min(1440px,100%);min-height:calc(100vh - 48px);box-shadow:var(--shadow);background:#fffcf4d6;border:1px solid #20242714;border-radius:8px;margin:0 auto;padding:24px}.topbar{justify-content:space-between;align-items:flex-start;gap:18px;padding-bottom:22px;display:flex}.eyebrow{color:var(--teal-deep);letter-spacing:.08em;text-transform:uppercase;margin:0 0 8px;font-size:.78rem;font-weight:800}h1,h2,p{margin-top:0}h1{max-width:720px;color:var(--ink);letter-spacing:0;margin-bottom:0;font-size:clamp(2rem,4.3vw,4.4rem);line-height:.98}h2{margin-bottom:10px;font-size:clamp(2rem,4vw,3.6rem);line-height:.95}.progress-chip,.level-pill{white-space:nowrap;border-radius:999px;align-items:center;gap:8px;font-weight:800;display:inline-flex}.progress-chip{color:#fff;background:#202427;padding:12px 14px}.level-pill{background:var(--mint);color:#0d5f61;text-transform:uppercase;padding:8px 11px;font-size:.76rem}.workspace{grid-template-columns:minmax(190px,250px) minmax(0,1fr) minmax(260px,330px);gap:18px;min-height:660px;display:grid}.drill-list,.coach-panel{flex-direction:column;gap:12px;display:flex}.section-heading{color:var(--muted);text-transform:uppercase;align-items:center;gap:8px;font-size:.86rem;font-weight:800;display:flex}.drill-card{border:1px solid var(--line);width:100%;color:var(--ink);text-align:left;background:#ffffffa3;border-radius:8px;padding:16px;transition:transform .16s,border-color .16s,background .16s}.drill-card:hover,.drill-card:focus-visible{border-color:var(--teal);outline:none;transform:translateY(-2px)}.drill-card.selected{border-color:var(--ink);background:#fff}.drill-card strong,.drill-card span{display:block}.drill-card strong{margin:9px 0 4px;font-size:1.08rem}.drill-card>span:last-child{color:var(--muted);line-height:1.35}.drill-topline{color:var(--teal-deep);text-transform:uppercase;justify-content:space-between;align-items:center;font-size:.75rem;font-weight:800;display:flex}.studio,.coach-panel,.drill-list{min-width:0}.studio{border:1px solid var(--line);background:#fffdf8;border-radius:8px;grid-template-rows:auto minmax(360px,1fr) auto;gap:16px;padding:24px;display:grid;overflow:hidden}.studio-copy p{max-width:650px;color:var(--muted);margin-bottom:0;font-size:1.05rem;line-height:1.55}.floor-wrap{place-items:center;min-height:410px;display:grid}.floor{aspect-ratio:1;background-color:#eef8f4;background-image:linear-gradient(90deg,#20242714 1px,#0000 1px),linear-gradient(#20242714 1px,#0000 1px),none;background-position:0 0,0 0,0 0;background-repeat:repeat,repeat,repeat;background-size:25% 25%;background-attachment:scroll,scroll,scroll;background-origin:padding-box,padding-box,padding-box;background-clip:border-box,border-box,border-box;border:2px solid #2b3033;border-radius:8px;width:min(590px,100%);position:relative;overflow:hidden}.floor:before,.floor:after{content:"";background:#2024275c;width:80%;height:2px;position:absolute;inset:50% auto auto 50%;transform:translate(-50%,-50%)}.floor:after{width:2px;height:80%}.floor.mirror,.floor.mirror .count-badge,.floor.mirror .direction-mark,.floor.mirror .foot span{transform:scaleX(-1)}.beat-ring{border:2px dashed #e6534673;border-radius:50%;position:absolute;inset:25%}.direction-mark{z-index:1;width:36px;height:36px;color:var(--teal-deep);background:#fff;border-radius:999px;place-items:center;display:grid;position:absolute;box-shadow:0 8px 24px #2024271f}.direction-mark.forward{top:16px;left:50%;transform:translate(-50%)}.direction-mark.left{top:50%;left:16px;transform:translateY(-50%)}.direction-mark.right{top:50%;right:16px;transform:translateY(-50%)}.direction-mark.back{bottom:16px;left:50%;transform:translate(-50%)}.foot{z-index:3;background:#fff;border:2px solid #202427;border-radius:48% 48% 42% 42%;place-items:center;width:clamp(58px,11vw,82px);height:clamp(92px,16vw,126px);transition:left .26s,top .26s,background .16s,transform .16s;display:grid;position:absolute;transform:translate(-50%,-50%)rotate(0);box-shadow:0 14px 22px #20242729}.foot.left{transform:translate(-50%,-50%)rotate(-5deg)}.foot.right{transform:translate(-50%,-50%)rotate(5deg)}.foot.active{background:var(--gold);transform:translate(-50%,-55%)scale(1.04)}.foot span{color:#fff;background:#202427;border-radius:999px;place-items:center;width:32px;height:32px;font-weight:900;display:grid}.count-badge{z-index:4;background:#fff;border:2px solid #202427;border-radius:999px;place-items:center;width:118px;height:118px;display:grid;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 18px 36px #20242724}.count-badge span{color:var(--muted);text-transform:uppercase;font-size:.76rem;font-weight:800}.count-badge strong{color:var(--coral);margin-top:-26px;font-size:3.8rem;line-height:1}.cue-strip{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;display:grid}.cue-card{border:1px solid var(--line);background:#fff;border-radius:8px;gap:6px;min-height:108px;padding:14px;display:grid}.cue-card svg{color:var(--coral)}.cue-card span{color:var(--muted);text-transform:uppercase;font-size:.78rem;font-weight:800}.cue-card strong{font-size:1.03rem;line-height:1.25}.coach-panel{border:1px solid var(--line);background:#fff;border-radius:8px;padding:18px}.controls{grid-template-columns:1fr auto;gap:10px;display:grid}.primary-action,.icon-action,.toggle,.complete-action{border:1px solid #202427;border-radius:8px;justify-content:center;align-items:center;gap:8px;min-height:46px;font-weight:900;display:inline-flex}.primary-action,.complete-action{color:#fff;background:#202427}.icon-action,.toggle{color:var(--ink);background:#fff}.bpm-control{border:1px solid var(--line);background:#fffaf0;border-radius:8px;gap:12px;padding:16px;display:grid}.bpm-control span{color:var(--muted);text-transform:uppercase;align-items:center;gap:8px;font-size:.86rem;font-weight:800;display:flex}.bpm-control strong{font-size:1.5rem}.bpm-control input{width:100%;accent-color:var(--teal)}.toggle-grid{grid-template-columns:1fr 1fr;gap:10px;display:grid}.toggle.active{border-color:var(--teal-deep);background:var(--mint)}.coach-block{border:1px solid var(--line);background:#f8fbf8;border-radius:8px;gap:12px;padding:16px;display:grid}.coach-block ul{color:var(--muted);gap:10px;margin:0;padding-left:19px;line-height:1.45;display:grid}.complete-action{width:100%;margin-top:auto}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;padding:0;position:absolute;overflow:hidden}@media (width<=1080px){.workspace{grid-template-columns:1fr 1fr}.studio{order:-1;grid-column:1/-1}}@media (width<=760px){.app-shell{padding:10px}.practice-panel{min-height:calc(100vh - 20px);padding:16px}.topbar{flex-direction:column}h1{font-size:2.5rem}.workspace,.cue-strip{grid-template-columns:1fr}.studio{padding:16px}.floor-wrap{min-height:320px}.drill-list{grid-template-columns:1fr;display:grid}}