* { box-sizing: border-box; user-select: none; }
body { background: linear-gradient(145deg, #1a2a3a 0%, #0f1a24 100%); font-family: 'Segoe UI', sans-serif; margin: 0; padding: 12px; min-height: 100vh; display: flex; justify-content: center; align-items: center; }
.game-container { max-width: 1450px; width: 100%; background: rgba(0,0,0,0.3); border-radius: 32px; padding: 16px; box-shadow: 0 20px 35px rgba(0,0,0,0.5); }
.status-bar { display: flex; justify-content: space-between; align-items: center; background: #2c3e2f; padding: 8px 20px; border-radius: 60px; margin-bottom: 12px; color: #f9eec1; font-weight: bold; flex-wrap: wrap; gap: 12px; }
.turn-indicator { background: #e67e22; padding: 4px 18px; border-radius: 40px; color: white; }
.button-group { display: flex; gap: 8px; align-items: center; }
button { background: #e67e22; border: none; color: white; font-weight: bold; padding: 6px 20px; border-radius: 40px; cursor: pointer; transition: 0.1s; font-size: 0.9rem; box-shadow: 0 2px 4px black; }
button:active { transform: scale(0.97); }
button:disabled { background: #5a6e6c; cursor: not-allowed; opacity: 0.7; }
.stats-panel { background: #1a2226; border-radius: 20px; padding: 12px; margin: 8px 0; color: #ddd; font-size: 0.8rem; display: none; flex-wrap: wrap; gap: 20px; justify-content: center; }
.stats-panel table { border-collapse: collapse; margin: 0 auto; }
.stats-panel th, .stats-panel td { padding: 3px 12px; text-align: center; font-size: 0.75rem; }
.stats-panel th { color: #f1c40f; border-bottom: 1px solid #5a6e6c; }
.line-chart { position: relative; width: 100%; max-width: 400px; margin: 0 auto; }
.chart-svg { width: 100%; height: 200px; }
.chart-legend { display: flex; gap: 15px; justify-content: center; margin-top: 4px; font-size: 0.7rem; }
.chart-legend span { display: flex; align-items: center; gap: 4px; }
.legend-dot { width: 12px; height: 12px; border-radius: 50%; }
.calm-badge { background: #5dade2; padding: 4px 18px; border-radius: 40px; font-size: 0.9rem; font-weight: bold; color: white; display: inline-block; }
.player-area { background: #1e2a2ecc; border-radius: 24px; padding: 12px; margin-bottom: 12px; border: 1px solid #c9ae5d; }
.player-header { display: flex; justify-content: space-between; padding: 4px 12px; font-weight: bold; color: #ffd966; border-bottom: 1px solid #b68b40; margin-bottom: 12px; font-size: 1.2rem; }
.zones { display: flex; flex-wrap: wrap; gap: 12px; }
.zone { flex: 1; min-width: 180px; background: #0f1a1fc9; border-radius: 20px; padding: 10px; box-shadow: inset 0 0 0 1px #4a5b5e; transition: background 0.15s, border 0.15s; }
.zone.drag-valid { background: #2a6b4e; border: 2px solid #2ecc71; }
.zone.drag-invalid { background: #8b3c3a; border: 2px solid #e74c3c; }
.zone-title { font-size: 0.75rem; text-transform: uppercase; color: #d4c5a3; margin-bottom: 8px; border-left: 3px solid #f1c40f; padding-left: 8px; }
.card-grid { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; min-height: 85px; }
.card { width: 70px; height: 98px; background: #fef5e0; border-radius: 9px; border: 3px solid #c2a15b; display: flex; flex-direction: column; justify-content: center; align-items: center; position: relative; cursor: grab; font-weight: bold; box-shadow: 1px 2px 5px black; color: #2d2b26; text-align: center; font-size: 0.8rem; padding: 2px; transition: transform 0.5s ease, opacity 0.5s ease, box-shadow 0.3s ease; }
.card:active { cursor: grabbing; }
.card.tapped { transform: rotate(90deg); filter: grayscale(0.3); opacity: 0.75; }
.card.honor-card { background: #fff0d0; border-top: 6px solid #d49b3a; }
.card.trump-card { background: #e8daef; border: 3px solid #9b59b6; color: #4a235a; }
.card.trump-card .card-stats { background: #8e44ad; }
.card.specialty-heal { border-color: #e74c3c !important; box-shadow: 0 0 10px rgba(231,76,60,0.5); }
.card.specialty-quick { border-color: #e67e22 !important; box-shadow: 0 0 10px rgba(230,126,34,0.5); }
.card.specialty-excess { border-color: #2ecc71 !important; box-shadow: 0 0 10px rgba(46,204,113,0.5); }
.card.specialty-mortal { border-color: #9b59b6 !important; box-shadow: 0 0 10px rgba(155,89,182,0.5); }
.card.flipped-card { background: #1a1a2e !important; border-color: #5a4e7c !important; opacity: 0.85; cursor: default; }
.card.selected { border: 3px solid #f1c40f !important; box-shadow: 0 0 0 3px #f1c40f; }
.card.placement-selected { border: 3px solid #f1c40f !important; box-shadow: 0 0 0 4px rgba(241,196,15,0.7), 0 0 18px rgba(241,196,15,0.8); transform: translateY(-4px); }
.attacker-drop.tap-target { border-color: #f1c40f; background: #2b3320; box-shadow: 0 0 12px rgba(241,196,15,0.45); }
.placement-hint { min-height: 1.2em; margin-top: 8px; color: #f1c40f; font-size: 0.78rem; text-align: center; }
.card, .zone, .attacker-drop, .attachment-slot { touch-action: manipulation; -webkit-tap-highlight-color: transparent; }
.card.attacker-selected { border: 3px solid #e74c3c !important; box-shadow: 0 0 0 3px #e74c3c; animation: atkPulse 0.6s infinite alternate; }
@keyframes atkPulse { from { box-shadow: 0 0 0 3px #e74c3c; } to { box-shadow: 0 0 0 8px #e74c3c; } }
.card.battle-ready-card { border-color:#ffd54a !important; cursor:pointer; animation:battleGlow 0.8s ease-in-out infinite alternate; z-index:5; }
@keyframes battleGlow { from { box-shadow:0 0 5px 2px rgba(255,213,74,0.65); } to { box-shadow:0 0 18px 7px rgba(255,153,0,0.95); transform:translateY(-3px); } }
.card.charm-ready-card { border-color:#56d6c9 !important; cursor:pointer; box-shadow:0 0 13px rgba(86,214,201,0.9); }
.charm-card { width:118px; min-height:98px; height:auto; padding:8px 6px; background:linear-gradient(145deg,#d9fff8,#b9e9dd); border-color:#2aa898; color:#173c36; cursor:pointer; }
.charm-card.tapped { transform:rotate(90deg); }
.charm-card .charm-components { font-size:.68rem; margin:4px 0; letter-spacing:1px; }
.charm-card .charm-effect { font-size:.62rem; line-height:1.25; font-weight:normal; }
.charm-card.used { opacity:.72; box-shadow:inset 0 0 0 2px #657d79; }
.card-stats { font-size: 0.7rem; background: #2c3e2e; color: #eee; border-radius: 12px; padding: 2px 6px; margin-top: 4px; }
.specialty-icon { font-size: 1rem; position: absolute; top: 2px; right: 5px; }
.suit-red { color: #e74c3c !important; } .suit-orange { color: #e67e22 !important; } .suit-green { color: #2ecc71 !important; } .suit-purple { color: #9b59b6 !important; }
#playerHonorsGrid .card, #aiHonorsGrid .card { width: 85px; height: 115px; font-size: 0.9rem; }
.modal { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.85); justify-content: center; align-items: center; z-index: 1000; }
.modal-content { background: #2c3e2f; padding: 20px; border-radius: 28px; max-width: 800px; text-align: center; color: white; max-height: 90vh; overflow-y: auto; }
.modal-cards { display: flex; gap: 12px; flex-wrap: wrap; justify-content: center; margin: 15px 0; }
.log-area { background:#0f1a14; color:#ced4ab; padding:10px; border-radius:20px; margin:10px 0; font-size:.75rem; height:240px; display:flex; flex-direction:column; gap:8px; font-family:ui-monospace,SFMono-Regular,Menlo,monospace; }
.log-toolbar { display:flex; align-items:center; gap:7px; flex-wrap:wrap; padding-bottom:7px; border-bottom:1px solid #34473c; }
.log-toolbar label { display:flex; align-items:center; gap:5px; color:#d4c5a3; }
.log-toolbar select,.log-toolbar input { accent-color:#d4a017; }
.log-toolbar select { background:#18271f; color:#e5eadc; border:1px solid #53665a; border-radius:10px; padding:4px 8px; }
.log-toolbar button { padding:4px 10px; font-size:.68rem; box-shadow:none; background:#2c6e5f; }
.log-toolbar .debug-toggle { margin-left:auto; }
.log-text { overflow-y:auto; flex:1; display:flex; flex-direction:column; gap:3px; scroll-behavior:smooth; }
.log-turn-heading { position:sticky; top:0; z-index:1; margin-top:6px; padding:3px 8px; border-radius:8px; background:#26372d; color:#f1c40f; font-weight:bold; }
.log-event { padding:3px 7px; border-left:3px solid #52675a; white-space:pre-wrap; line-height:1.35; }
.log-event[data-category="combat"] { border-color:#d05a47; color:#f4d5c9; }
.log-event[data-category="payment"] { border-color:#4c9ec9; color:#d5eaf4; }
.log-event[data-category="effect"] { border-color:#9b59b6; color:#ead9f0; }
.log-event[data-category="warning"] { border-color:#f39c12; color:#ffe0a6; }
.log-event[data-category="result"] { border-color:#2ecc71; color:#c9f6db; font-weight:bold; }
.attachment-slot { width: 90px; height: 120px; border: 2px dashed #c9ae5d; border-radius: 12px; display: inline-flex; flex-direction: column; justify-content: center; align-items: center; margin: 8px; background: #1e2a2e; color: #ccc; font-size: 0.8rem; cursor: pointer; }
.resource-visuals { display: flex; gap: 5px; flex-wrap: wrap; margin: 4px 0; justify-content: center; }
.resource-symbol { width: 28px; height: 28px; background: #1a2a2e; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 1.1rem; font-weight: bold; border: 2px solid #5a6e6c; color: white; }
.bonus-resource { display:none; width:fit-content; margin:4px auto; padding:3px 10px; border-radius:16px; background:#5b3a00; border:1px solid #f1c40f; color:#ffeaa7; font-size:0.72rem; font-weight:bold; }
.stack-banner { display:none; position:fixed; top:8%; left:50%; transform:translateX(-50%); z-index:1300; min-width:300px; max-width:90vw; padding:12px 18px; border-radius:18px; background:#241035; border:2px solid #9b59b6; color:#f0d8ff; text-align:center; box-shadow:0 8px 30px rgba(0,0,0,0.65); }
.stack-banner .stack-cards { margin:7px 0; display:flex; flex-wrap:wrap; justify-content:center; align-items:stretch; gap:6px; font-size:0.8rem; color:#f1c40f; }
.stack-entry { min-width:120px; max-width:260px; padding:7px 9px; border:1px solid rgba(241,196,15,.45); border-radius:9px; background:rgba(0,0,0,.24); white-space:normal; }
.stack-entry .stack-owner { display:block; font-size:.68rem; color:#d7e9ff; text-transform:uppercase; letter-spacing:.04em; }
.stack-entry .stack-name { display:block; font-weight:bold; color:#ffe36b; }
.stack-entry .stack-effect { display:block; margin-top:3px; color:#fff5cf; line-height:1.25; }
.stack-arrow { align-self:center; color:#d0b55b; font-weight:bold; }
.phase-bar { display: flex; align-items: center; gap: 6px; background: #1e2a2e; border-radius: 30px; padding: 4px 12px; }
.phase-step { padding: 4px 12px; border-radius: 20px; font-size: 0.8rem; color: #aaa; background: #0f1a1f; }
.phase-step.active { background: #e67e22; color: white; font-weight: bold; }
.deck-info { font-size: 0.7rem; background: #1e2a2e; padding: 2px 8px; border-radius: 10px; margin-left: 6px; }
.graveyard-badge { cursor: pointer; }
.attacker-drop { min-height: 120px; border: 2px dashed #5a6e6c; border-radius: 12px; padding: 8px; margin: 6px 0; background: #1a2226; transition: 0.2s; width: 240px; }
.attacker-drop h4 { margin: 0 0 6px; font-size: 0.8rem; color: #f1c40f; text-align: center; }
.trump-option-button { background: #4a148c; color: gold; padding: 10px; margin: 5px; border-radius: 8px; cursor: pointer; text-align: center; border: 1px solid gold; }
.trump-option-button:hover { background: #6a1b9a; }
.trump-tooltip { display:none; position:absolute; bottom:108%; left:50%; transform:translateX(-50%); background:#1a0a2e; color:#f0d8ff; border:1px solid #9b59b6; border-radius:10px; padding:8px 10px; width:200px; font-size:0.68rem; font-weight:normal; z-index:600; pointer-events:none; white-space:normal; text-align:left; line-height:1.5; box-shadow:0 4px 12px rgba(0,0,0,0.7); }
.card.trump-card:hover .trump-tooltip { display:block; }
.card { overflow:visible; }
@media (max-width: 700px) { .card { width: 55px; height: 80px; } }
/* Startup modal */
#startupModal { position:fixed; inset:0; background:rgba(0,0,0,0.82); display:flex; align-items:center; justify-content:center; z-index:2000; }
#startupModal .sm-box { background:linear-gradient(145deg,#1e3028,#0f1a14); border:2px solid #c9ae5d; border-radius:24px; padding:36px 48px; max-width:460px; width:90%; color:#f9eec1; text-align:center; box-shadow:0 20px 60px rgba(0,0,0,0.8); }
#startupModal h2 { font-size:2rem; margin:0 0 6px; color:#f1c40f; }
#startupModal .sm-sub { font-size:0.85rem; color:#a0b89a; margin-bottom:28px; }
.sm-section { text-align:left; margin-bottom:20px; }
.sm-section label { display:block; font-size:0.95rem; margin-bottom:6px; color:#d4c5a3; font-weight:bold; }
.sm-radios { display:flex; gap:12px; flex-wrap:wrap; }
.sm-radio { display:flex; align-items:center; gap:6px; background:#1a2a1e; border:2px solid #4a5b4e; border-radius:30px; padding:6px 16px; cursor:pointer; transition:0.15s; font-size:0.9rem; }
.sm-radio:hover,.sm-radio.active { border-color:#f1c40f; background:#2a3a2e; color:#f1c40f; }
.sm-radio input[type=radio] { display:none; }
.sm-toggle { display:flex; align-items:center; gap:10px; background:#1a2a1e; border:2px solid #4a5b4e; border-radius:30px; padding:8px 20px; cursor:pointer; transition:0.15s; font-size:0.9rem; width:fit-content; }
.sm-toggle:hover,.sm-toggle.active { border-color:#f1c40f; background:#2a3a2e; color:#f1c40f; }
.sm-toggle input[type=checkbox] { display:none; }
.sm-toggle .sm-check { width:18px; height:18px; border:2px solid currentColor; border-radius:4px; display:flex; align-items:center; justify-content:center; font-size:0.75rem; flex-shrink:0; }
#startupStartBtn { margin-top:20px; font-size:1.1rem; padding:12px 40px; background:linear-gradient(135deg,#d4a017,#a07810); border:none; border-radius:40px; color:#1a1200; font-weight:bold; cursor:pointer; box-shadow:0 4px 12px rgba(0,0,0,0.5); transition:0.15s; }
#startupStartBtn:hover { transform:scale(1.04); }
.sm-level-label { font-size:0.7rem; color:#a0b89a; margin-top:4px; display:block; }
.sm-radio small,.sm-toggle small,.sm-section label small { opacity:.62; margin-left:4px; }
.seed-row { display:flex; gap:8px; }
.seed-row input { min-width:0; flex:1; border:2px solid #4a5b4e; border-radius:14px; background:#101d16; color:#f9eec1; padding:9px 11px; font:inherit; user-select:text; }
.seed-row input:focus { outline:none; border-color:#f1c40f; }
.seed-row button { padding:8px 13px; box-shadow:none; background:#2c6e5f; }
.rules-preview { margin-top:18px; padding:14px 16px; border:1px solid #4a5b4e; border-radius:16px; background:#14231b; text-align:left; }
.rules-preview h3 { margin:0 0 8px; color:#f1c40f; font-size:1rem; }
.rules-preview ul { margin:0; padding-left:20px; color:#d4c5a3; font-size:0.8rem; line-height:1.5; }
.rules-preview button { display:block; margin:12px auto 0; background:#2c6e5f; }
.help-modal-content { width:min(980px,94vw); text-align:left; padding:0; overflow:hidden; }
#rulesModal { z-index:2200; }
.help-header { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:18px 22px 12px; border-bottom:1px solid #53665a; }
.help-header h2 { margin:0; color:#f1c40f; }
.help-close { padding:5px 14px; background:#8b3c3a; }
.help-tabs { display:flex; gap:8px; padding:12px 22px 0; }
.help-tab { background:#1a2a1e; border:1px solid #53665a; color:#d4c5a3; box-shadow:none; }
.help-tab.active { background:#d4a017; color:#1a1200; border-color:#f1c40f; }
.help-body { max-height:72vh; overflow-y:auto; padding:18px 22px 28px; line-height:1.55; }
.help-section { background:#17251e; border:1px solid #40534a; border-radius:16px; padding:14px 18px; margin-bottom:14px; }
.help-section h3 { margin:0 0 8px; color:#f1c40f; }
.help-section h4 { color:#d4c5a3; margin:12px 0 5px; }
.help-section p { margin:6px 0; color:#e0e4d4; }
.help-section ul,.help-section ol { margin:6px 0; padding-left:22px; color:#e0e4d4; }
.honor-costs { display:grid; grid-template-columns:repeat(auto-fit,minmax(125px,1fr)); gap:7px; margin-top:9px; }
.honor-costs span { background:#0f1a14; border-radius:10px; padding:7px 9px; text-align:center; }
.trump-reference-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(245px,1fr)); gap:10px; }
.trump-reference-card { background:#1c1227; border:1px solid #784a91; border-radius:14px; padding:12px 14px; color:#f0d8ff; }
.trump-reference-card strong { color:#f1c40f; display:block; margin-bottom:4px; }
.trump-reference-icon { font-size:1.35rem; margin-right:5px; vertical-align:-2px; }
.level-badge { background:#2c6e5f; padding:4px 12px; border-radius:30px; color:#f9eec1; font-size:0.8rem; white-space:nowrap; }
.battle-ready-badge,.battle-locked-badge,.charm-ready-badge { display:none; margin-left:7px; padding:3px 9px; border-radius:14px; font-size:0.68rem; font-weight:bold; text-transform:none; cursor:pointer; vertical-align:middle; }
.battle-ready-badge { color:#231600; background:linear-gradient(135deg,#ffe082,#ffb300); box-shadow:0 0 10px rgba(255,193,7,0.65); }
.battle-ready-badge.active-window { animation:badgePulse 0.8s infinite alternate; }
.battle-locked-badge { color:#d2c8df; background:#493b55; border:1px solid #766486; cursor:help; }
.charm-ready-badge { color:#082f2a; background:linear-gradient(135deg,#8ff3e6,#43c9b8); box-shadow:0 0 10px rgba(67,201,184,.7); }
.combo-ready-card { box-shadow:0 0 0 3px #e74c3c,0 0 18px #e74c3c!important; }
.combo-ready-card.benediction-ready { box-shadow:0 0 0 3px #ff8da1,0 0 18px #ff8da1!important; }
.attached-combos { display:flex; flex-wrap:wrap; gap:3px; justify-content:center; margin-top:4px; }
.combo-chip { max-width:112px; padding:3px 6px; border-radius:10px; font-size:.56rem; line-height:1.15; color:#fff; cursor:pointer; border:1px solid rgba(255,255,255,.45); }
.combo-chip.malediction { background:#5c2432; }
.combo-chip.benediction { background:#a83f58; }
.combo-chip .combo-components { display:block; opacity:.72; font-size:.48rem; }
.combo-reference-card.malediction { background:#321821; border-color:#9b4057; }
.combo-reference-card.benediction { background:#4a1e2a; border-color:#ef7894; }
@keyframes badgePulse { from { box-shadow:0 0 6px rgba(255,193,7,0.55); } to { box-shadow:0 0 18px rgba(255,193,7,1); } }
.battle-reference-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:10px; }
.battle-reference-card { background:#291d0d; border:1px solid #a87516; border-radius:14px; padding:12px 14px; color:#f8e6b3; }
.battle-reference-card.locked { opacity:0.62; border-color:#665872; background:#241d2b; }
.battle-reference-card strong { color:#ffd54a; display:block; margin-bottom:4px; }
.battle-requirement { color:#fff1c1; font-size:0.78rem; margin-bottom:5px; }
.charm-reference-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:10px; }
.charm-reference-card { background:#102f2b; border:1px solid #2aa898; border-radius:14px; padding:12px 14px; color:#d5fff7; }
.charm-reference-card strong { color:#7df2e2; display:block; margin-bottom:4px; }
.combat-priority-banner { display:none; position:fixed; bottom:3%; left:50%; transform:translateX(-50%); z-index:1250; min-width:330px; max-width:94vw; padding:12px 18px; border-radius:20px; background:#392408; border:2px solid #ffca28; color:#fff0bd; text-align:center; box-shadow:0 8px 30px rgba(0,0,0,0.7); }
.combat-priority-banner .window-label { color:#ffd54a; font-weight:bold; margin-bottom:7px; }
.battle-stack-banner { display:none; position:fixed; top:18%; left:50%; transform:translateX(-50%); z-index:1400; min-width:330px; max-width:94vw; padding:14px 18px; border-radius:20px; background:#41200b; border:2px solid #ff9800; color:#ffe0b2; text-align:center; box-shadow:0 8px 35px rgba(0,0,0,0.8); }
.battle-stack-list { color:#ffd54a; font-size:0.82rem; margin:8px 0; }
@media (max-width:700px) {
    body { padding:5px; align-items:flex-start; }
    .game-container { border-radius:18px; padding:8px; }
    #startupModal .sm-box { padding:24px 20px; }
    .help-header { padding:14px 14px 10px; }
    .help-header h2 { font-size:1.2rem; }
    .help-tabs { padding:10px 14px 0; }
    .help-body { padding:14px; max-height:76vh; }
    .trump-reference-grid,.battle-reference-grid,.charm-reference-grid { grid-template-columns:1fr; }
    .phase-step { padding:3px 7px; font-size:0.68rem; }
    .stack-banner .stack-cards { flex-direction:column; align-items:stretch; }
    .stack-entry { max-width:none; }
    .stack-arrow { transform:rotate(90deg); }
    .log-area { height:280px; }
    .log-toolbar .debug-toggle { margin-left:0; }
}
#rulesBtn{background:#2c6e5f}
#declareAtkBtn,#resolveAtkBtn{background:#c0392b}
#skipAtkBtn{background:#e67e22}
#reactTrumpBtn,#reactBlkTrumpBtn,#stackReactBtn,#combatTrumpBtn{background:#8e44ad}
#charmActionBtn,#combatCharmBtn{background:#168f80}
#newGameBtn,#targetingDoneBtn{background:#27ae60}
#declareAtkBtn,#skipAtkBtn,#resolveAtkBtn,#reactTrumpBtn,#charmActionBtn,#newGameBtn,#targetingDoneBtn{display:none}
.calm-row{text-align:center;margin:8px 0}
#trumpPaymentSum{font-size:1.5rem;color:#f1c40f;margin:10px}
#targetingBanner{display:none;position:fixed;top:10%;left:50%;transform:translateX(-50%);background:#e74c3c;color:white;padding:10px 30px;border-radius:30px;z-index:900;font-weight:bold;align-items:center;gap:12px}
.deck-browser-content{max-width:800px}
#resourceDetail{font-size:.8rem;background:#1a2a2e;border-radius:8px;padding:4px;margin:5px 0;color:#f1c40f}
.attachment-slots{display:flex;justify-content:center;gap:20px;margin:15px 0}
#cancelModalBtn{background:#a53f2b}
#blockerAssignmentArea{display:flex;flex-wrap:wrap;gap:15px;justify-content:center}
.available-blockers{background:#1a2226;border-radius:12px;padding:10px;margin-top:10px}
#availBlkGrid{justify-content:center}
#reactBlkTrumpBtn{margin-right:8px}
#stackPassBtn,#combatPassBtn,#battleStackPassBtn{background:#5a6e6c}
#combatBattleBtn,#battleCounterBtn{background:#c07800}
