*,:before,:after{box-sizing:border-box}*{margin:0}html,body,#root{height:100%}body{-webkit-font-smoothing:antialiased;background:var(--stage);color:var(--ink);font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;line-height:1.5}img,svg,video,canvas{max-width:100%;display:block}button{font:inherit;color:inherit}:focus-visible{outline:2px solid var(--primary);outline-offset:2px}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important}}:root{--h-primary:186;--h-accent:58;--radius:10px;--radius-sm:7px;--z-overlay:10}[data-palette=verdigris]{--h-primary:186;--h-accent:58}[data-palette=amber]{--h-primary:70;--h-accent:235}[data-palette=indigo]{--h-primary:274;--h-accent:150}[data-palette=rose]{--h-primary:8;--h-accent:180}:root,[data-theme=dark]{--stage:oklch(.12 .01 var(--h-primary));--surface:oklch(.225 .014 var(--h-primary));--surface-2:oklch(.275 .016 var(--h-primary));--line:oklch(.31 .012 var(--h-primary));--ink:oklch(.96 .004 var(--h-primary));--muted:oklch(.71 .011 var(--h-primary));--primary:oklch(.82 .11 var(--h-primary));--on-primary:oklch(.18 .02 var(--h-primary));--accent:oklch(.8 .11 var(--h-accent));--danger:oklch(72% .14 28)}[data-theme=light]{--stage:oklch(.995 .003 var(--h-primary));--surface:oklch(.945 .008 var(--h-primary));--surface-2:oklch(.905 .012 var(--h-primary));--line:oklch(.87 .01 var(--h-primary));--ink:oklch(.24 .02 var(--h-primary));--muted:oklch(.46 .018 var(--h-primary));--primary:oklch(.52 .13 var(--h-primary));--on-primary:oklch(.99 .004 var(--h-primary));--accent:oklch(.48 .13 var(--h-accent));--danger:oklch(52% .18 28)}main{background:var(--stage);height:100dvh;position:relative;overflow:hidden}.sr-only{clip:rect(0 0 0 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.score{position:absolute;inset:0;overflow:auto}.score-osmd{width:100%;max-width:80rem;margin-inline:auto}.score svg{margin:0 auto;display:block}.score-loading,.score-error{color:var(--muted);font-size:.9rem;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.score-error{color:var(--danger)}.chip{border:1px solid var(--line);background:color-mix(in oklab, var(--surface) 80%, transparent);width:36px;height:36px;color:var(--ink);cursor:pointer;z-index:var(--z-overlay);border-radius:999px;justify-content:center;align-items:center;font-size:1.15rem;line-height:1;display:inline-flex;position:relative}.chip:after{content:"";position:absolute;inset:-4px}.chip:hover:not(:disabled){background:var(--surface-2)}.chip:disabled{opacity:.4;cursor:not-allowed}.chip.is-on{color:var(--accent);border-color:color-mix(in oklab, var(--accent) 45%, var(--line))}.chip-primary{background:var(--primary);width:48px;height:48px;color:var(--on-primary);border-color:#0000;font-size:1.3rem}.chip-primary:hover:not(:disabled){filter:brightness(1.08);background:var(--primary)}.corner{z-index:var(--z-overlay);flex-direction:column;gap:.6rem;display:inline-flex;position:fixed}.corner-tl{top:max(.75rem, env(safe-area-inset-top));left:max(.75rem, env(safe-area-inset-left))}.corner-tr{top:max(.75rem, env(safe-area-inset-top));right:max(.75rem, env(safe-area-inset-right));align-items:flex-end}.corner-bl{bottom:max(.75rem, env(safe-area-inset-bottom));left:max(.75rem, env(safe-area-inset-left))}.corner-br{bottom:max(.75rem, env(safe-area-inset-bottom));right:max(.75rem, env(safe-area-inset-right));align-items:flex-end}.focus-exit{top:max(.75rem, env(safe-area-inset-top));right:max(.75rem, env(safe-area-inset-right));z-index:var(--z-overlay);display:none;position:fixed}main[data-focus]>:not(.score):not(.focus-exit){display:none}main[data-focus] .focus-exit{display:inline-flex}.catalog{border-radius:var(--radius);background:var(--surface);color:var(--ink);border:none;width:calc(100vw - 2rem);max-width:32rem;margin:auto;padding:0}.catalog::backdrop{background:oklab(0% 0 0/.5)}.catalog-body{max-height:80vh;padding:1.25rem 1.5rem;overflow:auto}.catalog-title{margin-bottom:.75rem;font-size:1.1rem}.catalog-section{margin-bottom:1rem}.catalog-section h3{text-transform:uppercase;letter-spacing:.05em;color:var(--muted);margin-bottom:.35rem;font-size:.8rem}.catalog-section ul{padding:0;list-style:none}.catalog-item{text-align:left;border-radius:var(--radius-sm,7px);width:100%;color:var(--ink);cursor:pointer;background:0 0;border:0;padding:.5rem .6rem;display:block}.catalog-item:hover{background:var(--surface-2)}.catalog-item.active{color:var(--primary);font-weight:600}.modal{border-radius:var(--radius);background:var(--surface);color:var(--ink);border:none;width:calc(100vw - 2rem);max-width:22rem;margin:auto;padding:0}.modal::backdrop{background:oklab(0% 0 0/.5)}.modal-body{flex-direction:column;gap:1.1rem;padding:1.25rem 1.5rem;display:flex}.modal-title{font-size:1.1rem}.modal-note{color:var(--muted);text-align:center;margin:0;font-size:.8rem}.setting{justify-content:space-between;align-items:center;gap:1rem;display:flex}.setting-label{font-size:.9rem}.segmented{background:var(--surface-2);border:1px solid var(--line);border-radius:var(--radius-sm);gap:2px;padding:2px;display:inline-flex}.segmented button{color:var(--muted);font:inherit;cursor:pointer;background:0 0;border:0;border-radius:5px;padding:.3rem .6rem;font-size:.8rem}.segmented button:hover{color:var(--ink)}.segmented button[aria-checked=true]{background:var(--primary);color:var(--on-primary)}.swatches{gap:.5rem;display:inline-flex}.swatch{border:2px solid var(--line);cursor:pointer;background:oklch(.7 .14 var(--h-primary));border-radius:50%;width:24px;height:24px;padding:0}.swatch:hover{transform:scale(1.1)}.swatch[aria-checked=true]{border-color:var(--ink)}.setting-stack{flex-direction:column;align-items:stretch;gap:.5rem}.key-grid{grid-template-columns:repeat(6,1fr);gap:.4rem;display:grid}.key-opt{font:inherit;border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--surface-2);color:var(--ink);cursor:pointer;font-variant-numeric:tabular-nums;padding:.5rem 0;font-size:.85rem}.key-opt:hover{background:var(--line)}.key-opt.is-on{background:var(--primary);color:var(--on-primary);border-color:#0000}.stepper{justify-content:center;align-items:center;gap:1rem;display:flex}.stepper-value{font-variant-numeric:tabular-nums;text-align:center;min-width:4ch;font-size:2.2rem}.stepper-value small{color:var(--muted);margin-left:.3rem;font-size:.9rem}.keypad{grid-template-columns:repeat(3,1fr);gap:.5rem;display:grid}.key{font:inherit;border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--surface-2);color:var(--ink);cursor:pointer;padding:.8rem 0;font-size:1.1rem}.key:hover:not(:disabled){background:var(--line)}.key:disabled{opacity:.4;cursor:not-allowed}.key-set{background:var(--primary);color:var(--on-primary);border-color:#0000}.key-set:hover:not(:disabled){filter:brightness(1.08)}.corner-bc{bottom:max(.75rem, env(safe-area-inset-bottom));align-items:center;left:50%;transform:translate(-50%)}.ladder-hint{color:var(--muted);background:color-mix(in oklab, var(--surface) 85%, transparent);border:1px solid var(--line);border-radius:999px;margin-bottom:.4rem;padding:.25rem .7rem;font-size:.8rem}.ladder{background:color-mix(in oklab, var(--surface) 85%, transparent);border:1px solid var(--line);border-radius:999px;gap:2px;padding:3px;display:inline-flex}.ladder-rung{color:var(--muted);font:inherit;cursor:pointer;text-transform:capitalize;background:0 0;border:0;border-radius:999px;padding:.35rem .7rem;font-size:.8rem}.ladder-rung:hover{color:var(--ink)}.ladder-rung.is-on{background:var(--primary);color:var(--on-primary)}