/* Alive MO: time-of-day tint, drowsy state, window passers-by. */
.mood-tint{position:absolute;inset:0;z-index:6;pointer-events:none;mix-blend-mode:multiply;transition:background 2s}
.drowsy .blink-lids{opacity:1!important}
.drowsy .idle{animation-duration:9s}
.drowsy .steam{opacity:.4}
.passerby{position:absolute;left:76%;top:50%;width:24%;height:24%;overflow:hidden;pointer-events:none;z-index:1}
.passerby i{position:absolute;bottom:0;left:0;width:22%;height:100%;background:
 radial-gradient(circle at 50% 14%,#04080fd9 0 11%,transparent 12%),
 linear-gradient(#04080fd9,#04080fd9) 50% 100%/46% 78% no-repeat;border-radius:40% 40% 0 0;
 filter:blur(1.2px);transform:translateX(-130%);animation:passby 7s linear forwards}
@keyframes passby{to{transform:translateX(480%)}}
.zzz{position:absolute;z-index:7;left:57%;top:30%;font:900 22px Arial;color:#fff1d5;text-shadow:2px 2px #081221;opacity:0;pointer-events:none}
.drowsy .zzz{animation:zzz 3s ease-in-out infinite}
@keyframes zzz{0%{opacity:0;transform:translate(0,10px) scale(.7)}40%{opacity:1}100%{opacity:0;transform:translate(16px,-34px) scale(1.2)}}
.paused .passerby i,.paused .zzz{animation-play-state:paused}
@media(max-width:900px){.zzz{left:44%;top:20%;font-size:18px}}

/* Footer removed: motion/sound toggles live in the header. */
.toggles{display:flex;gap:8px;margin-left:auto}.toggles button{background:#091924b0;border:1px solid #fff1d566;border-radius:20px;padding:7px 12px;font-size:11px;font-weight:bold;text-transform:uppercase;letter-spacing:.5px}.toggles button[aria-pressed=true]{border-color:#46e4da;color:#9ff6ee}.token{margin-left:0}
@media(max-width:900px){.world{bottom:0}.toggles{gap:4px}.toggles button{padding:6px 8px;font-size:9px;min-height:32px}.bubble{bottom:330px}}
@media(min-width:901px){.coffee{left:38%;top:74%}}

.printer-hit{position:absolute;z-index:7;background:transparent;border-radius:16px;cursor:pointer;min-width:44px;min-height:44px}.printer-hit:hover{background:#78eee80a;box-shadow:inset 0 0 25px #7ae7ee22}.printer-hit:focus-visible{outline:3px solid #7ef5e6;outline-offset:-3px}

.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* Header strip must not swallow clicks meant for the scene behind it. */
header{pointer-events:none}header>*,header a,header button{pointer-events:auto}header nav{pointer-events:none}header nav button{pointer-events:auto}.toggles{pointer-events:none}.toggles button{pointer-events:auto}

/* Toggles live in the bottom-left corner, clear of every hit box. */
.toggles{position:fixed;left:18px;bottom:18px;margin:0;z-index:9;pointer-events:none}.toggles button{pointer-events:auto}
@media(max-width:900px){.toggles{bottom:calc(84px + env(safe-area-inset-bottom));left:10px}}

/* Receipt printing: paper rises out of the printer's top slot; old in-scene paper and button retired. */
.hero-paper-feed,#finished-receipt{display:none!important}
.paper-slot{position:absolute;z-index:6;overflow:hidden;pointer-events:none}
.paper-slot[hidden]{display:none}
.out-paper{position:absolute;left:0;top:0;width:100%;padding:0;background:#fff0cf;pointer-events:auto;cursor:pointer;border:0;box-shadow:0 0 0 1px #17202d55;transform-origin:50% 100%}
.out-paper img{display:block;width:100%;height:auto}
.out-paper:hover{filter:brightness(1.06)}
.out-paper:focus-visible{outline:3px solid #7ef5e6;outline-offset:-3px}
.receipt-view{text-align:center}.receipt-view img{display:block;max-width:100%;max-height:62vh;margin:14px auto;box-shadow:0 10px 30px #0008}
.receipt-view .export{flex-wrap:wrap}

/* Receipt tear + slap */
.slap-overlay{position:fixed;inset:0;z-index:1100;perspective:1100px;overflow:hidden;background:rgba(4,10,18,.62);backdrop-filter:blur(3px)}
.slap-flash{position:absolute;inset:0;background:#fff1d5;opacity:0;pointer-events:none}
.slap-receipt{position:absolute;background:#fff0cf;transform:rotate(-363deg);transform-origin:50% 50%;will-change:transform;filter:drop-shadow(0 14px 22px #000a)}
.slap-receipt img{display:block;width:100%;height:100%;object-fit:fill;pointer-events:none;user-select:none}
.slap-receipt::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 35%,#ffffff66 48%,transparent 58%);transform:translateX(-120%);pointer-events:none}
.slap-receipt.stuck::after{animation:slapGlare 1.1s ease-out .1s both}
@keyframes slapGlare{to{transform:translateX(130%)}}
.slap-stamp{position:absolute;left:50%;top:69%;margin-left:-27%;width:54%;text-align:center;padding:.3em 0;border:.22em solid #d8343e;border-radius:.3em;color:#d8343e;font:900 clamp(15px,3.1vw,30px) monospace;letter-spacing:.12em;opacity:0;mix-blend-mode:multiply;transform:rotate(-14deg)}
.slap-tape{position:absolute;width:24%;height:6%;top:1.5%;background:#f6f0d0b5;box-shadow:0 1px 4px #0006;opacity:0;transition:opacity .15s}
.slap-tape.t1{left:-3%;transform:rotate(-38deg)}.slap-tape.t2{right:-3%;transform:rotate(36deg)}
.slap-receipt.stuck .slap-tape{opacity:1}
.slap-ring{position:absolute;width:90px;height:90px;border-radius:50%;border:4px solid;pointer-events:none;opacity:0}
.slap-bit{position:absolute;background:#fff0cf;pointer-events:none;box-shadow:0 1px 2px #0005}
.slap-actions{position:absolute;left:0;right:0;bottom:max(18px,4vh);display:flex;flex-wrap:wrap;justify-content:center;gap:10px;padding:0 14px;opacity:0;transform:translateY(14px);transition:opacity .3s,transform .3s}
.slap-actions.show{opacity:1;transform:none}
.slap-actions button{padding:13px 18px;background:#254650;border-radius:10px;font-size:13px;font-weight:bold;min-height:46px;border:1px solid #67e1da55}
.slap-actions button:first-child{background:#67e1da;color:#0b2230}
.slap-actions .ghost{background:transparent;border-color:#fff1d577}
.slap-status{position:absolute;left:0;right:0;bottom:calc(max(18px,4vh) + 62px);margin:0;text-align:center;font:12px monospace;color:#9ff6ee}
.slap-status input{display:block;margin:6px auto 0;width:min(420px,86vw)}
@media(prefers-reduced-motion:reduce){.slap-receipt{transform:rotate(-3deg)}}

/* Poses are clipped to their own padded cell now, so the svg box must not crop spilled tails and hands. */
.hero-touch-poses{overflow:visible!important}

.hero-touch-poses.pose-top{z-index:5}

/* Debug coordinate layer (press D or add ?debug) */
#dbg{display:none;position:fixed;inset:0;z-index:3000;pointer-events:none;font-family:ui-monospace,Consolas,monospace}
#dbg-grid{position:fixed;pointer-events:none}
#dbg-grid line.f{stroke:#00ff9a14;stroke-width:1}#dbg-grid line.m{stroke:#00ff9a55;stroke-width:1}#dbg-grid line.M{stroke:#ff5ad9aa;stroke-width:1.2}
#dbg-grid text.t{fill:#fff;font-size:11px;paint-order:stroke;stroke:#000;stroke-width:3px}
#dbg-grid circle.pt{fill:#ffe600;stroke:#000;stroke-width:1.5}
#dbg-grid text.pl{fill:#ffe600;font-size:13px;font-weight:bold;paint-order:stroke;stroke:#000;stroke-width:3px}
#dbg-grid polyline.poly{fill:#ffe60022;stroke:#ffe600;stroke-width:1.5;stroke-dasharray:5 3}
#dbg-grid rect.hb{fill:#00d9ff14;stroke:#00d9ff;stroke-width:1.5}
#dbg-grid text.hl{fill:#7ff3ff;font-size:12px;paint-order:stroke;stroke:#000;stroke-width:3px}
#dbg-tag{display:none;position:fixed;padding:6px 9px;background:#000c;color:#fff;border:1px solid #ffe600;border-radius:6px;font-size:13px;line-height:1.35;pointer-events:none;white-space:nowrap}
#dbg-tag small{color:#aaa}
#dbg-panel{position:fixed;left:12px;top:12px;width:250px;max-height:60vh;overflow:auto;padding:10px;background:#000d;color:#fff;border:1px solid #ffe600;border-radius:8px;font-size:12px;pointer-events:auto}
#dbg-panel .row{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0}
#dbg-panel button{padding:5px 8px;background:#222;border:1px solid #666;border-radius:5px;color:#fff;font-size:12px}
#dbg-panel ol{margin:6px 0;padding-left:22px}#dbg-panel li small{color:#aaa}
#dbg-panel small{color:#999}
html.dbg-on #bubble{opacity:0!important}
#dbg-panel label{display:inline-flex;align-items:center;gap:5px;margin:0;font-size:12px;font-weight:normal}
#dbg-panel input[type=checkbox]{width:auto;margin:0;padding:0}

/* Frozen Assets banner, fitted to the fridge lightbox corners picked with the debug layer. */
.fridge-marquee{position:absolute;z-index:1;left:26.8541%;top:40.1700%;width:10.6459%;height:9.3518%;pointer-events:none;animation:marqueeGlow 5.5s ease-in-out infinite}
@keyframes marqueeGlow{0%,100%{filter:brightness(1) saturate(1)}50%{filter:brightness(1.12) saturate(1.1) drop-shadow(0 0 6px #6fe9ff66)}92%{filter:brightness(.9)}94%{filter:brightness(1.15)}}

/* Pulsing hint markers on clickable spots; they remove themselves once used. */
.hint{position:absolute;z-index:7;width:0;height:0;pointer-events:none;transition:opacity .4s}
.hint i{position:absolute;left:-5px;top:-5px;width:10px;height:10px;border-radius:50%;background:#fff1d5;box-shadow:0 0 0 2px #0a1c28cc,0 0 12px 3px #67e1dacc}
.hint b{position:absolute;left:-7px;top:-7px;width:14px;height:14px;border-radius:50%;border:2px solid #67e1da;opacity:0;animation:hintRing 2.4s ease-out infinite;animation-delay:var(--d,0s)}
@keyframes hintRing{0%{transform:scale(.6);opacity:.95}70%,100%{transform:scale(3.4);opacity:0}}
.hint.gone{opacity:0}.hint.gone i{animation:hintPop .4s ease-out forwards}
@keyframes hintPop{50%{transform:scale(2.2)}100%{transform:scale(.2)}}
html.dbg-on .hint,body:has(dialog[open]) .hint,.world.hero-printing~.hint{display:none}
@media(prefers-reduced-motion:reduce){.hint b{animation:none;opacity:.7;transform:scale(1.6)}}

/* ---------- Cash register ---------- */
.register{position:absolute;left:21.5%;top:54%;width:24%;z-index:4;pointer-events:none}
.register .reg-art{display:block;width:100%;height:auto;filter:drop-shadow(0 3px 0 #0007)}.register .reg-screen{position:absolute;left:0;top:0;width:100%;height:100%;overflow:visible}
.reg-pops{position:absolute;left:0;right:0;top:8%;height:0;pointer-events:none}
.reg-pop{position:absolute;white-space:nowrap;font:900 clamp(11px,1.5vw,20px) Consolas,'Courier New',monospace;text-shadow:0 2px 0 #06101a,0 0 8px #000a;animation:regPop 1.4s ease-out forwards}
.reg-pop.buy{color:#7dffa6}.reg-pop.sell{color:#ff8c84}
@keyframes regPop{0%{transform:translate(-50%,0) scale(.6);opacity:0}15%{opacity:1;transform:translate(-50%,-8px) scale(1.1)}100%{transform:translate(-50%,-70px) scale(1);opacity:0}}
.reg-hit{position:absolute;z-index:7;background:transparent;border:0;border-radius:14px;cursor:pointer;min-width:44px;min-height:44px}
.reg-hit:hover{background:#78eee80a;box-shadow:inset 0 0 25px #7ae7ee22}.reg-hit:focus-visible{outline:3px solid #7ef5e6;outline-offset:-3px}
/* token panel */
.tok-panel{max-width:760px}.tok-panel h2{font-size:30px;margin:0}.tok-panel h3{font-size:13px;letter-spacing:1.5px;text-transform:uppercase;color:#67e1da;margin:22px 0 8px}
.tok-head{display:flex;gap:14px;align-items:center;margin:6px 0 10px}.tok-head img{width:64px;height:64px;border-radius:12px;object-fit:cover;background:#153844;border:2px solid #345e68}
.tok-sym{font:700 14px monospace;color:#8cf3ea}.tok-chip{font:700 10px monospace;letter-spacing:1px;padding:3px 7px;border-radius:20px;margin-left:6px}
.tok-chip.live{background:#103d2a;color:#7dffa6;border:1px solid #2f8f5c}.tok-chip.demo{background:#3d3210;color:#ffd166;border:1px solid #8f7a2f}
.tok-desc{color:#b3c5ca;font-size:14px;margin:6px 0 14px}
.tok-warn{background:#3d3210;color:#ffd166;border:1px solid #8f7a2f;border-radius:8px;padding:8px 12px;font-size:13px}
.tok-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.tok-grid div{background:#0a1d28;border:1px solid #28485a;border-radius:10px;padding:10px 12px}
.tok-grid small{display:block;color:#8fb3bb;font-size:11px;text-transform:uppercase;letter-spacing:.8px}.tok-grid b{font-size:20px;font-family:Consolas,monospace}
.tok-act{width:100%;border-collapse:collapse;margin-top:16px;font:13px Consolas,monospace}.tok-act th,.tok-act td{padding:6px 8px;text-align:right;border-bottom:1px solid #223d4a}.tok-act th:first-child,.tok-act td:first-child{text-align:left}.tok-act thead th{color:#8fb3bb;font-weight:normal}
.tok-act .up,.tok-trades .buy b{color:#7dffa6}.tok-act .dn,.tok-trades .sell b{color:#ff8c84}
.tok-trades{list-style:none;margin:0;padding:0;font:13px Consolas,monospace}.tok-trades li{display:grid;grid-template-columns:52px 90px 1fr;gap:8px;padding:5px 0;border-bottom:1px solid #1d3643}.tok-trades small{color:#8fb3bb;text-align:right}
.tok-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}.tok-btn{display:inline-block;padding:12px 16px;background:#254650;border-radius:9px;color:#fff1d5;text-decoration:none;font-weight:bold;font-size:13px;border:1px solid #67e1da55}
a.tok-btn:first-child{background:#67e1da;color:#0b2230}
.tok-fine{font-size:11px;color:#8fb3bb;margin-top:16px}
@media(max-width:600px){.tok-grid{grid-template-columns:repeat(2,1fr)}.tok-trades li{grid-template-columns:44px 74px 1fr}}

/* Big register terminal */
dialog.reg-dialog{width:min(1840px,99vw);max-width:none;height:97dvh;max-height:97dvh;padding:14px;display:flex;flex-direction:column;overflow:hidden}
dialog.reg-dialog>#content{display:flex;flex-direction:column;flex:1;min-height:0}
.reg-term{display:flex;flex-direction:column;flex:1;min-height:0}
.reg-bar{display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px;padding:2px 48px 10px 2px}
.reg-bar .eyebrow{margin:0}
.reg-tabs{display:flex;flex-wrap:wrap;gap:8px;margin-left:auto;align-items:center}
.reg-tabs button,.reg-ext{padding:9px 14px;background:#183a46;border:1px solid #67e1da44;border-radius:8px;color:#fff1d5;font-size:13px;font-weight:bold;min-height:40px;text-decoration:none;display:inline-flex;align-items:center}
.reg-tabs button[aria-pressed=true]{background:#67e1da;color:#0b2230;border-color:#67e1da}
.reg-ext{background:transparent}
.reg-view{position:relative;flex:1;min-height:0;border:2px solid #2d6575;border-radius:12px;overflow:auto;background:#06141b;-webkit-overflow-scrolling:touch}
.reg-view iframe{display:block;width:100%;height:100%;border:0;background:#06141b}
.reg-view .tok-panel{padding:22px;max-width:900px;margin:0 auto}
.reg-loading{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:#8cf3ea;font:14px monospace;pointer-events:none}
.reg-foot{margin:8px 2px 0;font-size:11px;color:#8fb3bb;min-height:14px}
@media(max-width:700px){dialog.reg-dialog{width:100vw;height:100dvh;max-height:100dvh;border-radius:0;padding:10px}.reg-bar{padding-right:44px}.reg-tabs{margin-left:0}}

dialog.reg-dialog.reg-full{width:100vw;height:100dvh;max-height:100dvh;border-radius:0;border-width:0}
.reg-tabs .reg-full{background:transparent}
.reg-mo{display:flex;gap:12px;align-items:center;margin-top:10px}
.reg-mo .face{width:60px;height:60px;flex:none;border-radius:12px;background:#153844 url(assets/heads.webp) no-repeat;background-size:300% 200%;border:2px solid #345e68}
.reg-mo .say{position:relative;flex:1;min-height:48px;display:flex;align-items:center;background:#fff1d5;color:#172633;border:3px solid #091522;border-radius:14px;padding:10px 14px;font-weight:bold;font-size:14px;line-height:1.35}
.reg-mo .say::before{content:"";position:absolute;left:-11px;top:50%;margin-top:-8px;border:8px solid transparent;border-right:11px solid #091522;border-left:0}
.reg-mo .ask{padding:12px 16px;background:#254650;border:1px solid #67e1da55;border-radius:10px;color:#fff1d5;font-weight:bold;font-size:13px;min-height:46px;flex:none}
@media(max-width:700px){.reg-mo .face{width:44px;height:44px}.reg-mo .say{font-size:12px}.reg-mo .ask{padding:10px 12px}}

/* MO presses a register key: pose layers replace the idle sprite for ~1.7s. The 'front' copy shows only the hand area and sits above the register. */
.reg-press{position:absolute;display:none;background-repeat:no-repeat;pointer-events:none}
.reg-press.base{z-index:2}
.reg-press.front{z-index:5;clip-path:inset(73% 77.3% 0 0)}
.reg-pressing .reg-press,.reg-fading .reg-press{display:block}
.reg-pressing #mo,.reg-fading #mo{visibility:hidden}
.reg-fading #mo{visibility:visible}
.reg-pressing .blink-lids{opacity:0!important}
.reg-key-glint{position:absolute;z-index:6;width:5%;aspect-ratio:1;border-radius:50%;pointer-events:none;opacity:0;transform:translate(-50%,-50%);
 background:radial-gradient(circle,#fffbe0 0,#6dff9acc 35%,transparent 70%);mix-blend-mode:screen}

/* Tilt / haptics toggles share the corner strip; keep four of them on one phone row. */
.toggles button[hidden]{display:none}
@media(max-width:900px){.toggles{flex-wrap:wrap;max-width:calc(100vw - 20px)}.toggles button{padding:6px 7px;font-size:8.5px}}

/* Face system: the patches ride inside MO's svg; the old drawn eyelids are retired. */
.face-sys .blink-lids{display:none!important}
.mo-face{pointer-events:none}

/* Fridge trip: the trip layer replaces idle MO; the cold glow sits on the fridge doors */
.trip-layer{position:absolute;inset:0;z-index:2;pointer-events:none}
.trip-f{position:absolute;opacity:0;max-width:none;will-change:opacity;user-select:none}
.trip-shown #mo{visibility:hidden}
.trip-active .monitor-hit,.trip-active .printer-hit,.trip-active .reg-hit,.trip-active .mo-hit,.trip-active .tail-hit,.trip-active .mobile-nav{pointer-events:none}
.fridge-glow{position:absolute;left:26.2%;top:41.2%;width:11.3%;height:32.2%;z-index:1;pointer-events:none;opacity:0;transition:opacity .35s;
 background:radial-gradient(ellipse 62% 34% at 50% 27%,#f2ffffdd 0,#8ff3ffaa 36%,#3fd8ff44 66%,transparent 90%);mix-blend-mode:screen}
.fridge-glow.on{opacity:1;animation:fridgeFlicker 2.4s ease-in-out infinite}
@keyframes fridgeFlicker{0%,100%{filter:brightness(1)}50%{filter:brightness(1.18)}}
.trip-active .zzz{display:none!important}

/* Flickering neons outside the window (feathered copies of the art's own lit pixels) */
.neon-fx{position:absolute;z-index:1;pointer-events:none;background-repeat:no-repeat;opacity:0;
 -webkit-mask-image:radial-gradient(closest-side,#000 62%,transparent 100%);mask-image:radial-gradient(closest-side,#000 62%,transparent 100%);
 animation-timing-function:steps(1,end);animation-iteration-count:infinite}
.neon-fx.buzz,.neon-fx.flick,.neon-fx.pulse{mix-blend-mode:screen;filter:brightness(1.12) saturate(1.05)}
.neon-fx.dead{filter:brightness(.72) saturate(.9)}
.neon-fx.buzz{animation-name:nBuzz}.neon-fx.flick{animation-name:nFlick}.neon-fx.pulse{animation-name:nPulse;animation-timing-function:ease-in-out}.neon-fx.dead{animation-name:nDead}
@keyframes nBuzz{0%,100%{opacity:0}9%{opacity:.28}10%{opacity:0}58%{opacity:.3}59%{opacity:.08}61%{opacity:.26}63%{opacity:0}}
@keyframes nFlick{0%,100%{opacity:0}30%{opacity:.26}31%{opacity:0}66%{opacity:.3}69%{opacity:.1}71%{opacity:0}}
@keyframes nPulse{0%,100%{opacity:0}50%{opacity:.22}}
@keyframes nDead{0%,44%{opacity:0}45%{opacity:.35}46%{opacity:0}82%{opacity:0}83%{opacity:.3}84%{opacity:0}100%{opacity:0}}
.paused .neon-fx,.paused .pot-steam i{animation-play-state:paused!important}
/* Coffee pot steam */
.pot-steam{position:absolute;z-index:1;pointer-events:none;overflow:visible}
.pot-steam i{position:absolute;bottom:0;left:34%;width:26%;height:58%;border-radius:50% 50% 45% 55%/60% 60% 40% 40%;background:linear-gradient(to top,#fff1d5cc,#fff1d555 55%,transparent);filter:blur(2.2px);opacity:0;transform-origin:50% 100%;animation:potSteam 3.8s ease-in-out infinite}
.pot-steam i:nth-child(2){left:56%;width:22%;height:46%;animation-delay:1.3s;animation-duration:4.4s}
.pot-steam i:nth-child(3){left:12%;width:20%;height:50%;animation-delay:2.5s;animation-duration:3.5s}
@keyframes potSteam{0%{opacity:0;transform:translateY(8%) scaleY(.5) skewX(0)}18%{opacity:.7}60%{opacity:.4;transform:translateY(-70%) scaleY(1.1) skewX(10deg)}100%{opacity:0;transform:translateY(-130%) scaleY(1.2) skewX(-8deg)}}

/* candle chart on the store monitor: flips over the whole screen now and then (chart.js), under the scanlines */
.monitor-chart{position:absolute;inset:0;width:100%;height:100%;display:block;background:#04141c;pointer-events:none;opacity:0;transition:opacity .18s steps(3)}
.monitor-chart.on{opacity:1}
.monitor-chart.glitch{animation:chartGlitch .5s steps(2) 1}
@keyframes chartGlitch{0%{filter:brightness(2.2) contrast(1.6);transform:translateX(-3px) scaleY(1.03)}25%{filter:brightness(.6);transform:translateX(3px) scaleY(.97)}50%{filter:brightness(1.6) hue-rotate(25deg);transform:translateX(-2px)}100%{filter:none;transform:none}}
@media(prefers-reduced-motion:reduce){.monitor-chart,.monitor-chart.glitch{transition:none;animation:none}}

/* the tip jar's hit box (pinned over the jar sprite by tip.js) */
.tip-hit{position:absolute;z-index:7;background:transparent;border:0;border-radius:12px;cursor:pointer;min-width:44px;min-height:44px;padding:0}
.tip-hit:hover,.tip-hit:focus-visible{background:#ffe08a14;box-shadow:inset 0 0 18px #ffe08a55;outline:none}
.trip-active .tip-hit{pointer-events:none}