.arcade-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.arcade-card{min-width:0;min-height:505px;padding:24px;border-radius:26px;display:flex;flex-direction:column;overflow:hidden;background:radial-gradient(circle at 90% 3%,rgba(107,130,255,.12),transparent 43%),var(--glass)}
.arcade-card h3{font-family:"DM Serif Display","Songti SC",serif;font-size:28px;font-weight:400;margin:24px 0 10px}
.arcade-card>p{color:#93a1b1;font-size:12px;line-height:1.65;margin:0 0 17px;min-height:40px}
.merge-meta{display:flex;justify-content:space-between;gap:8px;color:#b1c7d9;font-size:12px;margin:0 0 10px}.merge-meta b{color:#f6e7cb;font-size:16px}.merge-meta span:last-child{text-align:right;color:#7e9bad}
.merge-board{width:min(100%,326px);aspect-ratio:1;display:grid;grid-template-columns:repeat(4,1fr);gap:7px;padding:7px;margin:0 auto 13px;border:1px solid rgba(255,255,255,.11);border-radius:17px;background:#0b1320;touch-action:none;outline:none;box-shadow:inset 0 8px 25px #0005}
.merge-board:focus-visible{box-shadow:0 0 0 2px #8debd9,inset 0 8px 25px #0005}
.merge-tile{display:grid;place-items:center;border-radius:10px;background:rgba(255,255,255,.055);font:600 clamp(17px,2vw,26px)/1 "Noto Sans SC",sans-serif;color:#f7f4e9;transition:background .17s,transform .17s;user-select:none}
.tile-2{background:#2a4a55}.tile-4{background:#316275}.tile-8{background:#397787}.tile-16{background:#507e98}.tile-32{background:#626cab}.tile-64{background:#8b6da6}.tile-128{background:#b379a4}.tile-256{background:#c47b8b}.tile-512{background:#d48b71}.tile-1024{background:#ce9b6d;font-size:20px}.tile-2048{background:linear-gradient(135deg,#f1bd73,#e58fa3);color:#2b1e30;font-size:20px;box-shadow:0 0 21px #f0bc7766}
.pixel-colors{display:flex;gap:7px;margin:0 0 12px;justify-content:center}.pixel-color{width:27px;height:27px;flex:0 0 27px;background:var(--paint);border:2px solid #ffffff33;border-radius:50%;cursor:pointer;transition:transform .16s}.pixel-color:last-child{position:relative}.pixel-color:last-child:after{content:"×";position:absolute;inset:0;color:#fff;font-size:16px;line-height:22px}.pixel-color.selected{transform:translateY(-4px);outline:2px solid #e9f8ff;outline-offset:2px}
.pixel-board{width:min(100%,326px);aspect-ratio:1;display:grid;grid-template-columns:repeat(12,1fr);gap:1px;padding:6px;margin:0 auto 13px;border-radius:17px;background:#182438;touch-action:none;user-select:none;border:1px solid rgba(255,255,255,.12)}
.pixel-cell{background:transparent;border-radius:2px;box-shadow:inset 0 0 0 1px #ffffff0d}.pixel-cell:nth-child(odd){background-color:#ffffff08}
.arcade-card .wonder-bottom{margin-top:auto}.arcade-card .wonder-bottom button{padding:7px 0}
.quest-progress{color:#a8d7cf;font-size:12px;margin:4px 0 20px}.quest-progress>div{height:7px;border-radius:10px;background:#ffffff12;margin-top:9px;overflow:hidden}.quest-progress i{display:block;width:0;height:100%;border-radius:10px;background:linear-gradient(90deg,#66e7d0,#9c9ff1);transition:width .35s}
.quest-list{display:grid;gap:10px}.quest-item{display:flex;align-items:center;gap:12px;width:100%;min-height:70px;padding:12px;border:1px solid #ffffff15;border-radius:14px;text-align:left;background:#ffffff06;color:#d8e4e8;font:inherit;font-size:12px;line-height:1.5;cursor:pointer;transition:background .2s,border-color .2s,transform .2s}.quest-item:hover{transform:translateY(-2px);border-color:#ffffff33}.quest-item.done{background:#69e9ca18;border-color:#69e9ca55}.quest-item>span:nth-child(2){flex:1}.quest-icon{font-size:23px}.quest-check{font-size:21px;color:#8fa3b0}.quest-item.done .quest-check{color:#71edcf}.quest-finish{margin-top:auto;padding:20px 0 2px;font-size:12px;color:#90a4b6}.quest-finish.complete{color:#f3d992;text-shadow:0 0 17px #f3d99266}
@media(max-width:1000px){.arcade-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.arcade-card:last-child{grid-column:1/-1;min-height:380px}}
@media(max-width:680px){.arcade-grid{grid-template-columns:1fr}.arcade-card{min-height:480px}.arcade-card:last-child{grid-column:auto;min-height:400px}.merge-board,.pixel-board{width:min(100%,300px)}.merge-tile{font-size:clamp(16px,6vw,26px)}}