:root{--bg0:#f6f5ec;--bg1:#f6f5ec;--board:#becbb3;--cell:#d5ddc7;--ink:#163f33;--ink-dim:#60776a;--accent:#ef7865;--gold:#2f7659;--card:#fffef8;--card-line:#dce2d2}
@media(max-width:480px){.games-nav{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px!important}.games-nav a{text-align:center;white-space:nowrap;padding:9px 5px!important;font-size:11px!important}}
*{box-sizing:border-box}h1,h2,h3,p,button{word-break:keep-all}.controls-card button{white-space:nowrap}.direction-controls button{font-family:inherit;font-size:18px;font-weight:700}
body{background:radial-gradient(ellipse at 85% 8%,#e5ebd7 0,transparent 32%),#f6f5ec}
.wrap{max-width:1136px;padding:28px 28px 38px}
header.hd{align-items:center;justify-content:space-between;padding-bottom:23px;margin-bottom:20px;border-bottom:1px solid var(--card-line)}
.orchard-brand{display:flex;align-items:center;gap:9px;color:var(--ink);font-size:20px;font-weight:900;letter-spacing:-.7px;text-decoration:none}
.orchard-brand>span:first-child{font-size:27px}.brand-note{font-size:11px;font-weight:500;letter-spacing:0;margin-left:9px;color:var(--ink-dim)}
.topnav{gap:23px}.topnav a{font-size:12px;color:var(--ink)}
.games-nav{gap:8px;margin-bottom:0}.games-nav a{padding:8px 14px;font-size:12px;border-color:var(--card-line);background:#fffaf1}
.games-nav a.cur{background:var(--ink);color:#fffef8;border-color:var(--ink)}
.game-intro{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:30px 0 29px}
.eyebrow{font-size:10px;font-weight:800;letter-spacing:2px;color:var(--gold);margin:0 0 12px}
.game-intro h1{font-size:clamp(29px,4vw,45px);line-height:1.18;letter-spacing:-2px;margin:0 0 12px;font-weight:900}
.game-intro h1 span{color:var(--gold)}.game-intro p:last-child{font-size:13px;color:var(--ink-dim);margin:0;line-height:1.7}
.intro-tiles{display:flex;align-items:center;gap:10px;padding-right:17px;transform:rotate(-7deg)}
.intro-tiles span{display:grid;place-items:center;width:57px;height:57px;background:#dce7cc;border:3px solid #fffef8;border-radius:15px;font-size:26px;font-weight:900;box-shadow:0 8px 0 #163f3309}
.intro-tiles span:nth-child(2){background:#f3cd64;transform:translateY(-12px)}.intro-tiles span:nth-child(3){background:#ef7865;color:#4f251c}
main{gap:26px;justify-content:center;background:#edf0e4;border:1px solid #dce2d2;border-radius:26px;padding:24px}
.stage{width:min(440px,100%);flex:0 1 440px}.panel{width:294px;flex:0 1 294px;gap:11px}
.board-caption{display:flex;justify-content:space-between;gap:10px;font-size:10px;letter-spacing:.3px;color:var(--ink-dim);align-items:center;margin:0 2px 12px}
.board-caption span:first-child{font-weight:800;color:var(--ink)}
.board{border:1px solid #a8baa0;border-radius:18px;box-shadow:0 7px 0 #163f3310,0 16px 26px #163f3310;overflow:hidden}
.board:focus-visible{outline:3px solid #2f7659;outline-offset:5px}.cell,.tile{border-radius:10px}
.cell{box-shadow:inset 0 2px 3px #163f3305}.tile{box-shadow:0 3px 0 #163f330d;color:#163f33;font-weight:900}
.t2{background:#f9f5e7}.t4{background:#e3eccd}.t8{background:#b8d594}.t16{background:#86b780;color:#173d2b}.t32{background:#54966b;color:#fff}.t64{background:#2f7659;color:#fff}
.t128{background:#f5da86;color:#684f18}.t256{background:#f3cd64;color:#614612}.t512{background:#e9b547;color:#4e3b11}.t1024{background:#f1a274;color:#522c1e}.t2048{background:#ef7865;color:#4c241b;box-shadow:0 0 22px #ef78653a}.tsuper{background:#163f33;color:#fff}
.ov{z-index:2;inset:0;border-radius:17px;background:rgba(250,249,237,.96);padding:24px;gap:12px;box-shadow:inset 0 0 45px #dce6cf55}
.ov h2{font-size:23px;letter-spacing:-1px}.ov .sub{font-size:12px}.ov .fin{color:var(--gold)}
.start-mark{width:69px;height:69px;background:#f3cd64;border-radius:18px;display:grid;place-items:center;font-size:22px;font-weight:900;transform:rotate(-7deg);margin-bottom:7px;box-shadow:0 5px 0 #163f3310}
#nickInput{background:#fffef8;border-color:#cdd9c6;font-size:13px;width:min(270px,100%);padding:12px}.so-row{width:min(270px,100%)}
.so-row button.b{font-size:11px;padding:10px 6px}.so-hint{font-size:10px;max-width:270px;min-height:30px;margin:-4px 0 0}
button.b{font-size:12px;border-radius:10px;background:#f6f5ec;border-color:#d7dfcd;padding:11px 10px;transition:background .15s,transform .15s}
button.b:hover{background:#e9eedf}button.b.primary{background:var(--ink);border-color:var(--ink);color:#fffef8}button.b.primary:hover{background:#2f7659}
button.b.sel{background:#e4edda;border-color:#92ae81;color:#163f33}.ov button.b{padding:13px 30px;font-size:13px}.ov .so-row button.b{flex:1;padding:10px 5px;font-size:11px}
.card{border-radius:16px;padding:15px 17px;box-shadow:0 3px 0 #163f3303}.card .lbl{font-size:10px;letter-spacing:.6px;margin-bottom:9px;font-weight:700}
#score{font-size:37px;letter-spacing:-1px}#best{font-size:12px;background:#f1f3e5;padding:6px 9px;border-radius:7px}#maxTile{font-size:10px;margin-top:8px}#pace{font-size:11px;margin-top:9px}
.goal-card{background:#f9f7e9}.goal-heading{display:flex;align-items:baseline;gap:10px}.goal-heading strong{font-size:32px;letter-spacing:-1px}.goal-heading span{font-size:10px;color:var(--ink-dim)}
.goal-progress{height:6px;background:#e3e8d8;border-radius:20px;overflow:hidden;margin-top:10px}.goal-progress span{display:block;height:100%;width:0;background:#2f7659;border-radius:20px;transition:width .25s}
#goalHint{font-size:10px;line-height:1.6;color:var(--ink-dim);margin:9px 0 12px}.milestone-trail{display:flex;gap:4px}.milestone-trail span{display:grid;place-items:center;flex:1;padding:6px 0;border:1px solid #d6decd;border-radius:6px;color:#758270;font-size:9px;font-weight:700}.milestone-trail span.reached{background:#2f7659;color:#fff;border-color:#2f7659}
.rank-head{gap:8px}.rank-head button{padding:0;border:0;background:transparent;font:inherit;font-size:10px;color:var(--ink-dim);text-decoration:underline;cursor:pointer;letter-spacing:0}
.rank-tabs{gap:5px}.rt{font-size:10px;border-radius:7px;min-height:33px}.rt.sel{color:#fffef8}.rank-list{min-height:28px}ol.rank-list li{font-size:11px;padding:5px 0}.help{font-size:11px;line-height:1.8}
.play-feedback{display:flex;justify-content:space-between;align-items:center;min-height:40px;gap:8px;padding:13px 3px 5px;font-size:11px;color:var(--ink-dim)}#moveFeedback{line-height:1.5}#moveFeedback.gain{color:var(--gold);font-weight:800}#moveCount{font-variant-numeric:tabular-nums;white-space:nowrap;font-weight:700}
.direction-controls{display:flex;gap:6px;align-items:center;margin-top:10px}.direction-controls button{width:40px;height:36px;font:700 18px inherit;color:var(--ink);background:#fffef8;border:1px solid #d1dcc6;border-radius:9px;cursor:pointer}.direction-controls button:hover{background:#e0e8d3}.direction-controls button:disabled{opacity:.45;cursor:default}.direction-controls span{margin-left:auto;font-size:9px;color:var(--ink-dim)}
button:focus-visible,a:focus-visible{outline:3px solid #2f7659;outline-offset:3px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.strategy-strip{display:grid;grid-template-columns:1.25fr repeat(3,1fr);gap:24px;padding:34px 0;margin-top:10px;border-bottom:1px solid var(--card-line)}.strategy-lead h2{font-size:20px;line-height:1.5;letter-spacing:-.6px;margin:0 0 12px;max-width:170px}.strategy-lead a{font-size:11px;color:var(--gold);font-weight:700;text-decoration:none}.strategy-number{font-size:11px;font-weight:800;color:var(--gold);border:1px solid #d6dfca;display:grid;place-items:center;width:29px;height:29px;border-radius:50%;margin-bottom:12px}.strategy-strip h3{font-size:13px;margin:0 0 8px}.strategy-strip article p{font-size:11px;line-height:1.8;color:var(--ink-dim);margin:0}
.content{max-width:830px;margin:30px auto 0;font-size:13px;color:#476153;line-height:1.95}.content h2{color:var(--ink);font-size:19px}.site-footer{margin-top:35px;padding-top:25px}.site-footer nav{gap:11px 20px}.site-footer a{font-size:11px}.site-footer .copy{font-size:10px}
@media(max-width:900px){.wrap{padding:22px 24px 32px}.panel{width:260px;flex-basis:260px}.stage{flex-basis:410px}main{gap:20px;padding:20px}.brand-note{display:none}}
@media(max-width:760px){.wrap{padding:17px 16px 28px}header.hd{padding-bottom:16px;margin-bottom:15px;gap:12px}.orchard-brand{font-size:17px}.orchard-brand>span:first-child{font-size:23px}.topnav{gap:13px}.topnav a{font-size:10px}.topnav a:first-child{display:none}.games-nav a{font-size:10px;padding:7px 11px}.game-intro{padding:24px 0 22px;gap:15px}.game-intro h1{font-size:29px;letter-spacing:-1.5px;margin-bottom:9px}.game-intro p:last-child{font-size:11px;max-width:230px}.eyebrow{font-size:8px;letter-spacing:1.4px;margin-bottom:9px}.intro-tiles{gap:4px;padding-right:0}.intro-tiles span{width:32px;height:38px;font-size:18px;border-radius:10px;border-width:2px}.intro-tiles span:nth-child(2){transform:translateY(-7px)}main{padding:14px 12px 16px;border-radius:20px;gap:20px}.stage{width:100%;flex:0 1 440px}.board-caption{font-size:9px;margin-bottom:9px}.mob-hud{margin-bottom:10px;font-size:11px}.mob-hud .mh-score{font-size:25px;margin-left:5px}.mob-hud .mh-pace{font-size:9px;max-width:160px;text-align:right}.ov{padding:20px 14px;gap:10px}.ov h2{font-size:20px}.start-mark{width:51px;height:51px;font-size:17px;border-radius:14px;margin-bottom:3px}.ov .sub{font-size:11px}.so-hint{font-size:9px;min-height:26px}.ov button.b{padding:11px 25px}.panel{width:100%;flex:0 1 440px;flex-direction:row;gap:9px}.panel .card{flex:1 1 calc(50% - 9px);min-width:0;padding:13px}.panel .card.goal-card{flex:1 1 100%;order:-1}.panel .card.wide{flex:1 1 100%}.goal-heading{float:left;margin-right:17px}.goal-heading strong{font-size:28px}.goal-heading span{font-size:9px}.goal-progress{margin-top:7px}.milestone-trail span{padding:5px 0}#goalHint{font-size:9px;margin:8px 0 11px}.goal-card .lbl{margin-bottom:8px}#score{font-size:29px}#best{font-size:10px;padding:5px}.score-row{gap:5px}button.b{font-size:10px;padding:10px 7px}.card .lbl{font-size:9px}.btns{gap:5px}.strategy-strip{grid-template-columns:repeat(3,1fr);gap:17px;padding:25px 0}.strategy-lead{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:5px}.strategy-lead .eyebrow{width:100%;margin:0}.strategy-lead h2{max-width:none;font-size:19px;margin:0}.strategy-lead a{font-size:10px}.strategy-number{margin-bottom:10px}.strategy-strip h3{font-size:11px}.strategy-strip article p{font-size:10px}.content{font-size:12px}.content h2{font-size:17px}.play-feedback{font-size:10px}.direction-controls span{font-size:8px}.direction-controls button{width:37px;height:35px}}
@media(max-width:370px){.game-intro h1{font-size:26px}.intro-tiles span{width:26px;height:32px;font-size:15px}.game-intro p:last-child{font-size:10px}.ov{gap:7px}.start-mark{width:42px;height:42px;font-size:15px}.ov h2{font-size:18px}#nickInput{padding:9px}.ov .so-row button.b{padding:8px 4px;font-size:10px}.ov button.b{padding:10px 23px}.board-caption{font-size:8px}.direction-controls span{display:none}.strategy-strip{gap:10px}}
@media(prefers-reduced-motion:reduce){.goal-progress span,button.b{transition:none}}
@media(max-width:760px){.controls-card .btns{flex-direction:column}.controls-card button.b{padding:8px 5px}.strategy-lead h2{max-width:none}}
