:root{color-scheme:light;--ink:#245563;--dim:#5d828b;--aqua:#209eb2;--gold:#ffe18a;--disk-wall:8;--toy-ratio:2.40137}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#def2f4;color:var(--ink);font-family:ui-rounded,'Trebuchet MS',system-ui,sans-serif}button,select{font:inherit}button{cursor:pointer;touch-action:manipulation}button:disabled{cursor:default}button:focus-visible,select:focus-visible,.tower:focus-visible{outline:3px solid #177c99;outline-offset:3px}[hidden]{display:none!important}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.app{--app-top:4px;--app-side:14px;--app-bottom:12px;height:100dvh;width:100%;max-width:1800px;margin:auto;padding:max(var(--app-top),env(safe-area-inset-top)) max(var(--app-side),env(safe-area-inset-right)) max(var(--app-bottom),env(safe-area-inset-bottom)) max(var(--app-side),env(safe-area-inset-left));display:grid;grid-template-rows:60px minmax(0,1fr);gap:7px}.top{display:flex;align-items:center;gap:14px;min-width:0}.brand{display:block;width:110px;flex-shrink:0;line-height:0}.brand img{width:100%;height:auto;max-height:59px;object-fit:contain}.top>[data-level-map]{margin-left:auto;min-width:0}.topright{display:flex;gap:8px}.iconbtn{width:44px;height:44px;padding:8px;border:1px solid #bfdee5;border-radius:14px;background:#fffffff0;box-shadow:0 3px 0 #accfd7;display:grid;place-items:center;color:#348a9d}.iconbtn img,.iconbtn svg{display:block;width:27px;height:27px;object-fit:contain}.play-screen{min-height:0;position:relative}.gameShell{height:100%;position:relative;border:2px solid #fff;border-radius:26px;overflow:hidden;background:#70cfeb url('assets/art/coastal-stage.webp') center/cover no-repeat;box-shadow:0 4px 0 #aacdd4}.gameShell::before{content:'';position:absolute;inset:0;background:linear-gradient(#e9fcff2e,transparent 25%,transparent 70%,#fff2c622);pointer-events:none}
.toolbar{position:absolute;z-index:7;left:16px;right:16px;top:13px;display:flex;justify-content:space-between;align-items:center;gap:12px;pointer-events:none}.level,.stats{pointer-events:auto;background:#fffef0ed;border:1px solid #fff;border-radius:14px;box-shadow:0 3px 10px #1e718d20}.level{padding:6px 10px}.level label{display:block;font-size:8px;font-weight:900;letter-spacing:1.3px;color:#6394a1;margin-bottom:2px}.level select{max-width:100%;min-height:44px;border:0;background:transparent;color:#2e7186;font-weight:900;font-size:13px;padding:0 18px 0 0}.stats{display:flex;padding:6px 5px;gap:0}.stat{min-width:75px;padding:0 12px;text-align:center;border-left:1px solid #cadfdf}.stat:first-child{border-left:0}.stat small{display:block;font-size:8px;font-weight:900;letter-spacing:1px;color:#5f919f}.stat strong{display:block;margin-top:2px;font-size:22px;font-weight:900;line-height:1.15;font-variant-numeric:tabular-nums}
.board{position:absolute;inset:0;isolation:isolate;overflow:hidden;container-type:size}.board-heading{position:absolute;z-index:4;top:82px;left:18px;right:18px;display:flex;align-items:center;justify-content:space-between;gap:8px;pointer-events:none}.goal-label{background:#fffdf0df;border:1px solid #fff;padding:6px 11px;border-radius:20px;color:#4a8190;font-size:12px;box-shadow:0 2px 8px #367d8a18}.goal-label b{color:#256d83}.goal-meta{display:flex;gap:9px;align-items:center;padding:5px 9px;background:#fffdf0e8;border:1px solid #fff;border-radius:20px}#levelStars{display:flex;gap:1px}#goalCount{padding:3px 7px;background:#d9f2ee;border:1px solid #a4d7d7;border-radius:12px;font-size:11px;font-weight:900;white-space:nowrap}.goal-progress{position:absolute;z-index:4;top:126px;right:23px;width:107px;height:4px;overflow:hidden;border-radius:4px;background:#f9fff8b3;pointer-events:none}.goal-progress span{display:block;height:100%;width:0;background:linear-gradient(90deg,#57cec8,#fff080);transition:width .2s}.star-sprite{display:block;width:26px;height:26px;object-fit:contain;opacity:.38;filter:grayscale(1)}.star-sprite.earned{opacity:1;filter:none}
.toy-object{position:absolute;z-index:2;left:50%;top:calc(50% + 18px);width:min(96cqw,calc((100cqh - 205px) * var(--toy-ratio)));aspect-ratio:var(--toy-ratio);transform:translate(-50%,-50%);container-type:size}.toy-board-art{position:absolute;display:block;inset:0;width:100%;height:100%;pointer-events:none;filter:drop-shadow(0 13px 9px #5e391f44)}.toy-board-art svg{overflow:hidden}.towers{position:absolute;inset:0 4.6% 0 4.5%;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;height:100%;margin:0;padding:0;touch-action:none}.tower{position:relative;container-type:inline-size;min-width:0;min-height:0;padding:0;border:1px solid transparent;border-radius:18px;cursor:grab;background:none;color:var(--ink);touch-action:none}.tower:active{cursor:grabbing}.post{display:none}.diskstack{position:absolute;bottom:30.53cqw;left:0;right:0;height:0;overflow:visible;pointer-events:none}.disk{position:absolute;left:50%;bottom:calc(var(--stack-rise) * 1cqw);height:calc(var(--disk-wall) * 1cqw + var(--diameter) * .17cqw);max-width:98%;transform:translateX(-50%);pointer-events:none;filter:drop-shadow(0 2px 1px #4b33182b)}.disk::before{content:'';position:absolute;inset:0;background:url('assets/art/disk-coral.webp') center/100% 100% no-repeat;filter:hue-rotate(var(--disk-hue,0deg)) brightness(1.06) saturate(1.05);mask-image:var(--peg-opening);mask-size:100% 100%;mask-repeat:no-repeat}.disk[data-size="1"]::before{background-image:url('assets/art/open-cyan-disk.webp');filter:none}.disk::after{content:'';position:absolute;left:50%;top:34%;width:21cqw;height:5.6cqw;transform:translate(-50%,-50%);border-bottom:1px solid #17434355;border-radius:50%;pointer-events:none}.disk span{position:absolute;top:68%;left:50%;transform:translate(-50%,-50%);font-size:clamp(9px,4cqw,17px);line-height:1;font-weight:900;color:#fff;text-shadow:0 1px 2px #30444799}.towerName{position:absolute;bottom:10cqw;left:50%;transform:translateX(-50%);font-weight:900;font-size:clamp(10px,3.5cqw,15px);letter-spacing:.7px;white-space:nowrap;color:#fff6d1;text-shadow:0 1px 2px #824811;pointer-events:none}.towerName.goal{color:#fff7a9}.platform{position:absolute;left:0;right:0;bottom:9.25cqw;height:0;pointer-events:none}
.tower.selected{border-color:#d1fff1;background:#ddfff322;box-shadow:inset 0 0 20px #ffffde33}.tower.selected .disk:last-child{transform:translate(-50%,-8cqw);filter:drop-shadow(0 3px 4px #fff5b1)}.tower.valid{border:1px dashed #d7ffb2;background:#eaffc71a}.tower.hint-target{border:2px solid #fff09b;background:#fff7c326}.tower.drop-hover{border:2px solid #b9ffcd;background:#deffb83d;box-shadow:inset 0 0 22px #e2ffcb55}.tower.drop-blocked{border:2px solid #ffb1a0;background:#ff877c33}.tower.selected::after,.tower.valid::after,.tower.hint-target::after{position:absolute;top:1%;left:50%;transform:translateX(-50%);padding:5px 8px;border:1px solid #8fcab9;border-radius:8px;background:#f2ffed;color:#2d7a66;font-size:10px;font-weight:900;white-space:nowrap;pointer-events:none}.tower.selected::after{content:'SEÇİLDİ'}.tower.valid::after{content:'BURAYA TAŞI'}.tower.hint-target::after{content:'İPUCU HEDEFİ';background:#fff7c1;border-color:#edce70;color:#8a681e}.toy-object.moving{z-index:5}.disk.in-flight::before,.disk.pointer-dragged::before{mask-image:var(--free-opening)}.disk.pointer-dragged{z-index:20!important;filter:drop-shadow(0 8px 5px #56381955)}
#board[data-disks="7"] .disk,#board[data-disks="8"] .disk{height:calc(var(--disk-wall) * 1cqw + var(--diameter) * .16cqw)}
#message{position:absolute;z-index:6;bottom:91px;left:50%;transform:translateX(-50%);width:max-content;max-width:calc(100% - 30px);padding:7px 13px;border:1px solid #fff9;border-radius:18px;background:#ffffe8df;box-shadow:0 2px 8px #4a728022;color:#3e7684;text-align:center;font-size:12px;font-weight:800;line-height:1.4;pointer-events:none}#message[data-tone="error"]{background:#fff0e9f2;color:#ac3b3e;border-color:#efb5a3}#message[data-tone="hint"]{background:#fff7c6f2;color:#8f6b1d}#message[data-tone="success"]{background:#e7ffdef2;color:#32836a}.below{position:absolute;z-index:7;bottom:10px;left:12px;right:12px;display:flex;flex-direction:column;align-items:center;gap:5px;pointer-events:none}.controls{display:flex;justify-content:center;gap:9px;pointer-events:auto}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:9px 16px;border:1px solid #c5dfdf;border-radius:15px;background:linear-gradient(#fcfff1,#dff6f2);box-shadow:0 4px 0 #9fcbd0;color:#427781;font-size:13px;font-weight:900;touch-action:manipulation}.btn::before{content:'';flex:0 0 27px;width:27px;height:27px;background:center/contain no-repeat}.btn:hover:not(:disabled){filter:brightness(1.04)}.btn:active:not(:disabled){transform:translateY(3px);box-shadow:0 1px 0 #9fcbd0}.btn:disabled{opacity:.45;filter:grayscale(.5)}#undoBtn::before{background-image:url('assets/art/undo.webp')}#hintBtn::before{background-image:url('assets/art/hint.webp')}#resetBtn::before,#retryBtn::before{background-image:url('assets/art/restart.webp')}#solveBtn::before,#resumeBtn::before,#nextBtn::before{background-image:url('assets/art/play.webp')}#stopSolveBtn::before{background-image:url('assets/art/pause.webp')}#soundBtn::before{background-image:url('assets/art/sound.webp')}#soundBtn[data-muted="true"]::before{opacity:.35}#recordsBtn::before{background-image:url('assets/art/reward-star.webp')}#modalClose::before{background-image:url('assets/art/undo.webp')}.hint-button,.btn.primary{background:linear-gradient(#fff7ba,#ffdd70);color:#8b6420;border-color:#edca6b;box-shadow:0 4px 0 #cba64b}.help-button::before,#rulesMenuBtn::before{display:none}.help-button>span{display:grid;place-items:center;width:27px;height:27px;background:#41b4c8;color:#fff;border-radius:50%;font-size:20px;line-height:1}.stop-button{background:#fff3bd}.legend{font-size:9px;font-weight:800;color:#376d7c;background:#f7fff1ba;border-radius:8px;padding:2px 7px}.legend strong{color:#a37c28}.gameShell[data-demo="true"] .controls>button:not(#stopSolveBtn){display:none}
dialog{width:min(500px,calc(100vw - 24px));max-height:calc(100dvh - 24px);padding:0;border:2px solid #b4dad6;border-radius:24px;color:var(--ink);background:#fffdf0;overflow:auto;box-shadow:0 22px 80px #174d6066}dialog::backdrop{background:#12495e88;backdrop-filter:blur(6px)}.modalPanel{padding:23px}.panel-heading{display:flex;align-items:center;gap:12px;margin-bottom:20px}.panel-heading h2{margin:0;font-size:23px;color:#39899a}.close-btn{flex-shrink:0;margin-left:auto;display:grid;place-items:center;width:44px;height:44px;border:1px solid #b9dddd;background:#e7f6ee;color:#5d8f93;border-radius:50%;font-size:25px}.menu-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.menu-grid .btn{font-size:12px;padding:9px;min-height:58px}.menu-grid #resumeBtn{grid-column:1/-1;min-height:54px}.rules{padding-left:22px;color:#507d88;font-size:15px;line-height:1.65}.rules li+li{margin-top:12px}.rules b{color:#276e83}.keyboard-help{font-size:11px;line-height:2;color:#6f969e}kbd{padding:2px 5px;border:1px solid #c2dedc;border-bottom-width:2px;border-radius:5px;background:#eef8f1;font:11px system-ui}footer{font-size:10px;line-height:1.6;color:#80a1a7;text-align:center;margin-top:20px}.recordgrid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.recordgrid>div,.result-stats>div{padding:12px;border:1px solid #d7e8df;border-radius:12px;background:#eef8f1}.recordgrid small,.career-summary small{display:block;font-size:9px;color:#73a0a6;font-weight:900;letter-spacing:.7px}.recordgrid strong{display:block;font-size:25px;margin-top:6px;color:#c29839}#recordDesc,.modalPanel p{color:#69949d;font-size:13px;line-height:1.6}.career-summary{display:flex;justify-content:space-between;align-items:center;margin-top:18px;padding-top:15px;border-top:1px solid #d6e7df;gap:12px}.career-summary strong{display:block;font-size:23px;color:#b68c34;margin-top:6px}.career-summary>span{font-size:11px;color:#77a0a5}.level-awards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:16px}.award-level{min-height:64px;padding:9px 4px;border:1px solid #cae2d9;border-radius:12px;color:#779a9f;background:#f3f9f0}.award-level.current{border:2px solid #dfc165;background:#fff0b7}.award-level b{display:block;font-size:12px}.small-stars{display:flex;justify-content:center;margin-top:5px;gap:1px}.small-stars .star-sprite{width:19px;height:19px}.star-rules{margin-top:18px;color:#7c9d9e;font-size:12px}.star-rules b{color:#ad8a35}.result-dialog{text-align:center}.result-kicker{font-size:10px;font-weight:900;letter-spacing:2px;color:#79a6ad}.result-stars{display:flex;justify-content:center;gap:8px;margin:22px 0}.result-stars .star-sprite{width:60px;height:60px}.result-stars .earned:nth-child(2){transform:translateY(-7px) scale(1.12)}.result-dialog h2{font-size:27px;color:#35889c;margin:12px 0}.result-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.result-stats small{display:block;font-size:9px;color:#80a2a6;font-weight:900}.result-stats b{display:block;font-size:21px;color:#599199;margin-top:6px}.modalBtns{display:grid;grid-template-columns:1fr 1fr;gap:11px;margin-top:20px}.modalBtns .btn{font-size:11px;padding:9px}.modalBtns #nextBtn{grid-column:1/-1}
@media(max-width:760px) and (min-height:560px){:root{--toy-ratio:1.35}.toy-object{width:min(96cqw,calc((100cqh - 200px) * var(--toy-ratio)));top:calc(50% + 24px)}}
@media(max-width:760px){.app{--app-top:3px;--app-side:5px;--app-bottom:7px;grid-template-rows:52px minmax(0,1fr);gap:5px}.top{gap:7px;padding-inline:4px}.brand{width:88px}.brand img{max-height:48px}.topright{gap:6px}.iconbtn{border-radius:12px}.gameShell{border-radius:20px}.toolbar{left:10px;right:10px;top:10px;gap:7px}.level{padding:5px 7px;max-width:47%}.level label{font-size:7px}.level select{font-size:11px;min-height:44px;padding-right:12px}.stats{padding:6px 2px}.stat{min-width:49px;padding:0 6px}.stat small{font-size:7px;letter-spacing:.3px}.stat strong{font-size:18px}.board-heading{top:78px;left:11px;right:11px}.goal-label{font-size:10px;padding:5px 8px}.goal-meta{gap:4px;padding:4px 5px}.star-sprite{width:23px;height:23px}#goalCount{font-size:10px;padding:3px 5px}.goal-progress{top:117px;right:18px;width:98px}.tower{border-radius:12px}.tower.selected::after,.tower.valid::after,.tower.hint-target::after{font-size:8px;padding:4px;top:1%}.disk span{font-size:clamp(9px,4cqw,12px)}.towerName{font-size:10px;letter-spacing:0}#message{bottom:89px;font-size:11px;padding:6px 9px;max-width:calc(100% - 22px)}.below{left:8px;right:8px;bottom:9px}.controls{gap:8px}.controls .btn{min-height:49px;padding:8px 14px;font-size:12px}.controls .btn::before{width:25px;height:25px;flex-basis:25px}.legend{font-size:8px}.modalPanel{padding:20px 16px}.menu-grid .btn{font-size:11px}.result-stars .star-sprite{width:53px;height:53px}}
@media(max-width:370px){.brand{width:68px}.top{gap:4px}.topright{gap:5px}.toolbar{left:8px;right:8px;gap:4px}.level{padding:5px}.level select{font-size:10px}.stat{min-width:43px;padding:0 4px}.stat strong{font-size:16px}.controls .btn{padding:8px 10px}.towerName{font-size:9px}}
@media(max-height:560px){:root{--toy-ratio:2.40137}.app{--app-top:0px;--app-side:6px;--app-bottom:5px;grid-template-rows:48px minmax(0,1fr);gap:3px}.brand{width:76px}.brand img{max-height:42px}.iconbtn{width:44px;height:44px;min-height:44px;padding:6px}.top{gap:8px}.toolbar{top:7px;left:10px;right:10px}.level{padding:3px 8px}.level label{display:none}.level select{min-height:44px;font-size:11px}.stats{padding:4px}.stat{min-width:61px}.stat small{font-size:7px}.stat strong{font-size:17px}.board-heading,.goal-progress{display:none}.toy-object{width:min(96cqw,calc((100cqh - 130px) * var(--toy-ratio)));top:calc(50% - 3px)}.below{bottom:6px;gap:3px}.controls .btn{min-height:44px;padding:5px 13px;font-size:11px}.controls .btn::before{width:23px;height:23px;flex-basis:23px}.legend{font-size:7px}#message{top:48px;bottom:auto;padding:4px 9px;font-size:10px}#message[data-tone=""]{opacity:0}.goal-meta{display:none}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}
