:root{--accent:#e94c67;--accent2:#ffe76a;--site-surface:#fff7fb;--site-text:#293441;--site-hero:#ffd7e6;--site-border:#2f3942}
.game-page{background-color:#cdeff0;background-image:radial-gradient(circle at 20px 20px,#fff 0 3px,transparent 4px),radial-gradient(circle at 70px 55px,rgba(233,76,103,.2) 0 5px,transparent 6px);background-size:90px 80px;font-family:Arial,"Microsoft YaHei",sans-serif}
.game-layout{width:min(1080px,calc(100% - 24px))}
.game-topbar{padding:12px 18px;background:#fff;border:3px solid #27313a;border-bottom:8px solid #e94c67;box-shadow:0 8px 0 rgba(39,49,58,.12)}
.brand{color:#e94c67;font-size:13px;font-weight:900}.game-title h1{color:#2d3c4b;font-size:27px}.game-title p{color:#e94c67}.action-btn{background:#ffe76a;border:3px solid #27313a;border-radius:7px;box-shadow:3px 3px 0 #27313a}.action-btn:hover{background:#fff18e}
.stage-wrap{grid-template-columns:225px minmax(0,1fr)}.side-panel{order:-1}.side-panel .panel-box{grid-column:auto}.gem-stage{min-height:620px;background:#724b9c;border:8px solid #3c2856;box-shadow:0 10px 0 #2a3540;padding:18px;animation:candyIn .48s cubic-bezier(.2,.8,.2,1)}
.gem-stage:before,.gem-stage:after{content:"";position:absolute;top:12px;width:14px;height:14px;border-radius:50%;background:#ffe76a;box-shadow:0 0 0 3px #3c2856}.gem-stage:before{left:12px}.gem-stage:after{right:12px}
.gem-board{width:min(550px,100%);aspect-ratio:1;display:grid;grid-template-columns:repeat(8,1fr);gap:6px;padding:13px;background:#251d3d;border:4px solid #f9f4ff;border-radius:8px;box-shadow:inset 0 0 0 4px #9a73c4}
.gem{border:0;min-width:0;cursor:pointer;position:relative;background:rgba(255,255,255,.05);border-radius:6px}.gem:before{content:"";position:absolute;inset:10%;clip-path:polygon(50% 0,92% 26%,78% 88%,50% 100%,22% 88%,8% 26%);background:var(--gem);filter:drop-shadow(0 5px 0 color-mix(in srgb,var(--gem),#000 26%)) drop-shadow(0 0 4px rgba(255,255,255,.35));transition:transform .15s}.gem:hover:before,.gem.selected:before{transform:scale(1.12)}.gem.selected{outline:3px solid #ffe76a;outline-offset:-3px}.gem.removing:before{animation:vanish .25s forwards}
.stat,.panel-box{background:#fff;border:3px solid #27313a;border-radius:7px;box-shadow:4px 4px 0 #75c8ca}.stat:nth-child(2){background:#ffe76a}.stat strong{color:#e94c67}.panel-box h2{color:#724b9c}.overlay{background:rgba(48,29,72,.84)}.overlay-card button{background:#ffe76a;border:3px solid #2d203e;border-radius:7px;box-shadow:4px 4px 0 #2d203e}
button{transition:transform .15s ease,filter .15s ease}button:active{transform:scale(.96)}@keyframes candyIn{from{opacity:0;transform:translateY(14px) scale(.985)}to{opacity:1;transform:none}}
@keyframes vanish{to{transform:scale(0) rotate(45deg);opacity:0}}
@media(max-width:900px){.stage-wrap{grid-template-columns:1fr}.gem-stage{order:0}.side-panel{order:1;grid-template-columns:repeat(2,1fr)}.side-panel .panel-box{grid-column:span 2}}
@media(max-width:560px){.gem-stage{min-height:calc(100vw - 24px);padding:8px;border-width:5px}.gem-board{gap:3px;padding:6px;border-width:3px}.game-topbar{border-bottom-width:5px}}
@media(max-width:560px){.top-actions .action-btn{display:block;width:42px;padding:0;font-size:0}.top-actions .action-btn:after{content:"↻";font-size:22px}}