:root{font-family:ui-rounded,"SF Pro Rounded",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#432a1c;background:#fff4e8;font-synthesis:none;--gap:4px;--cell:40px;--green:linear-gradient(145deg,#b5d980 0%,#8fbe5c 42%,#6a9c3b 100%);--blue:linear-gradient(145deg,#88dcfa 0%,#47b7e7 42%,#2493c6 100%);--yellow:linear-gradient(145deg,#ffe979 0%,#ffd13c 42%,#efad18 100%);--coral:linear-gradient(145deg,#ffa27b 0%,#ef8057 42%,#d35c35 100%)}
*{box-sizing:border-box}body{margin:0;min-height:100svh;background:radial-gradient(ellipse at 50% 38%,#fffaf3 0%,#fff4e8 65%,#fcebdc 100%)}button{font:inherit;color:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}button:focus-visible{outline:3px solid #498ca0;outline-offset:5px}button:disabled{cursor:default}.game{width:min(100%,494px);min-height:100svh;margin:auto;padding: max(22px,env(safe-area-inset-top)) 19px max(14px,env(safe-area-inset-bottom));display:flex;flex-direction:column}header{display:flex;align-items:center;gap:19px;padding:12px 8px 0;flex-shrink:0}.soft-button{border:1px solid #fffaf5;background:linear-gradient(145deg,#fff3e5,#f6dfc6);box-shadow:0 3px 1px #c89e77,0 5px 8px #a46b4030,inset 0 1px 1px white;border-radius:15px}.pause{width:49px;height:49px;display:flex;align-items:center;justify-content:center;gap:6px;flex-shrink:0}.pause span{width:6px;height:21px;background:linear-gradient(#805634,#4e2d19);border-radius:3px;box-shadow:0 1px 0 #fff}.score-stat{display:flex;flex-direction:column;gap:1px}.label{font-size:10px;font-weight:800;letter-spacing:1.6px;color:#94775f}.score-stat strong{font-size:35px;line-height:1.05;letter-spacing:-1.5px;font-variant-numeric:tabular-nums}.best-stat{margin-left:auto;display:flex;align-items:center;gap:9px;padding-left:16px;border-left:1px solid #e8d3bd}.best-stat>div{display:flex;flex-direction:column;gap:4px}.best-stat strong{font-size:19px;line-height:1;font-variant-numeric:tabular-nums}.cup{width:27px;height:30px;fill:#e9a329;stroke:#ce8c20;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.play-area{flex:1;display:flex;flex-direction:column;justify-content:center}.message-space{height:86px;display:grid;place-items:center;position:relative}#hint{text-align:center;color:#a1856d;font-size:13px;line-height:1.55;margin:0;transition:opacity .3s}#hint.hidden{opacity:0}#toast{position:absolute;inset:0;display:grid;place-items:center;font-size:24px;font-weight:850;font-style:italic;pointer-events:none;opacity:0}#toast.show{animation:toast 1.4s ease both}.board-wrap{position:relative;width:100%;padding:9px;border-radius:25px;background:linear-gradient(145deg,#f8e2cf,#fff5e9);box-shadow:0 3px 2px #d4b597,0 7px 12px #b9885d22,inset 0 2px 1px white;border:1px solid #fff9f1}#board{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:var(--gap);aspect-ratio:1;touch-action:none}.cell{position:relative;border-radius:10px;background:linear-gradient(145deg,#f0dbc5,#fbeadb 68%,#fff1e4);box-shadow:inset 1px 2px 3px #aa7c4a48,inset -1px -1px 1px #fffaf3;min-width:0;min-height:0}.block{border-radius:9px;background:var(--green);box-shadow:inset 0 2px 2px #ffffffe0,inset 2px 0 2px #ffffff65,inset -2px -3px 3px #3a370d35,0 3px 2px #704b2e55,0 4px 5px #704b2e1f;border:1px solid #5e8b3c44}.color-1{background:var(--blue);border-color:#1b86b04a}.color-2{background:var(--yellow);border-color:#d99c244a}.color-3{background:var(--coral);border-color:#c65d3e4a}.cell .block{position:absolute;inset:0}.cell.preview::after{content:"";position:absolute;inset:0;background:#98c76680;border:2px solid #fffbd0;box-shadow:0 0 12px #acd67d;border-radius:9px}.cell.invalid::after{content:"";position:absolute;inset:1px;background:#e98a7555;border:2px solid #c95e48;border-radius:9px}.placed{animation:place .2s ease-out}#tray{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px;margin-top:28px;touch-action:none}.slot{width:100%;height:112px;border-radius:25px;border:1px solid #fffaf5;background:linear-gradient(145deg,#fff1e2b8,#f9e7d4c9);box-shadow:0 3px 2px #d6b393,0 6px 10px #ac794e1f,inset 0 1px 1px white;display:grid;place-items:center;padding:10px;touch-action:none;user-select:none;-webkit-user-select:none}.slot:not(:disabled):hover{background:linear-gradient(145deg,#fff9ee,#f8e8d5)}.slot.selected{outline:2px solid #83ae54;outline-offset:2px}.slot.used{box-shadow:inset 0 1px 3px #a67c4c18;background:#f4e4d144;border-color:#f8e8d7}.slot.dragging .piece{opacity:.16}.piece{position:relative;pointer-events:none;flex-shrink:0}.piece .block{position:absolute;width:var(--piece-cell);height:var(--piece-cell);left:calc(var(--x)*(var(--piece-cell) + var(--piece-gap)));top:calc(var(--y)*(var(--piece-cell) + var(--piece-gap)))}.footnote{text-align:center;font-size:11px;color:#b99b81;letter-spacing:.35px;margin:24px 0 2px}#drag-layer{position:fixed;inset:0;pointer-events:none;z-index:10}#drag-layer .piece{position:absolute;opacity:.94;filter:drop-shadow(0 9px 7px #58391940);transform-origin:center}#drag-layer .piece.bad{opacity:.55}#effects{position:absolute;inset:9px;pointer-events:none;overflow:visible}.clearing{position:absolute;animation:clear .5s ease-out forwards;box-shadow:0 0 15px #ffdf70,inset 0 0 10px #ffffdc;background:#fff3a7;z-index:2}.particle{position:absolute;width:7px;height:7px;border-radius:2px;background:var(--yellow);animation:particle .65s ease-out forwards;z-index:3}.points{position:absolute;left:50%;top:45%;font-weight:800;font-size:26px;color:#654125;text-shadow:0 2px 2px white;animation:points .9s ease-out forwards;z-index:4}dialog{border:1px solid #fff8ee;border-radius:30px;padding:0;width:min(340px,calc(100% - 40px));background:linear-gradient(145deg,#fff9f0,#fcead9);color:#432a1c;box-shadow:0 15px 60px #6b422737}dialog::backdrop{background:#61412c38;backdrop-filter:blur(7px)}.modal-content{text-align:center;padding:27px 25px}.modal-mark{font-size:32px;color:#bb8a4c;font-weight:800}h1{font-size:28px;margin:12px 0}#modal-description{font-size:15px;line-height:1.7;color:#95755b;white-space:pre-line;margin:0 0 22px}#modal-actions{display:grid;gap:12px}.action{border:1px solid #fff8ed;border-radius:14px;padding:14px;font-size:15px;font-weight:650;background:#f4e2ce;box-shadow:0 2px 1px #d7b595}.action.primary{background:var(--green);color:#29431b;box-shadow:0 2px 1px #78984d}.action.quiet{background:transparent;box-shadow:none;border-color:#ead5bd;color:#95755b}
/* Both axes must have explicit tracks: implicit auto rows can redistribute
   height when Safari invalidates layout during drag-preview updates. */
#board{width:100%;grid-template-rows:repeat(8,minmax(0,1fr))}
.board-wrap{flex-shrink:0}
.in-telegram .game{min-height:var(--mini-height,100svh);padding-top:max(14px,env(safe-area-inset-top),var(--mini-safe-top,0px));padding-bottom:max(14px,env(safe-area-inset-bottom),var(--mini-safe-bottom,0px));padding-left:max(19px,env(safe-area-inset-left),var(--mini-safe-left,0px));padding-right:max(19px,env(safe-area-inset-right),var(--mini-safe-right,0px))}
.in-telegram.mini-compact .message-space{height:44px}
.in-telegram.mini-compact .slot{height:88px}
.in-telegram.mini-compact #tray{margin-top:20px}
.in-telegram.mini-compact .footnote{margin-top:14px}
@keyframes place{0%{transform:scale(.86)}65%{transform:scale(1.045)}100%{transform:scale(1)}}@keyframes clear{0%{opacity:1;transform:scale(1)}35%{opacity:1;transform:scale(1.04);filter:brightness(1.2)}100%{opacity:0;transform:scale(.65)}}@keyframes particle{to{transform:translate(var(--tx),var(--ty)) rotate(100deg);opacity:0}}@keyframes points{0%{opacity:0;transform:translate(-50%,8px)}20%{opacity:1}100%{opacity:0;transform:translate(-50%,-45px)}}@keyframes toast{0%{opacity:0;transform:scale(.9)}15%,65%{opacity:1;transform:scale(1)}100%{opacity:0;transform:translateY(-9px)}}
@media(min-width:700px){.game{padding-top:42px;max-height:950px;min-height:min(950px,100svh)}.message-space{height:108px}.footnote{margin-top:30px}}
@media(max-width:370px),(max-height:690px){.game{padding-left:13px;padding-right:13px;padding-top:max(10px,env(safe-area-inset-top))}header{padding-top:4px;gap:14px}.pause{width:43px;height:43px}.score-stat strong{font-size:30px}.message-space{height:59px}.slot{height:92px;border-radius:21px}#tray{gap:10px;margin-top:21px}.footnote{margin-top:17px}.board-wrap{padding:7px;border-radius:22px}#effects{inset:7px}:root{--gap:3px}}
@media(max-height:580px) and (orientation:landscape){.game{width:340px;padding-top:6px}.message-space{height:35px}#hint{font-size:11px;line-height:1.2}.slot{height:65px}#tray{margin-top:12px}.footnote{display:none}.board-wrap{width:260px;align-self:center}header{padding:0 4px}.score-stat strong{font-size:25px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;transition:none!important}.particle{display:none}}
[hidden]{display:none!important}
.home{width:min(100%,440px);min-height:100svh;margin:auto;padding:max(20px,env(safe-area-inset-top)) 26px max(16px,env(safe-area-inset-bottom));display:flex;flex-direction:column}
.home-top{display:flex;align-items:center;justify-content:space-between;gap:12px}.home-top>span{font-size:9px;font-weight:750;letter-spacing:1.6px;color:#a58a72}.small-button{background:#fff7ed;border:1px solid #ead5bf;border-radius:11px;padding:9px 10px;color:#94775f;font-size:11px}
.home-content{flex:1;display:flex;flex-direction:column;align-items:stretch;justify-content:center;text-align:center;padding-top:22px}.home-logo{display:grid;grid-template-columns:repeat(3,34px);grid-template-rows:repeat(3,34px);gap:3px;width:108px;height:108px;margin:0 auto 22px;transform:rotate(-7deg)}.home-logo i{display:block;border-radius:9px}.home-logo i:nth-child(1){grid-area:1/2}.home-logo i:nth-child(2){grid-area:2/1}.home-logo i:nth-child(3){grid-area:2/2}.home-logo i:nth-child(4){grid-area:3/1}.home-logo i:nth-child(5){grid-area:3/2}.home-logo i:nth-child(6){grid-area:3/3}
#home-title{font-size:48px;line-height:.98;letter-spacing:-2px;margin:0;font-weight:850}.home-subtitle{font-size:12px;color:#a2866e;margin:17px 0 22px}.home-best{display:flex;align-items:center;justify-content:center;gap:8px;font-size:12px;color:#9c7c60;margin-bottom:24px}.home-best strong{font-size:20px;color:#63432c;margin-left:5px}.home-best>span{font-size:20px}.home-actions{display:grid;gap:11px}.home-actions .action{min-height:49px;padding:13px}.home-actions .action.primary{font-size:16px}.home-actions #home-resume{display:flex;justify-content:center;gap:16px;align-items:center}#resume-score{font-size:12px;font-weight:500;opacity:.7}.level-card{padding:17px 18px 13px;margin-top:23px;border:1px solid #ecd9c6;border-radius:19px;background:#fff9f054;text-align:left}.level-card>div:first-child{display:flex;justify-content:space-between;gap:12px;font-size:12px}.level-card>div:first-child>span{color:#a2866e;font-size:11px}.level-card p{font-size:10px;line-height:1.5;color:#ad927b;margin:9px 0 0}.progress-track{height:5px;border-radius:6px;overflow:hidden;background:#e8d7c4;box-shadow:inset 0 1px 2px #bda38330;margin-top:10px}.progress-track>span{display:block;height:100%;width:0;background:linear-gradient(90deg,#a6cc78,#76a94b);border-radius:inherit;transition:width .25s ease}.text-button{border:0;background:none;font-size:12px;color:#9c7c60;margin:18px auto 0;padding:9px 18px}
.message-space{height:112px;flex-shrink:0;display:flex;flex-direction:column;justify-content:center;gap:8px}.quest-card{width:100%;padding:12px 14px;background:#fff9ee85;border:1px solid #ecd9c6;border-radius:17px}.quest-top{display:flex;justify-content:space-between;align-items:center;font-size:9px;letter-spacing:1px;color:#a3896f;font-weight:750;gap:10px}#quest-count{letter-spacing:0;font-size:11px}.quest-body{display:flex;align-items:center;justify-content:space-between;gap:9px;margin-top:6px}.quest-body strong{font-size:12px;font-weight:650}.quest-body>span{font-size:10px;color:#8b9b61;white-space:nowrap}.quest-card.complete{background:#edf4dfb0;border-color:#b6cb93}.quest-card.complete .quest-top{color:#73964a}.quest-card .progress-track{height:3px;margin-top:9px}#hint{font-size:10px;line-height:1.2}#hint.hidden{display:none}#toast{font-size:19px;background:#fff4e8ed;border-radius:16px;text-align:center;padding:12px;z-index:3}
dialog{max-height:calc(100dvh - 36px);overflow-y:auto;overscroll-behavior:contain}.modal-content{padding:24px 22px}#modal-extra:empty{display:none}#modal-extra{margin-bottom:20px}.final-score{font-size:54px;letter-spacing:-2px;line-height:1.1;font-weight:850}.score-caption{font-size:9px;color:#a3896f;letter-spacing:1.4px;margin:6px 0 19px}.result-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin:14px 0}.result-grid>div{padding:13px 5px;border-radius:13px;background:#f5e5d4;border:1px solid #eedac6;display:flex;flex-direction:column;gap:6px}.result-grid strong{font-size:21px}.result-grid span{font-size:9px;line-height:1.35;color:#a08166}.record-note{font-size:13px;color:#8b6b4c;line-height:1.5;margin:14px 0}.quest-result{font-size:12px;line-height:1.6;background:#f5e5d4;border-radius:12px;padding:12px;color:#a08166}.quest-result.done{background:#e7efd6;color:#73964a}.legacy-note{font-size:10px;line-height:1.5;color:#ac9178}.last-caption{font-size:10px;letter-spacing:1px;color:#a3896f;margin:25px 0 14px;padding-top:20px;border-top:1px solid #ead5be}.help-note{font-size:13px;line-height:1.7;color:#94775f}
.in-telegram .home{min-height:var(--mini-height,100svh);padding-top:max(20px,env(safe-area-inset-top),var(--mini-safe-top,0px));padding-bottom:max(16px,env(safe-area-inset-bottom),var(--mini-safe-bottom,0px));padding-left:max(26px,var(--mini-safe-left,0px));padding-right:max(26px,var(--mini-safe-right,0px))}.in-telegram.mini-compact .message-space{height:94px}
@media(max-height:740px){.home-content{padding-top:15px}.home-logo{margin-bottom:17px;transform:scale(.85) rotate(-7deg);height:94px}#home-title{font-size:40px}.home-subtitle{margin:13px 0 15px}.home-best{margin-bottom:16px}.level-card{margin-top:16px}.home-actions{gap:9px}.text-button{margin-top:9px}.message-space{height:94px}.quest-card{padding:10px 12px}}
@media(max-width:350px){.home{padding-left:20px;padding-right:20px}.quest-body{gap:5px}.quest-body strong{font-size:11px}.quest-body>span{font-size:9px}.quest-card{padding:10px}.modal-content{padding:22px 18px}}
@media(max-height:690px){.game .board-wrap{width:min(100%,calc(var(--mini-height,100svh) - 320px));align-self:center}.message-space{height:88px}}
