:root{font-family:system-ui,-apple-system,sans-serif;color:#203e37;background:#f6f7f2;font-synthesis:none}*{box-sizing:border-box}[hidden]{display:none!important}body{margin:0}main{max-width:510px;margin:auto;padding:26px 18px 40px}header{margin:0 4px 24px}.eyebrow{font-size:12px;letter-spacing:2px;color:#647c70}h1{font-size:32px;margin:8px 0}h1 span{color:#d89b36;margin-left:12px}header p{margin:0;color:#66766e;font-size:14px}h2{font-size:18px}button{font:inherit;cursor:pointer;border:1px solid #d8e1d8;border-radius:12px;background:white;color:#244c40;min-height:44px}button:hover{background:#edf3e9}button:focus-visible{outline:3px solid #cb9735;outline-offset:2px}button:disabled{cursor:default;opacity:.55}nav{display:grid;gap:8px;margin-bottom:16px}nav button{padding:20px;text-align:left;font-weight:700}#resume-label{font-size:12px;font-weight:400}#stage-list,#play-picker{display:grid;gap:10px}.stage-card{text-align:left;padding:14px 16px}.stage-card strong,.stage-card span{display:block}.stage-card span{font-size:12px;color:#647369;margin-top:6px;line-height:1.6}#stage-progress,#unlock-note{font-size:13px;color:#647369}#install-app{width:100%;margin-bottom:16px;background:#185d50;color:white}#ios-install{font-size:13px;line-height:1.6}#play-picker button{padding:16px;text-align:left;font-weight:700}
body.playing{background:#fafbf7}body.playing main{max-width:600px;padding:env(safe-area-inset-top,0px) 10px max(12px,env(safe-area-inset-bottom,0px));min-height:100svh;display:flex;align-items:center;justify-content:center}.game{width:100%;display:flex;flex-direction:column;align-items:center;padding:8px 0}.playbar{width:100%;display:flex;align-items:center;justify-content:space-between;gap:6px;margin-bottom:10px}.playbar button{border:0;background:transparent;font-size:13px;padding:0 6px}.playbar span{font-size:13px;font-weight:700}#stage-title{font-size:16px;margin:0 0 12px;text-align:center}
#board{--size:6;--board-width:min(100%,calc(100svh - 250px));width:var(--board-width);display:grid;grid-template-columns:repeat(var(--size),1fr);border:2px solid #294f43;border-radius:8px;overflow:hidden;flex-shrink:0}.cell{aspect-ratio:1;border:0;border-right:1px solid #d7ded5;border-bottom:1px solid #d7ded5;border-radius:0;min-height:0;padding:0;font-size:clamp(23px,6vw,32px);position:relative;color:#157664}.cell.given{color:#293e35;font-weight:700;background:#f7f8f4}.cell.related{background:#eef4eb}.cell.same{background:#dcecdf}.cell.clue{background:#fff0cc}.cell.clue:not(.given){background:#fff9e9}.cell.target{box-shadow:inset 0 0 0 3px #c48c2c}.cell.selected{background:#d2eadf;box-shadow:inset 0 0 0 3px #185d50}.cell.conflict{color:#b63740;background:#ffe9e8;text-decoration:underline}.cell.box-right{border-right:2px solid #294f43}.cell.box-bottom{border-bottom:2px solid #294f43}.cell.last-col{border-right:0}.cell.last-row{border-bottom:0}.cell.error-clue{background:#ffe3c2;box-shadow:inset 0 0 0 2px #bc7132}.cell.solved{background:#d2eadf;box-shadow:inset 0 0 0 3px #185d50;font-weight:750}.cell.excluded::after{content:'×';position:absolute;inset:0;display:grid;place-items:center;color:#946c35;font-size:25px;pointer-events:none}.notes{display:grid;grid-template-columns:repeat(3,1fr);font-size:11px;line-height:1.3;padding:2px}.notes span{min-height:12px}#board[data-size="9"] .cell{font-size:clamp(19px,5vw,28px)}#board[data-size="9"] .notes{font-size:8px;line-height:1.1;padding:1px}#board[data-size="9"] .notes span{min-height:9px}
#numbers{--size:6;display:grid;grid-template-columns:repeat(var(--size),1fr);gap:4px;width:min(100%,calc(100svh - 250px));margin-top:12px}#numbers button{font-size:23px;font-weight:600;padding:6px 0;background:#edf4ee;min-height:48px}.tools{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:10px;width:min(100%,calc(100svh - 250px))}.tools button{font-size:13px}.tools button.active{background:#185d50;color:white}
aside{width:min(100%,calc(100svh - 250px));padding:10px 12px;margin-top:10px;border-radius:12px;background:#f5f6ee}#message{font-size:13px;line-height:1.5}#hint{margin-top:8px;width:min(100%,calc(100svh - 250px));min-height:42px;font-size:13px}body.learning #board,body.learning #numbers,body.learning .tools,body.learning aside,body.learning #hint{width:min(100%,calc(100svh - 350px))}body.learning aside{min-height:96px}#feedback[data-tone="correct"]{background:#e5f3e8;border:1px solid #80b79b}#feedback[data-tone="correct"] #message{font-weight:750;font-size:18px;color:#185d50}#feedback[data-tone="retry"]{background:#fff4df;border:1px solid #ddb975}#success p{font-size:14px;margin:8px 0 12px;line-height:1.6}#success button{width:100%;background:#185d50;color:white;font-weight:700;padding:10px}
@media(max-width:360px){main{padding:16px 10px}.playbar span{font-size:12px}#numbers{gap:3px}#numbers button{font-size:21px}}@media(max-height:620px){body.playing main{align-items:flex-start}#board,#numbers,.tools,aside,#hint,body.learning #board,body.learning #numbers,body.learning .tools,body.learning aside,body.learning #hint{width:min(100%,320px)}}
/* Home: one clear next step, a visible journey, and quick access to puzzles. */
body:not(.playing){background:radial-gradient(ellipse at 100% 0%,#e2ede6 0,transparent 55%),#f8f7f2}
body:not(.playing) main{max-width:540px;padding:28px 20px max(28px,env(safe-area-inset-bottom,0px))}
.brand{display:flex;align-items:center;gap:12px;margin:0 0 24px}.brand h1{font-size:23px;letter-spacing:-.8px;margin:0 0 3px}.brand p{font-size:12px;color:#6b7b73}.brand-mark{display:grid;grid-template-columns:repeat(2,1fr);gap:3px;background:#185d50;border-radius:12px;padding:7px;width:45px;height:45px;transform:rotate(-5deg);box-shadow:0 4px 10px #185d5019}.brand-mark i{background:#ffffff25;border-radius:2px;font-size:12px;font-weight:750;font-style:normal;display:grid;place-items:center;color:white}
.adventure-card{background:#fff;border:1px solid #e4e9df;border-radius:26px;padding:23px;box-shadow:0 12px 38px #214b3509;overflow:hidden}.hero-top{display:flex;justify-content:space-between;gap:10px;align-items:center;margin-bottom:24px}.card-label{display:inline-block;color:#3b7665;background:#edf5ee;padding:6px 9px;border-radius:7px;font-size:11px;font-weight:750}.hero-top h2{font-size:clamp(21px,5.7vw,28px);line-height:1.4;letter-spacing:-1px;margin:13px 0 0}.board-art{width:124px;flex:0 0 124px;display:grid;grid-template-columns:repeat(6,1fr);padding:6px;border:1px solid #d6e2d8;border-radius:13px;background:#f8fbf6;transform:rotate(9deg);box-shadow:7px 9px 0 #edf4eb;user-select:none}.board-art span{aspect-ratio:1;display:grid;place-items:center;border-right:1px solid #dce6d9;border-bottom:1px solid #dce6d9;font-size:12px;color:#507768;font-weight:650}.board-art span:nth-child(3n){border-right:1px solid #94b29d}.board-art span:nth-child(6n){border-right:0}.board-art span:nth-child(n+7):nth-child(-n+12),.board-art span:nth-child(n+19):nth-child(-n+24){border-bottom:1px solid #94b29d}.board-art span:nth-child(n+31){border-bottom:0}.board-art span:nth-child(15){background:#f5dd9a;color:#624b1d;border-radius:3px}.journey-meta{display:flex;justify-content:space-between;gap:8px;font-size:12px;color:#758278}.journey-meta #stage-progress{font-size:12px;color:#375e4e;margin:0}#journey-dots{display:flex;gap:5px;margin:11px 0 21px}#journey-dots span{flex:1;aspect-ratio:1;max-height:32px;display:grid;place-items:center;border-radius:8px;background:#f1f3ee;color:#8a948b;font-size:11px;font-weight:700}#journey-dots .cleared{background:#185d50;color:white}#journey-dots .current{background:#fae9b8;color:#756028;box-shadow:inset 0 0 0 1px #e6cd86}.next-stage{padding-top:17px;border-top:1px solid #edf0e8;display:grid;gap:6px;margin-bottom:16px}#next-stage-label{font-size:11px;color:#788078}#next-stage-title{font-size:16px;letter-spacing:-.4px}.primary-action{width:100%;min-height:53px;text-align:center;font-size:15px;font-weight:750;letter-spacing:-.2px;border:0;border-radius:14px;background:#185d50;color:white;box-shadow:0 4px 0 #104b40}.primary-action:hover{background:#217462}.primary-action:active{transform:translateY(2px);box-shadow:0 2px 0 #104b40}.stage-toggle{width:100%;background:transparent;border:0;color:#64786b;font-size:12px;min-height:44px;margin-top:7px}.stage-toggle:hover{background:#f7f9f4}.free-play{margin-top:25px}.section-heading{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-bottom:12px}.section-heading h2{font-size:16px;margin:0;letter-spacing:-.3px}.section-heading>span{font-size:11px;color:#7b877d}#play-picker{gap:10px}#play-picker .puzzle-card{display:flex;align-items:center;gap:14px;text-align:left;padding:14px 16px;min-height:84px;border:1px solid #e2e7dd;border-radius:18px;background:#fff;box-shadow:0 4px 16px #214b3504}.size-symbol{display:flex;align-items:center;justify-content:center;gap:3px;flex-shrink:0;width:52px;height:52px;background:#edf4eb;border-radius:13px;color:#47704f;font-size:21px;font-weight:750}.size-symbol>span{font-size:11px;font-weight:500}.puzzle-copy{display:grid;gap:4px;flex:1}.puzzle-copy strong{font-size:14px;letter-spacing:-.3px}.puzzle-copy>span{font-size:12px;font-weight:400;color:#7a887b}#resume-label{font-size:10px;color:#185d50;font-weight:700}.card-arrow{font-size:23px;color:#718c78}.lock-badge{font-size:10px;background:#f1f2ed;border-radius:6px;padding:5px 7px;font-weight:650;color:#6e7b6d}#play-picker .puzzle-card:disabled{opacity:1;background:#f2f3ed;color:#788277}#play-picker .puzzle-card:disabled .size-symbol{background:#e8ebe2;color:#7b8776}#unlock-note{font-size:11px;line-height:1.6;text-align:center;margin:10px 0 0;color:#7e877d}#lesson-picker{margin-top:27px;scroll-margin-top:16px}#lesson-picker .section-heading{flex-wrap:wrap}.stage-card{border-radius:16px;background:#fff}.stage-card:not(:disabled):hover{border-color:#99baa6}#stage-list{gap:8px}.home-footer{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:10px;margin-top:25px;font-size:11px;color:#8a9288}.home-footer #install-app{width:auto;min-height:36px;padding:6px 12px;margin:0;border:1px solid #dce2d5;border-radius:10px;background:transparent;color:#5c7462;font-size:11px}.home-footer #ios-install{width:100%;text-align:center;font-size:11px;margin:0}
@media(max-width:370px){body:not(.playing) main{padding:22px 15px}.adventure-card{padding:19px}.board-art{width:99px;flex-basis:99px}.board-art span{font-size:10px}.hero-top h2{font-size:22px}#journey-dots{gap:4px}.section-heading>span{font-size:10px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}.primary-action:active{transform:none}}