*{margin:0;padding:0;box-sizing:border-box}
body{font-family:'Barlow Condensed',Arial,sans-serif;background:#1e1e1e;color:#ddd;min-height:100vh;overflow-x:hidden}

/* ══ LANG SELECT ══ */
.lang-selector {display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end;}
.select-header{width:100%;max-width:820px;display:flex;justify-content:flex-end;margin-bottom:4px;position:relative;z-index:1}
.lang-mount-game{display:flex;margin-left:10px}
.lang-btn {background:#141418;border:1px solid #333;color:#888;padding:4px 8px;border-radius:4px;font-family:'Barlow Condensed',sans-serif;cursor:pointer;font-weight:700;transition:all .15s;}
.lang-btn:hover {border-color:#666;color:#ccc;}
.lang-btn.active {background:#c8a840;color:#000;border-color:#c8a840;}
.lang-btn:focus-visible,.rules-open-btn:focus-visible,.settings-btn:focus-visible,#fight-btn:focus-visible,.action-btn:focus-visible,.mp-role-btn:focus-visible,.mp-btn:focus-visible,.tut-btn:focus-visible,.face-toggle:focus-visible,.topbar-btn:focus-visible{outline:2px solid #c8a840;outline-offset:2px}

#char-select-overlay{position:fixed;inset:0;z-index:1000;background:#0d0d10;display:flex;flex-direction:column;align-items:center;padding:20px 16px 30px;overflow-y:auto}
#char-select-overlay::before{content:'';position:fixed;inset:0;background:radial-gradient(ellipse 60% 40% at 20% 80%,rgba(120,60,0,.07) 0%,transparent 70%),radial-gradient(ellipse 50% 40% at 80% 20%,rgba(0,60,120,.07) 0%,transparent 70%);pointer-events:none}
.select-title{font-family:'Bebas Neue',sans-serif;font-size:2.8em;letter-spacing:8px;color:#c8c8c8;margin-bottom:3px;text-align:center}
.select-subtitle{font-size:.78em;color:#444;margin-bottom:20px;letter-spacing:3px;text-transform:uppercase}
#fighter-select-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;max-width:820px;width:100%;margin-bottom:16px}
.fighter-select-card{background:#141418;border:1px solid #2a2a2a;border-radius:12px;padding:14px 10px 10px;cursor:pointer;transition:border-color .2s,box-shadow .2s,transform .2s,opacity .3s;display:flex;flex-direction:column;align-items:center;position:relative;overflow:hidden}
.fighter-select-card::before{content:'';position:absolute;inset:0;background:linear-gradient(160deg,rgba(255,255,255,.02) 0%,transparent 60%);pointer-events:none}
.fighter-select-card:hover{border-color:#555;transform:translateY(-4px);box-shadow:0 10px 30px rgba(0,0,0,.6)}
.fighter-select-card.player-selected{border-color:#b8962a;box-shadow:0 0 24px rgba(184,150,42,.25);background:#1a1812}
.fighter-select-card.ai-selected{border-color:#8a2020;box-shadow:0 0 24px rgba(138,32,32,.25);background:#1a1212}
.fighter-select-card.dimmed{opacity:.45}
.fighter-select-card.dimmed:hover{opacity:.85}
.fighter-select-card:focus-visible{outline:2px solid #c8a840;outline-offset:3px}
/* Header / toolbar / dock of the fighter select screen */
.select-hero{text-align:center;margin-bottom:12px;position:relative}
.site-logo{display:block;margin:0 auto 6px;width:auto;height:auto;max-height:130px;max-width:min(90%,380px)}
.select-tagline{font-size:.72em;color:#555;letter-spacing:4px;text-transform:uppercase;font-weight:600}
.select-toolbar{display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;max-width:820px;width:100%;margin-bottom:12px;position:relative}
.rules-open-btn.mp-start-btn{background:#0f1f10;border-color:#2a6a2a;color:#5a9a5a}
.rules-open-btn.mp-start-btn:hover{background:#142a15;border-color:#3a8a3a;color:#7aca7a}
.rules-open-btn.palmares-btn{background:#1a1810;border-color:#5a4a20;color:#a08a40}
.rules-open-btn.palmares-btn:hover{background:#242010;border-color:#8a7030;color:#c8a840}
.settings-sub{font-size:.75em;color:#5a5a5a}
#fight-dock{position:sticky;bottom:8px;z-index:5;width:100%;max-width:820px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 12px 10px 16px;margin:2px 0 16px;background:rgba(16,16,20,.94);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border:1px solid #2a2a2a;border-radius:12px;box-shadow:0 -6px 28px rgba(0,0,0,.55)}
.info-note-1v1{background:#0d1520;border:1px solid #1e3050;border-radius:8px;padding:8px 14px;margin-bottom:10px;max-width:820px;width:100%;font-size:.75em;color:#5a8ab0;line-height:1.6;position:relative}
.info-note-1v1 b{color:#7aaddd}
.thanks-banner{background:#141418;border:1px solid #2a2a2a;border-radius:10px;padding:10px 16px;max-width:820px;width:100%;text-align:center;display:flex;flex-direction:column;gap:4px;position:relative}
.thanks-banner span{font-family:'Bebas Neue',sans-serif;font-size:1em;letter-spacing:2px;color:#999}
.thanks-banner a{font-family:'Bebas Neue',sans-serif;font-size:.95em;letter-spacing:2px;color:#c8a840;text-decoration:none}
.thanks-banner a:hover{text-decoration:underline}
/* Win tracking badges */
.sel-win-badge{position:absolute;top:6px;right:6px;background:#1a1a1a;border:1px solid #2a2a2a;border-radius:10px;padding:2px 7px;font-family:'Bebas Neue',sans-serif;font-size:.72em;letter-spacing:1px;color:#555;transition:all .2s}
.sel-win-badge.has-win{border-color:#444;color:#c8a840}
.sel-win-badge.beaten{border-color:#28a048;color:#28a048}
.all-beaten-popup{position:fixed;inset:0;z-index:9999;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,.88);animation:statsIn .35s ease}
.ulule-widget-wrap{margin-top:18px;display:flex;flex-direction:column;align-items:center;gap:6px;opacity:.7;transition:opacity .2s}
.ulule-widget-wrap:hover{opacity:1}
.ulule-widget-label{font-size:.62em;color:#555;letter-spacing:3px;text-transform:uppercase;font-family:'Barlow Condensed',sans-serif}
#record-popup{position:fixed;inset:0;z-index:9999;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,.88);animation:statsIn .3s ease}
.record-inner{background:#0d0f12;border:1px solid #2a2a2a;border-radius:16px;padding:24px 22px;max-width:420px;width:90%;max-height:85vh;overflow-y:auto}
.record-fighter-header{display:flex;align-items:center;gap:12px;margin-bottom:18px;padding-bottom:14px;border-bottom:1px solid #1a1a1a}
.record-emoji{font-size:2.2em;line-height:1}
.record-name{font-family:'Bebas Neue',sans-serif;font-size:1.3em;letter-spacing:3px;color:#ccc}
.record-style{font-size:.7em;color:#555;font-style:italic}
.record-ratio-bar{display:flex;height:14px;border-radius:7px;overflow:hidden;margin:10px 0 6px;border:1px solid #1a1a1a}
.record-win-seg{background:#28a048;display:flex;align-items:center;justify-content:flex-end;padding-right:6px;font-family:'Bebas Neue',sans-serif;font-size:.75em;color:rgba(255,255,255,.8);min-width:0;overflow:hidden}
.record-loss-seg{background:#8a2020;display:flex;align-items:center;justify-content:flex-start;padding-left:6px;font-family:'Bebas Neue',sans-serif;font-size:.75em;color:rgba(255,255,255,.7);min-width:0;overflow:hidden}
.record-ratio-labels{display:flex;justify-content:space-between;font-size:.7em;color:#555;margin-bottom:14px}
.record-history-title{font-size:.65em;color:#444;text-transform:uppercase;letter-spacing:2px;margin-bottom:8px;padding-bottom:4px;border-bottom:1px solid #191919}
.record-history-list{display:flex;flex-direction:column;gap:4px;max-height:220px;overflow-y:auto}
.record-history-item{display:flex;align-items:center;justify-content:space-between;padding:5px 10px;border-radius:6px;font-size:.75em}
.record-history-item.win{background:#0a1a0a;border:1px solid #1a3a1a}
.record-history-item.loss{background:#1a0a0a;border:1px solid #3a1a1a}
.record-history-result{font-family:'Bebas Neue',sans-serif;font-size:1.1em;letter-spacing:2px}
.record-history-item.win .record-history-result{color:#28a048}
.record-history-item.loss .record-history-result{color:#aa2828}
.record-history-date{color:#444;font-size:.9em}
.record-close-btn{width:100%;margin-top:14px;background:transparent;border:1px solid #2a2a2a;color:#555;font-family:'Bebas Neue',sans-serif;letter-spacing:2px;padding:9px;border-radius:8px;cursor:pointer;font-size:.9em}
.record-close-btn:hover{border-color:#555;color:#999}
.record-no-data{color:#444;font-size:.8em;text-align:center;padding:20px}

.sel-tag{position:absolute;top:7px;left:7px;font-size:.58em;padding:2px 5px;border-radius:3px;font-weight:700;letter-spacing:1px;text-transform:uppercase}
.sel-tag.player{background:#b8962a;color:#000}.sel-tag.ai{background:#8a2020;color:#fff}
.sel-fighter-emoji{font-size:2.4em;margin-bottom:5px;line-height:1;filter:drop-shadow(0 4px 8px rgba(0,0,0,.5))}
.sel-fighter-name{font-family:'Bebas Neue',sans-serif;font-size:.9em;letter-spacing:2px;color:#ccc;text-align:center;margin-bottom:2px;line-height:1.1}
.sel-fighter-style{font-size:.65em;color:#666;font-style:italic;margin-bottom:8px;text-align:center}
.sel-divider{width:100%;height:1px;background:#222;margin-bottom:5px}
.sel-face-label{font-size:.56em;color:#555;text-transform:uppercase;letter-spacing:2px;margin:3px 0 2px}
.sel-combo-row{display:flex;align-items:center;gap:2px;margin-bottom:3px;width:100%}
.sel-combo-name{color:#888;flex:1;min-width:0;font-size:.65em;line-height:1.2;overflow-wrap:anywhere;font-family:'Noto Sans SC',sans-serif}
.sel-combo-dmg{color:#555;font-size:.6em;white-space:nowrap;margin-left:2px}
/* Game Settings */
.game-settings-bar{display:flex;align-items:center;justify-content:center;gap:16px;margin-bottom:14px;padding:10px 20px;background:#141418;border:1px solid #2a2a2a;border-radius:10px}
.settings-label{font-size:.78em;color:#555;text-transform:uppercase;letter-spacing:2px}
.settings-toggle{display:flex;gap:4px}
.settings-btn{font-family:'Barlow Condensed',sans-serif;padding:5px 14px;border:1px solid #333;border-radius:5px;font-size:.85em;font-weight:700;cursor:pointer;background:#1a1a1a;color:#666;letter-spacing:1px;transition:all .15s}
.settings-btn:hover{border-color:#555;color:#aaa}
.settings-btn.active{background:#252525;border-color:#666;color:#ddd}
#select-status{flex:1;min-width:0;font-size:.95em;line-height:1.35;color:#555}
#select-status .sel-hint{display:block;font-size:.78em;color:#4a4a4a;margin-top:2px}
.fight-row{display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap}
#fight-btn{flex-shrink:0;font-family:'Bebas Neue',sans-serif;padding:12px 44px;background:#1a1a1a;color:#666;border:1px solid #333;border-radius:8px;font-size:1.6em;letter-spacing:6px;cursor:pointer;transition:all .2s}
#fight-btn:disabled{opacity:.3;cursor:not-allowed}
#fight-btn:not(:disabled){background:#222;color:#c8a840;border-color:#8a7030;animation:fightPulse 1.5s ease-in-out infinite alternate}
@keyframes fightPulse{from{box-shadow:0 0 10px rgba(200,168,64,.1)}to{box-shadow:0 0 30px rgba(200,168,64,.25);border-color:#c8a840}}
#fight-btn:not(:disabled):hover{background:#c8a840;color:#000;border-color:#c8a840;transform:scale(1.04);animation:none}
.rules-open-btn{font-family:'Bebas Neue',sans-serif;padding:12px 20px;background:#1a1a2a;color:#5a5a9a;border:1px solid #3a3a6a;border-radius:8px;font-size:1em;letter-spacing:3px;cursor:pointer;transition:all .2s}
.rules-open-btn:hover{background:#202035;color:#8888cc;border-color:#6666aa}

/* ══ RULES MODAL ══ */
#rules-overlay{display:none;position:fixed;inset:0;z-index:3000;background:rgba(0,0,0,.92);overflow-y:auto;padding:24px 16px 40px}
#rules-overlay.visible{display:block;animation:statsIn .3s ease}
.rules-inner{max-width:780px;margin:0 auto;background:#111;border-radius:16px;border:1px solid #2a2a2a;overflow:hidden}
.rules-header{display:flex;justify-content:space-between;align-items:center;padding:14px 22px;background:#161616;border-bottom:1px solid #222}
.rules-header h2{font-family:'Bebas Neue',sans-serif;font-size:1.6em;letter-spacing:5px;color:#aaa}
.rules-close{background:none;border:1px solid #444;color:#777;border-radius:6px;padding:4px 14px;font-size:1.1em;cursor:pointer;font-family:'Barlow Condensed',sans-serif}
.rules-close:hover{border-color:#888;color:#ccc}
.rules-body{padding:22px 26px;font-size:.85em;line-height:1.7;color:#888}
.rules-section{margin-bottom:18px}
.rules-section h3{font-family:'Bebas Neue',sans-serif;font-size:1.1em;letter-spacing:3px;color:#bbb;margin-bottom:8px;padding-bottom:4px;border-bottom:1px solid #222}
.rules-section p{margin-bottom:6px;color:#777}
.rules-section ul{padding-left:18px;margin-bottom:6px}
.rules-section ul li{margin-bottom:3px;color:#777}
.rules-section ul li strong{color:#999}
.rules-block-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;margin:8px 0}
.rules-block-item{background:#141414;border:1px solid #222;border-radius:6px;padding:6px;text-align:center;font-size:.85em}
.rules-block-item .from{margin-bottom:2px}.rules-block-item .arrow{color:#555;font-size:.8em}.rules-block-item .to{margin-top:2px}
.rules-badge{display:inline-block;padding:1px 6px;border-radius:4px;font-size:.85em;font-weight:700;color:#fff;background:var(--mc);text-shadow:0 1px 1px rgba(0,0,0,.45);margin:0 2px}
.rules-glossary{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.rules-gloss-item{background:#141414;border:1px solid #1e1e1e;border-radius:6px;padding:8px 10px}
.rules-gloss-item dt{color:#aaa;font-weight:700;margin-bottom:2px}
.rules-gloss-item dd{color:#666;font-size:.9em}

/* ══ STATS ══ */
#stats-overlay{display:none;position:fixed;inset:0;z-index:2000;background:rgba(0,0,0,.9);overflow-y:auto;padding:24px 16px 40px}
#stats-overlay.visible{display:block;animation:statsIn .3s ease}
@keyframes statsIn{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
.stats-inner{max-width:860px;margin:0 auto;background:#111;border-radius:16px;border:1px solid #2a2a2a;overflow:hidden}
.stats-header{display:flex;justify-content:space-between;align-items:center;padding:14px 20px;background:#161616;border-bottom:1px solid #222}
.stats-header h2{font-family:'Bebas Neue',sans-serif;font-size:1.5em;letter-spacing:4px;color:#aaa}
.stats-close{background:none;border:1px solid #444;color:#777;border-radius:6px;padding:4px 14px;font-size:1.1em;cursor:pointer;font-family:'Barlow Condensed',sans-serif}
.stats-close:hover{border-color:#888;color:#ccc}
.stats-body{padding:20px}
.stats-summary{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:18px}
.summary-box{flex:1;min-width:110px;background:#0d0d0d;border:1px solid #1e1e1e;border-radius:8px;padding:10px 12px;text-align:center}
.summary-box .s-val{font-family:'Bebas Neue',sans-serif;font-size:2em;color:#aaa;letter-spacing:2px}
.summary-box .s-lbl{font-size:.68em;color:#555;text-transform:uppercase;letter-spacing:1px}
/* Enhanced stats */
.stats-duel{display:flex;gap:10px;margin-bottom:16px;flex-wrap:wrap}
.stats-duel-card{flex:1;min-width:200px;background:#0d0d0d;border:1px solid #1e1e1e;border-radius:10px;overflow:hidden}
.stats-duel-header{padding:8px 14px;font-size:.8em;font-weight:700;letter-spacing:2px;display:flex;align-items:center;gap:6px}
.stats-duel-body{padding:10px 14px}
.stats-stat-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:7px}
.stats-stat-label{font-size:.68em;color:#555;text-transform:uppercase;letter-spacing:1px}
.stats-stat-val{font-family:'Bebas Neue',sans-serif;font-size:1.4em;letter-spacing:2px}
.stats-bar-wrap{margin-bottom:6px}
.stats-bar-track{width:100%;height:7px;background:#1a1a1a;border-radius:4px;overflow:hidden;margin-top:2px}
.stats-bar-fill{height:100%;border-radius:4px;transition:width .7s ease}
.stats-vs-bar{display:flex;height:22px;border-radius:6px;overflow:hidden;margin:6px 0 4px;border:1px solid #1a1a1a}
.stats-vs-seg{display:flex;align-items:center;justify-content:center;font-family:'Bebas Neue',sans-serif;font-size:.85em;color:rgba(255,255,255,.8);letter-spacing:1px;transition:width .7s ease;min-width:0;overflow:hidden}
.stats-move-grid{display:grid;grid-template-columns:auto 1fr auto;gap:4px 8px;align-items:center;font-size:.7em}
.stats-move-grid-hdr{color:#444;text-transform:uppercase;letter-spacing:1px;padding-bottom:4px;border-bottom:1px solid #1a1a1a;margin-bottom:2px}
.stats-mini-track{height:6px;background:#141414;border-radius:3px;overflow:hidden}
.stats-mini-fill{height:100%;border-radius:3px}
.stats-section-title{font-size:.66em;color:#444;text-transform:uppercase;letter-spacing:2px;margin:10px 0 5px;padding-bottom:3px;border-bottom:1px solid #191919}
.stats-chart-wrap{background:#0d0d0d;border:1px solid #1e1e1e;border-radius:10px;padding:14px 14px 10px;margin-bottom:18px}
.stats-chart-title{font-size:.75em;color:#555;text-transform:uppercase;letter-spacing:2px;margin-bottom:10px;text-align:center}
#hp-chart-svg{width:100%;display:block}
.chart-legend{display:flex;justify-content:center;gap:20px;margin-top:8px}
.legend-dot{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:5px;vertical-align:middle}
.chart-legend span{font-size:.78em;color:#777}
.stats-tables{display:flex;gap:12px;flex-wrap:wrap}
.stats-table-wrap{flex:1;min-width:280px;background:#0d0d0d;border:1px solid #1e1e1e;border-radius:10px;overflow:hidden}
.stats-table-title{padding:9px 14px;background:#141414;border-bottom:1px solid #1e1e1e;font-size:.82em;font-weight:700;color:#999;letter-spacing:1px}
table.move-stats{width:100%;border-collapse:collapse;font-size:.76em}
table.move-stats th{padding:6px 8px;color:#555;font-weight:700;text-align:center;border-bottom:1px solid #1e1e1e;text-transform:uppercase;letter-spacing:1px;background:#111}
table.move-stats th:first-child{text-align:left;padding-left:14px}
table.move-stats td{padding:5px 8px;text-align:center;border-bottom:1px solid #181818;color:#666}
table.move-stats td:first-child{text-align:left;padding-left:14px}
table.move-stats tr:last-child td{border-bottom:none}
table.move-stats tr:hover td{background:#131313}
.num-hi{color:#aaa;font-weight:700}

/* ══ GAME ══ */
.game-container{max-width:1100px;margin:0 auto;padding:10px}
.game-topbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}
h1{font-family:'Bebas Neue',sans-serif;text-align:center;font-size:1.7em;padding:10px;background:#191919;border-radius:10px;color:#aaa;letter-spacing:5px;border:1px solid #2e2e2e;flex:1;cursor:pointer;user-select:none;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-width:0}
h1 img{width:auto;height:auto;max-height:56px;max-width:100%}
h1 .h1-tagline{font-size:.65em;color:#666;letter-spacing:4px;font-family:'Barlow Condensed',sans-serif;font-weight:600}
h1:focus-visible{outline:2px solid #c8a840;outline-offset:2px}
.topbar-btn{font-family:'Bebas Neue',sans-serif;padding:10px 14px;background:#10101f;border:1px solid #2a2a5a;color:#5a5a9a;border-radius:8px;font-size:.85em;letter-spacing:2px;cursor:pointer;transition:all .2s;margin-left:10px;white-space:nowrap}
.topbar-btn:hover{background:#151528;color:#8888cc;border-color:#5a5aaa}
.arena{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;margin-bottom:10px}
.fighter-panel{flex:1;background:#1a1a1a;border-radius:12px;padding:12px;border:1px solid #2e2e2e}
.fighter-name{font-family:'Bebas Neue',sans-serif;font-size:1.15em;text-align:center;margin-bottom:8px;color:#ccc;letter-spacing:2px}
.health-bar-container{background:#111;border-radius:8px;padding:4px 4px 2px;margin-bottom:8px}
.hp-label{font-size:.75em;color:#666;text-align:center;margin-bottom:3px}
.hp-pips-row{display:flex;gap:2px;height:16px}
.hp-pip{flex:1;border-radius:2px;transition:background .4s;min-width:0}
.hp-pip.full{background:#6b2278}.hp-pip.lost-now{background:#331138}.hp-pip.empty{background:#161616;border:1px solid #202020}
.face-indicator{display:flex;align-items:center;justify-content:center;gap:10px;background:#141414;border:1px solid #2a2a2a;border-radius:7px;padding:7px 12px;margin-bottom:6px;font-size:.85em;color:#666}
.face-toggle{background:#252525;color:#bbb;border:1px solid #555;padding:6px 16px;border-radius:5px;cursor:pointer;font-size:.9em;font-weight:700;font-family:'Barlow Condensed',sans-serif;letter-spacing:1px;transition:all .15s}
.face-toggle:hover{background:#3a3a3a;color:#fff;border-color:#888}
.face-toggle:disabled{opacity:.3;cursor:not-allowed}
.face-toggle.kb-btn{margin-left:4px;padding:6px 10px}
.charge-zone{background:#141414;border-radius:8px;padding:8px;margin-bottom:8px;min-height:36px;border:1px solid #252525}
.charge-zone h3,.hand-area h3,.combo-list h3{font-size:.7em;color:#555;margin-bottom:4px;text-transform:uppercase;letter-spacing:2px}
.card-row{display:flex;flex-wrap:wrap;gap:3px}
.col-D{--mc:#ff8700}.col-G{--mc:#009b23}.col-P{--mc:#0064ff}.col-K{--mc:#e22200}.col-T{--mc:#ba00bb}
.mini-card{display:inline-flex;align-items:center;justify-content:center;padding:2px 7px;border-radius:5px;font-size:.7em;font-weight:700;color:#fff;background:var(--mc);box-shadow:inset 0 0 0 1px rgba(255,255,255,.22),0 1px 2px rgba(0,0,0,.4);text-shadow:0 1px 1px rgba(0,0,0,.45);letter-spacing:.5px;font-family:'Roboto','Barlow Condensed',sans-serif}
.combo-list{margin-top:0}
.combo-item{background:#141414;border-radius:6px;padding:5px 8px;margin-bottom:3px;font-size:.72em;border:1px solid #252525;cursor:default}
.combo-item.available{border-color:#666;cursor:pointer;background:#1e1e1e;animation:availGlow 1.2s ease-in-out infinite alternate}
@keyframes availGlow{from{border-color:#555;box-shadow:0 0 3px rgba(180,130,255,.1)}to{border-color:#aa88ff;box-shadow:0 0 8px rgba(180,130,255,.3)}}
.combo-item.available:hover{background:#282828}
.combo-item .combo-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:2px}
.combo-item .combo-name{font-weight:700;color:#aaa;font-family:'Noto Sans SC',sans-serif;font-size:.95em}
.combo-item .combo-dmg{font-weight:700;color:#888}
.combo-item .combo-special{color:#666;font-size:.9em;margin-top:1px}
.combo-item.available .combo-name{color:#ddd}.combo-item.available .combo-special{color:#999}
.center-panel{width:270px;min-width:270px;display:flex;flex-direction:column;align-items:center;gap:8px}
.vs-text{font-family:'Bebas Neue',sans-serif;font-size:2em;color:#555;letter-spacing:5px}
.turn-info{background:#141414;border-radius:10px;padding:10px;width:100%;text-align:center;border:1px solid #2a2a2a}
.turn-info h3{font-size:.8em;color:#555;margin-bottom:4px;letter-spacing:1px}
.phase-banner{background:#1e1e1e;border:1px solid #333;border-radius:7px;padding:6px;text-align:center;font-size:.88em;font-weight:600;color:#aaa;margin-bottom:6px;letter-spacing:1px}
/* ══ DECK-FAITHFUL MOVE CARDS ══ */
.move-selection{display:grid;grid-template-columns:repeat(auto-fit,minmax(104px,1fr));gap:8px;margin:8px 0;align-items:start}
/* The button is just the square box (aspect-ratio, no containment → reliable square).
   .mcard fills it and carries the visuals + container-type for the fluid cqw units. */
.move-btn{position:relative;display:block;width:100%;aspect-ratio:1/1;padding:0;border:none;background:none;cursor:pointer;user-select:none;border-radius:9%;-webkit-tap-highlight-color:transparent;transition:transform .12s ease,filter .12s ease}
.mcard{position:absolute;inset:0;container-type:inline-size;border-radius:9%;overflow:hidden;background:#d8d8da;background-image:repeating-linear-gradient(132deg,#fff 0,#fff 7px,#d6d6d9 7px,#d6d6d9 15px);box-shadow:0 3px 7px rgba(0,0,0,.5),inset 0 0 0 3px #fff;color:#7a7a7e;font-family:'Roboto','Helvetica Neue',Arial,sans-serif;transition:box-shadow .12s ease}
.move-btn:hover:not(:disabled){transform:translateY(-2px)}
.move-btn:hover:not(:disabled) .mcard{box-shadow:0 7px 16px rgba(0,0,0,.55),inset 0 0 0 3px #fff,0 0 0 2px var(--mc)}
.move-btn:active:not(:disabled){transform:translateY(0) scale(.97)}
.move-btn:focus-visible{outline:none}
.move-btn:focus-visible .mcard{box-shadow:0 0 0 3px #0d0d10,0 0 0 6px var(--mc),inset 0 0 0 3px #fff}
.move-btn:disabled{cursor:not-allowed;filter:grayscale(.55) brightness(.8);opacity:.6}
.move-btn.banned{filter:grayscale(.85) brightness(.72) contrast(.9)}
.mc-star{position:absolute;top:5cqw;left:4.5cqw;width:27cqw;height:27cqw;z-index:3;display:flex;align-items:center;justify-content:center;color:#1a1a1a;font-weight:900;font-style:normal;font-size:13.5cqw;line-height:1;background:#ffe000;filter:drop-shadow(0 1px 1.5px rgba(0,0,0,.35));clip-path:polygon(50% 0%,59% 15%,75% 7%,75% 25%,93% 25%,85% 41%,100% 50%,85% 59%,93% 75%,75% 75%,75% 93%,59% 85%,50% 100%,41% 85%,25% 93%,25% 75%,7% 75%,15% 59%,0% 50%,15% 41%,7% 25%,25% 25%,25% 7%,41% 15%)}
.mc-letter{position:absolute;top:6cqw;left:31cqw;width:19cqw;height:19cqw;z-index:3;display:flex;align-items:center;justify-content:center;border-radius:50%;background:#fff;border:2.2cqw solid var(--mc);color:var(--mc);font-weight:900;font-style:normal;font-size:10.5cqw;line-height:1;box-shadow:0 1px 2px rgba(0,0,0,.25)}
.mc-titles{position:absolute;top:5.5cqw;right:4cqw;left:50cqw;z-index:3;display:flex;flex-direction:column;align-items:flex-end;text-align:right;pointer-events:none}
.mc-title{font-weight:900;font-style:italic;text-transform:uppercase;color:#86868a;font-size:13cqw;line-height:.9;letter-spacing:-.4cqw;text-shadow:0 1px 0 rgba(255,255,255,.7);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mc-sub{font-weight:700;font-style:italic;text-transform:uppercase;color:#aeaeb2;font-size:6.6cqw;line-height:1.05;margin-top:1.5cqw;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-shadow:0 1px 0 rgba(255,255,255,.6)}
.mc-pic{position:absolute;left:7%;top:30%;width:86%;height:62%;z-index:2;display:block;overflow:visible;filter:drop-shadow(0 2px 3px rgba(0,0,0,.22))}
.mc-count{position:absolute;right:4.5cqw;bottom:4.5cqw;z-index:4;background:rgba(18,18,20,.85);color:#fff;font-weight:700;font-size:10cqw;line-height:1;padding:2.5cqw 4cqw;border-radius:4.5cqw;font-family:'Roboto',sans-serif;letter-spacing:.3px}
.action-btn{padding:7px 16px;border:1px solid #444;border-radius:6px;font-size:.88em;font-weight:700;cursor:pointer;margin:3px;transition:all .15s;background:#222;color:#bbb;font-family:'Barlow Condensed',sans-serif;letter-spacing:1px}
.action-btn:hover{background:#333;color:#fff;border-color:#666}
.action-btn.primary{background:#252525;border-color:#555;color:#ddd}
.action-btn.primary:hover{background:#333}
.action-btn.copy-btn{background:#0f1f10;border-color:#2a5a2a;color:#6ab86a}
.action-btn.copy-btn:hover{background:#152515;color:#8edd8e;border-color:#4a9a4a}
.action-btn.stats-btn{background:#10101f;border-color:#2a2a5a;color:#6a6ab8}
.action-btn.stats-btn:hover{background:#151528;color:#8e8edd;border-color:#4a4a9a}
.action-btn.danger-btn{background:#1f1010;border-color:#5a2a2a;color:#b86a6a}
.action-btn.danger-btn:hover{background:#2a1515;color:#dd8e8e;border-color:#9a4a4a}
.log-area{background:#0e0e0e;border-radius:10px;padding:10px;max-height:250px;overflow-y:auto;border:1px solid #222;width:100%;scroll-behavior:smooth}
.log-area h3{color:#444;font-size:.75em;margin:-10px 0 5px;text-transform:uppercase;letter-spacing:2px;position:sticky;top:-10px;background:#0e0e0e;padding:10px 0 3px;z-index:1}
.log-entry{padding:2px 0;font-size:.77em;border-bottom:1px solid #141414;color:#777;display:flex;align-items:center;gap:4px;flex-wrap:wrap}
.log-entry.damage{color:#aaa}.log-entry.block-log{color:#999}.log-entry.combo-log{color:#bbb}
.log-entry.system{color:#555;font-style:italic}.log-entry.malus-log{color:#777;font-style:italic}
.log-entry.reveal-log{color:#c8a840;font-style:italic}
.log-badge{display:inline-block;padding:1px 6px;border-radius:4px;font-size:.85em;font-weight:700;color:#fff;background:var(--mc);text-shadow:0 1px 1px rgba(0,0,0,.45);line-height:1.4}
.blocked-badge{display:inline-block;padding:1px 7px;border-radius:3px;font-size:.85em;font-weight:700;color:#fff;background:#444;border:1px solid #777;animation:blockFlash .5s ease-in-out 4}
@keyframes blockFlash{0%,100%{background:#444;color:#fff}50%{background:#bbb;color:#111}}
.hand-area{background:#141414;border-radius:8px;padding:8px;margin-bottom:8px;border:1px solid #252525}
.deck-info{font-size:.7em;color:#444;text-align:center;margin-top:3px}
.combo-choice-section p{font-size:.78em;color:#777;margin-bottom:6px}
.reference-box{background:#0e0e0e;border:1px solid #222;border-radius:10px;padding:10px 14px;width:100%;font-size:.75em}
.reference-box h3{color:#444;font-size:.78em;margin-bottom:6px;text-transform:uppercase;letter-spacing:2px}
.ref-section{margin-bottom:8px}.ref-section:last-child{margin-bottom:0}
.ref-row{display:flex;align-items:center;gap:5px;margin-bottom:3px;flex-wrap:wrap}
.speed-row{display:flex;align-items:center;gap:4px;flex-wrap:wrap}
.ref-arrow{color:#444}
.ko-text{font-family:'Bebas Neue',sans-serif;font-size:2.5em;color:#bbb;text-align:center;letter-spacing:5px;margin:6px 0}
.log-entry.charge-log{color:#3a6a5a;font-size:.72em;font-style:italic;}
/* ══ MULTIPLAYER ══ */
#mp-overlay{display:none;position:fixed;inset:0;z-index:1100;background:#0a0a10;overflow-y:auto;padding:24px 16px 40px;}
#mp-overlay.visible{display:block;animation:statsIn .3s ease;}
.mp-inner{max-width:580px;margin:0 auto;}
.mp-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px;flex-wrap:wrap;gap:8px;}
.mp-title{font-family:'Bebas Neue',sans-serif;font-size:2em;letter-spacing:6px;color:#aaa;}
.mp-version{font-family:'Barlow Condensed',sans-serif;font-size:.75em;color:#555;letter-spacing:2px;background:#141418;border:1px solid #2a2a2a;border-radius:5px;padding:3px 10px;}
.mp-back{background:none;border:1px solid #444;color:#777;border-radius:6px;padding:4px 14px;font-size:1em;cursor:pointer;font-family:'Barlow Condensed',sans-serif;}
.mp-back:hover{border-color:#888;color:#ccc;}
.mp-section{background:#141418;border:1px solid #2a2a2a;border-radius:12px;padding:16px;margin-bottom:14px;}
.mp-section h3{font-family:'Bebas Neue',sans-serif;font-size:1.05em;letter-spacing:3px;color:#777;margin-bottom:10px;}
.mp-role-btns{display:flex;gap:10px;}
.mp-role-btn{flex:1;font-family:'Bebas Neue',sans-serif;padding:14px;border:1px solid #333;border-radius:8px;font-size:1.15em;letter-spacing:3px;cursor:pointer;background:#1a1a1a;color:#666;transition:all .2s;}
.mp-role-btn:hover{border-color:#666;color:#ccc;background:#222;}
.mp-role-btn#mp-host-btn{width:100%}
.mp-help{font-size:.8em;color:#666;margin-bottom:10px}
.mp-divider{display:flex;align-items:center;gap:10px;margin:16px 0 12px;color:#444;font-size:.75em;text-transform:uppercase;letter-spacing:2px}
.mp-divider::before,.mp-divider::after{content:'';flex:1;height:1px;background:#2a2a2a}
.mp-join-row{display:flex;gap:8px;align-items:stretch}
.mp-join-row .mp-role-btn{flex:0 0 auto;padding:10px 18px}
#mp-room-input{flex:1;min-width:0;background:#0d0d10;border:2px solid #2a2a2a;border-radius:8px;color:#ddd;font-family:'Bebas Neue',sans-serif;font-size:1.5em;letter-spacing:6px;padding:8px 12px;outline:none;text-transform:uppercase}
#mp-room-input:focus{border-color:#555}
#mp-room-input.invalid{border-color:#cc4444}
.mp-room-code{font-family:'Bebas Neue',sans-serif;font-size:3em;letter-spacing:12px;color:#c8a840;text-align:center;margin:6px 0 10px;user-select:all}
.mp-share{display:flex;flex-direction:column;align-items:center;gap:6px;margin-bottom:6px}
.mp-connecting-msg{font-size:.85em;color:#777;text-align:center;margin:10px 0}
.mp-spinner-wrap{text-align:center;margin-top:8px}
.mp-spinner{font-size:2em;animation:spin 1s linear infinite;display:inline-block}
.mp-wide{margin-top:16px;width:100%}
#mp-fighter-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-bottom:12px}
.mp-fighter-pick{background:#141418;border:1px solid #2a2a2a;border-radius:8px;padding:8px 4px;cursor:pointer;transition:all .2s;display:flex;flex-direction:column;align-items:center;color:inherit;font-family:inherit}
.mp-fighter-pick:hover{border-color:#555}
.mp-fighter-pick .e{font-size:1.8em}
.mp-fighter-pick .n{font-size:.6em;color:#888;letter-spacing:1px;margin-top:2px;text-align:center}
.mp-fighter-pick .s{font-size:.5em;color:#555;letter-spacing:1px;font-style:italic;text-align:center}
.mp-start-wrap{margin-top:10px;text-align:center}
.mp-stats-btn{margin-top:8px;background:transparent;border:1px solid #1a3a1a;color:#3a6a3a;font-family:'Bebas Neue',sans-serif;letter-spacing:2px;padding:5px 16px;border-radius:7px;cursor:pointer;font-size:.75em}
.mp-lost-msg{color:#aa4444;font-size:.85em;margin-bottom:10px}
.mp-role-btn.host-active{background:#1a1a28;border-color:#5a5aaa;color:#9999dd;}
.mp-role-btn.guest-active{background:#1a281a;border-color:#3a8a3a;color:#77cc77;}
.mp-sdp-label{font-size:.72em;color:#555;margin-bottom:4px;letter-spacing:1px;display:block;}
.mp-sdp-area{width:100%;height:88px;background:#0d0d0d;border:1px solid #252525;border-radius:6px;color:#888;font-family:monospace;font-size:.68em;padding:7px;resize:none;line-height:1.4;}
.mp-sdp-area:focus{outline:none;border-color:#555;}
.mp-btn{font-family:'Barlow Condensed',sans-serif;padding:7px 16px;border:1px solid #444;border-radius:6px;font-size:.88em;font-weight:700;cursor:pointer;background:#222;color:#bbb;letter-spacing:1px;transition:all .15s;margin:2px;}
.mp-btn:hover{background:#333;color:#fff;border-color:#777;}
.mp-btn.primary{background:#1a1a28;border-color:#5a5aaa;color:#aaaaee;}
.mp-btn.primary:hover{background:#20203a;}
.mp-btn.success{background:#0f1f10;border-color:#3a8a3a;color:#77cc77;}
.mp-btn.danger{background:#1f0f0f;border-color:#8a3a3a;color:#cc7777;}
.mp-status{display:inline-block;padding:2px 8px;border-radius:4px;font-size:.7em;font-weight:700;letter-spacing:1px;}
.mp-status.off{background:#2a1a1a;border:1px solid #5a2a2a;color:#aa4444;}
.mp-status.wait{background:#2a2a1a;border:1px solid #7a6a1a;color:#ccaa44;animation:pulse .9s ease-in-out infinite alternate;}
.mp-status.on{background:#1a2a1a;border:1px solid #2a7a2a;color:#44cc44;}
@keyframes pulse{from{opacity:.6}to{opacity:1}}
.mp-qr-wrap{display:flex;justify-content:center;margin-top:10px;}
.mp-qr-wrap canvas,.mp-qr-wrap img{border-radius:6px;border:6px solid #fff;display:block}
.mp-qr-wrap:empty{display:none}
.mp-waiting{font-size:.8em;color:#555;font-style:italic;padding:6px 0;}
.mp-fighter-sel{display:flex;justify-content:space-around;align-items:center;flex-wrap:wrap;gap:10px;padding:4px 0;}
.mp-fighter-slot{background:#111;border:1px solid #2a2a2a;border-radius:8px;padding:10px 14px;text-align:center;min-width:120px;}
.mp-fighter-slot .emoji{font-size:2.2em;display:block;margin-bottom:4px;}
.mp-fighter-slot .name{font-size:.76em;color:#888;letter-spacing:1px;}
.mp-fighter-slot .label{font-size:.6em;color:#555;text-transform:uppercase;letter-spacing:2px;margin-bottom:4px;display:block;}
.mp-vs{font-family:'Bebas Neue',sans-serif;font-size:1.5em;color:#444;letter-spacing:4px;}
.mp-connected-ok{background:#0d180d;border:1px solid #2a5a2a;border-radius:8px;padding:8px 12px;text-align:center;font-size:.8em;color:#5acc5a;letter-spacing:1px;margin-bottom:8px;}
.mp-turn-waiting{background:#141428;border:1px solid #3a3a7a;border-radius:8px;padding:8px;font-size:.82em;color:#7777cc;text-align:center;margin:6px 0;}
.mp-opp-chose{background:#0d150d;border:1px solid #2a5a2a;border-radius:6px;padding:5px 10px;font-size:.78em;color:#55aa55;margin:4px 0;}
.revealed-hand-badge{background:#1a1a0a;border:1px solid #5a4a10;border-radius:6px;padding:5px 8px;margin-top:4px;font-size:.78em;color:#b8902a;display:inline-flex;gap:3px;flex-wrap:wrap;align-items:center}
.interactive-prompt{background:#1a1a2a;border:1px solid #3a3a6a;border-radius:8px;padding:10px;margin:4px 0;font-size:.8em}
.interactive-prompt p{color:#8888cc;margin-bottom:6px}
.card-pick-row{display:flex;flex-wrap:wrap;gap:5px;justify-content:center;margin-bottom:6px}
.card-pick-btn{padding:4px 12px;border-radius:4px;font-size:.85em;font-weight:700;cursor:pointer;color:#fff;border:2px solid rgba(255,255,255,.3);transition:all .15s;font-family:'Barlow Condensed',sans-serif}
.card-pick-btn:hover{filter:brightness(1.3);transform:scale(1.05)}
.hp-mode-badge{display:inline-block;font-size:.65em;padding:1px 6px;border-radius:3px;background:#1a2a1a;border:1px solid #3a6a3a;color:#6ab86a;margin-left:6px;vertical-align:middle;font-family:'Barlow Condensed',sans-serif;letter-spacing:1px}
.footer-disclaimer{max-width:1100px;margin:8px auto 0;padding:8px 16px;background:#0d0d10;border-top:1px solid #1a1a1a;font-size:.68em;color:#555;text-align:center;font-style:italic}
.ios-tip{
  max-width:1100px;margin:12px auto 0;padding:10px 16px;
  display:flex;align-items:center;gap:10px;
  background:#0d0d10;border-top:1px solid #1e1e1e;
  font-size:.72em;color:#444;
}
.ios-tip-icon{font-size:1.3em;flex-shrink:0}
.ios-tip strong{color:#666;display:block;margin-bottom:1px}
/* Hide tip when running as installed PWA */
@media (display-mode: standalone){.ios-tip{display:none}}
@keyframes spin{to{transform:rotate(360deg)}}

/* ════════════════ RESPONSIVE — iPhone portrait & small screens ════════════════ */
:root{--safe-l:env(safe-area-inset-left,0px);--safe-r:env(safe-area-inset-right,0px);--safe-b:env(safe-area-inset-bottom,0px)}
@media (max-width:760px){
  html,body{-webkit-text-size-adjust:100%}
  .game-container{padding:8px;padding-left:max(8px,var(--safe-l));padding-right:max(8px,var(--safe-r));padding-bottom:calc(16px + var(--safe-b))}

  /* topbar / logo — language picker gets its own row above the logo */
  .game-topbar{gap:6px;margin-bottom:8px;flex-wrap:wrap}
  .lang-mount-game{order:-1;width:100%;margin-left:0;justify-content:flex-end}
  h1{font-size:1.25em;letter-spacing:2px;padding:9px 6px}
  .topbar-btn{padding:10px 12px;font-size:.78em;margin-left:6px}

  /* ── action zone on top, two fighter panels side by side ── */
  .arena{flex-direction:row;flex-wrap:wrap;align-content:flex-start;gap:8px}
  .center-panel{order:1;width:100%;flex:none;min-width:0}
  .fighter-panel{order:2;flex:1;min-width:0;padding:8px}
  .fighter-panel.ai,.fighter-panel.player{padding:8px}
  .vs-text{display:none}
  .turn-info{padding:9px}
  .move-selection{grid-template-columns:repeat(auto-fit,minmax(98px,1fr));gap:7px}
  .log-area{max-height:160px}
  .fighter-panel .combo-item .combo-header{align-items:flex-start;gap:4px}
  .fighter-panel .combo-item .combo-name{line-height:1.2;overflow-wrap:anywhere;min-width:0}
  .fighter-panel .combo-item .combo-dmg{white-space:nowrap}
  h1{padding:5px 6px}
  .game-topbar h1 img{max-height:40px}

  /* comfortable tap targets (≥44px) */
  .action-btn{padding:12px 16px;font-size:.95em;margin:4px 3px}
  .face-toggle{padding:10px 16px}
  .lang-btn{padding:7px 11px;font-size:.95em}
  .combo-item{padding:8px 10px}

  /* ── fighter select ── */
  #char-select-overlay{padding:16px 12px calc(28px + var(--safe-b))}
  #fighter-select-grid{grid-template-columns:repeat(2,1fr);gap:8px;max-width:520px}
  .select-title{font-size:2em;letter-spacing:4px}
  .game-settings-bar{flex-wrap:wrap;gap:10px 14px;padding:10px 12px}
  .site-logo{max-height:90px}
  .select-toolbar{gap:6px}
  .select-toolbar .rules-open-btn{padding:10px 12px;font-size:.88em;letter-spacing:2px}
  #fight-dock{padding:8px 8px 8px 12px;gap:8px}
  #select-status{font-size:.85em}
  #fight-btn{padding:12px 18px;font-size:1.35em;letter-spacing:3px}
  .mp-room-code{font-size:2.4em;letter-spacing:8px}

  /* ── overlays (rules / stats / multiplayer) ── */
  #rules-overlay,#stats-overlay,#mp-overlay{padding:16px 12px calc(30px + var(--safe-b))}
  .rules-glossary{grid-template-columns:1fr}
  .rules-block-grid{grid-template-columns:repeat(3,1fr)}
  .rules-header h2,.stats-header h2{font-size:1.25em;letter-spacing:2px}
}
@media (max-width:380px){
  .move-selection{grid-template-columns:repeat(2,1fr)}
  h1{font-size:1.08em;letter-spacing:1px}
  .rules-block-grid{grid-template-columns:repeat(2,1fr)}
}
/* coarse-pointer: kill hover lift so cards don't get stuck "lifted" after a tap */
@media (hover:none){
  .move-btn:hover:not(:disabled){transform:none}
  .move-btn:hover:not(:disabled) .mcard{box-shadow:0 3px 7px rgba(0,0,0,.5),inset 0 0 0 3px #fff}
}

/* ════════════════ FIRST-RUN TUTORIAL ════════════════ */
#tutorial-overlay{display:none;position:fixed;inset:0;z-index:3500;background:rgba(8,8,12,.86);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);overflow-y:auto;padding:24px 16px calc(24px + var(--safe-b,0px))}
#tutorial-overlay.visible{display:flex;align-items:center;justify-content:center;animation:statsIn .3s ease}
.tut-box{position:relative;width:100%;max-width:440px;margin:auto;background:linear-gradient(180deg,#1c1c22,#141418);border:1px solid #33333c;border-radius:18px;padding:28px 22px 18px;box-shadow:0 20px 60px rgba(0,0,0,.6);text-align:center}
.tut-x{position:absolute;top:9px;right:11px;background:none;border:none;color:#666;font-size:1.2em;cursor:pointer;padding:4px 8px;line-height:1}
.tut-x:hover{color:#bbb}
.tut-emoji{font-size:2.6em;line-height:1;margin-bottom:8px}
.tut-title{font-family:'Bebas Neue',sans-serif;font-size:1.7em;letter-spacing:3px;color:#e4e4e8;margin-bottom:10px;line-height:1.05}
.tut-content{min-height:var(--tut-h,0px);display:flow-root}
.tut-body{font-size:.95em;line-height:1.55;color:#9a9aa2;margin-bottom:14px}
.tut-visual{display:flex;justify-content:center;align-items:center;gap:7px;flex-wrap:wrap;margin-bottom:16px}
.tut-visual:empty{display:none}
.tut-visual .move-btn{width:60px;pointer-events:none}
.tut-visual .rules-badge{font-size:1.15em;padding:3px 9px;margin:0}
.tut-arrow{color:#555;font-weight:700;font-size:1.05em}
.tut-dots{display:flex;justify-content:center;gap:7px;margin-bottom:16px}
.tut-dot{width:8px;height:8px;border-radius:50%;background:#3a3a44;transition:all .2s}
.tut-dot.active{background:#c8a840;transform:scale(1.25)}
.tut-nav{display:flex;gap:10px;justify-content:center;margin-bottom:10px}
.tut-btn{flex:1;max-width:175px;font-family:'Bebas Neue',sans-serif;letter-spacing:2px;font-size:1.05em;padding:13px 16px;border-radius:10px;cursor:pointer;border:1px solid #3a3a44;background:#202028;color:#bbb;transition:all .15s}
.tut-btn:hover{background:#2a2a34;color:#fff}
.tut-btn.primary{background:#c8a840;border-color:#c8a840;color:#1a1a1a;font-weight:700}
.tut-btn.primary:hover{background:#d8b850}
.tut-btn[hidden]{display:block;visibility:hidden}
.tut-skip{background:none;border:none;color:#555;font-size:.82em;cursor:pointer;text-decoration:underline;letter-spacing:1px;font-family:'Barlow Condensed',sans-serif;padding:6px}
.tut-skip:hover{color:#999}
.tut-skip[hidden]{display:inline-block;visibility:hidden}

/* ════════════════ LIGHT THEME ════════════════ */
body.theme-light{background:#f5f5f2;color:#1a1a1a}
body.theme-light #char-select-overlay{background:#eeeeea}
body.theme-light #char-select-overlay::before{display:none}
body.theme-light h1{background:#e8e8e4;border-color:#d0d0cc;color:#222}
body.theme-light .topbar-btn{background:#e4e4f4;border-color:#a8a8cc;color:#5a5a9a}
body.theme-light .topbar-btn:hover{background:#d8d8ee;color:#3a3a8a;border-color:#8888cc}
body.theme-light .lang-btn{background:#e8e8e4;border-color:#ccc;color:#666}
body.theme-light .lang-btn:hover{border-color:#999;color:#333}
body.theme-light .lang-btn.active{background:#c8a840;color:#000;border-color:#c8a840}
body.theme-light .fighter-panel{background:#fff;border-color:#d4d4d0}
body.theme-light .fighter-name{color:#222}
body.theme-light .health-bar-container{background:#f0f0ec}
body.theme-light .hp-label{color:#888}
body.theme-light .hp-pip.empty{background:#ddd;border-color:#c8c8c4}
body.theme-light .hp-pip.lost-now{background:#c8a8d8}
body.theme-light .hand-area{background:#f0f0ec;border-color:#d8d8d4}
body.theme-light .charge-zone{background:#f0f0ec;border-color:#d8d8d4}
body.theme-light .hand-area h3,body.theme-light .charge-zone h3,body.theme-light .combo-list h3{color:#888}
body.theme-light .combo-item{background:#f4f4f0;border-color:#d8d8d4}
body.theme-light .combo-item .combo-name{color:#333}
body.theme-light .combo-item .combo-dmg{color:#777}
body.theme-light .combo-item .combo-special{color:#888}
body.theme-light .combo-item.available{background:#f8f8f4;border-color:#9977cc}
body.theme-light .combo-item.available .combo-name{color:#1a1a1a}
body.theme-light .combo-item.available .combo-special{color:#555}
body.theme-light .face-indicator{background:#f0f0ec;border-color:#d0d0cc;color:#888}
body.theme-light .face-toggle{background:#e8e8e4;border-color:#bbb;color:#444}
body.theme-light .face-toggle:hover{background:#ddd;color:#111;border-color:#888}
body.theme-light .deck-info{color:#888}
body.theme-light .turn-info{background:#f0f0ec;border-color:#d0d0cc}
body.theme-light .turn-info h3{color:#888}
body.theme-light .phase-banner{background:#e8e8e4;border-color:#ccc;color:#333}
body.theme-light .vs-text{color:#ccc}
body.theme-light .ko-text{color:#555}
body.theme-light .log-area{background:#e8e8e4;border-color:#d0d0cc}
body.theme-light .log-area h3{background:#e8e8e4;color:#888}
body.theme-light .log-entry{color:#555;border-color:#d8d8d4}
body.theme-light .log-entry.damage{color:#333}
body.theme-light .log-entry.block-log{color:#444}
body.theme-light .log-entry.combo-log{color:#222}
body.theme-light .log-entry.system{color:#999}
body.theme-light .log-entry.reveal-log{color:#a87a10}
body.theme-light .reference-box{background:#e8e8e4;border-color:#d0d0cc}
body.theme-light .reference-box h3{color:#888}
body.theme-light .ref-arrow{color:#bbb}
body.theme-light .action-btn{background:#e8e8e4;border-color:#bbb;color:#333}
body.theme-light .action-btn:hover{background:#ddd;color:#111;border-color:#888}
body.theme-light .action-btn.primary{background:#e0e0dc;border-color:#aaa;color:#222}
body.theme-light .action-btn.copy-btn{background:#e8f4e8;border-color:#5a9a5a;color:#2a6a2a}
body.theme-light .action-btn.stats-btn{background:#e8e8f8;border-color:#6a6aaa;color:#3a3a8a}
body.theme-light .action-btn.danger-btn{background:#f8e8e8;border-color:#aa6a6a;color:#7a2a2a}
body.theme-light .game-settings-bar{background:#f0f0ec;border-color:#d0d0cc}
body.theme-light .settings-label{color:#888}
body.theme-light .settings-btn{background:#e8e8e4;border-color:#ccc;color:#888}
body.theme-light .settings-btn:hover{border-color:#999;color:#444}
body.theme-light .settings-btn.active{background:#e0e0dc;border-color:#999;color:#222}
body.theme-light .rules-open-btn{background:#eaeaf8;border-color:#9a9acc;color:#5a5a8a}
body.theme-light .rules-open-btn:hover{background:#dcdcf0;color:#3a3a8a;border-color:#7a7acc}
body.theme-light #fight-btn:not(:disabled){background:#e8e8e0;color:#a08020;border-color:#907020}
body.theme-light #select-status{color:#888}
body.theme-light .rules-open-btn.palmares-btn{background:#f6f0dc;border-color:#c8a840;color:#8a6a10}
body.theme-light .info-note-1v1{background:#e4f0f8;border-color:#a8c8e8;color:#3a6890}
body.theme-light .info-note-1v1 b{color:#2a5a88}
body.theme-light .rules-open-btn.mp-start-btn{background:#e8f8e8;border-color:#5a9a5a;color:#2a7a2a}
body.theme-light .thanks-banner{background:#f0f0ec;border-color:#d0d0cc}
body.theme-light .thanks-banner span{color:#555}
body.theme-light .thanks-banner a{color:#9a7a10}
body.theme-light #fight-dock{background:rgba(245,245,242,.95);border-color:#d0d0cc;box-shadow:0 -6px 24px rgba(0,0,0,.08)}
body.theme-light .select-tagline{color:#888}
body.theme-light h1 .h1-tagline{color:#777}
body.theme-light #mp-room-input{background:#fff;border-color:#ccc;color:#222}
body.theme-light .mp-fighter-pick{background:#fff;border-color:#d0d0cc}
body.theme-light .mp-fighter-pick .n{color:#444}
body.theme-light .mp-help,body.theme-light .mp-connecting-msg{color:#666}
body.theme-light .mp-divider::before,body.theme-light .mp-divider::after{background:#d0d0cc}
body.theme-light .fighter-select-card{background:#fff;border-color:#d8d8d4}
body.theme-light .fighter-select-card:hover{border-color:#aaa}
body.theme-light .fighter-select-card.player-selected{background:#fdfbee;border-color:#b8962a}
body.theme-light .fighter-select-card.ai-selected{background:#fff8f8;border-color:#8a2020}
body.theme-light .sel-fighter-name{color:#333}
body.theme-light .sel-fighter-style{color:#888}
body.theme-light .sel-combo-name{color:#555}
body.theme-light .sel-combo-dmg{color:#aaa}
body.theme-light .sel-win-badge{background:#f0f0ec;border-color:#d0d0cc;color:#999}
body.theme-light .sel-win-badge.has-win{border-color:#888;color:#c8a840}
body.theme-light .sel-win-badge.beaten{border-color:#3a9a4a;color:#3a9a4a}
body.theme-light .sel-divider{background:#e0e0dc}
body.theme-light #rules-overlay,body.theme-light #stats-overlay{background:rgba(238,238,234,.97)}
body.theme-light .rules-inner,body.theme-light .stats-inner{background:#f5f5f2;border-color:#d0d0cc}
body.theme-light .rules-header,body.theme-light .stats-header{background:#eaeae6;border-color:#d0d0cc}
body.theme-light .rules-header h2,body.theme-light .stats-header h2{color:#444}
body.theme-light .rules-body{color:#555}
body.theme-light .rules-section h3{color:#444;border-color:#d0d0cc}
body.theme-light .rules-section p,body.theme-light .rules-section ul li{color:#666}
body.theme-light .rules-section ul li strong{color:#444}
body.theme-light .rules-block-item{background:#f0f0ec;border-color:#d0d0cc}
body.theme-light .rules-block-item .arrow{color:#aaa}
body.theme-light .rules-gloss-item{background:#f0f0ec;border-color:#d8d8d4}
body.theme-light .rules-gloss-item dt{color:#333}
body.theme-light .rules-gloss-item dd{color:#777}
body.theme-light .rules-close,body.theme-light .stats-close{border-color:#ccc;color:#888}
body.theme-light .rules-close:hover,body.theme-light .stats-close:hover{border-color:#888;color:#333}
body.theme-light .summary-box,body.theme-light .stats-duel-card,body.theme-light .stats-chart-wrap,body.theme-light .stats-table-wrap{background:#f0f0ec;border-color:#d0d0cc}
body.theme-light .summary-box .s-val{color:#333}
body.theme-light .summary-box .s-lbl{color:#888}
body.theme-light .stats-duel-body{color:#555}
body.theme-light .stats-stat-label{color:#888}
body.theme-light .stats-bar-track{background:#d8d8d4}
body.theme-light .stats-vs-bar{border-color:#d0d0cc}
body.theme-light .stats-section-title{color:#888;border-color:#d0d0cc}
body.theme-light .stats-chart-title{color:#888}
body.theme-light .chart-legend span{color:#555}
body.theme-light .stats-mini-track{background:#d8d8d4}
body.theme-light .stats-move-grid-hdr{color:#888;border-color:#d0d0cc}
body.theme-light .stats-table-title{background:#eaeae6;border-color:#d0d0cc;color:#666}
body.theme-light table.move-stats th{background:#eaeae6;border-color:#d0d0cc;color:#888}
body.theme-light table.move-stats td{border-color:#e0e0dc;color:#888}
body.theme-light table.move-stats tr:hover td{background:#f0f0ec}
body.theme-light .num-hi{color:#333}
body.theme-light #mp-overlay{background:#eeeeea}
body.theme-light .mp-section{background:#f0f0ec;border-color:#d0d0cc}
body.theme-light .mp-section h3{color:#888}
body.theme-light .mp-title{color:#444}
body.theme-light .mp-version{background:#e8e8e4;border-color:#ccc;color:#888}
body.theme-light .mp-back{border-color:#ccc;color:#888}
body.theme-light .mp-back:hover{border-color:#888;color:#333}
body.theme-light .mp-role-btn{background:#f0f0ec;border-color:#d0d0cc;color:#888}
body.theme-light .mp-role-btn:hover{border-color:#888;color:#444;background:#e8e8e4}
body.theme-light .mp-sdp-area{background:#f0f0ec;border-color:#d0d0cc;color:#555}
body.theme-light .mp-btn{background:#e8e8e4;border-color:#bbb;color:#555}
body.theme-light .mp-btn:hover{background:#ddd;color:#333;border-color:#888}
body.theme-light .mp-fighter-slot{background:#f0f0ec;border-color:#d0d0cc}
body.theme-light .mp-fighter-slot .name{color:#555}
body.theme-light .mp-fighter-slot .label{color:#888}
body.theme-light .mp-vs{color:#bbb}
body.theme-light .record-inner{background:#f5f5f2;border-color:#d0d0cc}
body.theme-light .record-name{color:#333}
body.theme-light .record-style{color:#888}
body.theme-light .record-ratio-bar{border-color:#d0d0cc}
body.theme-light .record-ratio-labels{color:#888}
body.theme-light .record-history-title{color:#888;border-color:#d0d0cc}
body.theme-light .record-history-item.win{background:#e8f4e8;border-color:#a8d4a8}
body.theme-light .record-history-item.loss{background:#f4e8e8;border-color:#d4a8a8}
body.theme-light .record-history-date{color:#888}
body.theme-light .record-close-btn{border-color:#ccc;color:#888}
body.theme-light .all-beaten-popup,body.theme-light #record-popup{background:rgba(238,238,234,.97)}
body.theme-light #tutorial-overlay{background:rgba(230,230,226,.92)}
body.theme-light .tut-box{background:linear-gradient(180deg,#f0f0ec,#e8e8e4);border-color:#d0d0cc;box-shadow:0 20px 60px rgba(0,0,0,.12)}
body.theme-light .tut-title{color:#1a1a1a}
body.theme-light .tut-body{color:#555}
body.theme-light .tut-dot{background:#d0d0cc}
body.theme-light .tut-btn{background:#e8e8e4;border-color:#d0d0cc;color:#333}
body.theme-light .tut-btn:hover{background:#ddd;color:#111}
body.theme-light .tut-btn.primary{background:#c8a840;border-color:#c8a840;color:#1a1a1a}
body.theme-light .tut-skip{color:#aaa}
body.theme-light .tut-skip:hover{color:#555}
body.theme-light .ios-tip{background:#e8e8e4;border-color:#d0d0cc;color:#888}
body.theme-light .ios-tip strong{color:#555}
body.theme-light .footer-disclaimer{background:#e8e8e4;border-color:#d0d0cc;color:#888}