.fwb{--fwb-pad-h: 110px;--fwb-tile-h: 46px;--fwb-gap: 4px;--fwb-row-gap: 6px;--fwb-handle-h: 32px;--fwb-handle-w: 88px;--fwb-max-w: 600px;--fwb-side: 8px;--fwb-bottom: 10px;--fwb-ink: #e9ecfb;--fwb-muted: #8c92b6;--fwb-font: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;position:fixed;left:0;right:0;bottom:0;z-index:var(--fwb-z, 5);box-sizing:border-box;display:flex;flex-direction:column;align-items:center;gap:6px;padding:4px max(var(--fwb-side),env(safe-area-inset-right,0px)) calc(var(--fwb-bottom) + env(safe-area-inset-bottom,0px)) max(var(--fwb-side),env(safe-area-inset-left,0px));background:linear-gradient(to bottom,#03040b00,#03040b6b 34%,#03040b99);color:var(--fwb-ink);font-family:var(--fwb-font);pointer-events:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;transition:transform .26s ease}@media (max-width: 380px){.fwb{--fwb-side: 6px;--fwb-gap: 3px}}@media (max-width: 370px){.fwb .fwb-name{letter-spacing:-.03em}}@media (max-width: 340px){.fwb{--fwb-side: 5px;--fwb-gap: 3px}}@media (max-height: 640px){.fwb{--fwb-pad-h: 96px;--fwb-handle-h: 28px}}.fwb.fwb-away{transform:translateY(110%)}.fwb>*{pointer-events:auto}.fwb button,.fwb-spray button{appearance:none;-webkit-appearance:none;margin:0;padding:0;border:0;border-radius:0;min-height:0;background:none;color:inherit;font:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}.fwb button:focus-visible,.fwb-spray button:focus-visible{outline:1px solid #f2cc8c;outline-offset:2px}.fwb-word,.fwb-hw,.fwb-sizes-lbl{font-family:SkyworksWarning,Jost,Helvetica Neue,system-ui,sans-serif;font-weight:300;font-size:7.5px;line-height:1;letter-spacing:.2em;padding-left:.2em;color:#ddd0b6;white-space:nowrap;pointer-events:none}.fwb-body{position:absolute;inset:0;border-radius:inherit;z-index:-2;background:linear-gradient(180deg,#161724cc,#080911d9);box-shadow:inset 0 1px #ffeece0d;pointer-events:none}.fwb-edge{position:absolute;inset:0;border-radius:inherit;padding:.75px;overflow:hidden;z-index:-1;opacity:0;pointer-events:none;-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0)}.fwb-edge>i{position:absolute;display:block}.fwb-hair{padding:.5px;opacity:1;background:linear-gradient(180deg,#f6dcac80,#eccc944d 40%,#d6b07642)}.fwb-rise>i{left:0;right:0;top:0;height:300%;background:var(--g-rise)}.fwb-touch>.fwb-rise{animation:fwb-rise-fade .75s ease-out}.fwb-touch>.fwb-rise>i{animation:fwb-rise-up .75s cubic-bezier(.25,.6,.35,1)}@keyframes fwb-rise-fade{0%{opacity:0}8%{opacity:1}60%{opacity:.8}to{opacity:0}}@keyframes fwb-rise-up{0%{transform:translateY(-12%)}to{transform:translateY(-52%)}}.fwb-fire>i{inset:0;background:var(--g-fire)}.fwb-calm .fwb-touch>.fwb-fire{animation:fwb-fire-fade .7s ease-out}.fwb-calm .fwb-touch>.fwb-rise,.fwb-calm .fwb-touch>.fwb-rise>i{animation:none}@keyframes fwb-fire-fade{0%{opacity:0}9%{opacity:.95}to{opacity:0}}.fwb-handle{width:var(--fwb-handle-w);height:var(--fwb-handle-h);display:grid;place-items:center;color:#b9bfe0;touch-action:none}.fwb .fwb-handle{border-radius:10px}.fwb-handle>*{grid-area:1 / 1;pointer-events:none}.fwb-chev{display:grid;place-items:center;opacity:.8;transition:opacity .32s ease-out .32s}.fwb-handle svg{transition:transform .22s ease}.fwb-handle[aria-expanded=true] svg{transform:rotate(180deg)}.fwb-hw{opacity:0;transition:opacity .32s ease-in;padding:3px 5px 3px calc(5px + .2em);border-radius:7px;background:#161724cc}.fwb-handle.fwb-say .fwb-chev{opacity:0;transition:opacity .32s ease-in}.fwb-handle.fwb-say .fwb-hw{opacity:1;transition:opacity .32s ease-out .32s}.fwb-keys{width:100%;max-width:var(--fwb-max-w);display:flex;flex-direction:column;gap:var(--fwb-row-gap);height:var(--fwb-pad-h)}.fwb-row{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:var(--fwb-gap)}.fwb-tiles[hidden]{display:none}.fwb-tiles{height:var(--fwb-tile-h);animation:fwb-tiles-in .2s ease-out backwards;touch-action:none}@keyframes fwb-tiles-in{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}.fwb-pads{flex:1;min-height:0;touch-action:none}.fwb .fwb-tile{position:relative;height:100%;border-radius:12px;background:#0e0f1a8c;display:grid;place-items:center;overflow:hidden;isolation:isolate}.fwb .fwb-tile>.fwb-hair{opacity:.85}.fwb .fwb-tile.fwb-open{background:#141522bf}.fwb .fwb-tile.fwb-open>.fwb-hair{background:var(--g-sel);opacity:1}.fwb-tile-icon{display:grid;place-items:center;width:min(34px,82%);pointer-events:none}.fwb-tile canvas{width:100%;aspect-ratio:1;pointer-events:none}.fwb-tile.fwb-dim canvas{opacity:.4}.fwb .fwb-pad{position:relative;min-width:0;border-radius:12px;color:color-mix(in srgb,var(--k) 70%,#ffffff);touch-action:none;-webkit-touch-callout:none}.fwb-face{position:absolute;inset:0;border-radius:inherit;isolation:isolate;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;padding:4px 0;overflow:hidden;pointer-events:none;transition:transform .22s cubic-bezier(.2,.7,.3,1)}.fwb .fwb-pad.fwb-hot .fwb-face{transform:scale(.97);transition:none}.fwb-icon{display:grid;place-items:center;flex:none}.fwb-pad canvas{width:32px;height:32px;flex:none;pointer-events:none;opacity:.9}.fwb-lbl{position:relative;width:100%;height:26px;display:grid;flex:none}.fwb-lbl>*{grid-area:1 / 1;place-self:center;min-width:0}.fwb-name{max-width:100%;font-size:9px;font-weight:500;line-height:1.17;text-align:center;white-space:pre-line;color:color-mix(in srgb,var(--k) 42%,#f4efe6);opacity:1;transition:opacity .32s ease-out .32s}.fwb-word,.fwb-pad.fwb-say .fwb-name,.fwb-pad.fwb-steady .fwb-name{opacity:0;transition:opacity .32s ease-in}.fwb-pad.fwb-say .fwb-word,.fwb-pad.fwb-steady .fwb-word{opacity:1;transition:opacity .32s ease-out .32s}.fwb-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0;pointer-events:none}.fwb-shuf{position:absolute;top:5px;right:4px;width:8px;height:8px;opacity:.5;pointer-events:none}.fwb-soon{font-size:8.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--fwb-muted);pointer-events:none}.fwb .fwb-pad.fwb-dim .fwb-face{opacity:.42}.fwb-climb{position:absolute;left:50%;bottom:6px;width:3px;height:3px;margin-left:-1.5px;border-radius:50%;background:#fff;box-shadow:0 0 6px var(--k),0 0 2px #fff;opacity:0;pointer-events:none}.fwb-climb.fwb-go{animation:fwb-climb var(--climb, 2s) cubic-bezier(.2,.6,.5,1) backwards}@keyframes fwb-climb{0%{opacity:.9;transform:translateY(0)}85%{opacity:.7}to{opacity:0;transform:translateY(calc(-1 * var(--climb-h, 90px)))}}.fwb[data-mode=choose] .fwb-pad .fwb-icon{display:none}.fwb[data-mode=choose] .fwb-face{gap:2px}.fwb.fwb-calm .fwb-name,.fwb.fwb-calm .fwb-word,.fwb.fwb-calm .fwb-chev,.fwb.fwb-calm .fwb-hw{transition:none}.fwb.fwb-calm .fwb-pad:not([data-hint=""]) .fwb-lbl{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;height:auto}.fwb.fwb-calm .fwb-pad:not([data-hint=""]) .fwb-name{opacity:1}.fwb.fwb-calm .fwb-pad:not([data-hint=""]) .fwb-word{opacity:1}.fwb.fwb-calm .fwb-handle[data-hint=choose]{display:flex;flex-direction:column;justify-content:center;gap:2px}.fwb.fwb-calm .fwb-handle[data-hint=choose] .fwb-hw{opacity:1}.fwb.fwb-calm .fwb-handle[data-hint=choose] .fwb-chev{opacity:.8}.fwb-spray{--fwb-ink: #e9ecfb;--fwb-muted: #8c92b6;position:fixed;inset:0;z-index:var(--fwb-spray-z, 6);pointer-events:none;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;color:var(--fwb-ink);-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}.fwb-spray[hidden]{display:none}.fwb-scrim{position:absolute;left:0;right:0;top:0;pointer-events:auto;touch-action:none}.fwb-lines{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none;animation:fwb-in .24s ease-out backwards}.fwb-lines path{fill:none;stroke-width:.7;stroke-opacity:.55;stroke-linecap:round}@keyframes fwb-in{0%{opacity:0}to{opacity:1}}.fwb-sweep{position:absolute;left:0;right:0;overflow:hidden;opacity:0;pointer-events:none;-webkit-mask-image:linear-gradient(to top,transparent,#000 35%,#000 65%,transparent);mask-image:linear-gradient(to top,transparent,#000 35%,#000 65%,transparent)}.fwb-sweep-lines{position:absolute;left:0;width:100vw;height:100vh;overflow:visible}.fwb-sweep-lines path{fill:none;stroke-width:1.1;stroke-opacity:1;stroke-linecap:round}.fwb-sweep.fwb-sweeping{animation:fwb-sweep-window .8s cubic-bezier(.3,.1,.4,1)}.fwb-sweep.fwb-sweeping>.fwb-sweep-lines{animation:fwb-sweep-lines .8s cubic-bezier(.3,.1,.4,1)}@keyframes fwb-sweep-window{0%{opacity:0;transform:translateY(0)}15%{opacity:1}75%{opacity:1}to{opacity:0;transform:translateY(calc(-1 * var(--sweep, 300px)))}}@keyframes fwb-sweep-lines{0%{transform:translateY(0)}to{transform:translateY(var(--sweep, 300px))}}.fwb-spray .fwb-bub{position:absolute;height:62px;display:flex;flex-direction:column-reverse;align-items:center;gap:4px;transform:translate(-50%,calc(-100% + 20px));pointer-events:auto;animation:fwb-in .22s ease-out backwards}.fwb-ring{position:relative;width:40px;height:40px;flex:none;border-radius:50%;display:grid;place-items:center;isolation:isolate;color:var(--k)}.fwb-ring>.fwb-body{background:#080911db;box-shadow:none}.fwb-ring canvas{width:34px;height:34px;opacity:.6}.fwb-ring svg{width:18px;height:18px;opacity:.6}.fwb-ring .fwb-pin{position:absolute;right:-2px;top:-2px;width:12px;height:12px;border-radius:50%;background:#080911f2;box-shadow:0 0 0 .5px #eccc9480;display:grid;place-items:center;color:#e8d7b6}.fwb-ring .fwb-pin svg{width:7px;height:7px;opacity:.8}.fwb-bub.fwb-on .fwb-ring>.fwb-hair{background:var(--g-sel);opacity:1}.fwb-bub.fwb-on .fwb-ring canvas,.fwb-bub.fwb-on .fwb-ring svg{opacity:1}.fwb-bub-name{font-size:10.5px;font-weight:500;line-height:14px;white-space:nowrap;color:#c9c4d6;text-shadow:0 0 3px #000,0 1px 2px #000}.fwb-bub.fwb-on .fwb-bub-name{color:#f1e6cf}.fwb-spray .fwb-bub:disabled{cursor:default;opacity:1}.fwb-spray .fwb-bub:disabled .fwb-ring{opacity:.45}.fwb-bub:disabled .fwb-bub-name{opacity:.5}.fwb-bub .fwb-soon{position:absolute;bottom:-7px;left:50%;transform:translate(-50%);padding:0 3px;border-radius:4px;background:#06070ef2;font-size:7.5px;line-height:10px}.fwb-picker{position:absolute;box-sizing:border-box;display:flex;align-items:center;gap:12px;padding:8px 14px 8px 8px;border-radius:24px;isolation:isolate;pointer-events:auto;animation:fwb-in .22s ease-out backwards}.fwb-picker>.fwb-body{background:#080911db;box-shadow:none}@media (max-height: 640px){.fwb-picker{padding:5px 12px 5px 6px;gap:10px}}.fwb-wheel{position:relative;width:84px;height:84px;flex:none}.fwb-spray .fwb-dot,.fwb-spray .fwb-any{position:absolute;width:24px;height:24px;margin:-12px 0 0 -12px;border-radius:50%;display:grid;place-items:center}.fwb-dot:before{content:"";width:13px;height:13px;border-radius:50%;background:var(--c);opacity:.85}.fwb-any:before{content:"";width:17px;height:17px;border-radius:50%;background:conic-gradient(#ff8a8a,#ffb37a,#fff3a0,#9ff5b8,#9cc8ff,#cfa8ff,#ff8a8a);-webkit-mask:radial-gradient(circle,transparent 5.6px,#000 6.1px);mask:radial-gradient(circle,transparent 5.6px,#000 6.1px);opacity:.8}.fwb-dot[aria-checked=true]:before,.fwb-any[aria-checked=true]:before{opacity:1}.fwb-dot[aria-checked=true]:after,.fwb-any[aria-checked=true]:after{content:"";position:absolute;inset:1px;border-radius:50%;box-shadow:0 0 0 .75px #f6dcace6}.fwb-sizes{display:flex;flex-direction:column;align-items:center;gap:3px;color:#d8d0bf}.fwb-trio{display:flex;align-items:center;height:30px}.fwb-spray .fwb-size{width:26px;height:30px;display:grid;place-items:center}.fwb-spray .fwb-mix{width:34px;height:22px;display:grid;place-items:center;border-radius:7px;color:#a8a090}.fwb-circ{display:block;box-sizing:border-box;border-radius:50%;box-shadow:inset 0 0 0 .75px #ecd6b0bf}.fwb-size[aria-checked=true] .fwb-circ{background:#e9dcc0;box-shadow:none}.fwb-mix svg{width:15px;height:15px}.fwb-spray .fwb-mix[aria-checked=true]{color:#f1e2c4;box-shadow:inset 0 0 0 .5px #eccc9499}@media (prefers-reduced-motion: reduce){.fwb-tiles,.fwb-spray .fwb-bub,.fwb-picker,.fwb-lines,.fwb-climb.fwb-go{animation:none}.fwb-sweep{display:none}.fwb,.fwb-handle svg,.fwb-face{transition:none}}.fwb.fwb-calm .fwb-tiles,.fwb-spray.fwb-calm .fwb-bub,.fwb-spray.fwb-calm .fwb-picker,.fwb-spray.fwb-calm .fwb-lines{animation:none}.fwb-spray.fwb-calm .fwb-sweep{display:none}.fwb.fwb-calm .fwb-face{transition:none}.fwb.fwb-calm .fwb-climb.fwb-go{animation:none;opacity:.5}#settings-panel{position:fixed;top:calc(54px + env(safe-area-inset-top));left:calc(8px + env(safe-area-inset-left));z-index:7;display:flex;flex-direction:column;gap:8px;width:min(280px,calc(100vw - 16px));max-height:calc(100vh - 62px - env(safe-area-inset-top) - env(safe-area-inset-bottom));max-height:calc(100dvh - 62px - env(safe-area-inset-top) - env(safe-area-inset-bottom));overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;box-sizing:border-box;padding:10px;background:#090b16e6;border:1px solid var(--line, rgba(170, 180, 230, .24));border-radius:14px;color:var(--ink, #e6e9ff);font:14px system-ui,sans-serif}#settings-panel[hidden]{display:none}#settings-panel .set-head{display:flex;align-items:center;justify-content:space-between;gap:8px}#settings-panel h2{margin:0;font:600 15px/1.2 system-ui,sans-serif;letter-spacing:.02em}#settings-panel>*{flex:none}#settings-panel .set-row{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:40px}#settings-panel .set-row[hidden]{display:none}#settings-panel .set-label{color:var(--dim, #98a1c6);flex:none}#settings-panel .set-controls{display:flex;align-items:center;gap:6px;flex:1 1 auto;justify-content:flex-end;min-width:0}#settings-panel button{min-height:40px;min-width:64px;padding:0 10px}#settings-panel #quality,#settings-panel #reduce{min-width:128px}#settings-panel input[type=range]{flex:1 1 auto;min-width:0;width:100%;height:40px;margin:0;accent-color:#ffbf73}#settings-panel button:focus-visible,#settings-panel input:focus-visible{outline:2px solid #c9cff5;outline-offset:2px}#settings-panel .set-note{margin:0;color:var(--dim, #98a1c6);font-size:12px;line-height:1.35}#view-rail{--rail-top: calc(60px + env(safe-area-inset-top, 0px)) ;--rail-room: calc(var(--dock-top, 80vh) - var(--rail-top) - 16px);--rail-h: clamp(176px, var(--rail-room), 200px);position:fixed;right:env(safe-area-inset-right,0px);top:max(calc(8px + env(safe-area-inset-top,0px)),min(calc(var(--rail-top) + (var(--rail-room) - var(--rail-h)) / 2),calc(var(--rail-top) + var(--rail-room) - var(--rail-h))));z-index:5;display:flex;flex-direction:column;width:44px;height:var(--rail-h);touch-action:none;user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent;opacity:.32;transition:opacity .35s ease}#view-rail[hidden]{display:none}#view-rail.near{opacity:.6}#view-rail.active{opacity:1;transition-duration:.12s}#view-rail:before{content:"";position:absolute;left:50%;top:12.5%;bottom:12.5%;width:1px;transform:translate(-.5px);background:#d6dcff59;pointer-events:none}#view-rail .vr-dot{position:relative;flex:1 1 0;width:44px;min-height:44px;margin:0;padding:0;border:0;background:none;cursor:pointer;touch-action:none}#view-rail .vr-dot:after{content:"";position:absolute;left:50%;top:50%;width:7px;height:7px;border-radius:50%;transform:translate(-50%,-50%);background:#d6dcffd9;transition:width .15s ease,height .15s ease}#view-rail .vr-dot.at:after{width:11px;height:11px;background:#ffd9a0;box-shadow:0 0 8px #ffc882b3}#view-rail .vr-label{position:absolute;right:34px;top:50%;transform:translateY(-50%);padding:2px 7px;border-radius:8px;background:#090b1699;color:#e6e9ff;font:500 12px/1.3 system-ui,sans-serif;white-space:nowrap;opacity:0;transition:opacity .2s ease;pointer-events:none}#view-rail.active .vr-label{opacity:.95}#view-rail.active .vr-dot.at .vr-label{color:#ffd9a0}#view-rail .vr-dot:focus-visible{outline:2px solid #c9cff5;outline-offset:-4px;border-radius:10px}#view-rail.vr-above{--rail-w: 176px;flex-direction:row;width:var(--rail-w);height:44px;top:calc(var(--dock-top, 80vh) - 44px - 14px);right:max(calc(8px + env(safe-area-inset-right,0px)),calc((100vw - 600px)/2))}#view-rail.vr-above:before{inset:50% 12.5% auto;width:auto;height:1px;transform:translateY(-.5px)}#view-rail.vr-above .vr-dot{width:auto;height:44px;min-height:0;min-width:44px}#view-rail.vr-above .vr-label{inset:auto auto 30px 50%;transform:translate(-50%)}#view-rail.vr-above.active .vr-label{opacity:0}#view-rail.vr-above.active .vr-dot.at .vr-label{opacity:.95}#view-rail.vr-above .vr-dot:last-child .vr-label{left:auto;right:4px;transform:none}body:has(.fwb-spray:not([hidden])) #view-rail.vr-above{visibility:hidden}#view-step{position:fixed;top:calc(8px + env(safe-area-inset-top,0px));right:calc(8px + env(safe-area-inset-right,0px));z-index:6;height:40px;min-width:76px;padding:0 12px;border:1px solid rgba(170,180,230,.18);border-radius:12px;background:#090b1659;color:#e6e9ff9e;font:500 13px system-ui,sans-serif;letter-spacing:.02em;-webkit-tap-highlight-color:transparent}#view-step[hidden]{display:none}#view-step:active{color:#e6e9ff;background:#090b1699}#view-step:focus-visible{outline:2px solid #c9cff5;outline-offset:2px}.paint-mark{position:fixed;z-index:2;width:26px;height:26px;margin:-13px 0 0 -13px;border-radius:50%;border:1px solid rgba(230,233,255,.4);pointer-events:none;animation:paint-mark 1.4s ease-out forwards}@keyframes paint-mark{0%{opacity:.9;transform:scale(.6)}to{opacity:0;transform:scale(1.4)}}@media (prefers-reduced-motion: reduce){.paint-mark{animation:paint-mark-still 1.4s linear forwards}@keyframes paint-mark-still{0%{opacity:.8}to{opacity:0}}}