@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;450;500;550;600;650;700&family=Manrope:wght@400;500;600;650;700;750;800&display=swap');
@media(min-width:651px) and (max-height:820px){body .masthead{padding-top:18px;padding-bottom:18px}body main{width:min(800px,calc(100% - 48px));margin-top:22px}body .game-heading{margin-bottom:17px}body h1{font-size:31px}body .game-layout{grid-template-columns:minmax(0,390px) minmax(0,300px);gap:60px}body .score-bar{height:57px}body .board{max-height:calc(100dvh - 302px)}body .energy-number strong{font-size:30px}body .energy-meter{margin-top:12px}body .energy-hint{margin-bottom:20px}body .action-card{padding:12px}body .actions{gap:8px;margin-top:13px}body .status-message{margin-top:13px;min-height:40px}body .next-step{padding-top:12px;margin-top:13px}body footer{margin-top:20px;padding-top:20px}body .tile{font-size:34px}body .tile.high,body .tile[data-value="1024"]{font-size:27px}}
:root{color-scheme:dark;--bg:#132e27;--surface:#1b382f;--line:#ffffff19;--text:#f3f3df;--muted:#a7bbaf;--accent:#d5eb9a;--font:'DM Sans',sans-serif;--display:'Manrope',sans-serif}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-family:var(--font);font-size:16px;line-height:1.5}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}button:disabled{cursor:default}button:focus-visible,a:focus-visible,[tabindex]:focus-visible{outline:3px solid var(--accent);outline-offset:5px}button{color:inherit}a{color:inherit;text-decoration:none}[hidden]{display:none!important}.masthead{max-width:1280px;margin:0 auto;padding:32px 48px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:12px;font:750 30px var(--display);letter-spacing:-1.5px}.brand-mark{width:23px;height:23px;display:grid;grid-template-columns:1fr 1fr;gap:3px;transform:rotate(-8deg)}.brand-mark i{background:var(--accent);border-radius:3px}.brand-mark i:last-child{opacity:.4}.brand-description{font:400 14px var(--font);letter-spacing:0;color:var(--muted);margin-left:20px;border-left:1px solid var(--line);padding-left:24px}.text-button{background:transparent;border:0;padding:5px 0;font-size:14px;color:var(--muted);display:inline-flex;align-items:center;gap:9px}.text-button:hover{color:var(--text)}.help-icon{width:20px;height:20px;border:1px solid currentColor;border-radius:50%;font-size:13px;display:grid;place-items:center}main{width:min(900px,calc(100% - 64px));margin:49px auto 0}.game-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:30px}.eyebrow{font-size:12px;font-weight:600;letter-spacing:1.7px;color:var(--muted);margin:0 0 10px}h1{font:500 clamp(28px,3.5vw,39px)/1.2 var(--display);letter-spacing:-1.6px;margin:0}.target-label{display:flex;align-items:center;gap:15px;font-size:14px;color:var(--muted)}.target-label strong{color:var(--accent);font:700 24px var(--display);border:1px solid #d5eb9a45;border-radius:12px;padding:10px 15px}.game-layout{display:grid;grid-template-columns:minmax(0,500px) minmax(0,300px);gap:66px}.score-bar{height:73px;display:flex;gap:36px;align-items:flex-start}.stat{display:flex;flex-direction:column;gap:0}.stat span{font-size:13px;color:var(--muted)}.stat strong{font:600 26px var(--display);font-variant-numeric:tabular-nums}.board-tools{margin-left:auto;display:flex;gap:9px;margin-top:4px}.icon-button{background:transparent;border:1px solid var(--line);width:41px;height:41px;border-radius:11px;font-size:25px;line-height:1;display:grid;place-items:center}.icon-button:hover:not(:disabled){background:#ffffff0d;border-color:#ffffff50}.icon-button:disabled{opacity:.3}.board-wrap{position:relative}.board{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;padding:12px;background:#0e241d;border:1px solid #ffffff0c;border-radius:21px;aspect-ratio:1;touch-action:none;user-select:none;box-shadow:0 18px 60px #061d1433}.tile{min-width:0;aspect-ratio:1;border:0;border-radius:12px;background:#203c31;display:flex;align-items:center;justify-content:center;font:650 clamp(24px,3.4vw,42px)/1 var(--display);letter-spacing:-1.5px;color:#253e2c;position:relative;cursor:default;transition:background .15s,box-shadow .15s,transform .15s}.tile.filled{box-shadow:inset 0 -3px 0 #00000007}.tile[data-value="2"]{background:#ecefdb}.tile[data-value="4"]{background:#dce6b7}.tile[data-value="8"]{background:#bedb8e}.tile[data-value="16"]{background:#96c575}.tile[data-value="32"]{background:#6aab6b;color:#0b301f}.tile[data-value="64"]{background:#448b5e;color:#f6f2d8}.tile[data-value="128"]{background:#d8ce80;color:#34452d}.tile[data-value="256"]{background:#e8bf6b}.tile[data-value="512"]{background:#e0a455}.tile[data-value="1024"]{background:#ea9163;font-size:clamp(23px,2.7vw,34px)}.tile.high{background:#f2da75;font-size:clamp(23px,2.7vw,34px)}.tile.new-tile{animation:appear .2s ease-out}.tile.merged-tile{animation:merge .23s ease-out}.board.selecting .tile.filled{cursor:pointer;box-shadow:inset 0 0 0 3px #ffffff40}.board.selecting .tile.filled:hover{transform:scale(.96);box-shadow:inset 0 0 0 3px white}.tile.selected{box-shadow:inset 0 0 0 4px #f5a955!important;transform:scale(.94)}.board-caption{display:flex;align-items:center;justify-content:space-between;min-height:45px;gap:8px;color:var(--muted);font-size:13px}.key-symbol{margin-right:7px;color:var(--text);font-size:20px}.cancel-button{font-size:12px;color:var(--accent)}kbd{font:11px var(--font);padding:0 4px;border:1px solid var(--line);border-radius:3px}.direction-controls{display:flex;gap:7px;justify-content:center;align-items:center;padding-top:3px}.direction-controls>div{display:flex;gap:7px}.direction-controls button{height:35px;width:43px;background:transparent;border:1px solid var(--line);border-radius:8px;color:var(--muted);font-size:20px}.direction-controls button:hover{background:#ffffff0a;color:var(--text)}.strategy-panel{padding-top:3px}.energy-heading{display:flex;justify-content:space-between;align-items:center}.energy-heading .eyebrow{font-size:11px;letter-spacing:1.6px}.energy-number{display:flex;align-items:baseline;gap:8px;margin-top:3px}.energy-number strong{font:500 36px var(--display);line-height:1.3}.energy-number>span{color:var(--muted);font-size:16px}.energy-icon{color:var(--accent);font-size:46px;line-height:1}.energy-meter{display:flex;gap:6px;margin-top:19px}.energy-meter i{height:7px;flex:1;background:#365044;border-radius:3px;transition:background .2s}.energy-meter .filled{background:var(--accent)}.energy-hint{font-size:13px;color:var(--muted);margin:10px 0 31px}.actions-heading h2{font-weight:500;font-size:17px;letter-spacing:-.25px;margin:0 0 3px}.actions-heading>span{font-size:13px;color:var(--muted)}.actions{display:flex;flex-direction:column;gap:10px;margin-top:17px}.action-card{display:flex;align-items:center;gap:13px;width:100%;text-align:left;padding:15px 13px;border:1px solid #ffffff20;border-radius:13px;background:#ffffff03;transition:border .15s,background .15s,transform .15s}.action-card:hover:not(:disabled){background:#ffffff09;border-color:#d5eb9a88;transform:translateY(-1px)}.action-card.active{border-color:var(--accent);background:#d5eb9a10}.action-card:disabled{opacity:.4}.action-symbol{font-size:30px;line-height:1;width:29px;flex-shrink:0;color:var(--accent);text-align:center}.grow-symbol{font:600 21px var(--display)}.action-copy{display:flex;flex-direction:column;gap:2px;flex:1}.action-copy strong{font-size:15px;font-weight:500}.action-copy>span{font-size:12px;color:var(--muted)}.cost{align-self:flex-start;display:flex;align-items:center;gap:5px;color:var(--accent);font-size:13px;margin-top:1px}.cost>span{font-size:17px}.status-message{margin-top:19px;font-size:14px;line-height:1.65;color:#c8d4c1;min-height:47px}.next-step{margin-top:23px;border-top:1px solid var(--line);padding-top:20px}.next-step>span{font-size:11px;letter-spacing:1.4px;color:var(--muted)}.next-step>div:not(.progress-track){display:flex;align-items:center;justify-content:space-between;margin:4px 0 9px}.next-step strong{font:600 26px var(--display);color:var(--accent)}.next-step div>span{font-size:12px;color:var(--muted)}.progress-track{height:3px;background:#ffffff15;border-radius:9px;overflow:hidden}.progress-track i{display:block;height:100%;background:#d5eb9a88;transition:width .4s}footer{display:flex;justify-content:space-between;color:#7e9a88;font-size:12px;padding:35px 0 27px;margin-top:23px;border-top:1px solid var(--line)}dialog{background:#1b382f;color:var(--text);border:1px solid #ffffff25;border-radius:22px;padding:34px;width:min(500px,calc(100% - 32px));max-height:90dvh;line-height:1.6}dialog::backdrop{background:#06160ec9;backdrop-filter:blur(6px)}dialog h2{font:500 29px var(--display);letter-spacing:-1px;margin:5px 0 20px}dialog ol{padding-left:21px;color:#c4d2c5;font-size:15px}dialog li{padding-left:4px;margin-bottom:15px}dialog strong{color:var(--text);font-weight:550}.dialog-close{position:absolute;top:17px;right:17px;border:0}.dialog-note{font-size:13px;color:var(--muted);margin:22px 0}.primary-button,.secondary-button{border:0;border-radius:10px;padding:12px 20px;font-size:15px;font-weight:600}.primary-button{background:var(--accent);color:var(--bg)}.secondary-button{background:#ffffff0d;color:var(--text)}.dialog-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:25px}.end-panel{position:absolute;inset:0;background:#0e241dea;backdrop-filter:blur(6px);border-radius:21px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:28px;z-index:2}.end-panel h2{font:500 37px var(--display);margin:0 0 12px;color:var(--accent);letter-spacing:-1px}.end-panel p{color:#c4d2c5;margin:0 0 22px;max-width:300px}.end-panel button{margin:5px}.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}@keyframes appear{from{transform:scale(.65);opacity:.4}to{transform:scale(1);opacity:1}}@keyframes merge{50%{transform:scale(1.07)}}@media(min-width:1300px){main{margin-top:55px}}@media(max-width:900px){.game-layout{gap:30px;grid-template-columns:minmax(0,1.3fr) minmax(260px,1fr)}main{width:calc(100% - 48px)}.masthead{padding:24px}.tile{font-size:clamp(24px,4vw,40px)}.board{gap:8px;padding:10px}.action-card{gap:9px;padding:13px 10px}.game-heading{gap:20px}}@media(max-width:650px){.masthead{padding:20px 22px}.brand{font-size:27px}.brand-description{display:none}.text-button{font-size:13px}main{width:calc(100% - 40px);max-width:450px;margin-top:27px}.game-heading{margin-bottom:23px}.game-heading .eyebrow{font-size:10px;letter-spacing:1.1px}h1{font-size:28px;letter-spacing:-1.1px}.target-label{gap:4px;flex-direction:column;font-size:10px}.target-label strong{font-size:19px;padding:6px 10px;border-radius:9px}.game-layout{display:flex;flex-direction:column;gap:28px}.score-bar{height:66px}.tile{font-size:clamp(27px,8vw,43px)}.tile.high,.tile[data-value="1024"]{font-size:clamp(22px,6vw,34px)}.board-caption{font-size:12px}.board{border-radius:17px}.tile{border-radius:10px}.strategy-panel{border-top:1px solid var(--line);padding-top:25px}.energy-heading{align-items:center}.energy-heading>div{display:flex;align-items:center;gap:15px}.energy-heading .eyebrow{margin:0}.energy-number{margin:0}.energy-number strong{font-size:28px}.energy-icon{font-size:34px}.energy-meter{margin-top:11px}.energy-hint{margin-bottom:24px}.action-card{padding:15px}.action-copy>span{font-size:13px}.actions-heading>span{font-size:14px}.status-message{min-height:0}.next-step{margin-top:21px}.direction-controls{padding-top:5px}.direction-controls button{height:42px;width:52px}.direction-controls>div{gap:8px}footer{display:block;margin-top:26px;padding:23px 0}footer span{display:block;margin:3px 0}.dialog-actions{flex-wrap:wrap}dialog{padding:28px}.energy-heading .eyebrow{font-size:12px}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}
