:root{color-scheme:light;--paper:#eff5ff;--white:#fff;--ink:#253359;--muted:#637396;--line:#d0dcf0;--accent:#5676eb}
.game-page{background:radial-gradient(ellipse at 10% 4%,#fff7e3,transparent 45%),radial-gradient(ellipse at 90% 35%,#e2edff,transparent 50%),#eff5ff;color:#253359;font-family:system-ui,-apple-system,"Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif}
.game-page .header{border-color:#d2def0}.game-page .brand{font-size:24px;font-weight:850;letter-spacing:2px;color:#354571}.game-page .brand::before,.game-page .brand::after{content:none}
.game-page a{color:#3855af}.game-page .site-nav a[aria-current=page],.game-page .site-nav a[aria-current=page]::before{color:#253359}
.game-page button{min-height:46px;border:1px solid #c4d1ed;border-radius:12px;background:#fff;color:#354571;font-weight:700;box-shadow:0 3px 0 #cbd6ec;transition:transform .12s,background .12s}
.game-page button:hover{background:#f0f4ff;border-color:#8b9ed8}.game-page button:active{transform:translateY(2px);box-shadow:0 1px 0 #cbd6ec}.game-page button:focus-visible,.game-page a:focus-visible{outline:3px solid #ffad42;outline-offset:4px}
.game-page footer{color:#657597;border-color:#d2def0}.game-page ::selection{background:#c9dcff;color:#253359}
.game-intro{padding:25px 0 20px}.game-kicker{font-size:11px;font-weight:700;letter-spacing:.1em;color:#677bac}.game-intro h1{font-size:30px;font-weight:850;margin:3px 0}.game-intro p{color:#657597;margin:0;font-size:12px}
.game-library{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:28px}.game-card{display:flex;align-items:center;gap:12px;padding:14px 12px;border:2px solid transparent;border-radius:17px;min-height:88px;text-decoration:none!important;color:#354571!important;background:#ffffffc9;box-shadow:0 5px 0 #d8e2f6;transition:transform .15s,border-color .15s}
.game-card:hover{transform:translateY(-3px);border-color:#a6b8ed}.game-card.is-current{border-color:#5b7bea;background:#fff;box-shadow:0 5px 0 #bdcef9}.game-card strong{display:block;font-size:13px}.game-card small{display:block;font-size:10px;margin-top:4px;color:#7b87a3;line-height:1.5}
.game-card-icon{width:42px;height:42px;border-radius:13px;display:grid;place-items:center;background:linear-gradient(145deg,#a9bfff,#5b7bea);color:#fff;font-size:27px;font-weight:900;text-shadow:0 2px #415aa4;box-shadow:inset 0 2px #ffffff80,0 3px #425db4;flex-shrink:0}
.game-card[data-kind=snake] .game-card-icon{background:linear-gradient(145deg,#87e5c0,#2db995);box-shadow:inset 0 2px #ffffff80,0 3px #23836c}.game-card[data-kind=merge] .game-card-icon{background:linear-gradient(145deg,#ffe69b,#f4af54);box-shadow:inset 0 2px #ffffff80,0 3px #d98d38}.game-card[data-kind=runner] .game-card-icon{background:linear-gradient(145deg,#ffb5b0,#f5748a);box-shadow:inset 0 2px #ffffff80,0 3px #d05573}
.game-wrap{max-width:640px;margin:0 auto;background:#ffffffb5;padding:18px;border:1px solid #fff;border-radius:24px;box-shadow:0 14px 50px #768fb31a}.play-heading{margin:0 0 15px}.play-heading h2{font-size:21px;font-weight:850;margin:0}.play-heading p{font-size:11px;color:#7785a2;margin:5px 0 0}
.game-stats{display:flex;justify-content:space-between;gap:10px;margin:0 0 13px;font-size:12px;font-variant-numeric:tabular-nums}.game-stats div{display:flex;align-items:center;gap:7px}.game-stats dt{font-size:10px;color:#7c88a3}.game-stats dd{font-weight:800;font-size:17px;margin:0;color:#354571}
.game-surface{position:relative;border:4px solid #d6e1f7;border-radius:18px;background:#e5f0ff;overflow:hidden;box-shadow:inset 0 0 15px #5979b22b,0 5px 0 #c4d2ee}
#game,#mini-game{display:block;width:100%;height:auto;touch-action:none;user-select:none;-webkit-user-select:none;cursor:crosshair;outline-offset:-5px}
.game-page[data-game=snake] .game-surface{max-width:440px;margin:auto}
.game-overlay{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:9px;pointer-events:none;background:#f2f7ff70;text-align:center;padding:16px;backdrop-filter:blur(1px)}
#overlay-title{font-size:37px;line-height:1.2;font-weight:950;color:#4c68bb;letter-spacing:2px;text-shadow:0 3px #fff,0 6px #adbee333}#overlay-note{font-size:12px;color:#607397;background:#ffffffe0;padding:6px 16px;border-radius:99px}
.game-actions{display:flex;gap:9px;margin-top:17px}.game-actions button{flex:1;font-size:12px;padding:8px}.game-page #start-game,.game-page .jump-button{background:#5c7bec;border-color:#5c7bec;color:#fff;box-shadow:0 4px 0 #3f58bb}.game-page #start-game:hover,.game-page .jump-button:hover{background:#4b6bda}
.game-status{font-size:11px;min-height:1.8em;color:#617294;margin:12px 0}.direction-buttons{display:flex;align-items:center;gap:14px;justify-content:center}.direction-buttons button{width:90px;min-height:48px;font-size:22px;touch-action:none;user-select:none}.direction-buttons span{font-size:10px;color:#7888a5}.game-help{font-size:11px;line-height:1.9;color:#7787a4;margin:17px 0 0}
.sound-controls{display:flex;gap:18px;align-items:center;justify-content:space-between;padding-top:16px;margin-top:15px;border-top:1px dashed #d7e1f3}.sound-controls button{font-size:11px;min-height:44px;min-width:140px}.sound-controls button[aria-pressed=false]{background:#ecf0f7;color:#8793aa}.sound-controls label{display:flex;align-items:center;gap:8px;font-size:11px;color:#7c8baa}.sound-controls input{width:100px;accent-color:#5b7bea;min-height:44px}.save-note{font-size:10px;color:#94a0b6;margin:9px 0 0}
.dpad{display:grid;grid-template-columns:repeat(3,56px);grid-template-rows:repeat(2,48px);gap:7px;justify-content:center;margin:14px auto}.dpad button{font-size:22px;touch-action:none}.dpad [data-direction=up]{grid-column:2}.dpad [data-direction=left]{grid-row:2;grid-column:1}.dpad [data-direction=down]{grid-row:2;grid-column:2}.dpad [data-direction=right]{grid-row:2;grid-column:3}
.game-page .jump-button{width:100%;font-size:18px;min-height:58px;margin-top:4px;touch-action:none}.jump-button small{font-size:11px;font-weight:500;margin-left:12px}
.merge-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;padding:12px;max-width:440px;margin:auto;background:#c7d3e8;border-radius:18px;box-shadow:inset 0 3px 8px #8499b845,0 5px 0 #a7bad7;touch-action:none;user-select:none;outline-offset:4px}
.merge-tile{display:flex;align-items:center;justify-content:center;aspect-ratio:1;border-radius:12px;background:#e0e7f2;color:#435a83;font-size:clamp(23px,5vw,36px);font-weight:850;box-shadow:inset 0 1px #ffffff80;animation:tile-in .15s ease-out}.merge-tile[data-level="1"]{background:#faf5e9;box-shadow:0 4px #d7cdb8}.merge-tile[data-level="2"]{background:#ffe8b6;box-shadow:0 4px #d8bc85}.merge-tile[data-level="3"]{background:#ffbe7a;color:#fff;box-shadow:0 4px #d79958}.merge-tile[data-level="4"]{background:#ff957f;color:#fff;box-shadow:0 4px #d47763}.merge-tile[data-level="5"]{background:#f57896;color:#fff;box-shadow:0 4px #d25e79}.merge-tile[data-level="6"]{background:#bc8bdc;color:#fff;box-shadow:0 4px #9868b9}.merge-tile[data-level="7"]{background:#8b9be9;color:#fff;box-shadow:0 4px #6d7ecc}.merge-tile[data-level="8"]{background:#65b6dd;color:#fff;box-shadow:0 4px #4d92b4}.merge-tile[data-level="9"]{background:#57c5b1;color:#fff;box-shadow:0 4px #3e9c8b}.merge-tile[data-level="10"]{background:#eac361;color:#fff;box-shadow:0 4px #bd9b46;font-size:26px}.merge-tile[data-level="11"]{background:#f3b442;color:#fff;box-shadow:0 4px #cf8f25;font-size:26px}
@keyframes tile-in{from{transform:scale(.94)}to{transform:scale(1)}}
@media(max-width:700px){.game-library{grid-template-columns:repeat(2,1fr);gap:10px;margin-bottom:20px}.game-card{padding:11px;min-height:74px}.game-card-icon{width:36px;height:36px;font-size:23px}.game-intro{padding:22px 0 17px}.game-intro h1{font-size:26px}.game-wrap{padding:13px;border-radius:18px}.game-stats{gap:5px}.game-stats div{gap:4px}.game-stats dd{font-size:15px}.game-stats dt{font-size:9px}.sound-controls{gap:8px}.sound-controls input{width:85px}.sound-controls button{min-width:125px}.direction-buttons{gap:9px}.direction-buttons span{font-size:9px}.merge-grid{gap:8px;padding:10px}.merge-tile{border-radius:9px}.game-page .brand{font-size:20px}.game-page .site-nav{gap:12px}#overlay-title{font-size:30px}}
@media(prefers-reduced-motion:reduce){.game-card,.game-page button{transition:none}.merge-tile{animation:none}.game-overlay{backdrop-filter:none}}

.sound-controls{flex-wrap:wrap;gap:9px}.sound-controls select{min-height:44px;border:1px solid #c4d1ed;border-radius:10px;background:#fff;color:#354571;font-size:16px;padding:5px 8px}.sound-controls label{white-space:nowrap}

.game-overlay{background:linear-gradient(transparent 20%,#f2f7ff30 80%);backdrop-filter:none}#overlay-title{background:#f3f8ffb0;border-radius:14px;padding:4px 13px}