:root{--color-canvas: #f3f0e8;--color-surface: #fbfaf6;--color-ink: #242621;--color-muted: #676a61;--color-line: #d9d6cc;--color-key: #e8e5dc;--color-accent: #bd3f2f;--color-accent-deep: #8f2e23;--color-positive: #277255;--color-positive-soft: #dbeade;--space-1: .25rem;--space-2: .5rem;--space-3: .75rem;--space-4: 1rem;--space-5: 1.5rem;--space-6: 2rem;--space-7: 3rem;--space-8: 4rem;--radius-sm: .5rem;--radius-md: 1rem;--radius-lg: 1.5rem;--shadow-panel: 0 1.5rem 4rem rgb(56 52 43 / 12%);--transition-fast: .16s cubic-bezier(.22, 1, .36, 1);color:var(--color-ink);font-family:Avenir Next,Avenir,Segoe UI,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility}*{box-sizing:border-box}body{min-width:20rem;min-height:100vh;margin:0;background:linear-gradient(var(--color-line) 1px,transparent 1px),linear-gradient(90deg,var(--color-line) 1px,transparent 1px),var(--color-canvas);background-size:var(--space-6) var(--space-6)}button,input,textarea,select{font:inherit}.trainer-shell{display:grid;min-height:100vh;place-items:center;padding:var(--space-6)}.trainer-panel{width:min(100%,43rem);overflow:hidden;border:1px solid var(--color-line);border-radius:var(--radius-lg);background:var(--color-surface);box-shadow:var(--shadow-panel)}.trainer-header{padding:var(--space-7) var(--space-7) var(--space-6)}.eyebrow{margin:0 0 var(--space-3);color:var(--color-accent-deep);font-size:.75rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase}h1{margin:0;font-family:Charter,Iowan Old Style,Georgia,serif;font-size:clamp(2.25rem,7vw,4rem);font-weight:600;letter-spacing:-.04em;line-height:.95}.intro{max-width:31rem;margin:var(--space-4) 0 0;color:var(--color-muted);font-size:1rem;line-height:1.6}.connection{display:flex;align-items:center;gap:var(--space-3);margin:0 var(--space-7);padding:var(--space-4);border:1px solid var(--color-line);border-radius:var(--radius-md);background:var(--color-canvas)}.connection-dot{width:var(--space-3);height:var(--space-3);flex:0 0 auto;border:2px solid var(--color-surface);border-radius:50%;background:var(--color-muted);box-shadow:0 0 0 1px var(--color-muted);transition:background var(--transition-fast),box-shadow var(--transition-fast)}[data-connection=connected] .connection-dot{background:var(--color-positive);box-shadow:0 0 0 1px var(--color-positive)}.connection-state,.controller-name{margin:0}.connection-state{font-size:.875rem;font-weight:700}.controller-name{margin-top:var(--space-1);color:var(--color-muted);font-size:.8125rem;line-height:1.4}.mapping-panel,.practice-panel,.mastery-panel{margin:var(--space-5) var(--space-7) 0;padding:var(--space-5);border:1px solid var(--color-line);border-radius:var(--radius-md)}.practice-panel{background:var(--color-canvas)}.practice-panel .eyebrow,.mapping-heading .eyebrow{margin-bottom:var(--space-1)}.expected-shape,.attempt-lifecycle,.practice-prompt,.practice-result,.actionable-cue{margin:var(--space-3) 0 0;line-height:1.5}.expected-shape{font-weight:700}.attempt-lifecycle{color:var(--color-muted);font-size:.8125rem;text-transform:capitalize}.practice-prompt{color:var(--color-muted)}.practice-result{color:var(--color-accent-deep)}.actionable-cue{color:var(--color-accent-deep);font-size:.875rem}.mastery-panel{background:var(--color-surface)}.mastery-heading{display:grid;grid-template-columns:1fr auto;align-items:end;gap:var(--space-3)}.preference-label{grid-column:2;color:var(--color-muted);font-size:.75rem;font-weight:700}.mastery-heading select{grid-column:2;padding:var(--space-2);border:1px solid var(--color-line);border-radius:var(--radius-sm);background:var(--color-canvas);color:var(--color-ink)}.mastery-details{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-3);margin:var(--space-4) 0 0}.mastery-details div{min-width:0}.mastery-details dt{color:var(--color-muted);font-size:.75rem;font-weight:700}.mastery-details dd{margin:var(--space-1) 0 0;overflow-wrap:anywhere;font-size:.875rem;font-weight:700}.evidence-timeline{margin-top:var(--space-4);border-top:1px solid var(--color-line)}.evidence-timeline h3{margin:var(--space-3) 0 var(--space-2);color:var(--color-muted);font-size:.75rem;font-weight:700}.evidence-timeline ol{display:grid;gap:var(--space-2);margin:0;padding-left:var(--space-4)}.evidence-timeline li{color:var(--color-ink);font-size:.875rem}.mapping-heading,.calibration-actions{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3)}h2{margin:0;font-family:Charter,Iowan Old Style,Georgia,serif;font-size:1.5rem}.mapping-select-label{display:block;margin-top:var(--space-4);font-size:.75rem;font-weight:700}.mapping-panel select{width:100%;margin-top:var(--space-2);padding:var(--space-3);border:1px solid var(--color-line);border-radius:var(--radius-sm);background:var(--color-surface);color:var(--color-ink)}.mapping-help,.calibration-direction,.calibration-status{margin:var(--space-3) 0 0;color:var(--color-muted);font-size:.875rem;line-height:1.5}.calibration{margin-top:var(--space-4);padding-top:var(--space-4);border-top:1px solid var(--color-line)}.calibration-direction{color:var(--color-ink);font-weight:700;text-transform:capitalize}.calibration-actions{justify-content:flex-start;margin-top:var(--space-4)}.button{padding:var(--space-2) var(--space-3);border:1px solid var(--color-accent-deep);border-radius:var(--radius-sm);background:var(--color-accent);color:var(--color-surface);cursor:pointer;font-size:.8125rem;font-weight:700}.button--quiet{border-color:var(--color-line);background:var(--color-surface);color:var(--color-ink)}.button:disabled{cursor:not-allowed;opacity:.5}[hidden]{display:none!important}.leverless-layout{display:grid;grid-template-columns:repeat(6,1fr);gap:var(--space-3);margin:0;padding:var(--space-7);list-style:none}[data-direction-hand=mirrored] .leverless-layout{direction:rtl}.direction-key{grid-column:span 2;display:grid;min-width:0;min-height:7.5rem;place-items:center;align-content:center;gap:var(--space-2);border:1px solid var(--color-line);border-bottom-width:var(--space-1);border-radius:var(--radius-md);background:var(--color-key);color:var(--color-muted);transition:transform var(--transition-fast),border-color var(--transition-fast),background var(--transition-fast),color var(--transition-fast)}.direction-key kbd{font-family:inherit;font-size:2rem;font-weight:700;line-height:1}.direction-key span{font-size:.75rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase}.direction-key--thumb{grid-column:3 / span 2}.direction-key[data-active]{transform:translateY(var(--space-1));border-color:var(--color-accent-deep);border-bottom-width:1px;background:var(--color-accent);color:var(--color-surface)}.source-row{display:flex;justify-content:space-between;gap:var(--space-4);padding:var(--space-4) var(--space-7);border-top:1px solid var(--color-line);color:var(--color-muted);font-size:.75rem;letter-spacing:.04em}.source-row strong{color:var(--color-ink);font-weight:700}.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}@media(max-width:37.5rem){.trainer-shell{align-items:start;padding:var(--space-3)}.trainer-header{padding:var(--space-6) var(--space-5) var(--space-5)}.connection{margin:0 var(--space-5)}.mapping-panel{margin-right:var(--space-5);margin-left:var(--space-5)}.leverless-layout{gap:var(--space-2);padding:var(--space-6) var(--space-5)}.direction-key{min-height:var(--space-8)}.source-row{padding:var(--space-4) var(--space-5)}}@media(prefers-reduced-motion:reduce){.connection-dot,.direction-key{transition:none}}
