:root{--bg:#0a0b0d;--ink:#e9e6dd;--ink-dim:#e9e6dd73;--ink-faint:#e9e6dd24;--accent:#ff9a3c;--fn-T:var(--ink);--fn-SD:#8ac8f1;--fn-D:#a77995;--strip-h:76px;--safe-t:env(safe-area-inset-top,0px);--safe-b:env(safe-area-inset-bottom,0px);--safe-l:env(safe-area-inset-left,0px);--safe-r:env(safe-area-inset-right,0px);--dock-gap:8px;--dock-b:max(var(--dock-gap), var(--safe-b));--dock-l:max(var(--dock-gap), var(--safe-l));--dock-r:max(var(--dock-gap), var(--safe-r));--strip-total:calc(var(--strip-h) + var(--dock-b));--ease:cubic-bezier(.37, 0, .63, 1);--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}html,body{background:var(--bg);height:100%;color:var(--ink);-webkit-font-smoothing:antialiased;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;overscroll-behavior:none;margin:0;font-family:Inter Tight,system-ui,sans-serif;overflow:hidden}button{font:inherit;color:inherit;cursor:pointer;touch-action:manipulation;background:0 0;border:0;padding:0}input{touch-action:manipulation}button:disabled{opacity:.3;cursor:default}button:focus-visible{outline:1px solid var(--ink-dim);outline-offset:3px;border-radius:6px}#stage{inset:0 0 var(--strip-total) 0;position:fixed}.canvas{touch-action:none;cursor:grab;width:100%;height:100%;display:block}.canvas.dragging{cursor:grabbing}.grid{pointer-events:none}.grid-dot{fill:var(--ink);fill-opacity:.075}.edge{--role:var(--ink);fill:none;stroke:var(--role);stroke-linecap:round;stroke-linejoin:round;transition:stroke .6s var(--ease), opacity .45s var(--ease)}.dot{--role:var(--ink);fill:var(--role);transition:fill .6s var(--ease), opacity .45s var(--ease)}.fn-T{--role:var(--fn-T)}.fn-SD{--role:var(--fn-SD)}.fn-D{--role:var(--fn-D)}.label{fill:var(--ink);letter-spacing:.01em;pointer-events:none;transition:opacity .45s var(--ease);font-size:13px;font-weight:400}.label.active{font-size:15px;font-weight:500}.label .roman{fill-opacity:0;transition:fill-opacity .3s var(--ease);font-size:10px}.label.hover .roman,.label.active .roman{fill-opacity:.4}.dim{opacity:.12}.threads.dim{opacity:.2}.thread{fill:none;stroke:var(--ink);stroke-opacity:.2;stroke-width:1px;stroke-dasharray:1 7;stroke-linecap:round}.thread.link{stroke-opacity:.12;stroke-dasharray:2 10}.edge.borrowed:not(.active){stroke-dasharray:3 4}.edge.move:not(.active){stroke-dasharray:.01 4.5}.dot.power{fill:var(--bg);stroke:var(--role);stroke-width:1.6px}.menu.dress-menu{z-index:25;width:300px;position:fixed;top:auto;transform:none}.menu.dress-menu[hidden]{transform:translateY(6px)}.dress-menu .menu-head{padding:6px 8px 8px}.dress-menu .menu-head .sheet-grip{display:none}.dress-grid{grid-template-columns:repeat(3,1fr);gap:2px;display:grid}.menu .dress{color:var(--ink-dim);align-items:center;padding:9px 6px;font-size:13px;position:relative}.menu .dress:hover{color:var(--ink)}.menu .dress.current{color:var(--accent);background:color-mix(in srgb, var(--accent) 8%, transparent)}.menu .dress.default:after{content:"·";color:var(--ink-dim);position:absolute;top:1px;right:7px}.dress-note{color:var(--ink-dim);opacity:.7;margin:4px 8px 2px;font-size:11px}.tip-glow{fill:var(--accent);pointer-events:none}.halo{fill:none;stroke:var(--accent);stroke-width:1.5px;pointer-events:none}.hit{fill:#0000;cursor:pointer}.center{cursor:pointer}.center-ring{fill:var(--bg);stroke:var(--ink);stroke-opacity:.35;stroke-width:1px;transition:stroke-opacity .4s var(--ease)}.center:hover .center-ring{stroke-opacity:.7}.center.inactive:hover .center-ring{stroke-opacity:.55}.center-lens{fill:none;stroke:var(--accent);stroke-width:1px;stroke-opacity:0;transition:stroke-opacity .5s var(--ease)}.center.dressed .center-lens{stroke-opacity:.55}.center-key{fill:var(--ink);text-anchor:middle;font-size:17px;font-weight:500}.center-mode{fill:var(--ink-dim);letter-spacing:.14em;text-transform:uppercase;text-anchor:middle;font-size:9.5px}.center-name{fill:var(--ink-dim);letter-spacing:.22em;text-transform:uppercase;text-anchor:middle;font-size:10px}.center-mode.long{letter-spacing:.08em;font-size:7.5px}body.picking .canvas .edges,body.picking .canvas .nodes,body.picking .canvas .labels,body.picking .canvas .threads,body.picking .canvas .glow{opacity:.12;transition:opacity .5s var(--ease)}.canvas .edges,.canvas .nodes,.canvas .labels,.canvas .threads,.canvas .glow{transition:opacity .5s var(--ease)}#picker{z-index:26;width:0;height:0;position:fixed}#picker-scrim{z-index:25;transition:opacity .35s var(--ease);background:#00000073;position:fixed;inset:0}#picker-scrim[hidden]{opacity:0;pointer-events:none;display:block}#picker[hidden]{pointer-events:none;display:block}#picker .key{--s:clamp(26px, calc(40px * var(--z,1)), 64px);width:var(--s);height:var(--s);margin:calc(var(--s) / -2) 0 0 calc(var(--s) / -2);font-size:clamp(10px, calc(14px * var(--z,1)), 24px);color:var(--ink-dim);opacity:0;transition:transform .55s var(--ease), opacity .45s var(--ease), color .25s var(--ease);transition-delay:calc(var(--i) * 18ms);border-radius:50%;position:absolute;transform:scale(.6)}#picker:not([hidden]) .key{opacity:1;transform:translate(calc(var(--x) * var(--z,1) * 1px), calc(var(--y) * var(--z,1) * 1px)) scale(1);transition:transform .55s var(--ease) calc(var(--i) * 18ms), opacity .45s var(--ease) calc(var(--i) * 18ms), color .25s var(--ease)}#picker.settled .key{transition:opacity .45s var(--ease), color .25s var(--ease)}#picker .key:hover{color:var(--ink)}#picker .key.current{color:var(--accent)}#picker .mode{font-size:clamp(9px, calc(12px * var(--z,1)), 20px);letter-spacing:.03em;white-space:nowrap;color:var(--ink-dim);opacity:0;transition:transform .6s var(--ease) calc(.12s + var(--i) * 30ms), opacity .5s var(--ease) calc(.12s + var(--i) * 30ms), color .25s var(--ease);padding:4px 6px;position:absolute;transform:translate(-50%,-50%)scale(.8)}#picker:not([hidden]) .mode{opacity:1;transform:translate(calc(var(--x) * var(--z,1) * 1px), calc(var(--y) * var(--z,1) * 1px)) translate(-50%, -50%)}#picker.settled .mode{transition:opacity .45s var(--ease), color .25s var(--ease)}#picker .mode:hover{color:var(--ink)}#picker .mode.current{color:var(--accent)}#picker .mode:hover:after{content:attr(data-hint);color:var(--ink-dim);opacity:.7;font-size:.8em;position:absolute;top:100%;left:50%;transform:translate(-50%)}.picker-legend{white-space:nowrap;font-size:clamp(9px, calc(10.5px * var(--z,1)), 15px);letter-spacing:.06em;color:var(--ink-dim);opacity:0;transform:translate(-50%, calc(-150px * var(--z,1)));transition:opacity .5s var(--ease) .35s;pointer-events:none;gap:14px;display:flex;position:absolute;top:0;left:0}#picker:not([hidden]) .picker-legend{opacity:1}.picker-legend span{align-items:center;gap:6px;display:flex}.picker-lens{opacity:0;transform:translate(-50%, calc(212px * var(--z,1)));transition:opacity .5s var(--ease) .4s;pointer-events:none;flex-direction:column;align-items:center;gap:8px;display:flex;position:absolute;top:0;left:0}#picker:not([hidden]) .picker-lens{opacity:1;pointer-events:auto}.lens-presets,.lens-row{border:1px solid var(--ink-faint);background:var(--bg);border-radius:999px;flex-wrap:wrap;justify-content:center;gap:2px;width:max-content;max-width:calc(100vw - 32px);padding:2px;display:flex}.lens-mix{max-width:min(560px,100vw - 32px);animation:chip-in .35s var(--ease) both;flex-direction:column;align-items:center;gap:6px;display:flex}.lens-row{border-radius:16px}.lens-row:before{content:attr(data-label);letter-spacing:.14em;text-transform:uppercase;color:var(--ink-dim);opacity:.7;align-self:center;padding:0 8px 0 10px;font-size:10px}.picker-lens .lens{font-size:clamp(10px, calc(11.5px * var(--z,1)), 16px);letter-spacing:.03em;white-space:nowrap;color:var(--ink-dim);transition:color .25s var(--ease), background .25s var(--ease);border-radius:999px;padding:5px 11px}.lens-row .lens{padding:5px 9px;font-size:11px}.picker-lens .lens:hover{color:var(--ink)}.picker-lens .lens.current{color:var(--accent);background:color-mix(in srgb, var(--accent) 10%, transparent)}.picker-done{min-width:88px;color:var(--bg);background:var(--ink);transition-property:background-color,scale;transition-duration:.25s,.15s;transition-timing-function:var(--ease), cubic-bezier(.2, 0, 0, 1);border-radius:999px;margin-top:4px;padding:8px 18px;font-size:13px;font-weight:500}.picker-done:hover{background-color:#fff}.picker-done:active{scale:.96}@media (pointer:coarse){.picker-done{min-height:44px}}.picker-lens .lens.mix:after{content:" ▾";opacity:.6;font-size:.75em}.picker-lens .lens.mix.open:after{content:" ▴"}.picker-legend span:before{content:"";background:var(--role);border-radius:50%;width:6px;height:6px}body.dice-open .corner.tr{z-index:21}#strip{z-index:6;left:var(--dock-l);right:var(--dock-r);bottom:var(--dock-b);height:var(--strip-h);background:#111216;border-radius:18px;align-items:center;gap:20px;padding:0 20px;display:flex;position:fixed;box-shadow:0 0 0 1px #ffffff12,0 10px 28px -8px #0009,0 2px 6px #0000004d}.play{border:1px solid var(--ink-faint);width:36px;height:36px;transition:border-color .3s var(--ease);border-radius:50%;flex:none;place-items:center;display:grid}.play:not(:disabled):hover{border-color:var(--ink-dim)}.play svg{width:14px;height:14px;fill:var(--ink);transition:opacity .25s var(--ease), transform .35s var(--ease);grid-area:1/1}.play .i-stop,.play.on .i-play{opacity:0;transform:scale(.6)}.play.on .i-stop{opacity:1;fill:var(--accent);transform:none}.dice-wrap{flex:none;position:relative}.dice{align-items:center;gap:6px;display:flex}.dice:hover,.dice[aria-expanded=true]{color:var(--ink)}.dice svg{width:15px;height:15px}.dice rect{fill:none;stroke:currentColor;stroke-width:1.2px}.dice circle{fill:currentColor}.dice.rolling svg{animation:roll .9s var(--ease)}@keyframes roll{50%{transform:rotate(200deg)scale(.82)}to{transform:rotate(360deg)}}.menu.dice-menu{gap:12px;min-width:290px;padding:14px}.menu-head{color:var(--ink-dim);font-size:12px;line-height:1.2}.field{justify-content:space-between;align-items:center;gap:14px;display:flex}.field-label{color:var(--ink-dim);font-size:12px}.seg{background:#e9e6dd0a;border-radius:8px;gap:2px;padding:2px;display:flex}.dice-menu .seg button{color:var(--ink-dim);white-space:nowrap;transition:color .25s var(--ease), background .25s var(--ease);border-radius:6px;justify-content:center;align-items:center;padding:5px 9px;font-size:12px;display:flex}.dice-menu .seg button:hover{color:var(--ink);background:0 0}.dice-menu .seg button.on{color:var(--ink);background:#e9e6dd17}.dice-actions{gap:8px;margin-top:2px;display:flex}.dice-menu .dice-actions button{border:1px solid var(--ink-faint);text-align:center;color:var(--ink-dim);transition:color .25s var(--ease), border-color .25s var(--ease);border-radius:8px;flex-direction:row;flex:1;justify-content:center;align-items:center;padding:8px 0;font-size:12px;display:flex}.dice-menu .dice-actions button:hover{color:var(--ink);border-color:var(--ink-dim);background:0 0}.dice-menu .dice-actions button.primary{color:var(--bg);background:var(--ink);border-color:var(--ink)}.dice-menu .dice-actions button.primary:hover{background:#fff}.dice-menu .dice-redress{text-align:center;border-radius:8px;align-items:center;padding:9px 10px 10px;transition-property:background-color,box-shadow,scale;transition-duration:.25s,.25s,.15s;box-shadow:inset 0 0 0 1px #ffffff0f}.dice-menu .dice-redress:hover{box-shadow:inset 0 0 0 1px #ffffff24}.dice-menu .dice-redress:active:not(:disabled){scale:.96}.dice-menu .dice-redress:disabled{opacity:.4;cursor:default}.dice-menu .dice-redress .menu-title{color:var(--ink);font-size:12px}.dice-menu .dice-redress .menu-sub{color:var(--ink-dim);font-size:11px}.chips{scrollbar-width:none;flex:1;align-items:center;gap:2px;min-width:0;padding:0 12px;display:flex;overflow-x:auto;-webkit-mask-image:linear-gradient(90deg,#0000 0,#000 12px calc(100% - 24px),#0000);mask-image:linear-gradient(90deg,#0000 0,#000 12px calc(100% - 24px),#0000)}.chips::-webkit-scrollbar{display:none}.chips .hint{color:var(--ink-dim);letter-spacing:.02em;font-size:13px;font-weight:300}.group{flex:none;align-items:center;gap:2px;display:flex}.group+.group{border-left:1px solid var(--ink-faint);margin-left:14px;padding-left:14px}.group-head{align-items:center;gap:2px;margin-right:6px;display:flex}.group-name{letter-spacing:.18em;text-transform:uppercase;color:var(--ink-dim);transition:color .25s var(--ease);padding:4px;font-size:10px}.group-name:hover{color:var(--ink)}.group-act{width:20px;height:20px;color:var(--ink-dim);opacity:.5;transition:opacity .25s var(--ease), color .25s var(--ease), background .25s var(--ease);border-radius:50%;font-size:12px}.group:hover .group-act{opacity:1}.group-act:hover{color:var(--ink);background:#e9e6dd0f}.chip{color:var(--ink-dim);transition:color .3s var(--ease), background .3s var(--ease);animation:chip-in .5s var(--ease) both;border-radius:8px;flex:none;padding:6px 12px;font-size:15px;position:relative}.chip:hover{color:var(--ink);background:#e9e6dd0a}.chip.tip{color:var(--ink)}.chip.borrowed{font-style:italic}.chip.dressed:before{content:"";background:var(--accent);opacity:.8;border-radius:50%;width:4px;height:4px;position:absolute;top:7px;left:6px}.chip.redressed{animation:.45s cubic-bezier(.2,0,0,1) both redress}@keyframes redress{0%{opacity:.2;filter:blur(3px);translate:0 3px}}@media (prefers-reduced-motion:reduce){.chip.redressed{animation-name:none}}.chip.move:after{background:radial-gradient(circle, var(--role) 1px, transparent 1.5px) 0 50% / 5px 2px repeat-x}.chip:after{content:"";background:var(--role,var(--ink));opacity:.55;height:2px;transition:opacity .3s var(--ease);border-radius:1px;position:absolute;bottom:2px;left:12px;right:12px}.chip:hover:after,.chip.tip:after{opacity:.9}.chip.playing{color:var(--accent)}.chip .x{text-align:center;width:15px;height:15px;color:var(--ink-dim);opacity:0;transition:opacity .2s var(--ease);background:#1a1b1e;border-radius:50%;font-size:11px;line-height:15px;position:absolute;top:-3px;right:-1px}.chip:hover .x{opacity:1}.chip .x:hover{color:var(--ink)}@keyframes chip-in{0%{opacity:0;transform:translateY(4px)}}.corner{top:calc(22px + var(--safe-t));z-index:5;color:var(--ink-dim);align-items:center;gap:18px;font-size:12px;display:flex;position:fixed}.corner.tl{left:calc(28px + var(--safe-l))}.corner.tr{right:calc(28px + var(--safe-r))}.tempo{font-variant-numeric:tabular-nums;align-items:center;gap:8px;display:flex}.tempo .unit{opacity:.6;margin-left:-4px}.tempo input{appearance:none;cursor:pointer;background:0 0;width:72px;height:14px}.tempo input::-webkit-slider-runnable-track{background:var(--ink-faint);height:1px}.tempo input::-moz-range-track{background:var(--ink-faint);height:1px}.tempo input::-webkit-slider-thumb{appearance:none;background:var(--ink);border-radius:50%;width:9px;height:9px;margin-top:-4px}.tempo input::-moz-range-thumb{background:var(--ink);border:0;border-radius:50%;width:9px;height:9px}.toggle{letter-spacing:.04em;color:var(--ink-dim);transition:color .25s var(--ease);font-size:12px}.toggle:not(:disabled):hover,#loop[aria-pressed=true],#metro[aria-pressed=true]{color:var(--ink)}#tabs{bottom:calc(var(--strip-total) + 10px);z-index:4;transition:opacity .6s var(--ease), transform .6s var(--ease);align-items:center;gap:6px;padding:0 4px;display:flex;position:fixed;left:50%;transform:translate(-50%)}#tabs[hidden]{opacity:0;pointer-events:none;display:flex;transform:translate(-50%,6px)}.tabs-list{align-items:center;gap:6px;display:flex}.tab{letter-spacing:.06em;color:var(--ink-dim);animation:chip-in .5s var(--ease) both;transition:color .3s var(--ease);align-items:center;padding:8px 10px;font-size:12px;display:flex;position:relative}.tab:not(:disabled):hover,.tab.on{color:var(--ink)}.tab-song{margin-left:8px}.tab-song:before{content:"";background:var(--ink-faint);width:1px;height:12px;margin-top:-6px;position:absolute;top:50%;left:-7px}.tab-x{color:var(--ink-dim);opacity:0;transition:opacity .2s var(--ease), color .2s var(--ease);font-size:11px;position:absolute;top:0;right:-4px}.tab:hover .tab-x{opacity:1}.tab-x:hover{color:var(--ink)}.tab-ink{background:var(--accent);pointer-events:none;width:0;height:1px;transition:transform .6s var(--ease), width .6s var(--ease), opacity .4s var(--ease);position:absolute;bottom:2px;left:0}#tabs.playing .tab-ink{opacity:.25!important}.tab-progress{background:var(--accent);pointer-events:none;opacity:0;width:0;height:1px;transition:opacity .4s var(--ease);position:absolute;bottom:2px;left:0}#tabs.playing .tab-progress{opacity:1}.tab-add{border:1px solid var(--ink-faint);width:28px;height:28px;transition:color .3s var(--ease), border-color .3s var(--ease);border-radius:50%;justify-content:center;margin-left:6px;padding:0;font-size:15px;line-height:1;animation:none}.tab-add:not(:disabled):hover{border-color:var(--ink-dim)}.answer-wrap{position:relative}.menu{border:1px solid var(--ink-faint);min-width:210px;transition:opacity .3s var(--ease), transform .35s var(--ease);background:#0e0f12f5;border-radius:12px;flex-direction:column;gap:2px;padding:6px;display:flex;position:absolute;top:calc(100% + 12px);left:50%;transform:translate(-50%)}.menu.up{top:auto;bottom:calc(100% + 14px)}.menu.align-left{left:0;transform:none}.menu.align-right{left:auto;right:0;transform:none}.menu.up[hidden]{transform:translate(-50%,6px)}.style-wrap{position:relative}#style:after,#voice:after{content:" ▾";opacity:.6;font-size:9px}.menu button.on .menu-title{color:var(--accent)}.menu[hidden]{opacity:0;pointer-events:none;display:flex;transform:translate(-50%,-6px)}.menu.align-left[hidden],.menu.align-right[hidden]{transform:translateY(-6px)}.menu button{text-align:left;transition:background .25s var(--ease);border-radius:8px;flex-direction:column;align-items:flex-start;gap:2px;padding:8px 10px;display:flex}.menu button:hover{background:#e9e6dd0d}.menu-title{color:var(--ink);font-size:13px}.menu-title .verb{color:var(--ink-dim);margin-right:2px}.menu-sub{color:var(--ink-dim);font-size:11px}.pill{left:50%;top:calc(18px + var(--safe-t));z-index:5;border:1px solid var(--ink-faint);color:var(--ink-dim);transition:opacity .4s var(--ease), transform .4s var(--ease), color .25s;background:#0a0b0dcc;border-radius:999px;padding:7px 14px;font-size:12px;position:fixed;translate:-50%}.pill:hover{color:var(--ink)}.pill[hidden]{opacity:0;pointer-events:none;display:block;transform:translateY(-6px)}.pill.clear{left:auto;right:calc(28px + var(--safe-r));top:calc(58px + var(--safe-t));translate:none}body.dice-open .pill.clear{opacity:0;pointer-events:none}#keys-panel{right:var(--dock-r);bottom:calc(var(--strip-total) + 12px);z-index:3;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);pointer-events:none;transition:opacity .8s var(--ease), transform .8s var(--ease);background:#0a0b0dd1;border:1px solid #e9e6dd12;border-radius:12px;padding:10px 12px 6px;position:fixed}#keys-panel[hidden]{opacity:0;display:block;transform:translateY(6px)}.keyboard{width:216px;height:auto;display:block}.keyboard.keys-49{width:380px}.key{stroke:#e9e6dd29;stroke-width:.8px;transition:fill .35s var(--ease), fill-opacity .35s var(--ease)}.key.white{fill:var(--ink);fill-opacity:.07}.key.black{fill:#1b1c20}.key.on{fill:var(--accent);fill-opacity:.9;transition:none}.bass-dot{fill:var(--accent);opacity:0;transition:opacity .35s var(--ease)}.bass-dot.on{opacity:1;transition:none}.key-label{fill:var(--ink-dim);letter-spacing:.04em;text-anchor:middle;font-size:6.5px}@media (width<=640px){#keys-panel{display:none!important}}#intro{z-index:30;text-align:center;background:var(--bg);cursor:pointer;transition:opacity 1.1s var(--ease);place-content:center;gap:14px;display:grid;position:fixed;inset:0}#intro.gone{opacity:0;pointer-events:none}.splash{pointer-events:none;width:100%;height:100%;position:absolute;inset:0}.splash-edge{fill:none;stroke:var(--role);stroke-linecap:round;stroke-linejoin:round}.splash-dot{fill:var(--role)}.splash-center{fill:var(--bg);stroke:var(--ink);stroke-opacity:.35;stroke-width:1px}.splash-key{fill:var(--ink);text-anchor:middle;font-weight:500}.splash-glow{fill:var(--accent)}.intro-title,.intro-hint{position:relative}.intro-title{font-size:24px;font-weight:600;line-height:1.2}.title-branch{padding-bottom:.5em;position:relative}.title-branch-line{pointer-events:none;position:absolute;bottom:0;left:50%;overflow:visible;translate:-50%}.tb-seg{fill:none;stroke:var(--role);stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1px;animation:6.5s cubic-bezier(.2,0,0,1) infinite tb-draw;animation-delay:calc(.5s + var(--k) * .32s)}.tb-dot{fill:var(--role);transform-box:fill-box;transform-origin:50%;animation:6.5s cubic-bezier(.2,0,0,1) infinite tb-pop;animation-delay:calc(.5s + var(--k) * .32s);scale:0}.tb-tip{fill:var(--accent)}.tb-glow{fill:var(--accent);filter:blur(6px);opacity:0;animation:tb-glow 6.5s var(--ease) infinite;animation-delay:calc(.5s + var(--k) * .32s)}@keyframes tb-draw{0%{stroke-dashoffset:1px;opacity:1}9%,82%{stroke-dashoffset:0;opacity:1}92%,to{stroke-dashoffset:0;opacity:0}}@keyframes tb-pop{0%{opacity:1;scale:0}6%,82%{opacity:1;scale:1}92%,to{opacity:0;scale:1}}@keyframes tb-glow{0%,4%{opacity:0}12%,76%{opacity:.45}90%,to{opacity:0}}.title-still .tb-seg,.title-still .tb-dot,.title-still .tb-glow{animation:none}.title-still .tb-seg{stroke-dashoffset:0}.title-still .tb-dot{scale:1}.intro-hint{color:var(--ink-dim);animation:breathe 3.2s var(--ease) infinite;font-size:12px;font-weight:300}@keyframes breathe{50%{opacity:.35}}.info{place-items:center;display:grid}.info svg{fill:none;stroke:currentColor;stroke-width:1.3px;stroke-linecap:round;width:17px;height:17px}.info svg .fill{fill:currentColor}#about{--gap:16px;width:auto;max-width:none;height:auto;max-height:none;margin:max(var(--gap), var(--safe-t)) max(var(--gap), var(--safe-r)) max(var(--gap), var(--safe-b)) max(var(--gap), var(--safe-l));color:var(--ink);overscroll-behavior:contain;-webkit-user-select:text;user-select:text;opacity:0;transition:opacity .4s var(--ease), transform .45s var(--ease);background:#0e0f12;border:0;border-radius:20px;padding:0;position:fixed;inset:0;overflow:auto;transform:translateY(10px)scale(.99);box-shadow:0 0 0 1px #ffffff14,0 24px 48px -12px #00000080,0 8px 16px -8px #0006}#about[open]{flex-direction:column;display:flex}#about.shown{opacity:1;transform:none}#about::backdrop{opacity:0;transition:opacity .4s var(--ease);background:#0009}#about.shown::backdrop{opacity:1}#about .about-section,#about .about-by{opacity:0;transition-property:opacity,transform;transition-duration:.2s;transition-timing-function:var(--ease);transform:translateY(6px)}#about .about-hero>h2,#about .about-lede{opacity:0;filter:blur(4px);transition-property:opacity,transform,filter;transition-duration:.15s;transition-timing-function:cubic-bezier(.2,0,0,1);transform:translateY(12px)}#about.shown .about-section,#about.shown .about-by{opacity:1;transition-duration:.5s,.6s;transition-timing-function:cubic-bezier(.2,0,0,1);transition-delay:var(--enter,0s);transform:none}#about.shown .about-hero>h2,#about.shown .about-lede{opacity:1;filter:blur();transition-duration:.45s;transition-timing-function:cubic-bezier(.2,0,0,1);transition-delay:var(--enter,0s);transform:none}#about .about-hero>h2{--enter:80ms}#about .about-lede{--enter:.18s}#about.shown .about-lede{opacity:.8}#about .about-section{--enter:.28s}#about .about-section~.about-section,#about .about-by{--enter:.38s}@media (prefers-reduced-motion:reduce){#about .about-hero>h2,#about .about-lede,#about .about-section,#about .about-by{filter:none;transform:none}}.about-close{z-index:2;width:44px;height:44px;color:var(--ink-dim);transition-property:color,background-color,scale;transition-duration:.25s,.25s,.15s;transition-timing-function:var(--ease), var(--ease), cubic-bezier(.2, 0, 0, 1);background:#0e0f12b3;border-radius:50%;flex:none;align-self:flex-end;place-items:center;margin:14px 14px -58px 0;display:grid;position:sticky;top:14px}.about-close svg{stroke:currentColor;stroke-width:1.6px;stroke-linecap:round;width:14px;height:14px}.about-close:active{scale:.96}.about-close:hover{color:var(--ink);background-color:#e9e6dd0f}.about-hero{text-align:center;-webkit-user-select:none;user-select:none;flex:none;place-content:center;justify-items:center;gap:22px;min-height:max(46vh,340px);padding:80px 24px 56px;display:grid;position:relative;overflow:hidden}.about-hero>:not(.splash){position:relative}#about h2{letter-spacing:-.02em;color:var(--ink);text-wrap:balance;margin:0;font-size:clamp(36px,7vw,72px);font-weight:600;line-height:1}.about-lede{text-wrap:balance;max-width:34em;color:var(--ink);opacity:.8;margin:0;font-size:clamp(16px,2vw,20px);line-height:1.5}.about-section{width:100%;max-width:1120px;color:var(--ink-dim);flex:none;grid-template-columns:minmax(200px,1fr) 2.2fr;gap:24px 64px;margin:0 auto;padding:clamp(40px,7vh,72px) clamp(24px,5vw,64px);font-size:14px;line-height:1.6;display:grid;position:relative}.about-section+.about-section:before,.about-hero+.about-section:before,.about-by:before{content:"";background:linear-gradient(90deg,#0000,#e9e6dd17 20% 80%,#0000);height:1px;position:absolute;top:0;left:0;right:0}@media (width>=761px){.about-section:has(.about-cards)>.about-head{z-index:1;align-self:start;position:sticky;top:28px}}.about-head h3{text-wrap:balance;letter-spacing:-.01em!important;text-transform:none!important;color:var(--ink)!important;margin:0 0 10px!important;font-size:clamp(20px,2.4vw,26px)!important;font-weight:600!important}.about-eyebrow{font-size:13px;font-weight:500;display:block}.about-head p{max-width:22em}.about-content{align-content:start;gap:28px;display:grid}#about p,.about-cards span,.about-keys dd{text-wrap:pretty;margin:0}#about .about-lede{text-wrap:balance}#about b{color:var(--ink);font-weight:500}.about-steps{counter-reset:step;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:32px 40px;margin:0;padding:0;list-style:none;display:grid}.about-steps li{counter-increment:step;align-content:start;gap:6px;display:grid}.about-steps li:before{content:counter(step, decimal-leading-zero);font-variant-numeric:tabular-nums;letter-spacing:.12em;color:var(--ink-dim);opacity:.7;margin-bottom:4px;font-size:11px}.about-steps b{font-size:15px}.about-steps span{text-wrap:pretty}.about-steps em{color:var(--ink);font-style:normal}.about-steps kbd{min-width:20px!important;height:20px!important;padding:0 5px!important;font-size:11px!important}@media (width<=760px){.about-steps{gap:24px}.about-steps li{grid-template-columns:30px 1fr;gap:4px 6px}.about-steps li:before{grid-row:span 2;margin:0;padding-top:4px}}.about-group{gap:14px;display:grid}.about-group h4{letter-spacing:.14em;text-transform:uppercase;color:var(--ink-dim);margin:0;font-size:11px;font-weight:500}.about-cards{--role:var(--ink);grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px;margin:0;padding:0;list-style:none;display:grid}.about-cards li{background:#e9e6dd04;border-radius:12px;align-content:start;gap:4px;padding:16px 16px 18px;display:grid;box-shadow:inset 0 0 0 1px #ffffff0f,0 1px 2px #00000040}.about-cards svg{width:100%;max-width:140px;height:16px;margin-bottom:10px;overflow:visible}.about-cards path{fill:none;stroke:var(--role);stroke-width:2px;stroke-linecap:round;stroke-linejoin:round}.about-cards circle{fill:var(--role)}.about-cards b{font-size:15px;color:var(--role)!important}.about-cards.about-lines{--role:var(--ink-dim)}.about-lines b{color:var(--ink)!important}.about-lines .weight-hi{stroke:var(--ink);stroke-width:3.2px}.about-lines li:first-child circle{fill:var(--ink)}.about-lines .dashed{stroke-dasharray:5 6}.about-lines .hollow{fill:var(--bg);stroke:currentColor;stroke-width:1.5px}.about-lines .dotted{stroke-dasharray:.01 6}.about-cards li{--tip-x:150px;--tip-y:24px;isolation:isolate;transition-property:box-shadow,translate;transition-duration:.3s;transition-timing-function:cubic-bezier(.2,0,0,1);position:relative}.about-cards li:before{content:"";z-index:-1;border-radius:inherit;background:radial-gradient(circle at var(--tip-x) var(--tip-y), color-mix(in srgb, var(--role) 16%, transparent), color-mix(in srgb, var(--role) 4%, transparent) 55%, transparent 85%);opacity:0;transition:opacity .35s cubic-bezier(.2,0,0,1);position:absolute;inset:0}.about-lines li:before{--role:var(--ink)}.about-cards circle{transform-box:fill-box;transform-origin:50%;transition:filter .3s cubic-bezier(.2,0,0,1)}@media (hover:hover){.about-cards li:hover{box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--role) 22%, transparent), 0 8px 20px -10px #000000b3;translate:0 -1px}.about-lines li:hover{box-shadow:inset 0 0 0 1px #ffffff1f,0 8px 20px -10px #000000b3}.about-cards li:hover:before{opacity:1}.about-cards li:hover circle{filter:drop-shadow(0 0 3px var(--role))}.about-lines li:hover circle{filter:drop-shadow(0 0 3px var(--ink-dim))}.about-cards li:hover path{animation:.55s cubic-bezier(.2,0,0,1) both ac-grow}.about-cards li:hover circle{animation:.45s cubic-bezier(.34,1.56,.64,1) .3s both ac-pop}.about-cards li.fn-T:hover circle{animation:.45s cubic-bezier(.34,1.56,.64,1) .3s both ac-pop,2.4s ease-in-out .8s infinite ac-breathe}.about-cards li.fn-SD:hover circle,.about-lines li.wavy:hover circle{animation:.45s cubic-bezier(.34,1.56,.64,1) .3s both ac-pop,1.8s ease-in-out .8s infinite ac-drift}.about-lines li.wavy:hover circle{animation-name:ac-pop,ac-hover}.about-cards li.fn-D:hover circle{animation:.45s cubic-bezier(.34,1.56,.64,1) .3s both ac-pop,.18s linear .8s infinite ac-tremble}.about-lines li:hover .dashed{animation:.55s cubic-bezier(.2,0,0,1) both ac-grow,.9s linear infinite ac-flow-dash}.about-lines li:hover .dotted{animation:.55s cubic-bezier(.2,0,0,1) both ac-grow,.6s linear infinite ac-flow-dot}.about-lines li.zigzag:hover svg,.about-lines li.wavy:hover svg{animation:.55s cubic-bezier(.2,0,0,1) both ac-grow}.about-lines li:hover .zig{animation:1.1s linear infinite ac-flow-zig}.about-lines li:hover .wave{animation:1.6s linear infinite ac-flow-wave}}@keyframes ac-grow{0%{clip-path:inset(-8px 100% -8px -8px)}to{clip-path:inset(-8px)}}@keyframes ac-pop{0%{scale:.25}to{scale:1}}@keyframes ac-breathe{50%{scale:1.25}}@keyframes ac-drift{50%{translate:4px}}@keyframes ac-hover{25%{translate:0 -1.5px}75%{translate:0 1.5px}}@keyframes ac-tremble{0%,to{translate:0}25%{translate:.8px -.4px}75%{translate:-.8px .4px}}@keyframes ac-flow-dash{to{stroke-dashoffset:-11px}}@keyframes ac-flow-dot{to{stroke-dashoffset:-6px}}@keyframes ac-flow-zig{to{translate:13px}}@keyframes ac-flow-wave{to{translate:19.5px}}@media (width<=760px){.about-cards li{--tip-x:72px;--tip-y:50%}}@media (prefers-reduced-motion:reduce){.about-cards li,.about-cards li:hover{translate:none}.about-cards li:hover path,.about-cards li:hover circle,.about-lines li:hover .dashed,.about-lines li:hover .dotted,.about-lines li:hover svg,.about-lines li:hover .zig,.about-lines li:hover .wave{animation:none!important}}.about-stack{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:0 32px;margin:0;padding:0;list-style:none;display:grid}.about-stack li{border-bottom:1px solid #e9e6dd12;justify-content:space-between;align-items:baseline;gap:16px;padding:12px 0;display:flex;position:relative}.about-stack b,.about-stack a{font-size:15px}.about-stack span{text-align:right}.about-stack a:after{content:"";position:absolute;inset:0}.about-keys{grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px 32px;margin:0;display:grid}.about-keys div{align-items:center;gap:14px;display:flex}.about-keys dt{min-width:76px;color:var(--ink-dim);flex:none;align-items:center;gap:4px;display:flex}.about-keys dd{margin:0}#about kbd{min-width:26px;height:26px;font:inherit;color:var(--ink);background:#e9e6dd08;border-radius:6px;place-items:center;padding:0 7px;font-size:12px;display:inline-grid;box-shadow:inset 0 0 0 1px #ffffff1a,inset 0 -1.5px #ffffff14}#about dd kbd{min-width:20px;height:20px;padding:0 5px;font-size:11px}@media (width<=640px){#about{box-shadow:none;border-radius:0;margin:0;transform:translateY(16px)}#about.shown{transform:none}.about-close{top:calc(8px + var(--safe-t));margin:calc(8px + var(--safe-t)) 8px calc(-52px - var(--safe-t)) 0}.about-hero{padding-top:calc(80px + var(--safe-t))}.about-section{padding-left:calc(24px + var(--safe-l));padding-right:calc(24px + var(--safe-r))}}@media (width<=760px){.about-section{grid-template-columns:1fr}.about-cards{gap:8px}.about-cards li{grid-template-columns:64px 1fr;gap:2px 14px;padding:14px}.about-cards svg{grid-row:span 2;align-self:center;margin:0}}#about a{color:var(--ink);text-decoration:underline;-webkit-text-decoration-color:var(--ink-faint);text-decoration-color:var(--ink-faint);text-underline-offset:3px;transition:text-decoration-color .25s var(--ease)}#about a:hover{-webkit-text-decoration-color:var(--ink-dim);text-decoration-color:var(--ink-dim)}.about-by{padding:44px 24px calc(36px + var(--safe-b));text-align:center;color:var(--ink-dim);flex-direction:column;flex:none;align-items:center;gap:10px;font-size:14px;display:flex;position:relative}.about-by a{color:var(--accent)!important;-webkit-text-decoration-color:color-mix(in srgb, var(--accent) 35%, transparent)!important;text-decoration-color:color-mix(in srgb, var(--accent) 35%, transparent)!important}.about-by-year{opacity:.7;font-size:12px}.coda{transition-property:background-color,scale;transition-duration:.25s,.15s;transition-timing-function:var(--ease), cubic-bezier(.2, 0, 0, 1);border-radius:14px;margin-bottom:8px;padding:10px 14px 4px}.coda:hover{background-color:#e9e6dd08}.coda:active{scale:.96}.coda-line{width:min(360px,78vw);height:auto;display:block;overflow:visible}.cd-seg,.cd-coda circle,.cd-coda path{fill:none;stroke:var(--role);stroke-width:2px;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1px}.cd-strong{stroke-width:3.2px}.cd-coda{--role:var(--ink)}.cd-coda circle,.cd-coda path{stroke-width:1.8px}.cd-dot{fill:var(--role);transform-box:fill-box;transform-origin:50%;scale:0}.cd-glow{fill:var(--accent);filter:blur(9px);opacity:0}.cd-name{fill:var(--role);text-anchor:middle;opacity:0;font-size:11.5px;font-weight:500}.about-by.drawn .cd-seg,.about-by.drawn .cd-coda circle,.about-by.drawn .cd-coda path{animation:.55s cubic-bezier(.2,0,0,1) forwards cd-draw;animation-delay:calc(var(--k) * .28s)}.about-by.drawn .cd-coda path{animation-delay:calc(var(--k) * .28s + .18s)}.about-by.drawn .cd-dot{animation:.5s cubic-bezier(.34,1.56,.64,1) forwards cd-pop;animation-delay:calc(var(--k) * .28s)}.about-by.drawn .cd-name{animation:cd-fade .5s var(--ease) forwards}.about-by.drawn .cd-name:first-of-type{animation-delay:.25s}.about-by.drawn .cd-name:nth-of-type(2){animation-delay:.53s}.about-by.drawn .cd-name:nth-of-type(3){animation-delay:.85s}.about-by.drawn .cd-glow{animation:cd-glow-in .6s var(--ease) .85s forwards, cd-breathe 3.6s var(--ease) 1.45s infinite}@keyframes cd-draw{to{stroke-dashoffset:0}}@keyframes cd-pop{to{scale:1}}@keyframes cd-fade{to{opacity:1}}@keyframes cd-glow-in{to{opacity:.45}}@keyframes cd-breathe{0%,to{opacity:.45}50%{opacity:.22}}@media (prefers-reduced-motion:reduce){.about-by .cd-seg,.about-by .cd-coda circle,.about-by .cd-coda path{stroke-dashoffset:0;animation:none!important}.about-by .cd-dot{scale:1;animation:none!important}.about-by .cd-name{opacity:1;animation:none!important}.about-by .cd-glow{opacity:.4;animation:none!important}}@media (hover:none){.desk-only{display:none}}.sheet{display:contents}#settings,.sheet-head,.dice-menu .sheet-grip,#undo{display:none}#scrim{z-index:19;transition:opacity .4s var(--ease);background:#00000080;position:fixed;inset:0}#scrim[hidden]{opacity:0;pointer-events:none;display:block}.undo svg{fill:none;stroke:currentColor;stroke-width:1.4px;stroke-linecap:round;stroke-linejoin:round;width:17px;height:17px}@media (hover:none),(width<=640px){#undo{place-items:center;display:grid}}@media (hover:none){.chip.tip .x,.chip.picked .x{opacity:.85}.tab.on .tab-x{opacity:.7}.group-act{opacity:1}#picker .mode.current:after{content:attr(data-hint);color:var(--ink-dim);opacity:.7;font-size:.8em;position:absolute;top:100%;left:50%;transform:translate(-50%)}}@media (pointer:coarse){.toggle{min-width:32px;min-height:44px}.play{width:44px;height:44px}.chip{padding:11px 14px}.chip:after{bottom:5px;left:14px;right:14px}.chip .x{width:22px;height:22px;font-size:13px;line-height:22px;top:-6px;right:-5px}.tab{padding:12px}.tab-x{padding:2px 5px;top:2px;right:-8px}.tab-add{width:36px;height:36px;padding:0}.group-act{width:34px;height:34px}.menu button{padding:12px}.dice-menu .seg button{padding:9px 11px}.dice-menu .dice-actions button{padding:12px 0}#picker .key{--s:clamp(36px, calc(40px * var(--z,1)), 64px)}#picker .mode{padding:10px 8px}.tempo input{height:32px}}@media (width<=640px){:root{--strip-h:68px}#strip{border-radius:16px;gap:10px;padding:0 10px}.chips{align-self:stretch;padding:0 8px}.corner{top:calc(10px + var(--safe-t));gap:10px}.corner.tl{left:calc(12px + var(--safe-l));z-index:21}.corner.tr{right:calc(12px + var(--safe-r))}.dice span{display:none}#tabs{bottom:calc(var(--strip-total) + 4px);max-width:calc(100vw - 16px)}.pill{top:auto;bottom:calc(var(--strip-total) + 62px)}.pill.clear{top:calc(44px + var(--safe-t));bottom:auto;right:calc(12px + var(--safe-r))}#dice-menu.menu.dice-menu{min-width:0;padding:6px calc(20px + var(--safe-r)) calc(22px + var(--safe-b)) calc(20px + var(--safe-l));border:0;border-top:1px solid var(--ink-faint);visibility:visible;transition:transform .45s var(--ease), opacity .3s var(--ease);background:#111215;border-radius:18px 18px 0 0;gap:16px;position:fixed;inset:auto 0 0;transform:none}#dice-menu.menu.dice-menu[hidden]{opacity:1;visibility:hidden;transition:transform .45s var(--ease), visibility 0s .45s;transform:translateY(105%)}#dice-menu.dragging{transition:none}#dress-menu.dress-menu{width:auto;padding:14px calc(16px + var(--safe-r)) calc(18px + var(--safe-b)) calc(16px + var(--safe-l));border:0;border-top:1px solid var(--ink-faint);transition:transform .4s var(--ease), opacity .3s var(--ease);background:#111215;border-radius:18px 18px 0 0;bottom:0;left:0;right:0;transform:none}#dress-menu.dress-menu[hidden]{opacity:1;transform:translateY(105%)}#dress-menu .menu .dress,#dress-menu .dress{padding:13px 6px;font-size:15px}.dice-menu .menu-head{letter-spacing:.14em;text-transform:uppercase;touch-action:none;cursor:grab;flex-direction:column;align-items:flex-start;gap:10px;padding:6px 0 4px;font-size:12px;display:flex}.dice-menu .sheet-grip{align-self:center;display:block}.dice-menu .field{flex-direction:column;align-items:stretch;gap:8px}.dice-menu .seg{border-radius:10px}.dice-menu .seg button{flex:1 1 0;min-height:40px;font-size:13px}.dice-menu .dice-actions button{min-height:46px;font-size:14px}.label{font-size:max(13px, calc(11.5px / var(--z,1)))}.label.active{font-size:max(15px, calc(13px / var(--z,1)))}.label .roman{font-size:max(10px, calc(9px / var(--z,1)))}#settings{font-variant-numeric:tabular-nums;align-items:center;gap:5px;padding:0 4px;display:flex}#settings .unit,#settings .sep{opacity:.55}#settings:after{content:"▾";opacity:.6;margin-left:1px;font-size:9px}body.sheet-open #settings{color:var(--ink)}.sheet{z-index:20;padding:6px calc(20px + var(--safe-r)) calc(22px + var(--safe-b)) calc(20px + var(--safe-l));border-top:1px solid var(--ink-faint);color:var(--ink-dim);visibility:hidden;transition:transform .45s var(--ease), visibility 0s .45s;background:#111215;border-radius:18px 18px 0 0;grid-template-columns:1fr 1fr;gap:12px;font-size:14px;display:grid;position:fixed;bottom:0;left:0;right:0;transform:translateY(105%)}body.sheet-open .sheet{visibility:visible;transition:transform .45s var(--ease);transform:none}.sheet.dragging{transition:none}.sheet-head{touch-action:none;cursor:grab;flex-direction:column;grid-column:1/-1;align-items:center;gap:10px;padding:6px 0 4px;display:flex}.sheet-grip{background:var(--ink-faint);border-radius:2px;width:36px;height:4px}.sheet-title{letter-spacing:.14em;text-transform:uppercase;align-self:flex-start;font-size:12px}.sheet .tempo{color:var(--ink);grid-column:1/-1;gap:12px;font-size:15px}.sheet .tempo input{flex:1;width:auto;height:36px}.sheet .tempo input::-webkit-slider-thumb{width:22px;height:22px;margin-top:-10.5px}.sheet .tempo input::-moz-range-thumb{width:22px;height:22px}.sheet .tempo .unit{margin-left:-8px}.sheet .style-wrap{grid-column:1/-1}#style,#voice{display:none}.sheet .voice-wrap:before{content:"Voice";letter-spacing:.14em;text-transform:uppercase;color:var(--ink-dim);margin:4px 0 8px;font-size:11px;display:block}#sheet #voice-menu .menu-sub{display:none}#sheet #voice-menu,#sheet #voice-menu[hidden]{grid-template-columns:repeat(3,1fr)!important}#sheet #style-menu,#sheet #style-menu[hidden],#sheet #voice-menu,#sheet #voice-menu[hidden]{opacity:1;pointer-events:auto;background:0 0;border:0;grid-template-columns:1fr 1fr;gap:8px;min-width:0;padding:0;display:grid;position:static;transform:none}#sheet #style-menu button,#sheet #voice-menu button{border:1px solid var(--ink-faint);border-radius:10px;justify-content:center;padding:9px 12px}#sheet #style-menu button.on,#sheet #voice-menu button.on{border-color:color-mix(in srgb, var(--accent) 50%, transparent)}#sheet #loop,#sheet #metro{border:1px solid var(--ink-faint);min-height:46px;transition:color .25s var(--ease), border-color .25s var(--ease), background .25s var(--ease);border-radius:10px;font-size:14px}#sheet #loop[aria-pressed=true],#sheet #metro[aria-pressed=true]{border-color:var(--ink-dim);background:#e9e6dd0f}}@media (height<=500px) and (pointer:coarse){:root{--strip-h:58px}.corner{top:calc(4px + var(--safe-t))}#tabs{bottom:calc(var(--strip-total) + 2px)}.tab{padding:8px 10px}#keys-panel{display:none!important}.sheet{max-height:90vh;overflow-y:auto}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.12s!important;transition-delay:0s!important;animation-duration:.01ms!important}}.about-eyebrow,.about-group h4,.menu-head-title,.sheet-title,.sheet .voice-wrap:before,.lens-row:before{--stem:14px;padding-left:calc(var(--stem) + 14px);background:radial-gradient(circle closest-side, currentColor 90%, transparent) 0 50% / 6px 6px no-repeat, linear-gradient(currentColor, currentColor) 8px 50% / var(--stem) 1.5px no-repeat;letter-spacing:.005em;text-transform:none;font-size:12.5px;font-weight:500}.lens-row:before{--stem:9px;padding-left:calc(10px + var(--stem) + 12px);opacity:.85;background-position:10px,18px;font-size:11px}