.game-launch{display:flex;width:100%;margin:0 0 9px;background:#7b3b81;color:#fff}
.game-launch:hover{background:#622c67}
.game-overlay[hidden],.game-colors[hidden],#gameClearPaint[hidden]{display:none!important}
.game-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:50;overflow-y:auto;-webkit-overflow-scrolling:touch;background:rgba(9,34,54,.87);padding:18px}
body.game-open{overflow:hidden}
.game-shell{max-width:1070px;margin:0 auto;background:#f7fbfa;border-radius:24px;padding:22px;box-shadow:0 20px 70px #071e3090}
.game-header{display:flex;align-items:center;justify-content:space-between;gap:15px}
.game-header h2{font-size:1.8rem;margin:2px 0}
.game-notice{margin:12px 0 16px;background:#fff4d6;border-left:5px solid #e9ab35;border-radius:8px;padding:11px 14px;font-weight:700;line-height:1.4}
.game-stepbar{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;margin:0 0 15px}
.game-stepbar span{background:#e5eeef;border:2px solid #d3e2e5;border-radius:10px;padding:10px 5px;text-align:center;font-weight:800;color:#335c6b}
.game-stepbar span[aria-current="step"]{background:#d9f0ed;border-color:#17778a;color:#124c60}
.game-content{display:grid;grid-template-columns:minmax(0,1fr) 245px;gap:18px;align-items:start}
.game-workspace,.game-preview{background:#fff;border:1px solid #d2e2e3;border-radius:17px;padding:14px}
#gameCanvas{display:block;width:100%;height:auto;background:#eef5f4;border:2px solid #b7d2d4;border-radius:12px;touch-action:none}
.game-instruction{font-size:1.04rem;font-weight:750;color:#214d62;min-height:2.8em;line-height:1.4;margin:11px 0}
.game-colors{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0}
.game-colors button{min-height:50px;border:3px solid #cadcde;background:#fff;border-radius:12px;padding:7px 12px;font-weight:800;color:#17455a;display:flex;align-items:center;gap:8px}
.game-colors button[aria-pressed="true"]{border-color:#0a718a;background:#e4f6f3}
.game-colors i{width:24px;height:24px;display:inline-block;border-radius:50%;border:1px solid #0002}
.game-controls{display:flex;flex-wrap:wrap;gap:8px}
.game-controls .button{flex:1;min-width:135px}
.game-preview strong{display:block;font-size:1.08rem;color:#16435b;margin:0 0 10px}
.game-preview canvas{display:block;width:100%;height:auto;border:6px solid #fff;box-shadow:0 4px 15px #113a5240}
.game-preview p{line-height:1.5;font-size:.88rem;color:#476b78;margin:12px 0 0}
@media(max-width:780px){.game-content{grid-template-columns:1fr}.game-preview{display:flex;gap:12px;align-items:center}.game-preview canvas{width:138px;flex:none}.game-preview p{margin:0}}
@media(max-width:560px){.game-overlay{padding:0}.game-shell{border-radius:0;min-height:100%;padding:14px}.game-header h2{font-size:1.45rem}.game-header .button{max-width:150px;font-size:.85rem}.game-stepbar{grid-template-columns:repeat(2,1fr)}.game-preview canvas{width:90px}.game-preview strong{max-width:90px;font-size:.95rem}.game-preview p{font-size:.8rem}.game-controls .button{min-width:115px}}
@media print{.game-overlay{display:none!important}.game-launch{display:none!important}}