*{box-sizing:border-box}html,body{margin:0;background:#f7f6f1;color:#243e43;font-family:Arial,sans-serif}button,a{-webkit-tap-highlight-color:transparent}button{touch-action:manipulation;min-height:44px;padding:10px 18px;border:1px solid #afc6c5;border-radius:10px;background:white;color:#243e43;font:bold 17px Arial;cursor:pointer}button:focus-visible,a:focus-visible,.game-container:focus-visible{outline:3px solid #c17a20;outline-offset:4px}a{color:#286d72;text-underline-offset:3px}.layout{height:100dvh;max-width:1140px;margin:auto;padding:16px 28px;display:grid;grid-template-columns:minmax(240px,.8fr) minmax(0,1.2fr);grid-template-rows:36px minmax(0,1fr);gap:14px 40px}header{grid-column:1/-1;display:flex;justify-content:space-between;align-items:center;font-size:13px}header span{font-size:11px;letter-spacing:2px}.info{display:flex;flex-direction:column;justify-content:center;min-height:0;gap:12px}.eyebrow{font-size:10px;letter-spacing:2px;font-weight:bold;margin:0;color:#40828a}h1{font-size:clamp(70px,10vw,120px);line-height:.9;letter-spacing:-6px;margin:0}h1 span{color:#d2953a}.intro{font:26px Georgia,serif;margin:2px 0}.scores{display:flex;gap:10px}.scores>div{background:#e5eeeb;border:1px solid #c8d9d4;padding:10px 18px;border-radius:12px;display:flex;flex-direction:column;min-width:110px}.scores span{font-size:12px}.scores strong{font-size:30px;position:relative}.score-addition{position:absolute;left:0;top:-12px;font-size:22px;color:#ad6a11;animation:score-up .7s forwards}.restart-button{align-self:flex-start;background:#286d72;color:white;border-color:#286d72}.info>p:not(.eyebrow):not(.intro){font-size:15px;line-height:1.5;margin:0;max-width:360px}.direction-controls{display:flex;gap:7px}.direction-controls button{font-size:24px;min-width:48px}.info>.session-note{font-size:12px!important;color:#5e7374}footer{font-size:11px;line-height:1.6;color:#657c7c}.board-area{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:0}.game-container{position:relative;width:min(100%,calc(100dvh - 125px));aspect-ratio:1;background:#91a8a5;border-radius:18px;touch-action:none;overscroll-behavior:contain;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;flex-shrink:0}.grid-container{position:absolute;inset:12px;display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(4,1fr);gap:10px}.grid-cell{background:#b4c5c0;border-radius:9px}.tile-container{position:absolute;inset:12px}.tile{position:absolute;width:calc((100% - 30px)/4);height:calc((100% - 30px)/4);transition:transform .1s ease-in-out;z-index:2}.tile-inner{width:100%;height:100%;display:flex;align-items:center;justify-content:center;border-radius:9px;background:#f3eddf;color:#344e51;font-weight:800;font-size:clamp(26px,5vw,58px)}.tile-4 .tile-inner{background:#eee0b8}.tile-8 .tile-inner{background:#f1b66d;color:#4b3524}.tile-16 .tile-inner{background:#e99250;color:#fff}.tile-32 .tile-inner{background:#df7759;color:#fff}.tile-64 .tile-inner{background:#c9543f;color:#fff}.tile-128 .tile-inner,.tile-256 .tile-inner,.tile-512 .tile-inner{background:#d1a543;color:#fff;font-size:clamp(22px,4vw,44px)}.tile-1024 .tile-inner,.tile-2048 .tile-inner,.tile-super .tile-inner{background:#a7811d;color:#fff;font-size:clamp(20px,3.4vw,38px)}.tile-new .tile-inner{animation:tile-in .2s ease-out}.tile-merged .tile-inner{animation:tile-pop .2s ease-out}.tile-merged{z-index:3}.game-message{display:none;position:absolute;inset:0;background:#f7f4e8ed;z-index:20;border-radius:18px;align-items:center;justify-content:center;flex-direction:column;gap:15px}.game-message p{font:bold 38px Georgia,serif;margin:0}.game-message.game-over,.game-message.game-won{display:flex}.game-message .lower{display:flex;gap:10px}.keep-playing-button{display:none}.game-won .keep-playing-button{display:block}.board-caption{font:italic 17px Georgia,serif;color:#587773;margin:12px 0 0}
@keyframes tile-in{from{opacity:.3;transform:scale(.4)}to{opacity:1;transform:scale(1)}}@keyframes tile-pop{50%{transform:scale(1.15)}}@keyframes score-up{to{opacity:0;transform:translateY(-35px)}}
@media(max-height:680px) and (min-width:741px){.layout{padding:10px 22px;gap:6px 32px;grid-template-rows:28px 1fr}.info{gap:8px}h1{font-size:80px}.intro{font-size:22px}.info>p:not(.eyebrow):not(.intro){font-size:13px}.scores>div{padding:7px 14px}.scores strong{font-size:26px}.game-container{width:min(100%,calc(100dvh - 95px))}}
@media(max-width:740px){.layout{height:auto;min-height:100dvh;padding:12px 16px;grid-template-columns:1fr;grid-template-rows:auto auto auto;gap:16px}header span{display:none}.info{gap:10px}.eyebrow{display:none}h1{font-size:70px;letter-spacing:-4px}.intro{font-size:22px}.scores{position:absolute;right:16px;top:55px}.scores>div{padding:6px 12px;min-width:80px}.scores strong{font-size:24px}.restart-button{margin-top:0}.info>p:not(.session-note){max-width:none!important}.game-container{width:min(100%,440px)}.board-area{grid-row:3}footer{max-width:360px}.direction-controls{justify-content:center}.direction-controls button{flex:1}.tile-inner{font-size:clamp(28px,9vw,50px)}.tile-128 .tile-inner,.tile-256 .tile-inner,.tile-512 .tile-inner{font-size:clamp(25px,8vw,40px)}.tile-1024 .tile-inner,.tile-2048 .tile-inner,.tile-super .tile-inner{font-size:clamp(20px,7vw,34px)}}
@media(prefers-reduced-motion:reduce){.tile{transition:none}.tile-new .tile-inner,.tile-merged .tile-inner,.score-addition{animation:none}.score-addition{display:none}}

.tile-position-1-1{transform:translate(calc(0 * (100% + 10px)),calc(0 * (100% + 10px)))}
.tile-position-1-2{transform:translate(calc(0 * (100% + 10px)),calc(1 * (100% + 10px)))}
.tile-position-1-3{transform:translate(calc(0 * (100% + 10px)),calc(2 * (100% + 10px)))}
.tile-position-1-4{transform:translate(calc(0 * (100% + 10px)),calc(3 * (100% + 10px)))}
.tile-position-2-1{transform:translate(calc(1 * (100% + 10px)),calc(0 * (100% + 10px)))}
.tile-position-2-2{transform:translate(calc(1 * (100% + 10px)),calc(1 * (100% + 10px)))}
.tile-position-2-3{transform:translate(calc(1 * (100% + 10px)),calc(2 * (100% + 10px)))}
.tile-position-2-4{transform:translate(calc(1 * (100% + 10px)),calc(3 * (100% + 10px)))}
.tile-position-3-1{transform:translate(calc(2 * (100% + 10px)),calc(0 * (100% + 10px)))}
.tile-position-3-2{transform:translate(calc(2 * (100% + 10px)),calc(1 * (100% + 10px)))}
.tile-position-3-3{transform:translate(calc(2 * (100% + 10px)),calc(2 * (100% + 10px)))}
.tile-position-3-4{transform:translate(calc(2 * (100% + 10px)),calc(3 * (100% + 10px)))}
.tile-position-4-1{transform:translate(calc(3 * (100% + 10px)),calc(0 * (100% + 10px)))}
.tile-position-4-2{transform:translate(calc(3 * (100% + 10px)),calc(1 * (100% + 10px)))}
.tile-position-4-3{transform:translate(calc(3 * (100% + 10px)),calc(2 * (100% + 10px)))}
.tile-position-4-4{transform:translate(calc(3 * (100% + 10px)),calc(3 * (100% + 10px)))}
@media(max-width:380px){.scores{position:static}.scores>div{flex:1}.scores{width:100%}}

/* MacInTodd frame; preserve the original tile contrast and gameplay layout. */
body{background:#faf8f3;color:#172b4a;font-family:'Avenir Next','Trebuchet MS',Arial,sans-serif}.heading h1{color:#172b4a}.above-game button{border-radius:10px;background:#172b4a}.game-container{border-radius:15px}.score-container,.best-container{border-radius:9px}