:root{font-family:Nunito,system-ui,sans-serif;color:#40352f;background:#fff7ed;font-synthesis:none}
*{box-sizing:border-box}body{margin:0;min-height:100vh;background:linear-gradient(160deg,#fff8f1 0%,#e9f8ff 38%,#ffe8d4 72%,#fff8f1 100%);position:relative;overflow-x:hidden}
body::before,body::after{content:'';position:fixed;z-index:-1;border-radius:999px;filter:blur(2px);opacity:.55;pointer-events:none;animation:blobFloat 11s ease-in-out infinite alternate}
body::before{width:340px;height:340px;left:-110px;top:-80px;background:radial-gradient(circle,#ffd3a7 0%,#ffd3a700 70%)}
body::after{width:300px;height:300px;right:-90px;bottom:-80px;background:radial-gradient(circle,#ffc9d8 0%,#ffc9d800 70%);animation-duration:14s}
body.celebrate::before{animation-duration:1.8s;opacity:.75}
body.celebrate::after{animation-duration:2.2s;opacity:.75}
@keyframes blobFloat{from{transform:translateY(0) translateX(0)}to{transform:translateY(16px) translateX(10px)}}
button{font:inherit;cursor:pointer;border:0}.app{width:min(100% - 28px,540px);margin:0 auto;padding:env(safe-area-inset-top) 0 calc(18px + env(safe-area-inset-bottom))}
.topbar{display:flex;align-items:center;justify-content:space-between;padding:18px 2px 10px}.brand{display:flex;gap:11px;align-items:center}.brand-cat{font-size:32px}.brand h1{font-size:28px;line-height:1;margin:0;font-weight:900;letter-spacing:-.8px;background:linear-gradient(90deg,#ff9f1a,#ff5f6d,#8e5dff);-webkit-background-clip:text;background-clip:text;color:transparent}.brand p{margin:2px 0 0;font-size:11px;color:#8f7766;font-weight:800;letter-spacing:.3px}.icon-btn{width:40px;height:40px;border-radius:14px;background:#fff;box-shadow:0 4px 14px #7d513024;font-size:25px;color:#78513b}
.statusbar{background:#ffffffd9;border:1px solid #f3e6da;border-radius:20px;padding:10px 11px;margin:10px 0 12px;box-shadow:0 12px 30px #81502a1a;display:grid;grid-template-columns:repeat(5,1fr);gap:8px;backdrop-filter:blur(4px)}.status-item{display:flex;align-items:center;gap:6px;background:#fff7f0;border:1px solid #f3e4d7;border-radius:12px;padding:7px 9px;font-size:13px;min-width:0;transition:transform .16s ease}.status-item strong{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.status-item:nth-child(1){background:#fff0f1}.status-item:nth-child(2){background:#fff8e6}.status-item:nth-child(3){background:#eef8ff}.status-item:nth-child(4){background:#fff5de}.status-item:nth-child(5){background:#f2f8e8}
.status-item.status-level{background:#fff3df;border-color:#efdabf}.status-item.status-level #levelLabel{font-size:13px;font-weight:900;letter-spacing:.2px}
.status-item.status-difficulty select{width:100%;border:1px solid #ecdccf;border-radius:8px;background:#fff;color:#7a624f;font:inherit;font-size:11px;font-weight:800;padding:4px 6px}
.status-item.status-score #score{font-weight:900;color:#cc7e2e}.status-item.status-score #score.score-pop{animation:scorePop .36s ease}
@keyframes scorePop{0%{transform:scale(.7)}45%{transform:scale(1.2)}100%{transform:scale(1)}}
.region-progress{grid-column:1/-1;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:6px}.region-token{position:relative;border-radius:11px;display:grid;place-items:center;height:30px;font-size:15px;border:1px solid #ffffffa8;box-shadow:inset 0 0 0 1px #ffffff70}.region-token.solved{filter:saturate(.65) brightness(.98)}.region-token.solved::after{content:'';position:absolute;left:10%;right:10%;top:50%;height:3px;border-radius:99px;background:#7f6a59;transform:rotate(-9deg)}
.board-wrap{background:linear-gradient(145deg,#ffb55f,#ff9f43);padding:8px;border-radius:24px;box-shadow:0 14px 35px #81502a28;border:2px solid #ffcb87}.board{background:#fffaf1;border-radius:16px;padding:6px;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:3px;touch-action:none}.cell{aspect-ratio:1;min-width:0;border-radius:10px;display:grid;place-items:center;font-size:clamp(20px,6vw,31px);font-weight:900;position:relative;user-select:none;-webkit-tap-highlight-color:transparent;transition:filter .12s,transform .12s,border-color .12s;box-shadow:inset 0 0 0 1px #ffffff9a}.cell:active{transform:scale(.94)}.cell.mark{font-size:clamp(20px,5vw,27px);color:#a88f7c}.cell.cat{background:#fff!important;box-shadow:inset 0 0 0 2px #e8a65e,0 3px 8px #e8a65e29;color:transparent}.cell.cat::before{content:'';position:absolute;inset:16%;background:url('/cat.svg') center/contain no-repeat;pointer-events:none}.cell.bad{box-shadow:inset 0 0 0 3px #e16a5b!important}.cell.hinted{animation:pulse .75s ease-in-out 2}@keyframes pulse{50%{filter:brightness(1.2);transform:scale(.94)}}
.board-wrap.level-enter{animation:levelIn .45s ease-out}@keyframes levelIn{0%{opacity:.35;transform:translateY(8px) scale(.985)}100%{opacity:1;transform:translateY(0) scale(1)}}.cell.starter-pop::before{animation:starterPop .65s ease-out}@keyframes starterPop{0%{transform:scale(.2);opacity:.2}50%{transform:scale(1.15);opacity:1}100%{transform:scale(1);opacity:1}}
.region-0{background:#f7d9c9}.region-1{background:#dce9cf}.region-2{background:#f6e5a9}.region-3{background:#d9e8f4}.region-4{background:#eadcf3}.region-5{background:#f5dce5}
.controls{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin-top:11px}.controls button,.primary,.secondary{border-radius:14px;padding:10px 5px;font-size:17px;font-weight:900;line-height:1;transition:transform .14s ease,box-shadow .14s ease}.controls button:active{transform:translateY(1px) scale(.97)}.secondary{color:#fff;border:1px solid #ffffff55;box-shadow:0 7px 13px #8e5a3922}.secondary:nth-child(1){background:linear-gradient(145deg,#7d5cff,#6a47ec)}.secondary:nth-child(2){background:linear-gradient(145deg,#20c16d,#16a95d)}.secondary:nth-child(3){background:linear-gradient(145deg,#37a7ff,#1b86df)}.secondary:nth-child(4){background:linear-gradient(145deg,#ff8d9d,#e86f80)}.primary{background:linear-gradient(145deg,#ffaf2d,#f58b12);color:#fff;box-shadow:0 8px 16px #d88b4b52}.icon-action{display:grid;place-items:center;gap:4px}.icon-action span{font-size:11px;font-weight:900;line-height:1}.message{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
dialog{border:0;border-radius:20px;padding:0;width:min( calc(100% - 34px),390px);box-shadow:0 20px 80px #3b241b55;color:#40352f}dialog::backdrop{background:#38281f80;backdrop-filter:blur(3px)}.dialog-content{padding:25px;position:relative}.dialog-content h2{margin:0 0 14px;font-size:23px}.dialog-content li,.dialog-content p{font-size:14px;line-height:1.6;color:#796858}.close{position:absolute;right:14px;top:10px;background:none;font-size:27px;color:#9a8170}.full{width:100%;margin-top:10px;padding:13px}.win-cat{text-align:center;font-size:54px}
.win-stats{display:flex;justify-content:center;gap:14px;background:#fff7e9;border:1px solid #f1d8b7;border-radius:12px;padding:8px 10px;font-weight:900;color:#785f4c}.win-stats strong{color:#d07a2a}
@media(min-width:520px){.app{padding-top:18px}.board-wrap{padding:12px}.board{gap:4px}.cell{border-radius:10px}}
