:root{--ink:#171713;--paper:#f3efe4;--paper-deep:#e8e0d1;--accent:#f05a3c;--accent-dark:#a92f1d;--lime:#d6ed67;--muted:#736f65;--line:#17171324;--space-1:.35rem;--space-2:.65rem;--space-3:1rem;--space-4:1.5rem;--space-5:2rem;--radius-sm:.75rem;--radius-md:1.25rem;--radius-lg:2rem;--control-height:3rem;color:var(--ink);font-synthesis:none;background:#cbc4b8;font-family:Inter,ui-sans-serif,system-ui,sans-serif}*{box-sizing:border-box}body{background:radial-gradient(circle at top,#eee7d9 0,#cbc4b8 55rem);min-width:320px;min-height:100vh;margin:0}button,input,select{font:inherit}button,select,input{accent-color:var(--accent)}button:focus-visible,select:focus-visible,input:focus-visible,summary:focus-visible{outline-offset:3px;outline:3px solid #176b87}h1,h2,h3,p{margin:0}.practice-shell{width:min(100%,48rem);min-height:100vh;padding:var(--space-4);background:var(--paper);margin:0 auto;box-shadow:0 0 3rem #17171329}.practice-header,.section-heading{justify-content:space-between;align-items:center;gap:var(--space-3);display:flex}.practice-header{margin-bottom:var(--space-4)}.header-actions{justify-content:flex-end;align-items:center;gap:var(--space-2);flex-wrap:wrap;display:flex}.mode-link{border:1px solid var(--line);min-height:2.75rem;color:var(--ink);background:0 0;border-radius:999px;padding:.55rem .8rem;font-size:.78rem;font-weight:800}.mode-link:disabled{opacity:.45}.eyebrow,.section-label{color:var(--accent-dark);letter-spacing:.14em;text-transform:uppercase;font-size:.72rem;font-weight:800}h1{letter-spacing:-.055em;margin-top:.2rem;font-size:clamp(2rem,10vw,3.7rem);line-height:.95}h1 span{color:var(--paper);background:var(--ink);letter-spacing:.04em;text-transform:uppercase;vertical-align:.25em;border-radius:.28em;padding:.18em .3em;font-size:.48em;display:inline-block}h2{letter-spacing:-.025em;font-size:1.15rem}.live-state{border:1px solid var(--line);color:var(--muted);border-radius:999px;align-items:center;gap:.45rem;padding:.5rem .75rem;font-size:.8rem;font-weight:750;display:flex}.live-state__dot{background:#aaa59b;border-radius:50%;width:.55rem;height:.55rem}.is-playing .live-state__dot{background:var(--accent);box-shadow:0 0 0 .3rem #f05a3c24}.transport-panel{gap:var(--space-3);padding:var(--space-3);border-radius:var(--radius-lg);color:var(--paper);background:var(--ink);grid-template-columns:1fr auto;display:grid}.tempo-block{min-width:0}.tempo-block .section-label{color:#c9c1b5}.tempo-readout{align-items:end;gap:.45rem;margin:.25rem 0 .7rem;display:flex}.tempo-readout strong{letter-spacing:-.08em;font-variant-numeric:tabular-nums;font-size:clamp(3rem,18vw,5.5rem);line-height:.85}.tempo-readout span{color:#c9c1b5;margin-bottom:.35rem;font-size:.75rem;font-weight:800}.tempo-stepper{grid-template-columns:var(--control-height) 1fr var(--control-height);align-items:center;gap:var(--space-2);display:grid}.tempo-stepper button{width:var(--control-height);height:var(--control-height);color:inherit;background:0 0;border:1px solid #ffffff40;border-radius:50%;font-size:1.5rem}.tempo-stepper button:disabled{opacity:.3}.tempo-stepper input{width:100%}.transport-button{width:clamp(7.5rem,30vw,10rem);min-height:9.5rem;color:var(--ink);background:var(--lime);border:0;border-radius:1.45rem;place-content:center;gap:.25rem;font-weight:850;display:grid}.transport-button span{font-size:2rem}.is-playing .transport-button{color:#fff;background:var(--accent)}.transport-button:disabled{opacity:.65}.count-section,.instruments-section,.musical-settings{margin-top:var(--space-5)}.section-heading>span:last-child{color:var(--muted);font-size:.75rem}.count-strip{margin:var(--space-3) 0 0;grid-template-columns:repeat(8,1fr);gap:.25rem;padding:0;list-style:none;display:grid}.count-strip li{aspect-ratio:1;color:var(--muted);font-variant-numeric:tabular-nums;border-radius:50%;place-items:center;font-size:clamp(.9rem,4.5vw,1.2rem);font-weight:750;display:grid}.count-strip li:nth-child(5){margin-left:.15rem}.count-strip li.is-active{color:var(--paper);background:var(--accent);transform:translateY(-.12rem);box-shadow:0 .4rem 1rem #f05a3c4d}.instrument-grid{margin-top:var(--space-3);grid-template-columns:repeat(5,1fr);gap:.55rem;display:grid}.instrument-card{border:1px solid var(--line);border-radius:var(--radius-md);min-width:0;min-height:7.4rem;color:var(--muted);background:0 0;padding:.65rem .35rem;font-size:.75rem;font-weight:800}.instrument-card>span:not(.instrument-mark),.instrument-card small{text-overflow:ellipsis;display:block;overflow:hidden}.instrument-card small{color:inherit;margin-top:.25rem;font-size:.67rem;font-weight:600}.instrument-mark{width:2.75rem;height:2.75rem;color:var(--muted);background:var(--paper-deep);letter-spacing:.05em;border-radius:50%;place-items:center;margin:0 auto .55rem;display:grid}.instrument-card.is-enabled{border-color:var(--ink);color:var(--ink);box-shadow:0 .4rem 0 var(--ink);background:#fff;transform:translateY(-.2rem)}.instrument-card.is-enabled .instrument-mark{color:var(--ink);background:var(--lime)}.musical-settings{gap:var(--space-3);grid-template-columns:1.5fr .8fr;display:grid}.musical-settings>.section-heading{grid-column:1/-1}fieldset,.key-control{min-width:0;padding:var(--space-3);border:1px solid var(--line);border-radius:var(--radius-md);margin:0}legend,.key-control>span{padding:0 .3rem;font-size:.75rem;font-weight:800}.segmented-control{border-radius:var(--radius-sm);background:var(--paper-deep);grid-template-columns:1fr 1fr;gap:.3rem;padding:.3rem;display:grid}.segmented-control button{min-height:2.8rem;color:var(--muted);background:0 0;border:0;border-radius:.55rem;font-size:.78rem;font-weight:800}.segmented-control button.is-selected{color:var(--paper);background:var(--ink)}.setting-note,.key-control small{color:var(--muted);margin-top:.65rem;font-size:.68rem;line-height:1.35;display:block}.key-control{flex-direction:column;display:flex}.key-control select{min-height:var(--control-height);border:1px solid var(--line);border-radius:var(--radius-sm);color:var(--ink);background:#fff;flex:1;margin-top:.45rem;padding:0 .8rem;font-size:1.2rem;font-weight:800}.key-control select:disabled{opacity:.55}.notice{justify-content:space-between;align-items:center;gap:var(--space-2);margin-top:var(--space-3);border-radius:var(--radius-sm);padding:.8rem 1rem;font-size:.82rem;display:flex}.notice--action{background:#fff1bc}.notice--error{color:#7f1f11;background:#ffd9d1}.notice button{color:#fff;background:var(--ink);border:0;border-radius:.55rem;min-height:2.5rem;font-weight:750}.diagnostics{margin-top:var(--space-5);border-top:1px solid var(--line);color:var(--muted);padding:.9rem 1rem;font-size:.78rem}.diagnostics summary{cursor:pointer;font-weight:800}.diagnostics dl{grid-template-columns:1fr 1fr;gap:.55rem 1.5rem;margin:1rem 0 0;display:grid}.diagnostics dl div{justify-content:space-between;gap:.5rem;display:flex}.diagnostics dd{color:var(--ink);font-variant-numeric:tabular-nums;margin:0}.prototype-note{color:var(--muted);text-align:center;padding:1rem 0;font-size:.68rem}.builder-shell,.session-shell{max-width:42rem}.builder-tabs{margin-bottom:var(--space-4);border-radius:var(--radius-sm);background:var(--paper-deep);grid-template-columns:repeat(3,1fr);gap:.3rem;padding:.3rem;display:grid}.builder-tabs button{min-height:2.8rem;color:var(--muted);background:0 0;border:0;border-radius:.55rem;padding:.4rem;font-size:.75rem;font-weight:800}.builder-tabs button.is-selected{color:var(--paper);background:var(--ink)}.builder-grid{gap:var(--space-3);grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.builder-grid>label{min-width:0;color:var(--muted);gap:.45rem;font-size:.75rem;font-weight:800;display:grid}.builder-grid select,.builder-grid input[type=number]{width:100%;min-height:var(--control-height);border:1px solid var(--line);border-radius:var(--radius-sm);color:var(--ink);background:#fff;padding:0 .75rem}.builder-grid .builder-check{min-height:var(--control-height);flex-direction:row;align-items:center;gap:.6rem;padding-top:1.1rem;display:flex}.builder-check input{width:1.25rem;height:1.25rem}.instrument-order{margin-top:var(--space-4)}.instrument-order>div{border-bottom:1px solid var(--line);grid-template-columns:minmax(0,1fr) 2rem 2.75rem 2.75rem;align-items:center;gap:.4rem;min-height:3.25rem;display:grid}.instrument-order>div:last-child{border-bottom:0}.instrument-order label{align-items:center;gap:.6rem;font-weight:750;display:flex}.instrument-order input{width:1.2rem;height:1.2rem}.instrument-order button{border:1px solid var(--line);background:#fff;border-radius:.6rem;min-height:2.5rem;font-weight:900}.instrument-order button:disabled{opacity:.35}.builder-note,.count-hidden{margin-top:var(--space-3);color:var(--muted);font-size:.75rem;line-height:1.5}.builder-primary{width:100%;min-height:4rem;margin-top:var(--space-4);border-radius:var(--radius-md);color:var(--ink);background:var(--lime);border:0;font-size:1.05rem;font-weight:900}.builder-primary--stop{color:#fff;background:var(--accent)}.save-practice{align-items:end;gap:var(--space-2);margin-top:var(--space-4);padding:var(--space-3);border-radius:var(--radius-md);background:var(--paper-deep);grid-template-columns:minmax(0,1fr) auto;display:grid}.save-practice label{color:var(--muted);gap:.35rem;font-size:.75rem;font-weight:800;display:grid}.save-practice input{width:100%;min-height:var(--control-height);border:1px solid var(--line);border-radius:var(--radius-sm);background:#fff;padding:0 .75rem}.save-practice button,.library-actions button{min-height:var(--control-height);border:1px solid var(--ink);border-radius:var(--radius-sm);color:var(--paper);background:var(--ink);padding:.5rem .85rem;font-weight:800}.save-practice button:disabled{opacity:.5}.practice-library,.library-list{gap:var(--space-3);display:grid}.library-card{gap:var(--space-3);padding:var(--space-3);border:1px solid var(--line);border-radius:var(--radius-md);background:#fff;display:grid}.library-card h3{font-size:1.1rem}.library-card p,.library-card small,.library-empty{color:var(--muted);margin-top:.4rem;font-size:.75rem;line-height:1.45;display:block}.library-actions{flex-wrap:wrap;gap:.45rem;display:flex}.library-actions .danger-action{border-color:var(--accent-dark);color:var(--accent-dark);background:0 0}.session-progress{padding:var(--space-4);border-radius:var(--radius-lg);color:var(--paper);background:var(--ink);gap:.7rem;display:grid}.session-progress strong{font-variant-numeric:tabular-nums;font-size:2.5rem}.session-progress progress{width:100%;height:.8rem;accent-color:var(--lime)}.session-progress div{justify-content:space-between;gap:var(--space-2);color:#c9c1b5;font-size:.78rem;display:flex}.session-now{gap:var(--space-3);margin-top:var(--space-4);grid-template-columns:1fr 1fr;display:grid}.session-now>div{padding:var(--space-3);border:1px solid var(--line);border-radius:var(--radius-md);gap:.35rem;display:grid}.session-now span{color:var(--muted);text-transform:uppercase;font-size:.72rem;font-weight:800}.reentry-cue{padding:var(--space-3);border-radius:var(--radius-md);color:var(--ink);background:var(--lime);text-align:center;grid-column:1/-1;font-size:1.25rem;font-weight:900}@media (width<=31rem){.practice-shell{padding:var(--space-3)}.transport-panel{grid-template-columns:1fr}.transport-button{grid-auto-flow:column;gap:.6rem;width:100%;min-height:4.5rem}.transport-button span{font-size:1rem}.instrument-grid{grid-template-columns:repeat(3,1fr)}.instrument-card{min-height:6.5rem}.musical-settings,.diagnostics dl{grid-template-columns:1fr}.practice-header{align-items:flex-start}.header-actions{flex-direction:column;align-items:flex-end}.builder-grid,.session-now,.save-practice{grid-template-columns:1fr}}@media (width>=48rem){.practice-shell{border-radius:2.5rem;min-height:auto;margin:2rem auto}}@media (prefers-reduced-motion:no-preference){.transport-button,.instrument-card,.count-strip li{transition:transform .16s,background-color .16s,box-shadow .16s}}
