@import url('./style.css');
.shell{max-width:1376px;padding:0 clamp(20px,4vw,48px);margin:auto}.header{height:86px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{font-size:26px;font-weight:600;letter-spacing:-1.4px}.brand span{font-weight:300;color:#b6b6b6}.brand sup{font-size:12px;vertical-align:top;display:inline-block;margin:4px 0 0 5px;letter-spacing:0}.header-label{font:12px var(--mono);letter-spacing:1px;color:var(--mute)}.quiet-button{border:1px solid #424242;background:linear-gradient(#303030,#272727);height:38px;min-width:42px;padding:0 13px;border-radius:8px;box-shadow:inset 0 1px #ffffff06,0 2px 3px #0003;font-size:14px}.quiet-button:hover{background:#393939}.portal-main{padding-top:0}.welcome{display:flex;align-items:flex-end;justify-content:space-between;gap:30px;padding:42px 0 34px}.welcome .eyebrow{margin:0 0 15px}.welcome h1{font-size:clamp(46px,5.1vw,72px);font-weight:300;letter-spacing:-.045em;line-height:1.08;margin:0}.welcome h1 span{color:#898989}.welcome-note{margin:0 2px 2px 0;color:var(--mute);font-size:16px;line-height:1.8}.section-bar{display:flex;align-items:center;justify-content:space-between;margin:0 0 19px;border-top:1px solid var(--line);padding-top:23px}.section-bar h2{display:flex;align-items:center;gap:12px;font-size:16px;font-weight:450;margin:0}.count{font:12px var(--mono);color:var(--mute);padding:3px 7px;border:1px solid #424242;border-radius:5px}.section-note{font-size:13px;color:var(--mute)}.game-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.game-card{min-width:0;overflow:hidden;border:1px solid #424242;border-radius:15px;background:linear-gradient(140deg,#2b2b2b,#242424);box-shadow:inset 0 1px #ffffff05,0 8px 22px #00000015;transition:transform .2s,border-color .2s,box-shadow .2s}.game-card:hover{transform:translateY(-5px);border-color:#717171;box-shadow:0 16px 30px #0003}.card-preview{height:270px;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;border-bottom:1px solid #454545;padding:42px 20px 47px}.preview-id{position:absolute;top:17px;left:20px;font:12px var(--mono);letter-spacing:.7px;opacity:.7}.preview-word{position:absolute;bottom:16px;left:20px;font:12px var(--mono);letter-spacing:2px;opacity:.65}.chroma-preview{background:radial-gradient(ellipse at 50% 45%,#424242,#2c2c2c 75%);color:#dbdbdb}.snake-preview{background:radial-gradient(ellipse at 50% 45%,#363636,#272727 75%);color:#cbcbcb}.merge-preview{background:radial-gradient(ellipse at 50% 45%,#3d3d3d,#2a2a2a 75%);color:#cccccc}.preview-chroma{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;width:174px;aspect-ratio:1}.preview-chroma i{border-radius:5px;background:#a7a7a7;box-shadow:inset 0 1px #ffffff26,0 3px 4px #0002}.preview-chroma i:nth-child(5){background:#d4d4d4}.preview-snake{display:grid;grid-template-columns:repeat(12,1fr);gap:3px;width:200px;aspect-ratio:1;padding:5px}.preview-snake i{border:1px solid #ffffff05;border-radius:2px;background:#ffffff02}.preview-snake i.segment{background:#aaaaaa;border-color:#c1c1c1;box-shadow:0 2px 3px #0002}.preview-snake i.head{background:#e0e0e0}.preview-snake i.food{background:#c4c4c4;border-color:#c4c4c4;border-radius:50%}.preview-merge{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:repeat(4,minmax(0,1fr));gap:6px;width:190px;aspect-ratio:1}.preview-merge i{display:flex;align-items:center;justify-content:center;border-radius:5px;background:#747474;color:#e6e6e6;font:500 17px var(--mono);box-shadow:inset 0 1px #ffffff18,0 3px 4px #0002}.preview-merge i:empty{background:#ffffff07;box-shadow:none}.preview-merge i:nth-child(n+9){background:#909090;color:#f2f2f2}.preview-merge i.big-number{background:#afafaf;font-size:13px;color:#343434}.preview-merge i.gold-number{background:#d8d8d8;font-size:13px;color:#343434}.card-body{padding:22px 23px 0}.card-title-line{display:flex;align-items:center;justify-content:space-between;gap:15px}.card-title-line h3{font-size:27px;font-weight:400;letter-spacing:-1px;line-height:1.3;margin:0}.tag{font-size:12px;color:#b7b7b7;border:1px solid #484848;border-radius:5px;padding:4px 8px}.game-name{font-size:14px;color:#b5b5b5;margin:6px 0 15px}.card-description{font-size:14px;line-height:1.7;color:var(--mute);margin:0;min-height:48px}.card-bottom{margin-top:19px;padding:17px 0 19px;border-top:1px solid #3d3d3d;display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:12px;color:var(--mute)}.play-link{font-size:14px;color:var(--ink);white-space:nowrap}.bottom-note{display:flex;align-items:center;gap:13px;min-height:96px}.note-mark{font-size:25px;color:#a0a0a0}.bottom-note p{font-size:14px;color:var(--mute);margin:0}.bottom-note .mono{margin-left:auto;color:var(--soft);font-size:12px;letter-spacing:.7px}
.back-link{font-size:14px;color:var(--mute)}.header-actions{display:flex;gap:8px}.play-layout{display:grid;grid-template-columns:minmax(220px,1fr) minmax(350px,480px);gap:clamp(35px,8vw,110px);max-width:1040px;margin:0 auto 30px;align-items:center}.game-intro h1{font-size:clamp(56px,6vw,82px);line-height:1.1;letter-spacing:-.05em;font-weight:300;margin:19px 0}.game-subtitle{font-size:20px;font-weight:400;margin:0 0 22px;color:#b7b7b7}.game-intro>p:not(.eyebrow){color:var(--mute);font-size:16px;line-height:1.85}.rules-list{padding:20px 0 0;list-style:none;border-top:1px solid var(--line);margin:26px 0 0}.rules-list li{color:var(--mute);font-size:14px;line-height:1.8;padding:5px 0}.rules-list li span{font:12px var(--mono);margin-right:13px;color:var(--soft)}.game-panel{padding:21px;background:linear-gradient(145deg,#292929,#232323 50%,#1f1f1f);border:1px solid #424242;border-radius:18px;box-shadow:inset 0 1px #ffffff08,0 12px 35px #0002}.stats-row{display:flex;justify-content:space-between;gap:15px;padding:0 3px 17px;border-bottom:1px solid #3e3e3e}.stat-label{display:block;font-size:12px;color:var(--mute);margin-bottom:7px}.stat-value{font:29px var(--mono);letter-spacing:-1px}.board-container{margin-top:18px;padding:9px;background:#191919;border:1px solid #141414;border-radius:11px;position:relative;box-shadow:inset 0 3px 6px #0006;touch-action:none;user-select:none}.snake-canvas{display:block;width:100%;height:auto;aspect-ratio:1;border-radius:5px}.merge-board{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:repeat(4,minmax(0,1fr));gap:8px;aspect-ratio:1}.merge-cell{display:flex;align-items:center;justify-content:center;border-radius:7px;background:#2a2a2a;font:450 clamp(22px,3vw,37px) var(--mono);color:#e2e2e2;box-shadow:inset 0 1px #ffffff08;min-width:0}.merge-cell[data-value='2']{background:#676767}.merge-cell[data-value='4']{background:#7a7a7a}.merge-cell[data-value='8']{background:#868686}.merge-cell[data-value='16']{background:#8f8f8f}.merge-cell[data-value='32']{background:#939393}.merge-cell[data-value='64']{background:#878787}.merge-cell[data-value='128']{background:#adadad;color:#2c2c2c}.merge-cell[data-value='256']{background:#bbbbbb;color:#2c2c2c}.merge-cell[data-value='512']{background:#c8c8c8;color:#2c2c2c}.merge-cell[data-value='1024'],.merge-cell[data-value='2048']{background:#d8d8d8;color:#2c2c2c;font-size:clamp(20px,2.5vw,30px)}.merge-cell:not([data-value='0']){box-shadow:inset 0 1px #ffffff22,0 2px 4px #0003}.game-panel-bottom{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:17px}.solid-button{display:flex;align-items:center;justify-content:space-between;gap:24px;border:1px solid #ececec;border-radius:8px;background:linear-gradient(#efefef,#d6d6d6);box-shadow:inset 0 1px #fff,0 3px 5px #0004;color:#242424;min-height:45px;padding:0 16px;font-size:14px}.solid-button:hover{filter:brightness(1.07)}.game-status{font-size:13px;color:var(--mute);line-height:1.5}.game-overlay{position:absolute;inset:0;padding:24px;border-radius:10px;background:#1f1f1fed;backdrop-filter:blur(8px);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}.game-overlay h2{font-size:33px;font-weight:300;letter-spacing:-1px;margin:15px 0}.game-overlay p{font-size:15px;color:var(--mute);line-height:1.8;margin:0 0 23px;white-space:pre-line}.game-controls{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:16px}.direction-button{width:46px;height:42px;background:linear-gradient(#303030,#272727);border:1px solid #484848;border-radius:8px;font-size:19px;box-shadow:inset 0 1px #ffffff08,0 2px 3px #0003;touch-action:manipulation}.direction-button:active{transform:translateY(1px);background:#444444}.control-hint{text-align:center;color:var(--mute);font-size:12px;margin:12px 0 0}.game-footnote{max-width:1040px;margin:26px auto 25px;border-top:1px solid var(--line);padding-top:21px;display:flex;justify-content:space-between;gap:20px;color:var(--mute);font-size:13px}.game-footnote a{color:#d0d0d0}.game-footnote .mono{font-size:12px}
@media(max-width:1000px){.game-cards{gap:15px}.card-preview{height:250px}.card-body{padding:19px 18px 0}.card-bottom{flex-wrap:wrap;gap:12px}.card-description{min-height:72px}.play-layout{gap:38px}.preview-chroma{width:160px}.preview-merge{width:178px}.preview-snake{width:187px}}
@media(max-width:760px){.header{height:76px}.brand{font-size:23px}.header-label{font-size:12px;letter-spacing:.3px}.welcome{padding:30px 0 27px;display:block}.welcome h1{font-size:49px}.welcome h1 span{display:inline}.welcome-note{font-size:14px;margin-top:16px;line-height:1.6}.welcome-note br{display:none}.section-bar{padding-top:20px}.section-note{font-size:12px}.game-cards{grid-template-columns:1fr;gap:20px}.game-card{display:grid;grid-template-columns:40% 60%;border-radius:13px}.card-preview{height:100%;min-height:228px;border-bottom:0;border-right:1px solid #454545;padding:35px 12px 40px}.preview-id{font-size:12px;left:12px;top:14px;letter-spacing:0}.preview-word{left:12px;bottom:13px;font-size:12px;letter-spacing:.9px}.preview-chroma{width:100%;max-width:150px;gap:5px}.preview-snake{width:100%;max-width:160px;gap:2px;padding:0}.preview-merge{width:100%;max-width:160px;gap:4px}.preview-merge i{font-size:13px;border-radius:3px}.preview-merge i.big-number,.preview-merge i.gold-number{font-size:12px;letter-spacing:-1px}.card-body{padding:19px 15px 0}.card-title-line h3{font-size:24px}.card-description{min-height:48px;font-size:14px}.game-name{margin:5px 0 12px}.card-bottom{padding:14px 0 16px;margin-top:14px;gap:8px}.tag{padding:3px 5px}.bottom-note{min-height:86px}.bottom-note .mono{display:none}.bottom-note p{font-size:13px}.play-layout{display:flex;flex-direction:column;gap:22px;align-items:stretch;max-width:480px}.game-intro h1{font-size:52px;margin:11px 0}.game-subtitle{font-size:17px;margin:0 0 10px}.game-intro>p:not(.eyebrow){font-size:14px;margin-bottom:0}.rules-list{display:none}.game-panel{padding:17px}.stat-value{font-size:26px}.merge-cell{font-size:28px}.merge-cell[data-value='1024'],.merge-cell[data-value='2048']{font-size:22px}.game-footnote{max-width:480px;font-size:12px;gap:15px}.game-overlay h2{font-size:28px}.game-overlay p{font-size:14px}.game-status{font-size:12px}.game-controls{gap:12px}.direction-button{width:52px;height:44px}.header-actions{gap:6px}.back-link{font-size:13px}.game-footnote .mono{display:none}}
@media(max-width:380px){.shell{padding:0 16px}.welcome h1{font-size:44px}.card-body{padding:16px 12px 0}.card-title-line h3{font-size:22px}.game-card{grid-template-columns:38% 62%}.card-bottom{font-size:12px}.merge-board{gap:6px}.merge-cell{font-size:25px}.header-label{display:none}.tag{font-size:12px}.preview-merge{gap:3px}}

.rules-list b{font-weight:400}
@media(max-width:480px){.game-card{display:block}.card-preview{height:224px;min-height:224px;border-right:0;border-bottom:1px solid #454545;padding:37px 20px 42px}.preview-chroma{width:146px;max-width:146px}.preview-snake{width:163px;max-width:163px}.preview-merge{width:160px;max-width:160px}.card-description{min-height:0}.card-body{padding:20px 20px 0}.card-bottom{flex-wrap:nowrap}.preview-id,.preview-word{left:20px}}