*{box-sizing:border-box}body{margin:0;background:linear-gradient(140deg,#dfefe6,#fff8e8);font-family:'Segoe UI',Arial,sans-serif;color:#084d59}button,select,input{font:inherit}button{cursor:pointer;border:0;border-radius:16px;padding:13px 20px;font-weight:750;color:#075762;background:#e6f4ef;min-height:48px}button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible{outline:4px solid #efae36;outline-offset:3px}button:disabled{cursor:default;opacity:.5}[hidden]{display:none!important}a{color:inherit;text-decoration:none}.app{max-width:1240px;margin:20px auto;padding:0 24px 20px;background:#fffdf4;border:1px solid #fff;border-radius:30px;box-shadow:0 18px 60px #1e655c19;overflow:hidden}header{display:flex;gap:15px;align-items:center;justify-content:space-between;padding:23px 0}header img{width:185px;max-width:40vw}.back{border:1px solid #c8dfd4;padding:11px 17px;border-radius:30px;font-weight:700}.intro{text-align:center;padding:12px 0 22px}.eyebrow{font-size:12px;font-weight:800;letter-spacing:3px;color:#809c87}h1{font-size:clamp(32px,5vw,54px);margin:5px 0}h2{margin:6px 0;font-size:27px}.intro p{margin:0 0 16px;color:#63877e}.rule{display:inline-block;background:#fff0cf;color:#975a08;border:1px solid #eec77c;padding:10px 25px;border-radius:16px;font-size:24px;font-weight:850}nav{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}nav button{display:flex;align-items:center;gap:12px;background:white;border:2px solid #e0e9dc;text-align:left;padding:10px;font-size:17px}nav button.active{border-color:#17a8a5;background:#e6f6f1}nav .thumb{width:62px;height:55px;border-radius:13px;flex-shrink:0;background-image:url('assets/length-worlds.png');background-size:200% 200%}.toolbar{display:flex;align-items:center;gap:15px;flex-wrap:wrap;margin:20px 0;font-size:14px}.toolbar label{font-weight:750}.toolbar select{padding:10px;border-radius:12px;border:1px solid #c8ded4;background:white;color:#175f66;margin-left:5px}#bank{margin-left:auto;color:#65857a}.game{border:1px solid #d5e7db;border-radius:26px;overflow:hidden;background:white}.game-top{display:flex;align-items:center;justify-content:space-between;padding:18px 24px}#step{color:#78968a;font-size:14px}#score{background:#fff3d4;border-radius:20px;padding:10px 16px;white-space:nowrap}.scene{position:relative;min-height:340px;padding:20px 25px;overflow:hidden}.scenery{position:absolute;inset:0;background-image:url('assets/length-worlds.png');background-size:200% 200%;opacity:.9}.scene.measure .scenery{background-position:0 0}.scene.build .scenery{background-position:100% 0}.scene.bridge .scenery{background-position:0 100%}.scene.shop .scenery{background-position:100% 100%}.task{position:relative;display:table;margin:0 auto 20px;border:1px solid #fff;border-radius:20px;background:#fffdf0ed;box-shadow:0 5px 25px #113c4415;padding:13px 24px;font-size:clamp(20px,3vw,29px);font-weight:850;text-align:center}.stage{position:relative;z-index:1;min-height:230px;display:flex;justify-content:center;align-items:center}.measure-board{width:100%;overflow:auto;background:#fffffff2;padding:15px 10px;border-radius:20px}.measure-board svg{display:block;width:100%;min-width:550px;height:auto;touch-action:pan-y}.ruler{cursor:grab}.work{padding:16px 24px 25px;text-align:center}#instruction{font-size:17px;color:#527e73;margin:4px 0 18px}#controls{display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap}#controls button{border:2px solid #d7e8de;background:white;min-width:90px;font-size:23px}#controls button.chosen{border-color:#079da1;background:#e4f6ed}#controls button.correct{border-color:#189b58;background:#e4f6e7}.unit-btn{touch-action:none}.unit-btn .sample{display:block;height:18px;width:25px;margin:0 auto 7px;border-radius:4px;background:linear-gradient(#43c9cc,#078f95)}.unit-btn .sample.dm{width:150px;background:repeating-linear-gradient(90deg,transparent 0 14px,#ffffff88 14px 15px),linear-gradient(#fbd689,#e4a243)}.build-board{width:min(100%,900px);background:#fffdf3e8;border-radius:20px;padding:20px;display:flex;flex-direction:column;gap:12px;min-height:190px;justify-content:center;border:2px dashed #c2d5c5}.block-row{display:grid;grid-template-columns:repeat(10,1fr);gap:0;width:min(100%,560px);margin:auto;height:32px}.cell{background:linear-gradient(#4bcbcb,#149da3);border:1px solid #067d8999;border-radius:3px;color:#fff;font-size:11px;display:flex;align-items:center;justify-content:center}.cell.empty{background:#f3f2e7;border:1px dashed #b9c6b9}.block-row.grouped .cell{background:linear-gradient(#f7d486,#dfaa48);border-color:#b9852a}.counts{font-size:20px;font-weight:800;color:#066e74;padding-top:5px}.drop-hint{color:#658277;font-size:16px}.bridge-deck{width:min(92%,950px);background:#ffffffd9;border-radius:20px;padding:22px 14px;align-self:flex-end}.bridge-line{height:70px;width:100%;display:flex;align-items:stretch;background:#4a919877;border:3px solid #f8e4b9;border-radius:10px;overflow:hidden}.plank{height:100%;background:repeating-linear-gradient(0deg,#c88c4f 0 8px,#dba66e 8px 10px);border:1px solid #70471c;color:#412e0d;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:14px;font-weight:900;white-space:nowrap}.plank.small{font-size:0;border-right:1px solid #885126}.bridge-marker{text-align:center;font-weight:850;color:#345a48;margin:8px 0}.scene.bridge.finished:after{content:'Жол ашылды!';position:absolute;right:15%;top:45%;padding:15px 25px;background:#fff7d4;color:#12815c;border-radius:20px;font-size:26px;font-weight:850;animation:pop .5s}.shop-bubble{background:#fffdf3ee;padding:24px 32px;border:3px solid #f3ca7e;border-radius:24px;box-shadow:0 8px 20px #214c4c22;margin-right:25%;font-size:clamp(23px,4vw,38px);font-weight:850;max-width:65%;text-align:center}.shop-bubble small{display:block;font-size:17px;font-weight:600;margin-top:10px}.number-answer{display:flex;gap:8px;align-items:center;font-size:24px;font-weight:800}.number-answer input{width:110px;border:2px solid #93c9bd;border-radius:12px;padding:12px;text-align:center;color:#075762}.ruler-control{width:100%;max-width:650px;background:#edf6ef;border-radius:15px;padding:12px}.ruler-control input{width:100%;accent-color:#0a999b}.ruler-control button{font-size:15px!important;min-height:40px}#feedback{min-height:32px;margin:18px 0 8px;font-size:20px;font-weight:750;color:#167d52}#feedback.error{color:#9b5d17}.actions{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}.primary{background:linear-gradient(#20bbbd,#058e94);color:white;box-shadow:0 5px 10px #118f8b22}.warm{background:#fff0d5;color:#b27217}.quiet{background:#edf4ee;color:#577b6c}#summary{background:#e8f7ee;border-radius:20px;padding:25px;margin-top:20px;font-size:23px}footer{text-align:center;color:#789287;font-size:12px;line-height:1.6;margin-top:20px}.celebrate{animation:pop .5s ease}@keyframes pop{50%{transform:scale(1.035)}}@media(max-width:700px){.app{margin:7px;padding:0 12px 18px;border-radius:22px}header{padding:16px 0;flex-wrap:wrap}header .quiet{display:none}nav{grid-template-columns:repeat(2,1fr)}nav button{font-size:15px;gap:8px}nav .thumb{width:47px;height:44px}.toolbar{gap:10px}#bank{width:100%;margin:0}.scene{padding:14px 10px;min-height:300px}.stage{min-height:200px}.game-top{padding:15px 13px}h2{font-size:22px}#score{font-size:13px;padding:10px}.work{padding:15px 10px 20px}.task{padding:10px 14px;font-size:21px}.shop-bubble{margin-right:10%;max-width:90%;padding:18px 20px}.actions button{flex:1}.build-board{padding:12px}.block-row{height:25px}.cell{font-size:9px}.unit-btn .sample.dm{width:100px}.bridge-deck{width:100%;padding:14px 8px}.bridge-line{height:60px}.scene.bridge.finished:after{right:10%;top:40%;font-size:23px}.intro{padding:5px 0 18px}.rule{font-size:20px}#controls button{font-size:20px;padding:12px}.scene .scenery{opacity:.8}}@media(prefers-reduced-motion:reduce){*{animation:none!important;scroll-behavior:auto!important}}