/* 새 게임 공통 업그레이드 스타일 (games.css 위에 덧입힘) */
.g2-badges{ display:flex; justify-content:center; gap:8px; flex-wrap:wrap; margin:0 0 16px; }
.g2-badge{ display:inline-flex; align-items:center; gap:5px; background:#fff; color:#1F1A2E; border:2px solid #1F1A2E; border-radius:999px; padding:5px 12px; font-size:12.5px; font-weight:800; box-shadow:2px 2px 0 #1F1A2E; }
.g2-badge.hot{ background:#FFE2D9; }
.g2-badge.lime{ background:#E9F9B8; }
.g2-badge.lav{ background:#E6E4FF; }
.g-area .g-canvas, .g-area .g2-arena{ border:3px solid #1F1A2E; border-radius:24px; box-shadow:6px 6px 0 #1F1A2E; background:#fff; }
.g2-arena{ position:relative; width:100%; max-width:360px; aspect-ratio:3/4; overflow:hidden; touch-action:none; }
.g2-arena.dark{ background:#1F1A2E; }
.g-card .g-area{ padding:2px 6px 8px; }
.g2-taunt{ position:absolute; left:0; right:0; top:10px; text-align:center; font-weight:900; font-size:16px; color:#D93A1C; pointer-events:none; text-shadow:0 1px 0 #fff; }
.g2-big{ font-size:46px; font-weight:900; color:#D93A1C; }
.g2-run{ position:absolute; border:3px solid #1F1A2E; border-radius:999px; background:#C9F24B; color:#1F1A2E; font-weight:900; font-size:15px; box-shadow:3px 3px 0 #1F1A2E; cursor:pointer; padding:0; font-family:inherit; display:flex; align-items:center; justify-content:center; }
.g2-pad{ display:grid; grid-template-columns:repeat(4,1fr); gap:8px; width:100%; max-width:360px; margin-top:12px; }
.g2-pad.five{ grid-template-columns:repeat(5,1fr); }
.g2-pad button{ aspect-ratio:1; border:2.5px solid #1F1A2E; border-radius:16px; background:#fff; color:#1F1A2E; font-size:24px; font-weight:900; font-family:inherit; box-shadow:3px 3px 0 #1F1A2E; cursor:pointer; padding:0; transition:transform .06s; }
.g2-pad button:active{ transform:translate(2px,2px); box-shadow:1px 1px 0 #1F1A2E; }
.g2-pad button.ok{ background:#C9F24B; }
.g2-pad button.no{ background:#FFB4A3; animation:gshake .28s; }
.g2-row{ display:flex; gap:8px; justify-content:center; flex-wrap:wrap; width:100%; margin:6px 0; }
.g2-card{ width:58px; height:74px; border:2.5px solid #1F1A2E; border-radius:14px; background:#fff; font-size:32px; display:flex; align-items:center; justify-content:center; box-shadow:3px 3px 0 #1F1A2E; }
.g2-card.back{ background:#5B4BE0; color:#fff; font-size:26px; }
.g2-word{ font-size:44px; font-weight:900; margin:34px 0 10px; color:#1F1A2E; min-height:60px; }
.g2-list{ display:grid; grid-template-columns:repeat(2,1fr); gap:8px; width:100%; max-width:360px; }
.g2-list span{ background:#fff; border:2px solid #1F1A2E; border-radius:12px; padding:9px 4px; font-weight:800; font-size:16px; }
.g2-ans{ display:flex; gap:12px; justify-content:center; margin-top:14px; width:100%; }
.g2-ans button{ flex:1; max-width:150px; padding:16px 0; border:2.5px solid #1F1A2E; border-radius:18px; font-size:19px; font-weight:900; font-family:inherit; cursor:pointer; box-shadow:4px 4px 0 #1F1A2E; }
.g2-ans .y{ background:#C9F24B; } .g2-ans .n{ background:#FFD0C2; }
.g2-arrow{ font-size:96px; line-height:1.2; margin:18px 0 6px; font-weight:900; color:#D93A1C; }
.g2-dpad{ display:grid; grid-template-columns:repeat(3,76px); grid-template-rows:repeat(2,76px); gap:8px; justify-content:center; margin-top:8px; }
.g2-dpad button{ border:2.5px solid #1F1A2E; border-radius:18px; background:#fff; font-size:30px; font-weight:900; box-shadow:3px 3px 0 #1F1A2E; cursor:pointer; padding:0; font-family:inherit; }
.g2-dpad button:active{ transform:translate(2px,2px); box-shadow:1px 1px 0 #1F1A2E; }
.g2-dpad .u{ grid-column:2; grid-row:1; } .g2-dpad .l{ grid-column:1; grid-row:2; } .g2-dpad .d{ grid-column:2; grid-row:2; } .g2-dpad .r{ grid-column:3; grid-row:2; }

/* ===== 2인용 ===== */
.duo{ display:flex; flex-direction:column; gap:10px; width:100%; max-width:480px; margin:0 auto; }
.duo-p{ position:relative; border:3px solid #1F1A2E; border-radius:24px; padding:12px; min-height:150px; box-shadow:5px 5px 0 #1F1A2E; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; color:#1F1A2E; }
.duo-p.p1{ background:#FFD5C9; }
.duo-p.p2{ background:#E6E4FF; }
.duo-tag{ position:absolute; top:8px; left:12px; background:#1F1A2E; color:#fff; border-radius:999px; font-size:12px; font-weight:800; padding:3px 10px; }
.duo-mid{ text-align:center; padding:6px 4px; min-height:64px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px; }
.duo-status{ font-size:20px; font-weight:900; color:#1F1A2E; }
.duo-score{ font-size:14px; font-weight:800; color:#5B5670; }
.duo-btn{ width:100%; min-height:110px; border:3px solid #1F1A2E; border-radius:22px; background:#fff; color:#1F1A2E; font-size:26px; font-weight:900; font-family:inherit; box-shadow:4px 4px 0 #1F1A2E; cursor:pointer; touch-action:manipulation; -webkit-tap-highlight-color:transparent; user-select:none; }
.duo-btn:active{ transform:translate(2px,2px); box-shadow:2px 2px 0 #1F1A2E; }
.duo-btn.go{ background:#C9F24B; }
.duo-btn.stop{ background:#FFD0C2; }
.duo-btn:disabled{ opacity:.45; cursor:default; }
.duo-bar{ position:relative; width:100%; height:26px; border:3px solid #1F1A2E; border-radius:999px; background:#fff; overflow:hidden; }
.duo-bar i{ position:absolute; top:0; bottom:0; left:0; background:#FF7A5C; transition:width .05s linear; }
.duo-bar b{ position:absolute; top:-3px; bottom:-3px; width:5px; background:#1F1A2E; transform:translateX(-50%); }
.duo-pick{ display:flex; gap:10px; width:100%; }
.duo-pick button{ flex:1; font-size:38px; padding:12px 0; border:3px solid #1F1A2E; border-radius:18px; background:#fff; box-shadow:3px 3px 0 #1F1A2E; cursor:pointer; font-family:inherit; }
.duo-pick button.on{ background:#C9F24B; }
.duo-board{ display:grid; gap:7px; width:100%; max-width:330px; margin:0 auto; }
.duo-board.b3{ grid-template-columns:repeat(3,1fr); }
.duo-board.b4{ grid-template-columns:repeat(4,1fr); }
.duo-cell{ aspect-ratio:1; border:3px solid #1F1A2E; border-radius:16px; background:#fff; font-size:38px; font-weight:900; display:flex; align-items:center; justify-content:center; cursor:pointer; padding:0; font-family:inherit; box-shadow:3px 3px 0 #1F1A2E; color:#1F1A2E; }
.duo-cell.back{ background:#5B4BE0; color:#fff; font-size:26px; }
.duo-cell.done{ background:#E9F9B8; pointer-events:none; }
.duo-cell.hl{ background:#C9F24B; }
.duo-turn{ outline:4px solid #C9F24B; outline-offset:2px; }
.duo-over{ position:fixed; inset:0; background:rgba(31,26,46,.72); z-index:9999; display:flex; align-items:center; justify-content:center; padding:20px; }
.duo-over .box{ background:#fff; border:3px solid #1F1A2E; border-radius:28px; box-shadow:6px 6px 0 #1F1A2E; padding:26px 22px; text-align:center; max-width:340px; width:100%; }
.duo-over .em{ font-size:56px; }
.duo-over h3{ font-size:26px; margin:6px 0; color:#1F1A2E; }
.duo-over p{ color:#5B5670; font-size:14px; margin:0 0 14px; }
.duo-over .btn-row{ display:flex; flex-direction:column; gap:8px; }
@media (max-width:720px){ .duo-p.p2.flip > *:not(.duo-tag){ transform:rotate(180deg); } .duo-p.p2.flip{ } .duo-p.p2.flip .duo-tag{ transform:rotate(180deg); left:auto; right:12px; top:auto; bottom:8px; } }
.g-sec-fire{ color:#D93A1C; }

/* 허브 카드 강조 */
.selector-card.hot{border-color:#D93A1C;box-shadow:4px 4px 0 #D93A1C}
.g2-quit{margin-top:10px;width:100%;background:#fff !important;color:#1F1A2E !important;border:2px solid #1F1A2E;font-size:14px}
