#lumik-counter{position:relative;flex-shrink:0;margin-left:16px;display:flex;align-items:center;gap:8px;height:clamp(44px,8vh,64px);overflow:hidden;padding:0 10px 0 0;border:0;background:transparent;color:#193657;font-size:clamp(18px,1.4vw,28px);font-weight:800;z-index:12;border-radius:16px}
.lumik-head{display:block;width:58px;height:60px;overflow:hidden;position:relative;pointer-events:none}
.lumik-head img{position:absolute;width:82px;height:auto;max-width:none;left:-12px;top:-3px}
.lumik-count{min-width:1.2em;text-align:center;font-variant-numeric:tabular-nums}
#lumik-counter.is-compact{gap:2px;padding-right:0;height:44px;font-size:18px}.is-compact .lumik-head{width:32px;height:36px}.is-compact .lumik-head img{width:48px;left:-7px;top:-2px}
.lumik-peek{position:fixed;z-index:9;overflow:hidden;border:0;padding:0;margin:0;background:transparent;touch-action:manipulation;border-radius:0;cursor:pointer;-webkit-tap-highlight-color:transparent}
.lumik-peek img{position:absolute;display:block;width:var(--lumik-image-width);height:auto;max-width:none;pointer-events:none;filter:drop-shadow(0 2px 2px #68432d30)}
.lumik-from-bottom img{left:0;top:0;animation:lumik-rise .5s ease-out both}
.lumik-from-top{animation:lumik-drop .5s ease-out both}
.lumik-from-top img{left:0;bottom:0;transform:rotate(180deg)}
.lumik-from-left img{right:0;top:0;animation:lumik-left .5s ease-out both}
.lumik-from-right img{left:0;top:0;animation:lumik-right .5s ease-out both}
.lumik-peek:focus-visible{outline:3px solid #ffcf72;outline-offset:-3px;border-radius:14px}
.lumik-status{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
@keyframes lumik-rise{from{transform:translateY(18%)}to{transform:translateY(0)}}
@keyframes lumik-drop{from{transform:translateY(-18%)}to{transform:translateY(0)}}
@keyframes lumik-left{from{transform:translateX(-18%)}to{transform:translateX(0)}}
@keyframes lumik-right{from{transform:translateX(18%)}to{transform:translateX(0)}}
.lumik-smoke{position:fixed;z-index:40;width:1px;height:1px;pointer-events:none}
.lumik-smoke i{position:absolute;width:54px;height:54px;left:-27px;top:-27px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff,#d5dee4 70%,#bdcbd6);box-shadow:0 0 12px #ffffffb0;animation:lumik-puff .85s var(--delay) ease-out both}
@keyframes lumik-puff{0%{opacity:0;transform:scale(.25)}20%{opacity:.95}100%{opacity:0;transform:translate(var(--dx),var(--dy)) scale(1.6)}}
.lumik-counter-content{display:flex;align-items:center;gap:inherit}.lumik-score-pop .lumik-counter-content{animation:lumik-score .4s ease-out}@keyframes lumik-score{50%{transform:scale(1.12)}}
.lumik-mischief{position:fixed;z-index:8;width:120px;height:75px;pointer-events:none;animation:lumik-cleanup 15s linear both}
.lumik-bite svg{width:100%;height:100%;filter:drop-shadow(0 2px 2px #8b684525)}
.lumik-mess i{position:absolute;border-radius:45% 55% 40% 60%;background:#b1844b;box-shadow:inset 0 2px 2px #d8b475;width:14px;height:9px;transform:rotate(25deg)}
.lumik-mess i:nth-child(1){left:12px;top:35px}.lumik-mess i:nth-child(2){left:35px;top:22px;width:10px}.lumik-mess i:nth-child(3){left:61px;top:41px}.lumik-mess i:nth-child(4){left:86px;top:29px;width:8px}.lumik-mess i:nth-child(5){left:47px;top:55px;width:7px}.lumik-mess i:nth-child(6){left:99px;top:51px;width:12px}.lumik-mess span{position:absolute;left:57px;top:8px;font-size:24px;color:#d2a968}
@keyframes lumik-cleanup{0%,80%{opacity:1}100%{opacity:0}}
#lumik-info{width:min(460px,90vw);max-height:80dvh;border:3px solid white;border-radius:24px;background:#fffaf7;color:#193657;padding:24px;font:inherit;box-shadow:0 12px 45px #19365730}
#lumik-info::backdrop{background:#19365730}.lumik-info-heading{display:flex;justify-content:space-between;gap:16px;align-items:center}.lumik-info-heading h2{font-size:26px;margin:0;font-weight:800}.lumik-info-heading button{border:0;background:#edf0f3;border-radius:50%;font-size:28px;width:42px;height:42px;flex-shrink:0}.lumik-try{background:#ffcf72;border:0;border-radius:14px;padding:12px 18px;font-weight:800;font-size:18px}#lumik-info p{font-size:18px;line-height:1.4}
@media(max-width:800px){#lumik-counter{margin-left:8px;height:44px;gap:3px;font-size:18px;padding-right:3px}.lumik-head{width:36px;height:40px}.lumik-head img{width:54px;left:-8px;top:-2px}}
@media(prefers-reduced-motion:reduce){.lumik-peek,.lumik-peek img,.lumik-score-pop .lumik-counter-content{animation:none}.lumik-smoke i{animation:lumik-simple-puff .5s both}@keyframes lumik-simple-puff{from{opacity:.9}to{opacity:0}}}

@media(min-width:801px){
#lumik-counter{height:calc(64px * var(--menu-art-scale,1));gap:calc(8px * var(--menu-art-scale,1))}
.lumik-head{width:calc(58px * var(--menu-art-scale,1));height:calc(60px * var(--menu-art-scale,1))}
.lumik-head img{width:calc(82px * var(--menu-art-scale,1));left:calc(-12px * var(--menu-art-scale,1));top:calc(-3px * var(--menu-art-scale,1))}
}

/* Sideways panel peeks live above every tile, outside their clipping boxes. */
.lumik-from-panel-left img{left:0;top:0;transform-origin:top left;transform:translateY(var(--lumik-image-width)) rotate(-90deg)}
.lumik-from-panel-right img{left:calc(100% - var(--lumik-image-height));top:0;transform-origin:top left;transform:translateX(var(--lumik-image-height)) rotate(90deg)}
.lumik-from-panel-left img{animation:lumik-panel-left .5s ease-out both}
.lumik-from-panel-right img{animation:lumik-panel-right .5s ease-out both}
@keyframes lumik-panel-left{from{translate:18% 0}to{translate:0 0}}
@keyframes lumik-panel-right{from{translate:-18% 0}to{translate:0 0}}
@media(prefers-reduced-motion:reduce){.lumik-from-panel-left img,.lumik-from-panel-right img{animation:none}}


#lumik-tester{display:flex;flex-direction:column;align-items:center;gap:3px;color:#193657;flex-shrink:0}
.lumik-test-buttons{display:flex;gap:6px}
.lumik-test-buttons button{background:#eee9e4;border:1px solid #19365722;border-radius:12px;padding:8px 10px;font-size:clamp(12px,1vw,18px);font-weight:800;white-space:nowrap;min-height:36px}
.lumik-test-buttons button:first-child{background:#193657;color:white}
.lumik-test-buttons button:last-child{background:#ffcf72}
.lumik-test-position{font-size:clamp(11px,.85vw,15px);font-weight:600;font-variant-numeric:tabular-nums}
@media(max-width:1700px){header:has(#lumik-tester:not([hidden])) h1{position:static;transform:none;margin:auto;font-size:clamp(16px,2vw,30px)}header:has(#lumik-tester:not([hidden])) .title-rays{display:none}header:has(#lumik-tester:not([hidden])){gap:12px}.header-actions:has(#lumik-tester:not([hidden])){gap:10px}}
@media(max-width:900px){.lumik-test-buttons{flex-direction:column;gap:2px}.lumik-test-buttons button{padding:3px 6px;min-height:24px;font-size:11px}header:has(#lumik-tester:not([hidden])){padding:0 12px;gap:5px}.header-actions:has(#lumik-tester:not([hidden])){gap:6px}header:has(#lumik-tester:not([hidden])) h1{font-size:16px}}

#lumik-tester[hidden]{display:none}