.drawer-toy-map{position:absolute;inset:0;width:100%;height:100%;z-index:31;overflow:visible;pointer-events:none;-webkit-user-select:none;user-select:none}
.drawer-toy-hit{fill:transparent;stroke:transparent;stroke-width:1;vector-effect:non-scaling-stroke;pointer-events:all;cursor:pointer;touch-action:manipulation;outline:none;-webkit-tap-highlight-color:transparent;transition:fill .2s,stroke .2s}
.drawer-toy-hit:focus-visible{fill:transparent;stroke:rgba(255,228,155,.3);outline:none}
.drawer-toy-canvas{position:absolute;inset:0;width:100%;height:100%;z-index:30;pointer-events:none}
.drawer-toy-status{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.drawer-hover{position:absolute;left:54.0625%;top:56.296296%;width:7.083333%;height:10.555556%;z-index:28;pointer-events:none;isolation:isolate}
.drawer-hover canvas{position:absolute;inset:0;width:100%;height:100%;mix-blend-mode:plus-lighter;transition:opacity 1.5s ease-in-out}
.drawer-hover-light{opacity:1}.drawer-hover-dark{opacity:0}
body.dark-mode .drawer-hover-light{opacity:0}body.dark-mode .drawer-hover-dark{opacity:1}
html.radial-capture .drawer-hover canvas{transition:none!important}
html.radial-capture .drawer-hover-light{opacity:calc(1 - var(--desk-transition-night,0))!important}
html.radial-capture .drawer-hover-dark{opacity:var(--desk-transition-night,0)!important}
.reduced .drawer-hover canvas{transition:none}
@media(prefers-reduced-motion:reduce){.drawer-hover canvas{transition:none}}

/* Follow the live wave's desk coverage, not an independent elapsed-time fade. */
html.radial-capture .drawer-toy-theme-fade>canvas{transition:none!important}
html.radial-capture .drawer-toy-theme-fade>canvas:first-child{opacity:calc(1 - var(--desk-transition-night,0))!important}
html.radial-capture .drawer-toy-theme-fade>canvas:last-child{opacity:var(--desk-transition-night,0)!important}

.drawer-toy-counter{position:absolute;left:50%;top:15%;transform:translate(-50%,-50%);z-index:32;display:flex;align-items:center;gap:5px;min-height:24px;padding:0 9px;border-radius:999px;color:#262823;text-shadow:0 1px 2px #ffffffa0;font-family:'Geist Mono',monospace;pointer-events:none;isolation:isolate;box-shadow:0 3px 12px #00000012,inset 0 1px 0 #ffffffa6,inset 0 -1px 0 #ffffff45;border:1px solid #ffffff75}
.toy-counter-glass{position:absolute;inset:0;border-radius:inherit;z-index:-1;pointer-events:none;background:linear-gradient(145deg,#fffffff0,#ffffffd9 48%,#ffffffe8);-webkit-backdrop-filter:blur(5px) saturate(1.12);backdrop-filter:blur(5px) saturate(1.12)}
.toy-glass-filter{position:absolute;pointer-events:none}
.toy-counter-label{white-space:nowrap;font-size:5.5px;letter-spacing:.1em;opacity:1}
.toy-counter-digits{display:flex;font-size:10px;font-weight:500;line-height:14px;font-variant-numeric:tabular-nums}
.toy-counter-digit{display:block;overflow:hidden;width:1ch;height:14px}
.toy-counter-strip{display:flex;flex-direction:column;transform:translateY(-50%)}
.toy-counter-strip>span{display:block;height:14px}
body.dark-mode .drawer-toy-counter{color:#e6ebe4;text-shadow:0 1px 2px #000000a0;border-color:#ffffff25;box-shadow:0 3px 12px #00000020,inset 0 1px 0 #ffffff35,inset 0 -1px 0 #ffffff10}
body.dark-mode .toy-counter-glass{background:linear-gradient(145deg,#4c5969a6,#17283899 55%,#344452a6)}

/* Keep the lens measurable while hidden; only an actual toy spawn reveals it. */
.drawer-toy-counter{visibility:hidden;opacity:0}
.drawer-toy-counter[data-revealed="true"]{visibility:visible;opacity:1;animation:toy-counter-float 4.4s cubic-bezier(.37,0,.63,1) .36s infinite}

/* Idle hover plus the pull offset from pull.js. `translate` composes with the
   centering transform and the entrance; the theme wipe mirrors this one
   property onto its copies. */
.drawer-toy-counter{translate:var(--toy-pull-x,0px) var(--toy-pull-y,0px);-webkit-user-select:none;user-select:none}
@keyframes toy-counter-float{0%,100%{translate:var(--toy-pull-x,0px) var(--toy-pull-y,0px)}50%{translate:var(--toy-pull-x,0px) calc(var(--toy-pull-y,0px) - 3px)}}
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){.drawer-toy-counter[data-revealed="true"]{pointer-events:auto;cursor:grab}}
.drawer-toy-counter[data-pulling]{cursor:grabbing;animation-play-state:paused}

/* Gloss over the glass and the letters, lit from the scene's upper right. The
   sheen counter-moves against the float and the pull, as a reflection of a
   fixed light would; it shares the float's clock, so the two stay in phase. */
.toy-counter-gloss{position:absolute;inset:0;z-index:1;overflow:hidden;border-radius:inherit;pointer-events:none}
.toy-counter-sheen{--sheen-x:calc(var(--toy-pull-x,0px)*-.8);--sheen-y:calc(var(--toy-pull-y,0px)*-.8);position:absolute;inset:-22px -30px;transform:translate(var(--sheen-x),var(--sheen-y));background:radial-gradient(ellipse 32% 21% at 72% 31%,#ffffffa6,#ffffff00 100%),linear-gradient(112deg,#ffffff00 47%,#ffffff38 53%,#ffffff10 58%,#ffffff00 64%),linear-gradient(200deg,#ffffff00 52%,#1c2a3814 78%)}
body.dark-mode .toy-counter-sheen{background:radial-gradient(ellipse 34% 30% at 72% 30%,#ffffff4d,#ffffff00 100%),linear-gradient(112deg,#ffffff00 47%,#ffffff24 53%,#ffffff0a 58%,#ffffff00 64%),linear-gradient(200deg,#ffffff00 52%,#00000026 78%)}
.drawer-toy-counter[data-revealed="true"] .toy-counter-sheen{animation:toy-counter-sheen 4.4s cubic-bezier(.37,0,.63,1) .36s infinite}
@keyframes toy-counter-sheen{0%,100%{transform:translate(var(--sheen-x),var(--sheen-y))}50%{transform:translate(calc(var(--sheen-x) - 5px),calc(var(--sheen-y) + 2px))}}
.drawer-toy-counter[data-pulling] .toy-counter-sheen{animation-play-state:paused}
.reduced .drawer-toy-counter,.reduced .toy-counter-sheen{animation:none!important}
@media(prefers-reduced-motion:reduce){.drawer-toy-counter,.toy-counter-sheen{animation:none!important}}
