html,body{margin:0;height:100%;background:#000;overflow:hidden;overscroll-behavior:none;-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}#app{position:fixed;inset:0;padding:0 env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);touch-action:none}body[data-screen=select] #app,body[data-screen=overview] #app{padding-top:env(safe-area-inset-top)}.viewport{position:relative;width:100%;height:100%;overflow:hidden}.stage{position:absolute;left:0;top:0;transform-origin:0 0;font-family:Roboto,system-ui,sans-serif;color:#fff}.screen{position:absolute;inset:0}.screen>*,.stage .ico,.frame-wrap>svg{position:absolute}.layer{left:0;top:0;pointer-events:none}.layer.text text{font-family:Roboto,system-ui,sans-serif}button{font:inherit;color:inherit;border:0;padding:0;margin:0;background:none;cursor:pointer}.ov-header{left:0;top:0;width:var(--W, 1080px);height:159px;background:linear-gradient(#212121,#000 156px)}.ov-header-line{left:0;top:159px;width:var(--W, 1080px);height:3px;background:#303030}.cicon{display:block}.pill.mirror{left:344px;top:1262px;width:392px;height:114px;border-radius:57px;box-shadow:inset 0 0 0 3px #fff}.start{left:820px;top:1942px;width:235px;height:115px;border-radius:57.5px;background:#f2582c;color:#fff;font-size:44px;font-weight:500;letter-spacing:.2px;line-height:115px;text-align:center}.start:active,.pill:active{filter:brightness(.9)}.big-icon,.board{display:block;pointer-events:none}.hit{border-radius:50%}.back-btn{display:flex;align-items:center;justify-content:center;padding:0;border:0;background:none;-webkit-tap-highlight-color:transparent}.row-clip{left:0;overflow:hidden;-webkit-mask-image:linear-gradient(to right,#000 calc(100% - var(--fade)),transparent);mask-image:linear-gradient(to right,#000 calc(100% - var(--fade)),transparent)}.row-clip.grid{overflow:visible;-webkit-mask-image:none;mask-image:none}.row-track{position:absolute;inset:0;transition:transform .28s cubic-bezier(.3,.7,.3,1)}.row-item{position:absolute;top:0;border-radius:50%}.row-item img{display:block;width:100%;height:100%}.row-item.active img{width:var(--inner, 84px);height:var(--inner, 84px);margin:var(--m, 9px)}.row-item.active:before{content:"";position:absolute;inset:0;border-radius:50%;box-shadow:inset 0 0 0 var(--ring, 6px) #fff}.bead-area{left:0;width:var(--W, 1080px);bottom:0}.bead-area-label{display:none}.backlight{pointer-events:none;transition:opacity .14s ease}.bead-layer{left:0;top:0;width:var(--W, 1080px);pointer-events:none}.bead-canvas{position:absolute;left:0;top:0;pointer-events:none}.finale-layer{left:0;top:0;width:var(--W, 1080px);pointer-events:none}.fx{position:absolute;left:0;top:0;transform-origin:50% 50%;pointer-events:none;transition:opacity .4s ease}.fx-paper{filter:drop-shadow(0 6px 10px rgba(0,0,0,.3))}.fx-iron{width:443.5px;height:900px}.fx-iron img{display:block;width:100%;height:100%}.fx-scraper{transform-origin:0 0;filter:drop-shadow(4px 8px 6px rgba(0,0,0,.45))}.fx.hint{animation:tool-glow 1.4s ease-in-out infinite}.fx-scraper.hint{animation:none}@keyframes tool-glow{0%,to{filter:drop-shadow(0 0 0 rgba(255,255,255,0))}50%{filter:drop-shadow(0 0 14px rgba(255,255,255,.95)) drop-shadow(0 0 30px rgba(255,255,255,.6))}}@keyframes scraper-glow{0%,to{filter:drop-shadow(4px 8px 6px rgba(0,0,0,.45))}50%{filter:drop-shadow(4px 8px 6px rgba(0,0,0,.45)) drop-shadow(0 0 22px rgba(255,255,255,.9))}}.fx-steam{position:absolute;width:46px;height:46px;margin:-23px 0 0 -23px;border-radius:50%;background:radial-gradient(circle,#ffffff8c,#fff0);pointer-events:none;animation:steam-rise 1.1s ease-out forwards}@keyframes steam-rise{0%{opacity:.9;transform:translate(0) scale(.6)}to{opacity:0;transform:translate(-30px,-120px) scale(1.8)}}.screen.laying.finale-out>*:not(.bead-layer):not(.congrats):not(.confetti):not(.end-buttons):not(.story-btn):not(.story-more){pointer-events:none}.confetti{left:0;top:0;pointer-events:none}.congrats{left:0;width:var(--W, 1080px);text-align:center;font:500 calc(135px * var(--u, 1)) / 1 "Noto Serif",Georgia,serif;color:#fff;pointer-events:none}.next-hint{display:none}.arrow-next.on,.nudge{animation:nudge-pulse 1.57s cubic-bezier(.45,0,.55,1) infinite}.arrow-next{transform-origin:455.5px 345.5px}.ico.arrow-next{transform-origin:50% 50%}.ring{border-radius:50%;pointer-events:none}.start-label{transform-box:view-box;transform-origin:937.5px 1999.5px}@keyframes nudge-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.25)}}@media(prefers-reduced-motion:reduce){.arrow-next.on,.nudge{animation:none}}.hint-arrow{position:absolute;width:84px;height:100px;pointer-events:none;opacity:0}.hint-arrow.on{animation:arrow-in .8s ease-out both}@keyframes arrow-in{0%{opacity:0;transform:translate(var(--gx, 0px),var(--gy, 18px))}to{opacity:1;transform:translate(0)}}.hint-arrow.out{animation:arrow-out .5s ease-in both}@keyframes arrow-out{0%{opacity:1}to{opacity:0}}.hint-arrow .dir{width:100%;height:100%;transform:rotate(var(--dir, 0deg))}.hint-arrow svg{display:block;width:100%;height:100%;animation:arrow-bob 1.1s ease-in-out infinite;filter:drop-shadow(0 4px 10px rgba(0,0,0,.5))}@keyframes arrow-bob{0%,to{transform:translateY(0)}50%{transform:translateY(-24px)}}.spike-toggle{right:24px;display:flex;align-items:center;gap:6px;z-index:20;font:500 30px/1 Roboto,system-ui,sans-serif;color:#777}.spike-toggle[hidden]{display:none}.spike-toggle button{padding:12px 22px;border-radius:30px;border:2px solid #444;color:#999}.spike-toggle button.on{border-color:#f2582c;color:#fff;background:#f2582c}.spike-toggle .fps{min-width:110px;text-align:right}body.dev-area .bead-area{outline:3px dashed rgba(242,88,44,.7);outline-offset:-6px}body.dev-area .bead-area-label{display:block;position:absolute;left:30px;top:24px;font-size:34px;color:#f2582ce6}.ref-overlay{position:absolute;left:0;top:0;width:var(--W, 1080px);pointer-events:none;z-index:50}.dev-diag{position:fixed;left:6px;top:6px;right:6px;z-index:100;font:11px/1.35 system-ui,sans-serif;color:#9f9;pointer-events:none;text-shadow:0 0 3px #000}.dev-diag .err{color:#ff6b6b}.dev-bar{position:fixed;right:8px;bottom:8px;z-index:100;display:flex;gap:6px;font:12px/1 system-ui,sans-serif}.dev-bar button{background:#282828d9;color:#ddd;padding:8px 10px;border-radius:6px;border:1px solid #555}.dev-bar button.on{border-color:#f2582c;color:#f2582c}.end-buttons{left:0;width:var(--W, 1080px);display:flex;flex-direction:column;align-items:center;gap:calc(34px * var(--u, 1));pointer-events:none}.end-buttons.row{flex-direction:row-reverse;justify-content:center;gap:calc(44px * var(--u, 1))}.end-buttons.on{pointer-events:auto}.end-btn{width:760px;height:calc(115px * var(--u, 1));padding:0 calc(56px * var(--u, 1));border-radius:calc(57.5px * var(--u, 1));font-size:calc(44px * var(--u, 1));font-weight:500;letter-spacing:.2px;line-height:calc(115px * var(--u, 1));text-align:center;white-space:nowrap;box-sizing:border-box;cursor:pointer;-webkit-tap-highlight-color:transparent}.end-buttons.row .end-btn{width:auto}.end-btn.buy{background:#f2582c;color:#fff}.end-btn.retry{background:transparent;color:#fff;box-shadow:inset 0 0 0 4px #fff}.end-btn:active{filter:brightness(.9)}.end-photo{left:0;top:0;width:var(--W, 1080px);overflow:hidden;pointer-events:none}.end-photo img{position:absolute;top:0;object-fit:cover;object-position:50% 50%;-webkit-user-drag:none}.photo-title{left:0;width:var(--W, 1080px);text-align:center;font:500 calc(80px * var(--u, 1)) / 1 "Noto Serif",Georgia,serif;color:#fff;text-shadow:0 2px 16px rgba(0,0,0,.45);pointer-events:none}.story-more{position:absolute;display:flex;align-items:center;gap:calc(22px * var(--u, 1));height:calc(104px * var(--u, 1));padding:0 calc(46px * var(--u, 1)) 0 calc(12px * var(--u, 1));border:0;border-radius:calc(52px * var(--u, 1));background:#0000002e;box-shadow:inset 0 0 0 calc(3px * var(--u, 1)) #fff;color:#fff;font:500 calc(44px * var(--u, 1)) "Roboto",sans-serif;white-space:nowrap;pointer-events:none;-webkit-tap-highlight-color:transparent}.story-more.on{pointer-events:auto}.story-more img{width:calc(80px * var(--u, 1));height:calc(80px * var(--u, 1))}.end-shade{position:absolute;left:0;right:0;bottom:0;background:linear-gradient(#0000,#00000080 40%,#000000c7)}.end-shade.top{top:0;bottom:auto;background:linear-gradient(#0000008c,#0000004d 60%,#0000)}.end-shade.side{top:0;right:auto;width:64%;background:linear-gradient(90deg,#000000a8,#00000080 55%,#0000)}.end-buttons.side .end-btn{width:calc(760px * var(--u, 1))}.backlight-boost{mix-blend-mode:screen;mix-blend-mode:plus-lighter}.board{will-change:transform}.frame-wrap.guide .guide-glow{opacity:0;transition:opacity .8s ease;pointer-events:none}.frame-wrap.guide.glow .guide-glow{opacity:1;transition:opacity .2s ease}.select-title{left:0;width:var(--W, 1080px);margin:0;text-align:center;font:500 104px/1 "Noto Serif",Georgia,serif;color:#fff}.motif-pick{cursor:pointer;-webkit-tap-highlight-color:transparent;transition:transform .5s cubic-bezier(.2,.8,.2,1)}@media(hover:hover){.motif-pick:hover{transform:scale(1.08)}}.motif-pick:active{transform:scale(.96)}.motif-pick .motif-dots{position:absolute}.story-overlay{left:0;top:0;width:var(--W, 1080px);height:var(--H, 100%);display:flex;align-items:center;justify-content:center;background:#0a0a0a8c;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);opacity:0;transition:opacity .22s ease;z-index:20}.story-overlay.on{opacity:1}.story-overlay.first{transition-duration:.5s}.story-panel{display:flex;flex-direction:column;align-items:center;transform:scale(.94);transition:transform .26s cubic-bezier(.2,.8,.2,1)}.story-overlay.on .story-panel{transform:scale(1)}.story-title{color:#fff;font-family:"Noto Serif",Georgia,serif;font-weight:500;line-height:1;text-align:center}.story-voices{display:flex;align-items:center}.story-pick img,.story-btn img{display:block;width:100%;height:100%;pointer-events:none}.story-none{color:#fff;font-weight:500}.story-overlay.stack{flex-direction:column;justify-content:flex-start}.story-overlay.stack .sp{flex:1 1 0}.story-overlay.stack>button,.story-overlay.stack>.story-panel{flex:none}.story-pick:active,.story-none:active,.story-btn:active{filter:brightness(.9)}.story-btn{border-radius:50%}.sound-overlay{position:absolute;left:0;top:0;width:var(--W, 1080px);height:var(--H, 100%);display:flex;align-items:center;justify-content:center;background:#0a0a0a8c;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);opacity:0;transition:opacity .24s ease;z-index:30;touch-action:none}.sound-overlay.on{opacity:1}.sound-panel{position:relative;display:flex;flex-direction:column;align-items:center;transform:scale(.15);opacity:0;transition:transform .28s cubic-bezier(.2,.85,.25,1.05),opacity .2s ease}.sound-overlay.on .sound-panel{transform:scale(1);opacity:1}.sound-voices{display:flex;justify-content:space-between;width:100%}.sound-scrub{position:relative;width:100%}.sound-track{position:absolute;top:50%;background:#fff}.sound-fill{height:100%;width:0;background:#cc5927}.sound-knob{position:absolute;left:0;top:0;border-radius:50%}.sound-knob img{display:block;width:100%;height:100%;pointer-events:none}.sound-knob.off{opacity:.45}.story-play img{display:block;width:100%;height:100%;pointer-events:none}.story-play.off{opacity:.4}.story-play:active{filter:brightness(.9)}.story-overlay.ontop{background:#0a0a0a80;-webkit-backdrop-filter:none;backdrop-filter:none}.story-overlay .story-pick,.story-overlay .story-play,.story-overlay .story-none,.sound-overlay .story-pick{transition:transform .4s cubic-bezier(.2,.8,.2,1)}.story-overlay .story-pick img,.sound-overlay .story-pick img{transition:filter .4s ease}.story-overlay .story-pick[data-who=maja],.sound-overlay .story-pick[data-who=maja]{--gc: rgba(167, 26, 75, .8)}.story-overlay .story-pick[data-who=alfred],.sound-overlay .story-pick[data-who=alfred]{--gc: rgba(42, 108, 183, .8)}@media(hover:hover){.story-overlay .story-pick:hover,.story-overlay .story-play:hover,.story-overlay .story-none:hover,.sound-overlay .story-pick:hover{transform:scale(1.06)}}.story-overlay .story-pick.on,.sound-overlay .story-pick.on{transform:scale(1.1)}.story-overlay .story-pick.talking img,.sound-overlay .story-pick.talking img{filter:drop-shadow(0 0 calc(var(--gb) * .35) var(--gc)) drop-shadow(0 var(--gy) var(--gb) var(--gc))}.story-overlay.leaving{transition:opacity .6s ease .15s}.story-overlay.leaving .story-panel,.story-overlay.leaving>button{opacity:0;transition:opacity .3s ease}