/* ROBO ARENA — habillage "holosseum" : grille néon, métal sombre, hexagones */
:root{
  --bg:#070b12; --bg2:#0b1220; --panel:#0e1726;
  --line:#1c3350; --cyan:#37e2ff; --cyan-d:#12b7d6;
  --amber:#ffb347; --red:#ff4d5e; --tx:#d7e8f5; --dim:#5f7d96;
  --font: "Rajdhani","Segoe UI",system-ui,sans-serif;
  --cut:1;                                       /* 1=coins biseautés, 0=arrondis */
  --rad:0px;                                     /* rayon quand cut=0 */
}
*{box-sizing:border-box;margin:0;padding:0}
body{background:var(--bg);color:var(--tx);font-family:var(--font);
  min-height:100vh;overflow-x:hidden}
.hidden{display:none!important}

/* ------- fond holosseum ------- */
.grid-bg{position:fixed;inset:0;z-index:-2;
  background:
    radial-gradient(ellipse 90% 55% at 50% -5%, #12294a66, transparent 70%),
    linear-gradient(transparent 95%, #0d1f38 95%),
    repeating-linear-gradient(0deg,transparent 0 46px,#12335c33 46px 47px),
    repeating-linear-gradient(90deg,transparent 0 46px,#12335c33 46px 47px),
    var(--bg);}
.scan{position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:repeating-linear-gradient(0deg,transparent 0 3px,#00000014 3px 4px);
  mix-blend-mode:multiply}

/* ------- topbar ------- */
#topbar{display:flex;align-items:center;gap:22px;padding:12px 26px;
  border-bottom:1px solid var(--line);
  background:linear-gradient(180deg,#0c1526cc,#070b12cc);
  backdrop-filter:blur(4px);position:sticky;top:0;z-index:10}
.logo{font-size:26px;font-weight:800;letter-spacing:3px;color:var(--tx)}
.logo b{color:var(--cyan);text-shadow:0 0 14px #37e2ff88}
.logo .sub{display:block;font-size:9px;letter-spacing:6px;color:var(--dim)}
nav{display:flex;gap:8px;align-items:center;margin-left:auto}
.navbtn{background:none;border:1px solid var(--line);color:var(--tx);
  padding:8px 18px;font:inherit;font-weight:700;letter-spacing:2px;
  clip-path:polygon(8px 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%,0 8px);
  cursor:pointer;transition:.15s}
.navbtn:hover,.navbtn.on{border-color:var(--cyan);color:var(--cyan);
  box-shadow:inset 0 0 18px #37e2ff22}
.navbtn.hot{border-color:var(--amber);color:var(--amber)}
.navbtn.hot:hover{box-shadow:inset 0 0 18px #ffb34733}
.navbtn.dim{color:var(--dim);font-weight:400;font-size:13px}
.dcbtn{display:inline-flex;align-items:center;gap:8px;background:#5865F2;
  color:#fff;text-decoration:none;padding:7px 14px;font:inherit;font-weight:700;
  letter-spacing:1px;font-size:13px;
  clip-path:polygon(8px 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%,0 8px);
  transition:.15s}
.dcbtn:hover{background:#4752C4;box-shadow:0 0 16px #5865f288}
.dcbtn svg{display:block}
.credits{color:var(--amber);font-weight:800;letter-spacing:1px;
  padding:8px 14px;border:1px solid #ffb34733;font-size:15px}

/* ------- sélecteur de langue ------- */
#lang-pick{display:flex;gap:4px;margin-left:10px}
.langbtn{background:none;border:1px solid var(--line);color:var(--dim);
  padding:5px 9px;font:inherit;font-weight:700;font-size:12px;
  letter-spacing:1px;cursor:pointer;transition:.15s;
  clip-path:polygon(5px 0,100% 0,100% calc(100% - 5px),calc(100% - 5px) 100%,0 100%,0 5px)}
.langbtn:hover{border-color:var(--cyan-d);color:var(--tx)}
.langbtn.on{border-color:var(--cyan);color:var(--cyan);
  box-shadow:inset 0 0 12px #37e2ff22}
.langbtn.big{padding:9px 20px;font-size:15px;margin-right:8px}
#set-lang{margin-top:10px}

/* ------- avatars ------- */
.topavatar{width:40px;height:40px;object-fit:contain;border:1px solid var(--line);
  background:#0a1424;clip-path:polygon(6px 0,100% 0,100% calc(100% - 6px),calc(100% - 6px) 100%,0 100%,0 6px)}
.avatars{display:grid;grid-template-columns:repeat(auto-fill,minmax(64px,1fr));
  gap:8px;margin-bottom:18px;max-height:230px;overflow-y:auto}
.avatars .av{border:1px solid var(--line);background:#0a1424;cursor:pointer;
  padding:4px;transition:.12s;aspect-ratio:1}
.avatars .av img{width:100%;height:100%;object-fit:contain;image-rendering:auto}
.avatars .av:hover{border-color:var(--cyan-d)}
.avatars .av.on{border-color:var(--cyan);box-shadow:0 0 12px #37e2ff55;
  background:#0d2038}
.avatars .av.npc img{object-fit:cover;object-position:top;
  image-rendering:auto;background:#12233d}
/* identité du pilote dans la nav : avatar + nom, cliquable -> compte */
#my-id{display:flex;align-items:center;gap:8px;cursor:pointer;
  padding:3px 10px 3px 3px;border:1px solid transparent;transition:.15s}
#my-id:hover{border-color:var(--line)}
#my-id b{font-size:14px;letter-spacing:1px;color:var(--tx);max-width:140px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* ------- layout ------- */
main{max-width:1180px;margin:0 auto;padding:26px 18px 60px}
.panel{background:linear-gradient(180deg,#101c30,#0b1322);
  border:1px solid var(--line);padding:20px;
  clip-path:polygon(0 0,calc(100% - 18px) 0,100% 18px,100% 100%,18px 100%,0 calc(100% - 18px));
  box-shadow:0 0 0 1px #000,inset 0 0 40px #0a2540}
h2{font-size:15px;letter-spacing:4px;color:var(--cyan);margin-bottom:14px;
  text-shadow:0 0 10px #37e2ff55}
h2 .dim{color:var(--dim);font-size:12px;letter-spacing:1px}
.cols{display:flex;gap:18px;align-items:flex-start}
.cols .grow{flex:1}
.err{color:var(--red);min-height:18px;font-size:13px;margin-top:6px}
.dim{color:var(--dim)}

/* ------- landing ------- */
#v-landing{display:flex;gap:30px;align-items:center;min-height:70vh;
  flex-wrap:wrap;justify-content:center}
.hero{position:relative;flex:1;min-width:330px;height:420px;overflow:hidden;
  border:1px solid var(--line);border-radius:4px}
.hero-grid{position:absolute;inset:-40% -10% 0;transform:perspective(500px)
  rotateX(62deg) scale(2.4);transform-origin:top;
  background:
    repeating-linear-gradient(0deg,transparent 0 44px,#37e2ff55 44px 46px),
    repeating-linear-gradient(90deg,transparent 0 44px,#37e2ff55 44px 46px);
  animation:gridmove 6s linear infinite}
@keyframes gridmove{to{background-position:0 46px,0 0}}
.hero-inner{position:absolute;inset:0;padding:40px;pointer-events:none;
  background:linear-gradient(90deg,#070b12ee 30%,transparent)}
.demo-iframe{position:absolute;inset:0;width:100%;height:100%;border:0;
  pointer-events:none}
.demo-chip{position:absolute;right:12px;bottom:10px;z-index:2;
  display:flex;align-items:center;gap:7px;padding:4px 10px;
  background:#070b12cc;border:1px solid var(--line);border-radius:3px;
  font-size:11px;letter-spacing:2px;color:var(--cyan);pointer-events:none}
.demo-chip .dot{width:7px;height:7px;border-radius:50%;background:#ff4757;
  box-shadow:0 0 8px #ff4757;animation:blink 1.2s infinite}
@keyframes blink{50%{opacity:.25}}
.hero-inner h1{font-size:56px;line-height:.95;letter-spacing:4px;
  color:var(--tx);text-shadow:0 0 30px #37e2ff44}
.hero-inner h1 span{color:var(--cyan);font-size:64px}
.tag{color:var(--amber);letter-spacing:3px;margin:18px 0 8px;font-weight:700}
.desc{color:var(--dim);max-width:340px;font-size:15px}
.authcard{width:330px;display:flex;flex-direction:column;gap:12px}
.authcard input{background:#070d18;border:1px solid var(--line);color:var(--tx);
  padding:12px 14px;font:inherit;font-size:16px;letter-spacing:1px;outline:none}
.authcard input:focus{border-color:var(--cyan);box-shadow:0 0 12px #37e2ff33}

/* ------- robo 3D ------- */
#robo3d-holder{width:100%;height:340px;margin-bottom:16px;
  border:1px solid var(--line);
  background:radial-gradient(ellipse 80% 60% at 50% 80%,#12335c66,transparent 75%),#070d18;
  clip-path:polygon(0 0,calc(100% - 14px) 0,100% 14px,100% 100%,0 100%)}
#robo3d-holder canvas{display:block}

/* ------- boutons ------- */
.btn{background:linear-gradient(180deg,#12b7d6,#0d8fb0);border:none;
  color:#031018;padding:11px;font:inherit;font-weight:800;font-size:15px;
  letter-spacing:2px;cursor:pointer;
  clip-path:polygon(10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px)}
.btn:hover{filter:brightness(1.2)}
.btn.dim{background:#13253d;color:var(--dim);font-weight:400;font-size:13px}
.btn.big{font-size:19px;padding:16px;margin-top:10px}
.btn.hot{background:linear-gradient(180deg,#ffb347,#e08a1d);color:#241300}
.btn:disabled{opacity:.4;cursor:default}

/* ------- hangar ------- */
.pilot{display:grid;grid-template-columns:1fr 1fr;gap:8px 18px;margin-bottom:20px}
.pilot .row{display:flex;justify-content:space-between;font-size:15px;
  border-bottom:1px dashed #1c3350;padding:4px 0}
.pilot .row b{color:var(--cyan)}
.slots{display:flex;flex-direction:column;gap:8px}
.slot{display:flex;justify-content:space-between;align-items:center;
  background:#0a1424;border:1px solid var(--line);padding:9px 12px;
  clip-path:polygon(6px 0,100% 0,100% calc(100% - 6px),calc(100% - 6px) 100%,0 100%,0 6px)}
.slot .t{color:var(--dim);font-size:11px;letter-spacing:3px;text-transform:uppercase}
.slot .n{font-weight:700}
.slot select{background:#070d18;color:var(--tx);border:1px solid var(--line);
  font:inherit;padding:4px 8px;max-width:190px}

/* ------- cartes pièces ------- */
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(215px,1fr));
  gap:12px;max-height:62vh;overflow-y:auto;padding-right:6px}
.card{background:#0a1424;border:1px solid var(--line);padding:12px;
  clip-path:polygon(0 0,calc(100% - 12px) 0,100% 12px,100% 100%,0 100%);
  transition:.12s}
.card:hover{border-color:var(--cyan-d)}
.card .pimg{width:100%;height:110px;object-fit:contain;display:block;
  background:radial-gradient(ellipse 70% 55% at 50% 65%,#12335c55,transparent 70%);
  margin-bottom:6px}
.card .nm{font-weight:800;font-size:15px;margin-bottom:2px}
.card .tp{color:var(--dim);font-size:10px;letter-spacing:2px;text-transform:uppercase}
.card .stats{margin:8px 0;display:grid;gap:3px}
.statbar{display:flex;align-items:center;gap:6px;font-size:10px}
.statbar .k{width:34px;color:var(--dim);letter-spacing:1px}
.statbar .tr{flex:1;height:5px;background:#0d1f38}
.statbar .f{height:100%;background:linear-gradient(90deg,var(--cyan-d),var(--cyan))}
.card .foot{display:flex;justify-content:space-between;align-items:center;margin-top:8px}
.card .pr{color:var(--amber);font-weight:800}
.card .own{color:var(--cyan);font-size:12px;letter-spacing:1px}
.btn.mini{padding:5px 14px;font-size:12px}
.card .illegal{color:var(--red);font-size:10px;letter-spacing:1px}
.src{font-size:9px;letter-spacing:1px;padding:1px 5px;border:1px solid;
  vertical-align:middle;font-weight:700}
.src.gc{color:var(--cyan);border-color:#37e2ff55}
.src.ds{color:var(--amber);border-color:#ffb34755}

/* ------- tabs ------- */
.tabs{display:flex;gap:6px;margin-bottom:14px;flex-wrap:wrap}
.tab{background:#0a1424;border:1px solid var(--line);color:var(--dim);
  padding:7px 18px;font:inherit;font-weight:700;letter-spacing:2px;
  font-size:13px;cursor:pointer;text-transform:uppercase}
.tab.on{color:var(--cyan);border-color:var(--cyan)}

/* ------- battle ------- */
.battlewrap{display:flex;gap:22px;justify-content:center;flex-wrap:wrap;
  margin-top:8vh}
.battlecard{width:340px;text-align:center;padding:30px 22px}
.battlecard p{color:var(--dim);margin:6px 0 14px;font-size:14px}

footer{text-align:center;color:var(--dim);font-size:12px;padding:20px;
  letter-spacing:2px}
@media(max-width:760px){.cols{flex-direction:column}.cols>*{width:100%}}

/* ------- story / ligue ------- */
.story-sub{margin:-6px 0 16px;font-size:13px}
.league{border:1px solid var(--line);margin-bottom:10px;background:#0a1424}
.league-h{display:flex;align-items:baseline;gap:14px;padding:12px 16px;
  cursor:pointer;user-select:none}
.league-h b{color:var(--cyan);letter-spacing:2px;font-size:15px}
.league-h .dim{flex:1;font-size:12px}
.league-h .lcount{color:var(--amber);font-weight:700}
.league.locked{opacity:.45}
.league.locked .league-h b{color:var(--dim)}
.league.done .league-h b{color:#7fe8a0}
.fights{border-top:1px solid var(--line);display:grid;
  grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}
.fight{display:flex;align-items:center;gap:10px;padding:8px 12px;
  border-bottom:1px solid #12203a;border-right:1px solid #12203a;
  cursor:pointer;transition:.12s}
.fight:hover:not(.locked){background:#122c4a}
.fight .fn{color:var(--dim);font-size:11px;width:28px}
.fight img{width:44px;height:44px;object-fit:contain;flex:none;
  background:radial-gradient(circle,#12335c44,transparent 70%)}
.fight .fmain{flex:1;min-width:0}
.fight .fmain b{display:block;font-size:13px;white-space:nowrap;
  overflow:hidden;text-overflow:ellipsis}
.fight .fmain i{color:var(--dim);font-size:11px;font-style:normal}
.fight .fr{color:var(--amber);font-weight:700;font-size:13px;white-space:nowrap}
.fight.done .fr{color:#7fe8a0}
.fight.locked{cursor:default;opacity:.38}
.fight.locked img{filter:grayscale(1)}
.fight.next{outline:1px solid var(--cyan);outline-offset:-1px;
  background:#0f2438}
.fight.next .fn{color:var(--cyan)}
.fight.boss .fmain b{color:var(--red)}
.fight.boss img{background:radial-gradient(circle,#5c122044,transparent 70%)}

/* ------- sélecteur de starter ------- */
.stp-title{color:var(--dim);font-size:11px;letter-spacing:3px;
  margin:4px 0 8px;text-align:center}
#starter-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.stc{border:1px solid var(--line);background:#0a1424;padding:8px 6px;
  text-align:center;cursor:pointer;transition:.12s}
.stc:hover{border-color:var(--cyan-d)}
.stc.on{border-color:var(--cyan);box-shadow:0 0 10px #37e2ff33}
.stc img{width:100%;height:52px;object-fit:contain}
.stc b{display:block;font-size:11px;margin-top:4px;color:var(--tx)}
.stc i{display:block;font-size:9px;color:var(--dim);font-style:normal;
  line-height:1.25;min-height:23px}

/* ==================================================================
   THEMES — body[data-theme="..."]
   neo = défaut (déclaré en :root). Overrides : palette + formes.
   ================================================================== */

/* --- neutralisation du découpe biseautée pour les thèmes arrondis --- */
body[data-theme="deck"] .navbtn, body[data-theme="deck"] .btn,
body[data-theme="deck"] .panel, body[data-theme="deck"] .card,
body[data-theme="deck"] .slot, body[data-theme="deck"] .topavatar,
body[data-theme="deck"] .avatars .av, body[data-theme="deck"] .chap-art,
body[data-theme="deck"] .fe-av, body[data-theme="deck"] .chap-banner,
body[data-theme="deck"] #robo3d-holder, body[data-theme="deck"] #scene-inner,
body[data-theme="deck"] #sc-e-avatar, body[data-theme="deck"] .stc,
body[data-theme="deck"] .ac,
body[data-theme="stadium"] .navbtn, body[data-theme="stadium"] .btn,
body[data-theme="stadium"] .panel, body[data-theme="stadium"] .card,
body[data-theme="stadium"] .slot, body[data-theme="stadium"] .topavatar,
body[data-theme="stadium"] .avatars .av, body[data-theme="stadium"] .chap-art,
body[data-theme="stadium"] .fe-av, body[data-theme="stadium"] .chap-banner,
body[data-theme="stadium"] #robo3d-holder, body[data-theme="stadium"] #scene-inner,
body[data-theme="stadium"] #sc-e-avatar, body[data-theme="stadium"] .stc,
body[data-theme="stadium"] .ac,
body[data-theme="ug"] .panel, body[data-theme="ug"] .card,
body[data-theme="ug"] .slot, body[data-theme="ug"] .topavatar,
body[data-theme="ug"] .avatars .av, body[data-theme="ug"] .chap-art,
body[data-theme="ug"] .fe-av, body[data-theme="ug"] .chap-banner,
body[data-theme="ug"] #robo3d-holder, body[data-theme="ug"] #scene-inner,
body[data-theme="ug"] #sc-e-avatar, body[data-theme="ug"] .stc,
body[data-theme="ug"] .ac,
body[data-theme="silver"] .navbtn, body[data-theme="silver"] .btn,
body[data-theme="silver"] .panel, body[data-theme="silver"] .card,
body[data-theme="silver"] .slot, body[data-theme="silver"] .topavatar,
body[data-theme="silver"] .avatars .av, body[data-theme="silver"] .chap-art,
body[data-theme="silver"] .fe-av, body[data-theme="silver"] .chap-banner,
body[data-theme="silver"] #robo3d-holder, body[data-theme="silver"] #scene-inner,
body[data-theme="silver"] #sc-e-avatar, body[data-theme="silver"] .stc,
body[data-theme="silver"] .ac {
  clip-path:none !important; border-radius:var(--rad);
}

/* ================= 02 — COMMAND DECK (DS, métal/orange) ================= */
body[data-theme="deck"]{
  --bg:#1a1c22; --bg2:#20242c; --panel:#23262e;
  --line:#3a3f4b; --cyan:#ff9f37; --cyan-d:#d98a1d;
  --amber:#ffd94a; --red:#ff5d5d; --tx:#e8eaef; --dim:#8a91a0;
  --font:"Segoe UI","Arial",system-ui,sans-serif; --rad:4px;
}
body[data-theme="deck"] .navbtn, body[data-theme="deck"] .btn{
  border:2px solid var(--line);box-shadow:0 3px 0 #101216,inset 0 1px 0 #4a505e;
  border-radius:var(--rad)}
body[data-theme="deck"] .btn{background:linear-gradient(180deg,#ffb347,#d98a1d);
  color:#241300;border-color:#8a5510;box-shadow:0 3px 0 #59360a}
body[data-theme="deck"] .btn.dim{background:#2a2e38;color:var(--dim);
  border-color:var(--line)}
body[data-theme="deck"] .panel{border-width:2px;background:#23262e;
  box-shadow:0 4px 0 #101216,inset 0 1px 0 #343945}
body[data-theme="deck"] h2, body[data-theme="deck"] .logo{
  text-shadow:0 2px 0 #000}
body[data-theme="deck"] .grid-bg{
  background:
    repeating-linear-gradient(45deg,#20242c 0 8px,#1b1e24 8px 16px),var(--bg)}

/* ================= 03 — STADIUM (GC, bleu/jaune, arrondi) ================= */
body[data-theme="stadium"]{
  --bg:#0d2e5c; --bg2:#0a2447; --panel:#123c72;
  --line:#2e6ccc; --cyan:#ffd94a; --cyan-d:#f0a818;
  --amber:#ffd94a; --red:#ff5d6c; --tx:#eaf3ff; --dim:#9ec4ee;
  --font:"Segoe UI","Arial",system-ui,sans-serif; --rad:14px;
}
body[data-theme="stadium"] .btn{background:linear-gradient(180deg,#ffd94a,#f0a818);
  color:#332000;border-radius:20px;
  box-shadow:0 4px 0 #a86e00,0 0 20px #ffd94a33;border:none}
body[data-theme="stadium"] .btn.dim{background:#123c72;color:var(--dim);
  box-shadow:0 4px 0 #0a2447}
body[data-theme="stadium"] .navbtn{border:none;border-bottom:3px solid transparent;
  border-radius:0;padding:8px 14px}
body[data-theme="stadium"] .navbtn:hover,body[data-theme="stadium"] .navbtn.on{
  border-color:transparent;border-bottom-color:var(--cyan);color:var(--cyan);
  box-shadow:none;background:#123c7255}
body[data-theme="stadium"] .panel{border:2px solid var(--line);
  box-shadow:0 4px 0 #0a2447}
body[data-theme="stadium"] h1,body[data-theme="stadium"] h2,
body[data-theme="stadium"] .logo{font-family:"Arial Black","Segoe UI",sans-serif}
body[data-theme="stadium"] .grid-bg{
  background:
    radial-gradient(ellipse 90% 60% at 50% -10%,#2e6ccc66,transparent 60%),
    repeating-linear-gradient(0deg,transparent 0 42px,#2e6ccc22 42px 43px),
    repeating-linear-gradient(90deg,transparent 0 42px,#2e6ccc22 42px 43px),var(--bg)}
body[data-theme="stadium"] .src.ds{color:#ffd94a}

/* ================= 04 — UNDERGROUND (magenta, angles) ================= */
body[data-theme="ug"]{
  --bg:#120a14; --bg2:#180e1c; --panel:#1c0f20;
  --line:#4a1c3c; --cyan:#ff5d8a; --cyan-d:#c22a58;
  --amber:#ffb347; --red:#ff3d4e; --tx:#f0d8e8; --dim:#8a6a80;
  --rad:0px;
}
body[data-theme="ug"] .navbtn{transform:skewX(-8deg);
  border-color:var(--line)}
body[data-theme="ug"] .navbtn:hover,body[data-theme="ug"] .navbtn.on{
  box-shadow:0 0 14px #ff5d8a44}
body[data-theme="ug"] .btn{transform:skewX(-8deg);
  background:linear-gradient(180deg,#ff5d8a,#c22a58);color:#2e0413;
  box-shadow:0 0 22px #ff5d8a33}
body[data-theme="ug"] .btn.dim{background:#241226;color:var(--dim);box-shadow:none}
body[data-theme="ug"] h2,body[data-theme="ug"] .hero-inner h1{
  font-style:italic}
body[data-theme="ug"] .grid-bg{
  background:
    radial-gradient(ellipse 70% 60% at 20% 0%,#3c0a2e66,transparent 60%),
    radial-gradient(ellipse 50% 50% at 90% 100%,#4a0d0d55,transparent 60%),
    repeating-linear-gradient(115deg,#170b18 0 6px,#120a14 6px 12px),var(--bg)}
body[data-theme="ug"] .btn.big{font-style:italic}

/* ================= 05 — CLEAN SILVER (clair minimal) ================= */
body[data-theme="silver"]{
  --bg:#e8ecf0; --bg2:#f2f5f9; --panel:#ffffff;
  --line:#c8d2dd; --cyan:#0d8fb0; --cyan-d:#0a6f8a;
  --amber:#d98a1d; --red:#d43a4a; --tx:#1c2634; --dim:#5a6b80;
  --font:"Segoe UI",system-ui,sans-serif; --rad:8px;
}
body[data-theme="silver"] .grid-bg{
  background:
    linear-gradient(160deg,#f2f5f9,#dfe5ec),
    repeating-linear-gradient(0deg,transparent 0 34px,#c8d2dd44 34px 35px)}
body[data-theme="silver"] .scan{display:none}
body[data-theme="silver"] .panel{background:#fff;
  box-shadow:0 2px 8px #16222f14}
body[data-theme="silver"] .btn{background:#0d8fb0;color:#fff;
  box-shadow:0 2px 8px #0d8fb033;border-radius:6px}
body[data-theme="silver"] .btn.dim{background:#eef2f6;color:var(--dim);
  border:1px solid var(--line);box-shadow:none}
body[data-theme="silver"] .navbtn{border:none;color:var(--dim);
  border-bottom:2px solid transparent;border-radius:0}
body[data-theme="silver"] .navbtn:hover,body[data-theme="silver"] .navbtn.on{
  color:var(--cyan);border-bottom-color:var(--cyan);box-shadow:none}
body[data-theme="silver"] #topbar{background:#ffffffcc;border-color:#d8dfe8}
body[data-theme="silver"] .card,body[data-theme="silver"] .slot,
body[data-theme="silver"] .ac,body[data-theme="silver"] .stc,
body[data-theme="silver"] .avatars .av{background:#f6f9fc}
body[data-theme="silver"] .card .pimg{background:#eef2f6}
body[data-theme="silver"] .authcard input,
body[data-theme="silver"] #v-settings input,
body[data-theme="silver"] #verify-box input{background:#f6f9fc;border-color:#d8dfe8;
  color:var(--tx)}
body[data-theme="silver"] .fight{background:#fff}
body[data-theme="silver"] .fight:hover:not(.locked){background:#eef4fa}
body[data-theme="silver"] .league{background:#fff}
body[data-theme="silver"] .tab{background:#f6f9fc}
body[data-theme="silver"] #scene-inner{background:#fffffff2;color:#1c2634}
body[data-theme="silver"] #scene-dlg{background:#f6f9fc;color:#1c2634}
body[data-theme="silver"] #sc-who{color:#d98a1d}
body[data-theme="silver"] .logo b,body[data-theme="silver"] h2{color:var(--cyan)}
body[data-theme="silver"] .credits{color:#d98a1d;border-color:#d98a1d44}
body[data-theme="silver"] .hero{border-color:#d8dfe8}
body[data-theme="silver"] .hero-inner{background:linear-gradient(90deg,#f2f5f9ee 30%,transparent)}
body[data-theme="silver"] .hero-inner h1{color:#16222f;text-shadow:none}
body[data-theme="silver"] .hero-inner h1 span{color:#0d8fb0}
body[data-theme="silver"] .src.gc{color:#0d8fb0;border-color:#0d8fb055}
body[data-theme="silver"] .ld-badge{background:#f6f9fc}
body[data-theme="silver"] #scene-head{background:#eef2f6}
body[data-theme="silver"] .chap-banner{background:#f6f9fc}

/* ------- sélecteur de thème (settings) ------- */
#theme-pick{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin:10px 0}
.th{border:2px solid var(--line);cursor:pointer;padding:0;overflow:hidden;
  background:none;text-align:center;transition:.12s;position:relative}
.th:hover{border-color:var(--cyan-d)}
.th.on{border-color:var(--cyan);box-shadow:0 0 10px #37e2ff33}
.th .swprev{height:44px;display:flex}
.th .swprev i{flex:1}
.th b{display:block;font-size:10px;letter-spacing:1px;padding:5px 2px;
  color:var(--tx);background:#0a1424}
body[data-theme="silver"] .th b{background:#eef2f6;color:#1c2634}

/* ------- vérification / settings ------- */
.small{font-size:12px}
.ok{color:#7fe8a0;font-weight:700}
.warn{color:var(--amber);font-weight:700}
#verify-box{border-top:1px dashed var(--line);padding-top:10px;
  display:flex;flex-direction:column;gap:8px}
#v-settings input,#verify-box input{background:#070d18;border:1px solid var(--line);
  color:var(--tx);padding:10px 12px;font:inherit;font-size:15px;letter-spacing:2px;
  width:100%;margin-bottom:8px;outline:none}
#v-settings input:focus{border-color:var(--cyan)}
#v-settings .panel{display:flex;flex-direction:column;gap:8px}
#set-email-status{padding:8px 0;font-size:14px}
#s-verify{border:1px dashed var(--amber);padding:10px;margin-top:6px}

/* ------- sélecteur d'arène ------- */
#arena-pick{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;
  margin:14px 0}
.ac{border:1px solid var(--line);background:#0a1424;cursor:pointer;
  padding:5px;text-align:center;transition:.12s}
.ac:hover{border-color:var(--cyan-d)}
.ac.on{border-color:var(--cyan);box-shadow:0 0 12px #37e2ff44}
.ac-img{width:100%;aspect-ratio:1;object-fit:cover;display:block;
  image-rendering:auto}
.ac-img.rand{display:flex;align-items:center;justify-content:center;
  font-size:34px;font-weight:800;color:var(--dim);background:#070d18}
.ac b{display:block;font-size:9px;letter-spacing:1px;margin-top:3px;
  color:var(--tx);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* ------- league chapitres ------- */
.chap-banner{display:flex;gap:16px;align-items:center;margin-bottom:16px;
  border:1px solid var(--line);padding:12px 18px;
  background:linear-gradient(90deg,#0d1f38,#0a1424);
  clip-path:polygon(0 0,calc(100% - 14px) 0,100% 14px,100% 100%,0 100%)}
.chap-banner img{width:56px;height:56px;object-fit:contain;flex:none;
  border:1px solid var(--cyan);background:#070d18;
  clip-path:polygon(8px 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%,0 8px)}
.chap-banner b{color:var(--cyan);letter-spacing:2px;font-size:16px}
.chap-banner p{font-size:12px;margin-top:2px;font-style:italic}
.league-h{align-items:center}
.chap-art{width:38px;height:38px;object-fit:contain;flex:none;
  border:1px solid var(--line);background:#070d18;
  clip-path:polygon(6px 0,100% 0,100% calc(100% - 6px),calc(100% - 6px) 100%,0 100%,0 6px)}
.league-t{flex:1;display:flex;align-items:baseline;gap:14px;min-width:0}
.league-t .dim{flex:none;font-size:11px;white-space:nowrap;overflow:hidden;
  text-overflow:ellipsis}
.fe-av{width:44px;height:44px;object-fit:contain;flex:none;
  background:radial-gradient(circle,#12335c44,transparent 70%);
  border:1px solid #12203a;
  clip-path:polygon(6px 0,100% 0,100% calc(100% - 6px),calc(100% - 6px) 100%,0 100%,0 6px)}
.ld-badge{display:inline-block;background:#0a1424;border:1px solid var(--line);
  color:var(--dim);font-size:10px;letter-spacing:1px;padding:2px 7px;margin:2px 2px 0 0;
  white-space:nowrap}

/* ------- scène ADV (visual novel) ------- */
#scene{position:fixed;inset:0;z-index:100;display:flex;
  align-items:center;justify-content:center;
  animation:scfade .25s ease}
@keyframes scfade{from{opacity:0}}
#scene-bg{position:absolute;inset:0;backdrop-filter:blur(3px)}
#scene-bg::before{content:"";position:absolute;inset:0;
  background:rgba(4,6,11,.86)}
#scene-bg::after{content:"";position:absolute;inset:0;
  background:
    repeating-linear-gradient(0deg,transparent 0 3px,#00000018 3px 4px),
    radial-gradient(ellipse 70% 60% at 50% 100%,#37e2ff12,transparent 60%)}
#scene-inner{position:relative;width:min(860px,94vw);height:min(560px,88vh);
  display:flex;flex-direction:column;border:1px solid var(--line);
  background:#080d16ee;box-shadow:0 0 60px #000,inset 0 0 80px #0a1c30;
  clip-path:polygon(0 0,calc(100% - 26px) 0,100% 26px,100% 100%,26px 100%,0 calc(100% - 26px))}
#scene-head{display:flex;align-items:center;gap:14px;padding:14px 18px;
  border-bottom:1px solid var(--line);background:#0c1626}
#sc-e-avatar{width:56px;height:56px;object-fit:contain;
  border:1px solid var(--cyan);background:#070d18;
  clip-path:polygon(8px 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%,0 8px);
  animation:portrait-in .4s ease}
@keyframes portrait-in{from{transform:translateX(-30px);opacity:0}}
#sc-e-name{font-weight:800;font-size:19px;letter-spacing:2px;color:var(--cyan)}
#sc-e-tag{font-size:11px;letter-spacing:1px}
#sc-e-load{margin-top:3px}
#sc-skip{margin-left:auto}
#scene-stage{flex:1;position:relative;display:flex;
  align-items:flex-end;justify-content:center;overflow:hidden}
#sc-avatar-big{height:92%;object-fit:contain;filter:drop-shadow(0 0 30px #37e2ff22);
  animation:stage-in .45s ease}
@keyframes stage-in{from{transform:translateY(40px) scale(.94);opacity:0}}
#sc-fight-box{position:absolute;inset:0;display:flex;
  align-items:center;justify-content:center;background:#070b1266}
#sc-fight{min-width:280px;font-size:22px;
  animation:fightpulse 1.4s ease infinite}
@keyframes fightpulse{50%{box-shadow:0 0 34px #ffb34766;filter:brightness(1.15)}}
#scene-dlg{border-top:1px solid var(--line);background:#0a1424f2;
  padding:16px 22px 12px;min-height:110px;cursor:pointer;position:relative}
#scene-dlg:hover{background:#0d1a30f2}
#sc-who{color:var(--amber);font-weight:800;letter-spacing:2px;font-size:13px;
  margin-bottom:6px}
#sc-txt{font-size:17px;line-height:1.5;min-height:50px;white-space:pre-wrap}
#sc-next{position:absolute;right:18px;bottom:10px;color:var(--cyan);
  animation:nextbob 1s ease infinite}
@keyframes nextbob{50%{transform:translateY(4px)}}