@font-face{font-family:Quicksand Variable;font-style:normal;font-display:swap;font-weight:300 700;src:url(/tonewheel/assets/quicksand-vietnamese-wght-normal-ei70gACF.woff2)format("woff2-variations");unicode-range:U+102-103,U+110-111,U+128-129,U+168-169,U+1A0-1A1,U+1AF-1B0,U+300-301,U+303-304,U+308-309,U+323,U+329,U+1EA0-1EF9,U+20AB}@font-face{font-family:Quicksand Variable;font-style:normal;font-display:swap;font-weight:300 700;src:url(/tonewheel/assets/quicksand-latin-ext-wght-normal-CrJ75Ewg.woff2)format("woff2-variations");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Quicksand Variable;font-style:normal;font-display:swap;font-weight:300 700;src:url(/tonewheel/assets/quicksand-latin-wght-normal-Buj9m_3d.woff2)format("woff2-variations");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Tonewheel Accidentals;src:url(data:font/woff2;base64,d09GMgABAAAAAAMwAA0AAAAABdgAAALhAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAGx4cQAZgADwRCAqCFIFrCwwAATYCJAMUBCAFhCgHIBvCBMgEHvi87P3fZEqus5rCWVAFlKbgaSGeLFzhuZhbXoh6XbTU1bT9BNk8IhpFk1rqhIwnTTsS1zlKojKMXdASuxCAE43ZCdG3/9AYHFAgoc3mGQ2J7tiywHdDsusrSrDm5NboWPMrcouxlmRWlWI1qiuzsXafGnpakbqYhwpyhkxA9pBAJNLQRe9e6axKRVWkxGU7ScZsYL40YMSIAZxEs5qq8b8CLIY8t5UmZIC8DExpOKRgkALL+GDXQPmgEERZUBBpzWpuY1yzGjab7dWjxeN3CoTNhju2VA9xgumQkU5mB0tBlmQq+76iuLs6KI2VdFfFZYyr6pLuLE84z7zGuJNBMWs3+sRvOdFo5UoxfrPTjI0ByYqTiFGdiRUxxIu2ooNwJh7iA+iLOomYX2kr4kUMqZdWXl7Zol1OO6Lzmk3pG6l1DtZif/ftHPl8W9PeK7vPX73DrfEyd4/3Y3jVpUGzu/Na+TS/UX56XGXjsWSEz/2S8/Vss6O93c80O+KU7TrXOd/5aLO9vT3PNDv6JX9e63m9PeZyl7ck54bOL7ic7t71m4O73cey0vPOl78EF18eHHDq39R/XVTDYpyfKwfoNzCmjv839d971UCm2azKBNKEAi+KUHThgy76oXfoVHlDc3rcxBTWbyrlQF4UKI6cXCZCOIGP8OMkbsKBs6MjNzmFVmzlVGJI4Cy0oH3CDV6HAqqoooxKOhNJJOvOpoJCyqjS0AgqEyUwukkF+UQygv4MZTgmVZgMo7pRmk04o8m9XE0JmVQQRy4V1VFMStHQiSCKKNrQBW25Sh6ZVE/wqQIKKaUKjSBqiCaCjkTQlgg6EE47cmhHFsHapsbltKkldjuAEYxgAF22OiMzd5HOPpiUUX8xVv6VwYH+jUJHRyOGAnLRBnWPpAKTInIxdLN6HdQquESrUp157Yl8BI3PqskigmxMDCIpnczKQ/Ag+UiMDVnBf1uVttlWoWMC)format("woff2");unicode-range:U+266D-266F;font-display:block;ascent-override:80%;descent-override:20%;line-gap-override:0%}*,:before,:after{box-sizing:border-box}:root{--font:"Quicksand Variable", "Tonewheel Accidentals", system-ui, sans-serif;font-family:var(--font);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizelegibility}body{min-height:100svh;margin:0}:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--bg-top:#f8f7f5;--bg-bottom:#eeeeef;--panel:#fcfcfb;--panel-bright:#fff;--ink:#4b4a4f;--muted:#9a999b;--faint:#c5c3c1;--line:#e3e2df;--wedge-off:#ebeae7;--wedge-on:#5d5c62;--band:#f1f0ee;--band-active:#e6e4e1;--deg-1:#e15b64;--deg-2:#e58a4e;--deg-3:#cfa018;--deg-4:#57b26a;--deg-5:#4f9fd0;--deg-6:#7178cf;--deg-7:#a86fc9;--accent:var(--deg-1);--handle:#b8b6b2;--kb-white:#fff;--kb-black:#55545a;--shadow-face:drop-shadow(0 2px 5px #4b4a4f12);--shadow-hub:drop-shadow(0 1px 3px #4b4a4f14)}[data-theme=dark]{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg-top:#1d1d20;--bg-bottom:#161618;--panel:#242428;--panel-bright:#2c2c30;--ink:#d8d7dc;--muted:#8f8e94;--faint:#55545b;--line:#38373d;--wedge-off:#2f2f34;--wedge-on:#cfced4;--band:#2a2a2e;--band-active:#35353a;--deg-1:#e8707a;--deg-2:#ea9a60;--deg-3:#d9b13c;--deg-4:#68c07b;--deg-5:#66aede;--deg-6:#8890dc;--deg-7:#b884d6;--handle:#5a595f;--kb-white:#3a3a40;--kb-black:#1a1a1d;--shadow-face:drop-shadow(0 2px 6px #00000073);--shadow-hub:drop-shadow(0 1px 3px #00000080)}body{background-color:var(--bg-bottom);color:var(--ink);overflow-x:clip}body:before,body:after{content:"";z-index:-1;pointer-events:none;transition:opacity .3s;position:fixed;inset:0}body:before{background:linear-gradient(#f8f7f5,#eeeeef)}body:after{opacity:0;background:linear-gradient(#1d1d20,#161618)}[data-theme=dark] body:before{opacity:0}[data-theme=dark] body:after{opacity:1}html.theme-fading body,html.theme-fading body *{transition:background-color .3s,color .3s,fill .3s,stroke .3s,filter .3s,opacity .3s,transform .22s cubic-bezier(.34,1.3,.5,1)!important}.app{--pad-y:40px;--gap:24px;--readout-h:84px;--keyboard-h:125px;--target-h:0px;--rack-h:82px;--hint-h:78px;--gaps:3;--controls-gap:16px;--kb-w:min(470px, 92vw, var(--wheel-size));--chrome-h:calc(2 * var(--pad-y) + var(--gaps) * var(--gap) + var(--controls-gap) + var(--readout-h) + var(--keyboard-h) + var(--target-h) + var(--rack-h) + var(--hint-h));--wheel-size:max(260px, min(600px, 94vw, calc(100svh - var(--chrome-h))));justify-content:safe center;align-items:center;gap:var(--gap);min-height:100svh;padding:var(--pad-y) 24px;flex-direction:column;display:flex}.readout{text-align:center;max-width:100%}.scale-name{letter-spacing:.01em;white-space:nowrap;height:1.25em;margin:0;font-size:clamp(28px,9vw,44px);font-weight:330;line-height:1.25}.scale-notes{color:var(--muted);letter-spacing:.18em;white-space:pre;height:1.4em;margin:8px 0 0;font-size:15px;font-weight:450;line-height:1.4}.wheel{width:var(--wheel-size);touch-action:none;-webkit-user-select:none;user-select:none;height:auto}.gear,.gear text{transition:transform .22s cubic-bezier(.34,1.3,.5,1)}.gear.dragging,.gear.dragging text{transition:none}.hit{fill:none;stroke:#0000;pointer-events:stroke;cursor:grab}.hit:active{cursor:grabbing}.face{fill:var(--panel);stroke:var(--line);stroke-width:1.5px;filter:var(--shadow-face)}.notch{stroke:var(--accent);stroke-width:5px;stroke-linecap:round}.gear text.degree-number{paint-order:stroke;stroke:var(--panel);stroke-width:3.5px;stroke-linejoin:round;opacity:0;font-size:15px;font-weight:550;transition:transform .22s cubic-bezier(.34,1.3,.5,1),opacity .18s,fill .24s}.gear.dragging text.degree-number{transition:opacity .18s,fill .24s}.gear text.degree-number.on{opacity:1}.degree-halo{pointer-events:none;filter:blur(4.5px);animation:.6s ease-out forwards halo-fade}@keyframes halo-fade{0%{opacity:.9}to{opacity:0}}.degree-1{fill:var(--deg-1)}.degree-2{fill:var(--deg-2)}.degree-3{fill:var(--deg-3)}.degree-4{fill:var(--deg-4)}.degree-5{fill:var(--deg-5)}.degree-6{fill:var(--deg-6)}.degree-7{fill:var(--deg-7)}.handle{fill:none;stroke:var(--handle);stroke-width:1.4px;stroke-linecap:round;transition:stroke .16s}.key-ring{fill:none;stroke:var(--band);stroke-width:20px}.key-ring-edge{fill:none;stroke:var(--line);stroke-width:1px}.clutch-pad{stroke:var(--handle);stroke-width:6px;stroke-linecap:round;stroke-dashoffset:43px;transition:stroke-dashoffset .17s cubic-bezier(.34,1.3,.5,1),stroke .16s}.wheel.key-hover .clutch-pad{stroke:var(--muted)}.wheel.key-engaged .clutch-pad{stroke-dashoffset:0;stroke:var(--muted)}.wheel.key-hover .follows .handle{stroke:var(--muted)}.wheel.key-engaged .follows .handle,.wheel.key-engaged .key-handle{stroke:var(--ink)}.wheel.key-engaged .follows{transition:none}.key-rim-knurl,.key-grip-ticks{stroke-width:2.2px}.wheel.key-style-rim.key-hover .key-handle,.wheel.key-style-segments.key-hover .key-handle{stroke:var(--muted)}.key-grip-ticks{transition:stroke .16s,stroke-width .2s cubic-bezier(.34,1.3,.5,1)}.wheel.key-style-segments.key-hover .key-grip-ticks{stroke-width:2.8px}.key-grip{transition:transform .2s cubic-bezier(.34,1.3,.5,1)}.wheel.key-style-segments.key-hover .key-grip{transform:scale(.9965)}.wheel.key-style-segments.key-engaged .key-grip{transform:scale(.9905)}.wheel.key-style-rim.key-hover .follows .root-ring,.wheel.key-style-rim.key-hover .follows .scale-band,.wheel.key-style-rim.key-engaged .follows .root-ring,.wheel.key-style-rim.key-engaged .follows .scale-band,.wheel.key-style-segments.key-hover .follows .root-ring,.wheel.key-style-segments.key-hover .follows .scale-band,.wheel.key-style-segments.key-engaged .follows .root-ring,.wheel.key-style-segments.key-engaged .follows .scale-band{stroke:var(--band-active)}.wheel.key-style-rim.key-hover .follows .capsule:not(.on),.wheel.key-style-rim.key-engaged .follows .capsule:not(.on),.wheel.key-style-segments.key-hover .follows .capsule:not(.on),.wheel.key-style-segments.key-engaged .follows .capsule:not(.on){fill:var(--band-active)}.gear.stays{transition:transform .22s cubic-bezier(.34,1.3,.5,1),opacity .2s}.gear.stays.dragging{transition:opacity .2s}.wheel.key-style-rim.key-engaged .stays,.wheel.key-style-segments.key-engaged .stays{opacity:.6}.wheel.middle-hover .gear-middle .handle,.wheel.root-hover .gear-root .handle{stroke:var(--muted)}.gear-middle.dragging .handle,.gear-root.dragging .handle{stroke:var(--ink)}.wheel.middle-hover .gear-middle .scale-band,.gear-middle.dragging .scale-band{stroke:var(--band-active)}.wheel.middle-hover .gear-middle .capsule:not(.on),.gear-middle.dragging .capsule:not(.on){fill:var(--band-active)}.wheel.root-hover .gear-root .root-ring,.gear-root.dragging .root-ring{stroke:var(--band-active)}.root-ring{fill:none;stroke:var(--band);stroke-width:26px;transition:stroke .16s}.root-dot{fill:var(--line)}.root-pointer{fill:var(--accent)}.root-pointer-dot{fill:var(--panel-bright)}.scale-band{fill:none;stroke:var(--band);stroke-width:14px;transition:stroke .16s}.scale-arc{fill:none;stroke:var(--wedge-on);stroke-width:14px;stroke-linecap:round;transition:opacity .2s}.scale-arc-dot{fill:var(--wedge-on);transition:opacity .2s}.slot-dot{fill:var(--line)}.capsule{fill:var(--wedge-off);transition:fill .16s,opacity .2s}.capsule.on{fill:var(--wedge-on)}.tonic-dot{fill:var(--panel)}.note-label{fill:var(--faint);font-size:17px;font-weight:330}@keyframes note-label-in{0%{opacity:0}}@keyframes note-label-out{to{opacity:0}}.gear text.note-label{animation:.24s note-label-in}.gear text.note-label.ghost{pointer-events:none;animation:.24s forwards note-label-out}.note-label.in-scale{fill:var(--ink);font-weight:400}.note-label.root{fill:var(--accent)}.hub{fill:var(--panel-bright);stroke:var(--line);stroke-width:1.5px;filter:var(--shadow-hub);transition:transform .22s cubic-bezier(.34,1.3,.5,1)}.wheel.drop-target .hub{transform:scale(1.07)}.wheel.drop-target .scale-arc,.wheel.drop-target .scale-arc-dot,.wheel.drop-target .capsule.on{opacity:.3}.hub-caption{letter-spacing:.28em;fill:var(--muted);font-size:9px;font-weight:500}.hub-note{fill:var(--ink);font-size:34px;font-weight:420}.keyboard{width:var(--kb-w);-webkit-user-select:none;user-select:none;touch-action:manipulation;height:auto}.kb-key{cursor:pointer;transition:transform 90ms}.kb-key:active{transform:translateY(1.5px)}.kb-white{fill:var(--kb-white);stroke:var(--line);stroke-width:1px;filter:var(--shadow-hub)}.kb-black{fill:var(--kb-black);filter:var(--shadow-hub)}.kb-coin{pointer-events:none;opacity:0;transition:opacity .18s,transform .26s cubic-bezier(.34,1.5,.5,1),fill .24s;transform:scale(.5)}.kb-coin.on{opacity:1;transform:scale(1)}.kb-coin-cast{fill:none}.kb-coin-numeral{pointer-events:none;fill:#fff;opacity:0;font-size:12px;font-weight:600;transition:opacity .18s}.kb-coin-numeral.black{font-size:10.5px}.kb-coin-numeral.on{opacity:1}.kb-halo{pointer-events:none;filter:blur(6px);animation:.6s ease-out forwards halo-fade}.controls{align-items:center;gap:var(--controls-gap);flex-direction:column;display:flex}.rack{flex-wrap:wrap;justify-content:center;gap:4px;display:flex}.cradle{color:var(--muted);font:inherit;cursor:grab;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;background:0 0;border:none;border-radius:14px;flex-direction:column;align-items:center;gap:2px;padding:6px 8px 8px;display:flex}.cradle:active{cursor:grabbing}.cradle:focus-visible{outline:2px solid var(--accent)}.cradle-name{letter-spacing:.04em;font-size:11px;font-weight:500}.cradle.equipped .cradle-name{color:var(--ink)}.mini-gear{width:var(--mini-size,52px);height:auto;display:block;overflow:visible}.mini-cradle{fill:none;stroke:var(--wedge-off);stroke-width:10px}.mini-body{transition:opacity .2s,transform .22s cubic-bezier(.34,1.3,.5,1)}.mini-body.lifted{opacity:0}.cradle:hover .mini-body,.cradle:focus-visible .mini-body{transform:translateY(-2px)}.mini-track{fill:none;stroke:var(--band);stroke-width:10px}.mini-track-cast{fill:none;stroke-width:10px}.mini-arc{fill:none;stroke:var(--wedge-on);stroke-width:10px;stroke-linecap:round}.mini-arc-dot{fill:var(--wedge-on)}.mini-tonic-dot{fill:var(--panel);opacity:.85}.carry-layer{z-index:20;pointer-events:none;transform:translate(var(--carry-x,-200px), var(--carry-y,-200px)) translate(-50%, -50%);position:fixed;top:0;left:0}.carry-layer .mini-gear{filter:var(--shadow-face);transition:transform .2s cubic-bezier(.34,1.3,.5,1);transform:scale(1.08)}.carry-layer.over .mini-gear{transform:scale(1.4)}.cradle.in-hand .mini-body{visibility:hidden}.hint{text-align:center;max-width:540px;color:var(--muted);margin:0;font-size:13px;line-height:1.5}.theme-dial{cursor:pointer;background:0 0;border:none;border-radius:50%;width:42px;height:42px;padding:0;position:fixed;top:12px;left:12px}.theme-dial:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.theme-dial svg{width:100%;height:100%;display:block}.dial-face{fill:var(--panel);stroke:var(--line);stroke-width:1.5px;filter:var(--shadow-hub)}.dial-rotor{transition:transform .22s cubic-bezier(.34,1.3,.5,1)}.theme-dial:hover .handle{stroke:var(--muted)}.dial-glyph{fill:var(--muted);transition:opacity .18s}.dial-rays{fill:none;stroke:var(--muted);stroke-width:1.4px;stroke-linecap:round}.dial-moon,[data-theme=dark] .dial-sun{opacity:0}[data-theme=dark] .dial-moon{opacity:1}.dev-toggle{cursor:pointer;background:0 0;border:none;border-radius:50%;width:42px;height:42px;padding:0;position:fixed;top:12px;left:62px}.dev-toggle:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.dev-toggle svg{width:100%;height:100%;display:block}.dev-fader-rail{stroke:var(--handle);stroke-width:1.4px;stroke-linecap:round;transition:stroke .18s}.dev-fader-knob{fill:var(--muted);transition:fill .18s}.dev-toggle:hover .dev-fader-rail{stroke:var(--muted)}.dev-toggle:hover .dev-fader-knob,.dev-toggle.open .dev-fader-knob{fill:var(--ink)}.dev-toggle.open .dev-fader-rail{stroke:var(--muted)}.dev-panel{background:var(--panel);border:1px dashed var(--faint);max-width:min(460px,100vw - 24px);color:var(--muted);border-radius:12px;flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:10px;padding:8px 12px;font-size:12px;display:flex;position:fixed;top:62px;right:12px}.dev-tag{letter-spacing:.2em;text-transform:uppercase;color:var(--accent);font-weight:600}.dev-field{align-items:center;gap:6px;display:flex}.dev-panel select{font:inherit;color:var(--ink);background:var(--panel-bright);border:1px solid var(--line);border-radius:8px;padding:3px 6px}.dev-panel input[type=range]{width:60px;accent-color:var(--accent)}.dev-value{font-variant-numeric:tabular-nums;min-width:38px;color:var(--ink)}@media (height<=820px){.app{--pad-y:24px;--gap:16px}}@media (width<=520px){.app{--pad-y:16px;--gap:13px;--controls-gap:12px;--readout-h:60px;--keyboard-h:95px;--rack-h:133px;--hint-h:54px}.scale-name{font-size:clamp(21px,6.2vw,44px)}.rack{--mini-size:42px;gap:2px}.cradle{padding:4px 5px 5px}.cradle-name{letter-spacing:0;font-size:10px}.hint{font-size:12px}.hint-detail,.dev-panel,.dev-toggle{display:none}}@media (height<=620px){.app{--keyboard-h:0px;--hint-h:0px;--controls-gap:0px;--gaps:2;--readout-h:60px}.scale-name{font-size:clamp(19px,2.6vw,27px)}.keyboard,.hint{display:none}}@media (width>=820px){.app{--rack-h:0px;--controls-gap:0px;--gaps:3;--wheel-size:max(260px, min(600px, calc(94vw - 320px), calc(100svh - var(--chrome-h))));grid-template-columns:1fr auto 1fr;grid-template-areas:".readout."".wheel rack"".keyboard.""hint hint hint";place-items:center;display:grid}.controls{display:contents}.readout{grid-area:readout}.wheel{grid-area:wheel}.keyboard{grid-area:keyboard}.hint{grid-area:hint}.rack{flex-flow:column;grid-area:rack;justify-self:start;gap:2px;margin-left:22px}.cradle{--mini-size:34px;flex-direction:row;align-items:center;gap:8px;padding:4px 8px}}@media (width>=820px) and (height<=620px){.app{--keyboard-h:0px;--hint-h:0px;--gaps:1;grid-template-areas:".readout."".wheel rack"}}.app.quiz{--kb-w:min(380px, 92vw, var(--wheel-size));--keyboard-h:101px;--target-h:112px;--gaps:4}.app.quiz .keyboard:not(.keyboard-target){margin-top:-12px}.quiz-dial{cursor:pointer;background:0 0;border:none;border-radius:50%;width:42px;height:42px;padding:0;position:fixed;top:12px;right:12px}.quiz-dial:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.quiz-dial svg{width:100%;height:100%;display:block}.quiz-dial:hover .handle{stroke:var(--muted)}.quiz-ring{fill:none;stroke:var(--muted);stroke-width:1.4px}.quiz-bull{fill:var(--accent)}.quiz-bead{fill:var(--muted)}.quiz-wheel,.quiz-dial.active .quiz-target{opacity:0}.quiz-dial.active .quiz-wheel{opacity:1}.target{width:var(--kb-w);flex-direction:column;align-items:stretch;gap:4px;display:flex}.target .keyboard{width:100%}.target-caption{height:18px;color:var(--muted);justify-content:space-between;align-items:baseline;padding:0 4px;font-size:11px;line-height:18px;display:flex}.target-tag{letter-spacing:.2em;text-transform:uppercase;color:var(--accent);font-weight:600}.target-note{letter-spacing:.04em;transition:color .3s}.app.quiz-solved .target-note{color:var(--ink)}.kb-coin.target{fill:var(--ink)}.kb-coin.target.black{fill:#f2f1ef}.kb-coin.target.root{fill:var(--accent)}.kb-coin.target.painted{animation:.42s cubic-bezier(.34,1.5,.5,1) coin-paint}.kb-coin.target.painted.degree-1{fill:var(--deg-1)}.kb-coin.target.painted.degree-2{fill:var(--deg-2)}.kb-coin.target.painted.degree-3{fill:var(--deg-3)}.kb-coin.target.painted.degree-4{fill:var(--deg-4)}.kb-coin.target.painted.degree-5{fill:var(--deg-5)}.kb-coin.target.painted.degree-6{fill:var(--deg-6)}.kb-coin.target.painted.degree-7{fill:var(--deg-7)}@keyframes coin-paint{0%{transform:scale(1)}35%{transform:scale(1.32)}to{transform:scale(1)}}.scale-name{transition:color .3s}.app.quiz-solved .scale-name{color:var(--accent)}.rack.locked{opacity:.38;transition:opacity .24s}.rack{transition:opacity .24s}.rack.locked .cradle{cursor:default}.rack.locked .cradle:hover .mini-body{transform:none}.level-card{height:calc(var(--kb-w) * 122 / 460 + 22px);background:var(--panel);border:1px solid var(--line);filter:var(--shadow-face);border-radius:16px;flex-direction:column;justify-content:center;align-items:center;gap:6px;display:flex}.level-card-title{letter-spacing:.01em;margin:0;font-size:22px;font-weight:400}.level-card-note{color:var(--muted);letter-spacing:.04em;margin:0;font-size:12.5px}.level-card-button{border:1.5px solid var(--line);background:var(--panel-bright);color:var(--ink);font:inherit;cursor:pointer;border-radius:999px;margin-top:4px;padding:6px 16px;font-size:13px;font-weight:600;transition:border-color .18s,transform .22s cubic-bezier(.34,1.3,.5,1)}.level-card-button:hover{border-color:var(--muted);transform:translateY(-1px)}.level-card-button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.quiz-hud{text-align:center;max-width:540px}.quiz-row{justify-content:center;align-items:center;gap:12px;height:26px;display:flex}.level-pips,.round-pips{align-items:center;margin:0;padding:0;list-style:none;display:flex}.level-pips{gap:4px}.level-pip{border:1.5px solid var(--faint);width:22px;height:22px;color:var(--muted);font:inherit;cursor:pointer;background:0 0;border-radius:50%;padding:0;font-size:11px;font-weight:600;line-height:1;transition:border-color .18s,background-color .18s,color .18s,transform .22s cubic-bezier(.34,1.3,.5,1)}.level-pip:hover:not(:disabled){border-color:var(--muted);transform:translateY(-1px)}.level-pip:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.level-pip.cleared{border-color:var(--ink);background:var(--ink);color:var(--panel)}.level-pip.locked{opacity:.5;cursor:default;border-style:dashed}.round-pips{gap:7px}.round-pip{border:1.5px solid var(--faint);border-radius:50%;width:9px;height:9px;transition:background-color .22s,border-color .22s,transform .26s cubic-bezier(.34,1.5,.5,1)}.round-pip.current{border-color:var(--accent);animation:1.8s ease-in-out infinite pip-breathe}.round-pip.done{border-color:var(--accent);background:var(--accent);transform:scale(1.1)}@keyframes pip-breathe{0%,to{transform:scale(1)}50%{transform:scale(1.3)}}.quiz-divider{background:var(--line);width:1px;height:16px}.quiz-pool{align-items:center;gap:1px;display:flex}.quiz-pool .mini-gear{width:24px}.quiz-pool .mini-cradle{display:none}.quiz-swap{fill:none;width:15px;height:15px;stroke:var(--muted);stroke-width:2px;stroke-linecap:round;stroke-linejoin:round;margin-left:4px}.quiz-caption{color:var(--muted);margin:6px 0 0;font-size:13px;line-height:1.5}.quiz-caption strong{color:var(--ink);font-weight:600}@media (width<=520px){.app.quiz{--keyboard-h:97px;--target-h:120px;--hint-h:66px}.quiz-caption{font-size:12px}.quiz-detail{display:none}.level-card-title{font-size:18px}}@media (height<=620px){.app.quiz{--keyboard-h:101px;--hint-h:78px;--controls-gap:16px;--gaps:4}.app.quiz .keyboard,.app.quiz .quiz-hud{display:block}}@media (width>=820px){.app.quiz{--controls-gap:0px;--hint-h:0px;--gaps:3;grid-template-areas:".readout.""hud wheel rack"".target."".keyboard."}.target{grid-area:target}.quiz-hud{text-align:right;grid-area:hud;justify-self:end;width:168px;margin-right:22px}.quiz-row{flex-direction:column;align-items:flex-end;gap:9px;height:auto}.quiz-divider{display:none}.level-pips{gap:3px}.level-pip{width:20px;height:20px;font-size:10px}.quiz-caption{margin-top:12px;font-size:12px;line-height:1.45}}@media (width>=820px) and (height<=620px){.app.quiz{--keyboard-h:101px;--hint-h:0px;--gaps:3;grid-template-areas:".readout.""hud wheel rack"".target."".keyboard."}}.app.tour{--tour-panel-h:204px;--rack-h:0px;--controls-gap:0px;--hint-h:var(--tour-panel-h);--gaps:3}@media (width<=520px){.app.tour{--tour-panel-h:220px}}@media (height<=620px){.app.tour{--keyboard-h:0px;--hint-h:var(--tour-panel-h);--gaps:2}.app.tour .keyboard{display:none}}@media (width>=820px){.app.tour{--wheel-size:max(260px, min(600px, 94vw, calc(100svh - var(--chrome-h))));grid-template-areas:".readout."".wheel."".keyboard.""panel panel panel"}.tour-panel{grid-area:panel}}@media (width>=820px) and (height<=620px){.app.tour{--gaps:2;grid-template-areas:".readout."".wheel.""panel panel panel"}}@media (width>=1000px){.app.tour{--hint-h:0px;--gaps:2;--wheel-size:max(260px, min(600px, calc(94vw - 640px), calc(100svh - var(--chrome-h))));grid-template-areas:".readout.""panel wheel."".keyboard."}.app.tour .tour-panel{grid-template:"head""keysig""body""nav"/1fr;justify-self:end;align-items:start;row-gap:12px;width:296px;height:auto;margin-right:24px}.app.tour .keysig{align-items:flex-start}.app.tour .keysig-slot{display:none}.app.tour .tour-nav{justify-content:flex-start;padding-top:4px}}@media (width>=1000px) and (height<=620px){.app.tour{--gaps:1;grid-template-areas:".readout.""panel wheel."}}[data-look=monument]{--mv-plate:#d9d7d3;--mv-plate-active:#e2e0dc;--mv-face:#fcfcfb;--mv-track:#f0efec;--mv-track-active:#e5e3e0;--mv-ring:#e2e0dd;--mv-ring-active:#d5d3cf;--mv-solid:#5d5c62;--mv-letter:#c5c3c1;--mv-letter-strong:#4b4a4f;--mv-socket:#4b4a4f1f;--mv-coin-text:#fff;--mv-wedge-alpha:.16;--mv-shadow:#4b4a4f29;--mv-cast:#4b4a4f;--mv-cast-alpha:.16}[data-look=monument][data-theme=dark]{--mv-plate:#3a3a40;--mv-plate-active:#45454b;--mv-face:#242428;--mv-track:#2d2d32;--mv-track-active:#38383e;--mv-ring:#343439;--mv-ring-active:#404046;--mv-solid:#cfced4;--mv-letter:#55545b;--mv-letter-strong:#d8d7dc;--mv-socket:#d8d7dc1f;--mv-coin-text:#fffdf8;--mv-wedge-alpha:.24;--mv-shadow:#00000073;--mv-cast:#000;--mv-cast-alpha:.45}[data-look=monument][data-palette=dawn]{--mv-plate:#ddb897;--mv-plate-active:#e6c7a9;--mv-face:#faf3e6;--mv-track:#efe2cc;--mv-track-active:#e9d7b8;--mv-ring:#cfdccf;--mv-ring-active:#bed3c2;--mv-solid:#55506b;--mv-letter:#8a7d6d;--mv-letter-strong:#55483a;--mv-socket:#7a4f3824;--mv-coin-text:#fffdf8;--mv-wedge-alpha:.16;--mv-shadow:#7a4a3238;--mv-cast:#7a4a32;--mv-cast-alpha:.22;--kb-white:#fffdf6;--kb-black:#55506b;--panel:#f9f2e3;--panel-bright:#fffdf6;--ink:#4f4335;--muted:#9a8875;--faint:#c9b8a2;--line:#e7d6c0;--wedge-on:#55506b;--shadow-face:drop-shadow(0 2px 0 #7a4a322e);--shadow-hub:drop-shadow(0 2px 0 #7a4a322e)}[data-look=monument][data-palette=dawn][data-theme=dark]{--mv-plate:#3b3d68;--mv-plate-active:#474a7c;--mv-face:#2b2c4e;--mv-track:#37385f;--mv-track-active:#424373;--mv-ring:#3d4f4b;--mv-ring-active:#4a635c;--mv-solid:#ece6f4;--mv-letter:#9b95b8;--mv-letter-strong:#e9e4f4;--mv-socket:#e9e4f41f;--mv-coin-text:#fffdf8;--mv-wedge-alpha:.24;--mv-shadow:#00000073;--mv-cast:#000;--mv-cast-alpha:.45;--kb-white:#414272;--kb-black:#191932;--panel:#2b2c4e;--panel-bright:#363764;--ink:#e9e4f4;--muted:#9b95b8;--faint:#5b5c86;--line:#42436f;--wedge-on:#ece6f4;--shadow-face:drop-shadow(0 2px 0 #0006);--shadow-hub:drop-shadow(0 2px 0 #0006)}[data-look=monument][data-palette=dawn] body:before{background:linear-gradient(#f6eee1,#edd5c4)}[data-look=monument][data-palette=dawn] body:after{background:linear-gradient(#272848,#131327)}.mv-cast{pointer-events:none;fill:var(--mv-cast,transparent);stroke:var(--mv-cast,transparent);opacity:var(--mv-cast-alpha,0);transition:transform .22s}.cast-plate{transform:translateY(5px)}.cast-band{transform:translateY(3px)}.cast-mini{transform:translateY(2px)}.mv-plate-cast{stroke-width:8px;stroke-linejoin:round}.mv-root-ring-cast,.mv-scale-track-cast{fill:none;stroke-width:26px}.mv-pointer-cast{stroke-width:5px;stroke-linejoin:round}.mv-face{fill:var(--mv-face);filter:drop-shadow(0 4px 0 var(--mv-shadow))}.mv-plate{fill:var(--mv-plate);stroke:var(--mv-plate);stroke-width:8px;stroke-linejoin:round;transition:fill .16s,stroke .16s}.wheel-monument.key-hover .mv-plate,.wheel-monument.key-engaged .mv-plate{fill:var(--mv-plate-active);stroke:var(--mv-plate-active)}.wheel-monument.key-engaged .cast-band{transform:translateY(7px)}.wheel-monument.key-engaged .stays{opacity:.65}.wheel-monument.key-hover .follows .mv-root-ring,.wheel-monument.key-engaged .follows .mv-root-ring{stroke:var(--mv-ring-active)}.wheel-monument.key-hover .follows .mv-scale-track,.wheel-monument.key-engaged .follows .mv-scale-track,.wheel-monument.middle-hover .gear-middle .mv-scale-track,.wheel-monument .gear-middle.dragging .mv-scale-track{stroke:var(--mv-track-active)}.wheel-monument.root-hover .gear-root .mv-root-ring,.wheel-monument .gear-root.dragging .mv-root-ring{stroke:var(--mv-ring-active)}.mv-root-ring{fill:none;stroke:var(--mv-ring);stroke-width:26px;transition:stroke .16s}.mv-root-dot,.mv-slot-dot,.mv-socket{fill:var(--mv-socket)}.mv-pointer{fill:var(--accent);stroke:var(--accent);stroke-width:5px;stroke-linejoin:round}.mv-scale-track{fill:none;stroke:var(--mv-track);stroke-width:26px;transition:stroke .16s}.mv-scale-arc{fill:none;stroke:var(--mv-solid);stroke-width:26px;stroke-linecap:round;transition:opacity .2s}.mv-scale-arc-dot{fill:var(--mv-solid);transition:opacity .2s}.wheel-monument.drop-target .mv-scale-track{stroke:var(--mv-track-active)}.wheel-monument.drop-target .mv-scale-arc,.wheel-monument.drop-target .mv-scale-arc-dot{opacity:.3}.mv-tonic-dot{fill:var(--mv-face);opacity:.85}.mv-wedge{stroke-width:6px;stroke-linejoin:round;opacity:0;transition:opacity .2s,fill .24s,stroke .24s}.mv-wedge.on{opacity:var(--mv-wedge-alpha)}.wheel-monument .note-label{fill:var(--mv-letter);font-size:13px;font-weight:450}.wheel-monument .note-label.in-scale{fill:var(--mv-letter-strong);font-weight:550}.wheel-monument .note-label.root{fill:var(--accent)}.mv-coin{opacity:0;transition:opacity .18s,transform .26s cubic-bezier(.34,1.5,.5,1),fill .24s;transform:scale(.5)}.mv-coin.on{opacity:1;transform:scale(1)}.mv-coin-cast{fill:var(--mv-shadow,transparent)}.wheel-monument .gear text.mv-coin-numeral{fill:var(--mv-coin-text);opacity:0;font-size:19px;font-weight:600;transition:transform .22s cubic-bezier(.34,1.3,.5,1),opacity .18s}.wheel-monument .gear.dragging text.mv-coin-numeral{transition:opacity .18s}.wheel-monument .gear text.mv-coin-numeral.on{opacity:1}.mv-halo{pointer-events:none;filter:blur(7px);animation:.62s ease-out forwards mv-halo-fade}@keyframes mv-halo-fade{0%{opacity:.95;transform:scale(.9)}to{opacity:0;transform:scale(1.5)}}.mv-hub{fill:var(--accent);filter:drop-shadow(0 3px 0 var(--mv-shadow));transition:transform .22s cubic-bezier(.34,1.3,.5,1)}.wheel-monument.drop-target .mv-hub{transform:scale(1.07)}.wheel-monument .hub-caption{fill:var(--mv-coin-text);opacity:.7}.wheel-monument .hub-note{fill:var(--mv-coin-text);font-size:32px;font-weight:500}[data-look=monument] .kb-white{stroke:none;filter:drop-shadow(0 3px 0 var(--mv-shadow))}[data-look=monument] .kb-black{filter:drop-shadow(0 2px 0 var(--mv-shadow))}[data-look=monument] .kb-coin-cast{fill:var(--mv-shadow)}[data-look=monument] .kb-coin-numeral{fill:var(--mv-coin-text)}[data-look=monument] .mini-cradle{stroke:var(--mv-socket)}[data-look=monument] .mini-track{stroke:var(--mv-track)}[data-look=monument] .mini-arc{stroke:var(--mv-solid)}[data-look=monument] .mini-arc-dot{fill:var(--mv-solid)}[data-look=monument] .mini-tonic-dot{fill:var(--mv-face)}[data-look=draft]{--dr-sheet:#f8f5ee;--dr-ink:#3d434c;--dr-line:#3d434c9e;--dr-line-faint:#3d434c42;--dr-line-ghost:#3d434c21;--dr-hatch:#3d434c8c;--dr-run-fill:#3d434c0d;--dr-letter:#a9aab0;--dr-letter-strong:#3d434c;--bg-top:#f7f4ec;--bg-bottom:#efebe1;--panel:#faf8f2;--panel-bright:#fffdf8;--ink:#3d434c;--muted:#8b8f96;--faint:#c3c4c6;--line:#dcdad2;--band:#efece4;--band-active:#e4e0d6;--wedge-off:#ebe8e0;--wedge-on:#3d434c;--handle:#b7b6b0;--kb-white:#fffdf8;--kb-black:#3d434c;--shadow-face:none;--shadow-hub:none}[data-look=draft][data-theme=dark]{--dr-sheet:#1c3a5e;--dr-ink:#e6f0fa;--dr-line:#e6f0faa8;--dr-line-faint:#e6f0fa4d;--dr-line-ghost:#e6f0fa26;--dr-hatch:#e6f0fa99;--dr-run-fill:#e6f0fa0f;--dr-letter:#6f8cab;--dr-letter-strong:#e6f0fa;--bg-top:#1a3757;--bg-bottom:#12294a;--panel:#1f3f65;--panel-bright:#27496f;--ink:#e6f0fa;--muted:#8fb0cf;--faint:#4e7199;--line:#34587f;--band:#24476d;--band-active:#2d5379;--wedge-off:#27496f;--wedge-on:#e6f0fa;--handle:#4e7199;--kb-white:#2a4d74;--kb-black:#10233b;--shadow-face:none;--shadow-hub:none}[data-look=draft] body:before{background:repeating-linear-gradient(0deg,#3d434c0e 0 1px,#0000 1px 28px),repeating-linear-gradient(90deg,#3d434c0e 0 1px,#0000 1px 28px),linear-gradient(#f7f4ec,#efebe1)}[data-look=draft] body:after{background:repeating-linear-gradient(0deg,#e6f0fa12 0 1px,#0000 1px 28px),repeating-linear-gradient(90deg,#e6f0fa12 0 1px,#0000 1px 28px),linear-gradient(#1a3757,#12294a)}[data-look=draft] .scale-name{letter-spacing:.04em}.dr-sheet{fill:var(--dr-sheet)}.dr-centerline{fill:none;stroke:var(--dr-line-faint);stroke-width:.8px;stroke-dasharray:9 4 1.5 4}.dr-line{fill:none;stroke:var(--dr-line);stroke-width:.9px;transition:stroke .16s}.dr-tick{fill:none;stroke:var(--dr-line);stroke-linecap:butt;transition:stroke .16s}.dr-tick-fine{stroke-width:.6px}.dr-tick-medium{stroke-width:.9px}.dr-tick-coarse{stroke-width:1.3px}.dr-station{fill:var(--dr-sheet);stroke:var(--dr-line);stroke-width:.9px;transition:stroke .16s}.dr-cross{fill:none;stroke:var(--dr-line-ghost);stroke-width:.8px}.dr-degree{letter-spacing:.04em;fill:var(--dr-line-faint);font-size:6.5px;font-weight:500;transition:fill .16s}.wheel-draft.key-hover .dr-key-line,.wheel-draft.key-engaged .dr-key-line{stroke:var(--dr-ink)}.wheel-draft.key-hover .dr-degree,.wheel-draft.key-engaged .dr-degree{fill:var(--dr-line)}.wheel-draft.key-hover .follows .dr-root-line,.wheel-draft.key-engaged .follows .dr-root-line,.wheel-draft.key-hover .follows .dr-scale-line,.wheel-draft.key-engaged .follows .dr-scale-line,.wheel-draft.middle-hover .gear-middle .dr-scale-line,.wheel-draft .gear-middle.dragging .dr-scale-line,.wheel-draft.root-hover .gear-root .dr-root-line,.wheel-draft .gear-root.dragging .dr-root-line{stroke:var(--dr-ink)}.wheel-draft.key-engaged .stays{opacity:.55}.dr-arrow-leader{stroke:var(--accent);stroke-width:1.4px}.dr-arrow-origin{fill:var(--dr-sheet);stroke:var(--accent);stroke-width:1.4px}.dr-arrow-head{fill:var(--accent)}.dr-run-fill{fill:var(--dr-run-fill);stroke:none;transition:opacity .2s}circle.dr-run-fill{fill:none;stroke:var(--dr-run-fill);stroke-width:18px}.dr-hatch{fill:none;stroke:var(--dr-hatch);stroke-width:.8px;transition:opacity .2s}.dr-run-wall{fill:none;stroke:var(--dr-ink);stroke-width:1.2px;transition:opacity .2s}.dr-tonic{fill:var(--dr-sheet);stroke:var(--dr-ink);stroke-width:1.3px}.dr-tonic-point{fill:var(--dr-ink)}.wheel-draft.drop-target .dr-scale-line{stroke:var(--dr-ink)}.wheel-draft.drop-target .dr-run{opacity:.3;transition:opacity .2s}.dr-run{transition:opacity .2s}.wheel-draft .note-label{letter-spacing:.06em;fill:var(--dr-letter);font-size:12.5px;font-weight:500}.wheel-draft .note-label.in-scale{fill:var(--dr-letter-strong);font-weight:600}.wheel-draft .note-label.root{fill:var(--accent)}.dr-balloon{opacity:0;transition:opacity .18s,color .24s}.dr-balloon.on{opacity:1}.dr-balloon-ring{fill:var(--dr-sheet);stroke:currentColor;stroke-width:1.5px}.wheel-draft .gear text.dr-balloon-numeral{fill:currentColor;font-size:12.5px;font-weight:600}.dr-ripple{pointer-events:none;fill:none;stroke-width:1.4px;animation:.62s ease-out forwards dr-ripple}@keyframes dr-ripple{0%{opacity:.95;transform:scale(.9)}to{opacity:0;transform:scale(2.1)}}.dr-hub{fill:var(--dr-sheet);stroke:var(--dr-line);stroke-width:1.1px;transition:transform .22s cubic-bezier(.34,1.3,.5,1)}.wheel-draft.drop-target .dr-hub{transform:scale(1.07)}.wheel-draft .hub-caption{fill:var(--muted)}.wheel-draft .hub-note{fill:var(--dr-ink);font-size:30px;font-weight:400}[data-look=draft] .kb-white{stroke:var(--dr-line-faint);stroke-width:1px;filter:none}[data-look=draft] .kb-black{filter:none}[data-look=draft] .mini-track{stroke:var(--dr-line-ghost)}[data-look=draft] .mini-arc{stroke:var(--dr-ink)}[data-look=draft] .mini-arc-dot{fill:var(--dr-ink)}[data-look=draft] .mini-tonic-dot{fill:var(--dr-sheet)}[data-look=draft] .mini-cradle{stroke:var(--dr-line-ghost)}[data-look=cogwork]{--cg-plate:#d0cec9;--cg-plate-active:#dad8d3;--cg-face:#f8f7f4;--cg-ring:#e5e3df;--cg-ring-active:#d9d7d2;--cg-peg:#4b4a4f24;--cg-track:#eeedea;--cg-track-active:#e3e1dd;--cg-solid:#5d5c62;--cg-disc:#fcfcfb;--cg-lobe:#e8e6e2;--cg-nut:#fff;--cg-letter:#b9b8b6;--cg-letter-strong:#4b4a4f;--cg-numeral:#fff;--cg-shadow:#4b4a4f24}[data-look=cogwork][data-theme=dark]{--cg-plate:#3c3c42;--cg-plate-active:#47474d;--cg-face:#232327;--cg-ring:#333338;--cg-ring-active:#3f3f45;--cg-peg:#d8d7dc24;--cg-track:#2c2c31;--cg-track-active:#37373c;--cg-solid:#d3d2d8;--cg-disc:#29292d;--cg-lobe:#353539;--cg-nut:#303035;--cg-letter:#5d5c63;--cg-letter-strong:#d8d7dc;--cg-numeral:#fffdf8;--cg-shadow:#00000080}.cg-plate{fill:var(--cg-plate);stroke:var(--cg-plate);stroke-width:3px;stroke-linejoin:round;transition:fill .16s,stroke .16s}.wheel-cogwork.key-hover .cg-plate,.wheel-cogwork.key-engaged .cg-plate{fill:var(--cg-plate-active);stroke:var(--cg-plate-active)}.cg-face{fill:var(--cg-face);filter:drop-shadow(0 3px 0 var(--cg-shadow))}.wheel-cogwork.key-hover .follows .cg-root,.wheel-cogwork.key-engaged .follows .cg-root,.wheel-cogwork.root-hover .gear-root .cg-root,.wheel-cogwork .gear-root.dragging .cg-root{fill:var(--cg-ring-active);stroke:var(--cg-ring-active)}.wheel-cogwork.key-hover .follows .cg-track,.wheel-cogwork.key-engaged .follows .cg-track,.wheel-cogwork.middle-hover .gear-middle .cg-track,.wheel-cogwork .gear-middle.dragging .cg-track{stroke:var(--cg-track-active)}.wheel-cogwork.key-engaged .stays{opacity:.65}.cg-root{fill:var(--cg-ring);stroke:var(--cg-ring);stroke-width:2.5px;stroke-linejoin:round;transition:fill .16s,stroke .16s}.cg-peg{fill:var(--cg-peg)}.cg-dog{fill:var(--accent)}.cg-track{fill:none;stroke:var(--cg-track);stroke-width:22px;transition:stroke .16s}.cg-slot{fill:var(--cg-peg)}.cg-cam{fill:none;stroke:var(--cg-solid);stroke-width:26px;stroke-linecap:round;transition:opacity .2s}.cg-cam-dot{fill:var(--cg-solid);transition:opacity .2s}.cg-tonic{fill:var(--cg-face);opacity:.85}.wheel-cogwork.drop-target .cg-track{stroke:var(--cg-track-active)}.wheel-cogwork.drop-target .cg-cam,.wheel-cogwork.drop-target .cg-cam-dot{opacity:.3}.cg-disc{fill:var(--cg-disc)}.cg-lobe{fill:var(--cg-lobe);stroke:var(--cg-lobe);stroke-width:4px;stroke-linejoin:round;transition:fill .24s,stroke .24s}.wheel-cogwork .note-label{fill:var(--cg-letter);font-size:13px;font-weight:450}.wheel-cogwork .note-label.in-scale{fill:var(--cg-letter-strong);font-weight:550}.wheel-cogwork .note-label.root{fill:var(--accent)}.wheel-cogwork .gear text.cg-lobe-numeral{fill:var(--cg-numeral);opacity:0;font-size:15px;font-weight:650;transition:transform .22s cubic-bezier(.34,1.3,.5,1),opacity .18s}.wheel-cogwork .gear.dragging text.cg-lobe-numeral{transition:opacity .18s}.wheel-cogwork .gear text.cg-lobe-numeral.on{opacity:1}.cg-halo{pointer-events:none;filter:blur(7px);animation:.62s ease-out forwards cg-halo-fade}@keyframes cg-halo-fade{0%{opacity:.95;transform:scale(.9)}to{opacity:0;transform:scale(1.5)}}.cg-nut{fill:var(--cg-nut);stroke:var(--cg-nut);stroke-width:6px;stroke-linejoin:round;filter:drop-shadow(0 2px 0 var(--cg-shadow));transition:transform .22s cubic-bezier(.34,1.3,.5,1)}.wheel-cogwork.drop-target .cg-nut{transform:scale(1.07)}.wheel-cogwork .hub-caption{fill:var(--muted)}.wheel-cogwork .hub-note{fill:var(--cg-letter-strong);font-size:30px;font-weight:500}[data-look=cogwork] .kb-white{stroke:none;filter:drop-shadow(0 3px 0 var(--cg-shadow))}[data-look=cogwork] .kb-black{filter:drop-shadow(0 2px 0 var(--cg-shadow))}[data-look=cogwork] .mini-track{stroke:var(--cg-track)}[data-look=cogwork] .mini-arc{stroke:var(--cg-solid)}[data-look=cogwork] .mini-arc-dot{fill:var(--cg-solid)}[data-look=cogwork] .mini-tonic-dot{fill:var(--cg-face)}[data-look=cogwork] .mini-cradle{stroke:var(--cg-peg)}[data-look=orrery]{--or-field:#ffffff80;--or-orbit:#4b4a4f47;--or-orbit-faint:#4b4a4f29;--or-orbit-strong:#4b4a4f;--or-dust:#4b4a4f38;--or-void:#4b4a4f4d;--or-node:#5d5c62;--or-letter:#b3b2b6;--or-letter-strong:#4b4a4f;--or-numeral:#fff;--or-corona-alpha:.22;--bg-top:#f5f7fb;--bg-bottom:#e9edf4}[data-look=orrery][data-theme=dark]{--or-field:#ffffff05;--or-orbit:#dee4f552;--or-orbit-faint:#dee4f52e;--or-orbit-strong:#e4e9f7;--or-dust:#dee4f542;--or-void:#dee4f552;--or-node:#e4e9f7;--or-letter:#5a6382;--or-letter-strong:#e4e9f7;--or-numeral:#fffdf8;--or-corona-alpha:.32;--bg-top:#0e1424;--bg-bottom:#070a14;--panel:#161c30;--panel-bright:#1e2540;--ink:#e0e5f2;--muted:#8a93ad;--faint:#4a5270;--line:#2a3250;--band:#1c2338;--band-active:#262e48;--wedge-off:#222a42;--wedge-on:#e0e5f2;--handle:#4a5270;--kb-white:#2a3250;--kb-black:#0e121f;--shadow-face:drop-shadow(0 2px 6px #0000008c);--shadow-hub:drop-shadow(0 1px 3px #0009)}[data-look=orrery] body:before{background:linear-gradient(#f5f7fb,#e9edf4)}[data-look=orrery] body:after{background:radial-gradient(1px 1px at 23px 41px,#ffffff8c 50%,#0000 100%) 0 0/211px 211px,radial-gradient(1px 1px at 131px 97px,#fff6 50%,#0000 100%) 0 0/211px 211px,radial-gradient(1.4px 1.4px at 77px 163px,#ffffff80 50%,#0000 100%) 0 0/277px 277px,radial-gradient(1px 1px at 189px 29px,#ffffff59 50%,#0000 100%) 0 0/277px 277px,radial-gradient(1px 1px at 61px 227px,#ffffff73 50%,#0000 100%) 0 0/331px 331px,radial-gradient(1.2px 1.2px at 241px 151px,#ffffff61 50%,#0000 100%) 0 0/331px 331px,linear-gradient(#0e1424,#070a14)}.or-field{fill:var(--or-field)}.or-corona-in{stop-color:var(--accent);stop-opacity:var(--or-corona-alpha)}.or-corona-out{stop-color:var(--accent);stop-opacity:0}.or-corona{fill:url(#or-corona);transition:transform .22s cubic-bezier(.34,1.3,.5,1)}.or-sun{fill:var(--accent);transition:transform .22s cubic-bezier(.34,1.3,.5,1)}.or-sun-shade{transition:transform .22s cubic-bezier(.34,1.3,.5,1)}.wheel-orrery.drop-target .or-sun,.wheel-orrery.drop-target .or-sun-shade,.wheel-orrery.drop-target .or-corona{transform:scale(1.07)}.or-shade{fill:url(#or-shade);pointer-events:none}.wheel-orrery .hub-caption{fill:var(--or-numeral);opacity:.75}.wheel-orrery .hub-note{fill:var(--or-numeral);font-size:30px;font-weight:500}.or-orbit{fill:none;stroke:var(--or-orbit);stroke-width:.9px;transition:stroke .16s}.or-orbit-inner{stroke:var(--or-orbit-faint);stroke-dasharray:2 3}.or-tick{fill:none;stroke:var(--or-orbit);stroke-width:.8px;transition:stroke .16s}.or-station{fill:var(--or-node);transition:fill .16s}.or-dust{fill:var(--or-dust)}.wheel-orrery.key-hover .or-key-line,.wheel-orrery.key-engaged .or-key-line,.wheel-orrery.key-hover .follows .or-root-line,.wheel-orrery.key-engaged .follows .or-root-line,.wheel-orrery.key-hover .follows .or-scale-line,.wheel-orrery.key-engaged .follows .or-scale-line,.wheel-orrery.middle-hover .gear-middle .or-scale-line,.wheel-orrery .gear-middle.dragging .or-scale-line,.wheel-orrery.root-hover .gear-root .or-root-line,.wheel-orrery .gear-root.dragging .or-root-line{stroke:var(--or-orbit-strong)}.wheel-orrery.key-engaged .stays{opacity:.55}.or-body{transition:transform .22s cubic-bezier(.34,1.3,.5,1)}.gear.dragging .or-body,.wheel-orrery.key-engaged .follows .or-body{transition:none}.or-moon{fill:var(--accent)}.or-void{fill:none;stroke:var(--or-void);stroke-width:.9px}.or-link{fill:none;stroke:var(--or-node);stroke-width:2px;transition:opacity .2s}.or-node{fill:var(--or-node);transition:opacity .2s}.or-tonic{fill:none;stroke:var(--or-node);stroke-width:.9px;opacity:.7}.wheel-orrery.drop-target .or-scale-line{stroke:var(--or-orbit-strong)}.wheel-orrery.drop-target .or-link,.wheel-orrery.drop-target .or-node{opacity:.3}.wheel-orrery .note-label{fill:var(--or-letter);font-size:12.5px;font-weight:450}.wheel-orrery .note-label.in-scale{fill:var(--or-letter-strong);font-weight:550}.wheel-orrery .note-label.root{fill:var(--accent)}.or-planet{opacity:0;transition:opacity .18s,transform .26s cubic-bezier(.34,1.5,.5,1);transform:scale(.4)}.or-planet.on{opacity:1;transform:scale(1)}.or-globe{transition:fill .24s}.or-ring{fill:none;stroke:var(--or-numeral);stroke-width:1.6px;opacity:0;transition:opacity .2s}.or-planet.ringed .or-ring{opacity:.8}.wheel-orrery .gear text.or-numeral{fill:var(--or-numeral);font-size:14px;font-weight:600}.or-halo{pointer-events:none;filter:blur(7px);animation:.62s ease-out forwards or-halo-fade}@keyframes or-halo-fade{0%{opacity:.95;transform:scale(.9)}to{opacity:0;transform:scale(1.5)}}[data-look=orrery] .mini-track{stroke:var(--or-orbit-faint);stroke-width:2px}[data-look=orrery] .mini-arc{stroke:var(--or-node);stroke-width:5px}[data-look=orrery] .mini-arc-dot{fill:var(--or-node)}[data-look=orrery] .mini-tonic-dot{fill:var(--or-node);opacity:1}[data-look=orrery] .mini-cradle{stroke:var(--or-orbit-faint);stroke-width:2px}[data-look=swiss]{--sw-ink:#4b4a4f;--sw-ink-soft:#85848a;--sw-light:#c0bfbd;--sw-rail:#4b4a4f29;--sw-rail-dot:#4b4a4f38;--sw-numeral:#fff;--bg-top:#f6f5f3;--bg-bottom:#ecebe9;--panel:#f9f8f6;--panel-bright:#fdfdfc;--ink:#4b4a4f;--muted:#8e8d90;--faint:#c4c3c1;--line:#dedddb;--band:#eeedeb;--band-active:#e2e1de;--wedge-off:#e9e8e5;--wedge-on:#4b4a4f;--handle:#b9b8b5;--kb-white:#fbfbfa;--kb-black:#4f4e53;--shadow-face:none;--shadow-hub:none}[data-look=swiss][data-theme=dark]{--sw-ink:#d6d5d9;--sw-ink-soft:#97969b;--sw-light:#56555b;--sw-rail:#d6d5d929;--sw-rail-dot:#d6d5d938;--sw-numeral:#1d1d20;--bg-top:#1e1e21;--bg-bottom:#171719;--panel:#232326;--panel-bright:#2a2a2e;--ink:#d6d5d9;--muted:#8e8d92;--faint:#55545a;--line:#363539;--band:#2a2a2e;--band-active:#35353a;--wedge-off:#2e2e32;--wedge-on:#d6d5d9;--handle:#5a595f;--kb-white:#3a3a40;--kb-black:#1a1a1d;--shadow-face:none;--shadow-hub:none}[data-look=swiss] body:before{background:linear-gradient(#f6f5f3,#ecebe9)}[data-look=swiss] body:after{background:linear-gradient(#1e1e21,#171719)}[data-look=swiss] .scale-name{letter-spacing:-.01em;font-weight:700}[data-look=swiss] .scale-notes{font-weight:500}.sw-minute{fill:none;stroke:var(--sw-ink);stroke-width:1.3px;stroke-linecap:butt;transition:stroke .16s}.sw-bar{fill:var(--sw-ink);transition:fill .16s}.wheel-swiss.key-hover .sw-minute,.wheel-swiss.key-engaged .sw-minute{stroke:var(--sw-ink-soft)}.wheel-swiss.key-hover .sw-bar,.wheel-swiss.key-engaged .sw-bar{fill:var(--sw-ink-soft)}.sw-rail{fill:none;stroke:var(--sw-rail);stroke-width:.8px;transition:stroke .16s}.sw-rail-dot{fill:var(--sw-rail-dot)}.wheel-swiss.key-hover .follows .sw-root-rail,.wheel-swiss.key-engaged .follows .sw-root-rail,.wheel-swiss.key-hover .follows .sw-scale-rail,.wheel-swiss.key-engaged .follows .sw-scale-rail,.wheel-swiss.middle-hover .gear-middle .sw-scale-rail,.wheel-swiss .gear-middle.dragging .sw-scale-rail,.wheel-swiss.root-hover .gear-root .sw-root-rail,.wheel-swiss .gear-root.dragging .sw-root-rail{stroke:var(--sw-ink)}.wheel-swiss.key-engaged .stays{opacity:.5}.sw-hand{fill:var(--accent)}.sw-arc{fill:none;stroke:var(--sw-ink);stroke-width:11px;stroke-linecap:butt;transition:opacity .2s}.sw-arc-dot{fill:var(--sw-ink);transition:opacity .2s}.sw-tonic{fill:var(--panel)}.wheel-swiss.drop-target .sw-scale-rail{stroke:var(--sw-ink)}.wheel-swiss.drop-target .sw-arc,.wheel-swiss.drop-target .sw-arc-dot{opacity:.25}.wheel-swiss .note-label{fill:var(--sw-light);font-size:20px;font-weight:300}.wheel-swiss .note-label.in-scale{fill:var(--sw-ink);font-weight:700}.wheel-swiss .note-label.root{fill:var(--accent)}.sw-square-seat{transition:transform .22s cubic-bezier(.34,1.3,.5,1)}.gear.dragging .sw-square-seat{transition:none}.sw-square{opacity:0;transition:opacity .18s,transform .26s cubic-bezier(.34,1.5,.5,1);transform:scale(.5)}.sw-square.on{opacity:1;transform:scale(1)}.sw-square-fill{transition:fill .24s}.wheel-swiss .gear text.sw-square-numeral{fill:var(--sw-numeral);font-size:11px;font-weight:700}.sw-halo{pointer-events:none;animation:.56s ease-out forwards sw-halo}@keyframes sw-halo{0%{opacity:.85;transform:scale(1)}to{opacity:0;transform:scale(2.6)}}.sw-hub{fill:var(--panel);stroke:var(--sw-rail);stroke-width:.8px;transition:transform .22s cubic-bezier(.34,1.3,.5,1)}.wheel-swiss.drop-target .sw-hub{transform:scale(1.07)}.wheel-swiss .hub-caption{fill:var(--sw-ink-soft);font-weight:700}.wheel-swiss .hub-note{fill:var(--sw-ink);font-size:34px;font-weight:700}[data-look=swiss] .kb-white{stroke:var(--line);filter:none}[data-look=swiss] .kb-black{filter:none}[data-look=swiss] .mini-track{stroke:var(--sw-rail);stroke-width:2px}[data-look=swiss] .mini-arc{stroke:var(--sw-ink);stroke-width:8px;stroke-linecap:butt}[data-look=swiss] .mini-arc-dot{fill:var(--sw-ink)}[data-look=swiss] .mini-tonic-dot{fill:var(--panel)}[data-look=swiss] .mini-cradle{stroke:var(--sw-rail);stroke-width:2px}[data-look=swiss] .cradle-name{text-transform:uppercase;letter-spacing:.08em;font-size:10px;font-weight:600}[data-look=enamel]{--en-face:#f5f4f1;--en-scale-edge:#d3d1cc;--en-scale-crown:#f2f1ee;--en-scale-crown-active:#fbfaf8;--en-root-edge:#cbc9c4;--en-root-crown:#ecebe8;--en-root-crown-active:#f7f6f3;--en-key-edge:#bab8b3;--en-key-crown:#e1dfdb;--en-key-crown-active:#ebe9e5;--en-arc-edge:#3f3e44;--en-arc-crown:#6b6a71;--en-socket:#4b4a4f12;--en-dimple:#4b4a4f21;--en-highlight:#ffffffb3;--en-letter:#b6b5b3;--en-letter-strong:#4b4a4f;--en-numeral:#fff;--en-shadow:#4b4a4f2e}[data-look=enamel][data-theme=dark]{--en-face:#26262a;--en-scale-edge:#1b1b1e;--en-scale-crown:#3a3a40;--en-scale-crown-active:#46464d;--en-root-edge:#18181b;--en-root-crown:#3f3f45;--en-root-crown-active:#4b4b52;--en-key-edge:#141416;--en-key-crown:#46464c;--en-key-crown-active:#525258;--en-arc-edge:#a9a8ae;--en-arc-crown:#e6e5ea;--en-socket:#ffffff0d;--en-dimple:#00000061;--en-highlight:#fff3;--en-letter:#5b5a61;--en-letter-strong:#d8d7dc;--en-numeral:#fffdf8;--en-shadow:#0000008c}.en-scale-edge{stop-color:var(--en-scale-edge)}.en-scale-crown{stop-color:var(--en-scale-crown);transition:stop-color .16s}.en-root-edge{stop-color:var(--en-root-edge)}.en-root-crown{stop-color:var(--en-root-crown);transition:stop-color .16s}.en-key-edge{stop-color:var(--en-key-edge)}.en-key-crown{stop-color:var(--en-key-crown);transition:stop-color .16s}.en-arc-edge{stop-color:var(--en-arc-edge)}.en-arc-crown{stop-color:var(--en-arc-crown)}.wheel-enamel.key-hover,.wheel-enamel.key-engaged{--en-key-crown:var(--en-key-crown-active);--en-root-crown:var(--en-root-crown-active);--en-scale-crown:var(--en-scale-crown-active)}.wheel-enamel.middle-hover,.wheel-enamel.drop-target{--en-scale-crown:var(--en-scale-crown-active)}.wheel-enamel.root-hover{--en-root-crown:var(--en-root-crown-active)}.wheel-enamel:has(.gear-middle.dragging){--en-scale-crown:var(--en-scale-crown-active)}.wheel-enamel:has(.gear-root.dragging){--en-root-crown:var(--en-root-crown-active)}.wheel-enamel.key-engaged .stays{opacity:.7}.en-key{fill:none;stroke:url(#en-torus-key);stroke-width:30px}.en-face{fill:var(--en-face);filter:drop-shadow(0 4px 6px var(--en-shadow))}.en-root{fill:none;stroke:url(#en-torus-root);stroke-width:28px}.en-scale{fill:none;stroke:url(#en-torus-scale);stroke-width:26px}.en-dimple{fill:var(--en-dimple)}.en-arc{fill:none;stroke:url(#en-torus-arc);stroke-width:26px;stroke-linecap:round;transition:opacity .2s}.en-arc-dot{transition:opacity .2s}.en-arc-dot-fill{fill:var(--en-arc-crown)}.wheel-enamel.drop-target .en-arc,.wheel-enamel.drop-target .en-arc-dot{opacity:.3}.en-tonic{fill:var(--en-face);opacity:.85}.en-glaze{pointer-events:none;filter:blur(2.5px)}.en-highlight{fill:none;stroke:var(--en-highlight);stroke-linecap:round}.en-seat{transition:transform .22s cubic-bezier(.34,1.3,.5,1)}.gear.dragging .en-seat,.wheel-enamel.key-engaged .follows .en-seat{transition:none}.en-shade{fill:url(#en-bead-shade);pointer-events:none}.en-socket{fill:var(--en-socket)}.en-bead{opacity:0;transition:opacity .18s,transform .26s cubic-bezier(.34,1.5,.5,1);transform:scale(.5)}.en-bead.on{opacity:1;transform:scale(1)}.en-bead-fill{transition:fill .24s}.wheel-enamel .gear text.en-numeral{fill:var(--en-numeral);font-size:17px;font-weight:600}.en-root-bead{fill:var(--accent)}.en-halo{pointer-events:none;filter:blur(7px);animation:.62s ease-out forwards en-halo-fade}@keyframes en-halo-fade{0%{opacity:.95;transform:scale(.9)}to{opacity:0;transform:scale(1.5)}}.wheel-enamel .note-label{fill:var(--en-letter);font-size:13px;font-weight:450}.wheel-enamel .note-label.in-scale{fill:var(--en-letter-strong);font-weight:550}.wheel-enamel .note-label.root{fill:var(--accent)}.en-dome{fill:var(--accent);filter:drop-shadow(0 3px 4px var(--en-shadow));transition:transform .22s cubic-bezier(.34,1.3,.5,1)}.en-dome-shade{fill:url(#en-dome-shade);pointer-events:none;transition:transform .22s cubic-bezier(.34,1.3,.5,1)}.wheel-enamel.drop-target .en-dome,.wheel-enamel.drop-target .en-dome-shade{transform:scale(1.07)}.wheel-enamel .hub-caption{fill:var(--en-numeral);opacity:.75}.wheel-enamel .hub-note{fill:var(--en-numeral);font-size:31px;font-weight:500}[data-look=enamel] .kb-white{stroke:none;filter:drop-shadow(0 3px 3px var(--en-shadow))}[data-look=enamel] .kb-black{filter:drop-shadow(0 2px 3px var(--en-shadow))}[data-look=enamel] .kb-coin-cast{fill:var(--en-shadow)}[data-look=enamel] .mini-track{stroke:var(--en-scale-edge)}[data-look=enamel] .mini-arc{stroke:var(--en-arc-crown)}[data-look=enamel] .mini-arc-dot{fill:var(--en-arc-crown)}[data-look=enamel] .mini-tonic-dot{fill:var(--en-face)}[data-look=enamel] .mini-cradle{stroke:var(--en-socket)}:root{--chroma-0:#e15b64;--chroma-1:#e67f4f;--chroma-2:#d9a32c;--chroma-3:#a9b23a;--chroma-4:#5eb369;--chroma-5:#3fb39b;--chroma-6:#47aac9;--chroma-7:#5490d9;--chroma-8:#7178cf;--chroma-9:#9a6fcb;--chroma-10:#c265b6;--chroma-11:#d95f8c}[data-theme=dark]{--chroma-0:#e8707a;--chroma-1:#eb9062;--chroma-2:#e0b04a;--chroma-3:#b8c052;--chroma-4:#6fc07c;--chroma-5:#56c1ab;--chroma-6:#5fb8d6;--chroma-7:#6a9fe3;--chroma-8:#8890dc;--chroma-9:#ab84d8;--chroma-10:#cf7cc4;--chroma-11:#e2789f}.tr-layer{opacity:0;pointer-events:none;transition:opacity .38s}.tr-layer.on{opacity:1;pointer-events:auto}.tr-face{fill:var(--panel);filter:var(--shadow-face)}.tr-ghost-ring{fill:none;stroke:var(--line);stroke-width:1.5px}.tr-ghost-arc{fill:none;stroke:var(--faint);stroke-width:20px;stroke-linecap:round;opacity:.55}.tr-ghost-pointer{fill:none;stroke:var(--faint);stroke-width:2px;stroke-linejoin:round}.tr-ghost-dot{fill:var(--faint)}.wheel-tour .note-label.tr-ghost-letter{fill:var(--faint);font-size:13px;font-weight:450}.tr-ghost-hub{fill:var(--panel-bright);stroke:var(--line);stroke-width:1.5px}.tr-ghost-mark{fill:var(--accent);font-size:34px;font-weight:400}.tr-clock-tick{stroke:var(--faint);stroke-width:2px;stroke-linecap:round}.tr-clock-numeral{font-variant-numeric:tabular-nums;fill:var(--muted);font-size:10.5px;font-weight:500}.tr-wave{fill:none;stroke-width:2.4px;stroke-linecap:round;stroke-linejoin:round}.tr-wave-1{stroke:var(--ink)}.tr-wave-2{stroke:var(--deg-5)}.tr-wave-sum{stroke:var(--muted);stroke-width:1.8px}.tr-wave-tag{letter-spacing:.2em;text-transform:uppercase;fill:var(--muted);font-size:9.5px;font-weight:600;transition:opacity .3s}.tr-knob-track{fill:none;stroke:var(--faint);stroke-width:2px;stroke-linecap:round}.tr-knob-mark{fill:var(--faint);transition:fill .16s,r .2s cubic-bezier(.34,1.5,.5,1)}.tr-knob-mark.major{fill:var(--muted)}.tr-knob-mark.on{fill:var(--accent)}.tr-knob-face{fill:var(--panel-bright);stroke:var(--line);stroke-width:1.5px;filter:var(--shadow-hub)}.tr-knob-rotor{transition:transform .22s cubic-bezier(.34,1.3,.5,1)}.wheel-tour.spinning .tr-knob-rotor{transition:none}.tr-knob:hover .tr-knob-knurl{stroke:var(--muted)}.wheel-tour.spinning .tr-knob-knurl{stroke:var(--ink)}.tr-knob-index{stroke:var(--ink);stroke-width:3px;stroke-linecap:round}.tr-knob-readout{fill:var(--ink);font-variant-numeric:tabular-nums;font-size:17px;font-weight:500}.tr-knob-name{letter-spacing:.06em;fill:var(--muted);font-size:11px;font-weight:500}.tr-knob-hit{pointer-events:all}.tr-loop{fill:none;stroke:var(--band);stroke-width:22px}.tr-loop-start{stroke:var(--muted);stroke-width:2.5px;stroke-linecap:round}.tr-loop-dot{fill:var(--ink)}.tr-loop-turns{letter-spacing:.04em;fill:var(--muted);font-size:11px;font-weight:500}.tr-loop-hz{fill:var(--ink);font-variant-numeric:tabular-nums;font-size:38px;font-weight:380}.tr-loop-caption{letter-spacing:.2em;text-transform:uppercase;fill:var(--muted);font-size:9.5px;font-weight:600}.tr-note{opacity:0;transition:opacity .32s}.tr-note.on{opacity:1}.tr-note-seat{transition:transform .9s cubic-bezier(.45,0,.2,1)}.tr-dot{fill:var(--ink);transition:fill .42s,r .32s cubic-bezier(.34,1.5,.5,1)}.tr-dot.chroma{fill:var(--chroma,var(--ink));r:8}.wheel-tour .note-label.tr-letter.chroma{fill:var(--chroma,var(--muted));font-weight:550}.tr-dot.ghost{fill:none;stroke:var(--accent);stroke-width:2px}.tr-comma{fill:none;stroke:var(--accent);stroke-width:3px;stroke-linecap:round}.tr-chord{opacity:0;transition:opacity .32s,transform .9s cubic-bezier(.45,0,.2,1)}.tr-chord.on{opacity:1}.tr-chord line{stroke:var(--faint);stroke-width:1.2px;stroke-linecap:round}.wheel-tour .note-label.tr-letter{fill:var(--muted);font-size:13px;font-weight:450;transition:fill .42s}.wheel-tour .note-label.tr-letter.in-scale{fill:var(--ink);font-weight:550}.wheel-tour .note-label.tr-letter.root{fill:var(--accent)}.tr-coin{opacity:0;transition:opacity .18s,transform .26s cubic-bezier(.34,1.5,.5,1),fill .24s;transform:scale(.4)}.tr-coin.on{opacity:1;transform:scale(1)}.wheel-tour .gear text.tr-coin-numeral{fill:#fff;opacity:0;font-size:16px;font-weight:600;transition:transform .22s cubic-bezier(.34,1.3,.5,1),opacity .18s}.wheel-tour .gear.dragging text.tr-coin-numeral{transition:opacity .18s}.wheel-tour .gear text.tr-coin-numeral.on{opacity:1}.tr-halo{pointer-events:none;filter:blur(7px);animation:.62s ease-out forwards tr-halo-fade}@keyframes tr-halo-fade{0%{opacity:.95;transform:scale(.9)}to{opacity:0;transform:scale(1.5)}}.tr-scale-track{fill:none;stroke:var(--band);stroke-width:20px;transition:stroke .16s}.tr-scale-arc{fill:none;stroke:var(--wedge-on);stroke-width:20px;stroke-linecap:round}.tr-scale-arc-dot{fill:var(--wedge-on)}.tr-tonic-dot{fill:var(--panel);opacity:.85}.tr-root-ring{fill:none;stroke:var(--band);stroke-width:16px;transition:stroke .16s}.tr-root-dot{fill:var(--line)}.tr-pointer{fill:var(--accent);stroke:var(--accent);stroke-width:4px;stroke-linejoin:round}.tr-plate{fill:var(--wedge-off);stroke:var(--wedge-off);stroke-width:8px;stroke-linejoin:round;transition:fill .16s,stroke .16s}.wheel-tour.middle-hover .gear-middle .tr-scale-track,.wheel-tour .gear-middle.dragging .tr-scale-track,.wheel-tour.key-hover .follows .tr-scale-track,.wheel-tour.key-engaged .follows .tr-scale-track,.wheel-tour.root-hover .gear-root .tr-root-ring,.wheel-tour .gear-root.dragging .tr-root-ring,.wheel-tour.key-hover .follows .tr-root-ring,.wheel-tour.key-engaged .follows .tr-root-ring{stroke:var(--band-active)}.wheel-tour.key-hover .tr-plate,.wheel-tour.key-engaged .tr-plate{fill:var(--line);stroke:var(--line)}.wheel-tour.key-engaged .stays{opacity:.65}.tr-hub{fill:var(--accent);filter:var(--shadow-hub);transition:transform .22s cubic-bezier(.34,1.3,.5,1)}.tr-hub-button{cursor:pointer;outline:none}.tr-hub-button:hover .tr-hub,.tr-hub-button:focus-visible .tr-hub{transform:scale(1.06)}.tr-hub-button:active .tr-hub{transform:scale(.97)}.tr-hub-button.done{cursor:default}.tr-hub-glyph{fill:#fff;pointer-events:none;font-size:34px;font-weight:500}.wheel-tour .tr-hub-caption{fill:#fff;opacity:.75;pointer-events:none}.tr-hub-note{fill:#fff;font-size:30px;font-weight:500}.tr-hub-tally{letter-spacing:.04em;fill:var(--muted);font-size:11px;font-weight:500}.tour-panel{width:min(560px,92vw);height:var(--tour-panel-h,196px);text-align:left;grid-template:"head keysig nav""body body body"1fr/1fr auto auto;align-items:end;gap:10px 18px;display:grid}.tour-head{flex-direction:column;grid-area:head;justify-content:flex-end;gap:2px;min-height:40px;display:flex}.tour-head-row{align-items:center;gap:12px;display:flex}.keysig,.keysig-slot{grid-area:keysig}.tour-tag{letter-spacing:.2em;text-transform:uppercase;color:var(--accent);font-size:11px;font-weight:600}.tour-beats{align-items:center;gap:3px;margin:0;padding:0;list-style:none;display:flex}.tour-beat{background:var(--line);border-radius:2px;width:10px;height:3px;transition:background-color .26s,transform .26s cubic-bezier(.34,1.5,.5,1);display:block}.tour-beat.seen{background:var(--muted)}.tour-beat.current{background:var(--accent);transform:scaleY(1.6)}.tour-title{letter-spacing:.01em;margin:0;font-size:20px;font-weight:400;line-height:1.2}.tour-body{flex-direction:column;grid-area:body;align-self:start;min-height:0;display:flex;overflow:hidden}.tour-line{color:var(--ink);margin:0;font-size:16px;line-height:1.5;animation:.52s cubic-bezier(.2,.7,.2,1) both tour-line-in}@keyframes tour-line-in{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}.tour-line.ask{font-style:italic;font-weight:450}.tour-line.try{color:var(--ink);padding-left:16px;position:relative}.tour-line.try:before,.tour-try.on:before{content:"";background:var(--accent);border-radius:50%;width:7px;height:7px;position:absolute;top:.75em;left:2px;transform:translateY(-50%)}.tour-line strong{font-weight:600}.tour-ratio{font-variant-numeric:tabular-nums;white-space:nowrap;font-weight:600}.tour-notes{letter-spacing:.1em;white-space:nowrap;font-weight:500}.tour-aside{color:var(--muted);margin:6px 0 0;font-size:12.5px;line-height:1.45;animation:.52s cubic-bezier(.2,.7,.2,1) .16s both tour-line-in}.tour-try{color:var(--muted);opacity:0;margin:auto 0 0;padding:8px 0 0 16px;font-size:13px;line-height:1.5;transition:opacity .36s;position:relative}.tour-try.on{opacity:1}.tour-try.on:before{opacity:.7;top:calc(8px + .75em)}.tour-nav{grid-area:nav;justify-content:center;align-items:center;gap:14px;padding-bottom:4px;display:flex}.tour-step{border:1.5px solid var(--line);background:var(--panel-bright);cursor:pointer;border-radius:50%;place-items:center;width:30px;height:30px;padding:0;transition:border-color .18s,opacity .18s,transform .22s cubic-bezier(.34,1.3,.5,1);display:grid}.tour-step svg{fill:none;width:14px;height:14px;stroke:var(--ink);stroke-width:1.8px;stroke-linecap:round;stroke-linejoin:round}.tour-step:hover:not(:disabled){border-color:var(--muted);transform:translateY(-1px)}.tour-step:disabled{opacity:.35;cursor:default}.tour-step.next{border-color:var(--muted)}.tour-step.next:hover{border-color:var(--ink)}.tour-step:focus-visible,.tour-pip:focus-visible,.tour-finish:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.tour-pips{align-items:center;gap:6px;margin:0;padding:0;list-style:none;display:flex}.tour-pip{border:1.5px solid var(--faint);cursor:pointer;background:0 0;border-radius:50%;width:10px;height:10px;padding:0;transition:background-color .22s,border-color .22s,transform .26s cubic-bezier(.34,1.5,.5,1);display:block}.tour-pip:hover{border-color:var(--muted)}.tour-pip.seen{border-color:var(--ink);background:var(--ink)}.tour-pip.current{border-color:var(--accent);background:var(--accent);transform:scale(1.25)}.tour-finish{border:1.5px solid var(--line);background:var(--panel-bright);color:var(--ink);font:inherit;cursor:pointer;border-radius:999px;padding:6px 16px;font-size:13px;font-weight:600;transition:border-color .18s,transform .22s cubic-bezier(.34,1.3,.5,1)}.tour-finish:hover{border-color:var(--muted);transform:translateY(-1px)}.keysig{flex-direction:column;flex:none;align-items:flex-end;gap:2px;margin:0;display:flex}.keysig-staff{width:118px;height:52px;display:block}.keysig-line{stroke:var(--faint);stroke-width:1px}.keysig-bar{stroke:var(--muted);stroke-width:1.5px;stroke-linecap:round}.keysig-glyph{fill:var(--ink);opacity:0;transform-box:fill-box;transform-origin:50%;font-size:15px;font-weight:500;transition:opacity .18s,transform .26s cubic-bezier(.34,1.5,.5,1);transform:scale(.6)}.keysig-glyph.on{opacity:1;transform:scale(1)}.keysig-caption{letter-spacing:.04em;color:var(--muted);white-space:nowrap;font-size:11px}.keysig-caption strong{color:var(--ink);font-weight:600}.app.tour .keyboard.dormant{opacity:.55;transition:opacity .32s}.app.tour .keyboard{transition:opacity .32s}@property --sk-sx{syntax:"<number>";inherits:true;initial-value:1}@property --sk-pleat{syntax:"<number>";inherits:false;initial-value:1}@property --sk-cx{syntax:"<number>";inherits:false;initial-value:0}.sk-bed{transition:--sk-sx .7s cubic-bezier(.4,0,.2,1)}.sk-bed.folding{transition:--sk-sx var(--sk-close-ms) var(--sk-close-ease) var(--sk-close-delay)}.sk-keys{transform:scaleX(var(--sk-sx))}.sk-octave{transform:translate(var(--sk-hinge)) scaleX(var(--sk-pleat)) translate(calc(-1 * var(--sk-hinge)))}.sk-octave.folded{--sk-pleat:0;pointer-events:none}.folding .sk-octave{transition:--sk-pleat var(--sk-close-ms) var(--sk-close-ease) var(--sk-close-delay), opacity var(--sk-close-ms) var(--sk-close-ease) var(--sk-close-delay)}.folding .sk-octave.folded{opacity:.3}.keyboard-stack .kb-white,.keyboard-stack .kb-black{filter:none}.folding .sk-octave .kb-white{transition:fill var(--sk-close-ms) var(--sk-close-ease) var(--sk-close-delay)}.folding .sk-octave.folded .kb-white{fill:var(--line)}.sk-coin-seat,.sk-land-spot,.sk-halo-spot{pointer-events:none;transform:translate(calc(var(--sk-cx) * var(--sk-sx) * 1px), var(--sk-cy))}.sk-coin-seat{transition:--sk-cx var(--sk-hop-ms) cubic-bezier(.45, 0, .35, 1) var(--sk-hop-delay,0s)}.sk-coin-hop{transform-box:fill-box;transform-origin:50%}.sk-coin{r:calc(min(1, var(--sk-sx) * 1.15) * var(--sk-r) * 1px);transform-box:fill-box;transform-origin:50%;animation:.32s cubic-bezier(.34,1.5,.5,1) both sk-coin-in}.sk-land-ring{r:calc(min(1, var(--sk-sx) * 1.15) * var(--sk-r) * 1px);fill:none;stroke-width:2px;opacity:0;transform-box:fill-box;transform-origin:50%}.sk-halo{r:calc(min(1, var(--sk-sx) * 1.15) * var(--sk-r) * 1px + 6px)}@keyframes sk-coin-in{0%{opacity:0;transform:scale(.3)}to{opacity:1;transform:scale(1)}}.sk-coin-name{fill:#fff;opacity:0;font-size:11px;font-weight:600;transition:opacity .24s}.sk-coin-name.black{font-size:9.5px}.keyboard-stack.named .sk-coin-name{opacity:1}.tour-dial{cursor:pointer;background:0 0;border:none;border-radius:50%;width:42px;height:42px;padding:0;position:fixed;top:12px;right:62px}.tour-dial:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.tour-dial svg{width:100%;height:100%;display:block}.tour-dial:hover .handle{stroke:var(--muted)}.tour-rose-north{fill:var(--accent)}.tour-rose-point{fill:var(--muted)}.tour-rose-pin{fill:var(--panel)}.tour-wheel,.tour-dial.active .tour-rose{opacity:0}.tour-dial.active .tour-wheel{opacity:1}.hint-tour{color:var(--ink);font:inherit;text-underline-offset:3px;cursor:pointer;background:0 0;border:none;padding:0;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}.hint-tour:hover{text-decoration-style:solid}.hint-tour:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:4px}@media (width<=520px){.tour-panel{grid-template:"head keysig""body body"1fr"nav nav"/1fr auto;row-gap:8px}.tour-nav{padding-bottom:0}.tour-line{font-size:15px}.tour-try{font-size:12px}.tour-aside{display:none}.tour-title{font-size:17px}.keysig-staff{width:96px;height:42px}}