@font-face{font-family:PressStart2P;src:url('../assets/fonts/PressStart2P-Regular.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:PixelifySans;src:url('../assets/fonts/PixelifySans-Regular.woff2') format('woff2'),url('../assets/fonts/PixelifySans-LatinExt.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}:root{--font-display:'PressStart2P','PixelifySans',system-ui,sans-serif;--font-body:'PixelifySans',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;--font-numeric:ui-monospace,'SF Mono','Cascadia Mono',Menlo,Consolas,monospace;--bg:#FFFAF2;--bar-bg:#f5e9d8;--surface:#fffaf2;--ink:#3e2723;--ink-soft:#6d4c41;--text:#3e2723;--text-muted:#6d4c41;--accent:#d84315;--accent-text:#fff8e1;--accent-2:#ffb300;--danger:#d32f2f;--good:#2e7d32;--shadow:4px 4px 0 0 var(--ink);--shadow-sm:2px 2px 0 0 var(--ink);--shadow-lg:6px 6px 0 0 var(--ink);--btn-daily-bg:#FFF3E0;--btn-daily-color:#E65100;--btn-weekly-bg:#E3F2FD;--btn-weekly-color:#1565C0;--weekly-dot-empty:rgba(0,0,0,0.15);--weekly-dot-active:#1565C0;--overlay-bg:rgba(0, 0, 0, 0.65);--coin-gradient:radial-gradient(ellipse at 30% 30%, #FFE66D, #FFD700 40%, #E6A800 70%, #CC9900 100%);--coin-border:#B8860B;--logo-width:95%;--preview-size:200px;--container-h:100vh;--container-h:100svh;--top-bar-h:48px}[data-theme=dark]{--bg:#1a1a2e;--bar-bg:#241b3a;--surface:#2d2252;--ink:#ce93d8;--ink-soft:#b39ddb;--text:#e0d0f0;--text-muted:#b39ddb;--accent:#ff5c8a;--accent-text:#1a1a2e;--accent-2:#ffd54f;--danger:#ff6b6b;--good:#66bb6a;--btn-daily-bg:#3E2723;--btn-daily-color:#FFB74D;--btn-weekly-bg:#0D47A1;--btn-weekly-color:#90CAF9;--weekly-dot-active:#90CAF9}body.in-gameplay{--container-h:calc(100vh - var(--top-bar-h));--container-h:calc(100svh - var(--top-bar-h))}*,::after,::before{box-sizing:border-box;margin:0;padding:0}body,html{width:100%;height:100%;overflow:hidden;font-family:var(--font-body);background:linear-gradient(180deg,#fffaf2 0,#f8efdb 50%,#f5e6cd 100%);color:var(--text);-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;touch-action:manipulation;overscroll-behavior:none;image-rendering:pixelated;image-rendering:crisp-edges}[data-theme=dark] body{background:linear-gradient(180deg,#1a1a2e 0,#241b3a 50%,#2d2252 100%)}canvas{image-rendering:pixelated;image-rendering:crisp-edges}.bg-canvas{position:absolute;top:0;left:0;width:100%;height:100%;z-index:0;pointer-events:none}.top-bar{position:fixed;top:0;left:0;right:0;height:var(--top-bar-h);box-sizing:border-box;display:flex;flex-wrap:nowrap;align-items:center;justify-content:space-between;padding:0 8px;z-index:100;background:var(--bar-bg);border-bottom:3px solid var(--ink);overflow:hidden}.top-bar-center,.top-bar-left,.top-bar-right{display:flex;align-items:center;gap:10px}.top-bar-left{flex:1 1 0;justify-content:flex-start;gap:6px;min-width:0}.top-bar-center{position:absolute;left:50%;top:calc((100% + env(safe-area-inset-top,0px))/ 2);transform:translate(-50%,-50%);justify-content:center;padding:0;pointer-events:none}.top-bar-right{flex:1 1 0;justify-content:flex-end;gap:8px;min-width:0}.top-bar-btn{background:0 0;border:none;cursor:pointer;padding:6px;color:var(--ink);display:flex;align-items:center;justify-content:center;transition:transform 80ms steps(2)}.top-bar-btn:active{transform:translate(2px,2px)}.mistakes-display{display:flex;align-items:center;gap:4px;font-family:var(--font-numeric);font-size:13px;color:var(--ink)}.hint-btn{color:var(--accent-2);flex-direction:column;gap:1px;padding:4px 8px;min-width:36px}.volume-btn .volume-icon-off,.volume-btn.muted .volume-icon-on{display:none}.volume-btn.muted .volume-icon-off{display:block}.sound-toggle-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px}.sound-toggle-btn .volume-icon-off,.sound-toggle-btn.muted .volume-icon-on{display:none}.sound-toggle-btn.muted .volume-icon-off{display:inline-block}.sound-toggle-btn.muted{opacity:.6;color:var(--text-muted);background:var(--bg)}.layout-container{position:relative;width:100%;height:100%;max-width:min(100%,calc(100svh * 9 / 16));margin:0 auto;overflow:hidden;z-index:1}.layout-portrait{aspect-ratio:9/16;max-height:100vh;max-height:100svh}body.in-gameplay .layout-container{margin-top:var(--top-bar-h);height:calc(100vh - var(--top-bar-h));height:calc(100svh - var(--top-bar-h));max-width:min(100%,calc((100vh - var(--top-bar-h)) * 9 / 16));max-width:min(100%,calc((100svh - var(--top-bar-h)) * 9 / 16))}body.in-gameplay .layout-portrait{max-height:calc(100vh - var(--top-bar-h));max-height:calc(100svh - var(--top-bar-h))}.screen{position:absolute;top:0;left:0;width:100%;height:100%;display:none;z-index:1}.screen.active{display:flex;flex-direction:column;align-items:center;justify-content:center}.loading-content{display:flex;flex-direction:column;align-items:center;gap:20px}.loading-logo-img{width:min(50vw,28.125vh);height:auto;object-fit:contain}.loading-spinner{width:24px;height:24px;position:relative;--p:var(--ink);background:linear-gradient(var(--p),var(--p)) 0 0/6px 6px no-repeat,linear-gradient(var(--p),var(--p)) 0 0/6px 6px no-repeat;animation:.8s steps(8) infinite pixelSpin}@keyframes pixelSpin{0%{background-position:0 0,18px 0}12.5%{background-position:6px 0,18px 6px}25%{background-position:12px 0,18px 12px}37.5%{background-position:18px 0,12px 18px}50%{background-position:18px 6px,6px 18px}62.5%{background-position:18px 12px,0 18px}75%{background-position:18px 18px,0 12px}87.5%{background-position:12px 18px,0 6px}100%{background-position:0 0,18px 0}}.menu-section{display:flex;flex-direction:column;gap:10px}.menu-section h3{font-family:var(--font-display);font-size:10px;color:var(--text-muted);text-transform:uppercase;letter-spacing:1px}.stats-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.stat-item{display:flex;flex-direction:column;align-items:center;padding:8px;background:var(--surface);border:2px solid var(--ink);box-shadow:var(--shadow-sm)}.stat-label{font-family:var(--font-body);font-size:10px;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px}.stat-value{font-family:var(--font-numeric);font-size:18px;color:var(--ink);margin-top:4px}.setting-row{display:flex;align-items:center;justify-content:space-between;padding:8px 0;font-size:14px;color:var(--text)}.toggle-switch{position:relative;width:44px;height:24px;display:inline-block}.toggle-switch input{display:none}.toggle-slider{position:absolute;top:0;left:0;right:0;bottom:0;background:var(--surface);border:2px solid var(--ink);cursor:pointer}.toggle-slider::before{content:'';position:absolute;width:16px;height:16px;left:2px;top:2px;background:var(--ink-soft);transition:transform .12s steps(2),background .12s steps(2)}.toggle-switch input:checked+.toggle-slider{background:var(--accent)}.toggle-switch input:checked+.toggle-slider::before{transform:translateX(20px);background:var(--accent-2)}.custom-select{position:relative}.custom-select-trigger{background:var(--surface);border:2px solid var(--ink);padding:6px 12px;font-family:var(--font-body);font-size:13px;color:var(--text);cursor:pointer;min-width:100px;text-align:left}.custom-select-dropdown{position:absolute;right:0;top:100%;background:var(--surface);border:2px solid var(--ink);box-shadow:var(--shadow);max-height:200px;overflow-y:auto;z-index:200;min-width:140px}.custom-select-option{padding:8px 12px;font-family:var(--font-body);font-size:13px;cursor:pointer;color:var(--text)}.custom-select-option.selected,.custom-select-option:hover{background:var(--accent);color:var(--accent-text)}.btn{padding:12px 20px;border:3px solid var(--ink);background:var(--surface);color:var(--ink);box-shadow:var(--shadow);font-family:var(--font-body);font-size:14px;cursor:pointer;transition:transform 80ms steps(2),box-shadow 80ms steps(2);text-transform:uppercase;letter-spacing:1px}.btn:active{transform:translate(4px,4px);box-shadow:0 0 0 0 var(--ink)}.btn-primary{background:var(--accent);color:var(--accent-text);font-family:var(--font-display);font-size:12px}.btn-secondary{background:var(--surface);color:var(--ink)}.btn-danger{background:var(--danger);color:#fff;font-size:12px;padding:10px 18px}.btn-large{padding:16px 36px;font-size:14px;font-family:var(--font-display);box-shadow:var(--shadow-lg)}.btn-large:active{transform:translate(6px,6px);box-shadow:0 0 0 0 var(--ink)}.btn-mode-toggle{padding:10px 20px;background:var(--accent);color:var(--accent-text);border:3px solid var(--ink);box-shadow:var(--shadow);font-family:var(--font-display);font-size:11px;flex:1 1 auto;min-width:0;max-width:max(88px,14ch);white-space:nowrap;overflow:hidden}.btn-mode-toggle.mode-mark{background:var(--ink-soft);color:#fff}#puzzle-gallery-screen{padding:0}.gallery-canvas{width:100%;height:100%;display:block;touch-action:none}#gameplay-screen{padding-top:40px}.game-content{width:100%;flex:1;min-height:0;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:8px;gap:0;position:relative}.board-zoom-btn{min-width:44px;min-height:44px;padding:0;background:var(--surface,#fffaf2);color:var(--ink,#4a4a4a);border:3px solid var(--ink,#4a4a4a);box-shadow:0 3px 0 0 var(--ink,#4a4a4a);font-family:var(--font-display);font-size:11px;cursor:pointer;display:flex;align-items:center;justify-content:center}.board-zoom-btn[hidden]{display:none}.board-zoom-btn:active{transform:translate(2px,2px);box-shadow:0 0 0 0 var(--ink,#4a4a4a)}.board-zoom-btn.zoomed{background:var(--accent);color:var(--accent-text)}.game-canvas{flex:0 0 auto;aspect-ratio:1/1;width:min(100%,calc(var(--container-h) - 180px));max-width:100%;display:block;touch-action:none}.game-controls{display:flex;justify-content:center;align-items:center;gap:10px;width:100%;max-width:100%;box-sizing:border-box;padding:0 4px;margin-top:calc(var(--container-h) * .02);flex-shrink:0}.board-zoom-btn{flex:0 0 auto}.menu-content{width:100%;box-sizing:border-box}.gallery-content{height:100%}.post-game-bg-canvas{position:absolute;top:0;left:0;right:0;bottom:0;width:100%;height:100%;pointer-events:none;z-index:0;display:none}body.post-game-active .post-game-bg-canvas{display:block}#post-game-screen{position:relative}.post-game-content{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;gap:16px;padding:24px;text-align:center}.post-game-content.cinematic{animation:.7s cubic-bezier(.34,1.32,.64,1) both postGameCardIn}@keyframes postGameCardIn{0%{opacity:0;transform:translateY(28px) scale(.94)}60%{opacity:1;transform:translateY(-2px) scale(1.02)}100%{opacity:1;transform:translateY(0) scale(1)}}#next-puzzle-btn.pulse-cta{animation:1.1s ease-out .8s 2 both pulseCta}#next-puzzle-btn.auto-advance{background-image:linear-gradient(to right,rgba(255,183,77,.55) 50%,transparent 50%);background-size:200% 100%;background-position:100% 0;animation:6s linear forwards autoAdvanceSweep}@keyframes autoAdvanceSweep{0%{background-position:100% 0}100%{background-position:0 0}}body.post-game-streamlined .post-game-actions .btn-icon{opacity:.55;transform:scale(.9)}body.post-game-streamlined .post-game-actions .btn-icon:focus,body.post-game-streamlined .post-game-actions .btn-icon:hover{opacity:1;transform:scale(1)}@keyframes pulseCta{0%{box-shadow:0 4px 0 0 var(--ink,#4a4a4a),0 0 0 0 rgba(255,183,77,.55)}60%{box-shadow:0 4px 0 0 var(--ink,#4a4a4a),0 0 0 14px rgba(255,183,77,0)}100%{box-shadow:0 4px 0 0 var(--ink,#4a4a4a),0 0 0 0 rgba(255,183,77,0)}}.post-game-content h1{font-family:var(--font-display);font-size:18px;color:var(--accent)}.post-game-preview{background:var(--surface);border:3px solid var(--ink);box-shadow:var(--shadow);padding:10px}.post-game-preview canvas{display:block;width:var(--preview-size);height:var(--preview-size);image-rendering:pixelated}.post-game-name{font-family:var(--font-body);font-size:16px;color:var(--text-muted)}.post-game-stats{display:flex;gap:32px}.post-stat{display:flex;flex-direction:column;align-items:center}.post-stat-label{font-family:var(--font-body);font-size:11px;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px}.post-stat-value{font-family:var(--font-numeric);font-size:20px;color:var(--ink)}.post-game-stars{display:flex;gap:10px;font-family:var(--font-display);font-size:28px;line-height:1}.post-star{color:var(--ink-soft);opacity:.4;transition:color .2s steps(2),transform .2s steps(2),opacity .2s steps(2)}.post-star.earned{color:var(--accent-2);opacity:1;text-shadow:2px 2px 0 var(--ink);animation:.4s steps(3) starPop}.post-game-buttons{display:flex;flex-direction:column;gap:10px;width:100%;max-width:260px}.post-game-buttons>.btn{width:100%;text-align:center}.post-game-actions-default{display:flex;flex-direction:column;gap:10px;width:100%}#post-game-screen .post-game-actions-claim,#post-game-screen .post-game-actions-close,#post-game-screen.mode-daily .post-game-actions-default{display:none}#post-game-screen.mode-daily .post-game-actions-claim{display:block}#post-game-screen.mode-weekly .post-game-actions-default{display:none}#post-game-screen.mode-weekly .post-game-actions-close{display:block}#post-game-screen.mode-weekly-final .post-game-actions-default{display:none}#post-game-screen.mode-weekly-final .post-game-actions-claim{display:block}.post-game-actions{display:flex;gap:8px;width:100%}.post-game-actions .btn-icon{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;padding:10px 4px;text-transform:none;letter-spacing:0;line-height:1;min-height:56px;position:relative}.btn-icon-svg{color:var(--ink)}.post-game-actions .btn-cost{display:inline-flex;align-items:center;gap:2px;margin-left:0;font-size:10px;opacity:.85}.celebration-canvas{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:50}.overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:var(--overlay-bg);display:flex;align-items:center;justify-content:center;z-index:500;animation:.2s ease-out fadeIn}.overlay.hidden{display:none}.overlay-content{background:var(--surface);border:3px solid var(--ink);box-shadow:var(--shadow-lg);padding:24px 20px;max-width:340px;width:90%;text-align:center}.overlay-content h2{font-family:var(--font-display);font-size:14px;color:var(--accent);margin-bottom:16px;text-shadow:2px 2px 0 var(--ink)}.overlay-content p{font-family:var(--font-body);font-size:14px;color:var(--text-muted);margin-bottom:20px;line-height:1.5}.overlay-content .btn{width:100%;margin-top:8px}.overlay-buttons{display:flex;flex-direction:column;gap:8px}.rules-content{max-height:calc(100vh - 32px);overflow-y:auto}.rules-steps{display:flex;flex-direction:column;gap:16px;margin-bottom:20px}.rule-step{display:flex;align-items:center;gap:12px;text-align:left}.rule-icon{flex-shrink:0;width:48px;height:48px;background:var(--bg);border:2px solid var(--ink);box-shadow:var(--shadow-sm);display:flex;align-items:center;justify-content:center}.rule-step p{font-family:var(--font-body);font-size:13px;color:var(--text);margin:0;line-height:1.45}.achievements-content{max-height:80vh;overflow-y:auto}.achievements-list{display:flex;flex-direction:column;gap:8px;margin-bottom:16px;max-height:50vh;overflow-y:auto}.achievement-item{display:flex;align-items:center;gap:10px;padding:10px;background:var(--bg);border:2px solid var(--ink);box-shadow:var(--shadow-sm)}.achievement-item.locked{opacity:.45}.achievement-icon{font-size:24px;flex-shrink:0}.achievement-info{flex:1;text-align:left}.achievement-name{font-family:var(--font-display);font-size:10px;color:var(--ink)}.achievement-desc{font-family:var(--font-body);font-size:12px;color:var(--text-muted);margin-top:2px}.achievement-check{color:var(--good);font-family:var(--font-display);font-size:14px}.toast-container{position:fixed;bottom:80px;left:50%;transform:translateX(-50%);z-index:600;display:flex;flex-direction:column;align-items:center;gap:8px;pointer-events:none}.toast{background:var(--ink);color:var(--bg);padding:10px 16px;border:2px solid var(--ink);box-shadow:var(--shadow-sm);font-family:var(--font-body);font-size:13px;opacity:0;transform:translateY(10px);transition:opacity .2s steps(2),transform .2s steps(2);pointer-events:auto;text-align:center;max-width:280px}.toast.show{opacity:1;transform:translateY(0)}@keyframes fadeIn{from{opacity:0}to{opacity:1}}@keyframes starPop{0%{transform:scale(.4)}33%{transform:scale(1.4)}66%{transform:scale(.9)}100%{transform:scale(1)}}.hidden{display:none!important}[data-theme=dark] .toast{background:var(--accent);color:var(--accent-text)}[dir=rtl] .top-bar-left,[dir=rtl] .top-bar-right{flex-direction:row-reverse}[dir=rtl] .rule-step{flex-direction:row-reverse;text-align:right}[dir=rtl] .achievement-item{flex-direction:row-reverse}[dir=rtl] .achievement-info{text-align:right}[dir=rtl] #settings-back-btn svg{transform:scaleX(-1)}@supports (padding-top:env(safe-area-inset-top)){.top-bar{padding-top:env(safe-area-inset-top);height:calc(var(--top-bar-h) + env(safe-area-inset-top))}#gameplay-screen{padding-top:40px}}@media (max-width:360px){.stats-grid{grid-template-columns:repeat(3,1fr);gap:4px}.stat-label{font-size:9px}.stat-value{font-size:12px}.btn-large{font-size:12px;padding:14px 24px}.post-game-content h1{font-size:14px}.overlay-content h2{font-size:12px}.coin-display-global{gap:3px;padding:2px 6px;font-size:10px;top:calc(8px + env(safe-area-inset-top,0px));inset-inline-end:calc(8px + env(safe-area-inset-right,0px))}.coin-display-global .coin-icon{width:12px;height:12px;min-width:12px;min-height:12px}.coin-display-global .coin-icon::after{font-size:8px}}@media (max-height:500px){.rules-content{padding:14px 16px}.rules-content h2{font-size:12px;margin-bottom:8px}.rules-description{font-size:12px;margin-bottom:12px;line-height:1.4}.rules-steps{gap:10px;margin-bottom:12px}.rule-icon,.rule-icon canvas{width:36px;height:36px}.rule-step p{font-size:12px;line-height:1.35}}@media (min-width:768px){.layout-container{border-left:3px solid var(--ink);border-right:3px solid var(--ink)}}.main-menu-content{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;padding:20px;gap:20px}.main-menu-top{position:absolute;top:calc(16px + env(safe-area-inset-top,0px));left:calc(16px + env(safe-area-inset-left,0px));right:calc(16px + env(safe-area-inset-right,0px));display:flex;justify-content:space-between;align-items:center;padding:0 5px;z-index:10}.menu-icon-btn{background:var(--surface);border:2px solid var(--ink);width:40px;height:40px;display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--ink);box-shadow:var(--shadow-sm);transition:transform 80ms steps(2),box-shadow 80ms steps(2)}.menu-icon-btn:active{transform:translate(2px,2px);box-shadow:0 0 0 0 var(--ink)}.coin-display{display:flex;align-items:center;gap:6px;background:var(--surface);border:2px solid var(--ink);box-shadow:var(--shadow-sm);padding:6px 12px;font-family:var(--font-numeric);font-size:15px;color:var(--ink)}.coin-icon{display:inline-block;width:18px;height:18px;min-width:18px;min-height:18px;background:var(--coin-gradient);border-radius:50%;border:2px solid var(--coin-border);box-shadow:inset 0 -3px 5px rgba(0,0,0,.3),inset 0 3px 5px rgba(255,255,255,.4),0 2px 5px rgba(0,0,0,.3);position:relative;vertical-align:-.25em;flex-shrink:0}.coin-icon::after{content:'★';position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:11px;color:var(--coin-border);text-shadow:0 1px 0 rgba(255,255,255,.5);line-height:1}.coin-icon.small{width:14px;height:14px;min-width:14px;min-height:14px;border-width:1px}.coin-icon.small::after{font-size:8px}.coin-icon.large{width:48px;height:48px;min-width:48px;min-height:48px;border-width:3px}.coin-icon.large::after{font-size:28px}.coin-balance{min-width:20px;text-align:center}.main-menu-logo{margin-top:40px;margin-bottom:10px;width:100%;max-width:300px;display:flex;justify-content:center}.game-logo-img{width:var(--logo-width);height:auto;object-fit:contain;image-rendering:pixelated;image-rendering:crisp-edges}.game-logo-fallback{font-family:var(--font-display);font-size:24px;color:var(--accent);text-align:center;text-shadow:3px 3px 0 var(--ink)}.main-menu-buttons{display:flex;flex-direction:column;align-items:center;gap:16px;width:100%;max-width:300px}.btn-play{width:100%;padding:18px 32px;font-family:var(--font-display);font-size:16px;letter-spacing:1px;text-transform:uppercase;box-shadow:var(--shadow-lg)}.btn-play:active{transform:translate(6px,6px);box-shadow:0 0 0 0 var(--ink)}.feature-buttons{display:flex;gap:12px;width:100%}body.first-run .feature-buttons{display:none}body.mistake-flash::after{content:'';position:fixed;top:0;left:0;right:0;bottom:0;pointer-events:none;z-index:2000;box-shadow:inset 0 0 90px 20px rgba(239,83,80,.45);animation:280ms ease-out forwards mistakeFlashFade}@keyframes mistakeFlashFade{0%{opacity:1}100%{opacity:0}}.streak-badge{position:fixed;left:50%;top:38%;transform:translate(-50%,-50%) scale(.6);pointer-events:none;z-index:1800;font-family:var(--font-display, PressStart2P, PixelifySans, system-ui, sans-serif);font-size:clamp(12px, 4vw, 18px);max-width:90vw;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:center;color:#fff;text-shadow:2px 2px 0 #5d4037,4px 4px 0 rgba(0,0,0,.35);letter-spacing:1px;opacity:0;animation:280ms cubic-bezier(.34,1.56,.64,1) forwards streakIn}.streak-badge.tier-2{color:#ffd54f;font-size:clamp(14px, 4.8vw, 22px)}.streak-badge.tier-3{color:#ff7043;font-size:clamp(16px, 5.6vw, 26px)}.streak-badge.out{animation:450ms ease-in forwards streakOut}@keyframes streakIn{0%{opacity:0;transform:translate(-50%,-50%) scale(.6)}60%{opacity:1;transform:translate(-50%,-50%) scale(1.15)}100%{opacity:1;transform:translate(-50%,-50%) scale(1)}}@keyframes streakOut{0%{opacity:1;transform:translate(-50%,-50%) scale(1)}100%{opacity:0;transform:translate(-50%,-110%) scale(1)}}.skip-escape-btn{position:fixed;bottom:calc(16px + env(safe-area-inset-bottom,0px));right:calc(16px + env(safe-area-inset-right,0px));z-index:1500;display:inline-flex;align-items:center;gap:clamp(4px,1.2vw,6px);padding:clamp(6px,1.6vw,8px) clamp(10px,3vw,14px);font-family:var(--font-display, PressStart2P, PixelifySans, system-ui, sans-serif);font-size:clamp(9px, 2.6vw, 11px);max-width:50vw;color:var(--ink,#4a4a4a);background:var(--surface,#fffaf2);border:2px solid var(--ink,#4a4a4a);box-shadow:0 3px 0 0 rgba(0,0,0,.25);cursor:pointer;opacity:0;transform:translateY(8px);animation:420ms ease-out forwards skipEscapeIn;min-height:36px}.skip-escape-btn .skip-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}.skip-escape-btn .skip-cost{display:inline-flex;align-items:center;gap:3px;padding:2px 5px;border:1px solid var(--ink,#4a4a4a);background:rgba(255,213,79,.25);color:var(--ink,#4a4a4a);font-size:.9em}.skip-escape-btn .skip-cost .coin-icon.small{width:10px;height:10px}.skip-escape-btn .skip-ad-icon{flex-shrink:0}.skip-escape-btn:active{transform:translateY(2px);box-shadow:0 1px 0 0 rgba(0,0,0,.25)}@keyframes skipEscapeIn{0%{opacity:0;transform:translateY(16px)}100%{opacity:1;transform:translateY(0)}}.tutorial-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.55);z-index:3000;display:flex;align-items:center;justify-content:center;padding:16px;animation:280ms ease-out both tutorialIn}.tutorial-overlay.out{animation:320ms ease-in forwards tutorialOut;pointer-events:none}@keyframes tutorialIn{0%{opacity:0}100%{opacity:1}}@keyframes tutorialOut{0%{opacity:1}100%{opacity:0}}.tutorial-card{background:var(--surface,#fffaf2);border:3px solid var(--ink,#4a4a4a);box-shadow:0 6px 0 0 var(--ink,#4a4a4a);padding:clamp(12px,4vw,22px);width:100%;max-width:min(92vw,360px);max-height:min(90svh,540px);overflow-y:auto;text-align:center;font-family:var(--font-display, PressStart2P, PixelifySans, system-ui, sans-serif);color:var(--ink,#4a4a4a);position:relative}.tutorial-prompt{font-size:clamp(9px, 2.6vw, 11px);line-height:1.45;min-height:32px;margin-bottom:clamp(10px,3vw,16px);margin-top:clamp(32px,8vw,44px);letter-spacing:.3px;text-align:center}.tutorial-grid-wrap{position:relative;display:inline-grid;grid-template-columns:clamp(20px,6vw,28px) auto;grid-template-rows:clamp(20px,6vw,28px) auto;gap:clamp(3px,1vw,6px);margin:0 auto clamp(8px,2.4vw,12px);--tut-cell:min(14vw, calc(var(--container-h, 100vh) * 0.085), 56px);--tut-gap:clamp(2px, 0.8vw, 4px)}.tutorial-grid-wrap .tutorial-col-clues{grid-column:2;grid-row:1;display:grid;grid-template-columns:repeat(3,var(--tut-cell));gap:var(--tut-gap)}.tutorial-grid-wrap .tutorial-row-clues{grid-column:1;grid-row:2;display:grid;grid-template-rows:repeat(3,var(--tut-cell));gap:var(--tut-gap)}.tutorial-clue{font-size:clamp(10px, 3vw, 13px);color:var(--ink,#4a4a4a);display:flex;align-items:center;justify-content:center}.tutorial-grid{grid-column:2;grid-row:2;display:grid;grid-template-columns:repeat(3,var(--tut-cell));grid-template-rows:repeat(3,var(--tut-cell));gap:var(--tut-gap)}.tutorial-cell{background:#f5f5f5;border:2px solid var(--ink,#4a4a4a);cursor:pointer;padding:0;transition:background 120ms,transform 120ms}.tutorial-cell.target{animation:1.1s ease-in-out infinite tutorialTargetPulse}.tutorial-cell.filled{background:#5d4037;animation:240ms cubic-bezier(.34,1.56,.64,1) both tutorialFillPop}.tutorial-cell.wrong{animation:280ms ease-in-out tutorialWrongShake}@keyframes tutorialTargetPulse{0%,100%{background:#fff3e0;box-shadow:0 0 0 0 rgba(255,183,77,.6)}50%{background:#ffe0b2;box-shadow:0 0 0 6px rgba(255,183,77,0)}}@keyframes tutorialFillPop{0%{transform:scale(.5)}60%{transform:scale(1.12)}100%{transform:scale(1)}}@keyframes tutorialWrongShake{0%,100%{transform:translateX(0);background:#ffcdd2}25%{transform:translateX(-3px)}75%{transform:translateX(3px)}}.tutorial-pointer{position:absolute;left:-9999px;top:0;font-size:clamp(15px, 4.8vw, 24px);opacity:.85;pointer-events:none;transition:left .2s,top .2s}.tutorial-steps{display:flex;gap:6px;justify-content:center;margin-top:6px}.tutorial-step-dot{width:8px;height:8px;background:#e0e0e0;border:1px solid var(--ink,#4a4a4a);border-radius:0}.tutorial-step-dot.done{background:#5d4037}.tutorial-step-dot.current{background:#ffb74d}.tutorial-skip{position:absolute;top:8px;right:8px;padding:6px 10px;font-family:inherit;font-size:10px;color:var(--ink,#4a4a4a);background:0 0;border:1px solid var(--ink,#4a4a4a);cursor:pointer;opacity:0;pointer-events:none;transition:opacity 240ms}.tutorial-skip.visible{opacity:1;pointer-events:auto}.btn-feature{flex:1;min-width:0;display:flex;flex-direction:column;align-items:center;gap:4px;padding:12px 8px;border:2px solid var(--ink);box-shadow:var(--shadow-sm);cursor:pointer;position:relative;transition:transform 80ms steps(2),box-shadow 80ms steps(2)}.btn-daily{background:var(--btn-daily-bg);color:var(--btn-daily-color)}.btn-weekly{background:var(--btn-weekly-bg);color:var(--btn-weekly-color)}.btn-feature:active{transform:translate(2px,2px);box-shadow:0 0 0 0 var(--ink)}.feature-icon{font-size:24px}.feature-label{font-family:var(--font-display);font-size:9px;text-align:center;line-height:1.4;overflow-wrap:break-word;max-width:100%}.feature-badge{font-family:var(--font-numeric);font-size:11px;opacity:.8}.feature-check{position:absolute;top:-6px;right:-6px;background:var(--good);color:#fff;border:2px solid var(--ink);width:20px;height:20px;font-family:var(--font-display);font-size:9px;display:flex;align-items:center;justify-content:center}.weekly-dots{display:flex;gap:3px;margin-top:4px}.weekly-dots .dot{width:8px;height:8px;background:var(--weekly-dot-empty);border:1px solid var(--ink)}.weekly-dots .dot.filled{background:var(--weekly-dot-active)}.weekly-dots .dot.today{background:0 0;box-shadow:inset 0 0 0 2px var(--weekly-dot-active)}.settings-content{padding:20px;max-height:100%;overflow-y:auto}.settings-header{display:flex;align-items:center;gap:12px;margin-bottom:20px}.settings-header h2{font-family:var(--font-display);font-size:16px;color:var(--accent);text-shadow:2px 2px 0 var(--ink)}.post-game-reward{display:flex;align-items:center;justify-content:center;gap:6px;margin:12px 0;animation:.5s rewardPop}.reward-text{font-family:var(--font-numeric);font-size:26px;color:var(--accent-2);text-shadow:3px 3px 0 var(--ink)}.post-game-reward .coin-icon{width:32px;height:32px;min-width:32px;min-height:32px;vertical-align:-.35em}.post-game-reward .coin-icon::after{font-size:18px}@keyframes rewardPop{0%{transform:scale(.4);opacity:0}33%{transform:scale(1.3);opacity:1}66%{transform:scale(.95)}100%{transform:scale(1);opacity:1}}.btn-cost{font-family:var(--font-numeric);font-size:11px;opacity:.85;margin-left:4px}.coins-overlay-content{text-align:center}.coins-overlay-content h2{text-shadow:none}.coins-overlay-icon{font-size:48px;margin-bottom:8px}.coins-overlay-hint{font-family:var(--font-body);font-size:13px;color:var(--text-muted);margin-top:8px}.cost-notice{font-family:var(--font-display);font-size:11px;color:var(--accent);margin:8px 0}.coin-display-global{position:absolute;top:calc(14px + env(safe-area-inset-top,0px));inset-inline-end:calc(14px + env(safe-area-inset-right,0px));display:flex;align-items:center;gap:6px;background:var(--surface);border:2px solid var(--ink);box-shadow:var(--shadow-sm);padding:4px 10px;font-family:var(--font-numeric);font-size:14px;color:var(--ink);z-index:50;transition:transform .2s steps(2)}.timer-display-global{position:absolute;top:calc(14px + env(safe-area-inset-top,0px));inset-inline-start:calc(14px + env(safe-area-inset-left,0px));display:none;align-items:center;background:var(--surface);border:2px solid var(--ink);box-shadow:var(--shadow-sm);padding:4px 10px;font-family:var(--font-numeric);font-size:14px;color:var(--ink);z-index:50;font-variant-numeric:tabular-nums;min-width:44px}body.in-gameplay .timer-display-global{display:flex}.timer-display-global #timer-value{min-width:36px;text-align:left}.coin-display-global .coin-icon{width:16px;height:16px;min-width:16px;min-height:16px}.coin-display-global .coin-icon::after{font-size:10px}.coin-display-global.pulse{animation:.4s coinPulse}@keyframes coinPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.25)}}.coin-fly{position:fixed;font-family:var(--font-numeric);font-size:18px;color:var(--accent-2);text-shadow:2px 2px 0 var(--ink);z-index:4000;pointer-events:none;display:flex;align-items:center;gap:4px;animation:.9s cubic-bezier(.22,1,.36,1) forwards coinFlyUp}.coin-fly .coin-icon{width:18px;height:18px;min-width:18px;min-height:18px}@keyframes coinFlyUp{0%{transform:translateX(-50%) translateY(14px) scale(.6);opacity:0}20%{transform:translateX(-50%) translateY(0) scale(1.1);opacity:1}70%{transform:translateX(-50%) translateY(-4px) scale(1);opacity:1}100%{transform:translateX(-50%) translateY(-20px) scale(.7);opacity:0}}.star-bar{position:relative;width:180px;height:20px;background:var(--bg);border:2px solid var(--ink);overflow:hidden;pointer-events:auto}.star-bar-fill{position:absolute;top:0;bottom:0;left:0;width:calc(100% - 8px);background:var(--accent-2);transition:width .45s}.star-markers{position:absolute;top:0;left:4px;right:4px;bottom:0;pointer-events:none;z-index:1}.star-marker{position:absolute;top:50%;transform:translate(-50%,-50%);font-family:PixelifySans,system-ui,sans-serif;font-size:14px;line-height:1;color:var(--ink);text-shadow:1px 1px 0 var(--accent-2);transition:color .2s steps(2),transform .2s steps(2)}.star-marker.lost{color:var(--surface);text-shadow:1px 1px 0 var(--ink);transform:translate(-50%,-50%) scale(.85)}.star-marker.just-lost{animation:.5s starLost}@keyframes starLost{0%{transform:translate(-50%,-50%) scale(1);color:var(--accent-2)}35%{transform:translate(-50%,-50%) scale(1.4);color:#fff;filter:drop-shadow(0 0 4px #fff)}100%{transform:translate(-50%,-50%) scale(.85);color:var(--surface);filter:none}}.hint-cost{display:flex;align-items:center;justify-content:center;gap:2px;font-family:var(--font-numeric);font-size:11px;line-height:1;color:var(--ink)}.hint-cost .coin-icon,.hint-cost .coin-icon.small{width:11px;height:11px;min-width:11px;min-height:11px;border-width:1px;vertical-align:0}.hint-cost .coin-icon.small::after,.hint-cost .coin-icon::after{font-size:7px}.hint-cost.hidden{display:none}body.tuutap-build .coin-display-global,body.tuutap-build .cost-notice,body.tuutap-build .feature-buttons,body.tuutap-build .volume-btn{display:none!important}.pause-icon-info,body.tuutap-build #pause-btn .pause-icon-default{display:none}body.tuutap-build #pause-btn .pause-icon-info{display:inline-flex}[data-theme=dark] .star-marker.lost{color:#fff}@media (max-height:700px){:root{--logo-width:75%;--preview-size:160px}.main-menu-logo{margin-top:24px}}@media (max-height:572px){:root{--logo-width:70%;--preview-size:130px}.main-menu-logo{margin-top:12px;margin-bottom:4px}.post-game-content{gap:8px;padding:10px 16px}.post-game-content h1{font-size:14px}.post-game-stars{font-size:22px;gap:8px}.post-stat-value{font-size:16px}.feature-buttons{flex-direction:column;gap:8px}.btn-feature{flex-direction:row;align-items:center;justify-content:flex-start;gap:6px;padding:6px 14px 6px 8px;text-align:left}.btn-feature .feature-icon{display:none}.feature-label{text-align:left;flex:1;min-width:0;overflow-wrap:anywhere}.feature-badge{flex-shrink:0}.weekly-dots{display:none}.main-menu-buttons{gap:10px}.btn-play{padding:12px 20px;font-size:14px}}@media (max-height:572px) and (orientation:landscape){.game-logo-img{aspect-ratio:3/1;height:auto;object-fit:cover;object-position:center bottom}}@media (max-height:420px) and (orientation:portrait){.game-logo-img{aspect-ratio:3/1;height:auto;object-fit:cover;object-position:center bottom}}@media (max-height:472px){:root{--logo-width:60%;--preview-size:100px}.main-menu-logo{margin-top:8px;margin-bottom:0}.post-game-content{gap:8px;padding:8px 16px}.post-game-content h1{font-size:12px}.post-game-stars{font-size:18px;gap:6px}.post-stat-value{font-size:14px}.post-stat-label{font-size:9px}.post-game-stats{gap:20px}.post-game-name{font-size:13px}.post-game-actions .btn-icon{min-height:44px;padding:6px 4px}.btn-icon-svg{width:22px;height:22px}}@media (max-height:572px) and (orientation:portrait){:root{--logo-width:55%}}@media (max-height:472px) and (orientation:portrait){:root{--logo-width:45%}}@media (max-height:420px){.post-game-preview{display:none}}@media (max-height:360px){.post-game-content{gap:6px;padding:6px 12px}.post-game-content h1{font-size:11px}.post-game-stars{font-size:16px;gap:4px}.post-game-name{display:none}}.rotate-overlay{display:none}html.device-landscape .rotate-overlay{display:flex;position:fixed;inset:0;align-items:center;justify-content:center;background:var(--bg,#fffaf2);z-index:9999}html.device-landscape #celebration-canvas,html.device-landscape #layout-container,html.device-landscape #top-bar,html.device-landscape .overlay{display:none!important}[data-theme=dark] html.device-landscape .rotate-overlay{background:#1a1a2e}.rotate-icon{width:min(40vw,160px);height:min(40vw,160px);background-color:var(--ink,#5d4037);-webkit-mask:url('../assets/images/rotate-device.svg') center/contain no-repeat;mask:url('../assets/images/rotate-device.svg') center/contain no-repeat}[data-theme=dark] .rotate-icon{background-color:#d7ccc8}html.landscape-mode #layout-container{aspect-ratio:auto;width:min(100vw,max(calc(100svh * 9 / 16),520px));max-width:100vw;height:100vh;height:100svh;max-height:100vh;max-height:100svh}html.landscape-mode body.in-gameplay #layout-container{max-width:100vw;width:100vw;height:calc(100vh - var(--top-bar-h));height:calc(100svh - var(--top-bar-h));max-height:calc(100vh - var(--top-bar-h));max-height:calc(100svh - var(--top-bar-h));margin-top:var(--top-bar-h);aspect-ratio:auto}html.landscape-mode body.in-gameplay{--panel-w:clamp(140px, 22vw, 220px);--gameplay-board:min(
        calc(100svh - var(--top-bar-h) - 24px),
        calc(100vw - var(--panel-w) - 48px),
        720px
    )}html.landscape-mode body.in-gameplay #gameplay-screen{padding-top:8px}html.landscape-mode body.in-gameplay .game-content{display:grid;grid-template-columns:var(--gameplay-board) var(--panel-w);grid-template-areas:"board panel";column-gap:24px;justify-content:center;align-content:center;height:100%;padding:8px;overflow:hidden}html.landscape-mode body.in-gameplay .game-canvas{grid-area:board;width:var(--gameplay-board);height:var(--gameplay-board);max-width:none}html.landscape-mode body.in-gameplay .game-controls{grid-area:panel;flex-direction:column;justify-content:center;align-items:stretch;margin-top:0}html.landscape-mode body.in-gameplay .btn-mode-toggle{padding:16px 8px;font-size:clamp(9px, calc(var(--panel-w) / 16), 14px);min-width:0;width:100%;max-width:100%;box-sizing:border-box;flex:0 0 auto}html.landscape-mode body.in-gameplay .board-zoom-btn{flex:0 0 auto;width:100%;min-height:52px}@media (orientation:landscape) and (max-height:400px){html.landscape-mode body.in-gameplay{--top-bar-h:28px;--panel-w:clamp(56px, 20vw, 110px)}html.landscape-mode body.in-gameplay .top-bar{padding:0 4px}html.landscape-mode body.in-gameplay .top-bar-btn{padding:2px}html.landscape-mode body.in-gameplay .top-bar-btn svg{width:14px;height:14px}html.landscape-mode body.in-gameplay .mistakes-display{font-size:10px;gap:2px}html.landscape-mode body.in-gameplay .mistakes-display svg{width:10px;height:10px}html.landscape-mode body.in-gameplay .hint-btn{flex-direction:row;align-items:center;gap:3px;min-width:0;padding:2px 4px}html.landscape-mode body.in-gameplay .hint-cost{font-size:8px}html.landscape-mode body.in-gameplay .coin-icon.small{width:8px;height:8px;min-width:8px;min-height:8px}html.landscape-mode body.in-gameplay .star-bar{transform:scale(.7)}html.landscape-mode body.in-gameplay #gameplay-screen{padding-top:20px}html.landscape-mode body.in-gameplay .game-content{column-gap:8px;padding:2px 4px}html.landscape-mode body.in-gameplay .btn-mode-toggle{min-width:0;width:100%;padding:6px 2px;font-size:8px;border-width:2px}html.landscape-mode body.in-gameplay .board-zoom-btn{min-width:0;min-height:26px;font-size:8px;border-width:2px}html.landscape-mode body.in-gameplay .game-controls{gap:4px}html.landscape-mode body.in-gameplay .coin-display-global,html.landscape-mode body.in-gameplay .timer-display-global{transform:scale(.75);transform-origin:top right}html.landscape-mode body.in-gameplay .timer-display-global{transform-origin:top left}html.landscape-mode body:not(.in-gameplay){--logo-width:35%}html.landscape-mode body:not(.in-gameplay) .main-menu-logo{margin-top:2px;margin-bottom:2px}html.landscape-mode body:not(.in-gameplay) .btn-play{padding:8px 12px;font-size:11px}html.landscape-mode body:not(.in-gameplay) .main-menu-buttons{gap:6px;max-width:240px}html.landscape-mode body:not(.in-gameplay) .feature-buttons{gap:5px}html.landscape-mode body:not(.in-gameplay) .btn-feature{padding:4px 10px 4px 6px;border-width:2px}html.landscape-mode body:not(.in-gameplay) .feature-label{font-size:9px}html.landscape-mode body:not(.in-gameplay) .feature-badge{font-size:8px}html.landscape-mode body:not(.in-gameplay) .main-menu-top{padding:2px 4px}html.landscape-mode body:not(.in-gameplay) .menu-icon-btn{padding:2px}html.landscape-mode body:not(.in-gameplay) .menu-icon-btn svg{width:16px;height:16px}html.landscape-mode .overlay-content,html.landscape-mode body:not(.in-gameplay) .settings-content{padding:8px 12px;gap:6px;max-height:calc(100svh - 16px);overflow-y:auto}html.landscape-mode .overlay-content h2{font-size:13px;margin-bottom:4px}html.landscape-mode .overlay-content .btn{padding:6px 12px;font-size:10px;min-height:0;border-width:2px}}