@layer components{:root{--hw-r-chassis:28px;--hw-r-panel:18px;--hw-r-key:12px;--hw-r-screen:14px;--hw-travel:4px;--hw-ease:cubic-bezier(0.22,1,0.36,1);--hw-spring:linear(0,0.18 4.5%,0.58 11%,0.92 18%,1.08 25%,1.12 30%,1.08 37%,1.01 47%,0.985 56%,1 70%,1);--hw-press-ms:60ms;--hw-release-ms:420ms}body{--hw-mono:var(--font-geist-mono),ui-monospace,"SF Mono",Menlo,monospace;--hw-display:var(--font-display),var(--font-sans),system-ui,sans-serif}.hw-chassis{position:relative;isolation:isolate;border-radius:var(--hw-r-chassis);padding:clamp(16px,2.2vw,28px);color:var(--hw-ink);background:radial-gradient(120% 60% at 50% -12%,oklch(1 0 0/.075),transparent 46%),repeating-linear-gradient(90deg,oklch(1 0 0/.016) 0 1px,transparent 1px 3px),conic-gradient(from 200deg at 30% 0,var(--hw-chassis-hi),var(--hw-chassis) 25%,var(--hw-chassis-hi) 45%,var(--hw-chassis-lo) 70%,var(--hw-chassis-hi)),var(--hw-chassis);box-shadow:inset 0 1px 0 oklch(1 0 0/.14),inset 0 -2px 0 oklch(0 0 0/.5),0 0 0 1px oklch(0 0 0/.65),0 0 0 2px color-mix(in oklch,var(--hw-chassis-hi) 70%,transparent),0 40px 80px -40px oklch(0 0 0/.9)}.hw-chassis[data-tone=flat]{background:linear-gradient(180deg,var(--hw-chassis-hi),var(--hw-chassis))}.hw-chassis>.hw-screw{position:absolute;z-index:1}.hw-chassis>.hw-screw[data-corner=tl]{top:10px;left:10px}.hw-chassis>.hw-screw[data-corner=tr]{top:10px;right:10px}.hw-chassis>.hw-screw[data-corner=bl]{bottom:10px;left:10px}.hw-chassis>.hw-screw[data-corner=br]{bottom:10px;right:10px}.hw-panel{position:relative;min-width:0;border-radius:var(--hw-r-panel);padding:clamp(14px,1.6vw,20px);background:linear-gradient(180deg,color-mix(in oklch,var(--hw-chassis-hi) 70%,var(--hw-chassis)),var(--hw-chassis));box-shadow:inset 0 1px 0 oklch(1 0 0/.08),0 0 0 1px oklch(0 0 0/.5),0 14px 30px -18px oklch(0 0 0/.85)}.hw-panel[data-tone=inset]{background:linear-gradient(180deg,var(--hw-well),color-mix(in oklch,var(--hw-well) 60%,var(--hw-chassis)));box-shadow:inset 0 2px 6px oklch(0 0 0/.75),inset 0 0 0 1px oklch(0 0 0/.6),0 1px 0 oklch(1 0 0/.07)}.hw-panel-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px;min-height:24px}.hw-panel-head>:first-child{flex:1;min-width:0}.hw-screw{display:inline-block;flex:none;width:12px;height:12px;border-radius:50%;background:radial-gradient(circle at 35% 30%,oklch(.62 calc(.02 * var(--surf-c)) var(--brand-h)),oklch(.22 calc(.02 * var(--surf-c)) var(--brand-h)) 70%);box-shadow:inset 0 0 0 1px oklch(0 0 0/.75),0 1px 0 oklch(1 0 0/.1);position:relative}.hw-screw:after{content:"";position:absolute;left:2px;right:2px;top:5.4px;height:1.2px;background:oklch(.1 .01 var(--brand-h));transform:rotate(var(--hw-screw-a,40deg))}.hw-screw[data-kind=hex]:after{left:3.5px;right:3.5px;top:3.5px;bottom:3.5px;height:auto;transform:none;clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%)}.hw-engrave{display:flex;align-items:center;gap:10px;margin:0;font:600 11px/1.2 var(--hw-mono);letter-spacing:.18em;text-transform:uppercase;color:var(--hw-legend);text-shadow:0 -1px 0 oklch(0 0 0/.65),0 1px 0 oklch(1 0 0/.07)}.hw-engrave-n{color:var(--brand-ink)}.hw-engrave-dash{color:var(--hw-legend-dim)}.hw-engrave[data-rule]:after{content:"";flex:1;height:1px;min-width:24px;background:linear-gradient(90deg,oklch(0 0 0/.6),transparent);box-shadow:0 1px 0 oklch(1 0 0/.06)}.hw-legend{font:500 11px/1.3 var(--hw-mono);letter-spacing:.08em;color:var(--hw-legend)}.hw-tape{display:inline-flex;align-items:center;min-height:22px;padding:2px 10px;margin:0;border-radius:3px;transform:rotate(-1.2deg);font:700 11px/1.2 var(--hw-mono);letter-spacing:.16em;text-transform:uppercase;color:oklch(.97 .01 var(--brand-h));text-shadow:0 1px 0 oklch(0 0 0/.6),0 -1px 0 oklch(1 0 0/.18);background:repeating-linear-gradient(90deg,oklch(1 0 0/.03) 0 1px,transparent 1px 4px),linear-gradient(180deg,color-mix(in oklch,var(--brand-2) 55%,oklch(.2 .02 var(--brand-h))),color-mix(in oklch,var(--brand-2) 40%,oklch(.16 .02 var(--brand-h))));box-shadow:inset 0 1px 0 oklch(1 0 0/.12),0 2px 4px oklch(0 0 0/.5)}.hw-tape[data-tone=plain]{background:linear-gradient(180deg,oklch(.26 .01 var(--brand-h)),oklch(.2 .01 var(--brand-h)))}.hw-led{--hw-led:var(--brand);display:inline-block;flex:none;position:relative;width:8px;height:8px;border-radius:50%;background:var(--hw-led-off);box-shadow:inset 0 1px 1.5px oklch(0 0 0/.75),0 1px 0 oklch(1 0 0/.08)}.hw-led:after{content:"";position:absolute;inset:0;border-radius:50%;opacity:0;background:radial-gradient(circle at 40% 35%,oklch(1 0 0/.95) 0 14%,var(--hw-led) 48%);box-shadow:0 0 6px var(--hw-led),0 0 14px color-mix(in oklch,var(--hw-led) 55%,transparent);transition:opacity .18s ease-out}.hw-led[data-tone=up]{--hw-led:var(--hw-up)}.hw-led[data-tone=down]{--hw-led:var(--hw-down)}.hw-led[data-tone=white]{--hw-led:oklch(0.96 0.01 var(--brand-h))}.hw-key[aria-current=page] .hw-led:after,.hw-key[aria-pressed=true] .hw-led:after,.hw-key[data-latched] .hw-led:after,.hw-led[data-on]:after,.hw-switch[aria-checked=true] .hw-led:after,.hw-switch[aria-pressed=true] .hw-led:after{opacity:1}.hw-led[data-pulse][data-on]:after{animation:hw-led-pulse 1.8s ease-in-out infinite}@keyframes hw-led-pulse{50%{opacity:.45}}.hw-status{align-items:center;gap:7px;font:600 10.5px/1 var(--hw-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--hw-legend);white-space:nowrap}.hw-key,.hw-status{display:inline-flex}.hw-key{--k-top:var(--hw-cap-top);--k-bot:var(--hw-cap-bot);--k-skirt:var(--hw-skirt);--k-ink:var(--hw-ink);--k-travel:var(--hw-travel);--k-h:40px;--k-pad:16px;--k-fs:14px;position:relative;flex:none;vertical-align:top;min-height:calc(var(--k-h) + var(--k-travel));padding:0 0 var(--k-travel);margin:0;border:0;border-radius:var(--hw-r-key);background:none;color:var(--k-ink);font:600 var(--k-fs)/1 var(--font-sans),system-ui,sans-serif;text-decoration:none;cursor:pointer;user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation}.hw-key:before{content:"";position:absolute;left:0;right:0;top:var(--k-travel);bottom:0;border-radius:inherit;background:linear-gradient(180deg,var(--k-skirt),color-mix(in oklch,var(--k-skirt) 70%,black));box-shadow:0 1px 0 oklch(0 0 0/.55),0 8px 16px -8px oklch(0 0 0/.85)}.hw-key-cap{position:relative;z-index:1;flex:1;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:var(--k-h);padding:0 var(--k-pad);border-radius:inherit;white-space:nowrap;background:linear-gradient(180deg,var(--k-top),var(--k-bot));box-shadow:inset 0 1px 0 var(--hw-edge-hi),inset 0 -1px 0 oklch(0 0 0/.28),inset 0 0 0 1px oklch(0 0 0/.25);transform:translateY(0);transition:transform var(--hw-release-ms) var(--hw-spring)}.hw-key-cap>svg{width:17px;height:17px;flex:none}.hw-key-label{min-width:0;overflow:hidden;text-overflow:ellipsis}.hw-key-legend{font:600 10px/1 var(--hw-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--hw-legend)}.hw-key-led{margin-left:auto}.hw-key-cap>.hw-led:first-child{margin-left:0}.hw-key-badge{margin-left:auto;min-width:22px;height:18px;padding:0 5px;border-radius:4px;display:inline-flex;align-items:center;justify-content:center;font:700 11px/1 var(--hw-mono);color:var(--hw-phosphor);background:var(--hw-glass);box-shadow:inset 0 1px 3px oklch(0 0 0/.8);text-shadow:0 0 8px var(--hw-phosphor-glow)}@media (hover:hover){.hw-key:hover{--k-top:oklch(0.31 calc(0.03 * var(--surf-c)) var(--brand-h))}}.hw-key:active .hw-key-cap,.hw-key[data-down] .hw-key-cap{transform:translateY(var(--k-travel));transition:transform var(--hw-press-ms) ease-out}.hw-key[aria-current=page] .hw-key-cap,.hw-key[aria-pressed=true] .hw-key-cap,.hw-key[data-latched] .hw-key-cap{transform:translateY(calc(var(--k-travel) * .6));background:radial-gradient(120% 120% at 50% 120%,color-mix(in oklch,var(--brand) 22%,transparent),transparent 70%),linear-gradient(180deg,color-mix(in oklch,var(--k-top) 85%,var(--brand)),var(--k-bot));box-shadow:inset 0 1px 0 var(--hw-edge-hi),inset 0 0 0 1px color-mix(in oklch,var(--brand) 35%,transparent)}.hw-key[aria-current=page],.hw-key[aria-pressed=true],.hw-key[data-latched]{--k-ink:var(--hw-ink)}.hw-key[aria-current=page] .hw-key-cap:before,.hw-key[data-latched] .hw-key-cap:before{content:"";position:absolute;left:6px;top:25%;bottom:25%;width:3px;border-radius:2px;background:var(--brand-ink);box-shadow:0 0 8px var(--brand),0 0 16px var(--brand-glow)}.hw-key--icon[aria-current=page] .hw-key-cap:before,.hw-key--icon[data-latched] .hw-key-cap:before{left:25%;right:25%;top:auto;bottom:4px;width:auto;height:2px}.hw-key[aria-current=page] .hw-key-cap>svg,.hw-key[aria-pressed=true] .hw-key-cap>svg,.hw-key[data-latched] .hw-key-cap>svg{color:var(--brand-ink)}.hw-key:focus-visible{outline:none}.hw-key:focus-visible .hw-key-cap{outline:2px solid var(--brand);outline-offset:3px}.hw-key:disabled,.hw-key[aria-disabled=true]{cursor:not-allowed;opacity:.55}.hw-key:disabled .hw-key-cap,.hw-key[aria-disabled=true] .hw-key-cap{transform:none}.hw-key--primary{--k-top:color-mix(in oklch,var(--brand) 92%,white);--k-bot:var(--brand-2);--k-skirt:color-mix(in oklch,var(--brand-2) 55%,black);--k-ink:var(--brand-on)}.hw-key--primary:before{box-shadow:0 1px 0 oklch(0 0 0/.55),0 10px 22px -8px var(--brand-glow)}@media (hover:hover){.hw-key--primary:hover{--k-top:color-mix(in oklch,var(--brand) 80%,white)}}.hw-key--primary .hw-key-cap{box-shadow:inset 0 1px 0 oklch(1 0 0/.35),inset 0 -1px 0 oklch(0 0 0/.2)}.hw-key--primary .hw-key-legend{color:inherit;opacity:.8}.hw-key--danger{--k-top:color-mix(in oklab,var(--hw-danger) 34%,var(--hw-cap-top));--k-bot:color-mix(in oklab,var(--hw-danger) 22%,var(--hw-cap-bot));--k-skirt:color-mix(in oklab,var(--hw-danger) 30%,black);--k-ink:var(--hw-danger-ink)}.hw-key--danger .hw-key-legend{color:var(--hw-danger-ink);opacity:.8}@media (hover:hover){.hw-key--danger:hover{--k-top:color-mix(in oklab,var(--hw-danger) 44%,var(--hw-cap-top))}}.hw-key--quiet{--k-travel:2px;--k-skirt:transparent;--k-top:transparent;--k-bot:transparent;--k-ink:var(--hw-ink-2)}.hw-key--quiet:before{box-shadow:none;background:none}.hw-key--quiet .hw-key-cap{box-shadow:none}@media (hover:hover){.hw-key--quiet:hover{--k-top:oklch(1 0 0/0.06);--k-bot:oklch(1 0 0/0.03);--k-ink:var(--hw-ink)}}.hw-key--quiet[aria-current=page],.hw-key--quiet[aria-pressed=true],.hw-key--quiet[data-latched]{--k-skirt:var(--hw-skirt);--k-top:var(--hw-cap-top);--k-bot:var(--hw-cap-bot)}.hw-key--sm{--k-h:36px;--k-pad:12px;--k-fs:13px}.hw-key--md{--k-h:40px}.hw-key--lg{--k-h:50px;--k-pad:22px;--k-fs:15px;--k-travel:5px;border-radius:14px}.hw-key--icon .hw-key-cap{padding:0;width:var(--k-h)}.hw-key--block{display:flex;width:100%}.hw-key--start .hw-key-cap{justify-content:flex-start}.hw-screen{position:relative;min-width:0;padding:5px;border-radius:var(--hw-r-screen);background:linear-gradient(180deg,oklch(0 0 0/.55),oklch(1 0 0/.04));box-shadow:inset 0 1px 1px oklch(0 0 0/.7),0 1px 0 oklch(1 0 0/.08)}.hw-screen-glass{position:relative;overflow:hidden;height:100%;border-radius:calc(var(--hw-r-screen) - 4px);padding:12px 14px;color:var(--hw-phosphor);background:radial-gradient(120% 100% at 18% 0,color-mix(in oklch,var(--brand) 13%,var(--hw-glass)),var(--hw-glass) 62%);box-shadow:inset 0 2px 12px oklch(0 0 0/.85),inset 0 0 0 1px oklch(0 0 0/.7);text-shadow:0 0 14px var(--hw-phosphor-glow)}.hw-screen-glass:after{content:"";position:absolute;inset:0;pointer-events:none;z-index:2;background:linear-gradient(160deg,oklch(1 0 0/.075),transparent 38%),repeating-linear-gradient(0deg,oklch(0 0 0/.16) 0 1px,transparent 1px 3px)}.hw-screen[data-kind=matrix] .hw-screen-glass:after{background:linear-gradient(160deg,oklch(1 0 0/.07),transparent 38%),radial-gradient(circle,transparent 1px,oklch(0 0 0/.3) 1.4px) 0 0 /3px 3px}.hw-screen-crisp{position:relative;z-index:3;text-shadow:none}.hw-screen-flash{position:absolute;inset:0;z-index:3;pointer-events:none;opacity:0;background:radial-gradient(120% 100% at 30% 20%,color-mix(in oklch,var(--brand-ink) 45%,transparent),transparent 75%);animation:hw-flicker .9s step-end 1 both}@keyframes hw-flicker{0%{opacity:.55}8%{opacity:.1}14%{opacity:.45}22%{opacity:0}30%{opacity:.3}38%{opacity:.05}52%{opacity:.14}64%,to{opacity:0}}.hw-screen-head{position:relative;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:6px}.hw-screen-label{font:600 10.5px/1.2 var(--hw-mono);letter-spacing:.18em;text-transform:uppercase;color:color-mix(in oklch,var(--hw-phosphor) 80%,transparent);text-shadow:none}.hw-screen-body{position:relative;z-index:1}.hw-screen[data-size=sm] .hw-screen-glass{padding:6px 10px}.hw-roll{font-variant-numeric:tabular-nums;white-space:nowrap}.hw-roll,.hw-roll-vis{display:inline-flex;align-items:baseline}.hw-roll-col{display:inline-block;position:relative;height:1.08em;line-height:1.08em;overflow:hidden;vertical-align:bottom}.hw-roll-stack{display:flex;flex-direction:column;transform:translateY(calc(var(--d) * -10%));transition:transform .75s var(--hw-spring)}.hw-roll-stack>span{display:block;height:1.08em;text-align:center}.hw-roll-ch{display:inline-block;line-height:1.08em;white-space:pre}.hw-display{display:inline-flex;align-items:baseline;font-family:var(--hw-display);font-weight:800;letter-spacing:-.045em;line-height:.95;color:var(--hw-ink)}.hw-display[data-glow]{color:var(--hw-phosphor);text-shadow:0 0 18px var(--hw-phosphor-glow),0 0 2px color-mix(in oklch,var(--brand-ink) 60%,transparent)}.hw-display-cents{font-size:.44em;letter-spacing:-.02em;margin-left:.04em;opacity:.85}.hw-display[data-size=xl]{font-size:clamp(54px,8.4vw,132px)}.hw-display[data-size=lg]{font-size:clamp(40px,5vw,72px)}.hw-display[data-size=md]{font-size:30px}.hw-display[data-size=sm]{font-size:19px;letter-spacing:-.02em}.hw-switch{display:inline-flex;align-items:center;gap:10px;min-height:40px;padding:0 4px;border:0;background:none;cursor:pointer;color:var(--hw-ink-2);font:600 11px/1 var(--hw-mono);letter-spacing:.14em;text-transform:uppercase;border-radius:10px;-webkit-tap-highlight-color:transparent}.hw-switch-body{position:relative;flex:none;width:46px;height:24px;border-radius:12px;background:linear-gradient(180deg,var(--hw-well),color-mix(in oklch,var(--hw-well) 60%,var(--hw-chassis)));box-shadow:inset 0 2px 4px oklch(0 0 0/.8),inset 0 0 0 1px oklch(0 0 0/.6),0 1px 0 oklch(1 0 0/.08)}.hw-switch-body:before{content:"";position:absolute;inset:4px;border-radius:8px;opacity:0;background:linear-gradient(90deg,color-mix(in oklch,var(--brand) 55%,transparent),transparent);transition:opacity .2s}.hw-switch-lever{position:absolute;top:2px;left:2px;width:20px;height:20px;border-radius:50%;background:radial-gradient(circle at 40% 30%,oklch(.5 calc(.03 * var(--surf-c)) var(--brand-h)),var(--hw-cap-bot) 70%);box-shadow:0 2px 3px oklch(0 0 0/.7),inset 0 1px 0 oklch(1 0 0/.25);transform:translateX(0);transition:transform var(--hw-release-ms) var(--hw-spring)}.hw-switch[aria-checked=true] .hw-switch-lever,.hw-switch[aria-pressed=true] .hw-switch-lever{transform:translateX(22px)}.hw-switch[aria-checked=true] .hw-switch-body:before,.hw-switch[aria-pressed=true] .hw-switch-body:before{opacity:1}.hw-switch[aria-checked=true],.hw-switch[aria-pressed=true]{color:var(--hw-ink)}.hw-switch:focus-visible{outline:2px solid var(--brand-ink);outline-offset:2px}.hw-switch-text-on,.hw-switch[aria-checked=false] .hw-switch-text-on,.hw-switch[aria-pressed=false] .hw-switch-text-on{display:none}.hw-switch[aria-checked=true] .hw-switch-text-on,.hw-switch[aria-pressed=true] .hw-switch-text-on{display:inline}.hw-switch[aria-checked=true] .hw-switch-text-off,.hw-switch[aria-pressed=true] .hw-switch-text-off{display:none}.hw-seg{display:inline-flex;flex-wrap:wrap;gap:6px;padding:5px 5px 4px;border-radius:15px;background:var(--hw-well);box-shadow:inset 0 2px 5px oklch(0 0 0/.75),0 1px 0 oklch(1 0 0/.07)}.hw-seg .hw-key{border-radius:10px}.hw-knob{position:relative;display:inline-grid;justify-items:center;gap:4px;width:84px;padding:4px 0}.hw-knob-dial{position:relative;width:60px;height:60px}.hw-knob-dial svg{position:absolute;inset:-6px;width:72px;height:72px;overflow:visible}.hw-knob-track{fill:none;stroke:var(--hw-well);stroke-width:4;stroke-linecap:round}.hw-knob-arc{fill:none;stroke:var(--brand);stroke-width:4;stroke-linecap:round;filter:drop-shadow(0 0 3px var(--brand-glow))}.hw-knob-cap{position:absolute;inset:6px;border-radius:50%;background:repeating-conic-gradient(from 0deg,oklch(1 0 0/.05) 0 4deg,transparent 4deg 9deg),radial-gradient(circle at 40% 30%,oklch(.42 calc(.03 * var(--surf-c)) var(--brand-h)),var(--hw-cap-bot) 68%,var(--hw-skirt));box-shadow:0 4px 0 var(--hw-skirt),0 8px 14px -4px oklch(0 0 0/.85),inset 0 1px 0 oklch(1 0 0/.2);transform:rotate(var(--hw-knob-a,0deg));transition:transform .24s var(--hw-ease)}.hw-knob-cap:after{content:"";position:absolute;left:calc(50% - 1.5px);top:5px;width:3px;height:12px;border-radius:2px;background:var(--brand-ink);box-shadow:0 0 6px var(--brand-glow)}.hw-knob-label{font:600 10.5px/1.2 var(--hw-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--hw-legend);text-align:center}.hw-knob-value{font:600 12px/1.2 var(--hw-mono);color:var(--hw-ink);font-variant-numeric:tabular-nums}.hw-knob-input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:ew-resize;touch-action:pan-y}.hw-knob:has(.hw-knob-input:focus-visible) .hw-knob-cap{outline:2px solid var(--brand-ink);outline-offset:5px}.hw-knob:has(.hw-knob-input:disabled),.hw-slider:has(.hw-range:disabled),.hw-switch:disabled{opacity:.55;cursor:not-allowed}.hw-knob-input:disabled{cursor:not-allowed}.hw-slider{display:grid;gap:4px;min-width:0}.hw-slider-head{display:flex;justify-content:space-between;align-items:baseline;gap:8px}.hw-slider-label{font:600 10.5px/1.2 var(--hw-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--hw-legend)}.hw-slider-value{font:600 12.5px/1.2 var(--hw-mono);color:var(--hw-phosphor);text-shadow:0 0 8px var(--hw-phosphor-glow);font-variant-numeric:tabular-nums}.hw-slider-rail{position:relative;height:40px}.hw-slider-groove{position:absolute;left:0;right:0;top:16px;height:8px;border-radius:4px;pointer-events:none;background:var(--hw-well);box-shadow:inset 0 1px 3px oklch(0 0 0/.9),0 1px 0 oklch(1 0 0/.07)}.hw-slider-fill{position:absolute;top:0;bottom:0;border-radius:inherit;background:var(--brand-grad);box-shadow:0 0 10px var(--brand-glow)}.hw-slider-ticks{position:absolute;left:11px;right:11px;top:30px;height:6px;pointer-events:none;background:repeating-linear-gradient(90deg,oklch(1 0 0/.22) 0 1px,transparent 1px 10%)}.hw-range{-webkit-appearance:none;appearance:none;position:absolute;inset:0;width:100%;height:40px;margin:0;background:transparent;cursor:pointer;touch-action:pan-y}.hw-range:focus{outline:none}.hw-range::-webkit-slider-runnable-track{height:40px;background:transparent;border:0}.hw-range::-moz-range-track{height:40px;background:transparent;border:0}.hw-range::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:22px;height:30px;margin-top:3px;border:0;border-radius:5px;cursor:grab;background:linear-gradient(90deg,transparent 44%,oklch(1 0 0/.55) 44% 56%,transparent 56%),linear-gradient(180deg,var(--hw-cap-top),var(--hw-cap-bot));box-shadow:0 3px 0 var(--hw-skirt),0 6px 10px -3px oklch(0 0 0/.85),inset 0 1px 0 oklch(1 0 0/.2)}.hw-range::-moz-range-thumb{width:22px;height:30px;border:0;border-radius:5px;cursor:grab;background:linear-gradient(90deg,transparent 44%,oklch(1 0 0/.55) 44% 56%,transparent 56%),linear-gradient(180deg,var(--hw-cap-top),var(--hw-cap-bot));box-shadow:0 3px 0 var(--hw-skirt),0 6px 10px -3px oklch(0 0 0/.85),inset 0 1px 0 oklch(1 0 0/.2)}.hw-range:focus-visible::-webkit-slider-thumb{outline:2px solid var(--brand-ink);outline-offset:2px}.hw-range:focus-visible::-moz-range-thumb{outline:2px solid var(--brand-ink);outline-offset:2px}.hw-range:active::-webkit-slider-thumb{cursor:grabbing}.hw-range--dual{pointer-events:none}.hw-range--dual::-webkit-slider-thumb{pointer-events:auto}.hw-range--dual::-moz-range-thumb{pointer-events:auto}.hw-slider-scale{display:flex;justify-content:space-between;font:500 10.5px/1 var(--hw-mono);color:var(--hw-legend-dim)}.hw-drawer{animation:hw-drawer-up .42s var(--hw-ease)}.hw-drawer[data-dir=down]{animation-name:hw-drawer-down}.hw-drawer[data-dir=none]{animation:none}@keyframes hw-drawer-up{0%{transform:translateY(22px)}}@keyframes hw-drawer-down{0%{transform:translateY(-22px)}}::view-transition-old(hw-drawer){animation:hw-vt-out .26s var(--hw-ease) both}::view-transition-new(hw-drawer){animation:hw-vt-in .38s var(--hw-ease) both}@keyframes hw-vt-out{to{transform:translateY(-16px);opacity:.4}}@keyframes hw-vt-in{0%{transform:translateY(22px)}}.hw-lift{transition:transform .35s var(--hw-ease)}@media (hover:hover){.hw-lift:hover{transform:translateY(-4px)}}.hw-card{--hw-card-w:180px;position:relative;display:block;width:var(--hw-card-w);aspect-ratio:63/88;perspective:900px;flex:none}.hw-card-body{position:absolute;inset:0;border-radius:4.6%/3.3%;transform-style:preserve-3d;transform:rotateX(var(--hw-card-rx,6deg)) rotateY(var(--hw-card-ry,-10deg));transition:transform .6s var(--hw-ease);box-shadow:0 30px 40px -24px oklch(0 0 0/.95)}.hw-card-body img,.hw-card-face{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:inherit}.hw-card-face{background:radial-gradient(ellipse 34% 24% at 50% 50%,color-mix(in oklch,var(--brand) 55%,transparent) 0 60%,transparent 62%),linear-gradient(160deg,var(--hw-cap-top),var(--hw-skirt))}.hw-card-edge{transform:translateZ(-2px);background:oklch(.85 .01 var(--brand-h));box-shadow:1px 2px 0 oklch(.7 .01 var(--brand-h))}.hw-card-edge,.hw-card-shine{position:absolute;inset:0;border-radius:inherit}.hw-card-shine{pointer-events:none;background:linear-gradient(115deg,transparent 30%,oklch(1 0 0/.16) 45%,transparent 60%);background-size:250% 100%;background-position:100% 0;transition:background-position .8s var(--hw-ease)}@media (hover:hover){.hw-card[data-hover]:hover .hw-card-body,a:hover>.hw-card .hw-card-body{transform:translateY(-8px) rotateX(0) rotateY(0) scale(1.03)}.hw-card[data-hover]:hover .hw-card-shine,a:hover>.hw-card .hw-card-shine{background-position:0 0}}.hw-card[data-flat] .hw-card-body{transform:none}.hw-card[data-slab]{aspect-ratio:63/108}.hw-card[data-slab] .hw-card-body{border-radius:10px;padding:36% 7% 7%;background:linear-gradient(160deg,oklch(1 0 0/.16),oklch(1 0 0/.04) 40%,oklch(1 0 0/.1));box-shadow:inset 0 0 0 1px oklch(1 0 0/.22),inset 0 0 0 5px oklch(1 0 0/.04),0 30px 40px -24px oklch(0 0 0/.95)}.hw-card[data-slab] .hw-card-body img{position:relative;inset:auto;height:auto;aspect-ratio:63/88;border-radius:4px}.hw-slab-label{position:absolute;left:7%;right:7%;top:5%;height:13%;border-radius:4px;display:flex;align-items:center;justify-content:space-between;gap:6px;padding:0 8px;background:linear-gradient(180deg,oklch(.94 .01 var(--brand-h)),oklch(.86 .01 var(--brand-h)));color:oklch(.2 .02 var(--brand-h));font:700 10px/1.1 var(--hw-mono);letter-spacing:.06em;text-transform:uppercase}.hw-slab-label b{font-size:1.6em;font-family:var(--hw-display);letter-spacing:-.02em}.hw-slip-wrap{position:relative;filter:drop-shadow(0 2px 2px oklch(0 0 0/.45)) drop-shadow(0 24px 30px oklch(0 0 0/.55))}.hw-slip{--hw-paper:oklch(0.95 calc(0.012 * var(--surf-c)) var(--brand-h));--hw-paper-ink:oklch(0.22 calc(0.03 * var(--surf-c)) var(--brand-h));--hw-paper-ink-2:oklch(0.42 calc(0.03 * var(--surf-c)) var(--brand-h));position:relative;padding:24px 22px 26px;color:var(--hw-paper-ink);background:linear-gradient(180deg,oklch(1 0 0/.5),transparent 30%),var(--hw-paper);-webkit-mask:radial-gradient(circle 5px at 50% 0,transparent 98%,#000) 0 0 /14px 51% repeat-x,radial-gradient(circle 5px at 50% 100%,transparent 98%,#000) 0 100% /14px 51% repeat-x;mask:radial-gradient(circle 5px at 50% 0,transparent 98%,#000) 0 0 /14px 51% repeat-x,radial-gradient(circle 5px at 50% 100%,transparent 98%,#000) 0 100% /14px 51% repeat-x}.hw-slip-head{display:flex;justify-content:space-between;gap:8px;padding-bottom:10px;border-bottom:1px dashed color-mix(in oklch,var(--hw-paper-ink) 35%,transparent)}.hw-slip-head,.hw-slip-k{font:600 11px/1.3 var(--hw-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--hw-paper-ink-2)}.hw-slip-k{margin:16px 0 0}.hw-slip-total{margin:4px 0 0;font:800 clamp(42px,5vw,68px)/.95 var(--hw-display);letter-spacing:-.05em;font-variant-numeric:tabular-nums}.hw-slip-gain{margin:10px 0 0;font:800 18px/1.2 var(--hw-display);font-variant-numeric:tabular-nums}.hw-slip-up{color:oklch(.45 .13 160)}.hw-slip-down{color:oklch(.5 .17 25)}.hw-slip-vs{margin:2px 0 0;font-size:12px;color:var(--hw-paper-ink-2)}.hw-slip-chart{display:block;width:100%;height:50px;margin-top:14px}.hw-slip-chart path:first-child{fill:color-mix(in oklch,var(--brand-2) 16%,transparent)}.hw-slip-chart path:last-child{fill:none;stroke:color-mix(in oklch,var(--brand-2) 80%,var(--hw-paper-ink));stroke-width:2}.hw-slip-lines{margin:14px 0 0;padding-top:10px;border-top:1px dashed color-mix(in oklch,var(--hw-paper-ink) 35%,transparent);display:grid;gap:6px}.hw-slip-lines>div{display:flex;align-items:baseline;gap:8px;font-size:13px}.hw-slip-lines>div:after{content:"";order:1;flex:1;border-bottom:1px dotted color-mix(in oklch,var(--hw-paper-ink) 40%,transparent);transform:translateY(-3px)}.hw-slip-lines dt{font-weight:600}.hw-slip-lines dt span{font-weight:400;color:var(--hw-paper-ink-2)}.hw-slip-lines dd{order:2;margin:0;font-weight:700;font-variant-numeric:tabular-nums}.hw-slip-fine{margin:14px 0 0;min-height:84px;font-size:11px;line-height:1.5;color:var(--hw-paper-ink-2);max-width:calc(100% - 100px)}.hw-slip-stamp{position:absolute;right:16px;bottom:22px;display:grid;place-items:center;align-content:center;width:84px;height:84px;border-radius:50%;text-align:center;border:2px solid color-mix(in oklch,var(--brand-2) 75%,var(--hw-paper-ink));color:color-mix(in oklch,var(--brand-2) 75%,var(--hw-paper-ink));transform:rotate(-14deg);font:700 9px/1.25 var(--hw-mono);letter-spacing:.12em;text-transform:uppercase}.hw-slip-stamp b{font-size:13px;letter-spacing:.04em}.hw-piles{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(150px,1fr);gap:20px;margin:0;padding:18px 2px 8px;list-style:none;overflow-x:auto;scrollbar-width:thin;overscroll-behavior-x:contain}@media (max-width:639px){.hw-piles{grid-auto-columns:46%}}.hw-pile-link{display:flex;flex-direction:column;min-height:44px;border-radius:12px;color:var(--hw-ink);text-decoration:none}.hw-pile-link:focus-visible{outline:2px solid var(--brand-ink);outline-offset:6px}.hw-pile{position:relative;display:block;width:62%;aspect-ratio:63/88;margin:calc(var(--n) * 4px) auto 18px calc(var(--n) * 4px)}.hw-pile-card{position:absolute;inset:0;border-radius:4.6%/3.3%;overflow:hidden;background:var(--hw-cap-bot);transform:translate(calc(var(--l) * -3px),calc(var(--l) * -4px)) rotate(var(--lr));box-shadow:0 1px 0 oklch(0 0 0/.5),2px 3px 6px -2px oklch(0 0 0/.5);transition:transform .45s var(--hw-ease)}.hw-pile-card img{object-fit:cover}.hw-pile-back,.hw-pile-card img{display:block;width:100%;height:100%}.hw-pile-back{background:radial-gradient(ellipse 32% 22% at 50% 50%,color-mix(in oklch,var(--brand) 60%,transparent) 0 60%,transparent 62%),linear-gradient(160deg,var(--hw-cap-top),var(--hw-skirt))}@media (hover:hover){.hw-pile-link:hover .hw-pile-card{transform:translate(calc(var(--l) * 7px),calc(var(--l) * -9px)) rotate(calc(var(--l) * 4deg - 6deg))}}.hw-pile-link:focus-visible .hw-pile-card{transform:translate(calc(var(--l) * 7px),calc(var(--l) * -9px)) rotate(calc(var(--l) * 4deg - 6deg))}.hw-pile-name{font-size:14px;font-weight:700}.hw-pile-count{font-size:12px;color:var(--hw-legend)}.hw-pile-row{display:flex;align-items:baseline;justify-content:space-between;gap:8px;margin-top:6px;font-size:12px;font-weight:700}.hw-pile-val{font:800 20px/1 var(--hw-display);letter-spacing:-.03em;font-variant-numeric:tabular-nums}.hw-meter{position:relative;display:block;height:8px;border-radius:4px;overflow:hidden;background:var(--hw-well);box-shadow:inset 0 1px 2px oklch(0 0 0/.85),0 1px 0 oklch(1 0 0/.06)}.hw-meter>span{position:absolute;inset:0 auto 0 0;border-radius:inherit;background:var(--brand-grad);box-shadow:0 0 8px var(--brand-glow)}.hw-meter:after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent 0 7px,oklch(0 0 0/.45) 7px 8px);pointer-events:none}.hw-meter[data-tone=up]>span{background:var(--hw-up);box-shadow:0 0 8px color-mix(in oklch,var(--hw-up) 50%,transparent)}.hw-meter[data-tone=down]>span{background:var(--hw-down);box-shadow:0 0 8px color-mix(in oklch,var(--hw-down) 50%,transparent)}.hw-up{color:var(--hw-up)}.hw-down{color:var(--hw-down)}.hw-num{font-family:var(--hw-display);font-variant-numeric:tabular-nums;letter-spacing:-.03em}.hw-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media (prefers-reduced-motion:reduce){.hw-card-body,.hw-card-shine,.hw-key-cap,.hw-knob-cap,.hw-led:after,.hw-lift,.hw-pile-card,.hw-roll-stack,.hw-switch-lever{transition:none!important}.hw-screen-flash{animation:none;opacity:0}.hw-drawer,.hw-led[data-pulse][data-on]:after{animation:none}.hw-lift:hover{transform:none}::view-transition-new(hw-drawer),::view-transition-old(hw-drawer){animation:none}}}