:root{color-scheme:dark;--bg-base: #08080d;--bg-surface: #0f0f16;--bg-elevated: #17171f;--bg-hover: #1f1f2a;--border: #262635;--border-subtle: #1a1a28;--text-1: #e6e2dc;--text-2: #8a8698;--text-3: #504d5e;--amber: #d4944c;--amber-soft: rgba(212, 148, 76, .12);--green: #2ec486;--green-soft: rgba(46, 196, 134, .12);--red: #e05a57;--red-soft: rgba(224, 90, 87, .12);--ff-display: "Syne", system-ui, sans-serif;--ff-body: "Figtree", system-ui, sans-serif;--ff-mono: "IBM Plex Mono", ui-monospace, monospace;--r-sm: 8px;--r-md: 12px;--r-lg: 16px}*,*:before,*:after{box-sizing:border-box;margin:0}[hidden]{display:none!important}body{font-family:var(--ff-body);background:var(--bg-base);color:var(--text-1);min-height:100dvh;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}html,body,#app,#app *{-webkit-user-select:none;user-select:none}a,button,input,select,textarea,[role=button],.custom-select__trigger,.custom-select__option{-webkit-tap-highlight-color:transparent;tap-highlight-color:transparent}body:after{content:"";position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:999;opacity:.018;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 512 512' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");background-size:200px 200px}body.modal-open{overflow:hidden}#app{max-width:480px;margin:0 auto;padding:1rem}.app-shell{display:grid;gap:.65rem;animation:enter .4s ease-out both}@keyframes enter{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.topbar{display:flex;align-items:center;justify-content:space-between;padding:.25rem 0}.mode-chip{font-family:var(--ff-mono);font-size:.7rem;font-weight:500;letter-spacing:.07em;text-transform:uppercase;color:var(--amber);background:var(--amber-soft);border:1px solid rgba(212,148,76,.18);padding:.3rem .7rem;border-radius:999px}.top-actions{display:flex;gap:.25rem}button,input,select{font:inherit}button{border:none;border-radius:var(--r-sm);padding:.5rem .85rem;font-weight:600;font-size:.82rem;cursor:pointer;transition:background .15s,box-shadow .2s,transform .15s,color .15s}button:disabled{opacity:.3;cursor:not-allowed}.btn-primary{flex:1;background:var(--amber);color:#0c0b09;font-weight:700;font-size:.88rem;letter-spacing:.015em;padding:.7rem 1.1rem;border-radius:var(--r-md);box-shadow:0 2px 20px var(--amber-soft)}.btn-primary:hover:not(:disabled){box-shadow:0 4px 28px #d4944c47;transform:translateY(-1px)}.btn-primary:active:not(:disabled){transform:translateY(0)}.btn-secondary{background:var(--bg-elevated);color:var(--text-2);border:1px solid var(--border);padding:.7rem 1.1rem;border-radius:var(--r-md)}.btn-secondary:hover:not(:disabled){background:var(--bg-hover);color:var(--text-1)}.btn-ghost{background:transparent;color:var(--text-2);font-size:.78rem;font-weight:500;padding:.4rem .65rem;border-radius:var(--r-sm)}.btn-ghost:hover{background:var(--bg-elevated);color:var(--text-1)}input,select{border:1px solid var(--border);border-radius:var(--r-sm);padding:.48rem .58rem;background:var(--bg-base);color:var(--text-1);font-size:.85rem;transition:border-color .15s,box-shadow .15s}input:focus,select:focus{outline:none;border-color:var(--amber);box-shadow:0 0 0 3px var(--amber-soft)}input.input-invalid{border-color:var(--red);box-shadow:0 0 0 2px var(--red-soft)}input.input-invalid:focus{border-color:var(--red);box-shadow:0 0 0 3px var(--red-soft)}select{cursor:pointer;-moz-appearance:none;appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%238a8698' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .5rem center;background-size:14px;padding-right:1.8rem}.native-select-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}.custom-select{position:relative}.custom-select.is-open{z-index:8}.custom-select__trigger{width:100%;display:flex;align-items:center;justify-content:space-between;gap:.55rem;text-align:left;font-size:.85rem;font-weight:500;border:1px solid var(--border);border-radius:var(--r-sm);padding:.48rem .58rem;background:var(--bg-base);color:var(--text-1)}.custom-select__trigger:after{content:"";width:14px;height:14px;flex:0 0 14px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%238a8698' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:center;opacity:.8;transition:transform .15s ease}.custom-select.is-open .custom-select__trigger:after{transform:rotate(180deg)}.custom-select__trigger:hover:not(:disabled){background:var(--bg-elevated)}.custom-select__trigger:focus-visible{outline:none;border-color:var(--amber);box-shadow:0 0 0 3px var(--amber-soft)}.custom-select__trigger:disabled{opacity:.4;cursor:not-allowed}.custom-select__value{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.custom-select__menu{position:absolute;top:calc(100% + .35rem);left:0;right:0;max-height:220px;overflow-y:auto;display:grid;gap:.15rem;padding:.25rem;border:1px solid var(--border);border-radius:var(--r-md);background:var(--bg-surface);box-shadow:0 20px 45px #00000073;opacity:0;transform:translateY(-8px) scale(.98);transform-origin:top center;pointer-events:none;transition:opacity .18s ease,transform .22s ease}.custom-select__menu[hidden]{display:none}.custom-select.is-open .custom-select__menu{opacity:1;transform:translateY(0) scale(1);pointer-events:auto}.custom-select__option{width:100%;text-align:left;font-size:.82rem;font-weight:500;border:1px solid transparent;border-radius:calc(var(--r-sm) - 1px);padding:.42rem .52rem;background:transparent;color:var(--text-1);box-shadow:none}.custom-select__option:hover:not(:disabled),.custom-select__option:focus-visible{background:var(--bg-hover);color:var(--text-1);outline:none}.custom-select__option.is-selected{background:var(--amber-soft);border-color:#d4944c33;color:var(--amber)}.custom-select__option:disabled{opacity:.35;cursor:not-allowed}input[type=range]{-webkit-appearance:none;-moz-appearance:none;appearance:none;padding:0;height:32px;background:transparent;border:none;cursor:pointer}input[type=range]:focus{border:none;box-shadow:none}.focus-card{background:var(--bg-surface);border:1px solid var(--border-subtle);border-radius:var(--r-lg);padding:.85rem;display:grid;gap:.75rem}.target-frame{position:relative;min-height:180px;border:1px solid var(--border);border-radius:var(--r-md);background:radial-gradient(ellipse 70% 55% at 50% 50%,rgba(212,148,76,.03) 0%,transparent 70%),var(--bg-base);display:grid;place-items:center;overflow:hidden;transition:border-color .35s,box-shadow .35s}.target-frame:has(.status.correct){border-color:#2ec4864d;box-shadow:inset 0 0 50px #2ec4860d,0 0 25px #2ec48612}.target-frame:has(.status.wrong){border-color:#e05a574d;box-shadow:inset 0 0 50px #e05a570d,0 0 25px #e05a5712}.session-target{font-family:var(--ff-display);font-size:clamp(1.8rem,7.5vw,3.2rem);font-weight:700;line-height:1.1;letter-spacing:-.02em;text-align:center;padding:.8rem 1rem}.status{position:absolute;top:.6rem;right:.6rem;width:34px;height:34px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;font-size:.95rem;font-weight:800}.status.hidden{display:none}.status.correct{background:var(--green);color:#061a0f;box-shadow:0 0 12px var(--green-soft);animation:pop .25s cubic-bezier(.34,1.56,.64,1)}.status.wrong{background:var(--red);color:#fff;box-shadow:0 0 12px var(--red-soft);animation:pop .25s cubic-bezier(.34,1.56,.64,1)}@keyframes pop{0%{transform:scale(0);opacity:0}to{transform:scale(1);opacity:1}}.pitch-block{display:grid;gap:.3rem}.gauge{--tol-half-pct: 8.333%;--tol-feather-pct: 10%;position:relative;height:38px;display:flex;align-items:center}.gauge:before{content:"";position:absolute;left:0;right:0;height:3px;border-radius:2px;pointer-events:none;background:linear-gradient(90deg,var(--red) 0%,rgba(224,90,87,.2) calc(50% - (var(--tol-half-pct) + var(--tol-feather-pct))),rgba(212,148,76,.15) calc(50% - var(--tol-half-pct)),var(--green) calc(50% - var(--tol-half-pct)),var(--green) calc(50% + var(--tol-half-pct)),rgba(212,148,76,.15) calc(50% + var(--tol-half-pct)),rgba(224,90,87,.2) calc(50% + (var(--tol-half-pct) + var(--tol-feather-pct))),var(--red) 100%);opacity:.4}.gauge__center{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:2px;height:16px;background:var(--green);border-radius:1px;opacity:.5;pointer-events:none}.gauge__slider{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;height:38px;background:transparent;border:none;position:relative;z-index:1;cursor:default;margin:0;padding:0;opacity:1}.gauge__slider:disabled{opacity:1;cursor:default}.gauge__slider:focus{border:none;box-shadow:none}.gauge__slider::-webkit-slider-runnable-track{height:3px;background:transparent}.gauge__slider::-webkit-slider-thumb{-webkit-appearance:none;width:2px;height:22px;background:var(--text-1);border:none;border-radius:1px;margin-top:-10px;box-shadow:0 0 8px #e6e2dc4d;cursor:default}.gauge__slider::-moz-range-track{height:3px;background:transparent;border:none}.gauge__slider::-moz-range-thumb{width:2px;height:22px;background:var(--text-1);border:none;border-radius:1px;box-shadow:0 0 8px #e6e2dc4d;cursor:default}.gauge__info{display:flex;justify-content:space-between;align-items:center;padding:0 .1rem}.gauge__label{font-family:var(--ff-mono);font-size:.58rem;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--text-3)}.gauge__readout{font-family:var(--ff-mono);font-size:.76rem;font-weight:500;color:var(--text-2)}.quick-metrics{display:grid;grid-template-columns:1fr 1fr;gap:.45rem}.metric-pill{background:var(--bg-base);border:1px solid var(--border-subtle);border-radius:var(--r-sm);padding:.5rem .65rem;display:grid;gap:.12rem}.metric-pill span{font-family:var(--ff-mono);font-size:.55rem;font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:var(--text-3)}.metric-pill strong{font-family:var(--ff-mono);font-size:1rem;font-weight:600;letter-spacing:-.01em}.message{min-height:0;color:var(--red);font-size:.8rem}.message:empty{display:none}.btn-row{display:flex;gap:.45rem}.modal{position:fixed;top:0;right:0;bottom:0;left:0;background:#040408b3;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);padding:1rem;display:grid;place-items:center;z-index:30;animation:fadeIn .18s ease-out}.modal[hidden]{display:none}.modal.is-closing{animation:fadeOut .18s ease-out forwards;pointer-events:none}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeOut{0%{opacity:1}to{opacity:0}}.modal-card{width:min(440px,100%);max-height:calc(100dvh - 2rem);display:flex;flex-direction:column;overflow:hidden;background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--r-lg);box-shadow:0 20px 50px #0006;animation:slideUp .22s ease-out}@keyframes slideUp{0%{opacity:0;transform:translateY(12px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}.modal.is-closing .modal-card{animation:slideDown .22s ease-out forwards}@keyframes slideDown{0%{opacity:1;transform:translateY(0) scale(1)}to{opacity:0;transform:translateY(12px) scale(.97)}}.modal-head{display:flex;justify-content:space-between;align-items:center;padding:.75rem .85rem;border-bottom:1px solid var(--border-subtle)}.modal-scroll{overflow-y:auto;padding:.75rem .85rem .85rem;scrollbar-width:thin;scrollbar-color:var(--border) transparent}.modal-card--stats{overflow:visible}.modal-card--stats .modal-scroll{overflow:visible;display:flex;flex-direction:column}h2{margin:0;font-family:var(--ff-display);font-size:.95rem;font-weight:600}.controls{display:grid;gap:.7rem}.settings-difficulty{display:grid;grid-template-columns:1fr;gap:.55rem}.settings-difficulty.is-custom{grid-template-columns:1fr 1fr}.settings-divider{height:1px;background:var(--border-subtle);margin:.08rem 0 .2rem}.mode-settings{display:grid;gap:.7rem}.control-row{display:grid;gap:.25rem;align-content:start}label{font-size:.75rem;font-weight:500;color:var(--text-2)}.field-error{font-size:.66rem;color:var(--red);letter-spacing:.01em;margin:0}.controls input[type=range]::-webkit-slider-runnable-track{height:4px;border-radius:2px;background:var(--border)}.controls input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:16px;height:16px;border-radius:999px;background:var(--amber);border:2px solid var(--bg-surface);margin-top:-6px;box-shadow:0 0 6px var(--amber-soft)}.controls input[type=range]::-moz-range-track{height:4px;border-radius:2px;background:var(--border);border:none}.controls input[type=range]::-moz-range-thumb{width:16px;height:16px;border-radius:999px;background:var(--amber);border:2px solid var(--bg-surface);box-shadow:0 0 6px var(--amber-soft)}.row-inline{display:grid;grid-template-columns:1fr 1fr;gap:.55rem;align-items:start}.stats-list{display:grid;gap:.4rem;margin-top:.6rem;max-height:min(58dvh,460px);overflow-y:auto;padding-right:.08rem;scrollbar-width:thin;scrollbar-color:var(--border) transparent}.progress-sort{max-width:240px}.stats-empty{margin-top:.6rem;font-size:.8rem;color:var(--text-2)}.stat-row{background:var(--bg-base);border:1px solid var(--border-subtle);border-radius:var(--r-sm);padding:.55rem .65rem}.stat-row.is-unseen{opacity:.58}.stat-head{display:flex;justify-content:space-between;align-items:center}.stat-head strong{font-family:var(--ff-display);font-size:.85rem;font-weight:600}.mastery-meta{display:inline-flex;align-items:baseline;gap:.32rem}.mastery-label{font-family:var(--ff-mono);font-size:.76rem;font-weight:500;color:var(--text-3)}.mastery-value{font-family:var(--ff-mono);font-size:.76rem;font-weight:500;color:var(--amber)}.stat-sub{margin-top:.2rem;font-family:var(--ff-mono);font-size:.66rem;color:var(--text-3)}.mastery-track{margin-top:.35rem;width:100%;height:3px;border-radius:999px;position:relative;background:var(--border-subtle);overflow:hidden}.mastery-track:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(90deg,var(--red) 0%,var(--amber) 50%,var(--green) 100%);clip-path:inset(0 calc(100% - var(--mastery, 0%)) 0 0 round 999px)}@media(max-width:480px){#app{padding:.55rem}.focus-card{padding:.65rem}.target-frame{min-height:150px}.session-target{font-size:clamp(1.6rem,7vw,2.6rem)}.quick-metrics,.row-inline,.settings-difficulty.is-custom{grid-template-columns:1fr}.btn-row{flex-direction:column}}