:root {
  --dropdown-bg: #2A2A2A;
  --dropdown-text: #a3a3a3;
  --dropdown-divider: rgba(255,255,255,.1);
  --dropdown-hover-bg: rgba(255,255,255,.1);
  --dropdown-hover-text: #ffffff;
  --dropdown-active-bg: rgba(224, 140, 41, .15);
  --dropdown-active-text: #BFAB7A;
  --dropdown-icon: #BFAB7A;
  --bg: #0d1022;
  --panel: rgba(16, 22, 45, 0.88);
  --panel-2: rgba(28, 38, 76, 0.92);
  --text: #f4f7ff;
  --muted: #a9b2d4;
  --accent: #f5b84b;
  --accent-2: #7bf0ff;
  --danger: #ff5f73;
  --success: #69f0a1;
  --shadow: 0 20px 70px rgba(0,0,0,.42);
}

* { box-sizing: border-box; }

body {
  margin: 0;
  min-height: 100vh;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--text);
  background:
    radial-gradient(circle at 10% 20%, rgba(127, 82, 255, .30), transparent 30%),
    radial-gradient(circle at 85% 10%, rgba(255, 92, 122, .25), transparent 32%),
    radial-gradient(circle at 60% 90%, rgba(44, 218, 255, .20), transparent 35%),
    linear-gradient(135deg, #080a18, #151b36 52%, #0a1020);
}

button, input { font: inherit; }
button {
  border: 0;
  color: #091020;
  background: linear-gradient(135deg, #ffd36d, #ff9a44);
  border-radius: 14px;
  padding: 12px 15px;
  font-weight: 800;
  cursor: pointer;
  box-shadow: 0 10px 20px rgba(0,0,0,.25);
  transition: transform .1s ease, filter .1s ease;
}
button:hover { transform: translateY(-1px); filter: brightness(1.08); }
button:active { transform: translateY(1px); }
button.secondary {
  color: var(--text);
  background: rgba(255,255,255,.12);
  border: 1px solid rgba(255,255,255,.16);
}
button.danger { background: linear-gradient(135deg, #ff8a8a, #ff4b65); }
button:disabled { opacity: .5; cursor: not-allowed; transform: none; }

input {
  width: 100%;
  border: 1px solid rgba(255,255,255,.15);
  background: rgba(255,255,255,.09);
  color: var(--text);
  padding: 13px 15px;
  border-radius: 14px;
  outline: none;
}

#app { min-height: 100vh; }

.screen {
  width: min(1180px, calc(100% - 28px));
  margin: 0 auto;
  padding: 28px 0;
}
.screen.map-screen {
  width: min(1680px, calc(100% - 14px));
  padding: 10px 0 18px;
}
.map-topbar {
  margin-bottom: 10px;
}
.screen.map-screen {
  width: min(1600px, calc(100% - 18px));
}

.hero {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 30px;
  padding: 38px;
  min-height: 560px;
  background:
    linear-gradient(135deg, rgba(13, 16, 34, .88), rgba(32, 43, 83, .80)),
    radial-gradient(circle at 70% 30%, rgba(255, 184, 75, .22), transparent 25%);
  box-shadow: var(--shadow);
}

.hero:before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px),
    linear-gradient(0deg, rgba(255,255,255,.035) 1px, transparent 1px);
  background-size: 44px 44px;
  mask-image: linear-gradient(180deg, black, transparent 75%);
}

.hero-content { position: relative; z-index: 1; max-width: 690px; }
.eyebrow { color: var(--accent-2); text-transform: uppercase; letter-spacing: .2em; font-size: 12px; font-weight: 900; }
h1 { margin: 10px 0 10px; font-size: clamp(42px, 7vw, 82px); line-height: .92; }
h2 { margin: 0 0 12px; font-size: clamp(25px, 4vw, 38px); }
h3 { margin: 0 0 10px; }
p { color: var(--muted); line-height: 1.55; }

.logo-word { color: var(--accent); text-shadow: 0 0 25px rgba(245,184,75,.45); }
.hero-art {
  position: absolute;
  right: 25px;
  bottom: 20px;
  width: min(420px, 42vw);
  aspect-ratio: 1;
  border-radius: 38% 62% 49% 51% / 44% 41% 59% 56%;
  background:
    radial-gradient(circle at 50% 38%, #ffdd87, transparent 12%),
    radial-gradient(circle at 49% 51%, #151b36 0 25%, transparent 26%),
    radial-gradient(circle at 50% 56%, #ff4b65 0 4%, transparent 4.3%),
    radial-gradient(circle at 51% 62%, #11152c 0 18%, transparent 18.5%),
    radial-gradient(circle at 62% 41%, #7bf0ff 0 4%, transparent 4.4%),
    radial-gradient(circle at 38% 41%, #7bf0ff 0 4%, transparent 4.4%),
    linear-gradient(135deg, rgba(255,255,255,.10), rgba(255,255,255,.02));
  filter: drop-shadow(0 35px 60px rgba(0,0,0,.45));
}
.hero-art:after {
  content: "⚔";
  position: absolute;
  font-size: clamp(90px, 12vw, 155px);
  right: 2%;
  bottom: 8%;
  opacity: .82;
  transform: rotate(-20deg);
  text-shadow: 0 0 40px rgba(123,240,255,.45);
}
.actions { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 22px; }

.grid { display: grid; gap: 18px; }
.grid.two { grid-template-columns: 1.1fr .9fr; }
.grid.three { grid-template-columns: repeat(3, 1fr); }
@media (max-width: 850px) { .grid.two, .grid.three { grid-template-columns: 1fr; } .hero-art { opacity: .22; } }

.card {
  background: var(--panel);
  border: 1px solid rgba(255,255,255,.13);
  border-radius: 24px;
  padding: 20px;
  box-shadow: var(--shadow);
}
.card.bright { background: linear-gradient(135deg, rgba(32,43,83,.96), rgba(16,22,45,.86)); }
.statline, .resource-row {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  padding: 8px 0;
  border-bottom: 1px solid rgba(255,255,255,.08);
}
.statline:last-child, .resource-row:last-child { border-bottom: 0; }
.small { font-size: 13px; color: var(--muted); }

.choice {
  min-height: 210px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  background:
    radial-gradient(circle at 85% 18%, rgba(255,255,255,.12), transparent 28%),
    rgba(255,255,255,.075);
  border: 1px solid rgba(255,255,255,.15);
  border-radius: 22px;
  padding: 18px;
}
.choice .symbol { font-size: 44px; }
.choice ul { padding-left: 18px; color: var(--muted); }

.topbar {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: center;
  margin-bottom: 18px;
}
.badges { display: flex; flex-wrap: wrap; gap: 8px; }
.badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 10px;
  background: rgba(255,255,255,.10);
  border: 1px solid rgba(255,255,255,.13);
  border-radius: 999px;
  color: var(--text);
  font-weight: 750;
  font-size: 13px;
}

.village {
  min-height: 410px;
  position: relative;
  overflow: hidden;
  background:
    linear-gradient(180deg, rgba(111, 84, 255, .17), rgba(10, 16, 32, .22)),
    radial-gradient(circle at 50% 100%, rgba(68, 230, 169, .25), transparent 40%);
}
.village-map {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
}
.location {
  min-height: 130px;
  border-radius: 20px;
  padding: 16px;
  background: rgba(255,255,255,.10);
  border: 1px solid rgba(255,255,255,.14);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.location .icon { font-size: 35px; }
.location strong { font-size: 18px; }
@media (max-width: 700px) { .village-map { grid-template-columns: 1fr; } }

/* Village dashboard: compact Shinobi-like placement with a smaller radio panel. */
body:has(.village-screen) {
  background: var(--bg-page);
  color: #282a29;
}
.village-screen { width:min(1260px,calc(100% - 24px)) !important; padding:12px 0 28px !important; }
.village-shell { display:grid; grid-template-columns:220px minmax(0,1fr); gap:12px; align-items:start; }
.village-profile-rail { display:grid; gap:10px; }
.village-profile-card, .village-purse-card, .village-topline, .village-radio, .village-screen .map-detail { color:var(--text-primary); background:var(--bg-panel); border:1px solid var(--border-primary); border-radius:8px; box-shadow:0 5px 14px rgba(76,54,25,.12); }
.village-profile-card { padding:12px; }
.village-profile-name h2 { margin:2px 0 0; font-size:21px; color:#252522; }
.village-profile-name p { margin:2px 0 8px; color:var(--text-secondary); font-size:12px; }
.village-profile-card .eyebrow, .village-topline .eyebrow, .village-purse-card .eyebrow, .village-radio .eyebrow { color:var(--text-secondary); letter-spacing:.12em; }
.village-profile-portrait { display:grid; place-items:center; margin:5px 0 10px; padding:4px; background:#d5d7cf; border-radius:7px; }
button.village-profile-portrait-btn {
  display:grid !important;
  place-items:center !important;
  width:100% !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  filter:none !important;
  transform:none !important;
  color:inherit !important;
  cursor:pointer !important;
  border-radius:4px !important;
}
button.village-profile-portrait-btn:hover,
button.village-profile-portrait-btn:active,
button.village-profile-portrait-btn:focus-visible {
  transform:none !important;
  filter:none !important;
  box-shadow:none !important;
  background:transparent !important;
  outline:2px solid #8f671f;
  outline-offset:1px;
}
.village-profile-portrait .ninja-portrait { width:164px; border:0; border-radius:4px; background:#d5d7cf; box-shadow:none; pointer-events:none; }
.village-profile-portrait .ninja-svg { border-radius:4px; }
.profile-build { display:grid; gap:4px; padding:7px 0; border-top:1px solid var(--border-soft); border-bottom:1px solid var(--border-soft); color:var(--text-secondary); font-size:11px; }
.village-profile-card .bars { gap:12px; margin:16px 0; }
.village-profile-card .bars .small { color:#706650; font-size:11px; }
.village-profile-card .bar { height:9px; background:#e2d6b8; border:0; }
.village-profile-card .bar.health span { background:#4fbe62; }
.village-profile-card .bar.energy span { background:#58b4f2; }
.village-profile-card .bar.xp span { background:#e77839; }
.resource-meter-label { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:4px; font-variant-numeric:tabular-nums; }
.resource-meter-label i, .profile-art-label i, .purse-row i { display:inline-block; width:15px; font-style:normal; text-align:center; }
.resource-meter-label b { font-weight:500; }
.village-profile-card .resource-meter-label > span { text-transform:uppercase; }
.village-profile-card .resource-meter-label i, .profile-art-label i { color:#8294a0; }
.profile-divider { height:1px; background:var(--border-soft); margin:8px 0; }
.village-profile-card h3 { font-size:11px; text-transform:uppercase; letter-spacing:.06em; margin:14px 0 12px; color:#706650; }
.profile-arts { display:grid; gap:12px; }
.profile-art-label { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:4px; color:#706650; font-size:11px; font-variant-numeric:tabular-nums; }
.profile-art-label > span { text-transform:uppercase; }
.profile-art-label b { color:#4b342d; font-weight:500; }
.profile-art-track { height:9px; overflow:hidden; border-radius:99px; background:#edaaa9; }
.profile-art-track > span { display:block; height:100%; border-radius:inherit; background:#df2347; }
.profile-secondary-stats { display:flex; justify-content:space-between; gap:10px; border-top:1px solid var(--border-soft); margin-top:15px; padding-top:10px; color:#746750; font-size:11px; }
.profile-secondary-stats b { margin-left:4px; color:#332c21; font-weight:600; }
.village-purse-card { display:grid; gap:12px; padding:12px; font-size:13px; }
.village-purse-card strong { font-size:14px; color:var(--text-primary); }
.village-purse-card span { color:#5e6f76; font-size:12px; }
.purse-row { display:flex; justify-content:space-between; align-items:center; gap:8px; font-variant-numeric:tabular-nums; }
.purse-row .ryo-icon { color:#d0a220; }
.purse-row .spark-icon { color:#279fe6; font-size:16px; }
.village-center-column { min-width:0; }
.village-topline { display:flex; justify-content:space-between; align-items:center; gap:14px; padding:10px 14px; margin-bottom:10px; }
.village-topline h1 { margin:2px 0 0; font-size:25px; line-height:1; color:var(--text-primary); }
.village-topline p { margin:4px 0 0; color:#6e624e; font-size:12px; }
.village-topline .badges { justify-content:flex-end; }
.village-topline .badge, .village-screen .badge { color:var(--text-secondary); background:var(--bg-panel-alt); border-color:var(--border-soft); }
.village-screen .map-layout { grid-template-columns:minmax(0,1fr) 250px; grid-template-rows:auto auto; gap:10px; }
.village-screen .map-card { grid-column:1; grid-row:1; background:#31443a; border:1px solid #aa956c; border-radius:8px; }
.village-screen .world-map-stage { aspect-ratio:2.2 / 1; min-height:360px; max-height:480px; border-radius:7px; border-color:#948363; }
.village-screen .map-head-overlay { left:10px; top:10px; padding:8px 10px; max-width:390px; border-radius:7px; background:rgba(22,31,27,.82); }
.village-screen .map-head-overlay p { font-size:11px; }
.village-screen .map-head-overlay h3, .village-screen .map-action-title strong { color:var(--bg-panel); }
.village-screen .map-detail { grid-column:2; grid-row:1 / span 2; padding:14px; }
.village-screen .map-detail h2 { font-size:18px; color:var(--text-primary); }
.village-screen .map-detail p, .village-screen .map-detail .small { color:var(--text-secondary); }
.village-screen .village-radio { grid-column:1; grid-row:2; padding:10px 12px; min-height:220px; }
.radio-head { display:flex; justify-content:space-between; align-items:center; gap:8px; border-bottom:1px solid #ddcfad; padding-bottom:7px; }
.radio-tabs { display:flex; gap:4px; flex-wrap:wrap; }
.radio-tabs button { font-size:11px; padding:2px 6px; }
.radio-tabs button.active { font-weight:700; }
.radio-friends { max-height:70px; overflow:auto; font-size:11px; margin-top:6px; }
.radio-head h3 { margin:0; font-size:16px; color:#342e24; }
.radio-feed { height:146px; overflow:auto; padding:5px 2px; background:var(--bg-panel); border-bottom:1px solid #e0d2b2; }
.radio-feed p { margin:0; padding:3px 0; color:#5f5647; font-size:11px; line-height:1.35; }
.radio-feed time { color:#a58a63; margin-right:4px; }
.radio-feed strong { color:#315b72; margin-right:4px; }
.radio-feed span { color:#4d4b46; }
.radio-compose { display:grid; grid-template-columns:1fr 38px; gap:7px; margin-top:8px; }
.radio-compose input { min-width:0; padding:8px 10px; border-radius:5px; border:1px solid #c8b88f; background:#fffdf4; color:#3b3529; }
.radio-compose button { padding:6px; border-radius:50%; background:#eeb45f; box-shadow:none; }
.village-screen .quick-dock { margin-top:10px; padding:8px; gap:6px; border-radius:7px; background:var(--bg-input); border:1px solid var(--border-primary); }
.village-screen .quick-dock button { padding:8px 10px; border-radius:5px; color:var(--button-primary-text); background:var(--button-secondary-bg); border:1px solid var(--button-secondary-border); box-shadow:none; font-size:12px; }
.village-screen .quick-dock button.danger { background:#d96f50; color:#fff; border-color:#bb5c40; }
@media(max-width:900px){.village-shell{grid-template-columns:180px minmax(0,1fr)}.village-screen .map-layout{grid-template-columns:minmax(0,1fr) 210px}.village-screen .world-map-stage{min-height:300px}.village-profile-portrait .ninja-portrait{width:145px}}
@media (max-width: 700px) {
  body:has(.village-screen) { background: var(--bg-page); }
  .village-shell { grid-template-columns: 1fr; }
  .village-profile-rail { grid-template-columns: 1fr 1fr; }
  .village-profile-card { grid-row: span 2; }
  .village-topline { display: block; }
  .village-topline .badges { justify-content: flex-start; margin-top: 7px; }
  .village-screen .map-layout { grid-template-columns: 1fr; }
  .village-screen .map-detail,
  .village-screen .map-card,
  .village-screen .village-radio { grid-column: 1; grid-row: auto; }
  .village-screen { width: calc(100% - 12px) !important; padding: 8px 0 16px !important; }
  .village-screen .world-map-stage {
    min-height: min(52vh, 420px);
    max-height: 58vh;
    aspect-ratio: 2 / 1;
  }
  .village-profile-portrait .ninja-portrait { width: 150px; }
}

.bars { display: grid; gap: 8px; margin: 12px 0; }
.bar {
  height: 12px;
  border-radius: 99px;
  background: rgba(255,255,255,.12);
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.12);
}
.bar span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #69f0a1, #39d98a); }
.bar.energy span { background: linear-gradient(90deg, #7bf0ff, #5595ff); }
.bar.xp span { background: linear-gradient(90deg, #ffd36d, #ff9a44); }
.bar.enemy span { background: linear-gradient(90deg, #ff8a8a, #ff4b65); }

.dungeon-path {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 12px;
  margin: 18px 0;
}
.room {
  min-height: 95px;
  border-radius: 20px;
  padding: 13px;
  text-align: center;
  background: rgba(255,255,255,.10);
  border: 1px solid rgba(255,255,255,.13);
}
.room.active { outline: 3px solid rgba(245,184,75,.75); background: rgba(245,184,75,.16); }
.room.done { opacity: .55; }
.room .big { font-size: 32px; display: block; }
@media (max-width: 760px) { .dungeon-path { grid-template-columns: 1fr; } }

.battlefield {
  position: relative;
  overflow: hidden;
  min-height: 600px;
  border-radius: 28px;
  border: 1px solid rgba(255,255,255,.14);
  background:
    radial-gradient(circle at 15% 40%, rgba(123,240,255,.25), transparent 25%),
    radial-gradient(circle at 78% 38%, rgba(255,95,115,.25), transparent 28%),
    linear-gradient(180deg, rgba(25,42,85,.88), rgba(9,13,28,.94));
  box-shadow: var(--shadow);
}
.battlefield:before {
  content: "";
  position: absolute;
  left: -10%; right: -10%; bottom: -80px;
  height: 250px;
  background: radial-gradient(ellipse at center, rgba(117, 255, 192, .24), transparent 60%);
}
.combatants {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 22px;
  padding: 22px;
}
.combatant {
  min-height: 280px;
  border-radius: 24px;
  padding: 18px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.14);
}
.avatar {
  width: min(190px, 50vw);
  height: 190px;
  margin: 14px auto 10px;
  border-radius: 42% 58% 52% 48% / 44% 44% 56% 56%;
  display: grid;
  place-items: center;
  font-size: 86px;
  background: radial-gradient(circle, rgba(255,255,255,.20), rgba(255,255,255,.05));
  border: 1px solid rgba(255,255,255,.14);
  filter: drop-shadow(0 25px 30px rgba(0,0,0,.35));
}
.enemy-avatar { background: radial-gradient(circle, rgba(255,95,115,.23), rgba(255,255,255,.05)); }
.turn-label { color: var(--accent); font-weight: 900; text-transform: uppercase; letter-spacing: .12em; font-size: 12px; }
.battle-ui {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: 1.05fr .95fr;
  gap: 18px;
  padding: 0 22px 22px;
}
.skill-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
.skill {
  color: var(--text);
  background: rgba(255,255,255,.11);
  border: 1px solid rgba(255,255,255,.15);
  text-align: left;
  min-height: 76px;
}
.skill strong { display: block; color: white; }
.skill span { color: var(--muted); font-size: 12px; display: block; margin-top: 4px; }
.log {
  max-height: 230px;
  overflow: auto;
  padding-right: 6px;
}
.log p {
  margin: 0 0 8px;
  padding: 8px 10px;
  border-radius: 12px;
  background: rgba(255,255,255,.075);
  color: #dbe3ff;
  font-size: 13px;
}
@media (max-width: 900px) { .combatants, .battle-ui { grid-template-columns: 1fr; } }

.shop-item {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 12px;
  align-items: center;
  padding: 12px 0;
  border-bottom: 1px solid rgba(255,255,255,.08);
}
.shop-item:last-child { border-bottom: 0; }

.footer-note { margin-top: 15px; color: var(--muted); font-size: 13px; }
.hidden { display: none !important; }

.message-card { margin-bottom: 18px; }
.active-combatant {
  outline: 3px solid rgba(245,184,75,.75);
  background: rgba(245,184,75,.12);
}
.battle-banner {
  position: relative;
  z-index: 3;
  margin: 18px auto 0;
  width: fit-content;
  max-width: calc(100% - 36px);
  padding: 12px 18px;
  border-radius: 999px;
  font-weight: 950;
  letter-spacing: .04em;
  text-transform: uppercase;
  background: rgba(0,0,0,.42);
  border: 1px solid rgba(255,255,255,.2);
  color: #fff;
  box-shadow: 0 15px 35px rgba(0,0,0,.35);
}
.mini-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 12px;
}
.mini-stats span {
  font-size: 12px;
  color: var(--muted);
  padding: 6px 8px;
  border-radius: 999px;
  background: rgba(255,255,255,.08);
}
.skill.taijutsu { border-color: rgba(255, 211, 109, .38); }
.skill.ninjutsu { border-color: rgba(123, 240, 255, .38); }
.skill.genjutsu { border-color: rgba(195, 135, 255, .42); }
.result-screen {
  min-height: 620px;
  display: grid;
  align-content: center;
  justify-items: center;
  text-align: center;
  padding: 44px;
  border-radius: 30px;
  border: 1px solid rgba(255,255,255,.14);
  box-shadow: var(--shadow);
  background:
    radial-gradient(circle at 50% 25%, rgba(255,255,255,.13), transparent 25%),
    linear-gradient(135deg, rgba(16,22,45,.96), rgba(28,38,76,.88));
}
.result-screen.victory {
  background:
    radial-gradient(circle at 50% 25%, rgba(105,240,161,.25), transparent 28%),
    linear-gradient(135deg, rgba(16,22,45,.96), rgba(28,76,55,.86));
}
.result-screen.defeat {
  background:
    radial-gradient(circle at 50% 25%, rgba(255,95,115,.25), transparent 28%),
    linear-gradient(135deg, rgba(16,22,45,.96), rgba(76,28,43,.86));
}
.result-icon { font-size: 84px; filter: drop-shadow(0 18px 30px rgba(0,0,0,.35)); }
.result-details {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
  margin: 18px 0 8px;
}

/* v3 tactical combat additions */
.intent-panel {
  position: relative;
  z-index: 4;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 14px;
  align-items: center;
  margin: 18px 22px 0;
  padding: 16px 18px;
  border-radius: 22px;
  background: linear-gradient(135deg, rgba(0,0,0,.48), rgba(255,255,255,.08));
  border: 1px solid rgba(255,255,255,.18);
  box-shadow: 0 18px 40px rgba(0,0,0,.32);
}
.intent-icon {
  width: 68px;
  height: 68px;
  display: grid;
  place-items: center;
  border-radius: 20px;
  background: rgba(255,255,255,.13);
  font-size: 34px;
  border: 1px solid rgba(255,255,255,.16);
}
.intent-panel h3 { margin-bottom: 4px; }
.intent-panel p { margin: 0; }
.danger-level {
  display: inline-block;
  margin-left: 8px;
  padding: 4px 8px;
  border-radius: 999px;
  background: rgba(255,95,115,.20);
  color: #fff;
  font-size: 12px;
  vertical-align: middle;
  border: 1px solid rgba(255,95,115,.38);
}
.skill.stratégie { border-color: rgba(255,255,255,.34); }
.skill.recommended {
  outline: 3px solid rgba(105, 240, 161, .85);
  background: rgba(105, 240, 161, .16);
}
.skill.cooling {
  filter: grayscale(.25);
}
.status-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 10px;
}
.status-badges span {
  display: inline-flex;
  align-items: center;
  padding: 6px 8px;
  border-radius: 999px;
  background: rgba(255,255,255,.10);
  border: 1px solid rgba(255,255,255,.13);
  color: #dbe3ff;
  font-size: 12px;
  font-weight: 750;
}


/* v4 inventory/shop/academy additions */
.shop-header {
  display: grid;
  gap: 14px;
  margin-bottom: 16px;
}
.tabbar {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.active-tab {
  outline: 3px solid rgba(245,184,75,.75);
  background: rgba(245,184,75,.16) !important;
}
.shop-grid, .tech-grid, .equip-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}
.bag-grid { display: grid; gap: 10px; }
.item-card, .tech-card, .inventory-row {
  border-radius: 20px;
  padding: 15px;
  background: rgba(255,255,255,.085);
  border: 1px solid rgba(255,255,255,.13);
}
.item-card.equipped, .tech-card.learned {
  background: rgba(105, 240, 161, .11);
  border-color: rgba(105, 240, 161, .32);
}
.tech-card.locked { opacity: .68; }
.item-top {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 12px;
  align-items: center;
}
.item-icon {
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  border-radius: 15px;
  background: rgba(255,255,255,.11);
  border: 1px solid rgba(255,255,255,.15);
  font-size: 25px;
}
.stat-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 10px 0;
}
.stat-chip {
  display: inline-flex;
  align-items: center;
  padding: 6px 8px;
  border-radius: 999px;
  background: rgba(255,255,255,.10);
  border: 1px solid rgba(255,255,255,.13);
  color: #dbe3ff;
  font-size: 12px;
  font-weight: 800;
}
.stat-chip.plus { border-color: rgba(105,240,161,.28); }
.stat-chip.minus { border-color: rgba(255,95,115,.35); color: #ffd8df; }
.inventory-row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 10px;
  align-items: center;
}
.skill.sac { border-color: rgba(255,255,255,.34); }
@media (max-width: 850px) {
  .shop-grid, .tech-grid, .equip-grid { grid-template-columns: 1fr; }
  .inventory-row { grid-template-columns: 1fr; }
}


/* v5 additions */
.academy-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 18px 0;
}
.tech-section-head {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  align-items: flex-start;
  margin: 18px 0 12px;
  padding: 15px;
  border-radius: 18px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.12);
}
.tech-section-head h3 { margin-bottom: 4px; }
.tech-section-head p { margin: 0; }
.tech-section-head.base { margin-top: 26px; }
.small-grid { grid-template-columns: repeat(2, 1fr); }
.mission-bank {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  margin: 16px 0;
  padding: 14px 16px;
  border-radius: 18px;
  background: rgba(123, 240, 255, .10);
  border: 1px solid rgba(123, 240, 255, .24);
}
.mission-bank span { color: var(--accent-2); font-weight: 800; }
@media (max-width: 760px) {
  .small-grid { grid-template-columns: 1fr; }
  .mission-bank, .tech-section-head { flex-direction: column; }
}

/* v7 missions + training loop */
.starter-panel {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 12px;
  align-items: center;
  margin: 14px 0 18px;
  padding: 15px;
  border-radius: 20px;
  background: rgba(105, 240, 161, .10);
  border: 1px solid rgba(105, 240, 161, .24);
}
.starter-panel p { margin: 4px 0 0; }
.mission-grid, .training-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin-top: 16px;
}
.mission-card, .training-card {
  border-radius: 22px;
  padding: 16px;
  background: rgba(255,255,255,.085);
  border: 1px solid rgba(255,255,255,.13);
  box-shadow: 0 12px 30px rgba(0,0,0,.18);
}
.mission-card.hard {
  border-color: rgba(255,95,115,.32);
  background: rgba(255,95,115,.075);
}
.mission-card {
  position: relative;
  overflow: hidden;
  background: linear-gradient(145deg, rgba(46,53,58,.97), rgba(27,32,36,.98));
  border-color: rgba(217,173,104,.22);
}
.mission-card::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 3px;
  background: linear-gradient(90deg, var(--accent-2), rgba(217,173,104,0));
  opacity: .88;
}
.mission-card.hard::before {
  background: linear-gradient(90deg, var(--danger), rgba(201,77,82,0));
}
.mission-card .mission-head {
  padding-bottom: 12px;
  border-bottom: 1px solid rgba(217,173,104,.15);
}
.mission-card .mission-head .item-icon {
  box-shadow: 0 0 0 3px rgba(217,173,104,.08), 0 10px 20px rgba(0,0,0,.24);
}
.mission-card .badges { margin-top: 12px; }
.mission-card .map-preview-path {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
  gap: 7px;
  margin-top: 14px;
}
.mission-card .map-preview-path span {
  position: relative;
  min-height: 54px;
  grid-template-columns: 24px 1fr;
  padding: 8px 9px;
  background: rgba(10,13,15,.28);
  border-color: rgba(217,173,104,.15);
  font-size: 11.5px;
}
.mission-card .map-preview-path span:not(:last-child)::after {
  content: "›";
  position: absolute;
  right: -8px;
  top: 50%;
  transform: translateY(-50%);
  z-index: 2;
  width: 16px;
  height: 16px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: #30383d;
  border: 1px solid rgba(217,173,104,.30);
  color: var(--accent-2);
  font-size: 16px;
  line-height: 1;
}
.mission-card .actions {
  margin-top: 15px;
  padding-top: 14px;
  border-top: 1px solid rgba(217,173,104,.14);
}
.mission-card .actions button { flex: 1 1 140px; }
.mission-head {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 12px;
  align-items: center;
  margin-bottom: 8px;
}
.dungeon-path.mini {
  grid-template-columns: repeat(auto-fit, minmax(86px, 1fr));
  margin: 12px 0;
}
.dungeon-path.mini .room {
  min-height: 70px;
  padding: 10px;
  font-size: 12px;
}
.dungeon-path.mini .big { font-size: 22px; }
.training-card strong, .mission-card strong { color: #fff; }
@media (max-width: 850px) {
  .mission-grid, .training-grid { grid-template-columns: 1fr; }
  .starter-panel { grid-template-columns: 1fr; }
}

/* v8 sound + combat feedback */
.inline-actions {
  margin-top: 0;
  align-items: center;
  justify-content: flex-end;
}
.sound-toggle {
  min-width: 112px;
}
.combatant {
  position: relative;
  overflow: hidden;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.combatant.fx-target.fx-hit,
.combatant.fx-target.fx-dominance,
.combatant.fx-target.fx-crit {
  animation: impactShake .32s ease;
}
.combatant.fx-target.fx-block {
  animation: blockPulse .42s ease;
}
.combatant.fx-target.fx-dodge,
.combatant.fx-target.fx-miss {
  animation: dodgeSlide .42s ease;
}
.combatant.fx-target.fx-heal,
.combatant.fx-target.fx-focus {
  animation: healPulse .62s ease;
}
.combatant.fx-target.fx-genjutsu,
.combatant.fx-target.fx-stun {
  animation: mindWarp .62s ease;
}
.combat-fx {
  position: absolute;
  z-index: 5;
  left: 50%;
  top: 142px;
  transform: translateX(-50%);
  padding: 8px 14px;
  border-radius: 999px;
  font-weight: 950;
  letter-spacing: .06em;
  font-size: 20px;
  color: white;
  background: rgba(0,0,0,.58);
  border: 1px solid rgba(255,255,255,.22);
  box-shadow: 0 14px 35px rgba(0,0,0,.42);
  pointer-events: none;
  animation: floatNumber .72s ease forwards;
}
.combat-fx.crit,
.combat-fx.dominance {
  background: linear-gradient(135deg, rgba(255,75,101,.96), rgba(255,154,68,.88));
  text-shadow: 0 0 12px rgba(255,255,255,.35);
}
.combat-fx.block { background: rgba(91, 139, 255, .82); }
.combat-fx.dodge,
.combat-fx.miss { background: rgba(123, 240, 255, .70); color: #06101c; }
.combat-fx.heal,
.combat-fx.focus { background: rgba(105, 240, 161, .78); color: #061b12; }
.combat-fx.genjutsu,
.combat-fx.stun { background: rgba(191, 120, 255, .82); }
.battlefield.fx-hit::after,
.battlefield.fx-crit::after,
.battlefield.fx-dominance::after,
.battlefield.fx-genjutsu::after,
.battlefield.fx-heal::after,
.battlefield.fx-block::after {
  content: "";
  position: absolute;
  z-index: 1;
  inset: 0;
  pointer-events: none;
  animation: screenFlash .42s ease forwards;
}
.battlefield.fx-hit::after,
.battlefield.fx-crit::after,
.battlefield.fx-dominance::after { background: radial-gradient(circle at 50% 45%, rgba(255, 211, 109, .18), transparent 42%); }
.battlefield.fx-genjutsu::after { background: radial-gradient(circle at 50% 45%, rgba(191, 120, 255, .18), transparent 46%); }
.battlefield.fx-heal::after { background: radial-gradient(circle at 50% 45%, rgba(105, 240, 161, .16), transparent 44%); }
.battlefield.fx-block::after { background: radial-gradient(circle at 50% 45%, rgba(123, 240, 255, .14), transparent 42%); }
.skill.recommended strong::after {
  content: "  BON CONTRE";
  display: inline-block;
  margin-left: 6px;
  color: var(--success);
  font-size: 11px;
  letter-spacing: .06em;
}
.battle-banner {
  animation: bannerPop .24s ease;
}
@keyframes floatNumber {
  0% { opacity: 0; transform: translate(-50%, 16px) scale(.85); }
  15% { opacity: 1; transform: translate(-50%, 0) scale(1.08); }
  100% { opacity: 0; transform: translate(-50%, -42px) scale(1); }
}
@keyframes impactShake {
  0%, 100% { transform: translateX(0); }
  20% { transform: translateX(-8px); }
  45% { transform: translateX(7px); }
  70% { transform: translateX(-4px); }
}
@keyframes blockPulse {
  0%, 100% { box-shadow: var(--shadow); }
  45% { box-shadow: 0 0 0 4px rgba(123,240,255,.28), var(--shadow); border-color: rgba(123,240,255,.62); }
}
@keyframes dodgeSlide {
  0%, 100% { transform: translateX(0); }
  45% { transform: translateX(18px); }
}
@keyframes healPulse {
  0%, 100% { box-shadow: var(--shadow); }
  50% { box-shadow: 0 0 0 5px rgba(105,240,161,.22), 0 0 45px rgba(105,240,161,.18), var(--shadow); }
}
@keyframes mindWarp {
  0%, 100% { filter: none; transform: scale(1); }
  50% { filter: hue-rotate(55deg) saturate(1.35); transform: scale(1.015); }
}
@keyframes screenFlash {
  0% { opacity: 0; }
  20% { opacity: 1; }
  100% { opacity: 0; }
}
@keyframes bannerPop {
  0% { transform: translateY(-6px) scale(.96); opacity: .7; }
  100% { transform: translateY(0) scale(1); opacity: 1; }
}


/* v9 interactive map */


.map-layout {
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
  align-items: stretch;
}
.map-card, .map-detail { min-height: 0; }
.map-card { padding: 0; overflow: hidden; position: relative; }
.map-card-full { background: rgba(8,12,27,.72); }
.map-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-start;
  margin-bottom: 12px;
}
.map-head h3 { margin: 0 0 4px; }
.map-head p { margin: 0; }
.map-head-overlay {
  position: absolute;
  left: 14px;
  top: 14px;
  z-index: 12;
  max-width: min(560px, calc(100% - 28px));
  margin: 0;
  padding: 10px 12px;
  border-radius: 16px;
  background: rgba(6, 8, 18, .72);
  border: 1px solid rgba(255,255,255,.18);
  backdrop-filter: blur(10px);
  box-shadow: 0 12px 26px rgba(0,0,0,.28);
  pointer-events: none;
}
.map-head-overlay .badge { pointer-events: none; }
.world-map-stage {
  position: relative;
  aspect-ratio: 1639 / 960;
  width: 100%;
  min-height: min(860px, calc(100vw * 0.586));
  overflow: hidden;
  border-radius: 24px;
  border: 1px solid rgba(255,255,255,.16);
  background:
    linear-gradient(180deg, rgba(10, 14, 28, .02), rgba(6, 8, 18, .08)),
    url('village-map.png') center / cover no-repeat;
  box-shadow: inset 0 0 70px rgba(0,0,0,.18);
}
.world-map-stage.village-map-chikara { background-image: linear-gradient(180deg, rgba(10, 14, 28, .02), rgba(6, 8, 18, .08)), url('assets/village-chikara.png'); }
.world-map-stage.village-map-mahou { background-image: linear-gradient(180deg, rgba(10, 14, 28, .02), rgba(6, 8, 18, .08)), url('assets/village-mahou.png'); }
.world-map-stage.village-map-gensou { background-image: linear-gradient(180deg, rgba(10, 14, 28, .02), rgba(6, 8, 18, .08)), url('assets/village-gensou.png?v=566'); }
.world-map-stage.village-map-torikae { background-image: linear-gradient(180deg, rgba(10, 14, 28, .02), rgba(6, 8, 18, .08)), url('assets/village-torikae.png'); }
.world-map-stage.village-map-ukabu_north { background-image: linear-gradient(180deg, rgba(10, 14, 28, .02), rgba(6, 8, 18, .08)), url('assets/village-ukabu-north.png'); }
.world-map-stage.village-map-ukabu_south { background-image: linear-gradient(180deg, rgba(10, 14, 28, .02), rgba(6, 8, 18, .08)), url('assets/village-ukabu-south.png'); }
.world-map-stage.village-map-minato,
.world-map-stage.village-map-minato_west,
.world-map-stage.village-map-minato_east { background-image: linear-gradient(180deg, rgba(10, 14, 28, .02), rgba(6, 8, 18, .08)), url('assets/village-minato.png'); }
.world-map-stage.village-map-mizuho { background-image: linear-gradient(180deg, rgba(10, 14, 28, .02), rgba(6, 8, 18, .08)), url('assets/village-gensou.png'); }
.world-location-visual {
  min-height: 320px;
  border-radius: 18px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.14);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  display: flex;
  align-items: end;
  box-shadow: inset 0 -100px 120px rgba(0,0,0,.22);
}
.world-location-visual-copy {
  width: 100%;
  padding: 18px 20px;
  background: linear-gradient(180deg, rgba(8,12,28,0), rgba(8,12,28,.78));
  color: #fff;
}
.world-location-visual-copy h3 { margin: 4px 0 4px; color: #fff !important; }
.world-location-visual.village-preview-chikara { background-image: url('assets/village-chikara.png'); }
.world-location-visual.village-preview-mahou { background-image: url('assets/village-mahou.png'); }
.world-location-visual.village-preview-gensou { background-image: url('assets/village-gensou.png'); }
.world-location-visual.village-preview-torikae { background-image: url('assets/village-torikae.png'); }
.world-location-visual.village-preview-ukabu_north { background-image: url('assets/village-ukabu-north.png'); }
.world-location-visual.village-preview-ukabu_south { background-image: url('assets/village-ukabu-south.png'); }
.world-location-visual.village-preview-minato,
.world-location-visual.village-preview-minato_west,
.world-location-visual.village-preview-minato_east { background-image: url('assets/village-minato.png'); }
.world-location-visual.village-preview-mizuho { background-image: url('assets/village-gensou.png'); }
.world-map-stage:before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(8,12,28,.00), rgba(8,12,28,.08));
  pointer-events: none;
}
.world-map-stage:after {
  content: "";
  position: absolute;
  inset: auto 0 0 0;
  height: 16%;
  background: linear-gradient(180deg, transparent, rgba(4,6,14,.24));
  pointer-events: none;
}
.map-overlay-shade { position: absolute; inset: 0; pointer-events: none; }
.map-routes { display: none; }


.travel-map-stage {
  position: relative;
  aspect-ratio: 1672 / 941;
  width: 100%;
  min-height: min(860px, calc(100vw * 0.56));
  overflow: hidden;
  border-radius: 24px;
  border: 1px solid rgba(255,255,255,.16);
  background:
    linear-gradient(rgba(8,12,28,.18), rgba(8,12,28,.18)),
    url('overworld-map.png') center / cover no-repeat;
  box-shadow: inset 0 0 70px rgba(0,0,0,.18);
}
.travel-backdrop {
  position: absolute; inset: 0;
  background:
    linear-gradient(180deg, rgba(255,255,255,.05), transparent 24%),
    linear-gradient(0deg, rgba(4,6,14,.14), rgba(4,6,14,0));
  pointer-events: none;
}
.travel-region {
  position: absolute;
  border-radius: 50%;
  filter: blur(14px);
  opacity: .22;
  pointer-events: none;
}
.region-forest { left: 18%; top: 44%; width: 230px; height: 160px; background: radial-gradient(circle, rgba(105,240,161,.25), rgba(105,240,161,0)); }
.region-mist { left: 52%; top: 24%; width: 260px; height: 180px; background: radial-gradient(circle, rgba(176,145,255,.22), rgba(176,145,255,0)); }
.region-eclipse { right: 8%; top: 8%; width: 280px; height: 190px; background: radial-gradient(circle, rgba(255,95,115,.22), rgba(255,95,115,0)); }
.travel-routes {
  position: absolute; inset: 0; pointer-events: none;
}
.travel-route {
  position: absolute;
  height: 6px;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(245,184,75,.18), rgba(245,184,75,.95), rgba(245,184,75,.18));
  box-shadow: 0 0 14px rgba(245,184,75,.25);
  transform-origin: left center;
}


/* v17: nouvelle carte sans textes imprimés. Les zones cliquables sont des badges/logo visibles contrôlés par le code. */
.map-pin {
  position: absolute;
  z-index: 6;
  transform: translate(-50%, -50%);
  padding: 0;
  border: 0;
  background: transparent;
  color: #fff;
  box-shadow: none;
  cursor: pointer;
  transition: none;
}
.map-pin:hover,
.map-pin:active,
.map-pin:focus-visible {
  transform: translate(-50%, -50%) !important;
  filter: none !important;
}
.map-pin.pin-above {
  transform: translate(-50%, calc(-100% - 8px));
}
.map-pin.pin-above:hover,
.map-pin.pin-above:active,
.map-pin.pin-above:focus-visible {
  transform: translate(-50%, calc(-100% - 8px)) !important;
}
.map-pin:focus-visible { outline: 0; }
.pin-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  padding: 6px 12px 6px 7px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.18);
  background: rgba(7,10,23,.84);
  box-shadow: 0 10px 22px rgba(0,0,0,.32), inset 0 0 0 1px rgba(255,255,255,.04);
  backdrop-filter: blur(8px);
  transition: border-color .16s ease, box-shadow .16s ease, background .16s ease, transform .16s ease;
  white-space: nowrap;
}
.pin-core {
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  border-radius: 50%;
  border: 2px solid rgba(255,255,255,.26);
  background: linear-gradient(135deg, rgba(123,240,255,.38), rgba(19,28,58,.96));
  box-shadow: inset 0 0 12px rgba(255,255,255,.12);
  font-size: 16px;
}
.pin-text {
  color: var(--text);
  font-size: 12.5px;
  font-weight: 900;
  line-height: 1.05;
  letter-spacing: .01em;
  text-shadow: 0 1px 3px rgba(0,0,0,.25);
}
.map-pin.hub .pin-core { background: linear-gradient(135deg, rgba(245,184,75,.62), rgba(72,49,7,.96)); }
.map-pin.service .pin-core { background: linear-gradient(135deg, rgba(123,240,255,.42), rgba(19,28,58,.96)); }
.map-pin.mission .pin-core { background: linear-gradient(135deg, rgba(105,240,161,.42), rgba(19,28,58,.96)); }
.map-pin.board .pin-text { font-size: 11.25px; }
.map-pin.baths .pin-core { background: linear-gradient(135deg, rgba(111,229,216,.55), rgba(20,64,83,.95)); }
.map-pin.hard .pin-core,
.map-pin.boss .pin-core { background: linear-gradient(135deg, rgba(255,95,115,.58), rgba(82,16,29,.96)); }
.map-pin:hover .pin-badge,
.map-pin:focus-visible .pin-badge {
  border-color: rgba(255,255,255,.55);
  background: rgba(10,14,28,.94);
  box-shadow: 0 12px 28px rgba(0,0,0,.38), 0 0 0 4px rgba(255,255,255,.08);
}
.map-pin:hover .pin-core,
.map-pin:focus-visible .pin-core {
  border-color: rgba(255,255,255,.88);
  transform: scale(1.06);
}
.map-pin.selected .pin-badge {
  border-color: rgba(245,184,75,.94);
  background: linear-gradient(180deg, rgba(44,30,5,.90), rgba(10,14,28,.94));
  box-shadow: 0 14px 30px rgba(0,0,0,.40), 0 0 0 5px rgba(245,184,75,.16), 0 0 26px rgba(245,184,75,.30);
}
.map-pin.selected .pin-core {
  border-color: rgba(255,235,170,.96);
  background: linear-gradient(135deg, rgba(255,211,109,.80), rgba(89,64,11,.95));
  transform: scale(1.08);
}
.map-pin.hard.selected .pin-badge {
  border-color: rgba(255,95,115,.96);
  background: linear-gradient(180deg, rgba(45,12,18,.92), rgba(10,14,28,.94));
  box-shadow: 0 14px 30px rgba(0,0,0,.40), 0 0 0 5px rgba(255,95,115,.14), 0 0 26px rgba(255,95,115,.28);
}
.map-pin.hard.selected .pin-core {
  border-color: rgba(255,211,216,.96);
  background: linear-gradient(135deg, rgba(255,95,115,.80), rgba(94,20,31,.95));
}
.ninja-marker {
  position: absolute;
  z-index: 7;
  width: 34px;
  height: 34px;
  transform: translate(-50%, -142%);
  display: grid;
  place-items: center;
  border-radius: 50% 50% 50% 14%;
  background: rgba(245,184,75,.32);
  border: 1px solid rgba(245,184,75,.70);
  transition: left .32s ease, top .32s ease;
  pointer-events: none;
  filter: drop-shadow(0 9px 14px rgba(0,0,0,.50));
}
.ninja-marker.remote {
  z-index: 8;
  width: 38px;
  height: 38px;
  background: rgba(90, 140, 220, .28);
  border-color: rgba(140, 190, 255, .75);
  pointer-events: auto;
  cursor: pointer;
}
.ninja-marker.remote .remote-portrait {
  width: 28px;
  height: 28px;
  overflow: hidden;
  border-radius: 50%;
  transform: scale(0.42);
  transform-origin: center center;
}
.ninja-marker.remote .remote-name {
  position: absolute;
  left: 50%;
  top: 100%;
  transform: translate(-50%, 2px);
  font-size: 10px;
  font-weight: 700;
  white-space: nowrap;
  color: #f4e7c8;
  text-shadow: 0 1px 2px #000;
  animation: none;
}
.outside-player-marker.remote {
  filter: hue-rotate(200deg);
  opacity: 0.92;
  pointer-events: auto;
  cursor: pointer;
}
.pvp-overlay {
  position: fixed;
  inset: 0;
  z-index: 40;
  display: grid;
  place-items: center;
  background: rgba(0, 0, 0, .45);
}
.pvp-panel {
  min-width: 260px;
  max-width: 360px;
  padding: 18px 20px;
}
.pvp-panel-actions {
  display: flex;
  gap: 8px;
  margin-top: 12px;
}
@keyframes ninjaBob { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-5px); } }

.map-action-popover {
  position: absolute;
  z-index: 14;
  width: min(330px, 34%);
  min-width: 260px;
  transform: translate(-50%, 0);
  padding: 12px;
  border-radius: 18px;
  background: rgba(6, 8, 18, .82);
  border: 1px solid rgba(255,255,255,.18);
  backdrop-filter: blur(10px);
  box-shadow: 0 16px 34px rgba(0,0,0,.35);
}
.map-action-popover.above { transform: translate(-50%, -100%); }
.map-action-popover.left-side { transform: translate(-96%, 0); }
.map-action-popover.left-side.above { transform: translate(-96%, -100%); }
.map-action-popover.right-side { transform: translate(-4%, 0); }
.map-action-popover.right-side.above { transform: translate(-4%, -100%); }
.map-action-title {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 5px;
}
.map-action-title span { font-size: 22px; }
.map-action-title strong { font-size: 16px; }
.map-action-popover p {
  margin: 0;
  font-size: 12.5px;
  color: var(--muted);
  line-height: 1.35;
}
.map-action-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 8px;
}
.map-action-meta span {
  display: inline-flex;
  padding: 5px 7px;
  border-radius: 999px;
  background: rgba(255,255,255,.09);
  border: 1px solid rgba(255,255,255,.10);
  color: var(--text);
  font-size: 11px;
  font-weight: 800;
}
.map-action-buttons {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 10px;
}
.map-action-buttons button {
  padding: 9px 12px;
  border-radius: 12px;
  min-width: 96px;
}
button.compact { padding: 9px 12px; min-width: 0; }

.map-legend {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  padding: 9px 14px 13px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}
.map-legend span { display: inline-flex; align-items: center; gap: 6px; }
.dot { width: 10px; height: 10px; border-radius: 50%; display: inline-block; background: rgba(255,255,255,.5); }
.dot.service { background: #7bf0ff; }
.dot.mission { background: #69f0a1; }
.dot.hard { background: #ff5f73; }
.dot.selected { background: #f5b84b; }

.map-detail {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(260px, .8fr);
  gap: 12px;
  align-items: start;
  padding: 15px;
}
.map-detail h2 { margin-bottom: 0; }
.map-detail p { margin: 0; }
.map-preview-path {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  grid-column: 1 / -1;
  margin: 0;
}
.map-preview-path span {
  display: inline-grid;
  grid-template-columns: 26px 1fr;
  align-items: center;
  gap: 7px;
  padding: 8px 10px;
  border-radius: 14px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.10);
  color: var(--muted);
  font-size: 13px;
  font-weight: 750;
}
.map-preview-path b { font-size: 18px; font-weight: 400; }

@media (max-width: 950px) {
  .map-head-overlay {
    position: static;
    max-width: none;
    margin: 0;
    border-radius: 24px 24px 0 0;
  }
  .world-map-stage, .travel-map-stage { border-radius: 0 0 24px 24px; min-width: 920px; }
   .pin-badge { min-height: 40px; padding: 5px 10px 5px 6px; gap: 6px; }
  .pin-core { width: 28px; height: 28px; font-size: 15px; }
  .pin-text { font-size: 11.5px; }
  .map-card { overflow-x: auto; }
  .map-action-popover { width: 300px; min-width: 250px; }
  .map-detail { grid-template-columns: 1fr; }
}
@media (max-width: 650px) {
  .world-map-stage, .travel-map-stage { min-width: 900px; }
  .pin-badge { min-height: 38px; padding: 5px 9px 5px 6px; gap: 6px; }
  .pin-label { font-size: 11px; }
  .pin-core { width: 28px; height: 28px; }
  .map-pin { width: 62px; height: 62px; }
  .pin-core { width: 42px; height: 42px; }
  .pin-icon { font-size: 20px; }
  .pin-label { max-width: 120px; font-size: 10px; }
  .ninja-marker { width: 31px; height: 31px; }
  .map-action-popover { width: 280px; min-width: 240px; }
}
.quick-dock {
  position: sticky;
  bottom: 12px;
  z-index: 10;
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  justify-content: center;
  margin-top: 18px;
  padding: 12px;
  border-radius: 22px;
  background: rgba(8,12,27,.78);
  border: 1px solid rgba(255,255,255,.13);
  backdrop-filter: blur(12px);
}
.mission-focus .map-hotspot.service:not(.selected) { opacity: .58; }
@media (max-width: 1000px) {
  .map-detail { grid-template-columns: 1fr; }
}
@media (max-width: 650px) {
  .map-card { overflow-x: auto; }
  .world-map-stage, .travel-map-stage { min-width: 980px; min-height: 552px; }
  .map-head-overlay { max-width: 520px; }
  .map-hotspot .hotspot-text { font-size: 10px; max-width: 120px; }
  .ninja-marker { width: 32px; height: 32px; }
  .map-selected-card { left: 14px; right: auto; max-width: 450px; }
  .quick-dock { position: static; }
}


/* v22 — connexion / création de compte local */
.auth-screen { min-height:100vh; display:grid; place-items:center; padding:28px; }
.auth-shell { width:min(1040px,100%); display:grid; grid-template-columns:1.15fr .85fr; gap:24px; }
.auth-brand { min-height:560px; border-radius:30px; padding:46px; display:flex; flex-direction:column; justify-content:flex-end; background:linear-gradient(180deg,rgba(5,9,22,.06),rgba(5,9,22,.94)),url('world-map.png') center/cover no-repeat; border:1px solid rgba(255,255,255,.16); box-shadow:0 24px 60px rgba(0,0,0,.32); }
.auth-brand h1 { margin:6px 0 12px; font-size:clamp(44px,6vw,76px); line-height:.94; }
.auth-brand p { color:var(--muted); max-width:620px; }
.auth-features { display:grid; gap:8px; margin-top:20px; }
.auth-features span { width:fit-content; padding:7px 10px; border-radius:999px; background:rgba(7,10,23,.76); border:1px solid rgba(255,255,255,.13); font-size:12px; font-weight:800; }
.auth-card { min-height:560px; display:flex; flex-direction:column; justify-content:center; padding:30px; }
.auth-tabs { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-bottom:18px; }
.form-stack { display:grid; gap:9px; }
.form-stack label,.character-name-card label { font-weight:850; margin-top:5px; }
.form-stack input,.character-name-card input { width:100%; min-height:48px; border-radius:14px; border:1px solid rgba(255,255,255,.17); background:rgba(255,255,255,.075); color:var(--text); padding:0 14px; outline:none; }
.form-stack input:focus,.character-name-card input:focus { border-color:rgba(123,240,255,.68); box-shadow:0 0 0 4px rgba(123,240,255,.08); }
.form-stack button { margin-top:10px; }
.auth-message { padding:11px 12px; border-radius:14px; margin-bottom:12px; background:rgba(245,184,75,.10); border:1px solid rgba(245,184,75,.24); font-size:13px; font-weight:750; }
.auth-note { margin-top:16px; color:var(--muted); font-size:11.5px; line-height:1.45; }
.character-name-card { display:grid; gap:9px; }
@media(max-width:850px){ .auth-shell{grid-template-columns:1fr}.auth-brand{min-height:300px;padding:28px}.auth-card{min-height:auto} }


/* v23 — dons innés de compte */
.gift-card {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 14px;
  align-items: center;
  padding: 16px;
  border-radius: 20px;
  margin: 10px 0;
  background: rgba(255,255,255,.075);
  border: 1px solid rgba(255,255,255,.14);
}
.gift-card.gift-rare {
  border-color: rgba(245,184,75,.42);
  background: linear-gradient(135deg, rgba(245,184,75,.11), rgba(255,255,255,.055));
  box-shadow: inset 0 0 28px rgba(245,184,75,.06);
}
.gift-card.gift-none { opacity: .9; }
.gift-icon {
  width: 60px;
  height: 60px;
  border-radius: 18px;
  display: grid;
  place-items: center;
  font-size: 31px;
  background: rgba(7,10,23,.72);
  border: 1px solid rgba(255,255,255,.14);
  box-shadow: 0 10px 22px rgba(0,0,0,.22);
}
.gift-card h3 { margin: 2px 0 5px; }
.gift-card p { margin: 0 0 7px; font-size: 13px; }
.gift-odds {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin-top: 14px;
}
.gift-odds span {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  padding: 8px 10px;
  border-radius: 12px;
  background: rgba(255,255,255,.07);
  border: 1px solid rgba(255,255,255,.09);
  font-size: 12px;
}
.academy-gift { margin: 16px 0 18px; }
@media(max-width:700px){ .gift-odds{grid-template-columns:1fr;} }


/* v24 — créateur visuel de personnage */
.creator-screen { max-width: 1500px; }
.creator-layout { display:grid; grid-template-columns:minmax(310px,.78fr) minmax(0,1.55fr); gap:18px; align-items:start; }
.creator-preview-card { position:sticky; top:14px; display:grid; gap:12px; }
.creator-preview-card label { font-weight:850; }
.creator-preview-card input { width:100%; min-height:48px; border-radius:14px; border:1px solid rgba(255,255,255,.17); background:rgba(255,255,255,.075); color:var(--text); padding:0 14px; outline:none; }
.creator-preview-card input:focus { border-color:rgba(123,240,255,.68); box-shadow:0 0 0 4px rgba(123,240,255,.08); }
.creator-confirm { min-height:52px; font-size:15px; }
.creator-controls { display:grid; gap:0; padding:0; overflow:hidden; }
.creator-section { display:grid; grid-template-columns:minmax(150px,.42fr) 1.58fr; gap:18px; padding:18px; border-bottom:1px solid rgba(255,255,255,.09); align-items:start; }
.creator-section:last-child { border-bottom:0; }
.creator-section h3 { margin:0 0 4px; }
.creator-section p { margin:0; color:var(--muted); font-size:12px; }
.creator-options { display:flex; flex-wrap:wrap; gap:8px; }
.creator-options + .creator-options { margin-top:9px; grid-column:2; }
.creator-choice { min-width:92px; min-height:40px; padding:8px 11px; border-radius:13px; background:rgba(255,255,255,.075); border:1px solid rgba(255,255,255,.13); color:var(--text); display:inline-flex; align-items:center; justify-content:center; gap:7px; box-shadow:none; }
.creator-choice:hover { transform:none; border-color:rgba(123,240,255,.45); }
.creator-choice.selected { border-color:rgba(245,184,75,.88); background:rgba(245,184,75,.12); box-shadow:0 0 0 3px rgba(245,184,75,.08); }
.color-choice { min-width:72px; }
.color-dot { width:18px; height:18px; border-radius:50%; border:2px solid rgba(255,255,255,.55); box-shadow:0 2px 5px rgba(0,0,0,.26); }
.player-heading { display:flex; align-items:center; gap:11px; }


/* Portrait layout lives in avatar.css. Legacy v24-v30 render styles removed. */

/* v34 — retour visuel des interactions */
button,
[role="button"],
.map-pin,
.location,
.choice,
.item-card,
.tech-card,
.inventory-row,
.mission-card,
.training-card {
  -webkit-tap-highlight-color: transparent;
}

button {
  transition:
    transform .16s cubic-bezier(.2,.75,.25,1),
    filter .16s ease,
    box-shadow .16s ease,
    border-color .16s ease,
    background .16s ease;
}
button:hover:not(:disabled) {
  transform: translateY(-2px);
  filter: brightness(1.08);
  box-shadow: 0 14px 28px rgba(0,0,0,.30);
}
button:active:not(:disabled) {
  transform: translateY(1px) scale(.985);
  filter: brightness(.96);
  box-shadow: 0 5px 12px rgba(0,0,0,.28);
}
button:focus-visible,
[role="button"]:focus-visible,
.map-pin:focus-visible {
  outline: 2px solid var(--accent-2);
  outline-offset: 3px;
}
button[aria-pressed="true"],
button[aria-selected="true"] {
  box-shadow: 0 0 0 2px rgba(123,240,255,.30), 0 10px 22px rgba(0,0,0,.22);
}

/* Les cartes qui contiennent une action annoncent clairement qu'elles sont interactives. */
.item-card:has(button),
.tech-card:has(button),
.inventory-row:has(button),
.mission-card:has(button),
.training-card:has(button),
.choice,
.location {
  transition:
    transform .18s cubic-bezier(.2,.75,.25,1),
    border-color .18s ease,
    box-shadow .18s ease,
    background .18s ease;
}
.item-card:has(button):hover,
.tech-card:has(button):hover,
.inventory-row:has(button):hover,
.mission-card:has(button):hover,
.training-card:has(button):hover,
.choice:hover,
.location:hover {
  transform: translateY(-3px);
  border-color: rgba(123,240,255,.42);
  background-color: rgba(123,240,255,.075);
  box-shadow: 0 16px 32px rgba(0,0,0,.24), 0 0 0 1px rgba(123,240,255,.10);
}
.item-card.equipped,
.tech-card.learned {
  box-shadow: 0 0 0 1px rgba(105,240,161,.18), 0 14px 28px rgba(0,0,0,.20);
}
.item-card.is-clicked,
.tech-card.is-clicked,
.inventory-row.is-clicked,
.mission-card.is-clicked,
.training-card.is-clicked,
.choice.is-clicked,
.location.is-clicked {
  animation: nr-card-click .42s ease;
}
button.is-clicked,
[role="button"].is-clicked {
  animation: nr-button-click .38s ease;
}
.map-pin.is-clicked .pin-badge {
  animation: nr-pin-click .42s ease;
}
.interaction-ripple {
  position: fixed;
  z-index: 9999;
  width: 18px;
  height: 18px;
  border: 2px solid rgba(255,211,109,.95);
  border-radius: 50%;
  pointer-events: none;
  transform: translate(-50%, -50%) scale(.25);
  box-shadow: 0 0 0 2px rgba(123,240,255,.14), 0 0 22px rgba(245,184,75,.46);
  animation: nr-ripple .46s cubic-bezier(.16,.75,.3,1) forwards;
}

@keyframes nr-button-click {
  0% { filter: brightness(1); box-shadow: 0 10px 20px rgba(0,0,0,.25); }
  32% { filter: brightness(1.22); box-shadow: 0 0 0 4px rgba(245,184,75,.22), 0 12px 30px rgba(245,184,75,.24); }
  100% { filter: brightness(1); }
}
@keyframes nr-card-click {
  0% { filter: brightness(1); }
  32% { filter: brightness(1.16); box-shadow: 0 0 0 3px rgba(123,240,255,.18), 0 18px 34px rgba(0,0,0,.28); }
  100% { filter: brightness(1); }
}
@keyframes nr-pin-click {
  0% { transform: scale(1); }
  36% { transform: scale(1.08); box-shadow: 0 0 0 5px rgba(245,184,75,.24), 0 16px 32px rgba(0,0,0,.44); }
  100% { transform: scale(1); }
}
@keyframes nr-ripple {
  0% { opacity: .95; transform: translate(-50%, -50%) scale(.25); }
  100% { opacity: 0; transform: translate(-50%, -50%) scale(4.6); }
}

@media (prefers-reduced-motion: reduce) {
  button,
  [role="button"],
  .item-card,
  .tech-card,
  .inventory-row,
  .mission-card,
  .training-card,
  .choice,
  .location { transition-duration: .01ms !important; }
  .is-clicked,
  .map-pin.is-clicked .pin-badge,
  .interaction-ripple { animation: none !important; }
}

/* v35 — thème shinobi : encre, bois sombre et rouge laqué */
:root {
  --bg: #101316;
  --panel: rgba(29, 34, 39, .94);
  --panel-2: rgba(45, 50, 54, .96);
  --text: #f4eee4;
  --muted: #b8b2a8;
  --accent: #c95743;
  --accent-2: #d9ad68;
  --danger: #c94d52;
  --success: #7fa37b;
  --shadow: 0 20px 60px rgba(0,0,0,.46);
  --bg-page: #cbb58d;
  --bg-panel: #f4ecd6;
  --bg-panel-alt: #efe5cb;
  --bg-card: #fbf7ec;
  --bg-input: #fffdf8;
  --text-primary: #2a241c;
  --text-secondary: #6a5840;
  --text-muted: #7d6b52;
  --text-inverse: #f7f1e4;
  --border-primary: #bca77d;
  --border-soft: #d8c8aa;
  --accent-hover: #a93e38;
  --accent-text: #fff5e8;
  --button-primary-bg: #dcb05a;
  --button-primary-text: #3a2a14;
  --button-primary-border: #c79343;
  --button-primary-hover: #eed08a;
  --button-secondary-bg: #f8efd8;
  --button-secondary-text: #4c412e;
  --button-secondary-border: #c4b48d;
  --button-secondary-hover: #fff6e4;
  --button-danger-bg: #b44548;
  --button-danger-text: #fff5e8;
  --button-disabled-bg: #e6dcc4;
  --button-disabled-text: #8a7a62;
  --warning: #b8862a;
  --info: #4a6e82;
  --stat-positive: #3d7044;
  --stat-negative: #a83c3c;
  --shop-stat-positive: var(--stat-positive);
  --shop-stat-negative: var(--stat-negative);
}

body {
  color: var(--text);
  background:
    radial-gradient(circle at 12% 8%, rgba(201,87,67,.16), transparent 30%),
    radial-gradient(circle at 86% 6%, rgba(217,173,104,.12), transparent 26%),
    radial-gradient(circle at 60% 100%, rgba(83,102,91,.16), transparent 34%),
    linear-gradient(135deg, #0b0d0f, #171b1e 52%, #0c1011);
}
button {
  color: #fff5e8;
  background: linear-gradient(135deg, #d46b4e, #a93e38);
  box-shadow: 0 10px 20px rgba(0,0,0,.32), inset 0 1px 0 rgba(255,255,255,.14);
}
button:hover:not(:disabled) { filter: brightness(1.1) saturate(1.06); }
button.secondary {
  color: var(--text);
  background: linear-gradient(180deg, rgba(255,255,255,.13), rgba(255,255,255,.075));
  border-color: rgba(217,173,104,.30);
}
button.danger { background: linear-gradient(135deg, #dc6262, #9e323e); }
.eyebrow { color: var(--accent-2); }
.logo-word { color: var(--accent-2); text-shadow: 0 0 25px rgba(217,173,104,.30); }
.card {
  background: linear-gradient(145deg, rgba(36,42,47,.97), rgba(24,29,33,.96));
  border-color: rgba(217,173,104,.18);
}
.card.bright { background: linear-gradient(135deg, rgba(57,57,54,.98), rgba(28,32,35,.96)); }
.message-card {
  background: linear-gradient(90deg, rgba(201,87,67,.16), rgba(217,173,104,.09));
  border-color: rgba(217,173,104,.34);
}
.badge {
  background: rgba(255,245,232,.09);
  border-color: rgba(217,173,104,.22);
}
.item-card,
.tech-card,
.inventory-row,
.mission-card,
.training-card {
  background: linear-gradient(145deg, rgba(46,53,58,.96), rgba(31,37,41,.96));
  border-color: rgba(217,173,104,.20);
}
.item-card.equipped,
.tech-card.learned {
  background: linear-gradient(145deg, rgba(73,91,73,.46), rgba(34,50,39,.74));
  border-color: rgba(127,163,123,.55);
}
.item-icon,
.gift-icon {
  background: rgba(10,13,15,.46);
  border-color: rgba(217,173,104,.24);
}
.active-tab,
.creator-choice.selected {
  background: linear-gradient(135deg, rgba(201,87,67,.34), rgba(126,53,45,.25)) !important;
  border-color: rgba(217,173,104,.82) !important;
  box-shadow: 0 0 0 3px rgba(201,87,67,.14), 0 12px 24px rgba(0,0,0,.22);
}
.stat-chip {
  background: rgba(255,245,232,.08);
  border-color: rgba(217,173,104,.20);
}
.stat-chip.plus { border-color: rgba(127,163,123,.48); }
.stat-chip.minus { border-color: rgba(201,77,82,.54); }
.quick-dock {
  background: rgba(14,17,19,.88);
  border-color: rgba(217,173,104,.22);
}
.map-action-popover {
  background: rgba(18,21,23,.92);
  border-color: rgba(217,173,104,.30);
}

/* v37 — exploration temporisée des zones */
.zone-exploration-card,
.zone-contracts { min-height: 100%; }
.zone-section-title { margin: 20px 0 8px; }
.zone-search {
  margin-top: 16px;
  padding: 16px;
  border-radius: 18px;
  background: linear-gradient(145deg, rgba(127,163,123,.14), rgba(10,13,15,.26));
  border: 1px solid rgba(127,163,123,.34);
  box-shadow: inset 0 0 24px rgba(127,163,123,.04);
}
.zone-search-active {
  border-color: rgba(217,173,104,.64);
  background: linear-gradient(145deg, rgba(201,87,67,.16), rgba(10,13,15,.30));
}
.zone-search-top { display:flex; justify-content:space-between; gap:12px; align-items:center; }
.zone-search-top strong { color:var(--text); font-size:16px; }
.zone-search-top span { color:var(--accent-2); font-weight:900; }
.zone-search p { margin:7px 0 12px; font-size:13px; }
.zone-search button { width:100%; margin-top:4px; }
.zone-contract {
  display:flex;
  justify-content:space-between;
  gap:10px;
  margin-top:10px;
  padding:8px 10px;
  border-radius:12px;
  background:rgba(217,173,104,.10);
  border:1px solid rgba(217,173,104,.24);
  color:var(--text);
  font-size:12px;
  font-weight:800;
}
.zone-contract strong { color:var(--accent-2); }
.search-progress {
  height:10px;
  overflow:hidden;
  border-radius:999px;
  background:rgba(255,255,255,.10);
  border:1px solid rgba(255,255,255,.14);
}
.search-progress span {
  display:block;
  height:100%;
  border-radius:inherit;
  background:linear-gradient(90deg, var(--accent), var(--accent-2));
  box-shadow:0 0 18px rgba(217,173,104,.34);
  transition:width .25s linear;
}
.search-steps { display:flex; justify-content:space-between; gap:7px; margin-top:10px; }
.search-step {
  color:var(--muted);
  font-size:11px;
  font-weight:800;
  opacity:.58;
}
.search-step.done, .search-step.active { color:var(--accent-2); opacity:1; }
.zone-contracts { display:grid; align-content:start; gap:10px; }
.zone-contracts > h3 { margin-bottom:2px; }
.zone-contracts .inventory-row { grid-template-columns:1fr; gap:8px; }
.zone-contracts .inventory-row .actions { margin-top:0; align-items:center; }
.map-pin.forest .pin-core { background:linear-gradient(135deg, rgba(127,163,123,.68), rgba(28,57,37,.96)); }

/* v38 — cycles de contrats et comptoir de revente */
.mission-limit {
  border-color: rgba(217,173,104,.45);
  color: var(--accent-2);
}
.mission-card.mission-cooldown {
  opacity: .72;
  border-color: rgba(255,255,255,.12);
}
.mission-card.mission-cooldown .mission-limit { color: var(--muted); }
.shop-sell-card { margin-top: 16px; }
.shop-sell-card .shop-header { align-items: flex-start; }
.sell-list { display:grid; gap:8px; }
.sell-row { grid-template-columns: 1fr auto; align-items:center; }
.sell-row button { white-space: nowrap; }
@media (max-width: 700px) {
  .sell-row { grid-template-columns: 1fr; }
  .sell-row button { width:100%; }
}

/* v39 — mission scenes and living expeditions */
.mission-screen {
  width: min(1380px, calc(100% - 28px));
  padding-top: 24px;
}
.mission-topbar { align-items: flex-start; }
.mission-topbar h1 { margin: 6px 0 2px; font-size: clamp(28px, 4vw, 48px); }
.mission-subtitle { margin: 0; color: var(--accent-2); font-weight: 800; }
.mission-message { margin-bottom: 16px; }
.mission-journey-layout,
.mission-encounter-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(280px, .55fr);
  gap: 18px;
  align-items: stretch;
}
.mission-journey-main,
.mission-encounter-main { display: grid; gap: 14px; min-width: 0; }
.mission-scene {
  position: relative;
  min-height: 430px;
  overflow: hidden;
  isolation: isolate;
  border-radius: 28px;
  border: 1px solid rgba(217,173,104,.35);
  box-shadow: 0 24px 65px rgba(0,0,0,.42), inset 0 0 80px rgba(0,0,0,.25);
  background: linear-gradient(180deg, #203b4a 0%, #18282d 52%, #0e171a 100%);
}
.mission-scene.scene-mist { background: linear-gradient(180deg, #293d53 0%, #243c41 47%, #121d23 100%); }
.mission-scene.scene-eclipse { background: linear-gradient(180deg, #382d4b 0%, #2a2937 52%, #12151c 100%); }
.scene-glow,
.scene-moon,
.scene-terrain,
.scene-atmosphere,
.scene-landmark,
.scene-caption,
.scene-vignette { position:absolute; }
.scene-glow {
  inset: -30% -10% auto;
  height: 80%;
  background: radial-gradient(ellipse at 50% 25%, rgba(222,211,151,.25), transparent 58%);
  filter: blur(5px);
  animation: scene-breathe 7s ease-in-out infinite;
}
.scene-moon {
  width: 120px;
  height: 120px;
  top: 48px;
  right: 13%;
  border-radius: 50%;
  background: radial-gradient(circle at 35% 32%, #f4e9bd 0 9%, #c9b98c 42%, rgba(201,185,140,.08) 70%, transparent 72%);
  opacity: .8;
  box-shadow: 0 0 45px rgba(244,233,189,.22);
}
.scene-terrain {
  left: -5%;
  right: -5%;
  bottom: -1px;
  height: 47%;
  background: linear-gradient(155deg, rgba(22,51,40,.95), rgba(7,17,18,.98));
  clip-path: polygon(0 35%, 13% 28%, 23% 39%, 35% 19%, 46% 34%, 62% 12%, 75% 29%, 87% 17%, 100% 32%, 100% 100%, 0 100%);
  z-index: -1;
}
.scene-mist .scene-terrain { background: linear-gradient(155deg, rgba(37,77,74,.92), rgba(7,20,24,.98)); }
.scene-eclipse .scene-terrain { background: linear-gradient(155deg, rgba(58,48,69,.95), rgba(13,15,22,.99)); }
.scene-atmosphere { inset: 0; pointer-events: none; }
.ambient { position: absolute; color: rgba(239,226,177,.78); font-size: 26px; text-shadow: 0 6px 20px rgba(0,0,0,.4); animation: scene-drift 6s ease-in-out infinite; }
.ambient-0 { left: 9%; top: 22%; font-size: 64px; opacity: .42; animation-delay: -.8s; }
.ambient-1 { left: 28%; top: 14%; animation-delay: -3s; }
.ambient-2 { left: 68%; top: 28%; font-size: 18px; animation-delay: -1.6s; }
.ambient-3 { right: 7%; top: 42%; opacity: .52; animation-delay: -4.3s; }
.scene-landmark { left: 50%; top: 44%; transform: translate(-50%, -50%); width: 180px; height: 180px; display:grid; place-items:center; }
.landmark-shadow { position:absolute; width:150px; height:38px; bottom:10px; border-radius:50%; background:rgba(0,0,0,.36); filter:blur(7px); }
.landmark-icon { position:relative; font-size: 92px; line-height:1; filter: drop-shadow(0 18px 18px rgba(0,0,0,.45)); animation: scene-float 4.5s ease-in-out infinite; }
.scene-combat .landmark-icon { filter: drop-shadow(0 0 18px rgba(201,87,67,.45)) drop-shadow(0 18px 18px rgba(0,0,0,.5)); }
.scene-caption { left: 28px; right: 28px; bottom: 24px; z-index: 2; max-width: 620px; }
.scene-caption h2 { margin: 5px 0 4px; font-size: clamp(27px, 4vw, 44px); text-shadow: 0 4px 18px rgba(0,0,0,.55); }
.scene-caption p { margin: 0; max-width: 590px; color: rgba(255,249,229,.85); text-shadow: 0 2px 10px rgba(0,0,0,.5); }
.scene-vignette { inset: 0; z-index: 1; pointer-events:none; box-shadow: inset 0 -130px 100px rgba(0,0,0,.50), inset 0 0 90px rgba(0,0,0,.18); }
.mission-action-panel,
.mission-encounter-copy {
  padding: 20px 22px;
  border: 1px solid rgba(217,173,104,.28);
  border-radius: 22px;
  background: linear-gradient(145deg, rgba(35,42,42,.96), rgba(18,23,24,.97));
  box-shadow: 0 14px 30px rgba(0,0,0,.22);
}
.mission-action-meta { display:flex; justify-content:space-between; align-items:center; gap:10px; margin-bottom: 8px; }
.mission-action-panel h3 { margin: 5px 0 4px; font-size: 23px; }
.mission-action-panel p, .mission-encounter-copy p { margin: 0; }
.mission-route-card { background: linear-gradient(165deg, rgba(30,38,39,.96), rgba(16,21,22,.97)); }
.mission-route-card h3 { margin: 5px 0 18px; }
.route-line { position:relative; display:grid; gap: 4px; }
.route-line::before { content:""; position:absolute; left:16px; top:14px; bottom:14px; width:2px; background:linear-gradient(var(--accent), rgba(217,173,104,.08)); opacity:.55; }
.mission-route-step { position:relative; display:grid; grid-template-columns:32px 32px 1fr; gap:8px; align-items:center; min-height:58px; padding:7px 8px; border:1px solid transparent; border-radius:15px; color:var(--muted); }
.mission-route-step.active { color:var(--text); background:rgba(217,173,104,.13); border-color:rgba(217,173,104,.35); box-shadow:0 0 0 2px rgba(217,173,104,.06); }
.mission-route-step.done { opacity:.58; }
.route-index { z-index:1; display:grid; place-items:center; width:28px; height:28px; border-radius:50%; background:#263033; border:1px solid rgba(217,173,104,.35); color:var(--accent-2); font-weight:900; }
.mission-route-step.active .route-index { background:var(--accent); color:#161717; }
.route-icon { font-size:23px; text-align:center; }
.mission-route-step strong, .mission-route-step small { display:block; }
.mission-route-step small { margin-top:2px; color:var(--muted); font-size:11px; }
.mission-route-card .mission-bank { margin-top:20px; }
.mission-encounter-layout { grid-template-columns: minmax(0, 1.3fr) minmax(270px, .7fr); }
.mission-encounter-main { grid-template-columns: minmax(0, 1fr) minmax(250px, .55fr); align-items:stretch; }
.mission-encounter-main .mission-scene { min-height: 460px; }
.mission-encounter-copy { align-self: center; }
.mission-encounter-copy h2 { margin: 6px 0 10px; }
.mission-encounter-copy button { width:100%; margin-top:18px; }
@keyframes scene-drift { 0%,100% { transform:translate3d(0,0,0) rotate(-2deg); } 50% { transform:translate3d(16px,-13px,0) rotate(5deg); } }
@keyframes scene-float { 0%,100% { transform:translateY(0) scale(1); } 50% { transform:translateY(-10px) scale(1.03); } }
@keyframes scene-breathe { 0%,100% { opacity:.72; transform:scale(1); } 50% { opacity:1; transform:scale(1.08); } }
@media (max-width: 980px) {
  .mission-journey-layout, .mission-encounter-layout { grid-template-columns: 1fr; }
  .mission-route-card { order: 2; }
}
@media (max-width: 700px) {
  .mission-screen { width: min(100% - 16px, 1380px); padding-top:14px; }
  .mission-topbar { display:block; }
  .mission-topbar .badges { margin-top:12px; }
  .mission-scene { min-height: 380px; }
  .mission-encounter-main { grid-template-columns: 1fr; }
  .mission-encounter-main .mission-scene { min-height: 330px; }
  .scene-caption { left:20px; right:20px; bottom:18px; }
  .scene-moon { width:82px; height:82px; right:10%; top:34px; }
  .landmark-icon { font-size:72px; }
}

/* v41 — place de commerce sur la carte du village */
.map-pin.market .pin-core {
  background: linear-gradient(135deg, rgba(217,173,104,.90), rgba(115,63,43,.98));
  box-shadow: 0 0 0 4px rgba(217,173,104,.12), 0 14px 30px rgba(0,0,0,.42);
}
.map-pin.arena .pin-core {
  background: linear-gradient(135deg, rgba(255,140,90,.88), rgba(92,28,18,.98));
  box-shadow: 0 0 0 4px rgba(255,140,90,.14), 0 14px 30px rgba(0,0,0,.42);
}

.arena-live-header { background:#151311; }
.arena-live-banner {
  margin:0;
  padding:8px 16px;
  text-align:center;
  font-size:13px;
  color:#f3e6c8;
  background:#3a3428;
  border-top:1px solid #5a4d38;
}
.arena-live-screen {
  min-height:calc(100vh - 110px);
  background:#e8dfd0;
  padding:28px 16px 48px;
}
.arena-live-sheet {
  width:min(980px, 100%);
  margin:0 auto;
  padding:36px 28px 32px;
  border-radius:18px;
  background:#f7f1e4;
  border:1px solid #e4d8c2;
  box-shadow:0 18px 40px rgba(60,40,20,.08);
  text-align:center;
  color:#4a3724;
}
.arena-live-pill {
  display:inline-block;
  margin-bottom:14px;
  padding:6px 14px;
  border-radius:999px;
  background:#efe4cf;
  border:1px solid #e0d0b0;
  font-size:12px;
  font-weight:650;
  color:#7a6238;
}
.arena-live-hero-icon { font-size:42px; color:#b8893a; margin-bottom:8px; }
.arena-live-sheet h1 {
  margin:0 0 12px;
  font-size:34px;
  font-weight:750;
  color:#3d2a16;
}
.arena-live-lead { margin:0 auto 10px; max-width:640px; font-size:16px; line-height:1.45; }
.arena-live-note { margin:0 auto 28px; max-width:620px; font-size:13px; color:#8a7458; }
.arena-live-grid {
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:14px;
  text-align:left;
  margin-bottom:22px;
}
.arena-live-card {
  padding:18px 16px 16px;
  border-radius:14px;
  background:#fffaf1;
  border:1px solid #eadcc4;
  min-height:210px;
}
.arena-live-card-icon { display:block; font-size:22px; margin-bottom:10px; }
.arena-live-card h2 { margin:0 0 8px; font-size:18px; color:#3d2a16; }
.arena-live-card p { margin:0 0 16px; font-size:13px; line-height:1.45; color:#6a5640; }
.arena-live-card small { color:#9a8060; font-size:12px; }
.arena-live-cta {
  padding:22px 18px 20px;
  border-radius:14px;
  background:#f3ead8;
  border:1px solid #e6d7bb;
}
.arena-live-cta h2 { margin:0 0 8px; font-size:22px; }
.arena-live-cta p { margin:0 auto 18px; max-width:720px; font-size:14px; line-height:1.5; color:#6a5640; }
.arena-live-primary {
  background:#6b4a22;
  color:#f7f1e4;
  border:0;
  border-radius:8px;
  padding:12px 22px;
  font-weight:700;
}
.arena-live-link {
  display:block;
  margin:12px auto 0;
  background:transparent;
  border:0;
  color:#8a6a3a;
  text-decoration:underline;
  box-shadow:none;
}
.arena-live-toolbar {
  display:flex;
  gap:18px;
  justify-content:center;
  padding:8px 16px;
  font-size:13px;
  background:#3a3428;
  color:#f3e6c8;
}
.arena-voie-banner {
  text-align:left;
  padding:16px 18px;
  margin-bottom:18px;
  border-radius:12px;
  background:#f4ead4;
  border:1px solid #e4d3ae;
}
.arena-voie-next {
  text-align:left;
  padding:20px;
  margin:18px 0;
  border-radius:14px;
  background:#3d3a34;
  color:#f7f1e4;
}
.arena-voie-sheet { text-align:left; }
.arena-voie-sheet h1 { text-align:left; }
.mission-step-flavor {
  margin:10px 0 0;
  font-size:13px;
  line-height:1.45;
  color:#6a5640;
  white-space:pre-wrap;
}
@media (max-width: 900px) {
  .arena-live-grid { grid-template-columns:1fr 1fr; }
  .arena-live-sheet h1 { font-size:26px; }
}
.market-intro {
  margin-bottom: 16px;
  border-color: rgba(217,173,104,.38);
  background: linear-gradient(135deg, rgba(217,173,104,.13), rgba(30,38,39,.92));
}
.market-intro strong { color: var(--accent-2); }
.market-intro p { margin: 5px 0 0; }
.shop-screen.market-screen .shop-buy-card { display:none; }
.shop-screen.buy-shop-screen .shop-sell-card { display:none; }

/* v45 — boutons S’y rendre puis Entrer selon la position */
.map-travel-overlay {
  position: absolute;
  z-index: 18;
  left: 50%;
  top: 50%;
  width: min(430px, calc(100% - 32px));
  transform: translate(-50%, -50%);
  padding: 18px 20px;
  border: 1px solid rgba(217,173,104,.58);
  border-radius: 20px;
  background: rgba(12,16,17,.91);
  backdrop-filter: blur(12px);
  box-shadow: 0 22px 50px rgba(0,0,0,.45), 0 0 0 5px rgba(217,173,104,.08);
}
.map-travel-overlay strong { display:block; margin-top:4px; color:var(--text); }
.travel-countdown { position:absolute; top:18px; right:20px; color:var(--accent-2); font-weight:900; }
.map-travel-overlay p { margin:9px 0 0; font-size:12px; }
.travel-progress {
  height:10px;
  margin-top:16px;
  overflow:hidden;
  border-radius:999px;
  background:rgba(255,255,255,.11);
  border:1px solid rgba(255,255,255,.15);
}
.travel-progress span { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg, var(--accent), var(--accent-2)); box-shadow:0 0 18px rgba(217,173,104,.42); transition:width .25s linear; }
.ninja-marker.traveling span { animation: map-travel-bob .72s ease-in-out infinite alternate; }
@keyframes map-travel-bob { from { transform:translateY(0) rotate(-4deg); } to { transform:translateY(-9px) rotate(4deg); } }

/* v52 — carte directe : un repère mène immédiatement au lieu */
.village-screen .map-card-full,
.world-map-screen .map-card-full {
  background: transparent;
  border: 0;
  box-shadow: none;
}
.village-screen .world-map-stage,
.world-map-screen .travel-map-stage {
  border-radius: 12px;
  border-color: rgba(15, 18, 17, .72);
}
.village-screen .map-pin,
.world-map-screen .map-pin {
  z-index: 8;
}
.village-screen .pin-badge,
.world-map-screen .pin-badge {
  min-height: 0;
  gap: 5px;
  padding: 5px 8px;
  border: 1px solid rgba(255, 248, 226, .78);
  border-radius: 3px;
  background: rgba(12, 14, 14, .88);
  box-shadow: 0 2px 0 rgba(0,0,0,.72), 0 5px 12px rgba(0,0,0,.42);
  backdrop-filter: none;
}
.village-screen .pin-core,
.world-map-screen .pin-core {
  width: auto;
  height: auto;
  border: 0;
  border-radius: 0;
  background: none !important;
  box-shadow: none !important;
  font-size: 14px;
  line-height: 1;
}
.village-screen .pin-text,
.world-map-screen .pin-text {
  color: #fffdf5;
  font-size: 11px;
  font-weight: 950;
  line-height: 1;
  letter-spacing: .025em;
  text-transform: uppercase;
  text-shadow: 0 2px 2px #000, 1px 0 1px #000, -1px 0 1px #000;
}
.village-screen .map-pin:hover .pin-badge,
.village-screen .map-pin:focus-visible .pin-badge,
.world-map-screen .map-pin:hover .pin-badge,
.world-map-screen .map-pin:focus-visible .pin-badge {
  border-color: #fff5d8;
  background: rgba(38, 29, 18, .96);
  box-shadow: 0 0 0 3px rgba(255, 232, 173, .2), 0 7px 15px rgba(0,0,0,.5);
  transform: scale(1.05);
}
.village-screen .map-pin.selected .pin-badge,
.world-map-screen .map-pin.selected .pin-badge {
  color: #17120a;
  border-color: #6b4a09;
  background: #f1c526;
  box-shadow: 0 2px 0 #5d4007, 0 0 0 3px rgba(255, 221, 79, .24), 0 7px 16px rgba(0,0,0,.46);
}
.village-screen .map-pin.selected .pin-text,
.world-map-screen .map-pin.selected .pin-text {
  color: #17120a;
  text-shadow: none;
}
.village-screen .map-pin.selected .pin-core,
.world-map-screen .map-pin.selected .pin-core {
  transform: none;
}
.village-screen .map-layout,
.world-map-screen .map-layout {
  gap: 12px;
}
@media (max-width: 700px) {
  .village-screen .pin-badge,
  .world-map-screen .pin-badge { padding: 4px 7px; }
  .village-screen .pin-text,
  .world-map-screen .pin-text { font-size: 10px; }
  .village-screen .pin-core,
  .world-map-screen .pin-core { width: auto; height: auto; font-size: 13px; }
}

/* v47 — volume gradué et audio rééquilibré dans Options */
.options-backdrop {
  position: fixed;
  inset: 0;
  z-index: 90;
  display: grid;
  place-items: center;
  padding: 18px;
  background: rgba(5, 8, 10, .72);
  backdrop-filter: blur(9px);
}
.options-panel {
  width: min(560px, 100%);
  max-height: min(720px, calc(100vh - 36px));
  overflow: auto;
  padding: 24px;
  border: 1px solid rgba(217,173,104,.42);
  border-radius: 24px;
  background: linear-gradient(145deg, rgba(35,42,42,.98), rgba(14,19,20,.99));
  box-shadow: 0 28px 80px rgba(0,0,0,.56), 0 0 0 5px rgba(217,173,104,.08);
}
.options-head { display:flex; justify-content:space-between; gap:18px; align-items:flex-start; }
.options-head h2 { margin: 5px 0 4px; }
.options-head p { margin:0; color:var(--muted); }
.options-close { width:38px; min-width:38px; height:38px; padding:0; font-size:24px; line-height:1; }
.options-list { display:grid; gap:9px; margin-top:22px; }
.option-setting {
  width:100%;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:16px;
  padding:14px 15px;
  text-align:left;
  color:var(--text);
  border:1px solid rgba(255,255,255,.12);
  border-radius:15px;
  background:rgba(255,255,255,.045);
}
.option-setting:hover { border-color:rgba(217,173,104,.48); background:rgba(217,173,104,.08); }
.option-setting > span { display:flex; align-items:center; gap:12px; min-width:0; }
.option-setting b { display:grid; place-items:center; width:31px; height:31px; flex:0 0 31px; border-radius:10px; background:rgba(217,173,104,.16); font-size:17px; }
.option-setting strong, .option-setting small { display:block; }
.option-setting small { margin-top:3px; color:var(--muted); font-size:12px; font-weight:600; }
.option-setting em { flex:0 0 auto; color:var(--accent-2); font-size:12px; font-style:normal; font-weight:900; }
.volume-setting {
  display:grid;
  gap:10px;
  padding:14px 15px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:15px;
  background:rgba(255,255,255,.045);
}
.volume-setting > span { display:flex; justify-content:space-between; gap:12px; color:var(--text); }
.volume-setting output { color:var(--accent-2); font-weight:900; }
.volume-setting input { width:100%; accent-color:var(--accent); cursor:pointer; }
.options-footer { display:flex; justify-content:flex-end; flex-wrap:wrap; gap:9px; margin-top:20px; }
body.reduce-motion *, body.reduce-motion *::before, body.reduce-motion *::after {
  animation-duration: .01ms !important;
  animation-iteration-count: 1 !important;
  scroll-behavior: auto !important;
  transition-duration: .01ms !important;
}
body.compact-ui .screen { padding-top: 14px; padding-bottom: 14px; }
body.compact-ui .card { padding: 16px; }
body.compact-ui .quick-dock { gap: 5px; padding: 8px; }
body.compact-ui .quick-dock button { padding: 8px 11px; }
@media (max-width: 620px) {
  .options-panel { padding:18px; border-radius:20px; }
  .option-setting { align-items:flex-start; }
  .options-footer > button { flex:1 1 170px; }
}

/* Final village palette overrides (the later combat theme must not recolor this dashboard). */
body:has(.village-screen) .village-profile-card,
body:has(.village-screen) .village-purse-card,
body:has(.village-screen) .village-topline,
body:has(.village-screen) .village-radio,
body:has(.village-screen) .village-screen .map-detail {
  background:var(--bg-panel) !important;
  border-color:var(--border-primary) !important;
  color:var(--text-primary) !important;
}
body:has(.village-screen) .village-profile-card h2,
body:has(.village-screen) .village-profile-card h3,
body:has(.village-screen) .village-topline h1,
body:has(.village-screen) .village-radio h3,
body:has(.village-screen) .village-screen .map-detail h2 { color:var(--text-primary) !important; }
body:has(.village-screen) .village-profile-card p,
body:has(.village-screen) .village-topline p,
body:has(.village-screen) .village-screen .map-detail p { color:var(--text-secondary) !important; }
body:has(.village-screen) .village-profile-portrait { background:#d5d7cf !important; }
body:has(.village-screen) .village-profile-card .bar { background:#e2d6b8 !important; }
body:has(.village-screen) .village-radio .radio-feed { background:var(--bg-panel) !important; }
body:has(.village-screen) .village-radio .radio-feed p { color:#5f5647 !important; }
body:has(.village-screen) .village-radio .radio-feed strong { color:#315b72 !important; }
body:has(.village-screen) .village-radio .radio-compose input { background:#fffdf4 !important; color:#3b3529 !important; border-color:#c8b88f !important; }
body:has(.village-screen) .village-screen { width:min(1600px,calc(100% - 24px)) !important; }
/* The details rail is narrow by design; keep its contents in one readable column. */
body:has(.village-screen) .village-screen .map-detail {
  display:block !important;
  min-width:0;
}
body:has(.village-screen) .village-screen .map-detail > .badges {
  display:flex;
  justify-content:flex-start;
  flex-wrap:wrap;
  gap:6px;
  margin-top:12px;
}
body:has(.village-screen) .village-screen .map-detail .map-preview-path {
  display:flex;
  flex-direction:column;
  gap:6px;
  margin-top:12px;
}
body:has(.village-screen) .village-screen .map-detail .map-preview-path span {
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

/* Shared top navigation: character actions stay available above each game screen. */
.game-header { position:sticky; top:0; z-index:60; background:#151715; color:#eee8d9; border-bottom:1px solid #494438; box-shadow:0 2px 8px #0002; }
.game-header-inner { display:flex; align-items:center; gap:26px; width:min(1600px,calc(100% - 24px)); min-height:64px; margin:0 auto; }
.game-brand { display:flex; align-items:center; flex:0 0 206px; gap:10px; color:#f2e5c4; text-decoration:none; font-family:Georgia,serif; font-size:23px; line-height:1; white-space:nowrap; }
.game-brand em { font-weight:400; color:#c8a96c; }
.game-brand small { display:block; margin-top:5px; color:#a7a18f; font:9px system-ui,sans-serif; letter-spacing:.25em; text-transform:uppercase; }
.game-brand-seal { display:grid; place-items:center; width:31px; height:34px; background:#8b3c30; border:1px solid #b46b50; border-radius:3px; font:22px serif; color:#e9d9b6; }
.game-primary-nav { display:flex; align-self:stretch; align-items:center; gap:5px; }
.game-header .game-nav-link { position:relative; min-height:38px; padding:10px 15px; border-radius:4px; box-shadow:none; background:transparent; color:#c9c5b9; font-size:12px; font-weight:650; white-space:nowrap; }
.game-header .game-nav-link:hover { background:#2b2c28; color:var(--bg-card); transform:none; }
.game-header .game-nav-link.is-active { background:#373a34; color:var(--bg-card); }
.game-header .game-nav-link.is-active::after { content:""; position:absolute; height:2px; bottom:0; left:15px; right:15px; border-radius:2px; background:#c6ac78; }
.game-header .game-nav-link:disabled { opacity:.5; }
.game-header-tools { display:flex; align-items:center; gap:16px; margin-left:auto; }
.game-header-utilities { display:flex; align-items:center; gap:2px; }
.game-header .game-tool-icon,
.game-header .game-account-menu > summary {
  display:grid;
  place-items:center;
  width:40px;
  height:40px;
  min-height:40px;
  padding:0;
  margin:0;
  border:0;
  border-radius:8px;
  background:transparent !important;
  box-shadow:none !important;
  color:#9aa3ad !important;
  cursor:pointer;
}
.game-header .game-tool-icon svg { width:20px; height:20px; display:block; }
.game-header .game-account-menu > summary { font-size:20px; line-height:1; list-style:none; }
.game-header .game-tool-icon:hover:not(:disabled),
.game-header .game-tool-icon.is-active,
.game-header .game-account-menu[open] > summary,
.game-header .game-account-menu > summary:hover {
  background:#2a2b28 !important;
  color:#e8e8ea !important;
  transform:none !important;
  filter:none !important;
  box-shadow:none !important;
}
.game-header .game-tool-icon:disabled { opacity:.4; cursor:not-allowed; }
.autosave-state { display:flex; align-items:center; gap:7px; color:#a9b9a4; font-size:11px; white-space:nowrap; }
.autosave-state i { width:6px; height:6px; border-radius:50%; background:#8bb77c; }
.autosave-state.has-error { color:#f1b08c; }
.autosave-state.has-error i { background:#eb896c; }
.game-account-menu { position:relative; }
.game-account-menu > summary { display:grid; place-items:center; width:38px; height:38px; list-style:none; border-radius:8px; color:#e1d9c6; cursor:pointer; font-size:21px; }
.game-account-menu > summary::-webkit-details-marker { display:none; }
.game-account-menu[open] > summary, .game-account-menu > summary:hover { background:#373a34; }
.game-account-dropdown {
  position: absolute;
  top: calc(100% + 5px);
  right: 0;
  z-index: 80;
  width: min(248px, calc(100vw - 24px));
  padding: 8px 0;
  background: var(--dropdown-bg, #2A2A2A);
  border: 1px solid var(--dropdown-divider, rgba(255,255,255,.1));
  border-radius: 8px;
  box-shadow: 0 4px 6px rgba(0,0,0,.18);
}
.game-account-dropdown .game-menu-item {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  min-height: 0;
  margin: 0;
  padding: 12px 16px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--dropdown-text, #a3a3a3) !important;
  font-size: 14px;
  font-weight: 500;
  text-align: left;
  transform: none !important;
  filter: none !important;
}
.game-account-dropdown .game-menu-item:hover:not(:disabled) {
  background: var(--dropdown-hover-bg) !important;
  color: var(--dropdown-hover-text) !important;
  transform: none !important;
  filter: none !important;
}
.game-account-dropdown .game-menu-ico {
  width: 20px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--dropdown-icon);
}
.game-account-dropdown .game-menu-ico svg,
.menu-theme-btn svg { display: block; }
.game-menu-divider {
  height: 1px;
  margin: 6px 0;
  background: var(--dropdown-divider);
}
.menu-theme-switch {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 16px 12px;
}
.menu-theme-btn {
  position: relative;
  display: grid !important;
  place-items: center;
  width: 44px !important;
  height: 36px !important;
  min-height: 36px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 8px !important;
  background: rgba(255,255,255,.06) !important;
  box-shadow: none !important;
  color: var(--dropdown-icon) !important;
  font-size: 16px;
  transform: none !important;
  filter: none !important;
}
body.theme-day .menu-theme-btn { background: rgba(0,0,0,.06) !important; }
.menu-theme-btn.is-on {
  background: var(--dropdown-active-bg) !important;
  color: var(--dropdown-active-text) !important;
}
.menu-theme-btn .beta {
  position: absolute;
  top: -7px;
  right: -6px;
  padding: 1px 4px;
  border-radius: 3px;
  background: var(--dropdown-icon);
  color: var(--dropdown-bg);
  font-size: 8px;
  font-weight: 800;
  letter-spacing: .04em;
}
.game-account-dropdown .game-logout-button { margin-top: 2px; }
.game-reset-menu { margin-top:4px; padding:8px 10px 6px; border-top:0; }
.game-reset-menu > summary { cursor:pointer; color:#8a7b64; font-size:12px; }
.game-reset-menu p { color:#7d715d; font-size:11px; line-height:1.5; }
.game-account-dropdown .game-reset-button { border:1px solid #c4a48a; color:#7a4a32; }
.game-header :focus-visible { outline:2px solid #e8c887; outline-offset:3px; }
.village-notice { position:fixed; z-index:65; top:76px; right:max(16px,calc((100vw - 1600px)/2)); display:flex; align-items:flex-start; gap:12px; width:min(430px,calc(100% - 28px)); padding:12px 14px; border:1px solid #c6b58f; border-left:3px solid #887245; border-radius:6px; background:#fff7e6; color:#514735; box-shadow:0 4px 18px #29251526; font-size:12px; line-height:1.5; }
.village-notice button { flex:0 0 24px; width:24px; height:24px; padding:0; background:transparent; box-shadow:none; color:#6c604b; font-size:20px; }
@media(max-width:1150px) {
  .game-header-inner { gap:12px; }
  .game-brand { flex-basis:185px; font-size:21px; }
  .game-header .game-nav-link { padding:10px; }
  .game-header-tools { gap:10px; }
  .autosave-state > span { display:none; }
}
@media(max-width:800px) {
  .game-header-inner { display:grid; grid-template-columns:1fr auto; gap:0 12px; padding-top:9px; }
  .game-brand { font-size:20px; padding-bottom:5px; }
  .game-primary-nav { grid-column:1 / -1; grid-row:2; overflow-x:auto; max-width:100%; padding:7px 0; gap:2px; scrollbar-width:thin; }
  .game-header-tools { grid-column:2; grid-row:1; }
  .game-header .game-nav-link { flex:0 0 auto; min-height:34px; padding:8px 12px; }
  .village-notice { top:116px; }
}

/* v32 — panneau contextuel de lieu à droite de la carte. */
.village-screen .map-layout {
  grid-template-columns: minmax(0, 1fr) 300px;
}
.village-screen .location-choice-panel {
  display: flex !important;
  flex-direction: column;
  min-height: 300px;
  overflow: hidden;
  padding: 0 !important;
  background: #2f2a20 !important;
  border-color: #9e8962 !important;
  color: #f5eddc !important;
}
.location-choice-hero {
  width: 100%;
  min-height: 70px;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  padding: 10px 14px;
  color: #fff7e8;
  background:
    linear-gradient(180deg, rgba(8,10,9,.08), rgba(8,10,9,.86)),
    radial-gradient(circle at 25% 30%, rgba(225,177,88,.28), transparent 42%),
    linear-gradient(135deg, #485044, #24251f 58%, #1b1915);
  border-bottom: 1px solid rgba(232,211,168,.2);
}
.location-choice-hero.gate { background: linear-gradient(180deg, rgba(8,10,9,.1), rgba(8,10,9,.86)), linear-gradient(135deg, #5a4934, #26261f 55%, #171712); }
.location-choice-hero.academy { background: linear-gradient(180deg, rgba(8,10,9,.1), rgba(8,10,9,.86)), linear-gradient(135deg, #3f5360, #252c2d 55%, #17191a); }
.location-choice-hero.shop, .location-choice-hero.market { background: linear-gradient(180deg, rgba(8,10,9,.1), rgba(8,10,9,.86)), linear-gradient(135deg, #655238, #322a1f 55%, #191612); }
.location-choice-hero.inn { background: linear-gradient(180deg, rgba(8,10,9,.1), rgba(8,10,9,.86)), linear-gradient(135deg, #5b4131, #30271f 55%, #181512); }
.location-choice-hero.forest { background: linear-gradient(180deg, rgba(8,10,9,.1), rgba(8,10,9,.86)), linear-gradient(135deg, #344d35, #222b22 55%, #151915); }
.location-choice-hero-copy {
  min-width: 0;
}
.village-screen .location-choice-panel .eyebrow {
  color: #d8c49c !important;
  font-size: 10px;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.village-screen .location-choice-panel h2 {
  margin: 1px 0 0;
  color: #fff7e8 !important;
  font-size: 14px;
  line-height: 1.1;
}
.location-choice-copy { padding: 11px 14px 6px; }
.village-screen .location-choice-copy p {
  margin: 0;
  color: #d4cbb9 !important;
  font-size: 12px;
  line-height: 1.45;
}
.location-choice-status {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 10px;
}
.location-choice-status span {
  padding: 4px 7px;
  border: 1px solid rgba(231,210,166,.18);
  border-radius: 4px;
  background: rgba(255,255,255,.05);
  color: #ead8b5;
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .04em;
}
.village-screen .location-choice-panel .map-preview-path {
  margin: 0 14px 8px !important;
  padding-top: 4px;
}
.village-screen .location-choice-panel .map-preview-path span {
  padding: 7px 8px;
  border: 1px solid rgba(231,210,166,.15);
  border-radius: 5px;
  background: rgba(255,255,255,.04);
  color: #d7ccb7;
}
.location-choice-actions {
  display: grid;
  align-content: start;
  gap: 8px;
  margin-top: 6px;
  padding: 10px 12px 12px;
}
button.location-choice-row {
  width: 100%;
  min-height: 50px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 9px 10px 9px 12px;
  border: 1px solid #d6c7a6;
  border-radius: 4px;
  background: #fbf7ed;
  color: #28251f;
  box-shadow: none;
  text-align: left;
}
button.location-choice-row:hover:not(:disabled),
button.location-choice-row:focus-visible:not(:disabled) {
  border-color: #f0bd58;
  background: var(--bg-card);
  transform: translateY(-1px);
}
button.location-choice-row > span { min-width: 0; display: block; }
button.location-choice-row b { display: block; font-size: 12px; line-height: 1.25; }
button.location-choice-row small {
  display: block;
  margin-top: 3px;
  overflow: hidden;
  color: #776b59;
  font-size: 10px;
  font-weight: 600;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.pin-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
button.location-choice-row em {
  flex: 0 0 auto;
  min-width: 34px;
  color: #d28b1f;
  font-size: 12px;
  font-style: normal;
  font-weight: 950;
  text-align: right;
}
button.location-choice-row:disabled { opacity: .7; cursor: default; }
.village-screen .map-pin.current:not(.selected) .pin-badge {
  box-shadow: 0 0 0 2px rgba(255,255,255,.55), 0 2px 0 rgba(0,0,0,.72), 0 5px 12px rgba(0,0,0,.42);
}
@media (max-width: 900px) {
  .village-screen .map-layout { grid-template-columns: minmax(0,1fr) 250px; }
}
@media (max-width: 700px) {
  .village-screen .map-layout { grid-template-columns: 1fr; }
  .village-screen .location-choice-panel { min-height: 0; }
}

/* Specificity guard: keep the v32 location panel dark despite legacy village palette overrides. */
body:has(.village-screen) .village-screen .map-detail.location-choice-panel {
  display: flex !important;
  flex-direction: column;
  background: #2f2a20 !important;
  border-color: #9e8962 !important;
  color: #f5eddc !important;
}
body:has(.village-screen) .village-screen .map-detail.location-choice-panel h2 {
  color: #fff7e8 !important;
}
body:has(.village-screen) .village-screen .map-detail.location-choice-panel .location-choice-copy p {
  color: #d4cbb9 !important;
}


/* v33 — boutique intégrée au panneau de lieu: aucun changement d'écran pour acheter. */
.village-shop-inline {
  display: flex;
  min-height: 0;
  flex: 1 1 auto;
  flex-direction: column;
  padding: 10px 12px 12px;
  border-top: 1px solid rgba(231,210,166,.13);
}
.village-shop-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 8px;
  color: #ead8b5;
  font-size: 11px;
  font-weight: 850;
}
.village-shop-toolbar .village-shop-back {
  min-height: 30px;
  padding: 6px 8px;
  font-size: 10px;
}
.village-shop-inline h3 {
  margin: 0 0 8px;
  color: var(--text-primary);
  font-size: 14px;
}
.village-shop-stock {
  display: grid;
  min-height: 0;
  gap: 7px;
  overflow-y: auto;
  padding-right: 2px;
}
.village-shop-item {
  padding: 9px;
  border: 1px solid rgba(231,210,166,.22);
  border-radius: 5px;
  background: rgba(255,255,255,.055);
}
.village-shop-item-head {
  display: flex;
  align-items: center;
  gap: 8px;
}
.village-shop-icon {
  display: grid;
  width: 38px;
  height: 38px;
  flex: 0 0 38px;
  place-items: center;
  border-radius: 50%;
  background: rgba(0,0,0,.22);
  font-size: 17px;
}
.village-shop-item strong { display: block; color: var(--text-primary); font-size: 11px; line-height: 1.2; }
.village-shop-item small { display: block; margin-top: 2px; color: var(--text-secondary); font-size: 9px; }
.village-shop-item p { margin: 7px 0; color: var(--text-secondary); font-size: 9px; line-height: 1.35; }
.village-shop-buttons { display: flex; gap: 6px; }
.village-shop-buttons button { min-height: 30px; flex: 1 1 auto; padding: 6px 8px; font-size: 10px; }
.shop-category-actions { margin-top: 0; }

/* v34 — déplacement libre et rapide du petit ninja sur la carte */
.ninja-marker.traveling {
  left: var(--ninja-to-x);
  top: var(--ninja-to-y);
  animation: ninja-map-run var(--ninja-travel-ms, 520ms) cubic-bezier(.22,.78,.28,1) both;
  pointer-events: none;
  z-index: 14;
}
.ninja-marker.traveling span {
  animation: ninja-run-bounce .14s ease-in-out infinite alternate;
  filter: drop-shadow(0 5px 5px rgba(0,0,0,.46));
}
@keyframes ninja-map-run {
  from { left: var(--ninja-from-x); top: var(--ninja-from-y); }
  to { left: var(--ninja-to-x); top: var(--ninja-to-y); }
}
@keyframes ninja-run-bounce {
  from { transform: translateY(2px) rotate(-9deg) scale(1); }
  to { transform: translateY(-5px) rotate(9deg) scale(1.08); }
}

/* v36 — boutique dédiée plus compacte et plus proche du thème principal */
body:has(.shop-category-screen) {
  background: var(--bg-page);
  color: var(--text-primary);
}
.shop-category-screen {
  width: min(1240px, calc(100% - 24px));
  padding: 10px 0 24px;
}
.compact-shop-shell { display: grid; gap: 10px; }
.shop-page-header,
.shop-theme-sidebar,
.shop-theme-main,
.shop-inline-message,
.shop-merchant-strip {
  color: var(--text-primary);
  background: var(--bg-panel);
  border: 1px solid var(--border-primary);
  border-radius: 8px;
  box-shadow: 0 5px 14px rgba(76,54,25,.10);
}
.shop-page-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 10px 14px;
}
.shop-page-heading h2 {
  margin: 2px 0 2px;
  color: var(--text-primary);
  font-size: 24px;
}
.shop-page-heading p {
  margin: 0;
  color: var(--text-secondary);
  font-size: 12px;
}
.shop-category-screen .eyebrow { color: var(--text-secondary); letter-spacing: .12em; }
.shop-category-screen button {
  color: var(--button-primary-text);
  background: linear-gradient(180deg, var(--button-primary-bg), var(--button-primary-hover));
  border: 1px solid var(--button-primary-border);
  border-radius: 6px;
  box-shadow: 0 2px 5px rgba(76,54,25,.14);
  padding: 9px 12px;
}
.shop-category-screen button.secondary {
  color: var(--button-secondary-text);
  background: var(--button-secondary-bg);
  border-color: var(--button-secondary-border);
}
.shop-category-screen button:disabled { opacity: .5; }
.shop-back-button { white-space: nowrap; }
.compact-shop-layout {
  display: grid;
  grid-template-columns: 220px minmax(0,1fr);
  gap: 12px;
  align-items: start;
}
.compact-shop-sidebar {
  padding: 12px;
  display: grid;
  gap: 10px;
}
.shop-sidebar-summary h3 {
  margin: 0 0 10px;
  color: var(--text-primary);
  text-align: center;
}
.shop-player-portrait {
  display: grid;
  place-items: center;
  padding: 5px;
  background: #d5d7cf;
  border-radius: 7px;
}
.shop-player-portrait .ninja-portrait {
  width: 164px;
  border: 0;
  border-radius: 4px;
  background: #d5d7cf;
  box-shadow: none;
}
.shop-purse {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  padding: 10px 0;
  border-top: 1px solid var(--border-soft);
  border-bottom: 1px solid var(--border-soft);
  color: var(--text-secondary);
  font-size: 12px;
}
.shop-purse strong { color: var(--text-primary); font-size: 14px; }
.shop-equipped { display: grid; gap: 5px; padding-top: 10px; color: var(--text-secondary); font-size: 11px; }
.compact-shop-main { padding: 12px; min-width: 0; display: grid; gap: 10px; }
.shop-inline-message {
  padding: 10px 14px;
  color: var(--text-secondary);
  background: var(--bg-card);
}
.shop-merchant-strip {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 12px;
  background: var(--bg-panel-alt);
}
.shop-merchant-avatar {
  width: 46px;
  height: 46px;
  border-radius: 8px;
  display: grid;
  place-items: center;
  font-size: 24px;
  background: var(--bg-input);
  border: 1px solid #b99d6b;
  flex: 0 0 auto;
}
.shop-merchant-copy strong { display: block; color: var(--text-primary); }
.shop-merchant-copy p { margin: 2px 0 0; color: var(--text-secondary); font-size: 12px; }
.compact-shop-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--border-soft);
}
.compact-shop-heading h3 { margin: 2px 0 0; color: var(--text-primary); font-size: 20px; }
.shop-stock-count {
  display: inline-flex;
  padding: 6px 9px;
  border-radius: 99px;
  background: var(--bg-panel-alt);
  border: 1px solid var(--border-soft);
  color: var(--text-secondary);
  font-size: 11px;
  font-weight: 800;
}
.shop-list {
  display: grid;
  gap: 10px;
}
.shop-list-row {
  display: grid;
  grid-template-columns: minmax(0,1fr) 140px;
  gap: 12px;
  align-items: center;
  border-radius: 7px;
  padding: 12px;
  background: var(--bg-card);
  border: 1px solid var(--border-soft);
  box-shadow: 0 2px 6px rgba(76,54,25,.07);
}
.shop-list-row.equipped {
  background: #f3f4df;
  border-color: #9eae73;
}
.shop-list-main { min-width: 0; }
.shop-list-main .item-top { margin-bottom: 8px; }
.shop-category-screen .item-icon {
  width: 44px;
  height: 44px;
  border-radius: 6px;
  background: var(--bg-input);
  border-color: var(--border-soft);
}
.shop-category-screen .small,
.shop-category-screen .shop-item-desc { color: var(--text-secondary); }
.shop-category-screen .shop-item-desc {
  margin: 0 0 9px;
  font-size: 12px;
  line-height: 1.45;
}
.shop-category-screen .stat-chip {
  color: var(--text-secondary);
  background: var(--bg-panel-alt);
  border: 1px solid var(--border-soft);
}
.shop-list-side {
  display: grid;
  gap: 8px;
  align-content: center;
}
.shop-price-tag {
  text-align: center;
  font-weight: 800;
  color: #4c3c22;
  padding: 8px 10px;
  background: #f1e7ce;
  border: 1px solid var(--border-soft);
  border-radius: 6px;
}
.shop-list-side button { width: 100%; }
@media (max-width: 820px) {
  .compact-shop-layout { grid-template-columns: 180px minmax(0,1fr); }
  .shop-player-portrait .ninja-portrait { width: 145px; }
  .shop-list-row { grid-template-columns: 1fr; }
  .shop-list-side { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .shop-price-tag { grid-column: 1 / -1; }
}
@media (max-width: 650px) {
  .shop-page-header { display: grid; }
  .compact-shop-layout { grid-template-columns: 1fr; }
  .compact-shop-sidebar {
    grid-template-columns: 120px minmax(0,1fr);
    column-gap: 12px;
    align-items: center;
  }
  .shop-player-portrait { grid-row: 1 / span 3; }
  .shop-player-portrait .ninja-portrait { width: 105px; }
  .shop-sidebar-summary h3 { text-align: left; margin: 0 0 10px; }
  .shop-list-side { grid-template-columns: 1fr; }
}

/* v40 — panneau de lieu: garder les actions en haut, juste sous la description. */

.location-choice-status { display:none !important; }

/* v40.1 — panneau de lieu simplifié : sans texte inutile ni logos de pastilles. */

/* v40.3 — Hôpital */
.location-choice-hero.hospital {
  background: linear-gradient(180deg, rgba(8,10,9,.08), rgba(8,10,9,.86)), linear-gradient(135deg, #53636a, #2d3231 55%, #191b19);
}
.location-choice-hero.baths {
  background: linear-gradient(180deg, rgba(8,10,9,.08), rgba(8,10,9,.86)), linear-gradient(135deg, #4a6f71, #28393a 55%, #161a1a);
}
.cosmetic-screen .creator-preview-card h3 {
  margin: 8px 0 12px;
  text-align: center;
}


/* v40.6 — PNJ dans chaque commerce */
.shop-npc-card {
  display: grid;
  grid-template-columns: 62px minmax(0,1fr);
  gap: 12px;
  align-items: start;
  padding: 10px 12px;
  background: var(--bg-panel-alt);
  border: 1px solid var(--border-primary);
  border-radius: 8px;
  box-shadow: 0 5px 14px rgba(76,54,25,.10);
}
.shop-npc-portrait {
  width: 56px;
  height: 56px;
  border-radius: 8px;
  display: grid;
  place-items: center;
  font-size: 28px;
  background: var(--bg-input);
  border: 1px solid #b99d6b;
}
.shop-npc-content {
  display: grid;
  gap: 8px;
  min-width: 0;
}
.shop-npc-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
}
.shop-npc-header strong {
  color: var(--text-primary);
  font-size: 16px;
}
.shop-npc-bubble {
  padding: 10px 12px;
  background: var(--bg-card);
  border: 1px solid var(--border-primary);
  border-radius: 7px;
  color: var(--text-primary);
  font-size: 12px;
  line-height: 1.45;
}
.shop-npc-toggle,
.shop-npc-exit {
  justify-self: start;
  padding: 7px 10px !important;
}
.shop-npc-exit { white-space: nowrap; }
@media (max-width: 650px) {
  .shop-npc-card { grid-template-columns: 1fr; }
  .shop-npc-portrait { width: 52px; height: 52px; }
  .shop-npc-header { flex-wrap: wrap; }
}


/* v40.8 — boutiques style plus proche des références */
.legacy-shop-screen .legacy-shop-shell {
  display: grid;
  gap: 12px;
}
.legacy-shop-screen .legacy-shop-notice {
  padding: 12px 16px;
  font-size: 13px;
}
.legacy-shop-screen .legacy-shop-npc-wrap,
.legacy-shop-screen .legacy-shop-stock-card {
  padding: 14px 16px;
}
.legacy-shop-screen .shop-npc-card {
  grid-template-columns: 56px minmax(0, 1fr);
  gap: 12px;
  padding: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
}
.legacy-shop-screen .shop-npc-portrait {
  width: 48px;
  height: 48px;
  border-radius: 6px;
  font-size: 24px;
  background: #efe6d1;
}
.legacy-shop-screen .shop-npc-content { gap: 7px; }
.legacy-shop-screen .shop-npc-header strong {
  font-size: 14px;
  color: var(--text-primary);
}
.legacy-shop-screen .shop-npc-bubble {
  font-size: 12px;
  line-height: 1.45;
  background: var(--bg-card);
}
.legacy-shop-screen .shop-npc-toggle,
.legacy-shop-screen .shop-npc-exit {
  padding: 7px 11px !important;
  font-size: 12px;
}
.legacy-shop-stock-card h3 {
  margin: 0 0 10px;
  font-size: 15px;
  color: var(--text-primary);
}
.legacy-shop-list {
  display: grid;
  gap: 8px;
}
.legacy-shop-row {
  display: grid;
  grid-template-columns: minmax(0, 1.6fr) minmax(150px, .8fr) 108px;
  gap: 12px;
  align-items: start;
  padding: 6px 0;
  border-top: 1px solid rgba(102, 79, 43, .12);
}
.legacy-shop-row:first-child { border-top: 0; }
.legacy-shop-item-top {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr);
  gap: 8px;
  align-items: start;
}
.legacy-shop-icon {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 20px;
  height: 20px;
  font-size: 18px;
  line-height: 1;
}
.legacy-shop-row-main strong {
  display: block;
  margin-bottom: 2px;
  color: var(--text-primary);
  font-size: 14px;
}
.legacy-shop-desc {
  margin: 0;
  color: var(--text-secondary);
  font-size: 12px;
  line-height: 1.33;
}
.legacy-shop-owned {
  margin-top: 3px;
  color: var(--text-muted);
  font-size: 11px;
}
.legacy-shop-stats {
  color: var(--text-primary);
  font-size: 12px;
  line-height: 1.3;
  white-space: pre-line;
}
.legacy-shop-buy {
  display: grid;
  gap: 6px;
  justify-items: stretch;
}
.legacy-shop-buy button {
  width: 100%;
  padding: 8px 8px !important;
  font-size: 12px;
  line-height: 1.15;
}
.legacy-shop-buy button small {
  display: block;
  margin-top: 2px;
  font-size: 11px;
  color: inherit;
  opacity: .85;
}
.legacy-equip-btn { font-size: 11px; }
@media (max-width: 880px) {
  .legacy-shop-row {
    grid-template-columns: 1fr;
    gap: 8px;
  }
  .legacy-shop-buy {
    grid-template-columns: repeat(auto-fit, minmax(110px, 1fr));
  }
}

/* v40.9 — correction palette des boutiques legacy : revenir au beige/parchemin. */
body:has(.legacy-shop-screen) {
  background: var(--bg-page) !important;
  color: var(--text-primary) !important;
}
body:has(.legacy-shop-screen) .legacy-shop-screen {
  color: var(--text-primary) !important;
}
body:has(.legacy-shop-screen) .legacy-shop-screen .card,
body:has(.legacy-shop-screen) .legacy-shop-screen .legacy-shop-notice,
body:has(.legacy-shop-screen) .legacy-shop-screen .legacy-shop-npc-wrap,
body:has(.legacy-shop-screen) .legacy-shop-screen .legacy-shop-stock-card {
  background: var(--bg-panel) !important;
  color: var(--text-primary) !important;
  border-color: var(--border-primary) !important;
  box-shadow: 0 5px 14px rgba(76,54,25,.10) !important;
}
body:has(.legacy-shop-screen) .legacy-shop-screen .message-card {
  background: var(--bg-card) !important;
  color: var(--text-secondary) !important;
  border-color: var(--border-primary) !important;
}
body:has(.legacy-shop-screen) .legacy-shop-screen .shop-npc-card {
  color: var(--text-primary) !important;
}
body:has(.legacy-shop-screen) .legacy-shop-screen .shop-npc-header strong,
body:has(.legacy-shop-screen) .legacy-shop-screen .legacy-shop-stock-card h3,
body:has(.legacy-shop-screen) .legacy-shop-screen .legacy-shop-row-main strong,
body:has(.legacy-shop-screen) .legacy-shop-screen .legacy-shop-desc,
body:has(.legacy-shop-screen) .legacy-shop-screen .legacy-shop-stats {
  color: var(--text-primary) !important;
}
body:has(.legacy-shop-screen) .legacy-shop-screen button {
  color: var(--button-primary-text) !important;
  background: var(--button-primary-bg) !important;
  border: 1px solid var(--button-primary-border) !important;
  border-radius: 5px !important;
  box-shadow: none !important;
}
body:has(.legacy-shop-screen) .legacy-shop-screen button.village-profile-portrait-btn,
:is(.build-screen, .inventory-screen, .missions-journal-screen, .legacy-shop-screen, .academy-combat-prep-screen) button.village-profile-portrait-btn {
  width: auto !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 4px !important;
  box-shadow: none !important;
  color: inherit !important;
}
body:has(.legacy-shop-screen) .legacy-shop-screen button.village-profile-portrait-btn:hover:not(:disabled),
:is(.build-screen, .inventory-screen, .missions-journal-screen, .legacy-shop-screen, .academy-combat-prep-screen) button.village-profile-portrait-btn:hover:not(:disabled) {
  background: transparent !important;
  border: 0 !important;
}
body:has(.legacy-shop-screen) .legacy-shop-screen button:hover:not(:disabled) {
  background: var(--button-primary-hover) !important;
  border-color: var(--accent) !important;
}
body:has(.legacy-shop-screen) .legacy-shop-screen button.secondary {
  color: var(--button-secondary-text) !important;
  background: var(--button-secondary-bg) !important;
  border-color: var(--button-secondary-border) !important;
}
body:has(.legacy-shop-screen) .legacy-shop-screen .shop-npc-bubble {
  background: var(--bg-card) !important;
  color: var(--text-primary) !important;
  border-color: var(--border-primary) !important;
}
body:has(.legacy-shop-screen) .legacy-shop-screen .legacy-shop-row {
  border-color: rgba(102,79,43,.16) !important;
}


/* v41 — ligne niveau conseillé dans les shops */
.legacy-shop-level {
  margin-top: 3px;
  color: var(--text-muted);
  font-size: 11px;
  font-style: italic;
}


/* v41.4 — garder le profil joueur et le rail droit dans les shops */
.shop-three-column {
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr) 190px;
  gap: 12px;
  align-items: start;
}
.shop-main-column { min-width: 0; }
.shop-side-rail {
  display: grid;
  gap: 12px;
}
.shop-side-card {
  padding: 12px;
  color: var(--text-primary);
  background: var(--bg-panel);
  border: 1px solid var(--border-primary);
  border-radius: 8px;
  box-shadow: 0 5px 14px rgba(76,54,25,.12);
}
.shop-side-card h3 {
  margin: 0 0 10px;
  font-size: 14px;
  color: var(--text-primary);
}
.shop-side-body {
  min-height: 42px;
  border-radius: 8px;
  background: var(--bg-panel-alt);
  padding: 10px;
  color: var(--text-secondary);
  margin-bottom: 10px;
}
.shop-side-body.empty { min-height: 34px; }
.shop-mission-summary strong {
  display: block;
  margin-bottom: 5px;
  color: var(--text-primary);
  font-size: 13px;
}
.shop-mission-summary p {
  margin: 0 0 8px;
  color: var(--text-secondary);
  font-size: 11px;
  line-height: 1.35;
}
.shop-mission-summary.is-empty p {
  margin: 0;
}
.shop-mission-meta {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  margin: 0 0 8px;
  font-size: 11px;
}
.shop-mission-progress {
  color: var(--text-secondary);
  line-height: 1.25;
}
.shop-mission-state {
  flex: 0 0 auto;
  padding: 2px 7px;
  border-radius: 999px;
  background: #d49261;
  color: #fff;
  font-weight: 700;
  font-size: 10px;
  text-transform: uppercase;
}
.shop-side-button {
  width: 100%;
  padding: 9px 12px !important;
  font-size: 12px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}
.shop-side-link-icon {
  font-style: normal;
  color: var(--text-primary);
  font-size: 13px;
  line-height: 1;
}
.shop-pass-box {
  display: grid;
  grid-template-columns: 40px 1fr 44px;
  gap: 10px;
  align-items: center;
  border-radius: 10px;
  background: var(--bg-panel-alt);
  padding: 10px 12px;
}
.shop-pass-icon {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 36px;
  height: 36px;
  font-size: 24px;
}
.shop-pass-box strong {
  color: #111;
  font-size: 15px;
}
.shop-pass-tier {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  min-height: 34px;
  border-radius: 10px;
  background: var(--button-secondary-bg);
  color: #272117;
  font-weight: 700;
}

/* v41.9 — journal de mission beige + accès rapide */
.missions-journal-screen .shop-main-column {
  display: grid;
  gap: 12px;
}
.mission-summary-card,
.mission-journal-current,
.mission-available-card {
  padding: 14px;
  color: var(--text-primary);
  background: var(--bg-panel);
  border: 1px solid var(--border-primary);
  border-radius: 8px;
  box-shadow: 0 5px 14px rgba(76,54,25,.10);
}
.mission-summary-head h2,
.mission-summary-head h3,
.mission-journal-header h3 {
  margin: 0;
  color: #342c21;
}
.mission-summary-head p,
.mission-journal-header p {
  margin: 6px 0 0;
  color: #655842;
  font-size: 12px;
  line-height: 1.45;
}
.mission-rank-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px 16px;
  margin-top: 14px;
}
.mission-rank-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 4px 0;
  font-size: 13px;
  border-bottom: 1px solid #e0d2b2;
}
.mission-rank-row strong {
  color: #3a3225;
}
.mission-journal-current.empty-state {
  text-align: center;
}
.mission-journal-current.empty-state p {
  margin: 8px auto 0;
  max-width: 520px;
}
.mission-journal-progress {
  margin: 14px 0 0;
  text-align: center;
  font-weight: 700;
  color: #7d6744;
}
.mission-step-list {
  display: grid;
  gap: 8px;
  margin-top: 12px;
}
.mission-step-row {
  display: grid;
  grid-template-columns: 30px 1fr auto;
  gap: 10px;
  align-items: center;
  padding: 10px 12px;
  border-radius: 6px;
  border: 1px solid #d9caab;
  background: var(--bg-panel);
}
.mission-step-row.active {
  border-color: #d28a62;
  background: #fff7ef;
}
.mission-step-row.done {
  opacity: .72;
  background: #f1ece1;
}
.mission-step-index {
  display: grid;
  place-items: center;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: #c88458;
  color: #fff;
  font-size: 12px;
  font-weight: 700;
}
.mission-step-copy {
  display: grid;
  gap: 3px;
}
.mission-step-copy strong {
  color: #5d5448;
  font-size: 12px;
  font-style: italic;
  font-weight: 500;
}
.mission-step-copy span {
  color: #4f4432;
}
.mission-step-status {
  padding: 3px 8px;
  border-radius: 999px;
  background: #efe4cf;
  color: #7c6a4e;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
}
.mission-step-row.active .mission-step-status {
  background: #cb885b;
  color: #fff;
}
.mission-rewards-block {
  margin-top: 16px;
  padding: 16px;
  border: 1px solid #d6c099;
  border-radius: 8px;
  background: #f8f1e2;
}
.mission-rewards-title {
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: #7d6845;
}
.mission-reward-list {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 12px;
}
.mission-reward-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px 12px;
  border-radius: 999px;
  border: 1px solid #d1bb94;
  background: var(--bg-card);
  color: #6c5832;
  font-size: 13px;
}
.mission-reward-pill b {
  color: #dd6f2c;
}
.mission-journal-actions {
  justify-content: center;
  margin-top: 16px;
}
.mission-journal-actions .secondary {
  min-width: 240px;
}
.mission-available-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
  margin-top: 12px;
}
.mission-contract-card {
  padding: 13px;
  border-radius: 8px;
  border: 1px solid #d6c5a0;
  background: var(--bg-panel);
  color: #2f2b24;
}
.mission-contract-card.hard {
  border-color: #d79a8a;
  background: #fff5f2;
}
.mission-contract-head {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 10px;
  align-items: center;
  margin-bottom: 8px;
}
.mission-contract-card .item-icon {
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border-radius: 8px;
  background: #efe1bf;
}
.mission-contract-card p {
  margin: 0;
  color: #5d5341;
  line-height: 1.4;
}
.mission-contract-card .badges {
  gap: 8px;
  margin-top: 10px;
}
.mission-contract-card .badge {
  color: #5b4f3b;
  background: var(--bg-panel-alt);
  border-color: #cbb891;
}
.mission-contract-card .actions {
  margin-top: 12px;
  justify-content: flex-end;
}
.empty-state-inline {
  padding: 12px;
  border-radius: 8px;
  text-align: center;
  border: 1px dashed #cfbb92;
  color: #6b5d46;
  background: var(--bg-panel);
}
@media (max-width: 900px) {
  .mission-rank-grid {
    grid-template-columns: 1fr;
  }
  .mission-step-row {
    grid-template-columns: 26px 1fr;
  }
  .mission-step-status {
    grid-column: 2;
    justify-self: start;
  }
}
.legacy-shop-screen .message-card,
.legacy-shop-screen .market-intro,
.legacy-shop-screen .shop-sell-card,
.legacy-shop-screen .legacy-shop-notice,
.legacy-shop-screen .legacy-shop-npc-wrap,
.legacy-shop-screen .legacy-shop-stock-card {
  color: var(--text-primary);
  background: var(--bg-panel);
  border: 1px solid var(--border-primary);
  border-radius: 8px;
  box-shadow: 0 5px 14px rgba(76,54,25,.10);
}
@media (max-width: 1100px) {
  .shop-three-column {
    grid-template-columns: 220px minmax(0, 1fr);
  }
  .shop-side-rail {
    grid-column: 1 / -1;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 700px) {
  .shop-three-column {
    grid-template-columns: 1fr;
  }
  .shop-side-rail,
  .village-profile-rail {
    grid-template-columns: 1fr;
  }
}


/* v41.6 — inventaire style Shinobi-like */
.inventory-screen .shop-main-column {
  min-width: 0;
}
.inventory-note-card,
.inventory-browser-card {
  color: var(--text-primary);
  background: var(--bg-panel);
  border: 1px solid var(--border-primary);
  border-radius: 8px;
  box-shadow: 0 5px 14px rgba(76,54,25,.10);
}
.inventory-note-card {
  padding: 11px 14px;
}
.inventory-browser-card {
  padding: 0;
  overflow: hidden;
}
.inventory-toolbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding: 14px 14px 10px;
  border-bottom: 1px solid #d6c5a0;
  flex-wrap: wrap;
}
.inventory-tabs {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}
.inventory-tabs .secondary {
  border: 0;
  background: transparent;
  color: #ad6b00;
  font-weight: 700;
  padding: 8px 12px;
  box-shadow: none;
}
.inventory-tabs .secondary.active-tab {
  background: var(--bg-input);
  color: #34281c;
  border-radius: 12px;
}
.inventory-sort-wrap {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  color: #4a3e2c;
}
.inventory-sort-wrap select {
  min-width: 140px;
  padding: 6px 10px;
  border-radius: 10px;
  border: 1px solid #afaa9d;
  background: #f4f1e7;
  color: #2b261d;
  font-weight: 600;
}
.inventory-legacy-list {
  padding: 10px 12px 12px;
}
.inventory-legacy-row {
  display: grid;
  grid-template-columns: minmax(280px, 1.4fr) minmax(130px, .55fr) 90px 90px 110px;
  gap: 10px;
  align-items: center;
  padding: 10px 6px;
  border-left: 4px solid #ec962c;
  border-bottom: 1px solid #e0d0ac;
}
.inventory-legacy-row:last-child {
  border-bottom: 0;
}
.inventory-legacy-main {
  display: flex;
  gap: 12px;
  align-items: flex-start;
}
.inventory-legacy-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 34px;
  font-size: 24px;
  line-height: 1;
  padding-top: 2px;
}
.inventory-legacy-copy strong {
  color: #322515;
  font-size: 15px;
}
.inventory-legacy-title {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 2px;
}
.inventory-qty {
  color: #6d5635;
  font-weight: 700;
}
.inventory-legacy-desc {
  color: #2f271f;
  font-size: 12px;
  line-height: 1.35;
}
.inventory-legacy-effect {
  color: #7b4e00;
  font-size: 13px;
  line-height: 1.25;
}
.inventory-legacy-kind {
  color: #c5790d;
  font-size: 11px;
}
.inventory-legacy-sell {
  display: flex;
  flex-direction: column;
  color: #c0b09a;
  font-size: 11px;
  line-height: 1.1;
}
.inventory-legacy-sell span {
  color: #cabba6;
}
.inventory-legacy-sell small {
  color: #a69279;
}
.inventory-legacy-actions {
  display: flex;
  justify-content: flex-end;
}
.inventory-legacy-actions button {
  min-width: 96px;
}
.inventory-empty {
  padding: 22px 16px 28px;
  text-align: center;
  color: #4f3621;
  font-style: italic;
}
@media (max-width: 980px) {
  .inventory-legacy-row {
    grid-template-columns: 1fr;
    gap: 6px;
  }
  .inventory-legacy-actions {
    justify-content: flex-start;
  }
}


/* v42 — missions remises à zéro + journal entièrement beige */
body:has(.missions-reset-screen) {
  background: var(--bg-page) !important;
  color: var(--text-primary) !important;
}
body:has(.missions-reset-screen) .game-header,
body:has(.missions-reset-screen) .game-nav,
body:has(.missions-reset-screen) header {
  background: #eadfc4 !important;
  color: #342d22 !important;
  border-color: var(--border-primary) !important;
  box-shadow: 0 3px 10px rgba(76,54,25,.12) !important;
}
body:has(.missions-reset-screen) .game-header *,
body:has(.missions-reset-screen) .game-nav *,
body:has(.missions-reset-screen) header * {
  color: #342d22 !important;
}
.missions-reset-screen,
.missions-reset-screen .shop-three-column,
.missions-reset-screen .shop-main-column {
  background: transparent !important;
  color: var(--text-primary) !important;
}
.missions-reset-screen .card,
.missions-reset-screen .mission-summary-card,
.missions-reset-screen .mission-journal-current,
.missions-reset-screen .shop-side-card,
.missions-reset-screen .shop-side-body,
.missions-reset-screen .shop-pass-box {
  background: var(--bg-panel) !important;
  color: var(--text-primary) !important;
  border-color: var(--border-primary) !important;
}
.mission-reset-notice {
  margin-top: 14px;
  padding: 18px;
  border-radius: 8px;
  border: 1px dashed #c3ad83;
  background: var(--bg-panel);
  color: #6a5a41;
  text-align: center;
  font-style: italic;
}
.missions-reset-screen .mission-journal-current.empty-state {
  min-height: 160px;
  display: grid;
  place-content: center;
}
.missions-reset-screen .mission-journal-current.empty-state h3 {
  color: #3a3023;
}
.missions-reset-screen .mission-journal-current.empty-state p {
  color: #6d5d45;
}


/* v42.1 — page Builds inspirée de la référence */
.build-screen {
  padding: 16px 20px 28px;
}
.build-shell {
  display: grid;
  gap: 12px;
}
.build-topbar {
  background: #f2ead6;
  border: 1px solid var(--border-primary);
  border-radius: 8px;
  padding: 6px;
}
.build-slot-tabs {
  display: flex;
  align-items: center;
  gap: 6px;
}
.build-slot-tab,
.build-slot-icon {
  min-width: 38px;
  height: 34px;
  border-radius: 8px;
  border: 1px solid #d6c29a;
  background: #f7f1e3;
  color: #57452f;
  font-weight: 700;
}
.build-slot-tab.active {
  background: #fff;
  border-color: #b39254;
  box-shadow: inset 0 0 0 2px rgba(191,146,62,.18);
}
.build-slot-icon { opacity: .72; }
.build-layout {
  display: grid;
  grid-template-columns: 370px minmax(0, 1fr);
  gap: 12px;
  align-items: start;
}
.build-left-panel,
.build-right-panel {
  background: #f5eedc !important;
  border: 1px solid #c7b089 !important;
  border-radius: 10px;
  box-shadow: 0 4px 14px rgba(69,48,20,.10);
}
.build-left-panel { padding: 14px; }
.build-primary-stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  margin-bottom: 12px;
}
.build-primary-stats div {
  padding-bottom: 10px;
  border-bottom: 3px solid #e6dbc5;
}
.build-primary-stats span {
  display: block;
  font-size: 12px;
  font-weight: 800;
  color: #b86c39;
}
.build-primary-stats strong {
  font-size: 24px;
  color: #d95e24;
}
.build-primary-stats div:nth-child(2) span,
.build-primary-stats div:nth-child(2) strong { color: #4f68cf; }
.build-primary-stats div:nth-child(3) span,
.build-primary-stats div:nth-child(3) strong { color: #8f71cf; }
.build-badge-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 14px;
  padding: 10px 12px;
  border-radius: 10px;
  background: #efe4ce;
  border: 1px solid #dac5a0;
}
.build-main-badge {
  font-weight: 700;
  color: #6e5632;
}
.build-badge-row small { color: #8d744d; font-weight: 700; }
.build-badge-row { cursor: help; }
.build-equip-row {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 14px;
  border-radius: 12px;
  border: 2px solid #f08b4c;
  background: #f9efdf;
  color: #7f5b38;
  margin-bottom: 12px;
}
.build-equip-row strong { color: #f07a2f; text-transform: lowercase; }
.build-gear-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin-bottom: 14px;
}
.build-gear-card {
  min-height: 70px;
  border-radius: 12px;
  border: 1px solid #cab18a;
  background: var(--bg-input);
  padding: 10px;
  display: grid;
  gap: 6px;
  justify-items: start;
  color: #453625;
}
.build-gear-card span { font-size: 22px; }
.build-gear-card strong { font-size: 14px; }
.build-gear-card.faded { opacity: .75; }
.build-gear-card.dashed {
  border-style: dashed;
  color: #bca98a;
}
.build-gear-card.locked-slot {
  background: #f4f1ea;
  border: 1px dashed #d8cfbf;
  color: #cec2af;
  justify-items: center;
  text-align: center;
  cursor: default;
}
.build-gear-card.locked-slot strong {
  color: #cec2af;
}
.build-tech-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin-bottom: 14px;
}
.build-card-tile {
  min-height: 120px;
  border-radius: 12px;
  overflow: hidden;
  background: linear-gradient(180deg, #3f4b78 0%, #121a2e 100%);
  color: #fff;
  padding: 8px;
  display: grid;
  align-content: start;
  justify-items: start;
  border: 2px solid rgba(255,255,255,.12);
}
.build-card-tile:nth-child(2n) {
  background: linear-gradient(180deg, #756611 0%, #171d28 100%);
}
.build-card-tile .build-card-art { font-size: 26px; margin-bottom: 18px; }
.build-card-name { font-weight: 800; line-height: 1.05; }
.build-card-cost { font-size: 11px; opacity: .85; margin-top: auto; }
.build-card-tile.empty {
  background: #f2eee6;
  color: #b9ae9d;
  border: 2px dashed #ddd1bf;
  place-items: center;
}
.build-section-link {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 12px 14px;
  border-radius: 12px;
  background: var(--bg-input);
  border: 1px solid #cab18a;
  color: #4f3c27;
  font-weight: 700;
}
.build-right-panel { padding: 0; }
.build-tabs {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 12px 16px;
  border-bottom: 1px solid var(--border-soft);
  overflow-x: auto;
}
.build-tab {
  background: none;
  border: 0;
  color: #8e7f6a;
  font-weight: 700;
  padding: 0;
}
.build-tab.active { color: #f1a03c; }
.build-close {
  margin-left: auto;
  background: none;
  border: 0;
  color: #b5a28b;
  font-size: 28px;
  line-height: 1;
}
.build-options-list {
  display: grid;
  gap: 10px;
  padding: 14px;
}
.build-option-row {
  width: 100%;
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  text-align: left;
  padding: 14px 16px;
  border-radius: 14px;
  border: 1px solid #d9cab0;
  background: #f8f3e9;
  color: #453523;
}
.build-option-row.active {
  border-color: #f08b4c;
  box-shadow: inset 0 0 0 2px rgba(240,139,76,.16);
  background: #fff5e8;
}
.build-option-row.attitude .build-option-name {
  font-size: 30px;
  font-weight: 800;
  text-transform: lowercase;
}
.build-option-icon { font-size: 24px; }
.build-option-copy { display: grid; gap: 4px; }
.build-option-copy strong,
.build-option-name { font-size: 16px; color: #453523; }
.build-option-copy small { color: #7f705c; line-height: 1.35; }
.build-option-stats,
.build-option-meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
  color: #8a7b67;
  font-size: 12px;
  font-weight: 700;
}
.build-option-stats b:nth-child(1), .build-option-meta { color: #f06e2d; }
.build-option-stats b:nth-child(2) { color: #6c84da; }
.build-option-stats b:nth-child(3) { color: #997edf; }
.build-option-stats b:nth-child(4) { color: #4a9c53; }
.build-empty {
  padding: 16px;
  text-align: center;
  border-radius: 12px;
  border: 1px dashed #d0c0a4;
  color: #8a7b67;
  background: #fbf7ef;
}
@media (max-width: 980px) {
  .build-layout { grid-template-columns: 1fr; }
  .build-option-row { grid-template-columns: 34px 1fr; }
  .build-option-stats, .build-option-meta { grid-column: 2; }
}


/* v42.2 build page refinements */
.build-screen {
  padding: 18px 24px 34px;
}
.build-shell {
  max-width: 1180px;
  margin: 0 auto;
}
.build-topbar {
  position: sticky;
  top: 76px;
  z-index: 2;
}
.build-slot-tabs {
  gap: 10px;
}
.build-slot-tab,
.build-slot-icon {
  width: 30px;
  min-width: 30px;
  height: 38px;
  border-radius: 8px;
  font-size: 20px;
}
.build-slot-tab {
  font-size: 14px;
}
.build-layout {
  grid-template-columns: 376px minmax(0, 1fr);
  gap: 10px;
}
.build-left-panel {
  padding: 14px 16px;
}
.build-primary-stats {
  margin-bottom: 10px;
}
.build-primary-stats div {
  position: relative;
  border-bottom-width: 4px;
}
.build-primary-stats div::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -4px;
  height: 4px;
  background: currentColor;
  opacity: .55;
}
.build-badge-row {
  border-radius: 8px;
  padding: 8px 10px;
}
.build-equip-row {
  margin-bottom: 10px;
}
.build-equip-row span { display: flex; align-items: center; gap: 8px; }
.build-equip-row span small { color: #9c8d79; font-size: 14px; }
.build-equip-row em,
.build-section-link em {
  font-style: normal;
  color: #b3a089;
  font-size: 22px;
}
.build-gear-grid {
  margin-bottom: 10px;
}
.build-gear-card {
  min-height: 46px;
  grid-template-columns: 28px 1fr;
  align-items: center;
  gap: 10px;
}
.build-gear-card span { font-size: 22px; }
.build-gear-card.active {
  box-shadow: inset 3px 0 0 #ed6330;
  border-color: #b78d62;
}
.build-tech-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.build-tech-card {
  min-height: 132px;
  border-radius: 10px;
  padding: 6px;
  border: 2px solid #6f6571;
  display: grid;
  align-content: start;
  color: #fff;
  background: linear-gradient(180deg, rgba(121,111,171,.98), rgba(15,17,27,.98));
}
.build-tech-card.ninjutsu {
  background: linear-gradient(180deg, rgba(185,159,21,.98), rgba(17,24,31,.98));
  border-color: #8d7e20;
}
.build-tech-card.genjutsu {
  background: linear-gradient(180deg, rgba(64,141,92,.98), rgba(17,24,31,.98));
  border-color: #3f8555;
}
.build-tech-card-top,
.build-jutsu-card-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  font-size: 11px;
  font-weight: 700;
}
.build-tech-cost,
.build-jutsu-card-top span:last-child {
  background: rgba(255,255,255,.92);
  color: #4f64e0;
  padding: 1px 8px;
  border-radius: 999px;
}
.build-tech-card-body {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  min-height: 66px;
  padding: 8px 4px;
}
.build-tech-card-body strong,
.build-jutsu-card-name {
  font-size: 16px;
  line-height: 1.05;
}
.build-tech-card-foot,
.build-jutsu-card-bottom {
  margin-top: auto;
  font-size: 11px;
  text-align: center;
}
.build-tech-card.empty,
.build-tech-card.locked {
  background: #f5f1e8;
  color: #cfbfa7;
  border: 2px dashed #dfd4c4;
  place-items: center;
}
.build-tech-card-add {
  font-size: 18px;
}
.build-locked-icon { font-size: 24px; opacity: .65; }
.build-locked-level { font-size: 13px; }
.build-section-link {
  margin-top: 8px;
}
.build-content-area {
  padding: 14px;
}
.build-inline-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.build-inline-option {
  min-width: 240px;
  flex: 0 0 auto;
  min-height: 40px;
  display: grid;
  grid-template-columns: 28px 1fr auto;
  align-items: center;
  gap: 10px;
  border-radius: 10px;
  border: 1px solid #cdb89b;
  background: #fffdf9;
  padding: 10px 14px;
  text-align: left;
}
.build-inline-option.active {
  border-color: #ed8a2e;
  box-shadow: inset 0 0 0 1px #ed8a2e;
}
.build-inline-icon { font-size: 20px; color: #9d9a90; }
.build-inline-option strong { color: #211a14; }
.build-inline-option small { color: #4c65d2; font-weight: 700; }
.build-inline-empty-note {
  text-align: center;
  color: #aea18f;
  padding: 24px 0 4px;
}
.build-jutsu-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding-bottom: 12px;
  border-bottom: 1px solid #d8c8ab;
}
.build-jutsu-left {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.build-jutsu-counter {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 34px;
  padding: 0 12px;
  border-radius: 10px;
  background: #f2ecdf;
  border: 1px solid #d3c2a6;
  color: #584731;
  font-weight: 700;
}
.build-jutsu-search {
  width: 132px;
  height: 34px;
  border-radius: 8px;
  border: 1px solid #cdb89b;
  padding: 0 12px;
  background: var(--bg-input);
}
.build-jutsu-filters {
  display: flex;
  align-items: center;
  gap: 4px;
}
.build-jutsu-filters button,
.build-sort-label select,
.build-strategy-rule select,
.build-strategy-else select {
  height: 34px;
  border-radius: 8px;
  border: 1px solid #cdb89b;
  background: var(--bg-input);
  color: #57452f;
}
.build-jutsu-filters button {
  width: 34px;
  cursor: pointer;
  font-size: 15px;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.build-jutsu-filters button:hover,
.build-jutsu-filters button:focus-visible {
  border-color: #eb9338;
  box-shadow: inset 0 0 0 1px #eb9338;
  outline: none;
}
.build-sort-label {
  display: flex;
  align-items: center;
  gap: 8px;
  color: #6e5b43;
  font-weight: 700;
}
.build-sort-label select {
  min-width: 140px;
  padding: 0 10px;
}
.build-jutsu-selected-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(98px, 98px));
  gap: 14px;
  padding: 18px 4px 22px;
  align-items: start;
}
.build-jutsu-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(98px, 98px));
  gap: 12px;
  align-items: start;
}
.build-discover-title {
  text-align: center;
  color: #8e887b;
  font-weight: 800;
  letter-spacing: .08em;
  padding: 6px 0 14px;
}
.build-jutsu-card {
  min-height: 126px;
  border-radius: 10px;
  padding: 7px;
  border: 1px solid #958f8b;
  background: linear-gradient(180deg, rgba(133,126,173,.85), rgba(81,81,81,.9));
  color: #fff;
  display: grid;
  align-content: start;
  align-items: start;
  overflow: hidden;
}
.build-jutsu-card.ninjutsu {
  background: linear-gradient(180deg, rgba(191,181,135,.85), rgba(91,91,91,.9));
}
.build-jutsu-card.genjutsu {
  background: linear-gradient(180deg, rgba(170,189,154,.85), rgba(91,91,91,.9));
}
.build-jutsu-card.selected {
  opacity: 1;
  box-shadow: 0 2px 10px rgba(0,0,0,.18);
}
.build-jutsu-card.ghost {
  opacity: .35;
  filter: grayscale(.18);
}
.build-jutsu-card-name {
  padding: 18px 2px 6px;
  text-align: center;
  line-height: 1.1;
  font-weight: 800;
}
.build-strategy-shell {
  display: grid;
  gap: 14px;
}
.build-strategy-title {
  color: #6c5737;
  font-weight: 800;
}
.build-strategy-card {
  width: fit-content;
  min-width: 245px;
  display: grid;
  grid-template-columns: 52px 1fr 24px;
  align-items: center;
  gap: 10px;
  border-radius: 14px;
  border: 1px solid #c8aa7a;
  background: #f8efe2;
  padding: 10px 12px;
}
.build-strategy-icon {
  width: 40px;
  height: 40px;
  border-radius: 10px;
  display: grid;
  place-items: center;
  background: #de8c2d;
  color: #fff;
  font-size: 22px;
}
.build-strategy-copy strong { display: block; font-size: 18px; }
.build-strategy-copy small { color: #84725d; }
.build-strategy-plus {
  border: 0;
  background: none;
  color: #e08d2d;
  font-size: 28px;
}
.build-strategy-rules {
  display: grid;
  gap: 6px;
}
.build-strategy-rule {
  min-height: 36px;
  display: grid;
  grid-template-columns: 24px 16px minmax(220px, 270px) 1fr;
  align-items: center;
  gap: 8px;
  color: #8e806f;
  background: #f8f4eb;
  border-radius: 8px;
  padding: 4px 10px;
}
.build-strategy-rule.muted {
  opacity: .48;
}
.build-strategy-num {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: #e6dfcf;
  color: #5a4b38;
  font-size: 12px;
  font-weight: 800;
}
.build-strategy-else {
  display: flex;
  align-items: center;
  gap: 10px;
  padding-top: 10px;
  border-top: 1px dashed #ceb798;
  color: #8e806f;
}
@media (max-width: 1180px) {
  .build-shell { max-width: 100%; }
}
@media (max-width: 980px) {
  .build-layout { grid-template-columns: 1fr; }
  .build-topbar { top: 62px; }
  .build-jutsu-toolbar { flex-direction: column; align-items: stretch; }
  .build-sort-label { justify-content: space-between; }
}

.build-jutsu-selected-grid .build-empty,
.build-jutsu-grid .build-empty {
  grid-column: 1 / -1;
  min-height: 110px;
  display: grid;
  place-items: center;
  border: 1px dashed #d8c8ab;
  border-radius: 10px;
  color: #9f927f;
  background: #faf6ee;
}

.mission-board-column {
  display: grid;
  gap: 14px;
  align-content: start;
}
.mission-hq-card {
  max-width: 330px;
  background: #2b241f;
  border-color: #342b24;
  border-radius: 14px;
  padding: 12px;
  color: #fff;
}
.mission-hq-hero {
  height: 98px;
  border-radius: 10px;
  padding: 10px;
  display: flex;
  align-items: end;
  background: linear-gradient(135deg, rgba(132,98,62,.95), rgba(60,52,46,.95)), radial-gradient(circle at top right, rgba(255,220,158,.35), transparent 40%);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.08);
}
.mission-hq-pin {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-weight: 800;
  font-size: 12px;
  text-shadow: 0 1px 2px rgba(0,0,0,.55);
}
.mission-hq-list {
  display: grid;
  gap: 8px;
  margin-top: 12px;
}
.mission-hq-entry {
  width: 100%;
  justify-content: flex-start;
  text-align: left;
  min-height: 38px;
  padding: 8px 12px;
  border-radius: 4px;
  border: 1px solid #d7d7d7;
  background: #fff;
  color: #1e1d1c;
  box-shadow: none;
  font-weight: 500;
}
.mission-hq-entry:hover,
.mission-hq-entry:focus-visible {
  border-color: #f0bd58;
  background: var(--bg-card);
  outline: none;
}


/* v42.9 — Début Chikara / Académie */
.academy-intro-screen {
  min-height: 100vh;
  padding: 10px 34px 28px;
  background: #ccb58a;
  color: #2c261d;
}
.academy-intro-layout {
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr);
  gap: 12px;
  max-width: 1180px;
  margin: 0 auto;
}
.academy-intro-profile {
  display: grid;
  gap: 10px;
  align-content: start;
}
.academy-intro-profile-card,
.academy-intro-purse,
.academy-intro-log {
  background: #f5eed8 !important;
  border: 1px solid #bda77c !important;
  border-radius: 8px;
}
.academy-intro-profile-card { padding: 12px; }
.academy-intro-name { display: grid; gap: 2px; margin-bottom: 10px; }
.academy-intro-name strong { font-size: 14px; }
.academy-intro-name span { font-weight: 700; font-size: 12px; }
.academy-intro-name em { color: #df472d; font-style: normal; font-size: 12px; }
.academy-intro-avatar {
  width: 148px;
  height: 148px;
  margin: 0 auto 10px;
  overflow: hidden;
  border-radius: 8px;
  background: #d8d7d2;
}
.academy-intro-avatar .ninja-portrait { width: 100%; height: 100%; }
.academy-intro-resource,
.academy-intro-art {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 4px 8px;
  margin: 10px 0;
  font-size: 11px;
}
.academy-intro-resource i,
.academy-intro-art i {
  grid-column: 1 / -1;
  display: block;
  height: 10px;
  overflow: hidden;
  border-radius: 999px;
  background: #f2d4c6;
}
.academy-intro-resource i em,
.academy-intro-art i em {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: #db1e3c;
}
.academy-intro-resource i.pa em { background: #ffb51f; }
.academy-intro-resource i.hp em { background: #59c86d; }
.academy-intro-resource i.chakra em { background: #54a8ef; }
.academy-intro-resource i.xp em { background: #ff6b2b; }
.academy-intro-divider { height: 1px; background: #dfd0ae; margin: 14px 0; }
.academy-intro-purse { padding: 14px 12px; }
.academy-intro-purse > div { font-size: 11px; margin-bottom: 14px; }
.academy-intro-purse strong { font-size: 14px; }
.academy-intro-purse small { font-weight: 400; }
.academy-intro-main { min-width: 0; }
.academy-intro-log { padding: 11px 14px; margin-bottom: 10px; font-family: monospace; }
.academy-intro-stage {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 300px;
  gap: 12px;
}
.academy-intro-map {
  position: relative;
  min-height: 360px;
  border-radius: 10px;
  overflow: hidden;
  background:
    linear-gradient(rgba(72,66,48,.18),rgba(72,66,48,.25)),
    url("world-map.png") center/cover no-repeat,
    #59614d;
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.28);
  filter: saturate(.72) sepia(.10);
}
.academy-intro-map-label {
  position: absolute;
  top: 22px;
  right: 42px;
  padding: 8px 14px;
  background: #ffd51c;
  color: #17120b;
  font-weight: 900;
  border-radius: 4px;
  box-shadow: 0 2px 5px rgba(0,0,0,.25);
}
.academy-intro-gate-label {
  position: absolute;
  bottom: 18px;
  left: 58%;
  background: #181713;
  color: #fff;
  padding: 7px 10px;
  font-weight: 800;
}
.academy-intro-panel {
  min-height: 360px;
  border-radius: 12px;
  background: #2c261e;
  padding: 12px;
  color: #fff;
}
.academy-intro-panel-hero {
  min-height: 96px;
  display: flex;
  align-items: end;
  padding: 10px;
  border-radius: 8px;
  margin-bottom: 12px;
  background: linear-gradient(180deg, rgba(0,0,0,.08), rgba(0,0,0,.75)), linear-gradient(135deg,#85775b,#50483a);
  font-weight: 800;
}
.academy-intro-actions button {
  width: 100%;
  display: flex;
  justify-content: space-between;
  background: #fff;
  color: #282119;
}
.academy-intro-exams { display: grid; gap: 8px; }
.academy-intro-teacher {
  background: #f2ead8;
  color: #30271e;
  border-radius: 8px;
  padding: 10px;
}
.academy-intro-teacher p { margin: 5px 0 0; font-size: 12px; line-height: 1.35; }
.academy-exam-row {
  background: #f7f1e5;
  color: #30271e;
  border-radius: 8px;
  padding: 10px;
  display: grid;
  gap: 8px;
}
.academy-exam-row > div:first-child { display: grid; gap: 3px; }
.academy-exam-row span { font-size: 11px; color: #74644e; }
.academy-exam-row.passed { background: #e8f3dd; }
.academy-exam-buttons { display: flex; gap: 6px; }
.academy-exam-buttons button { flex: 1; font-size: 11px; padding: 7px 6px; }
.academy-pass { color: #367b3c !important; font-weight: 800; }
.academy-graduate {
  width: 100%;
  background: #f0a33f;
  color: #291d0d;
  font-weight: 900;
}

/* v42.9 — Missions D */
.hq-mission-list { display: grid; gap: 8px; }
.hq-mission-row {
  display: grid;
  grid-template-columns: 1fr 110px;
  gap: 12px;
  align-items: center;
  padding: 12px;
  background: #f5eed8 !important;
  border-color: #c2ae86 !important;
}
.hq-mission-row.done { opacity: .55; }
.hq-mission-copy strong { color: #33281c; }
.hq-mission-copy p { margin: 5px 0 9px; font-size: 12px; color: #665743; }
.story-mission-action {
  border-color: #e1a04a !important;
  background: #fff8ea !important;
}
.story-shop-mission,
.story-board-action {
  padding: 12px;
  background: #fff6df !important;
  border: 1px solid #dbb56f !important;
}
.story-shop-mission {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.story-shop-mission p { margin: 0; font-size: 12px; color: #65543b; }
.story-board-action p { color: #66543d; }
.tutorial-exam-summary { display: flex; gap: 10px; margin-top: 14px; flex-wrap: wrap; }
.tutorial-exam-summary span {
  padding: 7px 10px;
  border-radius: 999px;
  background: #ece2cc;
  color: #796a55;
}
.tutorial-exam-summary span.ok { background: #e2f0d9; color: #3d713a; }

@media (max-width: 900px) {
  .academy-intro-layout { grid-template-columns: 1fr; }
  .academy-intro-stage { grid-template-columns: 1fr; }
  .academy-intro-profile { grid-template-columns: 1fr; }
  .hq-mission-row { grid-template-columns: 1fr; }
}


/* v43.0 — tutorial directement sur le village */
.tutorial-village-screen .village-shell {
  grid-template-columns: 220px minmax(0, 1fr);
  max-width: 1180px;
  margin: 0 auto;
}
.tutorial-village-screen .academy-intro-profile {
  grid-column: 1;
}
.tutorial-village-screen .academy-intro-profile-card,
.tutorial-village-screen .academy-intro-purse {
  box-shadow: none;
}
.academy-village-log {
  margin-bottom: 10px;
  padding: 10px 14px;
  background: #f5eed8 !important;
  border: 1px solid #bda77c !important;
  border-radius: 8px;
  color: #30271e;
  font-family: monospace;
  line-height: 1.35;
}
.tutorial-village-screen .map-layout {
  grid-template-columns: minmax(0, 1fr) 300px;
  gap: 12px;
}
.tutorial-village-screen .world-map-stage {
  min-height: 360px;
  aspect-ratio: 1672 / 941;
}
.tutorial-village-screen .location-choice-panel {
  min-height: 360px;
}
.tutorial-village-screen .location-choice-actions {
  padding-top: 10px;
}
.tutorial-action-row {
  min-height: 42px !important;
}
.tutorial-action-row b {
  text-transform: none;
}
.tutorial-action-row em {
  color: #e89e1d !important;
}
@media (max-width: 900px) {
  .tutorial-village-screen .village-shell { grid-template-columns: 1fr; }
  .tutorial-village-screen .map-layout { grid-template-columns: 1fr; }
}


/* v43.1 — boutons rapides de l’Académie dans le panneau de droite */
.academy-location-actions {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.academy-choice-row span {
  display: flex;
  align-items: baseline;
  gap: 6px;
  flex-wrap: wrap;
}
.academy-choice-row b {
  font-weight: 700;
  text-transform: none;
}
.academy-choice-tag {
  color: #ca3636 !important;
  font-size: 10px !important;
  font-weight: 700;
  line-height: 1;
  text-transform: lowercase;
}
.academy-choice-row em:empty::before {
  content: '';
}


/* v43.3 — petit journal d'actions permanent au-dessus de la carte */
.village-activity-chat {
  position: relative;
  min-height: 0;
  height: 56px;
  max-height: 56px;
  margin-bottom: 10px;
  overflow: hidden;
  border: 1px solid #baa47b;
  border-radius: 9px;
  background: #f6eed9;
  color: #2c261e;
  box-shadow: 0 1px 2px rgba(75,55,25,.08);
  font-size: 11px;
}
.village-activity-scroll {
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  gap: 4px;
  min-width: 0;
  padding: 8px 10px 8px 12px;
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: #b09a71 #efe4ca;
}
.village-activity-scroll::-webkit-scrollbar {
  width: 6px;
}
.village-activity-scroll::-webkit-scrollbar-track {
  background: #efe4ca;
  border-radius: 999px;
}
.village-activity-scroll::-webkit-scrollbar-thumb {
  background: #b09a71;
  border-radius: 999px;
}
.village-activity-line {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 6px;
  line-height: 1.2;
  align-items: start;
}
.village-activity-line time {
  color: #a89a83;
  font-family: monospace;
  white-space: nowrap;
}
.village-activity-line span {
  overflow-wrap: anywhere;
}
.village-activity-line.is-empty span { color: #a99c87; }
.tutorial-village-screen .academy-village-log { display: none !important; }

/* v43.4 — combats infinis à l'Académie */
.academy-combat-prep-screen {
  min-height: 100vh;
  padding: 16px 18px 30px;
  background: #cdb58a;
  color: #2d241b;
}
.academy-combat-prep-layout {
  grid-template-columns: 220px minmax(0, 1fr) 220px;
  align-items: start;
  max-width: 1180px;
  margin: 0 auto;
}
.academy-prep-main { display: grid; gap: 12px; }
.academy-prep-story,
.academy-instructor-card,
.academy-prep-main > .card,
.academy-launch-card {
  background: #f4ecd7 !important;
  border: 1px solid #bda57d !important;
  border-radius: 9px;
  box-shadow: none !important;
}
.academy-prep-story { padding: 11px 14px; }
.academy-instructor-card {
  display: grid;
  grid-template-columns: 54px 1fr auto;
  align-items: center;
  gap: 12px;
  padding: 12px;
}
.academy-instructor-avatar {
  width: 52px; height: 52px; border-radius: 8px;
  display: grid; place-items: center;
  background: #d8d0c0; font-size: 32px;
}
.academy-instructor-card p {
  margin: 5px 0 0;
  padding: 8px 10px;
  border: 1px solid #a9a9a9;
  background: #fff;
  border-radius: 6px;
}
.academy-prep-build { display: grid; gap: 10px; }
.academy-prep-tabs { display: flex; gap: 3px; }
.academy-prep-tabs button {
  width: 30px; height: 30px; padding: 0;
  background: #efe8d7; color: #9a8b76; border: 0;
}
.academy-prep-tabs button.active {
  background: #fff; color: #222; border: 1px solid #d8cbb5;
}
.academy-prep-loadout {
  display: grid;
  grid-template-columns: 28px 28px 28px 1fr;
  align-items: center;
  gap: 8px;
  border-top: 1px solid #ded1ba;
  padding-top: 10px;
}
.academy-prep-stats {
  display: flex; justify-content: flex-end; gap: 24px;
}
.academy-prep-stats b { font-size: 12px; }
.academy-prep-stats .atk { color: #e14b32; }
.academy-prep-stats .def { color: #3f63d8; }
.academy-prep-stats .agi { color: #9a6fdf; }
.academy-series-row {
  display: flex; align-items: center; gap: 14px; flex-wrap: wrap;
  min-height: 44px;
}
.academy-series-dot {
  width: 14px; height: 14px; border-radius: 50%;
  display: inline-grid; place-items: center;
  font-size: 9px; font-weight: 800; color: #fff;
  background: #ccc;
}
.academy-series-dot.win { background: #36bf54; }
.academy-series-dot.loss { background: #c85858; }
.academy-series-dot.empty { background: #cfd0d3; }
.academy-series-count { margin-left: auto; color: #7b6a51; font-size: 12px; }
.academy-launch-card { padding-bottom: 16px !important; }
.academy-launch-button {
  display: flex; justify-content: center; align-items: center;
  gap: 22px; min-width: 250px; margin: 12px auto 6px;
  background: #e88e20; color: #fff; font-weight: 800;
  border: 0; border-radius: 10px; padding: 12px 18px;
}
.academy-launch-button span {
  background: #d47f17; padding: 12px 14px; margin: -12px -18px -12px 0;
  border-radius: 0 10px 10px 0;
}
.academy-launch-card .small { text-align: center; color: #7d6d56; }
.academy-prep-side { align-self: start; }

.academy-duel-result-screen {
  min-height: 100vh;
  background: #2d2d2d;
  color: #fff;
  padding: 38px 11vw 70px;
  font-family: Arial, sans-serif;
}
.academy-duel-top {
  display: grid;
  grid-template-columns: 185px 235px 110px 235px 185px;
  justify-content: center;
  align-items: center;
  background: #303030;
  padding: 18px 20px;
  gap: 8px;
}
.academy-duel-fighter { text-align: center; }
.academy-duel-fighter > strong {
  color: #ed3943; font-size: 21px; display: block; margin-bottom: 8px;
}
.academy-duel-portrait { height: 145px; display: grid; place-items: end center; overflow: hidden; }
.academy-duel-portrait .ninja-portrait { width: 145px; height: 145px; }
.academy-versus {
  align-self: start; margin-top: 20px;
  text-align: center; font-size: 11px; letter-spacing: .35em;
  background: #111; padding: 10px 12px;
  clip-path: polygon(12% 0, 88% 0, 100% 100%, 0 100%);
}
.academy-duel-stats { display: grid; gap: 10px; }
.academy-duel-stats > div {
  display: grid; grid-template-columns: 1fr 34px; align-items: center; gap: 8px;
  font-size: 12px;
}
.academy-duel-stats span { color: #ff4b39; font-weight: 800; }
.academy-duel-stats > div:nth-child(2) span { color: #5278ed; }
.academy-duel-stats > div:nth-child(3) span { color: #a37cff; }
.academy-duel-stats > div:nth-child(4) span { color: #70d870; }
.academy-duel-stats > div:nth-child(5) span { color: #4bb9ff; }
.academy-duel-stats b { color: #fff; }
.academy-rounds {
  max-width: 760px; margin: 18px auto 0; padding: 16px 0;
  background: #181818;
}
.academy-round-row {
  display: grid;
  grid-template-columns: 1fr 48px 90px 48px 1fr;
  gap: 12px; align-items: center;
  min-height: 42px; font-size: 13px;
}
.academy-round-row .player-action { text-align: right; color: #ff5238; font-weight: 800; }
.academy-round-row .enemy-action { color: #ff5238; font-weight: 800; }
.academy-round-row b,
.academy-round-total b {
  display: grid; place-items: center;
  min-height: 27px; border: 1px solid #464646; border-radius: 4px;
  background: #090909;
}
.academy-round-row strong { text-align: center; }
.academy-round-total {
  display: grid; grid-template-columns: 48px 90px 48px;
  justify-content: center; gap: 12px; align-items: center;
  margin-top: 8px;
}
.academy-round-total strong { text-align: center; font-size: 12px; }
.academy-duel-winner {
  max-width: 760px; margin: 12px auto 0; text-align: center;
  background: #0f0f0f; padding: 16px;
}
.academy-duel-winner h2 { font-size: 15px; margin: 0 0 8px; }
.academy-duel-winner p { margin: 0; }
.academy-duel-rewards {
  max-width: 760px; margin: 12px auto 0; text-align: center;
  background: #111; padding: 16px;
}
.academy-duel-rewards h3 { font-size: 14px; margin-top: 0; }
.academy-duel-rewards > div { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.academy-duel-rewards span {
  display: grid; gap: 2px; border: 1px solid #3d3d3d; border-radius: 5px;
  padding: 10px; font-size: 10px;
}
.academy-duel-rewards strong { color: #ff7d00; font-size: 13px; }
.academy-duel-return { max-width: 760px; margin: 18px auto 0; }
.academy-duel-return button {
  width: 100%; background: #505050; color: #fff; border: 1px solid #7b7b7b;
  border-radius: 0; padding: 13px; font-weight: 800;
}
@media (max-width: 980px) {
  .academy-combat-prep-layout { grid-template-columns: 1fr; }
  .academy-duel-result-screen { padding: 20px 12px 50px; }
  .academy-duel-top { grid-template-columns: 1fr 1fr; }
  .academy-versus { grid-column: 1 / -1; grid-row: 1; }
  .academy-duel-fighter, .academy-duel-stats { margin-top: 32px; }
}

/* v43.5 — vrai combat Académie en 3 rounds */
.academy-duel-live-screen .academy-duel-top { margin-bottom: 14px; }
.academy-live-status {
  max-width: 760px;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  padding: 10px 14px;
  background: #222;
  border-top: 1px solid #3b3b3b;
  border-bottom: 1px solid #3b3b3b;
  color: #f4f4f4;
  font-size: 12px;
}
.academy-live-status strong { color: #fff; letter-spacing: .06em; }
.academy-live-status span { color: #c8c8c8; text-align: right; }
.academy-round-row.current {
  background: #202020;
  box-shadow: inset 3px 0 0 #d94b35;
}
.academy-round-row .waiting { color: #8f8f8f !important; font-style: italic; font-weight: 500 !important; }
.academy-live-actions {
  max-width: 760px;
  margin: 14px auto 0;
  padding: 16px;
  background: #121212;
  border-top: 1px solid #3d3d3d;
  text-align: center;
}
.academy-live-actions h3 { margin: 0 0 12px; color: #fff; font-size: 14px; }
.academy-live-action-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap: 8px;
}
.academy-live-action-grid button {
  min-height: 74px;
  display: grid;
  grid-template-columns: 26px 1fr;
  grid-template-rows: auto auto;
  gap: 2px 8px;
  align-items: center;
  text-align: left;
  border: 1px solid #4b4b4b;
  border-radius: 5px;
  background: #1e1e1e;
  color: #fff;
  box-shadow: none;
  padding: 10px;
}
.academy-live-action-grid button > span { font-weight: 800; }
.academy-live-action-grid button > small { grid-column: 2; color: #a8a8a8; }
.academy-live-action-grid button.attack { border-color: #8e3a31; }
.academy-live-action-grid button.parry { border-color: #35518b; }
.academy-live-action-grid button.dodge { border-color: #654a91; }
.academy-live-action-grid button.flee { border-color: #676767; }
.academy-live-action-grid button:hover { background: #292929; filter: none; }
.academy-duel-result-screen p,
.academy-duel-result-screen small { color: #d6d6d6; }

@media (max-width: 760px) {
  .academy-live-action-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .academy-live-status { align-items: flex-start; flex-direction: column; }
  .academy-live-status span { text-align: left; }
}

/* v43.5 — palette parchemin : suit le theme actif */
:is(.build-screen, .inventory-screen, .missions-journal-screen, .legacy-shop-screen, .academy-combat-prep-screen) {
  --paper-page: var(--bg-page);
  --paper-panel: var(--bg-panel);
  --paper-panel-2: var(--bg-card);
  --paper-panel-3: var(--bg-panel-alt);
  --paper-border: var(--border-primary);
  --paper-border-soft: var(--border-soft);
  --paper-text: var(--text-primary);
  --paper-muted: var(--text-secondary);
  --paper-accent: var(--accent);
  --paper-accent-dark: var(--accent-hover);
  color: var(--text-primary) !important;
}
body:has(.build-screen),
body:has(.inventory-screen),
body:has(.missions-journal-screen),
body:has(.legacy-shop-screen),
body:has(.academy-combat-prep-screen) {
  background: var(--bg-page) !important;
  color: var(--text-primary) !important;
}
:is(.build-screen, .inventory-screen, .missions-journal-screen, .legacy-shop-screen, .academy-combat-prep-screen) .card,
:is(.build-screen, .inventory-screen, .missions-journal-screen, .legacy-shop-screen, .academy-combat-prep-screen) .shop-side-card,
:is(.build-screen, .inventory-screen, .missions-journal-screen, .legacy-shop-screen, .academy-combat-prep-screen) .village-profile-card,
:is(.build-screen, .inventory-screen, .missions-journal-screen, .legacy-shop-screen, .academy-combat-prep-screen) .village-purse-card {
  color: var(--paper-text) !important;
  border-color: var(--paper-border) !important;
}
:is(.build-screen, .inventory-screen, .missions-journal-screen, .legacy-shop-screen, .academy-combat-prep-screen) p,
:is(.build-screen, .inventory-screen, .missions-journal-screen, .legacy-shop-screen, .academy-combat-prep-screen) small,
:is(.build-screen, .inventory-screen, .missions-journal-screen, .legacy-shop-screen, .academy-combat-prep-screen) .small {
  color: var(--paper-muted) !important;
}
:is(.build-screen, .inventory-screen, .missions-journal-screen, .legacy-shop-screen, .academy-combat-prep-screen) h1,
:is(.build-screen, .inventory-screen, .missions-journal-screen, .legacy-shop-screen, .academy-combat-prep-screen) h2,
:is(.build-screen, .inventory-screen, .missions-journal-screen, .legacy-shop-screen, .academy-combat-prep-screen) h3,
:is(.build-screen, .inventory-screen, .missions-journal-screen, .legacy-shop-screen, .academy-combat-prep-screen) strong,
:is(.build-screen, .inventory-screen, .missions-journal-screen, .legacy-shop-screen, .academy-combat-prep-screen) label {
  color: var(--paper-text);
}
:is(.build-screen, .inventory-screen, .missions-journal-screen, .legacy-shop-screen, .academy-combat-prep-screen) input,
:is(.build-screen, .inventory-screen, .missions-journal-screen, .legacy-shop-screen, .academy-combat-prep-screen) select,
:is(.build-screen, .inventory-screen, .missions-journal-screen, .legacy-shop-screen, .academy-combat-prep-screen) textarea {
  color: var(--text-primary) !important;
  background: var(--bg-input) !important;
  border: 1px solid var(--border-primary) !important;
}
:is(.build-screen, .inventory-screen, .missions-journal-screen, .legacy-shop-screen, .academy-combat-prep-screen) select option {
  color: var(--text-primary);
  background: var(--bg-input);
}
:is(.inventory-screen, .missions-journal-screen, .legacy-shop-screen, .academy-combat-prep-screen) button.secondary {
  color: var(--button-secondary-text) !important;
  background: var(--button-secondary-bg) !important;
  border: 1px solid var(--button-secondary-border) !important;
  box-shadow: none !important;
}
:is(.inventory-screen, .missions-journal-screen, .legacy-shop-screen, .academy-combat-prep-screen) button:not(.danger):not(.academy-launch-button) {
  text-shadow: none;
}
:is(.inventory-screen, .missions-journal-screen, .legacy-shop-screen, .academy-combat-prep-screen) button:disabled,
.build-screen button:disabled {
  opacity: .68 !important;
  color: var(--button-disabled-text) !important;
}

/* Inventaire */
.inventory-screen .inventory-note-card,
.inventory-screen .inventory-browser-card,
.inventory-screen .inventory-legacy-row,
.inventory-screen .inventory-empty {
  background: var(--paper-panel-2) !important;
  color: var(--paper-text) !important;
  border-color: var(--paper-border-soft) !important;
}
.inventory-screen .inventory-legacy-desc,
.inventory-screen .inventory-legacy-effect,
.inventory-screen .inventory-legacy-kind,
.inventory-screen .inventory-sort-wrap { color: var(--text-secondary) !important; }
.inventory-screen .inventory-tabs .secondary { color: var(--text-secondary) !important; background: transparent !important; border: 0 !important; }
.inventory-screen .inventory-tabs .secondary.active-tab { color: var(--text-primary) !important; background: var(--button-primary-hover) !important; }
.inventory-screen .inventory-legacy-actions button,
.inventory-screen .inventory-legacy-sell button {
  color: var(--button-secondary-text) !important;
  background: var(--button-secondary-bg) !important;
  border: 1px solid var(--button-secondary-border) !important;
  box-shadow: none !important;
}

/* Quêtes / QG */
.missions-journal-screen .mission-summary-card,
.missions-journal-screen .mission-journal-current,
.missions-journal-screen .mission-available-card,
.missions-journal-screen .hq-mission-row,
.missions-journal-screen .mission-rewards-block {
  background: var(--paper-panel) !important;
  color: var(--paper-text) !important;
  border-color: var(--paper-border) !important;
}
.missions-journal-screen .mission-step-row,
.missions-journal-screen .mission-contract-card,
.missions-journal-screen .mission-reward-pill,
.missions-journal-screen .empty-state-inline {
  background: var(--paper-panel-2) !important;
  color: var(--paper-text) !important;
}
.missions-journal-screen .mission-step-copy strong,
.missions-journal-screen .mission-step-copy span,
.missions-journal-screen .mission-contract-card p { color: var(--text-secondary) !important; }
.missions-journal-screen .mission-hq-card { background: #2b241f !important; color: #fff !important; border-color: #40372e !important; }
.missions-journal-screen .mission-hq-card strong,
.missions-journal-screen .mission-hq-card .mission-hq-pin { color: #fff !important; }
.missions-journal-screen .mission-hq-entry { color: var(--text-primary) !important; background: var(--bg-input) !important; border-color: var(--border-soft) !important; }

/* Builds */
.build-screen .build-topbar,
.build-screen .build-left-panel,
.build-screen .build-right-panel,
.build-screen .build-option-row,
.build-screen .build-inline-option,
.build-screen .build-strategy-rule,
.build-screen .build-section-link,
.build-screen .build-gear-card {
  color: var(--paper-text) !important;
}
.build-screen .build-left-panel,
.build-screen .build-right-panel { background: var(--paper-panel) !important; }
.build-screen .build-option-row,
.build-screen .build-inline-option,
.build-screen .build-section-link,
.build-screen .build-strategy-rule { background: var(--paper-panel-2) !important; }
.build-screen .build-tab { color: var(--text-muted) !important; }
.build-screen .build-tab.active { color: var(--paper-accent) !important; }
.build-screen .build-close { color: var(--text-muted) !important; }
.build-screen .build-inline-option small,
.build-screen .build-option-copy small,
.build-screen .build-inline-empty-note { color: var(--text-secondary) !important; }
.build-screen .build-tech-card:not(.empty):not(.locked),
.build-screen .build-jutsu-card { color: #fff !important; }
.build-screen .build-tech-card:not(.empty):not(.locked) strong,
.build-screen .build-jutsu-card strong,
.build-screen .build-jutsu-card .build-jutsu-card-name { color: #fff !important; }
.build-screen .build-tech-card.empty,
.build-screen .build-tech-card.locked,
.build-screen .build-gear-card.locked-slot { color: #b9aa92 !important; background: #f3efe6 !important; }
.build-screen .build-strategy-copy small { color: #76664f !important; }
.build-screen .build-jutsu-search::placeholder { color: #9b8d78; }

/* Boutiques / préparation Académie */
.legacy-shop-screen .legacy-shop-row,
.legacy-shop-screen .shop-npc-bubble,
.legacy-shop-screen .sell-list,
.academy-combat-prep-screen .academy-instructor-card p {
  color: var(--paper-text) !important;
}
.legacy-shop-screen .legacy-shop-row { background: var(--paper-panel-2) !important; border-color: var(--paper-border-soft) !important; }
.academy-combat-prep-screen .academy-prep-story,
.academy-combat-prep-screen .academy-instructor-card,
.academy-combat-prep-screen .academy-prep-main > .card { background: var(--paper-panel) !important; }
.academy-combat-prep-screen .academy-prep-tabs button { color: var(--text-muted) !important; background: var(--bg-panel-alt) !important; box-shadow: none !important; }
.academy-combat-prep-screen .academy-prep-tabs button.active { color: var(--text-primary) !important; background: var(--bg-input) !important; }


/* v43.6 — inventaire compact, proche de la référence */
.inventory-screen .inventory-shell {
  display: block;
}
.inventory-screen .inventory-browser-card {
  padding: 0 !important;
  overflow: hidden;
  border-radius: 8px !important;
  background: #f5edd8 !important;
}
.inventory-screen .inventory-note-card {
  margin: 0 !important;
  padding: 10px 14px !important;
  border: 0 !important;
  border-bottom: 1px solid #dfd1b2 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  background: #f8f1df !important;
  font-size: 13px;
  color: #3b3125 !important;
}
.inventory-screen .inventory-toolbar {
  min-height: 46px;
  padding: 7px 12px 6px !important;
  gap: 10px;
  flex-wrap: nowrap;
  background: #f6efdc;
  border-bottom: 1px solid #d5c3a0;
}
.inventory-screen .inventory-tabs {
  display: flex;
  align-items: center;
  gap: 4px !important;
  flex-wrap: nowrap;
}
.inventory-screen .inventory-tabs .secondary {
  min-width: auto !important;
  min-height: 30px !important;
  padding: 5px 12px !important;
  border: 0 !important;
  border-radius: 8px !important;
  background: transparent !important;
  color: #9b5d08 !important;
  font-size: 13px;
  font-weight: 800;
}
.inventory-screen .inventory-tabs .secondary:hover {
  background: #eee1c8 !important;
  color: #4a321b !important;
}
.inventory-screen .inventory-tabs .secondary.active-tab {
  background: #dfcfb1 !important;
  color: #2e241b !important;
  box-shadow: inset 0 0 0 1px rgba(119,91,48,.06) !important;
}
.inventory-screen .inventory-sort-wrap {
  margin-left: auto;
  gap: 7px !important;
  white-space: nowrap;
  font-size: 11px !important;
  color: #4f4536 !important;
}
.inventory-screen .inventory-sort-wrap select {
  min-width: 140px !important;
  height: 31px;
  padding: 4px 10px !important;
  border-radius: 7px !important;
  background: var(--bg-input) !important;
  border: 1px solid #bbb2a4 !important;
  font-size: 12px;
  font-weight: 700;
}
.inventory-screen .inventory-legacy-list {
  padding: 8px 12px 10px !important;
}
.inventory-screen .inventory-legacy-row {
  min-height: 68px;
  padding: 8px 7px !important;
  grid-template-columns: minmax(260px, 1.35fr) minmax(95px, .45fr) 76px 74px 92px !important;
  gap: 8px !important;
  background: #f8ead0 !important;
  border-left: 4px solid #e78c20 !important;
  border-bottom: 1px solid #e2d2b5 !important;
}
.inventory-screen .inventory-legacy-icon {
  min-width: 28px !important;
  font-size: 22px !important;
}
.inventory-screen .inventory-legacy-copy strong {
  font-size: 13px !important;
}
.inventory-screen .inventory-legacy-desc,
.inventory-screen .inventory-legacy-effect {
  font-size: 11px !important;
}
.inventory-screen .inventory-legacy-kind,
.inventory-screen .inventory-legacy-sell {
  font-size: 10px !important;
}
.inventory-screen .inventory-legacy-actions button {
  min-width: 80px !important;
  min-height: 36px;
  padding: 5px 8px !important;
  font-size: 12px;
  background: var(--bg-input) !important;
  border: 1px solid #cbb28c !important;
}
.inventory-screen .inventory-empty {
  margin: 0;
  padding: 22px 14px 26px !important;
  background: #fbf5e8 !important;
  border: 0 !important;
  border-radius: 0 !important;
}
@media (max-width: 980px) {
  .inventory-screen .inventory-toolbar {
    flex-wrap: wrap;
  }
  .inventory-screen .inventory-tabs {
    flex-wrap: wrap;
  }
  .inventory-screen .inventory-sort-wrap {
    margin-left: 0;
  }
}


/* v43.8 — journal de quêtes structure référence */
.missions-journal-screen .mission-progress-overview {
  padding: 14px 18px !important;
  background: #f5eed8 !important;
  border: 1px solid #bfa97d !important;
  border-radius: 8px !important;
}
.mission-progress-overview > strong {
  display: block;
  margin-bottom: 10px;
  color: #2e251b !important;
  font-size: 13px;
}
.mission-progress-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 48px;
  row-gap: 4px;
  padding-left: 28px;
}
.mission-progress-row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 7px;
  align-items: center;
  color: #342b20;
  font-size: 12px;
}
.mission-progress-row b {
  color: #342b20 !important;
  font-weight: 500;
}
.quest-reference-layout {
  padding: 14px 18px 18px !important;
}
.quest-reference-layout > h3 {
  margin: 0 0 9px !important;
  color: #2c251c !important;
  font-size: 14px;
}
.mission-current-description {
  margin: 0 0 14px !important;
  color: #4d3c2d !important;
  font-size: 12px !important;
  line-height: 1.35;
}
.quest-reference-layout .mission-step-list {
  margin-top: 0 !important;
}
.quest-reference-layout .mission-step-row {
  min-height: 42px;
  padding: 7px 10px !important;
  border-radius: 0 !important;
  border: 1px solid #d98b68 !important;
  background: var(--bg-card) !important;
}
.quest-reference-layout .mission-step-row + .mission-step-row {
  margin-top: 6px;
}
.quest-reference-layout .mission-step-row.done {
  opacity: .65;
  border-color: #d6c9ad !important;
  background: #f1eadc !important;
}
.quest-reference-layout .mission-step-row.upcoming {
  border-color: #ded2b8 !important;
  background: #f8f2e6 !important;
}
.quest-reference-layout .mission-step-index {
  background: #c98156 !important;
  color: #fff !important;
}
.quest-reference-layout .mission-step-copy strong {
  color: #88725d !important;
  font-size: 12px !important;
  font-style: italic;
  font-weight: 500 !important;
}
.quest-reference-layout .mission-step-action {
  display: inline-block;
  padding: 4px 7px;
  margin-left: 3px;
  border: 1px solid #e0d6c3;
  border-radius: 4px;
  background: #fffdf7;
  color: #6b5c4c !important;
  font-style: normal;
}
.quest-reference-layout .mission-step-status {
  background: #d3895a !important;
  color: #fff !important;
}
.quest-reference-layout .mission-step-row.done .mission-step-status,
.quest-reference-layout .mission-step-row.upcoming .mission-step-status {
  background: #e6dcc7 !important;
  color: #80715d !important;
}
.quest-reference-layout .mission-rewards-block {
  margin-top: 14px !important;
  padding: 14px 15px !important;
  background: #fbf2df !important;
  border: 1px solid #dbc59b !important;
}
.quest-reference-layout .mission-rewards-title {
  color: #967545 !important;
  font-size: 11px !important;
  font-weight: 700;
}
.quest-reference-layout .mission-reward-list {
  gap: 10px !important;
  margin-top: 10px !important;
}
.quest-reference-layout .mission-reward-pill {
  min-height: 28px;
  padding: 5px 11px !important;
  background: var(--bg-input) !important;
  border: 1px solid #dcc39b !important;
  color: #8d6a3c !important;
}
.quest-reference-layout .mission-reward-pill b {
  color: #ee6d35 !important;
}
.quest-reference-layout .mission-reward-pill.stat {
  border-color: #ff8a8a !important;
  color: #c53345 !important;
}
.quest-reference-layout .mission-reward-pill.stat b {
  color: #d91f43 !important;
}
.quest-reference-layout .mission-journal-actions {
  border-top: 1px solid #e2d7c1;
  padding-top: 14px;
  margin-top: 14px !important;
}
.quest-reference-layout .mission-abandon-button {
  min-width: 360px !important;
  background: var(--bg-input) !important;
  color: #b98b49 !important;
  border: 1px solid #d8c4a2 !important;
}
@media (max-width: 760px) {
  .mission-progress-grid {
    grid-template-columns: 1fr;
    padding-left: 6px;
  }
  .quest-reference-layout .mission-abandon-button {
    min-width: 0 !important;
    width: 100%;
  }
}


/* v43.9 — correction finale du rail profil/menu dans inventaire/quêtes/build */
:is(.build-screen, .inventory-screen, .missions-journal-screen, .legacy-shop-screen, .academy-combat-prep-screen) .village-profile-rail {
  gap: 12px !important;
}
:is(.build-screen, .inventory-screen, .missions-journal-screen, .legacy-shop-screen, .academy-combat-prep-screen) .village-profile-card,
:is(.build-screen, .inventory-screen, .missions-journal-screen, .legacy-shop-screen, .academy-combat-prep-screen) .village-purse-card {
  background: var(--bg-panel) !important;
  color: var(--text-primary) !important;
  border: 1px solid var(--border-primary) !important;
  border-radius: 8px !important;
  box-shadow: 0 5px 14px rgba(76,54,25,.12) !important;
}
:is(.build-screen, .inventory-screen, .missions-journal-screen, .legacy-shop-screen, .academy-combat-prep-screen) .village-profile-name h2 {
  color: #252522 !important;
}
:is(.build-screen, .inventory-screen, .missions-journal-screen, .legacy-shop-screen, .academy-combat-prep-screen) .village-profile-name p,
:is(.build-screen, .inventory-screen, .missions-journal-screen, .legacy-shop-screen, .academy-combat-prep-screen) .profile-build,
:is(.build-screen, .inventory-screen, .missions-journal-screen, .legacy-shop-screen, .academy-combat-prep-screen) .resource-meter-label,
:is(.build-screen, .inventory-screen, .missions-journal-screen, .legacy-shop-screen, .academy-combat-prep-screen) .profile-art-label,
:is(.build-screen, .inventory-screen, .missions-journal-screen, .legacy-shop-screen, .academy-combat-prep-screen) .purse-row {
  color: var(--text-secondary) !important;
}
:is(.build-screen, .inventory-screen, .missions-journal-screen, .legacy-shop-screen, .academy-combat-prep-screen) .village-profile-card .eyebrow,
:is(.build-screen, .inventory-screen, .missions-journal-screen, .legacy-shop-screen, .academy-combat-prep-screen) .village-purse-card .eyebrow {
  color: var(--text-secondary) !important;
  letter-spacing: .12em !important;
}
:is(.build-screen, .inventory-screen, .missions-journal-screen, .legacy-shop-screen, .academy-combat-prep-screen) .profile-divider,
:is(.build-screen, .inventory-screen, .missions-journal-screen, .legacy-shop-screen, .academy-combat-prep-screen) .profile-build {
  border-color: var(--border-soft) !important;
}
:is(.build-screen, .inventory-screen, .missions-journal-screen, .legacy-shop-screen, .academy-combat-prep-screen) .profile-divider {
  background: var(--border-soft) !important;
}
:is(.build-screen, .inventory-screen, .missions-journal-screen, .legacy-shop-screen, .academy-combat-prep-screen) .village-profile-card h3 {
  color: #706650 !important;
}
:is(.build-screen, .inventory-screen, .missions-journal-screen, .legacy-shop-screen, .academy-combat-prep-screen) .resource-meter-label b,
:is(.build-screen, .inventory-screen, .missions-journal-screen, .legacy-shop-screen, .academy-combat-prep-screen) .profile-art-label b,
:is(.build-screen, .inventory-screen, .missions-journal-screen, .legacy-shop-screen, .academy-combat-prep-screen) .purse-row strong {
  color: #4b342d !important;
}
:is(.build-screen, .inventory-screen, .missions-journal-screen, .legacy-shop-screen, .academy-combat-prep-screen) .village-profile-card .bar {
  background: #e2d6b8 !important;
  border: 0 !important;
}
:is(.build-screen, .inventory-screen, .missions-journal-screen, .legacy-shop-screen, .academy-combat-prep-screen) .village-profile-card .bar.health span {
  background: #4fbe62 !important;
}
:is(.build-screen, .inventory-screen, .missions-journal-screen, .legacy-shop-screen, .academy-combat-prep-screen) .village-profile-card .bar.energy span {
  background: #58b4f2 !important;
}
:is(.build-screen, .inventory-screen, .missions-journal-screen, .legacy-shop-screen, .academy-combat-prep-screen) .village-profile-card .bar.xp span {
  background: #e77839 !important;
}
:is(.build-screen, .inventory-screen, .missions-journal-screen, .legacy-shop-screen, .academy-combat-prep-screen) .profile-art-track {
  background: #edaaa9 !important;
}
:is(.build-screen, .inventory-screen, .missions-journal-screen, .legacy-shop-screen, .academy-combat-prep-screen) .profile-art-track > span {
  background: #df2347 !important;
}
:is(.build-screen, .inventory-screen, .missions-journal-screen, .legacy-shop-screen, .academy-combat-prep-screen) .village-profile-portrait,
:is(.build-screen, .inventory-screen, .missions-journal-screen, .legacy-shop-screen, .academy-combat-prep-screen) .village-profile-portrait .ninja-portrait {
  background: #d5d7cf !important;
  box-shadow: none !important;
}
:is(.build-screen, .inventory-screen, .missions-journal-screen, .legacy-shop-screen, .academy-combat-prep-screen) .shop-side-card,
:is(.build-screen, .inventory-screen, .missions-journal-screen, .legacy-shop-screen, .academy-combat-prep-screen) .shop-side-body,
:is(.build-screen, .inventory-screen, .missions-journal-screen, .legacy-shop-screen, .academy-combat-prep-screen) .shop-pass-box,
:is(.build-screen, .inventory-screen, .missions-journal-screen, .legacy-shop-screen, .academy-combat-prep-screen) .shop-pass-tier {
  background: var(--bg-panel) !important;
  color: var(--text-primary) !important;
  border-color: var(--border-primary) !important;
}


/* v43.10 — actions Académie/Bains plus compactes + PA */
.academy-location-actions,
.baths-location-actions {
  gap: 8px !important;
  padding: 8px 10px 10px !important;
}
.academy-location-actions .location-choice-row,
.baths-location-actions .location-choice-row {
  min-height: 39px !important;
  padding: 6px 9px 6px 11px !important;
  border-radius: 4px !important;
  border: 1px solid #d7c9ab !important;
  background: #fbf8ef !important;
}
.academy-location-actions .location-choice-row:hover:not(:disabled),
.baths-location-actions .location-choice-row:hover:not(:disabled) {
  background: var(--bg-card) !important;
  border-color: #e7b25a !important;
  transform: none !important;
}
.academy-location-actions .location-choice-row b,
.baths-location-actions .location-choice-row b {
  font-size: 12px !important;
  line-height: 1.12 !important;
}
.academy-location-actions .location-choice-row small,
.baths-location-actions .location-choice-row small {
  display: inline !important;
  margin: 0 0 0 5px !important;
  color: #cf4242 !important;
  font-size: 9px !important;
  line-height: 1 !important;
  white-space: normal !important;
}
.academy-location-actions .location-choice-row em,
.baths-location-actions .location-choice-row em {
  min-width: 39px !important;
  color: #e59a1d !important;
  font-size: 12px !important;
}
.academy-location-actions .story-mission-action {
  border-color: #e7a545 !important;
  background: #fff8e9 !important;
  box-shadow: inset 3px 0 0 #e59a1d !important;
}
.academy-location-actions .story-mission-action b {
  font-weight: 800 !important;
}

/* v43.11 — affichage permanent des PA dans le profil */
.bar.pa span {
  background: #ffb51f !important;
}
.village-profile-card .bar.pa span {
  background: #ffb51f !important;
}
.resource-meter-label i {
  flex: 0 0 auto;
}


/* v43.15 — profil Shinobi + barre Quêtes */
.profile-active-build {
  width: 100%;
  min-height: 38px;
  margin: 8px 0 6px;
  padding: 7px 9px !important;
  display: flex;
  align-items: center;
  gap: 8px;
  border: 1px solid #b9b5ac !important;
  border-radius: 4px !important;
  background: #fff !important;
  color: #44392d !important;
  box-shadow: none !important;
  text-align: left;
}
.profile-active-build:hover {
  background: var(--bg-card) !important;
  border-color: #d2a35e !important;
  transform: none !important;
}
.profile-active-build-icon {
  flex: 0 0 auto;
  color: #9b7441 !important;
  font-size: 16px;
  line-height: 1;
}
.profile-active-build-copy {
  min-width: 0;
  display: grid;
  gap: 1px;
}
.profile-active-build-copy small {
  color: #8f7c62 !important;
  font-size: 8px !important;
  font-weight: 700;
  letter-spacing: .04em;
}
.profile-active-build-copy strong {
  color: #2d2821 !important;
  font-size: 10px !important;
  font-weight: 600 !important;
  text-transform: lowercase;
}

.profile-innate-gift {
  width: 100%;
  min-height: 38px;
  margin: 0 0 10px;
  padding: 6px 9px !important;
  display: flex;
  align-items: center;
  gap: 8px;
  border: 1px solid #c4b392 !important;
  border-radius: 4px !important;
  background: #f3ead6 !important;
  color: #44392d !important;
  box-shadow: none !important;
  text-align: left;
}
.profile-innate-gift:hover {
  background: #efe3c8 !important;
  border-color: #b89a63 !important;
  transform: none !important;
}
.profile-innate-gift-icon {
  flex: 0 0 32px;
  width: 32px;
  height: 32px;
  display: grid;
  place-items: center;
  overflow: hidden;
  border-radius: 6px;
  background: transparent;
  font-size: 16px;
  line-height: 1;
}
.profile-innate-gift-icon img {
  width: 32px;
  height: 32px;
  object-fit: contain;
  background: transparent;
}
.profile-innate-gift-copy {
  min-width: 0;
  flex: 1 1 auto;
  display: grid;
  gap: 1px;
}
.profile-innate-gift-copy small {
  color: #8f7c62 !important;
  font-size: 8px !important;
  font-weight: 700;
  letter-spacing: .08em;
}
.profile-innate-gift-copy strong {
  color: #2d2821 !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  text-transform: none;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.profile-innate-gift-chevron {
  flex: 0 0 auto;
  margin-left: auto;
  color: #9b7441;
  font-size: 16px;
  line-height: 1;
  font-weight: 400;
}
.profile-innate-gift.is-empty .profile-innate-gift-copy strong {
  color: #6f6454 !important;
  font-weight: 600 !important;
}

/* Le profil de référence n'affiche pas Force / Précision dans ce rail. */
.profile-secondary-stats { display: none !important; }

/* La barre Quêtes doit rester sombre comme la navigation principale. */
body:has(.missions-journal-screen) .game-header,
body:has(.missions-reset-screen) .game-header {
  background: #151715 !important;
  color: #eee8d9 !important;
  border-bottom: 1px solid #494438 !important;
  box-shadow: 0 2px 8px #0002 !important;
}
body:has(.missions-journal-screen) .game-header .game-brand,
body:has(.missions-reset-screen) .game-header .game-brand {
  color: #f2e5c4 !important;
}
body:has(.missions-journal-screen) .game-header .game-brand em,
body:has(.missions-reset-screen) .game-header .game-brand em {
  color: #c8a96c !important;
}
body:has(.missions-journal-screen) .game-header .game-brand small,
body:has(.missions-reset-screen) .game-header .game-brand small {
  color: #a7a18f !important;
}
body:has(.missions-journal-screen) .game-header .game-nav-link,
body:has(.missions-reset-screen) .game-header .game-nav-link {
  color: #c9c5b9 !important;
  background: transparent !important;
}
body:has(.missions-journal-screen) .game-header .game-nav-link:hover,
body:has(.missions-reset-screen) .game-header .game-nav-link:hover {
  background: #2b2c28 !important;
  color: var(--bg-card) !important;
}
body:has(.missions-journal-screen) .game-header .game-nav-link.is-active,
body:has(.missions-reset-screen) .game-header .game-nav-link.is-active {
  background: #373a34 !important;
  color: var(--bg-card) !important;
}
body:has(.missions-journal-screen) .game-header .autosave-state,
body:has(.missions-reset-screen) .game-header .autosave-state,
body:has(.missions-journal-screen) .game-header .game-account-menu > summary,
body:has(.missions-reset-screen) .game-header .game-account-menu > summary {
  color: #c9c5b9 !important;
}


/* Destination de mission : même saut que shinobi.fr (.place-button.mission-target + fa-bounce) */
.village-screen .map-pin.mission-target .pin-badge {
  border-color: transparent !important;
  background: rgba(255, 200, 0, 0.85) !important;
  color: #000 !important;
  box-shadow: 0 0 10px rgba(255, 200, 0, 0.6) !important;
  animation: fa-bounce 1s ease infinite;
  transform-origin: center bottom;
}
.village-screen .map-pin.mission-target:hover .pin-badge,
.village-screen .map-pin.mission-target:focus-visible .pin-badge,
.village-screen .map-pin.mission-target.selected .pin-badge {
  background: #ffc800 !important;
  color: #000 !important;
  transform: none;
  animation: fa-bounce 1s ease infinite;
}
.village-screen .map-pin.mission-target .pin-text,
.village-screen .map-pin.mission-target.selected .pin-text {
  color: #000 !important;
  text-shadow: none !important;
}
.village-screen .map-pin.mission-target .pin-quest-icon {
  display: inline-block;
  position: relative;
  width: 0;
  height: 0;
  margin-right: 4px;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-bottom: 9px solid #ff9800;
  transform: translateY(-1px);
}
.village-screen .map-pin.mission-target .pin-quest-icon::after {
  content: "!";
  position: absolute;
  left: 50%;
  top: 1px;
  transform: translateX(-50%);
  color: #fff;
  font-size: 7px;
  font-weight: 900;
  line-height: 1;
  text-shadow: 0 0 1px #7a3b00;
}
@keyframes fa-bounce {
  0% { transform: scale(1) translateY(0); animation-timing-function: cubic-bezier(.8,0,1,1); }
  14% { transform: scale(1.06, .94) translateY(3px); animation-timing-function: cubic-bezier(0.33, 0, 0.66, 0.33); }
  32% { transform: scale(.94, 1.12) translateY(-0.5em); animation-timing-function: cubic-bezier(0.33, 0.66, 0.66, 1); }
  52% { transform: scale(1) translateY(-0.55em); animation-timing-function: cubic-bezier(0.5, 0, 1, 0.5); }
  70% { transform: scale(1.06, .92) translateY(0); animation-timing-function: cubic-bezier(0.33, 0.33, 0.66, 1); }
  85% { transform: scale(.98, 1.04) translateY(-2px); animation-timing-function: cubic-bezier(0.33, 0, 0.66, 1); }
  100% { transform: scale(1) translateY(0); }
}
@media (prefers-reduced-motion: reduce) {
  .village-screen .map-pin.mission-target .pin-badge { animation: none !important; }
}


/* v43.18 — PA : régénération visible, +1 toutes les 30 minutes */
.pa-resource-meter .resource-meter-label > span {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  min-width: 0;
}
.pa-regen-badge {
  display: inline-flex !important;
  align-items: center;
  min-height: 17px;
  padding: 2px 7px;
  border-radius: 999px;
  background: #f8e7b6;
  border: 1px solid #e6c875;
  color: #8b681f !important;
  font-size: 9px !important;
  font-weight: 700;
  line-height: 1;
  white-space: nowrap;
  text-transform: none !important;
}
.village-profile-card .bar.pa span,
.academy-intro-profile-card .bar.pa span {
  background: #ffb51f !important;
}


/* v43.19 — outils admin */
.admin-backdrop {
  position: fixed;
  inset: 0;
  z-index: 10050;
  display: grid;
  place-items: center;
  padding: 22px;
  background: rgba(25, 21, 16, .62);
  backdrop-filter: blur(2px);
}
.admin-panel {
  width: min(780px, 96vw);
  max-height: 90vh;
  overflow-y: auto;
  border: 1px solid #ad9367;
  border-radius: 12px;
  background: var(--bg-panel);
  color: var(--text-primary);
  box-shadow: 0 22px 70px rgba(0,0,0,.32);
}
.admin-head {
  position: sticky;
  top: 0;
  z-index: 2;
  display: flex;
  justify-content: space-between;
  gap: 18px;
  align-items: start;
  padding: 16px 18px 13px;
  border-bottom: 1px solid #d4c19d;
  background: var(--bg-panel);
}
.admin-head h2 { margin: 2px 0 4px; color: #2d251b; }
.admin-head p { margin: 0; color: var(--text-secondary); font-size: 12px; }
.admin-close { width: 36px; height: 36px; padding: 0 !important; font-size: 22px; }
.admin-values {
  display: grid;
  grid-template-columns: repeat(6, minmax(0,1fr));
  gap: 8px;
  padding: 14px 18px;
}
.admin-current-value {
  display: grid;
  gap: 3px;
  padding: 9px 10px;
  border: 1px solid #d8c7a8;
  border-radius: 8px;
  background: var(--bg-card);
}
.admin-current-value span { color: #806d51; font-size: 10px; text-transform: uppercase; }
.admin-current-value strong { color: #2e251b; font-size: 14px; }
.admin-notice {
  margin: 0 18px 12px;
  padding: 9px 11px;
  border: 1px solid #d5b879;
  border-radius: 7px;
  background: #fff4d5;
  color: #6d4d17;
  font-size: 12px;
}
.admin-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 10px;
  padding: 0 18px 14px;
}
.admin-section {
  padding: 12px;
  border: 1px solid #d5c3a1;
  border-radius: 9px;
  background: #fbf6e9;
}
.admin-section.admin-wide { grid-column: 1 / -1; }
.admin-section h3, .admin-custom h3 { margin: 0 0 9px; color: #3d3021; font-size: 13px; }
.admin-quick { display: flex; flex-wrap: wrap; gap: 7px; }
.admin-quick button {
  min-height: 32px;
  padding: 6px 10px;
  border: 1px solid #c7ad7f;
  border-radius: 6px;
  background: var(--bg-input);
  color: #463724;
  box-shadow: none;
  font-size: 11px;
}
.admin-quick button:hover { border-color: #df9437; background: #fff5e7; }
.admin-custom {
  display: grid;
  grid-template-columns: minmax(130px,.7fr) minmax(110px,.6fr) auto auto;
  gap: 8px;
  align-items: end;
  margin: 0 18px 14px;
  padding: 12px;
  border: 1px solid #d5c3a1;
  border-radius: 9px;
  background: #fbf6e9;
}
.admin-custom h3 { grid-column: 1 / -1; }
.admin-custom input, .admin-custom select {
  height: 34px;
  color: var(--text-primary);
  background: var(--bg-input);
  border: 1px solid var(--border-primary);
  border-radius: 6px;
  padding: 5px 8px;
}
.admin-custom button { min-height: 34px; }
.admin-footer {
  display: flex;
  justify-content: flex-end;
  padding: 12px 18px 16px;
  border-top: 1px solid #d4c19d;
}
.game-account-dropdown .admin-menu-button { color: var(--dropdown-icon); font-weight: 800; }
@media (max-width: 700px) {
  .admin-values { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .admin-grid { grid-template-columns: 1fr; }
  .admin-section.admin-wide { grid-column: auto; }
  .admin-custom { grid-template-columns: 1fr 1fr; }
  .admin-custom h3 { grid-column: 1 / -1; }
}


/* v43.20 — salle des récompenses de trophées au QG */
.trophy-room-shell{display:grid;gap:12px}.trophy-room-message{padding:10px 14px!important;display:flex;justify-content:space-between;align-items:center;background:#f5eed8!important}.trophy-wallet{font-weight:800;color:#8f671f}.trophy-npc-card{display:grid;grid-template-columns:60px minmax(0,1fr) auto;gap:12px;align-items:start;padding:12px!important;background:#f5eed8!important}.trophy-npc-avatar{width:60px;height:74px;display:grid;place-items:center;border:1px solid #ccb991;background:#fffdf7;font-size:32px}.trophy-npc-copy strong{display:block;margin-bottom:6px}.trophy-npc-copy p{margin:0 0 8px!important;padding:8px 10px;border:1px solid #b7a689;border-radius:4px;background:#fff;color:#352d22!important}.trophy-npc-copy button{padding:5px 10px!important;font-size:11px}.trophy-leave{min-width:84px}.trophy-section{padding:13px 14px!important;background:#f5eed8!important}.trophy-section h3{margin:0 0 10px!important;font-size:14px}.trophy-section>p{margin:6px 0!important;line-height:1.35}.trophy-reward-list,.trophy-training-list{display:grid}.trophy-reward-row{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(150px,.8fr) 120px;gap:12px;align-items:center;padding:6px 0}.trophy-reward-item{display:flex;gap:8px;align-items:flex-start;min-width:0}.trophy-reward-icon{flex:0 0 24px;font-size:20px;text-align:center}.trophy-reward-item strong,.trophy-training-row strong,.trophy-strategy-row strong{color:#3b2b1a!important}.trophy-reward-item p,.trophy-training-row p,.trophy-strategy-row p{margin:2px 0 0!important;color:#5f513d!important;font-size:11px;line-height:1.25}.trophy-reward-effect{color:#493a28;font-size:12px}.trophy-exchange-button,.trophy-training-row button,.trophy-strategy-row button{padding:5px 8px!important;min-height:30px;background:transparent!important;border:0!important;color:#a56a1d!important;box-shadow:none!important;text-align:left}.trophy-cost{color:#8b7b2a;font-weight:800;white-space:nowrap}.trophy-training-row,.trophy-strategy-row{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(170px,.75fr) 125px;gap:12px;align-items:center;padding:9px 0;border-top:1px solid #eadfc8}.trophy-training-row:first-child{border-top:0}.trophy-training-row.reset{margin-top:4px}@media(max-width:900px){.trophy-reward-row,.trophy-training-row,.trophy-strategy-row{grid-template-columns:1fr;gap:5px}.trophy-npc-card{grid-template-columns:52px 1fr}.trophy-leave{grid-column:2;justify-self:start}}


/* v43.21 — Builds : proportions/typographie très proches de la référence Shinobi.fr */
body:has(.build-screen) {
  background: #cbb48a !important;
}
.build-screen {
  padding: 13px 20px 28px !important;
  color: #2b2822 !important;
  font-size: 12px !important;
}
.build-shell {
  width: min(1180px, calc(100vw - 40px)) !important;
  max-width: 1180px !important;
  margin: 0 auto !important;
  gap: 9px !important;
}

/* barre 1-5 */
.build-topbar {
  position: static !important;
  padding: 5px 7px !important;
  min-height: 48px !important;
  border: 1px solid #c9b591 !important;
  border-radius: 8px !important;
  background: #f4edda !important;
  box-shadow: none !important;
}
.build-slot-tabs {
  gap: 4px !important;
}
.build-slot-tab,
.build-slot-icon {
  width: 34px !important;
  min-width: 34px !important;
  height: 34px !important;
  padding: 0 !important;
  border: 1px solid transparent !important;
  border-radius: 7px !important;
  background: transparent !important;
  color: #7d725f !important;
  box-shadow: none !important;
  font-size: 12px !important;
  font-weight: 700 !important;
}
.build-slot-tab.active {
  background: #fff !important;
  border-color: #d7c8aa !important;
  color: #171613 !important;
  box-shadow: 0 1px 2px rgba(65,45,22,.06) !important;
}
.build-slot-icon {
  margin-left: 2px !important;
  color: #ad9e85 !important;
  font-size: 15px !important;
  opacity: 1 !important;
}
.build-more-icon {
  border-color: #d8c5a0 !important;
  background: #fbf7ed !important;
  color: #6f6554 !important;
}

/* structure générale */
.build-layout {
  grid-template-columns: 376px minmax(0, 1fr) !important;
  gap: 10px !important;
  align-items: start !important;
}
.build-left-panel,
.build-right-panel {
  border: 1px solid #c7b28b !important;
  border-radius: 8px !important;
  background: #f5eedb !important;
  box-shadow: 0 1px 2px rgba(75,52,23,.08) !important;
}
.build-left-panel {
  padding: 15px 16px 16px !important;
}
.build-right-panel {
  padding: 0 !important;
  overflow: hidden !important;
}

/* chiffres ATK / DEF / AGI — mêmes lignes et hauteur */
.build-primary-stats {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 17px !important;
  margin: 0 0 12px !important;
  align-items: end !important;
}
.build-primary-stats .build-stat {
  display: grid !important;
  grid-template-columns: auto 1fr !important;
  grid-template-rows: 14px 25px 4px !important;
  column-gap: 5px !important;
  align-items: end !important;
  padding: 0 !important;
  border: 0 !important;
  color: #e24a32 !important;
}
.build-primary-stats .build-stat::after { display: none !important; }
.build-primary-stats .build-stat span {
  grid-column: 1 !important;
  grid-row: 1 !important;
  align-self: end !important;
  margin: 0 !important;
  color: currentColor !important;
  font-size: 9px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
}
.build-primary-stats .build-stat strong {
  grid-column: 1 / -1 !important;
  grid-row: 2 !important;
  display: block !important;
  margin: 0 !important;
  color: currentColor !important;
  font-size: 22px !important;
  font-weight: 800 !important;
  line-height: 24px !important;
  letter-spacing: 0 !important;
}
.build-primary-stats .build-stat i {
  grid-column: 1 / -1 !important;
  grid-row: 3 !important;
  position: relative !important;
  display: block !important;
  width: 100% !important;
  height: 4px !important;
  overflow: hidden !important;
  border-radius: 3px !important;
  background: #e4ddcf !important;
}
.build-primary-stats .build-stat i em {
  display: block !important;
  width: 80% !important;
  height: 100% !important;
  border-radius: inherit !important;
  background: currentColor !important;
}
.build-primary-stats .build-stat-atk { color: #ff7058 !important; }
.build-primary-stats .build-stat-def { color: #315fc7 !important; }
.build-primary-stats .build-stat-agi { color: #9a79d6 !important; }

/* bonus village */
.build-badge-row {
  min-height: 42px !important;
  margin: 0 0 12px !important;
  padding: 7px 11px !important;
  border: 1px solid #edc671 !important;
  border-left: 3px solid #efb52d !important;
  border-radius: 7px !important;
  background: #faedc9 !important;
  box-shadow: none !important;
}
.build-main-badge {
  color: #72521a !important;
  font-size: 11px !important;
  font-weight: 700 !important;
}
.build-badge-row small {
  color: #8d6c31 !important;
  font-size: 10px !important;
  font-weight: 600 !important;
}

/* attitude active à gauche */
.build-equip-row {
  min-height: 43px !important;
  margin: 0 0 12px !important;
  padding: 8px 10px !important;
  border: 1px solid #efc4aa !important;
  border-left: 3px solid #ff7040 !important;
  border-radius: 8px !important;
  background: #f8e8d9 !important;
  box-shadow: none !important;
  color: #786d5d !important;
}
.build-equip-row span {
  gap: 7px !important;
  font-size: 14px !important;
}
.build-equip-row span small {
  color: #8c8172 !important;
  font-size: 10px !important;
  font-weight: 500 !important;
}
.build-equip-row strong {
  color: #ff6533 !important;
  font-size: 11px !important;
  font-weight: 700 !important;
}
.build-equip-row em {
  color: #9d8f7a !important;
  font-size: 16px !important;
}

/* équipements : plus plats, plus petits */
.build-gear-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 7px !important;
  margin: 0 0 12px !important;
}
.build-gear-card {
  min-height: 46px !important;
  padding: 7px 9px !important;
  border: 1px solid #d1b996 !important;
  border-radius: 8px !important;
  background: var(--bg-input) !important;
  box-shadow: none !important;
  grid-template-columns: 27px minmax(0, 1fr) !important;
  gap: 7px !important;
}
.build-gear-card span { font-size: 18px !important; }
.build-gear-card strong {
  color: #302b24 !important;
  font-size: 10px !important;
  font-weight: 600 !important;
}
.build-gear-card.dashed {
  border-style: dashed !important;
  color: #c2ad8e !important;
  background: #faf5e8 !important;
}
.build-gear-card.dashed strong,
.build-gear-card.locked-slot strong { color: #c0ad8f !important; }
.build-gear-card.locked-slot {
  min-height: 46px !important;
  background: #f5f1e8 !important;
  border: 1px solid #e0d8ca !important;
  opacity: .78 !important;
}

/* slots jutsu */
.build-tech-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 7px !important;
  margin: 0 0 12px !important;
}
.build-tech-card {
  min-height: 132px !important;
  padding: 6px !important;
  border-radius: 7px !important;
  box-shadow: none !important;
}
.build-tech-card.empty {
  border: 1px dashed #d7c3a3 !important;
  background: #faf4e5 !important;
  color: #c7b497 !important;
}
.build-tech-card.locked {
  border: 1px dashed #dedbd4 !important;
  background: #f2f0eb !important;
  color: #d0ccc3 !important;
}
.build-tech-card .build-tech-card-add,
.build-locked-level {
  font-size: 9px !important;
}
.build-locked-icon { font-size: 18px !important; }

.build-section-link {
  min-height: 37px !important;
  padding: 7px 11px !important;
  border: 1px solid #d1b996 !important;
  border-radius: 8px !important;
  background: #fffdf9 !important;
  box-shadow: none !important;
  color: #29251e !important;
  font-size: 11px !important;
}
.build-section-link strong { font-size: 10px !important; color: #8e8372 !important; }
.build-section-link em { font-size: 15px !important; }

/* onglets du grand panneau */
.build-tabs {
  min-height: 46px !important;
  padding: 8px 14px !important;
  gap: 18px !important;
  border-bottom: 1px solid #ded1ba !important;
  background: #f5eedb !important;
}
.build-tab {
  padding: 3px 0 !important;
  border: 0 !important;
  border-radius: 5px !important;
  background: transparent !important;
  color: #817666 !important;
  box-shadow: none !important;
  font-size: 10px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
}
.build-tab.active {
  padding: 4px 8px !important;
  background: #f7dfb0 !important;
  color: #e38a20 !important;
}
.build-close {
  width: 28px !important;
  height: 28px !important;
  margin-left: auto !important;
  padding: 0 !important;
  border-radius: 6px !important;
  background: #eee8db !important;
  color: #a79b87 !important;
  font-size: 18px !important;
  box-shadow: none !important;
}
.build-content-area {
  padding: 0 !important;
}

/* choix d'attitude : très proche des lignes compactes Shinobi.fr */
.build-options-list {
  gap: 7px !important;
  padding: 14px !important;
}
.build-option-row.attitude {
  min-height: 50px !important;
  grid-template-columns: 25px 135px minmax(0, 1fr) !important;
  gap: 8px !important;
  padding: 8px 11px !important;
  border: 1px solid #ddd2bd !important;
  border-left: 3px solid #cf7774 !important;
  border-radius: 8px !important;
  background: #f4eadd !important;
  box-shadow: none !important;
  transform: none !important;
}
.build-option-row.attitude:hover:not(:disabled) {
  transform: none !important;
  background: #f7efe4 !important;
}
.build-option-row.attitude.active {
  border-color: #ff7549 !important;
  border-left-width: 4px !important;
  background: #fae6d1 !important;
  box-shadow: none !important;
}
.build-option-row.attitude-defensive { border-left-color: #65b7d9 !important; background: #edefe6 !important; }
.build-option-row.attitude-fuyarde { border-left-color: #92b76d !important; background: #ebead8 !important; }
.build-option-row.attitude .build-option-icon {
  display: grid !important;
  place-items: center !important;
  width: 24px !important;
  height: 24px !important;
  margin: 0 !important;
  font-size: 14px !important;
  line-height: 1 !important;
}
.build-option-row.attitude .build-option-name {
  color: #bc2828 !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  text-transform: lowercase !important;
}
.build-option-row.attitude-neutral .build-option-name { color: #ff6f43 !important; }
.build-option-row.attitude-defensive .build-option-name { color: #2388c0 !important; }
.build-option-row.attitude-fuyarde .build-option-name { color: #3f742a !important; }
.build-option-stats {
  grid-column: auto !important;
  display: flex !important;
  justify-content: flex-end !important;
  align-items: center !important;
  flex-wrap: nowrap !important;
  gap: 8px !important;
  min-width: 0 !important;
  font-size: 9px !important;
  line-height: 1 !important;
}
.build-option-stats b {
  display: inline-block !important;
  padding: 3px 5px !important;
  border-radius: 4px !important;
  background: rgba(255,255,255,.28) !important;
  font-size: 9px !important;
  font-weight: 700 !important;
  white-space: nowrap !important;
}

/* autres onglets Builds : même échelle visuelle */
.build-inline-grid { padding: 12px !important; gap: 6px !important; }
.build-inline-option {
  min-height: 42px !important;
  padding: 7px 9px !important;
  border-radius: 7px !important;
  box-shadow: none !important;
  font-size: 10px !important;
}
.build-inline-option strong { font-size: 10px !important; }
.build-inline-option small { font-size: 9px !important; }
.build-jutsu-toolbar { padding: 8px 10px !important; font-size: 9px !important; }
.build-jutsu-search,
.build-sort-label select { height: 30px !important; font-size: 9px !important; }
.build-jutsu-filters button { width: 27px !important; height: 27px !important; padding: 0 !important; box-shadow: none !important; }
.build-jutsu-selected-grid,
.build-jutsu-grid { gap: 7px !important; padding: 10px !important; }
.build-jutsu-card { box-shadow: none !important; border-radius: 6px !important; }
.build-strategy-shell { padding: 12px !important; font-size: 10px !important; }
.build-strategy-card,
.build-strategy-rule { box-shadow: none !important; border-radius: 7px !important; }

@media (max-width: 900px) {
  .build-shell { width: calc(100vw - 20px) !important; }
  .build-layout { grid-template-columns: 1fr !important; }
  .build-option-row.attitude { grid-template-columns: 25px 1fr !important; }
  .build-option-stats { grid-column: 2 !important; justify-content: flex-start !important; flex-wrap: wrap !important; }
}


/* v43.24 — panneau Académie plus compact et plus propre */
.village-screen .map-layout {
  align-items: start !important;
}

body:has(.village-screen) .village-screen .map-detail.location-choice-panel {
  align-self: start !important;
  min-height: 0 !important;
  height: auto !important;
  max-height: none !important;
  border-radius: 7px !important;
  box-shadow: 0 2px 6px rgba(45,34,19,.14) !important;
}

.village-screen .location-choice-hero {
  min-height: 58px !important;
  padding: 8px 12px !important;
}

.village-screen .location-choice-panel .eyebrow {
  font-size: 8px !important;
}

.village-screen .location-choice-panel h2 {
  font-size: 13px !important;
}

.academy-location-actions {
  gap: 6px !important;
  margin-top: 0 !important;
  padding: 8px 10px 10px !important;
}

.academy-location-actions .location-choice-row {
  width: 100% !important;
  min-height: 34px !important;
  padding: 5px 8px 5px 10px !important;
  border-radius: 5px !important;
  border: 1px solid #d9ccb2 !important;
  background: #fbf8ef !important;
  box-shadow: none !important;
}

.academy-location-actions .location-choice-row > span {
  display: flex !important;
  align-items: baseline !important;
  gap: 5px !important;
  min-width: 0 !important;
}

.academy-location-actions .location-choice-row b {
  font-size: 11px !important;
  line-height: 1.1 !important;
  font-weight: 700 !important;
}

.academy-location-actions .location-choice-row small {
  display: inline !important;
  margin: 0 !important;
  color: #cf4242 !important;
  font-size: 8px !important;
  line-height: 1 !important;
}

.academy-location-actions .location-choice-row em {
  min-width: 30px !important;
  font-size: 11px !important;
}

.academy-location-actions .location-choice-row:hover:not(:disabled) {
  border-color: #d9a54f !important;
  background: #fffaf1 !important;
  transform: none !important;
}

.academy-location-actions .story-mission-action {
  min-height: 36px !important;
  border-color: #dda456 !important;
  background: #fff7e7 !important;
  box-shadow: inset 2px 0 0 #e39a28 !important;
}


/* v43.25 — uniformisation de TOUS les panneaux de lieux de la carte */
.village-screen .map-layout {
  align-items: start !important;
}
body:has(.village-screen) .village-screen .map-detail.location-choice-panel {
  align-self: start !important;
  min-height: 0 !important;
  height: auto !important;
  max-height: none !important;
  overflow: hidden !important;
  border-radius: 7px !important;
  box-shadow: 0 2px 6px rgba(45,34,19,.14) !important;
}
.village-screen .location-choice-hero {
  min-height: 56px !important;
  padding: 7px 11px !important;
}
.village-screen .location-choice-panel .eyebrow {
  font-size: 8px !important;
  line-height: 1 !important;
  letter-spacing: .08em !important;
}
.village-screen .location-choice-panel h2 {
  margin-top: 3px !important;
  font-size: 13px !important;
  line-height: 1.05 !important;
}
.village-screen .location-choice-actions,
.village-screen .academy-location-actions,
.village-screen .baths-location-actions,
.village-screen .shop-category-actions {
  display: grid !important;
  align-content: start !important;
  gap: 6px !important;
  margin: 0 !important;
  padding: 8px 10px 10px !important;
}
.village-screen button.location-choice-row,
.village-screen .academy-location-actions .location-choice-row,
.village-screen .baths-location-actions .location-choice-row,
.village-screen .shop-category-actions .location-choice-row {
  width: 100% !important;
  min-height: 34px !important;
  height: auto !important;
  padding: 5px 8px 5px 10px !important;
  gap: 7px !important;
  border: 1px solid #d9ccb2 !important;
  border-radius: 5px !important;
  background: #fbf8ef !important;
  color: #28251f !important;
  box-shadow: none !important;
  transform: none !important;
}
.village-screen button.location-choice-row:hover:not(:disabled),
.village-screen button.location-choice-row:focus-visible:not(:disabled) {
  border-color: #d9a54f !important;
  background: #fffaf1 !important;
  transform: none !important;
}
.village-screen button.location-choice-row > span {
  min-width: 0 !important;
  display: flex !important;
  align-items: baseline !important;
  gap: 5px !important;
  flex-wrap: wrap !important;
}
.village-screen button.location-choice-row b {
  display: inline !important;
  font-size: 11px !important;
  line-height: 1.1 !important;
  font-weight: 700 !important;
}
.village-screen button.location-choice-row small {
  display: inline !important;
  margin: 0 !important;
  max-width: 100% !important;
  overflow: hidden !important;
  color: #9a7652 !important;
  font-size: 8px !important;
  font-weight: 500 !important;
  line-height: 1 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
.village-screen button.location-choice-row em {
  flex: 0 0 auto !important;
  min-width: 30px !important;
  color: #d28b1f !important;
  font-size: 11px !important;
  line-height: 1 !important;
  font-style: normal !important;
  font-weight: 800 !important;
  text-align: right !important;
}
.village-screen button.location-choice-row:disabled {
  opacity: .58 !important;
}
.village-screen .story-mission-action {
  min-height: 36px !important;
  border-color: #dda456 !important;
  background: #fff7e7 !important;
  box-shadow: inset 2px 0 0 #e39a28 !important;
}
.village-screen .story-mission-action b {
  color: #4a3320 !important;
}
/* QG: boutons de rang compacts */
.village-screen .location-choice-panel button.location-choice-row:not(.story-mission-action) + button.location-choice-row {
  margin-top: 0 !important;
}
/* commerces: garder tout visible sans énormes tuiles */
.village-screen .shop-category-actions {
  gap: 5px !important;
}
.village-screen .shop-category-actions button.location-choice-row {
  min-height: 32px !important;
  padding-block: 4px !important;
}
/* hôpital / bains / portes / temple: infos secondaires discrètes */
.village-screen .baths-location-actions button.location-choice-row small,
.village-screen .location-choice-actions button.location-choice-row small {
  color: #c04a42 !important;
}
/* petits écrans: même logique compacte */
@media (max-width: 700px) {
  .village-screen .location-choice-actions,
  .village-screen .academy-location-actions,
  .village-screen .baths-location-actions,
  .village-screen .shop-category-actions {
    padding: 7px 8px 9px !important;
  }
}


/* v43.26 — les cases d'action remplissent toujours toute la largeur du panneau */
.village-screen .location-choice-panel,
.village-screen .location-choice-panel > *,
.village-screen .location-choice-actions,
.village-screen .academy-location-actions,
.village-screen .baths-location-actions,
.village-screen .shop-category-actions {
  box-sizing: border-box !important;
}
.village-screen .location-choice-actions,
.village-screen .academy-location-actions,
.village-screen .baths-location-actions,
.village-screen .shop-category-actions {
  width: 100% !important;
  max-width: none !important;
  justify-self: stretch !important;
  align-self: stretch !important;
  grid-template-columns: minmax(0, 1fr) !important;
}
.village-screen .location-choice-actions > *,
.village-screen .academy-location-actions > *,
.village-screen .baths-location-actions > *,
.village-screen .shop-category-actions > *,
.village-screen button.location-choice-row {
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  justify-self: stretch !important;
  align-self: stretch !important;
  box-sizing: border-box !important;
}
.village-screen button.location-choice-row {
  display: flex !important;
  justify-content: space-between !important;
}
.village-screen button.location-choice-row > span {
  flex: 1 1 auto !important;
}


/* v43.27 — Builds : reprise plus fidèle des proportions de la référence */
body:has(.build-screen) {
  background: #cab187 !important;
}

.build-screen {
  padding: 10px 7px 24px !important;
  font-size: 11px !important;
}

.build-shell {
  width: min(1180px, calc(100vw - 14px)) !important;
  max-width: 1180px !important;
  gap: 9px !important;
}

/* barre du haut */
.build-topbar {
  min-height: 47px !important;
  height: 47px !important;
  padding: 5px 7px !important;
  border: 1px solid #c8b48f !important;
  border-radius: 7px !important;
  background: #f5eedb !important;
  box-shadow: none !important;
}
.build-slot-tabs {
  height: 100%;
  align-items: center !important;
  gap: 4px !important;
}
.build-slot-tab,
.build-slot-icon {
  width: 34px !important;
  min-width: 34px !important;
  height: 34px !important;
  border-radius: 6px !important;
  font-size: 11px !important;
  box-shadow: none !important;
}
.build-slot-tab.active {
  background: #fff !important;
  border: 1px solid #d3c4a5 !important;
}

/* colonnes */
.build-layout {
  grid-template-columns: 376px minmax(0, 790px) !important;
  gap: 9px !important;
  justify-content: start !important;
}
.build-left-panel,
.build-right-panel {
  border: 1px solid #c6b18a !important;
  border-radius: 7px !important;
  background: #f5eedb !important;
  box-shadow: none !important;
}
.build-left-panel {
  padding: 14px 16px 15px !important;
}

/* ATK / DEF / AGI : label + chiffre sur la même ligne */
.build-primary-stats {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 17px !important;
  margin-bottom: 12px !important;
}
.build-primary-stats .build-stat {
  display: grid !important;
  grid-template-columns: auto 1fr !important;
  grid-template-rows: 23px 4px !important;
  column-gap: 5px !important;
  row-gap: 3px !important;
  align-items: end !important;
  padding: 0 !important;
}
.build-primary-stats .build-stat span {
  grid-column: 1 !important;
  grid-row: 1 !important;
  align-self: center !important;
  font-size: 9px !important;
  line-height: 1 !important;
  font-weight: 800 !important;
}
.build-primary-stats .build-stat strong {
  grid-column: 2 !important;
  grid-row: 1 !important;
  align-self: center !important;
  justify-self: start !important;
  font-size: 22px !important;
  line-height: 22px !important;
  font-weight: 800 !important;
}
.build-primary-stats .build-stat i {
  grid-column: 1 / -1 !important;
  grid-row: 2 !important;
  width: 100% !important;
  height: 4px !important;
  border-radius: 1px !important;
  background: #e7dfcf !important;
}
.build-primary-stats .build-stat i em {
  height: 4px !important;
  border-radius: 1px !important;
}

/* bonus village */
.build-badge-row {
  min-height: 34px !important;
  height: 34px !important;
  margin-bottom: 14px !important;
  padding: 5px 10px !important;
  border: 0 !important;
  border-left: 3px solid #f0b51f !important;
  border-radius: 6px !important;
  background: #faedc8 !important;
  box-shadow: none !important;
}
.build-main-badge {
  font-size: 10px !important;
}
.build-badge-row small {
  font-size: 9px !important;
}

/* fine séparation comme la référence */
.build-badge-row::after {
  content: "";
  position: absolute;
  left: 16px;
  right: 16px;
  transform: translateY(25px);
  height: 1px;
  background: #e1d6bf;
}
.build-badge-row {
  position: relative !important;
}

/* attitude sélectionnée à gauche */
.build-equip-row {
  min-height: 42px !important;
  height: 42px !important;
  margin: 0 0 12px !important;
  padding: 6px 10px !important;
  border-radius: 7px !important;
  box-shadow: none !important;
}
.build-equip-row span {
  font-size: 13px !important;
}
.build-equip-row span small {
  font-size: 9px !important;
}
.build-equip-row strong {
  font-size: 11px !important;
}
.build-equip-row.attitude-offensive {
  border-color: #e6bbb1 !important;
  border-left: 3px solid #b51f25 !important;
  background: #f2e4df !important;
}
.build-equip-row.attitude-offensive strong { color: #b61f25 !important; }
.build-equip-row.attitude-neutral {
  border-color: #efc6a8 !important;
  border-left: 3px solid #ff7042 !important;
  background: #f7e7d9 !important;
}
.build-equip-row.attitude-neutral strong { color: #ff6336 !important; }
.build-equip-row.attitude-defensive {
  border-color: #b9d8e4 !important;
  border-left: 3px solid #1e9ad7 !important;
  background: #e8f0ee !important;
}
.build-equip-row.attitude-defensive strong { color: #197fc0 !important; }
.build-equip-row.attitude-fuyarde {
  border-color: #cad2a9 !important;
  border-left: 3px solid #3e7a20 !important;
  background: #ecebd8 !important;
}
.build-equip-row.attitude-fuyarde strong { color: #3e7027 !important; }

/* équipements */
.build-gear-grid {
  gap: 7px !important;
  margin-bottom: 12px !important;
}
.build-gear-card,
.build-gear-card.locked-slot {
  min-height: 47px !important;
  height: 47px !important;
  padding: 6px 9px !important;
  border-radius: 7px !important;
  box-shadow: none !important;
}
.build-gear-card span {
  font-size: 17px !important;
}
.build-gear-card strong {
  font-size: 9px !important;
}

/* les 6 cases jutsu/verrouillées sont les grandes cases de la référence */
.build-tech-grid {
  gap: 7px !important;
  margin-bottom: 12px !important;
}
.build-tech-card {
  min-height: 136px !important;
  height: 136px !important;
  padding: 5px !important;
  border-radius: 6px !important;
  box-shadow: none !important;
}
.build-tech-card.empty {
  background: #faf4e4 !important;
  border-color: #d3bd99 !important;
}
.build-tech-card.locked {
  background: #f2f1ed !important;
  border-color: #dedbd4 !important;
}
.build-tech-card-add,
.build-locked-level {
  font-size: 8px !important;
}
.build-locked-icon {
  font-size: 17px !important;
}

.build-section-link {
  min-height: 38px !important;
  height: 38px !important;
  padding: 6px 11px !important;
  border-radius: 7px !important;
  box-shadow: none !important;
  font-size: 10px !important;
}

/* grand panneau */
.build-tabs {
  min-height: 51px !important;
  height: 51px !important;
  padding: 8px 14px !important;
  gap: 20px !important;
  background: #f5eedb !important;
  border-bottom: 1px solid #ded2ba !important;
}
.build-tab {
  font-size: 9px !important;
  font-weight: 500 !important;
}
.build-tab.active {
  padding: 4px 8px !important;
  background: #f8dfac !important;
  color: #e9891e !important;
}
.build-close {
  width: 29px !important;
  height: 29px !important;
  border-radius: 6px !important;
  font-size: 17px !important;
}

/* 4 lignes attitudes */
.build-options-list {
  gap: 7px !important;
  padding: 14px !important;
}
.build-option-row.attitude {
  min-height: 50px !important;
  height: 50px !important;
  grid-template-columns: 26px 138px minmax(0, 1fr) !important;
  gap: 7px !important;
  padding: 7px 11px !important;
  border-radius: 7px !important;
  border-width: 1px !important;
  border-left-width: 3px !important;
  box-shadow: none !important;
}
.build-option-row.attitude .build-option-icon {
  width: 24px !important;
  height: 24px !important;
  font-size: 13px !important;
}
.build-option-row.attitude .build-option-name {
  font-size: 11px !important;
  font-weight: 700 !important;
}
.build-option-stats {
  gap: 7px !important;
  font-size: 8px !important;
}
.build-option-stats b {
  padding: 2px 4px !important;
  font-size: 8px !important;
}

/* couleurs individuelles comme sur les captures */
.build-option-row.attitude-offensive {
  border-color: #e2b4ad !important;
  border-left-color: #bd2a2f !important;
  background: #f1e4dc !important;
}
.build-option-row.attitude-neutral {
  border-color: #efc9aa !important;
  border-left-color: #ff7446 !important;
  background: #f7ead8 !important;
}
.build-option-row.attitude-defensive {
  border-color: #bed9df !important;
  border-left-color: #2fa1d8 !important;
  background: #e9efea !important;
}
.build-option-row.attitude-fuyarde {
  border-color: #ccd2ac !important;
  border-left-color: #4b7d2b !important;
  background: #ecebd9 !important;
}

/* la bordure active suit maintenant la vraie couleur de l'attitude */
.build-option-row.attitude-offensive.active {
  border-color: #bd2028 !important;
  border-left-color: #a9141b !important;
  background: #f0deda !important;
}
.build-option-row.attitude-neutral.active {
  border-color: #ff7042 !important;
  border-left-color: #ff7042 !important;
  background: #f8e5d3 !important;
}
.build-option-row.attitude-defensive.active {
  border-color: #159bdb !important;
  border-left-color: #159bdb !important;
  background: #e1eff0 !important;
}
.build-option-row.attitude-fuyarde.active {
  border-color: #4a7a28 !important;
  border-left-color: #3b681f !important;
  background: #e8ead1 !important;
}

/* aucun effet "surélevé" dans Builds */
.build-screen button,
.build-screen .card,
.build-screen [class*="build-"] {
  text-shadow: none;
}
.build-screen button {
  box-shadow: none !important;
}

@media (max-width: 900px) {
  .build-layout {
    grid-template-columns: 1fr !important;
  }
  .build-option-row.attitude {
    height: auto !important;
    min-height: 50px !important;
    grid-template-columns: 26px 1fr !important;
  }
  .build-option-stats {
    grid-column: 2 !important;
  }
}


/* v43.29 — lisibilité/cohérence + stratégie automatique */
:is(.inventory-screen, .missions-journal-screen, .legacy-shop-screen, .academy-combat-prep-screen, .build-screen) .small,
:is(.inventory-screen, .missions-journal-screen, .legacy-shop-screen, .academy-combat-prep-screen, .build-screen) p { color: #5f5444; }
:is(.inventory-screen, .missions-journal-screen, .legacy-shop-screen, .academy-combat-prep-screen, .build-screen) button:disabled { opacity: .55; cursor: not-allowed; }
.build-strategy-rule { grid-template-columns: 22px auto minmax(150px,1fr) auto minmax(135px,.8fr) !important; gap:7px !important; align-items:center !important; }
.build-strategy-rule select,.build-strategy-else select { min-height:30px !important; font-size:10px !important; color:#342c22 !important; background:var(--bg-input) !important; }
.build-strategy-help { margin:10px 0 0 !important; font-size:10px !important; color:#7c6e5a !important; }
.academy-live-action-grid .auto-strategy { grid-column:1/-1; min-height:48px !important; border-color:#8066a9 !important; background:#241f2c !important; color:#f0e7ff !important; }
.academy-live-action-grid .auto-strategy small { color:#c3b1df !important; }


/* v43.30 — catalogue Jutsus officiel courant */
.build-jutsu-filters button.active {
  border-color: #e29a42 !important;
  background: #fff2d7 !important;
  color: #b46b12 !important;
}
.build-jutsu-card:disabled {
  cursor: default !important;
}
.build-jutsu-card .build-jutsu-card-bottom {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 8px !important;
}
.jutsu-verified-note {
  margin: 10px 0 14px !important;
  padding: 10px 12px !important;
  background: #f7efd9 !important;
  border: 1px solid #dac8a5 !important;
}
.jutsu-verified-note p {
  margin: 5px 0 0 !important;
  font-size: 11px !important;
}


/* v43.31 — structure officielle des lieux de Yuukan, sans images obligatoires */
.world-map-screen .map-topbar {
  margin-bottom: 10px;
}
.world-directory {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.world-directory-group {
  padding: 12px !important;
  background: var(--bg-panel) !important;
  border: 1px solid var(--border-primary) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
}
.world-directory-head {
  display: flex;
  align-items: center;
  gap: 9px;
  margin-bottom: 9px;
}
.world-directory-head > span {
  font-size: 20px;
}
.world-directory-head h3 {
  margin: 0 !important;
  color: var(--text-primary) !important;
  font-size: 13px !important;
}
.world-directory-head small {
  color: #7a6a53 !important;
  font-size: 10px !important;
}
.world-place-grid {
  display: grid;
  gap: 6px;
}
.world-place-card {
  width: 100%;
  min-height: 46px;
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr) auto 16px;
  align-items: center;
  gap: 8px;
  padding: 7px 9px;
  border: 1px solid #d6c5a5;
  border-radius: 6px;
  background: #fbf7ed;
  color: #31291f;
  box-shadow: none !important;
  text-align: left;
}
.world-place-card:hover {
  border-color: #dca85b;
  background: var(--bg-card);
  transform: none !important;
}
.world-place-icon {
  font-size: 19px;
  text-align: center;
}
.world-place-copy {
  display: grid;
  gap: 2px;
  min-width: 0;
}
.world-place-copy strong {
  color: #332a20 !important;
  font-size: 11px !important;
}
.world-place-copy small {
  color: #766750 !important;
  font-size: 9px !important;
}
.world-place-state {
  padding: 2px 6px;
  border-radius: 999px;
  background: #e8dec7;
  color: #716149;
  font-size: 8px;
  font-style: normal;
  white-space: nowrap;
}
.world-place-state.hidden {
  background: #e6e3dd;
  color: #898277;
}
.world-place-card em {
  color: #b78a45;
  font-size: 14px;
  font-style: normal;
}
.world-location-screen {
  max-width: 980px;
  margin: 0 auto;
}
.world-location-summary,
.world-location-services {
  margin-top: 10px;
  padding: 14px !important;
  background: var(--bg-panel) !important;
  border: 1px solid var(--border-primary) !important;
  box-shadow: none !important;
}
.world-location-summary h3 {
  margin: 0 0 6px !important;
  font-size: 15px !important;
  color: var(--text-primary) !important;
}
.world-location-summary p {
  margin: 0;
  color: #655842 !important;
  line-height: 1.45;
}
.world-location-warning {
  margin-top: 10px;
  padding: 8px 10px;
  border-radius: 6px;
  background: #eee8dc;
  color: #746a5c;
  font-size: 10px;
}
.world-service-list {
  display: grid;
  gap: 6px;
}
.world-service-row {
  min-height: 40px;
  display: grid;
  grid-template-columns: 14px minmax(0, 1fr) auto;
  align-items: center;
  gap: 7px;
  padding: 6px 9px;
  border: 1px solid #d8c9ad;
  border-radius: 6px;
  background: #fbf7ee;
}
.world-service-row strong {
  color: #3c3023 !important;
  font-size: 11px !important;
}
.world-service-row small {
  color: #8b7c65 !important;
  font-size: 9px !important;
}
@media (max-width: 800px) {
  .world-directory { grid-template-columns: 1fr; }
  .world-place-card { grid-template-columns: 30px minmax(0,1fr) 16px; }
  .world-place-state { display: none; }
  .world-service-row { grid-template-columns: 14px 1fr; }
  .world-service-row small { grid-column: 2; }
}


/* v43.32 — Temple refait d'après la structure visuelle de référence Shinobi.fr */
body:has(.temple-screen) {
  background: #c9ae83 !important;
}
.temple-screen {
  padding: 14px 10px 34px !important;
  color: #30291f;
}
.temple-screen .temple-layout {
  width: min(1195px, calc(100vw - 20px));
  margin: 0 auto;
  grid-template-columns: 220px minmax(0, 1fr) 190px !important;
  gap: 12px !important;
  align-items: start !important;
}
.temple-screen .village-profile-rail,
.temple-screen .shop-side-rail {
  gap: 11px !important;
}
.temple-screen .village-profile-card,
.temple-screen .village-purse-card,
.temple-screen .shop-side-card,
.temple-screen .temple-atmosphere,
.temple-screen .temple-master-card,
.temple-screen .temple-jutsu-section,
.temple-screen .temple-notice {
  background: #f5edd7 !important;
  border: 1px solid #bda67b !important;
  border-radius: 7px !important;
  box-shadow: 0 3px 8px rgba(74, 52, 24, .10) !important;
}
.temple-main-column {
  min-width: 0;
  display: grid;
  gap: 11px;
}
.temple-atmosphere {
  min-height: 39px;
  padding: 10px 13px !important;
  display: flex;
  align-items: center;
  font-size: 12px;
  color: #4b3926;
}
.temple-master-card {
  min-height: 105px;
  padding: 11px !important;
  display: grid;
  grid-template-columns: 62px minmax(0, 1fr) auto;
  gap: 11px;
  align-items: start;
}
.temple-master-portrait {
  width: 58px;
  height: 72px;
  border: 1px solid #a99671;
  border-radius: 5px;
  background: linear-gradient(#e9e0ca, #d7c5a3);
  display: grid;
  place-items: center;
  overflow: hidden;
}
.temple-master-portrait span {
  font-size: 43px;
  line-height: 1;
  transform: translateY(4px);
}
.temple-master-copy {
  min-width: 0;
}
.temple-master-copy > strong {
  display: block;
  margin: 1px 0 7px;
  font-size: 12px;
  color: #2d2419;
}
.temple-master-bubble {
  min-height: 31px;
  padding: 7px 10px;
  border: 1px solid #8f9697;
  border-radius: 5px;
  background: var(--bg-input);
  color: #3b3228;
  font-size: 11px;
  line-height: 1.35;
}
.temple-master-more {
  margin-top: 7px;
  min-height: 25px !important;
  padding: 4px 10px !important;
  font-size: 10px !important;
}
.temple-leave {
  min-height: 28px !important;
  padding: 5px 10px !important;
  font-size: 10px !important;
  white-space: nowrap;
}
.temple-notice {
  padding: 9px 12px !important;
  font-size: 10px;
  color: #6b512d;
}
.temple-jutsu-section {
  padding: 10px 11px 13px !important;
}
.temple-jutsu-section-head {
  min-height: 29px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 9px;
}
.temple-jutsu-section-head h2 {
  margin: 0;
  font-size: 13px;
  color: #31271c;
}
.temple-jutsu-section-head p {
  margin: 2px 0 0;
  font-size: 9px;
  color: #8a785c;
}
.temple-jutsu-section-head > span {
  color: #77664d;
  font-size: 9px;
  font-weight: 700;
}
.temple-jutsu-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 9px;
}
.temple-jutsu-card {
  position: relative;
  min-width: 0;
  height: 113px;
  padding: 7px 7px 8px !important;
  border: 1px solid #5d574f !important;
  border-radius: 5px !important;
  background:
    linear-gradient(rgba(31, 31, 29, .87), rgba(37, 36, 33, .93)),
    linear-gradient(135deg, #807364, #4f4c47) !important;
  box-shadow: 0 2px 4px rgba(46, 37, 25, .18) !important;
  color: #d8d3ca !important;
  text-align: left;
  overflow: hidden;
  display: grid;
  grid-template-rows: auto 1fr auto;
  gap: 7px;
  cursor: pointer;
}
.temple-jutsu-card::after {
  content: "";
  position: absolute;
  inset: 28px 8px 27px;
  border-radius: 4px;
  background: linear-gradient(135deg, rgba(255,255,255,.035), rgba(255,255,255,0));
  pointer-events: none;
}
.temple-jutsu-card:hover {
  transform: translateY(-1px);
  border-color: #c4ab7e !important;
  filter: brightness(1.08);
}
.temple-jutsu-meta {
  display: grid;
  grid-template-columns: 18px 18px 1fr;
  gap: 4px;
  align-items: center;
  font-size: 9px;
  position: relative;
  z-index: 1;
}
.temple-jutsu-nature,
.temple-jutsu-action {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: #7f9186;
  color: #f5f3eb;
  font-size: 9px;
}
.temple-jutsu-card.nin .temple-jutsu-nature { background: #68879a; }
.temple-jutsu-card.gen .temple-jutsu-nature { background: #73907f; }
.temple-jutsu-card.tai .temple-jutsu-nature { background: #9d7974; }
.temple-jutsu-action { background: #7f817f; }
.temple-jutsu-cost {
  justify-self: end;
  padding: 2px 6px;
  border-radius: 8px;
  background: #9aa1a0;
  color: #3d4747;
  font-size: 8px;
  font-weight: 800;
}
.temple-jutsu-name {
  position: relative;
  z-index: 1;
  align-self: center;
  justify-self: stretch;
  text-align: center;
  font-size: 10px;
  line-height: 1.18;
  font-weight: 700;
  color: #bdb8af;
  overflow-wrap: anywhere;
}
.temple-jutsu-origin {
  position: relative;
  z-index: 1;
  min-height: 19px;
  padding: 4px 5px;
  border-radius: 4px;
  background: rgba(122, 96, 76, .28);
  color: #a8907e;
  font-size: 8px;
  text-align: center;
  display: grid;
  place-items: center;
}
.temple-jutsu-card.learned {
  border-color: #65705e !important;
  background: linear-gradient(rgba(39, 42, 36, .90), rgba(44, 45, 40, .95)), linear-gradient(135deg, #70816a, #4f5148) !important;
}
.temple-jutsu-card.learned .temple-jutsu-origin {
  color: #d8dfd0;
  background: rgba(91, 111, 79, .45);
}
.temple-screen .village-profile-card,
.temple-screen .village-purse-card {
  color: #30291f !important;
}
.temple-screen .village-profile-name h2 { color: #211e18 !important; }
.temple-screen .village-profile-name p,
.temple-screen .resource-meter-label,
.temple-screen .profile-art-label,
.temple-screen .purse-row { color: #5a4d39 !important; }
.temple-screen .profile-active-build {
  background: var(--bg-input) !important;
  border-color: #c8b793 !important;
}
.temple-screen .shop-side-card {
  padding: 11px !important;
}
.temple-screen .shop-side-card h3 {
  font-size: 12px !important;
  margin-bottom: 9px !important;
}
.temple-screen .shop-side-body {
  padding: 8px !important;
  min-height: 36px !important;
}
.temple-screen .shop-pass-box {
  min-height: 49px !important;
}
@media (max-width: 1080px) {
  .temple-jutsu-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width: 850px) {
  .temple-screen .temple-layout { grid-template-columns: 1fr !important; }
  .temple-screen .village-profile-rail { grid-template-columns: 1fr 1fr; }
  .temple-screen .shop-side-rail { grid-template-columns: 1fr 1fr; }
  .temple-jutsu-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 560px) {
  .temple-screen .village-profile-rail,
  .temple-screen .shop-side-rail { grid-template-columns: 1fr; }
  .temple-master-card { grid-template-columns: 52px minmax(0, 1fr); }
  .temple-master-portrait { width: 48px; height: 62px; }
  .temple-leave { grid-column: 2; justify-self: start; }
  .temple-jutsu-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}


/* v43.33 — détails de jutsu : verrouillé / appris / équipé */
.jutsu-detail-backdrop {
  position: fixed;
  inset: 0;
  z-index: 9000;
  display: grid;
  place-items: center;
  padding: 20px;
  background: rgba(29, 24, 17, .70);
  backdrop-filter: blur(1px);
}

.jutsu-detail-modal {
  width: min(390px, calc(100vw - 28px));
  overflow: hidden;
  border: 1px solid rgba(93, 72, 45, .58);
  border-radius: 8px;
  background: #f5eed8;
  box-shadow: 0 18px 48px rgba(0,0,0,.30);
  color: #2f2b25;
}

.jutsu-detail-hero {
  position: relative;
  min-height: 122px;
  padding: 25px 14px 14px;
  color: #fff;
  overflow: hidden;
  background:
    radial-gradient(circle at 78% 18%, rgba(255,255,255,.22), transparent 25%),
    radial-gradient(circle at 22% 105%, rgba(255,255,255,.12), transparent 34%),
    linear-gradient(132deg, #6554a6 0%, #7965bd 50%, #4f3d8d 100%);
}

.jutsu-detail-modal.nin .jutsu-detail-hero {
  background:
    radial-gradient(circle at 80% 10%, rgba(255,255,255,.20), transparent 25%),
    linear-gradient(135deg, #3d739b 0%, #4c8cac 50%, #345f7d 100%);
}
.jutsu-detail-modal.tai .jutsu-detail-hero {
  background:
    radial-gradient(circle at 78% 14%, rgba(255,255,255,.18), transparent 27%),
    linear-gradient(135deg, #9d5d51 0%, #bd725d 52%, #784036 100%);
}
.jutsu-detail-modal.gen .jutsu-detail-hero {
  background:
    radial-gradient(circle at 78% 14%, rgba(255,255,255,.18), transparent 27%),
    linear-gradient(135deg, #6650a1 0%, #8769c0 52%, #4e397f 100%);
}

.jutsu-detail-hero::before,
.jutsu-detail-hero::after {
  content: "";
  position: absolute;
  border-radius: 50%;
  border: 1px solid rgba(255,255,255,.12);
  pointer-events: none;
}
.jutsu-detail-hero::before {
  width: 190px;
  height: 190px;
  right: -70px;
  top: -88px;
}
.jutsu-detail-hero::after {
  width: 120px;
  height: 120px;
  left: -45px;
  bottom: -72px;
}

.jutsu-detail-close {
  position: absolute;
  right: 9px;
  top: 8px;
  z-index: 2;
  width: 30px;
  height: 30px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: rgba(29,21,52,.42);
  color: white;
  font: 400 27px/28px Arial, sans-serif;
  box-shadow: none !important;
}

.jutsu-detail-title-row {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-height: 38px;
}
.jutsu-detail-title-row h2 {
  margin: 0;
  color: #fff;
  font-size: 20px;
  line-height: 1.05;
  text-align: center;
  text-shadow: 0 1px 1px rgba(0,0,0,.18);
}
.jutsu-level-pill {
  padding: 3px 6px;
  border-radius: 5px;
  background: rgba(255,255,255,.20);
  color: #fff;
  font-size: 9px;
  font-weight: 800;
}

.jutsu-detail-meta {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 9px;
}
.jutsu-action-pill,
.jutsu-nature-pill,
.jutsu-chakra-pill {
  display: inline-flex;
  align-items: center;
  min-height: 19px;
  padding: 3px 6px;
  border-radius: 5px;
  color: #fff;
  font-size: 8px;
  line-height: 1;
  font-weight: 800;
}
.jutsu-action-pill { background: rgba(135,82,235,.88); }
.jutsu-nature-pill { background: rgba(24,145,222,.92); }
.jutsu-detail-modal.tai .jutsu-nature-pill { background: rgba(220,88,66,.93); }
.jutsu-detail-modal.gen .jutsu-nature-pill { background: rgba(83,122,183,.93); }
.jutsu-chakra-pill {
  margin-left: auto;
  background: #fff;
  color: #2b7db7;
  border: 1px solid rgba(255,255,255,.75);
}

.jutsu-detail-body {
  padding: 25px 18px 16px;
  min-height: 142px;
  background: #f8f0d9;
  text-align: center;
}
.jutsu-detail-description {
  max-width: 330px;
  margin: 0 auto;
  font-size: 12px;
  font-style: italic;
  line-height: 1.55;
  color: #3f3a33;
}
.jutsu-detail-note {
  margin-top: 16px;
  color: #a39c8e;
  font-size: 9px;
  font-style: italic;
}
.jutsu-detail-origin-copy {
  margin-top: 18px;
  color: #8b6f4d;
  font-size: 10px;
}
.jutsu-detail-current-effect {
  margin-top: 18px;
  color: #2e6095;
  font-size: 12px;
  font-weight: 800;
}

.jutsu-level-toggle {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 22px;
  padding: 5px 10px;
  border: 0 !important;
  border-radius: 6px;
  background: #d8eacb !important;
  color: #21824f !important;
  font-size: 9px;
  font-weight: 800;
  text-decoration: underline dotted;
  box-shadow: none !important;
}
.jutsu-level-toggle span { text-decoration: none; }

.jutsu-next-effect {
  display: grid;
  gap: 5px;
  margin: 8px 0 0;
  padding: 14px 12px;
  border: 1px solid #a8cea0;
  border-radius: 8px;
  background: #e8efd2;
  color: #2d5f88;
}
.jutsu-next-effect small {
  color: #69906a;
  font-size: 8px;
  text-transform: uppercase;
  letter-spacing: .05em;
}
.jutsu-next-effect strong {
  font-size: 12px;
}
.jutsu-upgrade-unknown {
  margin-top: 12px;
  color: #998f7d;
  font-size: 9px;
  font-style: italic;
}

.jutsu-detail-footer {
  display: flex;
  justify-content: center;
  gap: 14px;
  padding: 14px 18px 15px;
  border-top: 1px solid #e1d6bd;
  background: #fff;
}
.jutsu-detail-footer button {
  min-height: 52px;
  border-radius: 8px;
  box-shadow: none !important;
}
.jutsu-origin-button {
  min-width: 165px;
  padding: 0 18px;
  border: 0 !important;
  background: #506f79 !important;
  color: #fff !important;
  font-size: 11px;
  font-weight: 800;
}
.jutsu-origin-button span {
  margin-left: 6px;
  font-size: 16px;
}

.jutsu-upgrade-button {
  min-width: 122px;
  display: grid;
  place-content: center;
  gap: 4px;
  padding: 7px 10px;
  border: 0 !important;
  background: #dfdfdf !important;
  color: #fff !important;
}
.jutsu-upgrade-button strong {
  font-size: 11px;
}
.jutsu-upgrade-button span {
  font-size: 8px;
}
.jutsu-upgrade-button:not(:disabled) {
  background: #6f9b77 !important;
}
.jutsu-upgrade-button:disabled {
  opacity: 1 !important;
  cursor: not-allowed;
}

.jutsu-equip-button {
  min-width: 116px;
  padding: 0 16px;
  border: 0 !important;
  background: #ed8d1f !important;
  color: #fff !important;
  font-size: 11px;
  font-weight: 800;
}
.jutsu-equip-button.equipped {
  background: #786d5c !important;
}

.build-jutsu-card.ghost {
  cursor: pointer !important;
}
.build-jutsu-card.ghost:hover {
  opacity: .78 !important;
  transform: translateY(-1px);
}

@media (max-width: 560px) {
  .jutsu-detail-backdrop { padding: 12px; }
  .jutsu-detail-modal { width: min(390px, calc(100vw - 16px)); }
  .jutsu-detail-footer { gap: 8px; }
  .jutsu-upgrade-button,
  .jutsu-equip-button { min-width: 0; flex: 1; }
}


/* v43.34 — popup jutsu plus fidèle aux références Shinobi.fr fournies */
.jutsu-detail-backdrop {
  background: rgba(28, 24, 17, .72) !important;
  backdrop-filter: blur(1.4px) !important;
}

.jutsu-detail-modal {
  width: min(400px, calc(100vw - 24px)) !important;
  border: 1px solid rgba(88, 72, 49, .55) !important;
  border-radius: 7px !important;
  background: #fff !important;
  box-shadow: 0 10px 30px rgba(0,0,0,.31) !important;
}

/* L'image de la référence est simulée avec un fond abstrait : aucune illustration
   n'est inventée ou récupérée ailleurs. La couleur suit surtout le TYPE D'ACTION. */
.jutsu-detail-hero {
  min-height: 104px !important;
  padding: 18px 13px 11px !important;
  border-radius: 6px 6px 0 0 !important;
  background:
    radial-gradient(ellipse at 15% 115%, rgba(255,255,255,.19) 0 12%, transparent 13% 100%),
    radial-gradient(ellipse at 72% -18%, rgba(255,255,255,.18) 0 17%, transparent 18% 100%),
    repeating-radial-gradient(ellipse at 51% 48%, rgba(255,255,255,.09) 0 3px, transparent 4px 18px),
    linear-gradient(132deg, #7864bd 0%, #604ca8 55%, #493d83 100%) !important;
}
.jutsu-detail-modal.action-attack .jutsu-detail-hero {
  background:
    radial-gradient(circle at 14% 8%, rgba(255,220,155,.37) 0 10%, transparent 11% 100%),
    radial-gradient(circle at 78% 96%, rgba(255,196,112,.22) 0 14%, transparent 15% 100%),
    repeating-radial-gradient(ellipse at 52% 52%, rgba(255,231,180,.15) 0 3px, transparent 4px 17px),
    linear-gradient(127deg, #d55742 0%, #d96d48 38%, #bf4550 70%, #b93744 100%) !important;
}
.jutsu-detail-modal.action-parry .jutsu-detail-hero {
  background:
    radial-gradient(circle at 77% 8%, rgba(255,255,255,.20) 0 13%, transparent 14% 100%),
    repeating-radial-gradient(ellipse at 35% 82%, rgba(255,255,255,.08) 0 3px, transparent 4px 22px),
    linear-gradient(132deg, #4f94b8 0%, #4b8eb1 56%, #3d789c 100%) !important;
}
.jutsu-detail-modal.action-dodge .jutsu-detail-hero {
  background:
    radial-gradient(ellipse at 24% 112%, rgba(201,176,255,.25) 0 18%, transparent 19%),
    radial-gradient(circle at 82% 8%, rgba(255,255,255,.18) 0 12%, transparent 13%),
    repeating-radial-gradient(ellipse at 58% 54%, rgba(221,207,255,.10) 0 3px, transparent 4px 20px),
    linear-gradient(128deg, #7a66be 0%, #7559b3 55%, #563b91 100%) !important;
}
.jutsu-detail-modal.action-heal .jutsu-detail-hero {
  background:
    radial-gradient(circle at 78% 12%, rgba(255,255,255,.18) 0 12%, transparent 13%),
    repeating-radial-gradient(circle at 38% 74%, rgba(255,255,255,.09) 0 3px, transparent 4px 22px),
    linear-gradient(130deg, #4eaa82 0%, #398b6e 55%, #2f705b 100%) !important;
}
.jutsu-detail-modal.action-special .jutsu-detail-hero {
  background:
    radial-gradient(circle at 76% 12%, rgba(255,255,255,.17) 0 12%, transparent 13%),
    repeating-radial-gradient(ellipse at 42% 65%, rgba(255,255,255,.08) 0 3px, transparent 4px 20px),
    linear-gradient(130deg, #596574 0%, #4b5666 55%, #363f4d 100%) !important;
}

.jutsu-detail-hero::before {
  width: 155px !important;
  height: 155px !important;
  right: -63px !important;
  top: -83px !important;
  border-color: rgba(255,255,255,.14) !important;
}
.jutsu-detail-hero::after {
  width: 98px !important;
  height: 98px !important;
  left: -42px !important;
  bottom: -68px !important;
  border-color: rgba(255,255,255,.11) !important;
}

.jutsu-detail-close {
  right: 7px !important;
  top: 6px !important;
  width: 27px !important;
  height: 27px !important;
  background: rgba(35,32,48,.42) !important;
  border: 0 !important;
  color: #fff !important;
  font: 300 25px/25px Arial, sans-serif !important;
}

.jutsu-detail-title-row {
  min-height: 43px !important;
  padding-top: 2px !important;
}
.jutsu-detail-title-row h2 {
  font-size: 21px !important;
  font-weight: 800 !important;
  letter-spacing: -.015em !important;
}
.jutsu-level-pill {
  padding: 3px 5px !important;
  border-radius: 4px !important;
  background: rgba(255,255,255,.26) !important;
  font-size: 8px !important;
}
.jutsu-detail-meta {
  margin-top: 4px !important;
  gap: 5px !important;
}
.jutsu-action-pill,
.jutsu-nature-pill,
.jutsu-chakra-pill {
  min-height: 18px !important;
  padding: 3px 6px !important;
  border-radius: 5px !important;
  font-size: 8px !important;
  box-shadow: none !important;
}
.jutsu-action-pill { background: #8d52dc !important; }
.jutsu-detail-modal.action-attack .jutsu-action-pill { background: #ef5a40 !important; }
.jutsu-detail-modal.action-parry .jutsu-action-pill { background: #8a4ed1 !important; }
.jutsu-detail-modal.action-dodge .jutsu-action-pill { background: #8956dd !important; }
.jutsu-detail-modal.action-heal .jutsu-action-pill { background: #35a46f !important; }
.jutsu-detail-modal.action-special .jutsu-action-pill { background: #5b6474 !important; }
.jutsu-nature-pill { background: #1c9be1 !important; }
.jutsu-detail-modal.tai .jutsu-nature-pill { background: #da6750 !important; }
.jutsu-detail-modal.gen .jutsu-nature-pill { background: #6487bd !important; }
.jutsu-chakra-pill {
  padding: 3px 8px !important;
  background: #fff !important;
  color: #338ed0 !important;
  border: 0 !important;
  font-size: 8px !important;
}

.jutsu-detail-body {
  min-height: 108px !important;
  padding: 27px 24px 20px !important;
  background: #f8efd6 !important;
}
.jutsu-detail-description {
  max-width: 340px !important;
  font-size: 11px !important;
  line-height: 1.45 !important;
}
.jutsu-detail-description.verified {
  color: #38699a !important;
  font-size: 12px !important;
  font-style: normal !important;
  font-weight: 800 !important;
}
.jutsu-detail-description.generic {
  color: #3f372e !important;
  font-style: italic !important;
  font-weight: 500 !important;
}
.jutsu-detail-note {
  margin-top: 20px !important;
  color: #aaa293 !important;
  font-size: 9px !important;
  font-style: italic !important;
}
.jutsu-detail-note span {
  margin-right: 3px !important;
  color: #bbb3a5 !important;
  font-style: normal !important;
}
.jutsu-detail-origin-copy { display: none !important; }

.jutsu-detail-current-effect {
  margin-top: 17px !important;
  color: #315f91 !important;
  font-size: 12px !important;
}
.jutsu-level-toggle {
  margin-top: 21px !important;
  padding: 4px 9px !important;
  border-radius: 6px !important;
  background: #dcebd1 !important;
  font-size: 9px !important;
}
.jutsu-next-effect {
  margin-top: 8px !important;
  padding: 12px 10px !important;
  border-radius: 7px !important;
  background: #e8efd5 !important;
}

.jutsu-detail-footer {
  min-height: 82px !important;
  padding: 14px 18px !important;
  align-items: center !important;
  background: #fff !important;
  border-top: 1px solid #e8e3da !important;
}
.jutsu-detail-footer button {
  min-height: 48px !important;
  border-radius: 7px !important;
}
.jutsu-origin-button {
  min-width: 166px !important;
  height: 48px !important;
  padding: 0 14px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 5px !important;
  background: #557680 !important;
  font-size: 10px !important;
  font-weight: 800 !important;
}
.jutsu-origin-button .origin-icon {
  font-size: 13px !important;
  transform: rotate(-10deg);
}
.jutsu-origin-button .origin-arrow {
  margin-left: 0 !important;
  font-size: 16px !important;
}

.jutsu-upgrade-button,
.jutsu-equip-button {
  min-height: 52px !important;
}

@media (max-width: 560px) {
  .jutsu-detail-modal { width: min(400px, calc(100vw - 16px)) !important; }
  .jutsu-detail-hero { min-height: 100px !important; }
  .jutsu-detail-body { padding-left: 18px !important; padding-right: 18px !important; }
}


/* v43.35 — Temple : prérequis sur les cartes + popup verrouillé fidèle */
.temple-jutsu-card {
  min-height: 112px !important;
}
.temple-jutsu-origin.requirement {
  min-height: 30px !important;
  display: grid !important;
  place-items: center !important;
  padding: 4px 6px !important;
  border: 1px solid rgba(190,117,92,.22) !important;
  border-radius: 4px !important;
  background: rgba(161,104,85,.16) !important;
  color: #bd7b69 !important;
  font-size: 8px !important;
  font-weight: 700 !important;
  line-height: 1.15 !important;
}
.temple-jutsu-origin.requirement.met {
  border-color: rgba(90,135,82,.22) !important;
  background: rgba(110,150,96,.13) !important;
  color: #6f9361 !important;
}
.temple-jutsu-origin.requirement.unknown {
  border-color: rgba(145,137,123,.18) !important;
  background: rgba(132,125,113,.11) !important;
  color: #a49b8c !important;
}
.temple-jutsu-origin.learned {
  color: #e8e2d5 !important;
  font-weight: 800 !important;
}
.temple-jutsu-cost {
  display: inline-flex !important;
  align-items: center !important;
  gap: 2px !important;
}
.temple-secondary-cost {
  color: #8bc879 !important;
  font-weight: 800 !important;
}

.jutsu-detail-modal {
  width: min(400px, calc(100vw - 20px)) !important;
}
.jutsu-detail-hero {
  min-height: 101px !important;
  padding: 16px 11px 10px !important;
}
.jutsu-detail-title-row {
  min-height: 40px !important;
}
.jutsu-detail-title-row h2 {
  font-size: 20px !important;
}
.jutsu-detail-meta {
  margin-top: 2px !important;
}
.jutsu-chakra-pill {
  display: inline-flex !important;
  align-items: center !important;
  gap: 3px !important;
}
.jutsu-chakra-pill b {
  color: #a08f78 !important;
  font-weight: 700 !important;
}
.jutsu-secondary-cost {
  color: #59a958 !important;
  font-weight: 800 !important;
}

.jutsu-detail-body {
  min-height: 139px !important;
  padding: 28px 26px 23px !important;
}
.jutsu-detail-description.verified {
  max-width: 335px !important;
  color: #4e4439 !important;
  font-size: 11px !important;
  font-style: italic !important;
  font-weight: 500 !important;
  line-height: 1.48 !important;
}
.jutsu-detail-locked-effect {
  margin-top: 18px !important;
  color: #35669b !important;
  font-size: 12px !important;
  font-weight: 800 !important;
}
.jutsu-detail-note {
  margin-top: 18px !important;
}

.jutsu-detail-footer.requirement-footer {
  min-height: 86px !important;
  padding: 15px 18px !important;
}
.jutsu-requirement-pill {
  min-width: 132px !important;
  min-height: 33px !important;
  display: inline-grid !important;
  place-items: center !important;
  padding: 7px 13px !important;
  border-radius: 7px !important;
  border: 1px solid #ffc0b8 !important;
  background: #fff0ee !important;
  color: #e05449 !important;
  font-size: 9px !important;
  font-weight: 800 !important;
  text-transform: lowercase !important;
}
.jutsu-requirement-pill.met {
  border-color: #b8d9b2 !important;
  background: #eef7e9 !important;
  color: #5a8f50 !important;
}
.jutsu-requirement-pill.unknown {
  border-color: #ddd5c7 !important;
  background: #f4f1eb !important;
  color: #998f80 !important;
  text-transform: none !important;
}


/* ================================================================
   PALETTES GLOBALES : JOUR / NUIT / CLASSIQUE
   Tokens semantiques uniques. Les ecrans utilisent var(--text-primary)
   etc. — ne pas recoder var(--bg-panel) / #2b2118 dans les composants.
   ================================================================ */

/* THEME_TOKENS_START */
body.theme-day {
  --bg-page: #f3ead6;
  --bg-panel: #fffaf0;
  --bg-panel-alt: #f4ead8;
  --bg-card: #fffdf6;
  --bg-input: #fffef9;
  --text-primary: #2a241c;
  --text-secondary: #6a5c48;
  --text-muted: #8a7b66;
  --text-inverse: #f7f1e4;
  --border-primary: #d4c4a0;
  --border-soft: #e6d9be;
  --accent: #c47a28;
  --accent-hover: #a8641c;
  --accent-text: #fff8ee;
  --button-primary-bg: #e8b45c;
  --button-primary-text: #3a2a12;
  --button-primary-border: #c48a32;
  --button-primary-hover: #f0c270;
  --button-secondary-bg: #efe4cc;
  --button-secondary-text: #3a2f22;
  --button-secondary-border: #d2c09a;
  --button-secondary-hover: #f6edd8;
  --button-danger-bg: #c45a4a;
  --button-danger-text: #fff6f0;
  --button-disabled-bg: #e8dfcc;
  --button-disabled-text: #8a7d6a;
  --success: #3f8a58;
  --warning: #b07a1c;
  --danger: #b44538;
  --info: #3d6e8c;
  --stat-positive: #2e7a48;
  --stat-negative: #b44538;
  --shop-stat-positive: var(--stat-positive);
  --shop-stat-negative: var(--stat-negative);
  --nr-page: var(--bg-page);
  --nr-page-deep: #e4d6b8;
  --nr-surface: var(--bg-panel);
  --nr-surface-2: var(--bg-card);
  --nr-surface-3: var(--bg-panel-alt);
  --nr-line: var(--border-primary);
  --nr-line-soft: var(--border-soft);
  --nr-text: var(--text-primary);
  --nr-muted: var(--text-secondary);
  --nr-control: var(--button-secondary-bg);
  --nr-control-hover: var(--button-secondary-hover);
  --nr-header: #1a1714;
  --nr-header-2: #2a2620;
  --nr-header-text: #e8e0d0;
  --nr-shadow: 0 2px 8px rgba(59,45,27,.14);
  --dropdown-bg: #f9f3e3;
  --dropdown-text: #3a2c1c;
  --dropdown-divider: #c7b091;
  --dropdown-hover-bg: #f5edd4;
  --dropdown-hover-text: #c17f1e;
  --dropdown-active-bg: rgba(224, 140, 41, .15);
  --dropdown-active-text: #e08c29;
  --dropdown-icon: #e08c29;
}

body.theme-classic {
  --bg-page: #cbb58d;
  --bg-panel: #f4ecd6;
  --bg-panel-alt: #efe5cb;
  --bg-card: #fbf7ec;
  --bg-input: #fffdf8;
  --text-primary: #2a241c;
  --text-secondary: #6a5840;
  --text-muted: #7d6b52;
  --text-inverse: #f7f1e4;
  --border-primary: #bca77d;
  --border-soft: #d8c8aa;
  --accent: #c95743;
  --accent-hover: #a93e38;
  --accent-text: #fff5e8;
  --button-primary-bg: #dcb05a;
  --button-primary-text: #3a2a14;
  --button-primary-border: #c79343;
  --button-primary-hover: #eed08a;
  --button-secondary-bg: #f8efd8;
  --button-secondary-text: #4c412e;
  --button-secondary-border: #c4b48d;
  --button-secondary-hover: #fff6e4;
  --button-danger-bg: #b44548;
  --button-danger-text: #fff5e8;
  --button-disabled-bg: #e6dcc4;
  --button-disabled-text: #8a7a62;
  --success: #4a7a4e;
  --warning: #b8862a;
  --danger: #c94d52;
  --info: #4a6e82;
  --stat-positive: #3d7044;
  --stat-negative: #a83c3c;
  --shop-stat-positive: var(--stat-positive);
  --shop-stat-negative: var(--stat-negative);
  --nr-page: var(--bg-page);
  --nr-page-deep: #bca174;
  --nr-surface: var(--bg-panel);
  --nr-surface-2: var(--bg-card);
  --nr-surface-3: var(--bg-panel-alt);
  --nr-line: var(--border-primary);
  --nr-line-soft: var(--border-soft);
  --nr-text: var(--text-primary);
  --nr-muted: var(--text-secondary);
  --nr-control: var(--button-secondary-bg);
  --nr-control-hover: var(--button-secondary-hover);
  --nr-header: #111312;
  --nr-header-2: #252724;
  --nr-header-text: #d5d5d0;
  --nr-shadow: 0 2px 7px rgba(59,45,27,.14);
  --dropdown-bg: #2A2A2A;
  --dropdown-text: #a3a3a3;
  --dropdown-divider: rgba(255,255,255,.1);
  --dropdown-hover-bg: rgba(255,255,255,.1);
  --dropdown-hover-text: #ffffff;
  --dropdown-active-bg: rgba(224, 140, 41, .15);
  --dropdown-active-text: #BFAB7A;
  --dropdown-icon: #BFAB7A;
}

body.theme-night {
  --bg-page: #0a1118;
  --bg-panel: #15202a;
  --bg-panel-alt: #1b2833;
  --bg-card: #1a2731;
  --bg-input: #121c24;
  --text-primary: #eef3f6;
  --text-secondary: #b7c3cc;
  --text-muted: #93a2ac;
  --text-inverse: #0e141a;
  --border-primary: #33424c;
  --border-soft: #28343d;
  --accent: #7eb3d4;
  --accent-hover: #9bc6e0;
  --accent-text: #0e141a;
  --button-primary-bg: #3d6a88;
  --button-primary-text: #f2f7fa;
  --button-primary-border: #4e7e9e;
  --button-primary-hover: #4a7c9c;
  --button-secondary-bg: #1c2a34;
  --button-secondary-text: #dce6ec;
  --button-secondary-border: #33424c;
  --button-secondary-hover: #243440;
  --button-danger-bg: #a84848;
  --button-danger-text: #fff2f0;
  --button-disabled-bg: #1a242c;
  --button-disabled-text: #8a969e;
  --success: #6ecf8e;
  --warning: #e0b45c;
  --danger: #e06a6a;
  --info: #7eb3d4;
  --stat-positive: #7ed9a0;
  --stat-negative: #f08a7a;
  --shop-stat-positive: var(--stat-positive);
  --shop-stat-negative: var(--stat-negative);
  --nr-page: var(--bg-page);
  --nr-page-deep: #060b0f;
  --nr-surface: var(--bg-panel);
  --nr-surface-2: var(--bg-card);
  --nr-surface-3: var(--bg-panel-alt);
  --nr-line: var(--border-primary);
  --nr-line-soft: var(--border-soft);
  --nr-text: var(--text-primary);
  --nr-muted: var(--text-secondary);
  --nr-control: var(--button-secondary-bg);
  --nr-control-hover: var(--button-secondary-hover);
  --nr-header: #080d10;
  --nr-header-2: #182127;
  --nr-header-text: #c9d0d3;
  --nr-shadow: 0 2px 7px rgba(0,0,0,.38);
  --dropdown-bg: #0e1115;
  --dropdown-text: #e0e0e0;
  --dropdown-divider: #1c2128;
  --dropdown-hover-bg: #12161b;
  --dropdown-hover-text: #ffaa28;
  --dropdown-active-bg: rgba(255, 170, 40, .15);
  --dropdown-active-text: #ffaa28;
  --dropdown-icon: #ffaa28;
}

body.theme-day,
body.theme-classic,
body.theme-night {
  --text: var(--text-primary);
  --muted: var(--text-secondary);
  --bg: var(--bg-page);
  --panel: var(--bg-panel);
  --panel-2: var(--bg-panel-alt);
  --paper-page: var(--bg-page);
  --paper-panel: var(--bg-panel);
  --paper-panel-2: var(--bg-card);
  --paper-panel-3: var(--bg-panel-alt);
  --paper-border: var(--border-primary);
  --paper-border-soft: var(--border-soft);
  --paper-text: var(--text-primary);
  --paper-muted: var(--text-secondary);
  --paper-accent: var(--accent);
  --paper-accent-dark: var(--accent-hover);
  color: var(--text-primary);
  background: var(--bg-page);
}
/* THEME_TOKENS_END */


/* page globale */
body.theme-classic,
body.theme-day,
body.theme-night,
body.theme-classic:has(.build-screen),
body.theme-day:has(.build-screen),
body.theme-night:has(.build-screen),
body.theme-classic:has(.village-screen),
body.theme-day:has(.village-screen),
body.theme-night:has(.village-screen),
body.theme-classic:has(.inventory-screen),
body.theme-day:has(.inventory-screen),
body.theme-night:has(.inventory-screen),
body.theme-classic:has(.shop-screen),
body.theme-day:has(.shop-screen),
body.theme-night:has(.shop-screen),
body.theme-classic:has(.temple-screen),
body.theme-day:has(.temple-screen),
body.theme-night:has(.temple-screen),
body.theme-classic:has(.missions-journal-screen),
body.theme-day:has(.missions-journal-screen),
body.theme-night:has(.missions-journal-screen) {
  background: var(--nr-page) !important;
  color: var(--nr-text) !important;
}

/* Header reste noir dans les trois références */
body.theme-classic .game-header,
body.theme-day .game-header,
body.theme-night .game-header {
  background: var(--nr-header) !important;
  border-bottom-color: #262924 !important;
  color: var(--nr-header-text) !important;
}
body.theme-classic .game-header .game-nav-link,
body.theme-day .game-header .game-nav-link {
  color: #f1e9d9 !important;
}
body.theme-night .game-header .game-nav-link {
  color: #bdbdbd !important;
}
body.theme-classic .game-header .game-nav-link:hover,
body.theme-day .game-header .game-nav-link:hover,
body.theme-night .game-header .game-nav-link:hover,
body.theme-classic .game-header .game-nav-link.is-active,
body.theme-day .game-header .game-nav-link.is-active,
body.theme-night .game-header .game-nav-link.is-active {
  background: var(--nr-header-2) !important;
  color: #fff !important;
}

/* surfaces générales */
body.theme-classic .screen .card,
body.theme-day .screen .card,
body.theme-night .screen .card,
body.theme-classic .screen .topbar,
body.theme-day .screen .topbar,
body.theme-night .screen .topbar {
  background: var(--nr-surface) !important;
  border-color: var(--nr-line) !important;
  color: var(--nr-text) !important;
  box-shadow: var(--nr-shadow) !important;
}

body.theme-classic .screen h1,
body.theme-classic .screen h2,
body.theme-classic .screen h3,
body.theme-classic .screen strong,
body.theme-day .screen h1,
body.theme-day .screen h2,
body.theme-day .screen h3,
body.theme-day .screen strong,
body.theme-night .screen h1,
body.theme-night .screen h2,
body.theme-night .screen h3,
body.theme-night .screen strong {
  color: var(--nr-text);
}
body.theme-classic .screen p,
body.theme-classic .screen .small,
body.theme-day .screen p,
body.theme-day .screen .small,
body.theme-night .screen p,
body.theme-night .screen .small {
  color: var(--nr-muted);
}

/* contrôles neutres */
body.theme-classic .screen input,
body.theme-classic .screen select,
body.theme-classic .screen textarea,
body.theme-day .screen input,
body.theme-day .screen select,
body.theme-day .screen textarea,
body.theme-night .screen input,
body.theme-night .screen select,
body.theme-night .screen textarea {
  background: var(--nr-surface-2) !important;
  border-color: var(--nr-line) !important;
  color: var(--nr-text) !important;
}

body.theme-classic button.secondary,
body.theme-day button.secondary,
body.theme-night button.secondary {
  background: var(--nr-control) !important;
  border-color: var(--nr-line) !important;
  color: var(--nr-text) !important;
  box-shadow: none !important;
}
body.theme-classic button.secondary:hover,
body.theme-day button.secondary:hover,
body.theme-night button.secondary:hover {
  background: var(--nr-control-hover) !important;
}

/* menu hamburger : palettes Shinobi (--dropdown-*) */
body.theme-classic .game-account-dropdown,
body.theme-day .game-account-dropdown,
body.theme-night .game-account-dropdown {
  background: var(--dropdown-bg) !important;
  border-color: var(--dropdown-divider) !important;
  color: var(--dropdown-text) !important;
}
body.theme-classic .game-account-dropdown .game-menu-item,
body.theme-day .game-account-dropdown .game-menu-item,
body.theme-night .game-account-dropdown .game-menu-item {
  color: var(--dropdown-text) !important;
}
body.theme-classic .game-account-dropdown .game-menu-item:hover:not(:disabled),
body.theme-day .game-account-dropdown .game-menu-item:hover:not(:disabled),
body.theme-night .game-account-dropdown .game-menu-item:hover:not(:disabled) {
  background: var(--dropdown-hover-bg) !important;
  color: var(--dropdown-hover-text) !important;
}
body.theme-classic .game-reset-menu,
body.theme-day .game-reset-menu {
  border-top-color: var(--border-soft) !important;
}
body.theme-night .game-reset-menu { border-top-color: #2a3740 !important; }

/* BUILDS — reproduit les trois captures fournies */
body.theme-classic .build-topbar,
body.theme-classic .build-left-panel,
body.theme-classic .build-right-panel,
body.theme-day .build-topbar,
body.theme-day .build-left-panel,
body.theme-day .build-right-panel,
body.theme-night .build-topbar,
body.theme-night .build-left-panel,
body.theme-night .build-right-panel {
  background: var(--nr-surface) !important;
  border-color: var(--nr-line) !important;
  color: var(--nr-text) !important;
  box-shadow: var(--nr-shadow) !important;
}
body.theme-day .build-content-area,
body.theme-classic .build-content-area {
  background: var(--nr-surface-2) !important;
}
body.theme-night .build-content-area {
  background: #121b23 !important;
}
body.theme-day .build-tabs,
body.theme-classic .build-tabs,
body.theme-night .build-tabs {
  background: var(--nr-surface) !important;
  border-bottom-color: var(--nr-line-soft) !important;
}
body.theme-night .build-tab { color:#8e9aa2 !important; }
body.theme-night .build-tab.active {
  background:#25313a !important;
  color:#d8dee2 !important;
}

/* Les cases d'équipement restent parchemin même en nuit, comme la référence. */
body.theme-night .build-gear-card:not(.locked-slot),
body.theme-night .build-tech-card.empty {
  background: #f1e7ce !important;
  border-color: #cdb990 !important;
  color: #b29e7b !important;
}
body.theme-night .build-gear-card.locked-slot,
body.theme-night .build-tech-card.locked {
  background: #747e84 !important;
  border-color: #879096 !important;
  color: #aab0b4 !important;
}
body.theme-day .build-gear-card,
body.theme-day .build-tech-card.empty,
body.theme-classic .build-gear-card,
body.theme-classic .build-tech-card.empty {
  background: #faf3df !important;
  border-color: #d3bd98 !important;
}
body.theme-day .build-tech-card.locked,
body.theme-classic .build-tech-card.locked {
  background:#f0f0ed !important;
  border-color:#deded9 !important;
}

/* INVENTAIRE / BOUTIQUES */
body.theme-classic .legacy-shop-shell,
body.theme-day .legacy-shop-shell,
body.theme-night .legacy-shop-shell,
body.theme-classic .inventory-browser-card,
body.theme-day .inventory-browser-card,
body.theme-night .inventory-browser-card,
body.theme-classic .legacy-shop-stock-card,
body.theme-day .legacy-shop-stock-card,
body.theme-night .legacy-shop-stock-card {
  color: var(--nr-text) !important;
}
body.theme-classic .inventory-toolbar,
body.theme-classic .inventory-tabs,
body.theme-day .inventory-toolbar,
body.theme-day .inventory-tabs,
body.theme-night .inventory-toolbar,
body.theme-night .inventory-tabs {
  background: var(--nr-surface) !important;
  border-color: var(--nr-line) !important;
}
body.theme-classic .inventory-legacy-row,
body.theme-classic .legacy-shop-row,
body.theme-day .inventory-legacy-row,
body.theme-day .legacy-shop-row {
  background: var(--nr-surface-2) !important;
  border-color: var(--nr-line-soft) !important;
  color: var(--nr-text) !important;
}
body.theme-night .inventory-legacy-row,
body.theme-night .legacy-shop-row {
  background: var(--bg-card) !important;
  border-color: var(--border-soft) !important;
  color: var(--text-primary) !important;
}
body.theme-night .inventory-legacy-desc,
body.theme-night .inventory-legacy-kind,
body.theme-night .inventory-legacy-sell,
body.theme-night .legacy-shop-desc,
body.theme-night .legacy-shop-owned {
  color: var(--text-secondary) !important;
}

/* TEMPLE / PROFIL / COLONNES SHOP */
body.theme-classic .temple-main-column > .card,
body.theme-classic .shop-side-card,
body.theme-classic .village-profile-card,
body.theme-classic .village-purse-card,
body.theme-day .temple-main-column > .card,
body.theme-day .shop-side-card,
body.theme-day .village-profile-card,
body.theme-day .village-purse-card,
body.theme-night .temple-main-column > .card,
body.theme-night .shop-side-card,
body.theme-night .village-profile-card,
body.theme-night .village-purse-card {
  background: var(--nr-surface) !important;
  border-color: var(--nr-line) !important;
  color: var(--nr-text) !important;
}
body.theme-classic .temple-master-bubble,
body.theme-day .temple-master-bubble,
body.theme-night .temple-master-bubble,
body.theme-classic .shop-mission-summary,
body.theme-day .shop-mission-summary,
body.theme-night .shop-mission-summary,
body.theme-classic .shop-pass-box,
body.theme-day .shop-pass-box,
body.theme-night .shop-pass-box {
  background: var(--bg-card) !important;
  border-color: var(--border-soft) !important;
  color: var(--text-primary) !important;
}

/* Les cartes de jutsu gardent leur identité sombre dans les trois palettes. */
body.theme-classic .temple-jutsu-card,
body.theme-day .temple-jutsu-card,
body.theme-night .temple-jutsu-card,
body.theme-classic .build-jutsu-card,
body.theme-day .build-jutsu-card,
body.theme-night .build-jutsu-card {
  background-color:#403e39 !important;
  color:#c8c5bc !important;
}

/* MISSIONS / MONDE */
body.theme-classic .world-place-card,
body.theme-classic .world-service-row,
body.theme-classic .mission-step-row,
body.theme-classic .mission-progress-row,
body.theme-day .world-place-card,
body.theme-day .world-service-row,
body.theme-day .mission-step-row,
body.theme-day .mission-progress-row {
  background:var(--nr-surface-2) !important;
  border-color:var(--nr-line-soft) !important;
  color:var(--nr-text) !important;
}
body.theme-night .world-place-card,
body.theme-night .world-service-row,
body.theme-night .mission-step-row,
body.theme-night .mission-progress-row {
  background:#17222a !important;
  border-color:#2a3740 !important;
  color:#d4dbdf !important;
}

/* VILLAGE / panneaux autour de la carte */
body.theme-classic:has(.village-screen) .village-profile-card,
body.theme-classic:has(.village-screen) .village-purse-card,
body.theme-classic:has(.village-screen) .village-activity-chat,
body.theme-day:has(.village-screen) .village-profile-card,
body.theme-day:has(.village-screen) .village-purse-card,
body.theme-day:has(.village-screen) .village-activity-chat,
body.theme-night:has(.village-screen) .village-profile-card,
body.theme-night:has(.village-screen) .village-purse-card,
body.theme-night:has(.village-screen) .village-activity-chat {
  background:var(--nr-surface) !important;
  border-color:var(--nr-line) !important;
  color:var(--nr-text) !important;
}
body.theme-day:has(.village-screen) .location-choice-panel,
body.theme-classic:has(.village-screen) .location-choice-panel {
  background:#2e2a22 !important;
  border-color:#74664d !important;
}
body.theme-night:has(.village-screen) .location-choice-panel {
  background:#111a20 !important;
  border-color:#2b3942 !important;
}
body.theme-night:has(.village-screen) .village-profile-card h2,
body.theme-night:has(.village-screen) .village-profile-card h3,
body.theme-night:has(.village-screen) .village-profile-card p {
  color:var(--nr-text) !important;
}
body.theme-night:has(.village-screen) .village-profile-card .bar {
  background:#26343d !important;
}
body.theme-day:has(.village-screen) .village-profile-card .bar,
body.theme-classic:has(.village-screen) .village-profile-card .bar {
  background:#e2d6b8 !important;
}

/* ACADÉMIE / combat / écrans divers */
body.theme-classic .academy-prep-main,
body.theme-classic .academy-prep-side,
body.theme-classic .academy-launch-card,
body.theme-day .academy-prep-main,
body.theme-day .academy-prep-side,
body.theme-day .academy-launch-card,
body.theme-night .academy-prep-main,
body.theme-night .academy-prep-side,
body.theme-night .academy-launch-card {
  background:var(--nr-surface) !important;
  border-color:var(--nr-line) !important;
  color:var(--nr-text) !important;
}

/* OPTIONS — changent elles-mêmes avec la palette */
body.theme-classic .options-panel,
body.theme-day .options-panel,
body.theme-night .options-panel {
  background: var(--nr-surface) !important;
  border-color: var(--nr-line) !important;
  color: var(--nr-text) !important;
  box-shadow: var(--nr-shadow) !important;
}
body.theme-classic .options-head p,
body.theme-day .options-head p { color:#81735d !important; }
body.theme-night .options-head p { color:#87949c !important; }

body.theme-classic .option-setting,
body.theme-classic .volume-setting,
body.theme-day .option-setting,
body.theme-day .volume-setting {
  background:#fff9ec !important;
  border-color:#d5c4a2 !important;
  color:#3d352a !important;
}
body.theme-night .option-setting,
body.theme-night .volume-setting {
  background:#19252e !important;
  border-color:#2f3e48 !important;
  color:#d8dfe2 !important;
}
body.theme-classic .option-setting small,
body.theme-day .option-setting small { color:#8b7c63 !important; }
body.theme-night .option-setting small { color:#839099 !important; }

.theme-setting-block {
  margin-top:20px;
  padding:14px;
  border:1px solid var(--nr-line);
  border-radius:13px;
  background:var(--nr-surface-2);
}
.theme-setting-head {
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
  margin-bottom:12px;
}
.theme-setting-head strong,
.theme-setting-head small { display:block; }
.theme-setting-head strong { color:var(--nr-text); font-size:13px; }
.theme-setting-head small { margin-top:3px; color:var(--nr-muted); font-size:11px; }
.theme-setting-head > span {
  padding:4px 7px;
  border-radius:5px;
  background:var(--nr-surface-3);
  color:var(--nr-text);
  font-size:10px;
  font-weight:800;
}
.theme-choice-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px;
}
.theme-choice {
  display:grid;
  gap:6px;
  min-width:0;
  padding:9px;
  border:1px solid var(--nr-line) !important;
  border-radius:8px !important;
  background:var(--nr-control) !important;
  color:var(--nr-text) !important;
  box-shadow:none !important;
  text-align:left;
}
.theme-choice:hover {
  transform:none !important;
  background:var(--nr-control-hover) !important;
}
.theme-choice.active {
  border-color:#dc8a28 !important;
  box-shadow:inset 0 0 0 1px #dc8a28 !important;
}
.theme-choice strong {
  font-size:11px;
  color:var(--nr-text) !important;
}
.theme-choice small {
  min-height:28px;
  font-size:9px;
  line-height:1.35;
  color:var(--nr-muted) !important;
}
.theme-choice-preview {
  display:grid;
  grid-template-columns:1fr 1.7fr .7fr;
  gap:2px;
  height:34px;
  padding:3px;
  border-radius:5px;
  overflow:hidden;
}
.theme-choice-preview i { display:block; border-radius:2px; }
.preview-classic { background:var(--bg-page); }
.preview-classic i:nth-child(1) { background:#f5eedb; }
.preview-classic i:nth-child(2) { background:var(--bg-card); }
.preview-classic i:nth-child(3) { background:#2d2a23; }
.preview-day { background:#2d2d2b; }
.preview-day i:nth-child(1) { background:#f4f4f2; }
.preview-day i:nth-child(2) { background:#fff; }
.preview-day i:nth-child(3) { background:#dcdcd8; }
.preview-night { background:#080e12; }
.preview-night i:nth-child(1) { background:#121b23; }
.preview-night i:nth-child(2) { background:#17222b; }
.preview-night i:nth-child(3) { background:#293640; }

/* notifications suivent la palette */
body.theme-classic .village-notice,
body.theme-day .village-notice {
  background:#fff7e6 !important;
  border-color:#c6b58f !important;
  color:#514735 !important;
}
body.theme-night .village-notice {
  background:#17222a !important;
  border-color:#33424c !important;
  color:#d5dde1 !important;
}

/* Popup jutsu : volontairement indépendant de la palette, comme sur Shinobi. */

@media (max-width:620px) {
  .theme-choice-grid { grid-template-columns:1fr; }
  .theme-choice { grid-template-columns:72px 1fr; align-items:center; }
  .theme-choice-preview { grid-row:1 / span 2; }
  .theme-choice small { min-height:0; }
}


/* ================================================================
   v43.37 — CORRECTION DES PALETTES
   Référence fournie :
   JOUR      = beige / parchemin
   NUIT      = bleu-noir / panneaux sombres
   CLASSIQUE = fond anthracite / panneaux blancs
   ================================================================ */

/* 1) Alias --nr-* / --paper-* vers les tokens semantiques */
body.theme-day,
body.theme-classic,
body.theme-night {
  --nr-page: var(--bg-page) !important;
  --nr-page-deep: var(--bg-page) !important;
  --nr-surface: var(--bg-panel) !important;
  --nr-surface-2: var(--bg-card) !important;
  --nr-surface-3: var(--bg-panel-alt) !important;
  --nr-line: var(--border-primary) !important;
  --nr-line-soft: var(--border-soft) !important;
  --nr-text: var(--text-primary) !important;
  --nr-muted: var(--text-secondary) !important;
  --nr-control: var(--button-secondary-bg) !important;
  --nr-control-hover: var(--button-secondary-hover) !important;
}

body.theme-day :is(.build-screen, .inventory-screen, .missions-journal-screen, .legacy-shop-screen, .academy-combat-prep-screen),
body.theme-classic :is(.build-screen, .inventory-screen, .missions-journal-screen, .legacy-shop-screen, .academy-combat-prep-screen),
body.theme-night :is(.build-screen, .inventory-screen, .missions-journal-screen, .legacy-shop-screen, .academy-combat-prep-screen) {
  --paper-page: var(--bg-page) !important;
  --paper-panel: var(--bg-panel) !important;
  --paper-panel-2: var(--bg-card) !important;
  --paper-panel-3: var(--bg-panel-alt) !important;
  --paper-border: var(--border-primary) !important;
  --paper-border-soft: var(--border-soft) !important;
  --paper-text: var(--text-primary) !important;
  --paper-muted: var(--text-secondary) !important;
}

/* 2) Fonds de page : tokens du theme actif */
body.theme-day:has(.missions-journal-screen),
body.theme-day:has(.legacy-shop-screen),
body.theme-day:has(.inventory-screen),
body.theme-day:has(.build-screen),
body.theme-day:has(.academy-combat-prep-screen),
body.theme-classic:has(.missions-journal-screen),
body.theme-classic:has(.legacy-shop-screen),
body.theme-classic:has(.inventory-screen),
body.theme-classic:has(.build-screen),
body.theme-classic:has(.academy-combat-prep-screen),
body.theme-night:has(.missions-journal-screen),
body.theme-night:has(.legacy-shop-screen),
body.theme-night:has(.inventory-screen),
body.theme-night:has(.build-screen),
body.theme-night:has(.academy-combat-prep-screen) {
  background: var(--bg-page) !important;
}

/* 3) Rail droit Mission / Season Pass — tokens */
body.theme-day .shop-side-card,
body.theme-classic .shop-side-card,
body.theme-night .shop-side-card {
  background: var(--bg-panel) !important;
  border-color: var(--border-primary) !important;
  color: var(--text-primary) !important;
}
body.theme-day .shop-side-card h3,
body.theme-classic .shop-side-card h3,
body.theme-night .shop-side-card h3 {
  color: var(--text-primary) !important;
}
body.theme-day .shop-side-body,
body.theme-classic .shop-side-body,
body.theme-night .shop-side-body,
body.theme-day .shop-pass-box,
body.theme-classic .shop-pass-box,
body.theme-night .shop-pass-box {
  background: var(--bg-panel-alt) !important;
  border-color: var(--border-soft) !important;
  color: var(--text-secondary) !important;
}
body.theme-day .shop-mission-summary p,
body.theme-classic .shop-mission-summary p,
body.theme-night .shop-mission-summary p {
  color: var(--text-secondary) !important;
}
body.theme-day .shop-mission-summary strong,
body.theme-classic .shop-mission-summary strong,
body.theme-night .shop-mission-summary strong {
  color: var(--text-primary) !important;
}
body.theme-day .shop-side-button,
body.theme-classic .shop-side-button,
body.theme-night .shop-side-button {
  background: var(--button-secondary-bg) !important;
  border-color: var(--button-secondary-border) !important;
  color: var(--button-secondary-text) !important;
}
body.theme-day .shop-side-button:hover:not(:disabled),
body.theme-classic .shop-side-button:hover:not(:disabled),
body.theme-night .shop-side-button:hover:not(:disabled) {
  background: var(--button-secondary-hover) !important;
}
body.theme-day .shop-side-link-icon,
body.theme-classic .shop-side-link-icon,
body.theme-night .shop-side-link-icon {
  color: var(--text-primary) !important;
}
body.theme-day .shop-pass-box strong,
body.theme-classic .shop-pass-box strong,
body.theme-night .shop-pass-box strong,
body.theme-day .shop-pass-tier,
body.theme-classic .shop-pass-tier,
body.theme-night .shop-pass-tier {
  background: var(--bg-card) !important;
  color: var(--text-primary) !important;
}

/* 4) Le petit texte "Aucune mission active." */
body.theme-day .shop-mission-summary.is-empty p,
body.theme-classic .shop-mission-summary.is-empty p,
body.theme-night .shop-mission-summary.is-empty p {
  background: var(--bg-card) !important;
  color: var(--text-muted) !important;
}
.shop-mission-summary.is-empty p {
  padding: 3px 5px !important;
  border-radius: 2px !important;
}

/* 5) Missions de rang D / journal : cartes cohérentes avec le thème */
body.theme-day .missions-journal-screen .mission-summary-card,
body.theme-day .missions-journal-screen .mission-journal-current,
body.theme-day .missions-journal-screen .mission-available-card,
body.theme-day .missions-journal-screen .hq-mission-row,
body.theme-day .missions-journal-screen .mission-rewards-block {
  background: #f5eedb !important;
  border-color: #cbb991 !important;
  color: var(--text-primary) !important;
}
body.theme-classic .missions-journal-screen .mission-summary-card,
body.theme-classic .missions-journal-screen .mission-journal-current,
body.theme-classic .missions-journal-screen .mission-available-card,
body.theme-classic .missions-journal-screen .hq-mission-row,
body.theme-classic .missions-journal-screen .mission-rewards-block {
  background: #f4f4f2 !important;
  border-color: #d2d2ce !important;
  color: #292a27 !important;
}
body.theme-night .missions-journal-screen .mission-summary-card,
body.theme-night .missions-journal-screen .mission-journal-current,
body.theme-night .missions-journal-screen .mission-available-card,
body.theme-night .missions-journal-screen .hq-mission-row,
body.theme-night .missions-journal-screen .mission-rewards-block {
  background: #121b23 !important;
  border-color: #2a3741 !important;
  color: #d5dde1 !important;
}

body.theme-night .missions-journal-screen .mission-summary-card p,
body.theme-night .missions-journal-screen .mission-journal-current p,
body.theme-night .missions-journal-screen .hq-mission-row p,
body.theme-night .missions-journal-screen .mission-step-copy span,
body.theme-night .missions-journal-screen .mission-contract-card p {
  color: #8f9ba2 !important;
}
body.theme-night .missions-journal-screen .mission-step-copy strong {
  color: #d6dee2 !important;
}
body.theme-classic .missions-journal-screen .mission-step-copy strong,
body.theme-classic .missions-journal-screen .mission-step-copy span,
body.theme-classic .missions-journal-screen .mission-contract-card p {
  color: #5f605c !important;
}

/* 6) Profil et bourse sur Missions : aucune fuite de parchemin en Nuit/Classique */
body.theme-classic .missions-journal-screen .village-profile-card,
body.theme-classic .missions-journal-screen .village-purse-card {
  background: #f4f4f2 !important;
  border-color: #d2d2ce !important;
  color: #292a27 !important;
}
body.theme-night .missions-journal-screen .village-profile-card,
body.theme-night .missions-journal-screen .village-purse-card {
  background: #121b23 !important;
  border-color: #2a3741 !important;
  color: #d5dde1 !important;
}
body.theme-night .missions-journal-screen .village-profile-name h2,
body.theme-night .missions-journal-screen .village-profile-name p,
body.theme-night .missions-journal-screen .village-purse-card strong,
body.theme-night .missions-journal-screen .profile-stat-row,
body.theme-night .missions-journal-screen .profile-art-row {
  color: #d5dde1 !important;
}

/* 7) Options : aperçu et libellés alignés avec le vrai sens des modes */
.preview-day { background:var(--bg-page) !important; }
.preview-day i:nth-child(1) { background:#f5eedb !important; }
.preview-day i:nth-child(2) { background:var(--bg-card) !important; }
.preview-day i:nth-child(3) { background:#2d2a23 !important; }

.preview-classic { background:#2d2d2b !important; }
.preview-classic i:nth-child(1) { background:#f4f4f2 !important; }
.preview-classic i:nth-child(2) { background:#ffffff !important; }
.preview-classic i:nth-child(3) { background:#dcdcd8 !important; }

body.theme-day .options-panel,
body.theme-classic .options-panel,
body.theme-night .options-panel {
  background: var(--nr-surface) !important;
  border-color: var(--nr-line) !important;
  color: var(--nr-text) !important;
}
body.theme-classic .options-panel strong {
  color: var(--nr-text) !important;
}

/* 8) Boutons secondaires génériques des écrans de mission */
body.theme-classic .missions-journal-screen button.secondary {
  background:#ffffff !important;
  border-color:#d2d2ce !important;
  color:#292a27 !important;
}
body.theme-night .missions-journal-screen button.secondary {
  background:#17242d !important;
  border-color:#31414c !important;
  color:#edf1f3 !important;
}
body.theme-day .missions-journal-screen button.secondary {
  background:var(--bg-card) !important;
  border-color:#cbb991 !important;
  color:var(--text-primary) !important;
}


/* ================================================================
   v43.38 — Récompenses des missions : contraste corrigé
   Les badges Ryos / XP / prérequis étaient trop pâles en Jour et Classique.
   ================================================================ */

/* Base : on ne laisse plus .badge hériter d'un ancien texte clair. */
.missions-journal-screen .hq-mission-row .badges {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 7px !important;
  margin-top: 8px !important;
}
.missions-journal-screen .hq-mission-row .badge {
  min-height: 29px !important;
  padding: 5px 12px !important;
  border-radius: 999px !important;
  font-size: 11px !important;
  line-height: 1 !important;
  font-weight: 700 !important;
  opacity: 1 !important;
  text-shadow: none !important;
  box-shadow: none !important;
}

/* JOUR = parchemin/beige */
body.theme-day .missions-journal-screen .hq-mission-row .badge {
  background: #fff7e4 !important;
  border: 1px solid #dfc99c !important;
  color: #8b672d !important;
}
body.theme-day .missions-journal-screen .hq-mission-row .badge:nth-child(1) {
  color: #b77a18 !important;
}
body.theme-day .missions-journal-screen .hq-mission-row .badge:nth-child(2) {
  color: #936d35 !important;
}

/* CLASSIQUE = fond anthracite + panneaux blancs */
body.theme-classic .missions-journal-screen .hq-mission-row .badge {
  background: #ffffff !important;
  border: 1px solid #d7d3ca !important;
  color: #595750 !important;
}
body.theme-classic .missions-journal-screen .hq-mission-row .badge:nth-child(1) {
  color: #b87619 !important;
}
body.theme-classic .missions-journal-screen .hq-mission-row .badge:nth-child(2) {
  color: #5e6570 !important;
}

/* NUIT = sombre, mais texte bien visible */
body.theme-night .missions-journal-screen .hq-mission-row .badge {
  background: #1a2630 !important;
  border: 1px solid #354650 !important;
  color: #c8d1d6 !important;
}
body.theme-night .missions-journal-screen .hq-mission-row .badge:nth-child(1) {
  color: #e0a84c !important;
}
body.theme-night .missions-journal-screen .hq-mission-row .badge:nth-child(2) {
  color: #aebfcd !important;
}

/* Les badges de prérequis doivent rester lisibles également. */
body.theme-day .missions-journal-screen .hq-mission-row .badge:nth-child(n+3) {
  background: #f2e7cf !important;
  border-color: #d7c09a !important;
  color: #6b5940 !important;
}
body.theme-classic .missions-journal-screen .hq-mission-row .badge:nth-child(n+3) {
  background: #f0f0ed !important;
  border-color: #d6d6d0 !important;
  color: #5e5f5b !important;
}
body.theme-night .missions-journal-screen .hq-mission-row .badge:nth-child(n+3) {
  background: #202e38 !important;
  border-color: #3a4c57 !important;
  color: #b9c5cb !important;
}

/* Même correction pour les récompenses affichées dans le journal actif. */
body.theme-day .missions-journal-screen .mission-reward-pill {
  background: #fff7e4 !important;
  border-color: #dfc99c !important;
  color: #72582f !important;
}
body.theme-day .missions-journal-screen .mission-reward-pill b {
  color: #d47622 !important;
}

body.theme-classic .missions-journal-screen .mission-reward-pill {
  background: #ffffff !important;
  border-color: #d7d3ca !important;
  color: #55544f !important;
}
body.theme-classic .missions-journal-screen .mission-reward-pill b {
  color: #cf6e24 !important;
}

body.theme-night .missions-journal-screen .mission-reward-pill {
  background: #1a2630 !important;
  border-color: #354650 !important;
  color: #cbd3d7 !important;
}
body.theme-night .missions-journal-screen .mission-reward-pill b {
  color: #e6a24a !important;
}


/* ================================================================
   v43.39 — Portes du village / carte extérieure
   Structure inspirée des captures de référence : profil à gauche,
   journal au-dessus, carte locale + panneau porte, radio, mission à droite.
   ================================================================ */
body:has(.outside-world-screen),
body:has(.yuukan-fullmap-screen) {
  background: var(--nr-page) !important;
}
.outside-world-screen {
  width: min(1360px, calc(100% - 24px)) !important;
  padding: 10px 0 28px !important;
}
.outside-world-shell {
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr) 205px;
  gap: 12px;
  align-items: start;
}
.outside-center-column { min-width: 0; display:grid; gap:10px; }
.outside-world-screen .village-activity-chat,
.outside-world-screen .village-radio,
.outside-world-screen .village-profile-card,
.outside-world-screen .village-purse-card {
  background: var(--nr-surface) !important;
  border-color: var(--nr-line) !important;
  color: var(--nr-text) !important;
  box-shadow: var(--nr-shadow) !important;
}
.outside-world-screen .village-activity-chat {
  height: 58px !important;
  max-height: 58px !important;
  border-radius: 7px !important;
}
.outside-map-row {
  display:grid;
  grid-template-columns:minmax(0,1fr) 300px;
  gap:10px;
  align-items:stretch;
}
.outside-map-card {
  min-width:0;
  padding:0 !important;
  overflow:hidden;
  border-radius:8px !important;
  border:1px solid #24333b !important;
  background:#0a1116 !important;
}
.outside-local-stage {
  position:relative;
  height:380px;
  overflow:hidden;
  background:
    radial-gradient(circle at 45% 45%, rgba(54,103,61,.22), transparent 36%),
    radial-gradient(circle at 20% 22%, rgba(83,74,44,.22), transparent 28%),
    linear-gradient(145deg,#173020,#0f241b 46%,#10242a 78%,#07141a);
}
.outside-local-stage::after {
  content:"";
  position:absolute; inset:0;
  pointer-events:none;
  background:
    repeating-radial-gradient(circle at 0 0, rgba(255,255,255,.025) 0 1px, transparent 1px 4px),
    linear-gradient(180deg,rgba(0,0,0,.04),rgba(0,0,0,.24));
  mix-blend-mode:screen;
  opacity:.62;
}
.outside-grid {
  position:absolute; inset:0;
  display:grid;
  grid-template-columns:repeat(11,1fr);
  grid-template-rows:repeat(7,1fr);
}
.outside-map-cell {
  position:relative;
  border:1px solid rgba(57,79,87,.48);
  background:#182127;
}
.outside-map-cell.fog {
  background:
    repeating-linear-gradient(135deg,rgba(255,255,255,.015) 0 1px,transparent 1px 5px),
    #182127;
  box-shadow:inset 0 0 10px rgba(0,0,0,.35);
}
.outside-map-cell.revealed { border-color:rgba(103,139,72,.52); }
.outside-map-cell.revealed.forest { background:#477a3a; }
.outside-map-cell.revealed.plain { background:#648d4d; }
.outside-map-cell.revealed.rock { background:#727656; }
.outside-map-cell.revealed.coast { background:linear-gradient(135deg,#d8d19b 0 38%,#2b6d85 40% 100%); }
.outside-map-cell.revealed.dark { background:#415c43; }
.outside-map-cell.current { box-shadow:inset 0 0 0 2px #f0dd8b, 0 0 14px rgba(247,215,102,.38); z-index:4; }
.outside-ninja {
  position:absolute; inset:0;
  display:grid; place-items:center;
  font-size:30px;
  filter:drop-shadow(0 2px 2px rgba(0,0,0,.65));
  z-index:6;
}
.outside-move-pad { position:absolute; inset:0; pointer-events:none; z-index:8; }
.outside-step {
  position:absolute;
  width:48px; height:48px;
  padding:0 !important;
  border:1px solid #cbbd78 !important;
  border-radius:7px !important;
  background:rgba(120,139,77,.48) !important;
  color:#fff8d2 !important;
  box-shadow:0 1px 5px rgba(0,0,0,.34) !important;
  pointer-events:auto;
  font-size:17px;
}
.outside-step:hover { background:rgba(151,167,95,.64) !important; transform:none !important; }
.outside-step.north { left:calc(50% - 24px); top:calc(50% - 76px); }
.outside-step.south { left:calc(50% - 24px); top:calc(50% + 28px); }
.outside-step.west  { left:calc(50% - 76px); top:calc(50% - 24px); }
.outside-step.east  { left:calc(50% + 28px); top:calc(50% - 24px); }
.outside-coordinates {
  position:absolute;
  left:50%; bottom:8px;
  transform:translateX(-50%);
  z-index:9;
  padding:5px 10px;
  border-radius:5px;
  background:rgba(247,244,232,.94);
  color:#4f4b40;
  font-size:10px;
  box-shadow:0 1px 5px rgba(0,0,0,.26);
}
.outside-coordinates span { color:#767064; }
.outside-map-open {
  position:absolute;
  left:12px; bottom:12px;
  z-index:9;
  display:grid;
  justify-items:center;
  min-width:58px;
  padding:8px 10px !important;
  border-radius:4px !important;
  border:0 !important;
  background:rgba(12,17,21,.80) !important;
  color:#fff !important;
  box-shadow:none !important;
  font-size:9px;
}
.outside-map-open span { font-size:18px; }
.outside-gate-panel {
  overflow:hidden;
  min-height:380px;
  padding:10px;
  border:1px solid #26353c;
  border-radius:8px;
  background:#070a0b;
}
.outside-gate-visual {
  position:relative;
  height:106px;
  overflow:hidden;
  border-radius:4px;
  background:
    linear-gradient(0deg,rgba(6,7,8,.26),rgba(6,7,8,.02)),
    linear-gradient(145deg,#40261a 0 28%,#b99b55 29% 65%,#6d2a1c 66% 100%);
  box-shadow:inset 0 -20px 30px rgba(0,0,0,.15);
}
.outside-gate-visual::before {
  content:"";
  position:absolute;
  left:22%; right:22%; top:18%; bottom:0;
  border-top:12px solid #a91d18;
  border-left:10px solid #782018;
  border-right:10px solid #782018;
  background:#c4aa62;
}
.outside-gate-label {
  position:absolute;
  left:10px; bottom:8px;
  z-index:2;
  color:#fff;
  font-size:11px;
  font-weight:800;
  text-shadow:0 1px 2px #000;
}
.outside-gate-panel > button {
  width:100%;
  min-height:31px;
  margin-top:10px;
  padding:5px 10px !important;
  border-radius:3px !important;
  border:0 !important;
  background:#fff !important;
  color:#2d2d2b !important;
  box-shadow:none !important;
  text-align:left;
  font-size:10px;
}
.outside-world-screen .village-radio { min-height:240px !important; }
.outside-world-screen .radio-feed { height:166px !important; }
.outside-world-screen .shop-side-rail { display:grid; gap:10px; }

/* Carte complète ouverte depuis le bouton Carte. */
.yuukan-fullmap-screen {
  width:min(1480px,calc(100% - 18px)) !important;
  padding:8px 0 20px !important;
}
.yuukan-fullmap-card { position:relative; overflow:hidden; border:1px solid #222d32; background:#091117; }
.yuukan-fullmap-stage {
  position:relative;
  height:min(78vw,1080px);
  min-height:690px;
  overflow:hidden;
  background:
    radial-gradient(ellipse at 18% 34%,#6e6542 0 9%,transparent 25%),
    radial-gradient(ellipse at 42% 45%,#274c2e 0 17%,transparent 36%),
    radial-gradient(ellipse at 69% 42%,#305838 0 13%,transparent 33%),
    radial-gradient(ellipse at 48% 72%,#1d492b 0 18%,transparent 37%),
    radial-gradient(ellipse at 80% 25%,#5f6461 0 12%,transparent 27%),
    linear-gradient(120deg,#173b49,#142a31 18%,#24302a 42%,#152629 70%,#173746);
}
.yuukan-terrain-layer,
.yuukan-grid-layer { position:absolute; inset:0; pointer-events:none; }
.yuukan-terrain-layer {
  opacity:.55;
  background:
    repeating-radial-gradient(circle at 20% 30%,rgba(255,255,255,.08) 0 1px,transparent 1px 4px),
    repeating-linear-gradient(115deg,rgba(0,0,0,.08) 0 1px,transparent 1px 8px);
}
.yuukan-grid-layer {
  background-image:
    linear-gradient(rgba(114,137,145,.13) 1px,transparent 1px),
    linear-gradient(90deg,rgba(114,137,145,.13) 1px,transparent 1px);
  background-size:6.25% 6.25%;
}
.yuukan-map-marker {
  position:absolute;
  transform:translate(-50%,-50%);
  display:grid;
  justify-items:center;
  gap:2px;
  min-width:56px;
  padding:4px 5px !important;
  border:1px solid rgba(255,255,255,.18) !important;
  border-radius:5px !important;
  background:rgba(12,16,18,.80) !important;
  color:#fff !important;
  box-shadow:0 2px 7px rgba(0,0,0,.45) !important;
  z-index:4;
}
.yuukan-map-marker span { font-size:22px; }
.yuukan-map-marker strong { color:#fff !important; font-size:9px; }
.yuukan-map-marker.home { outline:2px solid #d6c66d; }
.yuukan-map-back {
  position:absolute; left:14px; top:14px; z-index:8;
  padding:7px 10px !important;
  border:1px solid rgba(255,255,255,.18) !important;
  background:rgba(9,13,16,.78) !important;
  color:#fff !important;
  box-shadow:none !important;
}
.yuukan-zoom-controls {
  position:absolute; right:18px; bottom:18px; z-index:8;
  display:grid; gap:8px;
}
.yuukan-zoom-controls button {
  width:44px; height:44px; padding:0 !important;
  border-radius:50% !important;
  border:0 !important;
  background:#111 !important;
  color:#fff !important;
  box-shadow:0 2px 7px rgba(0,0,0,.35) !important;
  opacity:1 !important;
}

/* Palette : l'extérieur conserve le terrain sombre, les panneaux suivent le thème. */
body.theme-day .outside-gate-panel,
body.theme-classic .outside-gate-panel,
body.theme-night .outside-gate-panel { color:#fff !important; }
body.theme-night .outside-world-screen .village-radio,
body.theme-night .outside-world-screen .village-profile-card,
body.theme-night .outside-world-screen .village-purse-card {
  background:#121b23 !important;
  border-color:#2a3741 !important;
  color:#d5dde1 !important;
}
body.theme-classic .outside-world-screen .village-radio,
body.theme-classic .outside-world-screen .village-profile-card,
body.theme-classic .outside-world-screen .village-purse-card {
  background:#f4f4f2 !important;
  border-color:#d2d2ce !important;
}
body.theme-day .outside-world-screen .village-radio,
body.theme-day .outside-world-screen .village-profile-card,
body.theme-day .outside-world-screen .village-purse-card {
  background:#f5eedb !important;
  border-color:#cbb991 !important;
}

@media(max-width:1080px) {
  .outside-world-shell { grid-template-columns:190px minmax(0,1fr); }
  .outside-world-shell > .shop-side-rail { grid-column:2; grid-row:2; grid-template-columns:1fr 1fr; }
  .outside-map-row { grid-template-columns:minmax(0,1fr) 240px; }
}
@media(max-width:760px) {
  .outside-world-shell { grid-template-columns:1fr; }
  .outside-world-shell > .village-profile-rail,
  .outside-world-shell > .shop-side-rail { grid-column:1; }
  .outside-map-row { grid-template-columns:1fr; }
  .outside-gate-panel { min-height:170px; }
  .outside-local-stage { height:320px; }
  .yuukan-fullmap-stage { min-height:620px; }
}


/* ================================================================
   v43.40 — YUUKAN : carte par cases, routes et déplacement réel
   Aucun clic sur la carte ne déplace le personnage.
   ================================================================ */

.outside-local-stage {
  height: 430px !important;
  background:
    radial-gradient(circle at 50% 48%, rgba(86,111,74,.11), transparent 40%),
    linear-gradient(#071014,#0a1518) !important;
}
.outside-local-stage::after {
  background:
    repeating-linear-gradient(120deg, rgba(255,255,255,.018) 0 1px, transparent 1px 5px),
    radial-gradient(circle at 50% 50%, transparent 45%, rgba(0,0,0,.26) 100%) !important;
  opacity: 1 !important;
  mix-blend-mode: normal !important;
}
.outside-grid {
  grid-template-columns: repeat(11,1fr) !important;
  grid-template-rows: repeat(7,1fr) !important;
}
.outside-map-cell,
.yuukan-world-cell {
  position: relative;
  overflow: visible;
  border: 1px solid rgba(28,43,45,.48);
  transition: filter .12s ease, opacity .12s ease;
}
.outside-map-cell.unexplored,
.yuukan-world-cell.unexplored {
  filter: brightness(.34) saturate(.55);
}
.outside-map-cell.explored,
.yuukan-world-cell.explored {
  filter: brightness(.98) saturate(.92);
}

/* terrains communs à la carte locale et à la grande carte */
:is(.outside-map-cell,.yuukan-world-cell).terrain-ocean {
  background:
    radial-gradient(circle at 22% 35%,rgba(86,145,157,.16) 0 2px,transparent 3px),
    repeating-linear-gradient(160deg,#173e4d 0 4px,#123442 4px 8px,#1b4654 8px 10px) !important;
}
:is(.outside-map-cell,.yuukan-world-cell).terrain-plain {
  background:
    radial-gradient(circle at 30% 24%,#6d8e54 0 2px,transparent 2.5px),
    radial-gradient(circle at 75% 70%,#547942 0 2px,transparent 2.5px),
    linear-gradient(145deg,#65874c,#4f713e) !important;
}
:is(.outside-map-cell,.yuukan-world-cell).terrain-forest {
  background:
    radial-gradient(circle at 25% 30%,#234d2b 0 16%,transparent 17%),
    radial-gradient(circle at 68% 35%,#2e6036 0 18%,transparent 19%),
    radial-gradient(circle at 45% 78%,#1f4728 0 15%,transparent 16%),
    #3f6f3b !important;
}
:is(.outside-map-cell,.yuukan-world-cell).terrain-mountain {
  background:
    linear-gradient(135deg,transparent 0 34%,rgba(236,226,195,.25) 35% 40%,transparent 41%),
    linear-gradient(45deg,#5d6657,#7b7b68 47%,#4a5149) !important;
}
:is(.outside-map-cell,.yuukan-world-cell).terrain-desert {
  background:
    radial-gradient(ellipse at 25% 35%,rgba(155,117,60,.22),transparent 35%),
    repeating-linear-gradient(165deg,#ba9c59 0 5px,#c4aa67 5px 9px,#a98b4f 9px 11px) !important;
}
:is(.outside-map-cell,.yuukan-world-cell).terrain-ice {
  background:
    linear-gradient(150deg,rgba(255,255,255,.42),transparent 38%),
    repeating-linear-gradient(30deg,#a9c5c7 0 6px,#c4d6d6 6px 10px,#8fb2b7 10px 12px) !important;
}
:is(.outside-map-cell,.yuukan-world-cell).terrain-river {
  background:
    repeating-linear-gradient(165deg,#2d7282 0 5px,#3b8792 5px 8px,#266372 8px 12px) !important;
}
:is(.outside-map-cell,.yuukan-world-cell).terrain-coast {
  background:
    linear-gradient(135deg,#b8a36a 0 38%,#d0bd7f 39% 48%,#2e7182 50% 100%) !important;
}
:is(.outside-map-cell,.yuukan-world-cell).terrain-ruins {
  background:
    linear-gradient(45deg,rgba(74,65,47,.34) 25%,transparent 25% 75%,rgba(74,65,47,.34) 75%),
    #79705a !important;
  background-size:10px 10px !important;
}
:is(.outside-map-cell,.yuukan-world-cell).terrain-crater {
  background:
    radial-gradient(circle at 50% 50%,#2b2421 0 18%,#5c4033 20% 36%,#6c5944 38% 60%,#40513d 62%) !important;
}

/* routes : quatre bras dessinés depuis le centre de chaque case */
.world-road-arm {
  position:absolute;
  z-index:2;
  display:block;
  background:#c5ac62;
  box-shadow:0 0 0 1px rgba(73,59,31,.16);
  opacity:.88;
}
.world-road-arm.n,
.world-road-arm.s {
  left:46%;
  width:8%;
  height:52%;
}
.world-road-arm.n { top:-2%; }
.world-road-arm.s { bottom:-2%; }
.world-road-arm.e,
.world-road-arm.w {
  top:46%;
  height:8%;
  width:52%;
}
.world-road-arm.e { right:-2%; }
.world-road-arm.w { left:-2%; }

.outside-map-cell.road::after,
.yuukan-world-cell.road::after {
  content:"";
  position:absolute;
  z-index:3;
  left:42%; top:42%;
  width:16%; height:16%;
  border-radius:50%;
  background:#d6be73;
  box-shadow:0 0 0 1px rgba(64,51,30,.2);
}

/* lieux */
.world-place-pin {
  position:absolute;
  z-index:6;
  left:50%; top:50%;
  transform:translate(-50%,-50%);
  display:grid;
  place-items:center;
  pointer-events:none;
  filter:drop-shadow(0 2px 2px rgba(0,0,0,.65));
}
.world-place-pin b {
  display:grid;
  place-items:center;
  min-width:24px;
  min-height:24px;
  padding:2px;
  border-radius:5px;
  background:rgba(24,24,19,.75);
  border:1px solid rgba(255,239,177,.45);
  font-size:14px;
}
.world-place-pin.full small {
  position:absolute;
  top:27px;
  left:50%;
  transform:translateX(-50%);
  white-space:nowrap;
  padding:1px 4px;
  border-radius:3px;
  background:rgba(10,13,13,.82);
  color:#fff;
  font-size:7px;
  font-weight:800;
}

.outside-player-marker {
  position:absolute;
  z-index:10;
  left:50%; top:50%;
  transform:translate(-50%,-50%);
  display:grid;
  place-items:center;
  width:31px; height:31px;
  border:2px solid #f4df7b;
  border-radius:50%;
  background:rgba(18,22,18,.85);
  font-size:18px;
  box-shadow:0 0 0 3px rgba(244,223,123,.16),0 2px 7px rgba(0,0,0,.55);
}

/* contrôles de marche au centre */
.outside-step {
  width:56px !important;
  height:50px !important;
  display:grid !important;
  place-content:center !important;
  gap:0 !important;
  background:rgba(23,34,27,.83) !important;
  border-color:#d6c46c !important;
  font-size:17px !important;
}
.outside-step small {
  display:block;
  margin-top:-2px;
  color:#eadf9f;
  font-size:7px;
  font-weight:800;
}
.outside-step:disabled {
  opacity:.25 !important;
  cursor:not-allowed !important;
}
.outside-step.north { left:calc(50% - 28px) !important; top:calc(50% - 94px) !important; }
.outside-step.south { left:calc(50% - 28px) !important; top:calc(50% + 44px) !important; }
.outside-step.west  { left:calc(50% - 98px) !important; top:calc(50% - 25px) !important; }
.outside-step.east  { left:calc(50% + 42px) !important; top:calc(50% - 25px) !important; }

.outside-map-cost {
  position:absolute;
  right:10px;
  top:10px;
  z-index:9;
  padding:5px 8px;
  border:1px solid rgba(222,207,120,.35);
  border-radius:5px;
  background:rgba(8,13,14,.78);
  color:#d8d6c4;
  font-size:8px;
}
.outside-map-cost strong { color:#f3dc78 !important; }

.outside-coordinates {
  bottom:9px !important;
  max-width:70%;
  text-align:center;
  white-space:nowrap;
}

/* panneau de destination */
.outside-gate-panel.destination-panel {
  min-height:430px !important;
  background:#070a0b !important;
}
.outside-destination-visual {
  position:relative;
  height:132px;
  overflow:hidden;
  border-radius:5px;
  border:1px solid rgba(255,255,255,.06);
}
.outside-destination-visual::after {
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(transparent 35%,rgba(0,0,0,.62));
}
.outside-destination-icon {
  position:absolute;
  left:50%; top:48%;
  transform:translate(-50%,-50%);
  z-index:1;
  font-size:54px;
  filter:drop-shadow(0 3px 4px rgba(0,0,0,.55));
}
.outside-destination-copy {
  display:grid;
  gap:4px;
  padding:12px 3px 7px;
}
.outside-destination-copy strong { color:#fff !important; font-size:12px; }
.outside-destination-copy small { color:#b5b0a4; font-size:8px; }
.outside-destination-copy p { margin:6px 0 0; color:#8f8b83 !important; font-size:9px; line-height:1.45; }

/* grande carte — 20x30, purement informative */
.yuukan-fullmap-screen {
  width:min(1180px,calc(100% - 18px)) !important;
}
.yuukan-fullmap-card {
  border-radius:8px;
  background:#071014 !important;
}
.yuukan-fullmap-toolbar {
  min-height:58px;
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:14px;
  padding:9px 12px;
  border-bottom:1px solid #26363c;
  background:#10191e;
  color:#d7dfe1;
}
.yuukan-fullmap-toolbar > div {
  display:grid;
  gap:2px;
}
.yuukan-fullmap-toolbar strong { color:#f0f2ed !important; font-size:12px; }
.yuukan-fullmap-toolbar small,
.yuukan-fullmap-toolbar > span { color:#89969c; font-size:8px; }
.yuukan-map-back {
  position:static !important;
  padding:7px 10px !important;
}
.yuukan-fullmap-stage {
  height:auto !important;
  min-height:0 !important;
  aspect-ratio:1 / 1;
  background:#081216 !important;
  overflow:hidden;
}
.yuukan-world-grid {
  position:absolute;
  inset:0;
  display:grid;
  grid-template-columns:repeat(20,1fr);
  grid-template-rows:repeat(30,1fr);
}
.yuukan-world-cell {
  min-width:0;
  min-height:0;
}
.yuukan-world-cell.unexplored {
  filter:brightness(.27) saturate(.5);
}
.yuukan-world-cell.explored {
  box-shadow:inset 0 0 0 1px rgba(187,206,141,.06);
}
.yuukan-world-cell.current {
  z-index:9;
  box-shadow:inset 0 0 0 2px #ead56d,0 0 8px rgba(234,213,109,.7);
}
.yuukan-world-cell .outside-player-marker {
  width:22px; height:22px;
  font-size:12px;
}
.yuukan-world-cell .world-place-pin b {
  min-width:18px;
  min-height:18px;
  font-size:10px;
}
.yuukan-map-legend {
  position:absolute;
  left:12px; bottom:12px;
  z-index:20;
  display:flex;
  gap:10px;
  padding:6px 9px;
  border-radius:5px;
  background:rgba(6,10,12,.82);
  color:#d9dfdf;
  font-size:8px;
}
.yuukan-map-legend span { display:flex; align-items:center; gap:4px; }
.legend-road {
  display:inline-block;
  width:18px; height:4px;
  background:#c5ac62;
}

/* le répertoire Monde n'est plus un raccourci de voyage */
.world-place-static {
  cursor:default !important;
}
.world-place-static:hover {
  transform:none !important;
}
.world-travel-rule {
  display:grid;
  gap:4px;
  padding:12px 14px !important;
  border-left:4px solid #d89a33 !important;
}
.world-travel-rule strong { font-size:11px; }
.world-travel-rule span { color:var(--nr-muted); font-size:9px; }

@media (max-width:900px) {
  .yuukan-fullmap-toolbar {
    grid-template-columns:auto 1fr;
  }
  .yuukan-fullmap-toolbar > span {
    grid-column:1 / -1;
  }
}


/* ==== Monde Yuukan v43.41 : carte 21x21 avec grille numérotée ==== */
.yuukan-fullmap-stage {
  position: relative;
  aspect-ratio: 1 / 1;
  background:
    linear-gradient(rgba(6,10,14,.06), rgba(6,10,14,.06)),
    url("yuukan-overworld-reference.png") center/cover no-repeat !important;
}
.yuukan-world-grid {
  position: absolute;
  inset: 0;
  display: grid;
  grid-template-columns: repeat(21, 1fr) !important;
  grid-template-rows: repeat(21, 1fr) !important;
}
.yuukan-world-cell,
.outside-map-cell {
  position: relative;
}
.world-case-number {
  position: absolute;
  top: 2px;
  left: 3px;
  z-index: 2;
  font-size: 10px;
  line-height: 1;
  font-weight: 800;
  color: rgba(245,250,255,.92);
  text-shadow: 0 1px 2px rgba(0,0,0,.95);
  pointer-events: none;
}
.outside-grid .world-case-number {
  font-size: 7px;
  top: 1px;
  left: 2px;
}
.yuukan-world-cell {
  border: 1px solid rgba(222,235,255,.24);
  background: rgba(10,18,28,.08);
}
.yuukan-world-cell.terrain-ocean {
  background: rgba(6,12,20,.48) !important;
}
.yuukan-world-cell.explored {
  background: rgba(255,255,255,.02);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.04);
}
.yuukan-world-cell.unexplored::before,
.outside-map-cell.unexplored::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 4;
  background: rgba(5,9,13,.72);
}
.yuukan-world-cell.current,
.outside-map-cell.current {
  box-shadow: inset 0 0 0 2px #f6df75, 0 0 10px rgba(246,223,117,.55);
  z-index: 9;
}
.yuukan-world-cell .world-place-pin b,
.outside-map-cell .world-place-pin b {
  background: rgba(8,12,16,.86);
}
.yuukan-world-cell .world-place-pin.full small {
  background: rgba(8,12,16,.92);
  font-size: 8px;
}
.yuukan-fullmap-toolbar strong { font-size: 14px; }
.yuukan-fullmap-toolbar small { font-size: 10px; }
.yuukan-map-legend { font-size: 9px; }


/* ================================================================
   v43.42 — YUUKAN : vraie carte fournie + grille logique invisible
   ================================================================ */

/* La carte fournie par le joueur est l'unique visuel du monde. */
.yuukan-fullmap-stage {
  position: relative !important;
  aspect-ratio: 1 / 1 !important;
  overflow: hidden !important;
  background: url("yuukan-map.png") center / 100% 100% no-repeat !important;
}
.yuukan-world-grid {
  position: absolute !important;
  inset: 0 !important;
  display: grid !important;
  grid-template-columns: repeat(21, 1fr) !important;
  grid-template-rows: repeat(21, 1fr) !important;
  pointer-events: none !important;
}
.yuukan-world-cell {
  position: relative !important;
  min-width: 0 !important;
  min-height: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  filter: none !important;
  overflow: visible !important;
}

/* Brouillard : le quadrillage n'est jamais visible, seules les zones non visitées sont assombries. */
.yuukan-world-cell.unexplored::before,
.outside-map-cell.unexplored::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 4 !important;
  background: rgba(4, 8, 11, .83) !important;
  box-shadow: inset 0 0 12px rgba(0,0,0,.18) !important;
}
.yuukan-world-cell.explored::before,
.outside-map-cell.explored::before {
  display: none !important;
}

/* Aucun quadrillage/numéro/route graphique à l'écran. */
.world-case-number,
.world-road-arm,
.yuukan-world-cell.road::after,
.outside-map-cell.road::after,
.yuukan-world-cell .world-place-pin,
.outside-map-cell .world-place-pin {
  display: none !important;
}
.yuukan-world-cell.current {
  z-index: 8 !important;
  border: 0 !important;
  box-shadow: inset 0 0 0 2px rgba(246,223,117,.58) !important;
}

/* Vue locale : chaque case logique montre exactement sa portion de l'image 21x21. */
.outside-local-stage {
  height: 430px !important;
  overflow: hidden !important;
  background: #071014 !important;
}
.outside-local-stage::after {
  background: radial-gradient(circle at 50% 50%, transparent 52%, rgba(0,0,0,.20) 100%) !important;
  pointer-events: none !important;
}
.outside-grid {
  position: absolute !important;
  inset: 0 !important;
  display: grid !important;
  grid-template-columns: repeat(11, 1fr) !important;
  grid-template-rows: repeat(7, 1fr) !important;
  gap: 0 !important;
}
.outside-map-cell {
  position: relative !important;
  border: 0 !important;
  box-shadow: none !important;
  filter: none !important;
  overflow: hidden !important;
}
.outside-map-cell.map-slice {
  background-image: url("yuukan-map.png") !important;
  background-repeat: no-repeat !important;
  background-size: 2100% 2100% !important;
  background-position: var(--map-pos-x) var(--map-pos-y) !important;
}
.outside-map-cell.outside-map-void {
  background: #071014 !important;
}
.outside-map-cell.current {
  z-index: 8 !important;
  box-shadow: inset 0 0 0 2px rgba(246,223,117,.56) !important;
}

/* Le joueur reste visible sans faire apparaître les cases. */
.outside-player-marker {
  z-index: 10 !important;
  width: 30px !important;
  height: 30px !important;
  border: 2px solid #f4df7b !important;
  background: rgba(18,22,18,.86) !important;
  box-shadow: 0 0 0 3px rgba(244,223,123,.15), 0 2px 7px rgba(0,0,0,.58) !important;
}
.yuukan-world-cell .outside-player-marker {
  width: 24px !important;
  height: 24px !important;
  font-size: 13px !important;
}

/* Les boutons de direction sont les seuls contrôles de mouvement. */
.outside-step {
  z-index: 20 !important;
}
.outside-map-cost,
.outside-coordinates,
.outside-map-open {
  z-index: 21 !important;
}

/* v43.42.1 — aucune bordure de case visible, même sur la position actuelle */
.yuukan-world-cell.current,
.outside-map-cell.current { box-shadow: none !important; border: 0 !important; }


/* ================================================================
   v43.43 — Actions contextuelles sur une case de Yuukan
   ================================================================ */
.outside-zone-panel {
  padding: 10px !important;
  gap: 9px !important;
}
.outside-zone-photo {
  height: 126px !important;
  background-image:
    linear-gradient(180deg, rgba(0,0,0,.08), rgba(0,0,0,.64)),
    url("yuukan-map.png") !important;
  background-size: 440% auto !important;
  background-position: var(--zone-bg-pos, 50% 50%) !important;
  background-repeat: no-repeat !important;
}
.outside-zone-photo::after {
  background: linear-gradient(180deg, transparent 45%, rgba(0,0,0,.70)) !important;
}
.outside-zone-panel .outside-gate-label {
  left: 9px !important;
  right: 9px !important;
  bottom: 9px !important;
  z-index: 3 !important;
  color: #fff !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  text-shadow: 0 1px 3px rgba(0,0,0,.9) !important;
}
.outside-zone-actions {
  display: grid;
  gap: 7px;
}
.outside-zone-action {
  width: 100% !important;
  min-height: 38px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  padding: 7px 10px !important;
  border: 1px solid rgba(157,148,129,.55) !important;
  border-radius: 4px !important;
  background: #f8f7f2 !important;
  color: #24231f !important;
  box-shadow: none !important;
  text-align: left !important;
  font-size: 11px !important;
  font-weight: 600 !important;
}
.outside-zone-action:hover:not(:disabled) {
  background: #fffdf7 !important;
  transform: none !important;
}
.outside-zone-action > span {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}
.outside-zone-action > span small {
  color: #5b9b58 !important;
  font-size: 9px !important;
}
.outside-zone-action > strong {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  white-space: nowrap;
  color: #ef9a1a !important;
  font-size: 10px !important;
}
.outside-zone-action:disabled {
  opacity: .50 !important;
  cursor: not-allowed !important;
}
body.theme-night .outside-zone-action {
  background: #f6f4ee !important;
  border-color: #d6d1c6 !important;
  color: #23231f !important;
}
body.theme-classic .outside-zone-action {
  background: #fff !important;
  border-color: #d4d4cf !important;
  color: #242522 !important;
}


/* ================================================================
   v43.46 — caméra locale : zoom/cadrage corrigés
   Le problème venait du viewport 430px qui étirait les cases et du bloc
   v43.44 écrit avec des \n littéraux. La grille logique reste invisible.
   ================================================================ */
.outside-local-stage {
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  aspect-ratio: 11 / 7 !important;
  overflow: hidden !important;
  background: #071014 !important;
}
.outside-grid {
  position: absolute !important;
  inset: 0 !important;
  display: grid !important;
  grid-template-columns: repeat(11, minmax(0, 1fr)) !important;
  grid-template-rows: repeat(7, minmax(0, 1fr)) !important;
  gap: 0 !important;
}
.outside-map-cell {
  min-width: 0 !important;
  min-height: 0 !important;
  aspect-ratio: 1 / 1 !important;
  overflow: hidden !important;
}
.outside-map-cell.map-slice {
  /* 21 × 21 source map : one logical cell = one exact square source cell. */
  background-image: url("yuukan-map.png") !important;
  background-repeat: no-repeat !important;
  background-size: 2100% 2100% !important;
  background-position: var(--map-pos-x) var(--map-pos-y) !important;
}
.outside-player-marker {
  left: 50% !important;
  top: 50% !important;
  transform: translate(-50%, -50%) !important;
}
.outside-gate-panel.destination-panel,
.outside-zone-panel {
  min-height: 0 !important;
  height: 100% !important;
}

/* La ligne carte/panneau suit maintenant la hauteur réelle du viewport. */
.outside-map-row {
  align-items: stretch !important;
}
.outside-map-card {
  align-self: stretch !important;
}

/* Le cadrage reste stable sur desktop sans réintroduire l'ancien 430px. */
@media (min-width: 901px) {
  .outside-local-stage { max-height: none !important; }
}


/* ================================================================
   v43.47 — nouvelle référence Yuukan 21x21 + noms par découverte
   La grille et les noms ne font jamais partie du visuel de base.
   ================================================================ */
.world-discovered-label {
  position: absolute !important;
  z-index: 14 !important;
  left: calc(50% + var(--label-shift-x, 0%)) !important;
  top: calc(50% + var(--label-shift-y, 0%)) !important;
  transform: translate(-50%, -50%) !important;
  width: max-content !important;
  max-width: 120px !important;
  padding: 2px 5px !important;
  border: 1px solid rgba(255,255,255,.34) !important;
  border-radius: 3px !important;
  background: rgba(6,9,10,.88) !important;
  color: #fff !important;
  font-weight: 800 !important;
  line-height: 1.1 !important;
  text-align: center !important;
  text-shadow: 0 1px 2px rgba(0,0,0,.95) !important;
  box-shadow: 0 1px 3px rgba(0,0,0,.48) !important;
  white-space: normal !important;
  pointer-events: none !important;
}
.outside-map-cell .world-discovered-label.local {
  font-size: 7px !important;
  padding: 1px 3px !important;
  max-width: 64px !important;
}
.yuukan-world-cell .world-discovered-label.full {
  font-size: 6px !important;
  padding: 1px 2px !important;
  max-width: 84px !important;
}
.outside-map-cell:has(.world-discovered-label),
.yuukan-world-cell:has(.world-discovered-label) {
  overflow: visible !important;
  z-index: 7 !important;
}
.outside-map-cell.unexplored .world-discovered-label,
.yuukan-world-cell.unexplored .world-discovered-label {
  display: none !important;
}
/* Le joueur reste au-dessus du nom lorsqu'il découvre la case. */
.outside-map-cell.current,
.yuukan-world-cell.current {
  z-index: 12 !important;
}


/* v43.52 — cartes de village réelles : affichage intégral et proportions propres. */
.world-map-stage.village-map-chikara,
.world-map-stage.village-map-gensou,
.world-map-stage.village-map-torikae,
.world-map-stage.village-map-ukabu_north,
.world-map-stage.village-map-ukabu_south {
  aspect-ratio: 4 / 3 !important;
  min-height: 0 !important;
  background-size: 100% 100% !important;
  background-position: center !important;
}
.world-map-stage.village-map-mahou {
  aspect-ratio: 1028 / 484 !important;
  min-height: 0 !important;
  background-size: 100% 100% !important;
  background-position: center !important;
}
.world-map-stage.village-map-minato {
  aspect-ratio: 3 / 2 !important;
  min-height: 0 !important;
  background-size: 100% 100% !important;
  background-position: center !important;
}

/* v43.53 — économie et commerces propres à chaque village */
.legacy-shop-stock-head { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:8px; }
.legacy-shop-stock-head h3 { margin:0; }
.village-tax-badge { white-space:nowrap; }

/* v43.55 — fiche de monstre documenté (les illustrations Shinobi.fr ne sont pas redistribuées). */
.duel-creature.documented-monster {
  min-width: 230px;
  min-height: 230px;
  padding: 18px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 7px;
  text-align: center;
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 18px;
  background: radial-gradient(circle at 50% 34%, rgba(255,255,255,.10), transparent 34%), rgba(12,18,24,.88);
}
.documented-monster-icon { font-size: 58px; filter: drop-shadow(0 4px 8px rgba(0,0,0,.35)); }
.documented-monster > strong { font-size: 18px; color: #fff; }
.documented-monster > small { color: rgba(255,255,255,.72); }
.documented-monster-official { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:5px; width:100%; margin-top:5px; }
.documented-monster-official span { padding:5px 7px; border-radius:7px; background:rgba(255,255,255,.07); font-size:11px; color:#f4f1e5; }
.documented-monster > em { margin-top:2px; font-size:9px; color:rgba(255,255,255,.55); font-style:normal; }

/* v43.57 — choix du village de départ */
.starting-village-section { align-items:start; }
.starting-village-options { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.starting-village-choice {
  min-height:132px; padding:12px 10px !important; border-radius:14px !important;
  border:1px solid rgba(255,255,255,.16) !important; background:rgba(255,255,255,.06) !important;
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px;
  color:var(--text) !important; box-shadow:none !important;
}
.starting-village-choice:hover { transform:none !important; border-color:rgba(245,184,75,.55) !important; }
.starting-village-choice.selected { border-color:#e2a400 !important; box-shadow:0 0 0 3px rgba(226,164,0,.12) !important; background:rgba(226,164,0,.08) !important; }
.starting-village-symbol { font-size:30px; line-height:1; }
.village-logo { display:block; width:50px; height:74px; object-fit:contain; image-rendering:pixelated; }
.village-logo-sm { width:28px; height:42px; }
.starting-village-choice strong { font-size:14px; }
.starting-village-choice small { font-size:11px; color:var(--muted); }
.starting-village-choice em { margin-top:4px; font-size:10px; line-height:1.45; font-style:normal; color:var(--muted); text-align:center; }
.starting-village-description { margin-top:10px; padding:11px 13px; border-radius:12px; border:1px solid rgba(255,255,255,.1); background:rgba(0,0,0,.12); display:grid; gap:4px; }
.starting-village-description span,.starting-village-description small { color:var(--muted); }
@media(max-width:700px){ .starting-village-options{grid-template-columns:1fr;} }

/* ================================================================
   v43.58 — Studio d'avatar à onglets.
   Inspiré d'un éditeur de personnage classique, avec notre rendu original.
   Les assets historiques dans assets/portraits restent intacts.
   ================================================================ */
.avatar-studio-screen {
  width:min(1180px,calc(100% - 28px));
  max-width:1180px !important;
  padding-top:14px !important;
}
.avatar-studio-title {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:16px;
  margin-bottom:10px;
  padding:4px 8px;
}
.avatar-studio-title h2 { margin:2px 0 0; }
.avatar-studio-shell {
  display:grid;
  grid-template-columns:240px minmax(0,1fr);
  gap:18px;
  padding:18px;
  border:1px solid rgba(128,100,47,.25);
  border-radius:16px;
  background:rgba(255,255,255,.92);
  box-shadow:0 14px 36px rgba(44,31,12,.12);
  color:#24231f;
}
.avatar-studio-left {
  display:grid;
  align-content:start;
  gap:12px;
}
.avatar-studio-preview {
  height:250px;
  display:grid;
  place-items:center;
  overflow:hidden;
  border-radius:10px;
  background:#d7d9d7;
  border:1px solid #c7cac7;
}
.avatar-studio-preview .ninja-portrait { width:210px !important; max-width:95%; }
.avatar-mode-switch { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.avatar-mode-switch button {
  min-height:42px;
  padding:8px 10px !important;
  border:1px solid #d4b878 !important;
  border-radius:8px !important;
  background:#fffdf7 !important;
  color:#342f25 !important;
  box-shadow:none !important;
}
.avatar-mode-switch button.active {
  background:#dca311 !important;
  color:#fff !important;
  border-color:#d09200 !important;
  box-shadow:0 5px 13px rgba(207,145,0,.2) !important;
}
.avatar-name-field { display:grid; gap:5px; font-size:12px; font-weight:800; }
.avatar-name-field input {
  width:100%;
  min-height:42px;
  border:1px solid #d9d9d4;
  border-radius:8px;
  padding:0 11px;
  background:#fff;
  color:#222;
}
.avatar-gift-mini {
  display:flex;
  align-items:center;
  gap:9px;
  padding:9px 10px;
  border:1px solid #e4dfd0;
  border-radius:8px;
  background:#faf8f1;
}
.avatar-gift-mini > span { font-size:22px; }
.avatar-gift-mini div { display:grid; }
.avatar-gift-mini small { color:#777166; font-size:9px; text-transform:uppercase; letter-spacing:.06em; }
.avatar-gift-mini strong { color:#2a2823; font-size:12px; }
.avatar-studio-main {
  min-width:0;
  padding:14px;
  border:1px solid #d7ae63;
  border-radius:11px;
  background:#fff;
}
.avatar-editor-tabs {
  display:grid;
  grid-template-columns:repeat(6,minmax(0,1fr));
  gap:10px;
  margin-bottom:14px;
}
.avatar-editor-tab {
  min-height:44px;
  display:flex !important;
  align-items:center;
  justify-content:center;
  gap:7px;
  padding:8px 10px !important;
  border:1px solid #e5e0c9 !important;
  border-radius:7px !important;
  background:#fffdee !important;
  color:#161616 !important;
  box-shadow:none !important;
  font-weight:800;
}
.avatar-editor-tab:hover { transform:none !important; border-color:#d6ad55 !important; }
.avatar-editor-tab.active {
  background:#dea612 !important;
  border-color:#ca9000 !important;
  color:#fff !important;
  box-shadow:0 5px 12px rgba(192,129,0,.16) !important;
}
.avatar-editor-panel {
  min-height:420px;
  border:1px solid #e1e4ef;
  border-radius:8px;
  background:#fff;
  overflow:hidden;
}
.avatar-color-strip {
  min-height:54px;
  display:flex;
  align-items:center;
  gap:10px;
  padding:9px 14px;
  border-bottom:1px solid #efeee8;
  background:#fffef9;
}
.avatar-color-label {
  display:inline-flex;
  align-items:center;
  min-height:34px;
  padding:0 12px;
  border-radius:6px;
  background:#dca311;
  color:#fff;
  font-size:11px;
  font-weight:900;
}
.avatar-color-dot {
  width:31px !important;
  height:31px !important;
  min-width:31px !important;
  padding:0 !important;
  border-radius:50% !important;
  border:2px solid #e0e2e4 !important;
  background:var(--choice-color) !important;
  box-shadow:none !important;
}
.avatar-color-dot.selected { outline:3px solid rgba(220,163,17,.28); border-color:#d49b08 !important; }
.avatar-sub-options {
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:8px;
  padding:10px 14px;
  border-bottom:1px solid #efeee8;
  background:#fffef9;
}
.avatar-sub-options > span { font-size:11px; font-weight:850; color:#5d574c; margin-right:6px; }
.avatar-sub-options .creator-choice {
  min-width:82px;
  min-height:32px;
  padding:5px 9px;
  border-radius:6px;
  background:#fff;
  color:#222;
  border-color:#ded8c9;
  font-size:10px;
}
.avatar-editor-scroll {
  max-height:430px;
  overflow:auto;
  padding:15px;
  scrollbar-color:#cba468 #f1eee7;
}
.avatar-choice-grid {
  display:grid;
  grid-template-columns:repeat(5,minmax(94px,1fr));
  gap:11px;
}
.avatar-choice-tile {
  position:relative;
  min-height:132px;
  padding:7px 6px 8px !important;
  display:grid !important;
  grid-template-rows:1fr auto;
  align-items:center;
  justify-items:center;
  gap:4px;
  border:1px solid #dfe2ed !important;
  border-radius:8px !important;
  background:#fff !important;
  color:#4c4b47 !important;
  box-shadow:none !important;
  overflow:hidden;
}
.avatar-choice-tile:hover { transform:none !important; border-color:#d9b458 !important; background:var(--bg-input) !important; }
.avatar-choice-tile.selected {
  border:2px solid #dda20c !important;
  background:#e2aa18 !important;
  color:#fff !important;
  box-shadow:0 5px 12px rgba(205,143,5,.18) !important;
}
.avatar-choice-tile > i {
  position:absolute;
  right:5px;
  top:5px;
  width:20px;
  height:20px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:#fff;
  color:#d59d0d;
  font-style:normal;
  font-weight:950;
}
.avatar-choice-tile strong { font-size:10px; font-weight:800; }
.avatar-choice-preview {
  width:100%;
  height:94px;
  display:grid;
  place-items:center;
  overflow:hidden;
  border-radius:5px;
  background:rgba(248,248,248,.84);
}
.avatar-choice-tile.selected .avatar-choice-preview { background:rgba(255,255,255,.75); }
.avatar-choice-preview .ninja-portrait { width:82px !important; height:92px !important; }
.avatar-choice-preview .ninja-svg { width:82px !important; height:92px !important; }
.avatar-village-step {
  margin-top:16px;
  padding:16px !important;
  background:rgba(255,255,255,.92) !important;
  color:#29261f !important;
  border:1px solid rgba(128,100,47,.24) !important;
}
.avatar-village-heading { display:flex; justify-content:space-between; align-items:end; gap:12px; margin-bottom:8px; }
.avatar-village-heading h3 { margin:2px 0 0; }
.avatar-village-heading p { margin:0; color:#777064; font-size:11px; }
.avatar-village-step .creator-section { grid-template-columns:1fr; padding:0; border:0; }
.avatar-village-step .creator-section > div:first-child { display:none; }
.avatar-village-step .starting-village-description { background:#faf8f1; border-color:#e2ddce; }
.avatar-village-step .starting-village-description span,
.avatar-village-step .starting-village-description small { color:#746e62; }
.avatar-studio-footer {
  display:grid;
  justify-items:center;
  gap:8px;
  padding:18px 0 6px;
}
.avatar-studio-footer p { margin:0; font-size:11px; color:var(--muted); }
.avatar-studio-footer-actions {
  display:flex;
  gap:12px;
  align-items:center;
  justify-content:center;
  flex-wrap:wrap;
}
.avatar-continue {
  min-width:220px;
  min-height:52px;
  border-radius:8px !important;
  background:#dca311 !important;
  color:#fff !important;
  border:0 !important;
  box-shadow:0 8px 20px rgba(201,139,0,.24) !important;
  text-transform:none !important;
  font-size:16px !important;
}
@media(max-width:900px){
  .avatar-studio-shell{grid-template-columns:200px minmax(0,1fr)}
  .avatar-editor-tabs{grid-template-columns:repeat(3,1fr)}
  .avatar-choice-grid{grid-template-columns:repeat(3,minmax(88px,1fr))}
}
@media(max-width:680px){
  .avatar-studio-title{align-items:flex-start;flex-direction:column}
  .avatar-studio-shell{grid-template-columns:1fr;padding:12px}
  .avatar-studio-left{grid-template-columns:150px 1fr;align-items:start}
  .avatar-studio-preview{grid-row:span 3;height:190px}
  .avatar-mode-switch{align-self:end}
  .avatar-studio-main{padding:10px}
  .avatar-editor-tabs{grid-template-columns:repeat(2,1fr)}
  .avatar-choice-grid{grid-template-columns:repeat(2,minmax(90px,1fr))}
  .avatar-village-heading{align-items:start;flex-direction:column}
}

/* v43.59 — sections futures du header */
.game-nav-link.is-coming-soon { opacity:.55; cursor:not-allowed; }
.game-nav-link.is-coming-soon small { display:block; font-size:7px; line-height:1; margin-top:2px; text-transform:uppercase; letter-spacing:.04em; }

/* v43.65 — Refonte du menu des missions */
.mission-board-column {
  display: grid;
  gap: 16px;
  align-content: start;
}
.mission-hq-card {
  max-width: none;
  width: 100%;
  padding: 16px;
  border-radius: 16px;
}
.mission-hq-hero {
  min-height: 136px;
  display: grid;
  grid-template-columns: minmax(0,1fr) auto;
  gap: 14px;
  align-items: end;
  padding: 16px;
  border-radius: 12px;
}
.mission-hq-hero h2 {
  margin: 4px 0 6px;
  font-size: 30px;
  line-height: 1.05;
}
.mission-hq-hero p {
  margin: 0;
  max-width: 760px;
  font-size: 13px;
  line-height: 1.5;
  color: rgba(255,255,255,.88);
}
.mission-hq-hero-meta {
  display: grid;
  grid-template-columns: repeat(3,minmax(82px,1fr));
  gap: 8px;
}
.mission-hq-hero-meta span {
  min-width: 86px;
  padding: 10px 12px;
  border-radius: 12px;
  background: rgba(255,255,255,.1);
  border: 1px solid rgba(255,255,255,.12);
  text-align: center;
}
.mission-hq-hero-meta b {
  display: block;
  font-size: 18px;
  line-height: 1;
  color: #fff;
}
.mission-hq-hero-meta small {
  display: block;
  margin-top: 4px;
  font-size: 11px;
  letter-spacing: .03em;
  text-transform: uppercase;
  color: rgba(255,255,255,.8);
}
.mission-hq-alert {
  margin-top: 12px;
  padding: 12px 14px;
  border-radius: 12px;
  background: #fff7e4;
  border: 1px solid #dfc99b;
  color: #6a5127;
  font-size: 13px;
}
.mission-hq-alert.is-muted {
  background: rgba(255,255,255,.08);
  border-color: rgba(255,255,255,.12);
  color: rgba(255,255,255,.86);
}
.mission-overview-card-shell {
  margin-top: 14px;
  padding: 0;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}
.mission-overview-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 10px;
}
.mission-overview-card {
  min-height: 124px;
  padding: 14px;
  border-radius: 14px;
  border: 1px solid #dfc99c;
  background: var(--bg-card);
  color: #302518;
  text-align: left;
  display: grid;
  gap: 5px;
  align-content: start;
  box-shadow: 0 6px 16px rgba(0,0,0,.08);
}
.mission-overview-card:hover,
.mission-overview-card:focus-visible {
  transform: translateY(-1px);
  border-color: #e4b35b;
  background: #fff4dc;
  outline: none;
}
.mission-overview-card.active {
  border-color: #d79a33;
  background: linear-gradient(180deg,#fff7e9,#ffefd0);
  box-shadow: 0 10px 24px rgba(157,103,12,.16);
}
.mission-overview-card.done {
  border-color: #a9c693;
  background: linear-gradient(180deg,#f7fff2,#eef8e5);
}
.mission-overview-card.trophy {
  border-color: #d8c3ef;
  background: linear-gradient(180deg,#fcf8ff,#f3ebff);
}
.mission-overview-rank {
  display: inline-flex;
  width: fit-content;
  padding: 4px 8px;
  border-radius: 999px;
  background: #2b241f;
  color: #fff;
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .05em;
}
.mission-overview-card strong {
  font-size: 16px;
  line-height: 1.2;
}
.mission-overview-card small {
  color: #705b36;
  font-size: 11px;
}
.mission-overview-stats {
  margin-top: auto;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.mission-overview-stats span {
  padding: 5px 8px;
  border-radius: 999px;
  background: rgba(43,36,31,.08);
  font-size: 11px;
  font-weight: 700;
  color: #4f4230;
}
.mission-board-detail {
  display: grid;
  gap: 12px;
}
.mission-summary-card {
  padding: 16px;
  border-radius: 14px;
}
.mission-section-top {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  justify-content: space-between;
}
.mission-summary-head h2 {
  margin: 0 0 4px;
  font-size: 24px;
}
.mission-summary-head p {
  margin: 0;
  font-size: 13px;
  line-height: 1.5;
}
.mission-back-button {
  flex: 0 0 auto;
  min-height: 38px;
}
.hq-mission-list {
  gap: 12px;
}
.hq-mission-row {
  grid-template-columns: 1fr;
  gap: 12px;
  padding: 14px;
  border-radius: 14px;
}
.hq-mission-row.active {
  border-color: #e2a54d !important;
  box-shadow: 0 0 0 2px rgba(230,177,82,.18);
}
.hq-mission-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-start;
}
.hq-mission-title {
  display: flex;
  align-items: flex-start;
  gap: 12px;
}
.hq-mission-icon {
  width: 42px;
  height: 42px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  background: #fff7e8;
  border: 1px solid #e7c683;
  font-size: 21px;
  flex: 0 0 auto;
}
.hq-mission-title strong {
  display: block;
  font-size: 18px;
  line-height: 1.2;
}
.hq-mission-title small {
  display: block;
  margin-top: 3px;
  font-size: 12px;
  color: #847057;
}
.hq-mission-state {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 0 10px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 800;
  white-space: nowrap;
  border: 1px solid transparent;
}
.hq-mission-state.open { background: #fff7e1; color: #8c6223; border-color: #ebcb8e; }
.hq-mission-state.active { background: #eaf5ff; color: #30659b; border-color: #b5d4f1; }
.hq-mission-state.done { background: #edf7e4; color: #48723b; border-color: #bfd8b1; }
.hq-mission-state.locked { background: #f2efe9; color: #7a746b; border-color: #d4ccc0; }
.hq-mission-row p {
  margin: 0;
  font-size: 13px;
  line-height: 1.55;
}
.hq-mission-foot {
  display: flex;
  gap: 12px;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
}
.hq-mission-foot > button {
  min-width: 210px;
}
.story-board-action {
  border-radius: 14px;
  padding: 14px;
}
.story-board-action strong {
  display: block;
  margin-bottom: 4px;
}
.story-board-action button {
  margin-top: 10px;
}
.missions-journal-screen .mission-journal-current {
  padding: 16px;
  border-radius: 14px;
}
@media (max-width: 1180px) {
  .mission-overview-grid {
    grid-template-columns: repeat(2, minmax(0,1fr));
  }
}
@media (max-width: 900px) {
  .mission-hq-hero {
    grid-template-columns: 1fr;
    align-items: start;
  }
  .mission-hq-hero-meta {
    grid-template-columns: repeat(3, minmax(0,1fr));
  }
  .mission-section-top,
  .hq-mission-head,
  .hq-mission-foot {
    flex-direction: column;
    align-items: stretch;
  }
  .hq-mission-foot > button {
    width: 100%;
    min-width: 0;
  }
}
@media (max-width: 640px) {
  .mission-overview-grid {
    grid-template-columns: 1fr;
  }
  .mission-hq-hero h2 {
    font-size: 24px;
  }
  .mission-hq-hero-meta {
    grid-template-columns: 1fr 1fr;
  }
}
body.theme-classic .missions-journal-screen .mission-overview-card {
  background: #ffffff !important;
  border-color: #d9d9d4 !important;
  color: #262724 !important;
}
body.theme-classic .missions-journal-screen .mission-overview-card.active {
  background: #f7f7f5 !important;
  border-color: #b9b9b3 !important;
}
body.theme-classic .missions-journal-screen .mission-overview-card.done {
  background: #f4faf0 !important;
  border-color: #bdd1b1 !important;
}
body.theme-night .missions-journal-screen .mission-hq-alert {
  background: #16232d !important;
  border-color: #2d4250 !important;
  color: #d6e0e6 !important;
}
body.theme-night .missions-journal-screen .mission-overview-card {
  background: #17242d !important;
  border-color: #31414c !important;
  color: #edf1f3 !important;
  box-shadow: none !important;
}
body.theme-night .missions-journal-screen .mission-overview-card small,
body.theme-night .missions-journal-screen .mission-overview-stats span,
body.theme-night .missions-journal-screen .hq-mission-title small,
body.theme-night .missions-journal-screen .mission-summary-head p {
  color: #a5b0b7 !important;
}
body.theme-night .missions-journal-screen .mission-overview-card.active {
  background: #1c2d38 !important;
  border-color: #4a6a80 !important;
}
body.theme-night .missions-journal-screen .mission-overview-card.done {
  background: #172820 !important;
  border-color: #466453 !important;
}
body.theme-night .missions-journal-screen .mission-overview-card.trophy {
  background: #201c2d !important;
  border-color: #4f4274 !important;
}
body.theme-night .missions-journal-screen .hq-mission-icon {
  background: #20303a !important;
  border-color: #334652 !important;
}
body.theme-classic .missions-journal-screen .hq-mission-icon {
  background: #fafaf8 !important;
  border-color: #d8d8d4 !important;
}

/* v43.66 — 4 quêtes visibles à la fois */
.mission-batch-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 16px;
  border-radius: 14px;
}
.mission-batch-card strong {
  display: block;
  margin-bottom: 4px;
  font-size: 15px;
}
.mission-batch-card p {
  margin: 0;
  font-size: 12px;
  line-height: 1.45;
  color: #6f5b3f;
}
.mission-batch-card > span {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  min-height: 36px;
  padding: 0 12px;
  border-radius: 999px;
  background: #fff4dd;
  border: 1px solid #e4c27b;
  font-weight: 800;
  color: #825c1c;
}
body.theme-night .mission-batch-card p { color: #a8b2b9; }
body.theme-night .mission-batch-card > span {
  background: #1c2d38;
  border-color: #415868;
  color: #dbe7ef;
}
@media (max-width: 720px) {
  .mission-batch-card {
    flex-direction: column;
    align-items: stretch;
  }
  .mission-batch-card > span {
    width: fit-content;
  }
}

/* v43.67 — menu mission plus fidèle à Shinobi */
.retro-mission-list {
  display: grid;
  gap: 14px;
}
.retro-mission-row {
  padding: 12px;
  border-radius: 14px;
}
.retro-mission-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 250px;
  gap: 16px;
  align-items: center;
}
.retro-mission-copy {
  min-width: 0;
}
.retro-mission-copy .hq-mission-head {
  margin-bottom: 8px;
}
.retro-mission-copy .hq-mission-title strong {
  font-size: 19px;
  line-height: 1.2;
}
.retro-mission-copy .hq-mission-title small {
  display: block;
  margin-top: 4px;
  font-size: 12px;
  color: #8b7047;
}
.retro-mission-copy p {
  margin: 10px 0 12px;
  line-height: 1.42;
}
.retro-mission-warning {
  display: inline-flex;
  margin-top: 2px;
  padding: 5px 9px;
  border-radius: 999px;
  background: #fff1d5;
  border: 1px solid #e1c288;
  font-size: 12px;
  font-weight: 700;
  color: #8f5f13;
}
.mission-card-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 6px;
}
.mission-card-badges .mission-reward-pill {
  border-radius: 999px;
}
.mission-inline-link {
  display: block;
  width: 100%;
  margin-top: 14px;
  padding: 8px 12px;
  background: transparent;
  border: 1px solid #e1d3b7;
  border-radius: 10px;
  color: #c59a4b;
  font-weight: 800;
  letter-spacing: .02em;
  text-align: center;
}
.mission-inline-link:disabled {
  opacity: .72;
  cursor: default;
}
.retro-mission-figure {
  margin: 0;
  align-self: stretch;
}
.retro-mission-figure img {
  display: block;
  width: 100%;
  height: 118px;
  object-fit: cover;
  border-radius: 12px;
  border: 2px solid rgba(105, 80, 44, .35);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.4);
}
body.theme-day .retro-mission-row,
body.theme-classic .retro-mission-row {
  background: #fcfbf8;
  border: 1px solid #d5c3a0;
  box-shadow: 0 8px 20px rgba(42, 31, 17, .08);
}
body.theme-night .retro-mission-row {
  background: #11202a;
  border: 1px solid #334856;
  box-shadow: 0 10px 24px rgba(0, 0, 0, .28);
}
body.theme-night .retro-mission-copy .hq-mission-title small {
  color: #9eb2bf;
}
body.theme-night .retro-mission-warning {
  background: #253847;
  border-color: #425a69;
  color: #f4d79b;
}
body.theme-night .mission-inline-link {
  border-color: #334856;
  color: #f1c56b;
}
@media (max-width: 900px) {
  .retro-mission-layout {
    grid-template-columns: 1fr;
  }
  .retro-mission-figure img {
    height: 170px;
  }
}
@media (max-width: 560px) {
  .retro-mission-copy .hq-mission-title strong {
    font-size: 16px;
  }
  .retro-mission-figure img {
    height: 140px;
  }
  .mission-inline-link {
    font-size: 13px;
  }
}

/* v43.68 — menu mission style Shinobi classique */
.mission-board-column-plain {
  gap: 14px;
}
.shinobi-mission-shell {
  padding: 12px;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}
.shinobi-mission-notice {
  margin: 0 0 12px;
  padding: 10px 14px;
  border-radius: 10px;
  background: #ecdcae;
  border: 1px solid #cfb97c;
  color: #5f4725;
  font-size: 14px;
}
.shinobi-mission-list {
  display: grid;
  gap: 12px;
}
.shinobi-mission-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 260px;
  gap: 16px;
  align-items: center;
  padding: 12px;
  border-radius: 10px;
  background: #fbfbfb !important;
  border: 1px solid #787878 !important;
  box-shadow: none !important;
}
.shinobi-mission-text h3 {
  margin: 0 0 8px;
  font-size: 18px;
  line-height: 1.15;
  color: #242424;
}
.shinobi-mission-text p {
  margin: 0;
  line-height: 1.35;
  font-size: 15px;
  color: #313131;
}
.shinobi-mission-prereq {
  margin: 0 0 8px;
  color: #8a5f1d;
  font-size: 12px;
  font-weight: 700;
}
.shinobi-mission-accept {
  display: block;
  margin: 12px auto 0;
  width: 100%;
  background: transparent;
  border: none;
  color: #c1a065;
  font-size: 16px;
  font-weight: 500;
  text-align: center;
  padding: 6px 8px;
}
.shinobi-mission-accept:hover:not(:disabled) {
  color: #a67e33;
}
.shinobi-mission-accept:disabled {
  opacity: .7;
  cursor: default;
}
.shinobi-mission-image {
  margin: 0;
  width: 100%;
}
.shinobi-mission-image img {
  display: block;
  width: 100%;
  height: 118px;
  object-fit: cover;
  border: 1px solid #8b7b63;
  border-radius: 4px;
  filter: sepia(.45) saturate(.8) brightness(1.02) contrast(.95);
}
.shinobi-mission-room-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 12px;
  padding: 14px 16px;
  border-radius: 8px;
  background: #fbfbfb !important;
  border: 1px solid #8b8b8b !important;
  box-shadow: none !important;
}
.shinobi-mission-room-footer strong {
  color: #383838;
  font-size: 20px;
}
.shinobi-mission-room-footer .secondary {
  min-width: 220px;
  background: #f8f8f8;
  border: 1px solid #d3d3d3;
  color: #c09c5d;
  font-weight: 700;
}
.story-board-action {
  margin-bottom: 12px;
}
@media (max-width: 980px) {
  .shinobi-mission-card {
    grid-template-columns: 1fr;
  }
  .shinobi-mission-image img {
    height: 160px;
  }
  .shinobi-mission-room-footer {
    flex-direction: column;
    align-items: stretch;
  }
  .shinobi-mission-room-footer .secondary {
    min-width: 0;
    width: 100%;
  }
}

/* v43.70 — défilement des quêtes terminées */
.mission-list-shifting {
  overflow: hidden;
}
.mission-slide-up {
  animation: missionQueueShiftUp .42s cubic-bezier(.22,.78,.23,1) both;
}
.mission-next-from-bottom {
  animation: missionQueueNextIn .5s cubic-bezier(.22,.78,.23,1) both;
}
@keyframes missionQueueShiftUp {
  from {
    transform: translateY(132px);
  }
  to {
    transform: translateY(0);
  }
}
@keyframes missionQueueNextIn {
  0% {
    transform: translateY(150px);
    opacity: 0;
  }
  35% {
    opacity: .25;
  }
  100% {
    transform: translateY(0);
    opacity: 1;
  }
}
@media (prefers-reduced-motion: reduce) {
  .mission-slide-up,
  .mission-next-from-bottom {
    animation: none !important;
  }
}

/* v43.71 — déplacement du ninja fiable entre les bâtiments */
/* Le trajet horizontal/vertical est piloté en JS pour survivre aux re-rendus de la carte. */
.ninja-marker.traveling {
  animation: none !important;
  transition: none;
  will-change: left, top;
}
.ninja-marker.traveling span {
  animation: ninja-run-bounce .14s ease-in-out infinite alternate !important;
}

/* v43.73 — illustrations d'armes dans boutiques / inventaire */
.item-art-icon {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
  pointer-events: none;
  user-select: none;
  image-rendering: pixelated;
}
.village-shop-icon {
  overflow: hidden;
  border-radius: 7px;
  background: rgba(0,0,0,.14);
}
.legacy-shop-icon {
  width: 44px;
  height: 44px;
  min-width: 44px;
  overflow: visible;
  border-radius: 6px;
  background: #f3efe4;
  position: relative;
}
.shop-avatar-mark {
  position: absolute;
  right: -3px;
  bottom: -3px;
  width: 18px;
  height: 18px;
  display: grid;
  place-items: center;
  border-radius: 5px;
  background: var(--mark-color, #7c5cff);
  color: #fff;
  box-shadow: 0 0 0 1px #fff;
  z-index: 2;
  pointer-events: none;
}
.shop-avatar-mark svg {
  width: 12px;
  height: 12px;
  display: block;
}
.legacy-shop-icon .item-art-icon,
.inventory-legacy-icon .item-art-icon {
  image-rendering: pixelated;
}
.legacy-shop-item-top {
  grid-template-columns: 50px minmax(0, 1fr);
  align-items: center;
}
.inventory-legacy-icon {
  width: 42px;
  height: 42px;
  min-width: 42px;
  padding-top: 0;
  overflow: hidden;
  border-radius: 6px;
  background: #f3efe4;
}
.inventory-screen .inventory-legacy-icon {
  width: 36px !important;
  height: 36px !important;
  min-width: 36px !important;
}
.build-inline-icon {
  width: 42px;
  height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.academy-prep-loadout > span .item-art-icon {
  width: 34px;
  height: 34px;
}
.trophy-reward-icon {
  width: 42px;
  height: 42px;
  min-width: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  border-radius: 6px;
  background: #f3efe4;
}
.trophy-reward-icon .item-art-icon {
  width: 42px;
  height: 42px;
}


/* V43.92 — aide XP au survol. */
.has-help-tooltip {
  position: relative;
  outline: none;
  cursor: help;
}
.resource-help-tooltip {
  position: absolute;
  z-index: 2500;
  left: calc(100% + 10px);
  top: 50%;
  width: min(320px, 78vw);
  transform: translateY(-50%) translateX(-4px);
  padding: 12px 14px;
  border: 1px solid rgba(120, 110, 92, .45);
  border-radius: 8px;
  background: rgba(250, 249, 244, .98);
  color: #282520;
  box-shadow: 0 10px 28px rgba(0, 0, 0, .22);
  font-size: 12px;
  line-height: 1.35;
  text-transform: none;
  text-align: left;
  pointer-events: none;
  opacity: 0;
  visibility: hidden;
  transition: opacity .14s ease, transform .14s ease, visibility .14s ease;
}
.has-help-tooltip:hover .resource-help-tooltip,
.has-help-tooltip:focus .resource-help-tooltip,
.has-help-tooltip:focus-within .resource-help-tooltip {
  opacity: 1;
  visibility: visible;
  transform: translateY(-50%) translateX(0);
}
.xp-help-content p {
  margin: 0 0 8px;
}
.xp-help-content p + ul {
  margin-top: -2px;
}
.xp-help-content ul {
  margin: 0 0 10px 18px;
  padding: 0;
}
.xp-help-content li {
  margin: 2px 0;
}
.xp-help-content ul:last-child {
  margin-bottom: 0;
}
body.theme-night .resource-help-tooltip {
  background: rgba(28, 28, 27, .98);
  color: #f2eee5;
  border-color: rgba(225, 200, 150, .35);
}
@media (max-width: 900px) {
  .resource-help-tooltip {
    left: 0;
    top: calc(100% + 8px);
    transform: translateY(-4px);
    width: min(300px, 82vw);
  }
  .has-help-tooltip:hover .resource-help-tooltip,
  .has-help-tooltip:focus .resource-help-tooltip,
  .has-help-tooltip:focus-within .resource-help-tooltip {
    transform: translateY(0);
  }
}


/* V43.92 — visuels réels des objets équipés dans le build actif. */
.build-gear-card {
  grid-template-columns: 34px minmax(0, 1fr) !important;
}
.build-gear-card .build-equipped-item-icon {
  width: 30px !important;
  height: 30px !important;
  min-width: 30px !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  border-radius: 5px;
  background: transparent;
  font-size: 17px !important;
}
.build-gear-card .build-equipped-item-icon .item-art-icon {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
}


/* V43.93 — écran Season Pass + objectifs via la carte Progression. */
body:has(.season-pass-screen) {
  background:#2d2d2b !important;
}
.season-pass-screen {
  --season-panel:#f4f4f2;
  --season-panel-soft:#e8e8e6;
  --season-line:#d2d2ce;
  --season-text:#242522;
  --season-muted:#8b8c87;
  --season-gold:#e8c568;
  --season-orange:#ffad24;
  color:var(--season-text);
}
.season-pass-shell { align-items:start; }
.season-pass-main { min-width:0; display:grid; gap:12px; }
.season-pass-top-row { display:grid; grid-template-columns:minmax(0,1.45fr) minmax(260px,.95fr); gap:12px; }
.season-pass-screen .card {
  background:var(--season-panel);
  border:1px solid var(--season-line);
  color:var(--season-text);
  box-shadow:0 2px 6px rgba(0,0,0,.13);
}
.season-progression-card,.season-premium-card { padding:14px 16px; min-height:122px; }
.season-progression-card h3,.season-premium-card h3 { margin:0 0 11px; font-size:14px; }
.season-month { text-align:center; font-size:13px; margin-bottom:18px; text-transform:capitalize; }
.season-progress-line { display:grid; grid-template-columns:42px minmax(0,1fr) 28px; align-items:center; gap:0; max-width:360px; margin:0 auto; }
.season-bird { font-size:25px; transform:translateX(5px); z-index:2; }
.season-progress-track { height:18px; border-radius:9px 0 0 9px; background:#ffb02a; position:relative; overflow:hidden; border:1px solid #e89a10; }
.season-progress-track > span { position:absolute; inset:0 auto 0 0; background:#ff981a; }
.season-progress-track b { position:relative; display:flex; align-items:center; justify-content:center; height:100%; font-size:12px; color:#fff; text-shadow:0 1px 1px rgba(0,0,0,.25); }
.season-progress-tier { width:28px; height:28px; margin-left:-2px; border-radius:50%; background:#f5b526; border:1px solid #d99609; color:#fff; font-weight:800; display:grid; place-items:center; z-index:2; }
.season-progression-card small { display:block; text-align:center; margin-top:5px; color:#aaa; font-style:italic; font-size:11px; }
.season-premium-card { display:grid; align-content:start; }
.season-premium-card button { justify-self:center; margin-top:5px; min-width:215px; min-height:48px; border:1px solid #e3c787; border-radius:0; background:linear-gradient(#fffdf6,#e4bd65); color:#3e2e13; font-size:15px; box-shadow:none; }
.season-premium-card button small { display:block; color:#9e6110; font-style:italic; font-size:11px; }
.season-message { padding:9px 12px; font-size:12px; }
.season-rewards-card { padding:12px; }
.season-tabs { display:flex; gap:6px; margin-bottom:12px; }
.season-tabs button { border:0; background:transparent; color:#c0a268; padding:8px 14px; border-radius:12px; box-shadow:none; font-weight:800; }
.season-tabs button.active { background:#f6e5b0; color:#6c511f; }
.season-rewards-grid { display:grid; grid-template-columns:repeat(6,minmax(92px,1fr)); gap:8px; }
.season-reward-card { min-height:150px; position:relative; padding:27px 8px 10px; border-radius:5px; border:1px solid #bdbdb9; background:linear-gradient(#f3f3f2 0,#dbdbd9 25%,#d5d5d3 100%); text-align:center; overflow:hidden; }
.season-reward-tier { position:absolute; left:8px; top:5px; font-weight:800; font-size:13px; color:#111; }
.season-ticket-icon { margin-right:3px; font-size:10px; color:#111; }
.season-free-label { position:absolute; right:7px; top:28px; color:#43a9d0; font-size:8px; }
.season-reward-lock { position:absolute; left:8px; top:28px; width:22px; height:22px; display:grid; place-items:center; font-size:13px; border-radius:50%; }
.season-reward-card.is-claimed .season-reward-lock { background:#5bbd67; color:white; font-size:15px; font-weight:900; }
.season-reward-icon { min-height:63px; display:flex; align-items:center; justify-content:center; font-size:33px; margin-top:8px; }
.season-reward-icon.is-xp { font-size:24px; font-style:italic; color:#ff6a1a; font-weight:900; }
.season-reward-name { color:#aaa; font-size:11px; line-height:1.25; font-style:italic; }
.season-progression-open { cursor:pointer; transition:transform .12s ease, box-shadow .12s ease, border-color .12s ease; }
.season-progression-open:hover,.season-progression-open:focus-visible { transform:translateY(-1px); border-color:#caa257 !important; box-shadow:0 3px 9px rgba(0,0,0,.18); outline:none; }
.season-objectives-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.season-objective-card { min-height:91px; border:1px solid var(--season-line); border-radius:5px; background:#fff; padding:13px 18px 12px; display:grid; align-content:center; gap:12px; }
.season-objective-title { display:block; text-align:center; color:#111; font-size:13px; line-height:1.2; font-weight:800; }
.season-objective-row { display:grid; grid-template-columns:minmax(0,1fr) 58px; align-items:center; gap:14px; }
.season-objective-track { position:relative; height:18px; border:1px solid #e28e00; border-radius:6px; background:#ffb438; overflow:hidden; }
.season-objective-track > span { position:absolute; inset:0 auto 0 0; background:#e69a00; }
.season-objective-track b { position:relative; z-index:1; height:100%; display:grid; place-items:center; color:#fff; font-size:11px; line-height:1; text-shadow:0 1px 1px rgba(0,0,0,.22); }
.season-objective-reward { display:flex; align-items:center; justify-content:flex-start; gap:6px; color:#080808; white-space:nowrap; }
.season-objective-reward span { font-size:17px; filter:grayscale(1) contrast(2); }
.season-objective-reward b { font-size:13px; color:#080808; }
.season-objectives-note { margin:25px 0 7px; text-align:center; font-size:12px; font-style:italic; color:#111; }
.season-pass-open { width:100%; border:0; box-shadow:none; cursor:pointer; text-align:left; }
.season-pass-open:hover { filter:brightness(1.02); transform:translateY(-1px); }
.season-side-card { background:#f7ebbd !important; border-color:#d7c383 !important; }
.season-side-card .shop-pass-box { background:#faefc8 !important; }
@media(max-width:1100px){.season-rewards-grid{grid-template-columns:repeat(4,minmax(92px,1fr))}.season-pass-top-row{grid-template-columns:1fr}.season-objectives-grid{grid-template-columns:1fr}}
@media(max-width:860px){.season-pass-shell{grid-template-columns:1fr}.season-pass-shell>.village-profile-rail,.season-pass-shell>.shop-side-rail{grid-template-columns:1fr 1fr}.season-rewards-grid{grid-template-columns:repeat(3,minmax(90px,1fr))}}
@media(max-width:560px){.season-pass-shell>.village-profile-rail,.season-pass-shell>.shop-side-rail{grid-template-columns:1fr}.season-rewards-grid{grid-template-columns:repeat(2,minmax(90px,1fr))}}
\n\n/* v43.94 — revente contextuelle au bâtiment */\n.building-sell-card { margin-top: 12px; }\n.building-stock-list { display: grid; gap: 0; }\n.building-stock-row {\n  display: grid;\n  grid-template-columns: minmax(320px, 1fr) minmax(150px, .45fr) 76px 82px;\n  align-items: center;\n  gap: 14px;\n  padding: 10px 0;\n  border-top: 1px solid rgba(113, 95, 69, .16);\n}\n.building-stock-row:first-child { border-top: 0; }\n.building-stock-item { display: flex; align-items: center; gap: 10px; min-width: 0; }\n.building-stock-icon { width: 48px; height: 48px; flex: 0 0 48px; display: grid; place-items: center; }\n.building-stock-icon img { width: 46px !important; height: 46px !important; object-fit: contain; }\n.building-stock-item strong { display: block; margin-bottom: 2px; }\n.building-stock-item .legacy-shop-desc { margin: 0; }\n.building-stock-note { font-size: 12px; color: #665846; text-align: center; }\n.building-stock-price { display: grid; justify-items: center; line-height: 1; }\n.building-stock-price strong { font-size: 15px; }\n.building-stock-price small { margin-top: 3px; font-size: 10px; color: #655844; text-transform: lowercase; }\n.building-stock-sell { min-width: 76px; }\n@media (max-width: 900px) {\n  .building-stock-row { grid-template-columns: minmax(220px, 1fr) 70px 78px; }\n  .building-stock-note { display: none; }\n}\n@media (max-width: 620px) {\n  .building-stock-row { grid-template-columns: 1fr auto; gap: 8px; }\n  .building-stock-price { grid-column: 2; grid-row: 1; align-self: start; }\n  .building-stock-sell { grid-column: 2; grid-row: 1; margin-top: 28px; }\n}\n

/* v43.98 — haut du créateur rapproché de l'esthétique Shinobi classique */
.avatar-studio-screen {
  padding-top: 10px !important;
}
.avatar-studio-title {
  min-height: 66px;
  margin: 0 0 10px;
  padding: 10px 16px;
  border: 1px solid #c8b98f;
  border-radius: 8px;
  background: linear-gradient(180deg,#f8f3e6 0%,#eee5ce 100%);
  box-shadow: 0 2px 5px rgba(50,38,18,.18);
  color: #2f2a21;
}
.avatar-studio-title .creator-heading {
  display: grid;
  gap: 2px;
}
.avatar-studio-title .eyebrow {
  color: #8a6428;
  letter-spacing: .12em;
  font-size: 10px;
}
.avatar-studio-title h2 {
  margin: 0;
  color: #2f2a21;
  font-size: 21px;
  line-height: 1.1;
  font-weight: 800;
}
.avatar-studio-title .inline-actions {
  gap: 7px;
}
.avatar-studio-title .inline-actions button,
.avatar-studio-title .inline-actions .secondary {
  min-width: 0;
  padding: 8px 12px;
  border: 1px solid #c6b68f !important;
  border-radius: 6px !important;
  background: linear-gradient(180deg,var(--bg-input),#eee6d3) !important;
  box-shadow: 0 1px 2px rgba(50,38,18,.12) !important;
  color: #2f2a21 !important;
  font-size: 13px;
}
.avatar-studio-title .inline-actions button:hover {
  border-color: #a9813b !important;
  filter: none;
  background: #f6edd8 !important;
}
.creator-screen > .message-card {
  margin: 0 0 10px;
  padding: 10px 14px;
  border: 1px solid #c8b98f;
  border-radius: 7px;
  background: #f7f2e5;
  box-shadow: none;
  color: #342e24;
}
.creator-screen > .message-card strong {
  color: #342e24;
  font-size: 13px;
}
@media (max-width: 760px) {
  .avatar-studio-title {
    align-items: stretch;
    flex-direction: column;
    gap: 9px;
  }
  .avatar-studio-title .inline-actions {
    justify-content: flex-start;
  }
}

/* v43.99 — création de compte / origine façon Shinobi classique */
.shinobi-auth-screen {
  min-height: 100vh;
  display: grid;
  place-items: start center;
  padding: 28px 14px 50px;
  background:
    linear-gradient(rgba(31,28,15,.68), rgba(31,28,15,.68)),
    url('village-map.png') center top / cover fixed no-repeat;
}
.shinobi-auth-shell {
  width: min(420px, 100%);
  margin-top: 0;
}
.shinobi-auth-tabs {
  width: 275px;
  max-width: calc(100% - 32px);
  margin: 0 auto -18px;
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: 1fr 1fr;
  padding: 4px;
  border-radius: 24px;
  background: #fff;
  box-shadow: 0 4px 14px rgba(0,0,0,.18);
}
.shinobi-auth-tabs button {
  min-height: 40px;
  border: 0 !important;
  border-radius: 20px !important;
  background: transparent !important;
  color: #666 !important;
  box-shadow: none !important;
  font-size: 14px;
  font-weight: 800;
}
.shinobi-auth-tabs button.active {
  background: linear-gradient(135deg,#cf9300,#f5c400) !important;
  color: #fff !important;
}
.shinobi-auth-card {
  padding: 34px 30px 25px;
  border: 1px solid #d8d8d8;
  border-radius: 10px;
  background: rgba(255,255,255,.97);
  box-shadow: 0 13px 35px rgba(0,0,0,.25);
  color: #535353;
}
.shinobi-auth-card h1 {
  margin: 0 0 20px;
  text-align: center;
  color: #626262;
  font-size: 26px;
  line-height: 1.1;
  font-weight: 800;
}
.shinobi-auth-form { display: grid; gap: 12px; }
.shinobi-auth-form input {
  width: 100%;
  min-height: 47px;
  border: 2px solid #20b64f;
  border-radius: 6px;
  background: #fff;
  color: #222;
  padding: 0 16px;
  outline: none;
  font-size: 15px;
}
.shinobi-auth-form input:focus {
  border-color: #d9a400;
  box-shadow: 0 0 0 3px rgba(217,164,0,.12);
}
.shinobi-village-title {
  margin: 12px 0 3px;
  text-align: center;
  color: #767676;
  font-size: 14px;
  font-weight: 700;
}
.auth-village-options {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
  padding: 0 10px;
}
.auth-village-choice {
  min-height: 86px;
  padding: 9px 5px !important;
  display: grid !important;
  place-items: center;
  align-content: center;
  gap: 5px;
  border: 2px solid #d9d9d9 !important;
  border-radius: 11px !important;
  background: #fff !important;
  color: #666 !important;
  box-shadow: 0 2px 8px rgba(0,0,0,.06) !important;
  font-size: 13px;
  font-style: italic;
}
.auth-village-choice.selected {
  border-color: #dfa000 !important;
  box-shadow: 0 0 0 1px #dfa000, 0 5px 12px rgba(203,143,0,.16) !important;
}
.auth-village-icon { font-size: 28px; line-height: 1; display: grid; place-items: center; }
.auth-village-icon .village-logo { width: 40px; height: 60px; }
.auth-village-choice strong { font-weight: 750; }
.auth-village-description {
  min-height: 102px;
  margin: 10px 10px 2px;
  padding: 12px 13px;
  display: grid;
  place-items: center;
  border: 1px solid #e5e5e5;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 4px 12px rgba(0,0,0,.06);
  color: #777;
  text-align: center;
  font-size: 13px;
  font-style: italic;
  line-height: 1.45;
}
.shinobi-start-button {
  width: calc(100% - 42px);
  min-height: 48px;
  margin: 2px auto 0;
  border: 0 !important;
  border-radius: 7px !important;
  background: linear-gradient(90deg,#d09500,#ffd000) !important;
  color: #fff !important;
  box-shadow: 0 8px 18px rgba(209,151,0,.2) !important;
  font-size: 14px;
  font-weight: 900;
}
.shinobi-auth-card .auth-message {
  margin: 0 0 12px;
  border-color: #e1c16e;
  background: #fff8df;
  color: #6c5421;
}
.shinobi-auth-card .auth-note { text-align: center; color: #8a8a8a; }
.sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0,0,0,0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}
@media(max-width:480px){
  .shinobi-auth-screen{padding:18px 9px 30px}
  .shinobi-auth-card{padding:32px 20px 22px}
  .auth-village-options{gap:12px;padding:0}
  .auth-village-choice{min-height:82px}
  .shinobi-start-button{width:100%}
  .auth-village-description{margin-left:0;margin-right:0}
}

/* v44.00 — création initiale isolée, inspirée de la disposition classique Shinobi. */
.creator-only-screen {
  min-height:100vh;
  background:#2b2b2a;
  color:#222;
}
.creator-only-topbar {
  height:48px;
  display:flex;
  align-items:center;
  background:#111;
  border-bottom:1px solid #252525;
  box-shadow:0 1px 0 rgba(255,255,255,.025) inset;
}
.creator-only-topbar-inner {
  width:min(930px,calc(100% - 28px));
  height:100%;
  margin:0 auto;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:0 10px;
  box-sizing:border-box;
}
.creator-only-logo {
  display:flex;
  align-items:center;
  white-space:nowrap;
  color:#ddd5bd;
  text-shadow:0 1px 0 #000,0 0 7px rgba(230,213,165,.12);
}
.creator-logo-word {
  font-family:Georgia,"Times New Roman",serif;
  font-size:22px;
  line-height:1;
  font-style:italic;
  letter-spacing:-.055em;
  color:#f0ead8;
}
.creator-logo-eternal {
  margin-left:3px;
  font-family:Georgia,"Times New Roman",serif;
  font-size:10px;
  line-height:1;
  font-style:italic;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:#b8ad91;
  align-self:flex-end;
  padding-bottom:8px;
}
.creator-logo-ornament {
  margin-right:6px;
  font-size:18px;
  color:#83775c;
  transform:scaleX(1.3);
}
.creator-logo-ornament.right {
  margin:0 0 0 6px;
}
.creator-only-tools {
  display:flex;
  align-items:center;
  gap:20px;
  color:#8e8e8e;
  font-size:13px;
  line-height:1;
}
.creator-only-tools span {display:inline-grid;place-items:center;min-width:12px;height:18px;font-weight:700;opacity:.9}
@media(max-width:600px){
  .creator-only-tools{gap:13px;font-size:12px}
  .creator-logo-eternal{display:none}
  .creator-logo-word{font-size:19px}
}
.creator-reference-screen {
  width:min(930px,calc(100% - 28px));
  margin:8px auto 0;
  padding:0 0 20px !important;
  max-width:930px !important;
  background:#f4f4f4;
  border-radius:4px;
  box-shadow:none;
}
.creator-reference-title {
  padding:12px 10px 8px;
  font-size:12px;
  font-weight:800;
  color:#222;
}
.creator-reference-shell.avatar-studio-shell {
  grid-template-columns:190px minmax(0,1fr);
  gap:12px;
  margin:0 10px;
  padding:12px;
  border:0;
  border-radius:0;
  background:#f4f4f4;
  box-shadow:none;
}
.creator-reference-shell .avatar-studio-preview {
  height:178px;
  border-radius:6px;
  background:#d7d7d7;
}
.creator-reference-shell .avatar-studio-preview .ninja-portrait {
  width:165px !important;
}
.creator-reference-shell .avatar-mode-switch {
  grid-template-columns:1fr 1fr;
  gap:6px;
}
.creator-reference-shell .avatar-mode-switch button {
  min-height:34px;
  font-size:11px;
}
.creator-reference-shell .avatar-studio-main {
  padding:10px;
  border:1px solid #d2a75b;
  border-radius:5px;
  min-height:385px;
}
.creator-reference-shell .avatar-editor-tabs {
  gap:8px;
  margin-bottom:10px;
}
.creator-reference-shell .avatar-editor-tab {
  min-height:36px;
  padding:6px 8px !important;
  font-size:11px;
}
.creator-reference-shell .avatar-editor-panel {
  min-height:330px;
}
.creator-reference-screen .avatar-studio-footer {
  padding:12px 0 4px;
}
.creator-reference-screen .avatar-continue {
  min-width:170px;
  min-height:42px;
  font-size:13px !important;
}
@media(max-width:700px){
  .creator-reference-shell.avatar-studio-shell{grid-template-columns:1fr}
  .creator-reference-shell .avatar-studio-left{grid-template-columns:150px 1fr}
}

/* V44.03 — during character creation/tutorial, keep the normal game bar but hide progression tabs. */
.game-header-minimal .game-header-tools { margin-left:auto; }



/* V44.04 — premier écran du tutoriel : l'Académie appelle le joueur au réveil. */
.tutorial-village-screen .map-pin.tutorial-wake-target .pin-badge {
  animation: tutorial-academy-flash .75s ease-in-out infinite;
  transform-origin: center;
}
.tutorial-village-screen .map-pin.tutorial-wake-target .pin-text {
  font-weight: 900;
}
.tutorial-village-screen .map-pin.tutorial-wake-target::after {
  content: "";
  position: absolute;
  inset: -5px;
  border: 3px solid rgba(255, 196, 0, .95);
  border-radius: 12px;
  pointer-events: none;
  animation: tutorial-academy-ring .75s ease-in-out infinite;
}
.tutorial-sleep-chat .tutorial-sleep-line {
  min-height: 100%;
  display: flex;
  align-items: center;
}
.tutorial-sleep-chat .tutorial-sleep-line span {
  font-weight: 700;
  letter-spacing: .02em;
}
@keyframes tutorial-academy-flash {
  0%, 100% { filter: brightness(1); transform: scale(1); box-shadow: 0 0 0 rgba(255,196,0,0); }
  50% { filter: brightness(1.35); transform: scale(1.08); box-shadow: 0 0 18px rgba(255,196,0,.95); }
}
@keyframes tutorial-academy-ring {
  0%, 100% { opacity: .25; transform: scale(.96); }
  50% { opacity: 1; transform: scale(1.10); }
}
@media (prefers-reduced-motion: reduce) {
  .tutorial-village-screen .map-pin.tutorial-wake-target .pin-badge,
  .tutorial-village-screen .map-pin.tutorial-wake-target::after { animation: none !important; }
}

/* V44.07 — conversation de l'instructeur reproduite sur le modèle du tutoriel Shinobi.fr. */
.tutorial-instructor-screen {
  min-height: 100vh;
  padding: 12px 18px 36px;
  background: #2d2d2d;
  color: #171717;
}
.tutorial-instructor-layout {
  display: grid;
  grid-template-columns: 220px minmax(0, 690px) 190px;
  gap: 12px;
  align-items: start;
  max-width: 1120px;
  margin: 0 auto;
}
.tutorial-instructor-screen .academy-intro-profile { grid-column: auto; }
.tutorial-instructor-screen .academy-intro-profile-card,
.tutorial-instructor-screen .academy-intro-purse {
  background: #f6f6f6 !important;
  border: 0 !important;
  border-radius: 6px;
  box-shadow: none !important;
}
.tutorial-instructor-main { display: grid; gap: 10px; min-width: 0; }
.tutorial-instructor-story {
  min-height: 38px;
  padding: 10px 13px;
  background: #f7e6b9;
  border-radius: 6px;
  font-size: 12px;
  line-height: 1.35;
  font-weight: 600;
}
.tutorial-instructor-card,
.tutorial-instructor-choice-card,
.tutorial-instructor-mission-card {
  background: #f5f5f5;
  border-radius: 5px;
  border: 0;
  box-shadow: none;
}
.tutorial-instructor-card { padding: 10px 12px 13px; }
.tutorial-instructor-card h3,
.tutorial-instructor-choice-card h3,
.tutorial-instructor-mission-card h3 {
  margin: 0 0 9px;
  font-size: 13px;
  font-weight: 800;
}
.tutorial-instructor-dialogue {
  display: grid;
  grid-template-columns: 56px minmax(0, 1fr);
  gap: 9px;
  align-items: center;
}
.tutorial-instructor-dialogue img {
  width: 56px;
  height: 66px;
  object-fit: contain;
  object-position: center bottom;
  image-rendering: pixelated;
}
.tutorial-instructor-dialogue p {
  margin: 0;
  padding: 7px 9px;
  min-height: 54px;
  background: #fff;
  border: 1px solid #9c9c9c;
  border-radius: 5px;
  font-size: 12px;
  line-height: 1.25;
}
.tutorial-instructor-choice-card { padding: 11px 12px 14px; }
.tutorial-instructor-choice-card button {
  display: block;
  width: 52%;
  min-width: 300px;
  margin: 0 auto;
  padding: 5px 12px;
  border: 1px solid #c9c9c9;
  border-radius: 2px;
  background: linear-gradient(#fff, #f3f3f3);
  color: #b99c61;
  font-weight: 600;
  box-shadow: none;
}
.tutorial-instructor-leave-card button { color: #111; font-weight: 700; }
.tutorial-instructor-side { min-width: 0; }
.tutorial-instructor-mission-card { padding: 10px 11px 12px; }
.tutorial-instructor-mission-card h3 { margin-bottom: 10px; }
.tutorial-instructor-mission-empty {
  height: 33px;
  margin-bottom: 10px;
  border-radius: 7px;
  background: #e8e8e8;
}
.tutorial-instructor-mission-card button {
  width: 100%;
  padding: 7px 9px;
  background: #fff;
  color: #171717;
  border: 1px solid #dedede;
  border-radius: 3px;
  text-align: left;
  font-size: 11px;
}
.tutorial-instructor-mission-card button span { float: right; font-weight: 800; }
@media (max-width: 900px) {
  .tutorial-instructor-layout { grid-template-columns: 1fr; }
  .tutorial-instructor-choice-card button { min-width: 0; width: 100%; }
}


/* V44.08 — écran d'introduction à l'examen d'entrée */
.tutorial-exam-mission-body {
  background: #f3f3f3;
  border-radius: 7px;
  padding: 12px 12px 14px;
  margin: 0 0 10px;
  color: #221d17;
  font-size: 12px;
  line-height: 1.35;
}
.tutorial-exam-mission-body p { margin: 0 0 7px; }
.tutorial-exam-mission-body strong { display: block; font-weight: 700; }
.tutorial-exam-intro-screen .tutorial-instructor-story { font-weight: 600; }

/* V44.13 — après l'examen final, le Quartier Général devient la prochaine cible du tutoriel. */
.tutorial-village-screen .map-pin.tutorial-ceremony-target .pin-badge {
  animation: tutorial-academy-flash .75s ease-in-out infinite;
  transform-origin: center;
}
.tutorial-village-screen .map-pin.tutorial-ceremony-target .pin-text {
  font-weight: 900;
}
.tutorial-village-screen .map-pin.tutorial-ceremony-target::after {
  content: "";
  position: absolute;
  inset: -5px;
  border: 3px solid rgba(255, 196, 0, .95);
  border-radius: 12px;
  pointer-events: none;
  animation: tutorial-academy-ring .75s ease-in-out infinite;
}
@media (prefers-reduced-motion: reduce) {
  .tutorial-village-screen .map-pin.tutorial-ceremony-target .pin-badge,
  .tutorial-village-screen .map-pin.tutorial-ceremony-target::after { animation: none !important; }
}

/* V44.14 — fin du mini tutoriel au Quartier Général. */
.tutorial-location-heading { padding-bottom: 2px; }
.tutorial-location-heading strong { font-weight: 700; }
.tutorial-genin-ceremony-screen .tutorial-chief-card .tutorial-instructor-dialogue img {
  width: 66px;
  height: 68px;
  object-fit: cover;
  image-rendering: pixelated;
}
.tutorial-genin-ceremony-screen .tutorial-instructor-dialogue p {
  white-space: normal;
}
.tutorial-ceremony-mission-empty {
  min-height: 42px;
  display: flex;
  align-items: center;
  padding: 10px 12px;
  color: #222;
}
\n\n/* V44.17 — tutoriel : cibles sobres, sans gros flash jaune ni badge rouge. */
.tutorial-village-screen .map-pin.tutorial-wake-target .pin-badge,
.tutorial-village-screen .map-pin.tutorial-ceremony-target .pin-badge,
.village-screen .map-pin.mission-target .pin-badge {
  animation: none !important;
  background: rgba(24, 24, 21, .94) !important;
  color: #fff7df !important;
  border: 1px solid #d8a93a !important;
  box-shadow: 0 0 0 2px rgba(216,169,58,.18), 0 4px 10px rgba(0,0,0,.36) !important;
}
.tutorial-village-screen .map-pin.tutorial-wake-target .pin-text,
.tutorial-village-screen .map-pin.tutorial-ceremony-target .pin-text,
.village-screen .map-pin.mission-target .pin-text {
  color: #fff7df !important;
  text-shadow: 0 1px 2px #000 !important;
}
.tutorial-village-screen .map-pin.tutorial-wake-target::after,
.tutorial-village-screen .map-pin.tutorial-ceremony-target::after,
.village-screen .map-pin.mission-target::after {
  content: "" !important;
  inset: -4px !important;
  width: auto !important;
  height: auto !important;
  right: auto !important;
  top: auto !important;
  border: 1px solid rgba(231,190,83,.72) !important;
  border-radius: 7px !important;
  background: transparent !important;
  box-shadow: 0 0 10px rgba(231,190,83,.30) !important;
  animation: none !important;
}
/* Une épreuve insuffisante reste une vraie action : visuel normal, 1 PA consommé, puis message d'échec. */
.tutorial-village-screen .academy-choice-row,
.tutorial-village-screen .tutorial-action-row {
  opacity: 1 !important;
  cursor: pointer !important;
  background: #fff !important;
  color: #171717 !important;
}

/* V44.19 — cible de quête : cadre noir/doré + léger rebond, pour le tutoriel et les missions normales. */
.tutorial-village-screen .map-pin.tutorial-wake-target .pin-badge,
.tutorial-village-screen .map-pin.tutorial-ceremony-target .pin-badge,
.village-screen .map-pin.mission-target .pin-badge {
  background: rgba(13, 13, 12, .97) !important;
  color: #fff8df !important;
  border: 2px solid #e2ad26 !important;
  border-radius: 7px !important;
  box-shadow: 0 0 0 1px rgba(255,224,117,.22), 0 4px 9px rgba(0,0,0,.42) !important;
  animation: quest-target-soft-bounce 1.05s ease-in-out infinite !important;
  transform-origin: center bottom;
}
.tutorial-village-screen .map-pin.tutorial-wake-target .pin-text,
.tutorial-village-screen .map-pin.tutorial-ceremony-target .pin-text,
.village-screen .map-pin.mission-target .pin-text {
  color: #fff8df !important;
  text-shadow: 0 1px 2px #000 !important;
  font-weight: 900 !important;
}
.tutorial-village-screen .map-pin.tutorial-wake-target::after,
.tutorial-village-screen .map-pin.tutorial-ceremony-target::after,
.village-screen .map-pin.mission-target::after {
  content: none !important;
  display: none !important;
}
@keyframes quest-target-soft-bounce {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-3px); }
}
@media (prefers-reduced-motion: reduce) {
  .tutorial-village-screen .map-pin.tutorial-wake-target .pin-badge,
  .tutorial-village-screen .map-pin.tutorial-ceremony-target .pin-badge,
  .village-screen .map-pin.mission-target .pin-badge { animation: none !important; }
}

/* V44.20 — cible de quête beaucoup plus visible : rebond franc + halo doré.
   Le mouvement reste actif même si le système demande de réduire les animations,
   car il sert ici d'indicateur de destination demandé par le joueur. */
.tutorial-village-screen .map-pin.tutorial-wake-target .pin-badge,
.tutorial-village-screen .map-pin.tutorial-ceremony-target .pin-badge,
.village-screen .map-pin.mission-target .pin-badge {
  background: #11100d !important;
  color: #fff9df !important;
  border: 2px solid #ffc928 !important;
  box-shadow:
    0 0 0 2px rgba(255,201,40,.25),
    0 0 14px rgba(255,193,26,.85),
    0 6px 12px rgba(0,0,0,.55) !important;
  animation: quest-target-bounce-visible .82s cubic-bezier(.35,.05,.28,1) infinite !important;
  will-change: transform, box-shadow;
}
.tutorial-village-screen .map-pin.tutorial-wake-target .pin-text,
.tutorial-village-screen .map-pin.tutorial-ceremony-target .pin-text,
.village-screen .map-pin.mission-target .pin-text {
  color: #fff9df !important;
  font-weight: 950 !important;
  letter-spacing: .15px;
}
@keyframes quest-target-bounce-visible {
  0%, 100% {
    transform: translateY(0) scale(1);
    box-shadow: 0 0 0 2px rgba(255,201,40,.22), 0 0 12px rgba(255,193,26,.72), 0 6px 12px rgba(0,0,0,.55);
  }
  42% {
    transform: translateY(-8px) scale(1.045);
    box-shadow: 0 0 0 3px rgba(255,218,72,.32), 0 0 24px rgba(255,193,26,1), 0 10px 16px rgba(0,0,0,.48);
  }
  58% { transform: translateY(-7px) scale(1.035); }
}
/* Annule uniquement l'ancienne règle reduced-motion pour les cibles de quête. */
@media (prefers-reduced-motion: reduce) {
  .tutorial-village-screen .map-pin.tutorial-wake-target .pin-badge,
  .tutorial-village-screen .map-pin.tutorial-ceremony-target .pin-badge,
  .village-screen .map-pin.mission-target .pin-badge {
    animation: quest-target-bounce-visible .82s cubic-bezier(.35,.05,.28,1) infinite !important;
  }
}

/* V44.21 — panneau Mission en cours permanent sur l'écran du village */
.village-screen:not(.tutorial-village-screen) .map-detail.location-choice-panel {
  grid-column: 2 !important;
  grid-row: 1 !important;
}
.village-mission-card {
  grid-column: 2;
  grid-row: 2;
  align-self: start;
  padding: 10px;
  color: var(--text-primary);
  background: var(--bg-panel);
  border: 1px solid var(--border-primary);
  border-radius: 8px;
  box-shadow: 0 5px 14px rgba(76,54,25,.12);
}
.village-mission-card h3 {
  margin: 0 0 8px;
  font-size: 13px;
  color: #2d2921;
}
.village-mission-body {
  display: grid;
  gap: 4px;
  min-height: 56px;
  padding: 9px 10px;
  margin-bottom: 8px;
  border-radius: 6px;
  background: #ebe6da;
  color: #3c352b;
  font-size: 11px;
  line-height: 1.3;
}
.village-mission-body strong { font-size: 11px; color: #2f2a22; }
.village-mission-body p { margin: 0; color: #554b3c; }
.village-mission-body small { color: #8a7456; font-size: 9px; }
.village-mission-body.is-empty { align-content: center; color: #5d5548; }
.village-mission-journal {
  width: 100%;
  min-height: 32px;
  padding: 6px 9px;
  border: 1px solid #cdbf9c;
  border-radius: 5px;
  background: #fffdf7;
  color: #2f2b24;
  box-shadow: none;
  font-size: 10px;
  font-weight: 700;
}
.village-mission-journal:hover { background: var(--bg-card); border-color: #d7aa56; transform: none; }
@media(max-width:700px){
  .village-mission-card { grid-column:1; grid-row:auto; }
  .village-screen:not(.tutorial-village-screen) .map-detail.location-choice-panel { grid-column:1 !important; grid-row:auto !important; }
}


/* V44.22 — panneau Mission en cours fidèle à la référence Shinobi */
.village-mission-card {
  padding: 10px 10px 11px;
  background: #f4f4f4;
  border: 1px solid #c8c8c8;
  border-radius: 4px;
  box-shadow: none;
}
.village-mission-card h3 {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 0 0 10px;
  font-size: 13px;
  font-weight: 800;
  color: #111;
}
.village-mission-body {
  display: block;
  min-height: 0;
  padding: 14px 14px 13px;
  margin: 0 0 10px;
  border-radius: 10px;
  background: #e9e9e9;
  color: #191919;
  font-size: 12px;
  line-height: 1.3;
}
.village-mission-body strong {
  display: block;
  margin-bottom: 10px;
  color: #181818;
  font-size: 12px;
  font-weight: 500;
}
.village-mission-body p {
  margin: 0 0 4px;
  color: #181818;
  font-size: 12px;
}
.village-mission-location {
  display: flex;
  align-items: flex-start;
  gap: 5px;
  color: #181818;
  font-size: 12px;
  line-height: 1.25;
}
.village-mission-location > span {
  display: inline-block;
  margin-top: 2px;
  font-size: 8px;
  color: #191919;
}
.village-mission-body.is-empty {
  min-height: 56px;
  display: grid;
  align-content: center;
}
.village-mission-journal {
  min-height: 31px;
  border: 1px solid #c9c9c9;
  border-radius: 3px;
  background: #fff;
  color: #111;
  font-size: 11px;
  font-weight: 500;
  text-align: left;
  padding: 5px 10px;
}
.village-mission-journal span { float: right; font-size: 16px; line-height: 1; }


/* V44.24 — créateur recopié sur la référence utilisateur, sans génération d'image. */
.creator-reference-screen {
  width:min(1180px,calc(100% - 8px));
  max-width:1180px !important;
  margin:2px auto 0;
  padding:0 0 34px !important;
  border-radius:5px;
  background:#f4f4f4;
  color:#151515;
}
.creator-reference-title {
  padding:12px 12px 10px;
  font-size:13px;
  font-style:italic;
  font-weight:850;
  color:#171717;
}
.creator-reference-shell.avatar-studio-shell {
  grid-template-columns:225px minmax(0,1fr);
  gap:26px;
  margin:20px 38px 0;
  padding:0;
  border:0;
  background:transparent;
}
.creator-reference-shell .avatar-studio-left {
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:0;
}
.creator-reference-shell .avatar-studio-preview {
  width:120px;
  height:150px;
  border:0;
  border-radius:7px;
  background:#d2d2d2;
  overflow:hidden;
}
.creator-reference-shell .avatar-studio-preview .ninja-portrait {
  width:138px !important;
  max-width:none;
  border:0;
  border-radius:0;
  background:transparent;
  transform:translateY(-4px);
}
.creator-reference-shell .avatar-studio-preview .ninja-svg { width:100%;height:100%; }
.avatar-retro-badge {
  margin-top:7px;
  min-height:19px;
  padding:2px 9px;
  border-radius:12px;
  background:#f4e4d1;
  color:#aa5a1b;
  font-size:11px;
  font-weight:700;
  line-height:15px;
}
.creator-reference-shell .avatar-mode-switch {
  width:205px;
  margin-top:46px;
  grid-template-columns:1fr 1fr;
  gap:8px;
}
.creator-reference-shell .avatar-mode-switch button {
  min-height:37px;
  padding:7px 11px !important;
  border-radius:6px !important;
  font-size:12px;
  font-weight:800;
}
.creator-reference-shell .avatar-studio-main {
  min-height:565px;
  padding:24px;
  border:1px solid #d2a054;
  border-radius:6px;
  background:#fff;
}
.creator-reference-shell .avatar-editor-tabs {
  grid-template-columns:repeat(6,minmax(0,1fr));
  gap:12px;
  margin:0 0 24px;
}
.creator-reference-shell .avatar-editor-tab {
  min-height:41px;
  padding:7px 10px !important;
  border-radius:6px !important;
  font-size:12px;
}
.creator-reference-shell .avatar-editor-tab > span { font-size:16px; }
.creator-reference-shell .avatar-editor-panel {
  min-height:449px;
  border:1px solid #dfe4f0;
  border-radius:6px;
  background:#fff;
}
.creator-reference-shell .avatar-editor-scroll {
  max-height:445px;
  min-height:445px;
  padding:17px;
}
.creator-reference-shell .avatar-choice-grid {
  display:flex;
  align-items:flex-start;
  flex-wrap:wrap;
  gap:20px;
}
.creator-reference-shell .avatar-choice-tile {
  width:120px;
  min-width:120px;
  min-height:144px;
  padding:0 0 7px !important;
  border-radius:6px !important;
  overflow:visible;
  grid-template-rows:120px auto;
  gap:7px;
  background:transparent !important;
  border:0 !important;
  color:#444 !important;
}
.creator-reference-shell .avatar-choice-preview {
  width:120px;
  height:120px;
  border:1px solid #b8dcc7;
  border-radius:6px;
  background:#fafafa;
  overflow:hidden;
}
.creator-reference-shell .avatar-choice-tile.selected .avatar-choice-preview {
  border:2px solid #d79b00;
  background:#e1aa18;
  box-shadow:0 5px 12px rgba(170,112,0,.22);
}
.creator-reference-shell .avatar-choice-tile strong {
  font-size:11px;
  font-weight:500;
  color:#444;
}
.creator-reference-shell .avatar-choice-tile.selected { box-shadow:none !important; }
.creator-reference-shell .avatar-choice-tile > i {
  top:4px;
  right:4px;
  width:18px;
  height:18px;
  font-size:12px;
}
.avatar-reference-body {
  display:block;
  width:auto;
  height:112px;
  max-width:96px;
  object-fit:contain;
  object-position:center bottom;
  mix-blend-mode:multiply;
}
.creator-reference-shell .avatar-choice-tile.selected .avatar-reference-body { mix-blend-mode:multiply; }
.creator-reference-shell .avatar-choice-preview .ninja-portrait,
.creator-reference-shell .avatar-choice-preview .ninja-svg {
  width:105px !important;
  height:118px !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
}
.creator-reference-screen .avatar-studio-footer {
  padding:32px 0 0;
  gap:8px;
}
.creator-reference-screen .avatar-studio-footer p {
  margin:0;
  color:#fff;
  font-size:12px;
  text-shadow:0 1px 1px rgba(0,0,0,.08);
}
.creator-reference-screen .avatar-studio-footer-actions .secondary {
  min-height:53px;
  min-width:140px;
  background:rgba(255,255,255,.16) !important;
  color:#fff !important;
  border:1px solid rgba(255,255,255,.28) !important;
}
.creator-reference-screen .avatar-continue {
  min-width:216px;
  min-height:53px;
  border-radius:8px !important;
  font-size:17px !important;
  font-weight:800;
}
@media(max-width:900px){
  .creator-reference-shell.avatar-studio-shell{grid-template-columns:190px minmax(0,1fr);margin:14px 18px 0;gap:14px}
  .creator-reference-shell .avatar-mode-switch{width:180px}
  .creator-reference-shell .avatar-editor-tabs{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:700px){
  .creator-reference-shell.avatar-studio-shell{grid-template-columns:1fr;margin:10px}
  .creator-reference-shell .avatar-studio-left{display:grid;grid-template-columns:130px 1fr;column-gap:14px;align-items:start}
  .creator-reference-shell .avatar-mode-switch{margin-top:10px;width:100%}
  .avatar-retro-badge{grid-column:1}
  .creator-reference-shell .avatar-studio-main{padding:12px;min-height:0}
  .creator-reference-shell .avatar-editor-scroll{min-height:350px}
}

/* V44.24 — correctifs du créateur : corps de genre cohérents et aperçu non rogné. */
.creator-reference-shell .avatar-studio-preview .ninja-portrait {
  width:120px !important;
  height:150px !important;
  aspect-ratio:auto !important;
  transform:none !important;
  overflow:visible !important;
}
.creator-reference-shell .avatar-studio-preview .ninja-svg {
  width:120px !important;
  height:150px !important;
  transform:translateY(2px) scale(.86);
  transform-origin:50% 20%;
}
.creator-reference-shell .avatar-choice-preview {
  display:flex;
  align-items:center;
  justify-content:center;
}
.creator-reference-shell .avatar-reference-body {
  width:auto;
  height:112px;
  max-width:100px;
  object-fit:contain;
  object-position:center bottom;
  mix-blend-mode:normal !important;
}
.creator-reference-shell .avatar-choice-tile.selected .avatar-reference-body {
  mix-blend-mode:normal !important;
}


/* v44.25 — Le carré d'avatar de création utilise désormais le nouveau skin de référence.
   L'ancien moteur de skin est conservé à part dans assets/legacy-avatar/ et n'est plus utilisé dans ce carré. */
.creator-reference-screen .avatar-studio-preview {
  overflow: hidden;
  display: grid;
  place-items: end center;
}
.creator-reference-screen .creator-new-skin {
  width: 100%;
  height: 100%;
  display: grid;
  place-items: end center;
  overflow: hidden;
}
.creator-reference-screen .creator-new-skin img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center bottom;
  image-rendering: auto;
}
\n\n/* v44.26 — Peaux du créateur reprises des références utilisateur. */\n.avatar-editor-panel:has(.avatar-skin-tile) .avatar-editor-scroll { padding:16px; }\n.avatar-editor-panel:has(.avatar-skin-tile) .avatar-choice-grid {\n  grid-template-columns:repeat(4,minmax(120px,1fr));\n  gap:12px;\n}\n.avatar-choice-tile.avatar-skin-tile {\n  min-height:194px;\n  padding:0 !important;\n  border:1px solid #dfe2ed !important;\n  border-radius:7px !important;\n  background:#fff !important;\n  overflow:hidden;\n}\n.avatar-choice-tile.avatar-skin-tile .avatar-choice-preview {\n  width:100%; height:100%; min-height:190px;\n  background:#fff !important; border-radius:0;\n}\n.avatar-choice-tile.avatar-skin-tile .avatar-skin-reference {\n  width:auto; height:138px; max-width:90%; object-fit:contain; image-rendering:auto;\n}\n.avatar-choice-tile.avatar-skin-tile.selected {\n  border:1px solid #d8d7c8 !important;\n  background:#faf8ed !important;\n  box-shadow:none !important;\n}\n.avatar-choice-tile.avatar-skin-tile.selected .avatar-choice-preview { background:#faf8ed !important; }\n.avatar-choice-tile.avatar-skin-tile > i { display:none; }\n.creator-new-skin img { width:auto !important; height:100% !important; max-width:100% !important; object-fit:contain !important; }\n@media(max-width:900px){.avatar-editor-panel:has(.avatar-skin-tile) .avatar-choice-grid{grid-template-columns:repeat(3,minmax(100px,1fr));}}\n@media(max-width:680px){.avatar-editor-panel:has(.avatar-skin-tile) .avatar-choice-grid{grid-template-columns:repeat(2,minmax(100px,1fr));}}\n
/* V44.28 — 38 coiffures masculines reprises de la référence utilisateur. */
.creator-reference-shell .avatar-editor-panel:has(.avatar-hair-grid) .avatar-editor-scroll {
  padding:16px;
}
.creator-reference-shell .avatar-hair-grid {
  display:grid !important;
  grid-template-columns:repeat(10,minmax(62px,1fr));
  gap:12px !important;
  width:100%;
}
.creator-reference-shell .avatar-choice-tile.avatar-hair-tile {
  width:auto !important;
  min-width:0 !important;
  min-height:70px !important;
  padding:0 !important;
  display:block;
  border:1px solid #dfe4f0 !important;
  border-radius:7px !important;
  background:#fbfbfb !important;
  overflow:visible;
}
.creator-reference-shell .avatar-hair-tile .avatar-choice-preview {
  width:100% !important;
  height:70px !important;
  border:0 !important;
  border-radius:7px !important;
  display:grid;
  place-items:center;
  background:#fbfbfb !important;
  overflow:hidden;
}
.creator-reference-shell .avatar-hair-tile.selected,
.creator-reference-shell .avatar-hair-tile.selected .avatar-choice-preview {
  background:#e3aa18 !important;
  border-color:#d49700 !important;
  box-shadow:0 4px 10px rgba(163,105,0,.22) !important;
}
.creator-reference-shell .avatar-hair-reference {
  width:62px;
  height:62px;
  object-fit:contain;
  object-position:center;
  image-rendering:auto;
}
.creator-reference-shell .avatar-hair-tile > i {
  top:3px !important;
  right:3px !important;
  width:18px !important;
  height:18px !important;
  border-radius:50%;
  background:#fff !important;
  color:#d69a00 !important;
}
.creator-reference-screen .creator-new-skin { position:relative; }
.creator-reference-screen .creator-reference-hair {
  position:absolute;
  z-index:3;
  top:0px;
  left:50%;
  width:94px;
  height:94px;
  transform:translateX(-50%);
  background:var(--hair-color,#252a2c);
  -webkit-mask-image:var(--hair-mask);
  mask-image:var(--hair-mask);
  -webkit-mask-repeat:no-repeat;
  mask-repeat:no-repeat;
  -webkit-mask-position:center;
  mask-position:center;
  -webkit-mask-size:contain;
  mask-size:contain;
  pointer-events:none;
}
@media(max-width:1100px){.creator-reference-shell .avatar-hair-grid{grid-template-columns:repeat(8,minmax(62px,1fr));}}
@media(max-width:800px){.creator-reference-shell .avatar-hair-grid{grid-template-columns:repeat(5,minmax(62px,1fr));}}

/* V44.31 — 38 paires d'yeux masculins reprises des références utilisateur. */
.creator-reference-shell .avatar-editor-panel:has(.avatar-eye-grid) .avatar-editor-scroll {
  padding:16px;
}
.creator-reference-shell .avatar-eye-grid {
  display:grid !important;
  grid-template-columns:repeat(10,minmax(62px,1fr));
  gap:12px !important;
  width:100%;
}
.creator-reference-shell .avatar-choice-tile.avatar-eye-tile {
  width:auto !important;
  min-width:0 !important;
  min-height:70px !important;
  padding:0 !important;
  display:block;
  border:1px solid #dfe4f0 !important;
  border-radius:7px !important;
  background:#fbfbfb !important;
  overflow:visible;
}
.creator-reference-shell .avatar-eye-tile .avatar-choice-preview {
  width:100% !important;
  height:70px !important;
  border:0 !important;
  border-radius:7px !important;
  display:grid;
  place-items:center;
  background:#fbfbfb !important;
  overflow:hidden;
}
.creator-reference-shell .avatar-eye-tile.selected,
.creator-reference-shell .avatar-eye-tile.selected .avatar-choice-preview {
  background:#e3aa18 !important;
  border-color:#d49700 !important;
  box-shadow:0 4px 10px rgba(163,105,0,.22) !important;
}
.creator-reference-shell .avatar-eye-reference {
  width:58px;
  height:30px;
  object-fit:contain;
  image-rendering:auto;
}
.creator-reference-shell .avatar-eye-tile > i {
  top:3px !important;
  right:3px !important;
  width:18px !important;
  height:18px !important;
  border-radius:50%;
  background:#fff !important;
  color:#d69a00 !important;
}
.creator-reference-screen .creator-reference-eyes {
  position:absolute;
  z-index:2;
  top:31px;
  left:50%;
  width:45px !important;
  height:20px !important;
  transform:translateX(-50%);
  object-fit:contain !important;
  pointer-events:none;
}
.creator-reference-screen .creator-reference-hair-image {
  position:absolute;
  z-index:3;
  top:0;
  left:50%;
  width:94px !important;
  height:94px !important;
  transform:translateX(-50%);
  object-fit:contain !important;
  pointer-events:none;
}
@media(max-width:1100px){.creator-reference-shell .avatar-eye-grid{grid-template-columns:repeat(8,minmax(62px,1fr));}}
@media(max-width:800px){.creator-reference-shell .avatar-eye-grid{grid-template-columns:repeat(5,minmax(62px,1fr));}}


/* V44.32 — yeux femme + alignement final des couches du créateur. */
.creator-reference-screen .creator-new-skin[data-gender="feminine"] .creator-reference-eyes {
  top:31px;
  width:46px !important;
  height:21px !important;
}
.creator-reference-screen .creator-new-skin[data-gender="masculine"] .creator-reference-eyes {
  top:31px;
  width:45px !important;
  height:20px !important;
}
.creator-reference-screen .creator-new-skin[data-gender="feminine"] .creator-reference-hair-image {
  top:0;
  width:96px !important;
  height:96px !important;
}


/* V44.34 — palette cheveux Shinobi + recoloration réelle des vignettes et du portrait. */
.creator-reference-shell .avatar-hair-reference-tinted {
  display:block;
  width:62px;
  height:62px;
  background:var(--hair-preview-color,#4b4d55);
  -webkit-mask-image:var(--hair-preview-mask);
  mask-image:var(--hair-preview-mask);
  -webkit-mask-repeat:no-repeat;
  mask-repeat:no-repeat;
  -webkit-mask-position:center;
  mask-position:center;
  -webkit-mask-size:contain;
  mask-size:contain;
}
.creator-reference-screen .creator-reference-hair-female-tinted {
  width:104px;
  height:104px;
  top:-2px;
}


/* V44.34 — la première palette Cheveux est « Default » : styles originaux, pas une teinte. */
.creator-reference-shell .avatar-default-palette{
  border:1px solid #d8b16b; background:#fbf8e8; color:#17120a; border-radius:6px;
  min-width:100px; height:34px; padding:0 14px; font-weight:700; cursor:pointer;
}
.creator-reference-shell .avatar-default-palette.selected{background:#dfa510;color:#fff;border-color:#c8910a;box-shadow:0 2px 7px rgba(191,132,0,.22)}
.creator-reference-shell .avatar-hair-reference-default{display:block;width:62px;height:62px;object-fit:contain;image-rendering:auto}
.creator-reference-screen .creator-reference-hair-default{top:0;left:50%;width:104px!important;height:104px!important;transform:translateX(-50%);object-fit:contain!important;image-rendering:auto}


/* V44.36 — cheveux visibles sans CSS mask: PNG recolorés réels. */
.creator-reference-shell .avatar-hair-reference-colored{display:block;width:62px;height:62px;object-fit:contain;object-position:center;image-rendering:auto}
.creator-reference-screen .creator-reference-hair-colored{position:absolute;z-index:3;top:0;left:50%;width:104px!important;height:104px!important;transform:translateX(-50%);object-fit:contain!important;pointer-events:none;image-rendering:auto}
.creator-reference-screen .creator-reference-hair-female-colored{top:-2px;width:108px!important;height:108px!important}

/* V44.37 — recalage précis des couches du portrait du créateur.
   Le corps 104x124 est affiché à ~2x dans le cadre : cheveux et yeux utilisent
   désormais la même échelle visuelle au lieu des anciennes coordonnées miniatures. */
.creator-reference-screen .creator-new-skin { position:relative; }
.creator-reference-screen .creator-new-skin > img:first-child {
  position:absolute;
  inset:0;
  margin:auto;
  width:auto !important;
  height:100% !important;
  max-width:100% !important;
  object-fit:contain !important;
  object-position:center bottom !important;
}

/* Homme : le contenu utile des PNG cheveux occupe environ 54% du canevas 96x96.
   Une boîte ~188px replace la chevelure autour du crâne du skin 104x124 agrandi. */
.creator-reference-screen .creator-new-skin[data-gender="masculine"] .creator-reference-hair-image {
  top:0 !important;
  left:50% !important;
  width:188px !important;
  height:188px !important;
  transform:translateX(-50%) !important;
  object-fit:contain !important;
  object-position:center top !important;
}
.creator-reference-screen .creator-new-skin[data-gender="masculine"] .creator-reference-eyes {
  top:94px !important;
  left:50% !important;
  width:84px !important;
  height:40px !important;
  transform:translateX(-50%) !important;
  object-fit:contain !important;
}

/* Femme : les PNG cheveux sont plus serrés (70x70) et doivent être légèrement
   plus hauts/plus larges pour épouser la tête du skin féminin. */
.creator-reference-screen .creator-new-skin[data-gender="feminine"] .creator-reference-hair-image {
  top:3px !important;
  left:50% !important;
  width:164px !important;
  height:164px !important;
  transform:translateX(-50%) !important;
  object-fit:contain !important;
  object-position:center top !important;
}
.creator-reference-screen .creator-new-skin[data-gender="feminine"] .creator-reference-eyes {
  top:91px !important;
  left:50% !important;
  width:72px !important;
  height:36px !important;
  transform:translateX(-50%) !important;
  object-fit:contain !important;
}

/* V44.38 — alignement robuste des cheveux/yeux sur le nouveau skin 104x124.
   Les overlays sont pré-normalisés sur le même canvas que le corps : aucun zoom
   ou positionnement arbitraire n'est appliqué dans le navigateur. */
.creator-reference-screen .creator-new-skin .creator-reference-hair-image,
.creator-reference-screen .creator-new-skin .creator-reference-eyes {
  position:absolute !important;
  inset:0 !important;
  left:0 !important;
  top:0 !important;
  width:100% !important;
  height:100% !important;
  max-width:100% !important;
  transform:none !important;
  object-fit:contain !important;
  object-position:center bottom !important;
  pointer-events:none !important;
}
.creator-reference-screen .creator-new-skin .creator-reference-hair-image { z-index:3 !important; }
.creator-reference-screen .creator-new-skin .creator-reference-eyes { z-index:4 !important; }

/* V44.39 — rendu pixel-art net et recalage définitif des assets de création.
   Les cheveux/yeux ont été normalisés sur le même canvas 104x124 que le corps
   avec redimensionnement nearest-neighbor afin d'éviter le flou. */
.creator-reference-screen .creator-new-skin > img,
.creator-reference-screen .creator-reference-hair-image,
.creator-reference-screen .creator-reference-eyes,
.creator-reference-shell .avatar-hair-reference,
.creator-reference-shell .avatar-hair-reference-colored,
.creator-reference-shell .avatar-hair-reference-default,
.creator-reference-shell .avatar-eye-reference,
.creator-reference-shell .avatar-reference-body,
.creator-reference-shell .avatar-skin-reference {
  image-rendering: pixelated !important;
  image-rendering: crisp-edges !important;
}
.creator-reference-screen .creator-new-skin .creator-reference-hair-image,
.creator-reference-screen .creator-new-skin .creator-reference-eyes {
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  transform:none !important;
  object-fit:contain !important;
  object-position:center bottom !important;
}

/* V44.40 — alignement pixel-perfect du nouveau skin.
   Cheveux et yeux sont déjà placés sur un canevas 104x124 identique au corps.
   Aucune mise à l'échelle indépendante n'est faite dans le navigateur. */
.creator-reference-screen .creator-new-skin {
  position: relative !important;
  width: 100% !important;
  height: 100% !important;
  overflow: hidden !important;
}
.creator-reference-screen .creator-new-skin > img:first-child,
.creator-reference-screen .creator-new-skin .creator-reference-hair-image,
.creator-reference-screen .creator-new-skin .creator-reference-eyes {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  transform: none !important;
  object-fit: contain !important;
  object-position: center bottom !important;
  image-rendering: pixelated !important;
}
.creator-reference-screen .creator-new-skin > img:first-child { z-index:1 !important; }
.creator-reference-screen .creator-new-skin .creator-reference-hair-image { z-index:3 !important; }
.creator-reference-screen .creator-new-skin .creator-reference-eyes { z-index:4 !important; }
.creator-reference-shell .avatar-hair-reference,
.creator-reference-shell .avatar-hair-reference-colored,
.creator-reference-shell .avatar-hair-reference-default,
.creator-reference-shell .avatar-eye-reference {
  image-rendering: pixelated !important;
}


/* V44.41 — créateur recalé sur la référence: un seul canevas pixel 104x124.
   Le corps, les yeux et les cheveux se déplacent ensemble; les PNG de cheveux
   noirs utilisent les extractions originales, sans raster intermédiaire. */
.creator-reference-shell .avatar-studio-preview{
  width:120px !important;
  height:148px !important;
  display:flex !important;
  align-items:flex-start !important;
  justify-content:center !important;
  overflow:hidden !important;
  background:#cfcfcd !important;
}
.creator-reference-screen .creator-new-skin{
  width:120px !important;
  height:148px !important;
  position:relative !important;
  overflow:hidden !important;
  transform:none !important;
}
.creator-reference-screen .creator-pixel-canvas{
  position:absolute;
  inset:0;
  width:120px;
  height:148px;
  overflow:hidden;
  image-rendering:pixelated;
}
.creator-reference-screen .creator-native-body{
  position:absolute !important;
  inset:0 !important;
  width:120px !important;
  height:148px !important;
  max-width:none !important;
  object-fit:fill !important;
  image-rendering:pixelated !important;
  z-index:1;
}
.creator-reference-screen .creator-native-hair{
  position:absolute !important;
  max-width:none !important;
  object-fit:fill !important;
  image-rendering:pixelated !important;
  z-index:3;
  pointer-events:none;
}
.creator-reference-screen .creator-native-hair-male{
  width:96px !important;
  height:96px !important;
  left:4px !important;
  top:-8px !important;
}
.creator-reference-screen .creator-native-hair-female{
  width:70px !important;
  height:70px !important;
  left:17px !important;
  top:7px !important;
}
.creator-reference-screen .creator-native-hair-default{
  width:72px !important;
  height:72px !important;
  left:16px !important;
  top:4px !important;
}
.creator-reference-screen .creator-native-eyes{
  position:absolute !important;
  inset:0 !important;
  width:120px !important;
  height:148px !important;
  max-width:none !important;
  object-fit:fill !important;
  image-rendering:pixelated !important;
  z-index:4;
  pointer-events:none;
}
/* La référence utilise des cases étroites et hautes: trois rangées visibles. */
.creator-reference-shell .avatar-editor-panel:has(.avatar-hair-grid) .avatar-editor-scroll{
  padding:10px 16px 16px !important;
  max-height:445px !important;
  min-height:445px !important;
}
.creator-reference-shell .avatar-hair-grid{
  grid-template-columns:repeat(10,minmax(0,1fr)) !important;
  gap:12px !important;
}
.creator-reference-shell .avatar-choice-tile.avatar-hair-tile{
  min-height:128px !important;
  height:128px !important;
  border:1px solid #e0e4ef !important;
  border-radius:6px !important;
  background:#fbfbfb !important;
}
.creator-reference-shell .avatar-hair-tile .avatar-choice-preview{
  width:100% !important;
  height:126px !important;
  display:grid !important;
  place-items:center !important;
  overflow:hidden !important;
  background:#fbfbfb !important;
}
.creator-reference-shell .avatar-hair-reference,
.creator-reference-shell .avatar-hair-reference-colored,
.creator-reference-shell .avatar-hair-reference-default{
  width:auto !important;
  height:auto !important;
  max-width:72px !important;
  max-height:82px !important;
  object-fit:contain !important;
  image-rendering:pixelated !important;
}
.creator-reference-shell .avatar-color-strip{
  min-height:48px !important;
  padding:5px 14px 7px !important;
  gap:10px !important;
  align-items:center !important;
}
.creator-reference-shell .avatar-color-dot{
  width:31px !important;
  height:31px !important;
  min-width:31px !important;
  border-radius:50% !important;
}
.creator-reference-shell .avatar-default-color-dot{
  --choice-color:#7b4b2a !important;
}
.creator-reference-shell .avatar-color-dot.selected{
  outline:2px solid #9f5d1e !important;
  outline-offset:2px !important;
}

/* V44.42 — dimensions recalées directement sur la capture de référence.
   Référence desktop mesurée: aperçu 221x221, panneau 901x623,
   grille 10 colonnes avec cases 73x73 et espacements de 10 px. */
.creator-reference-screen{
  width:min(1176px,calc(100% - 4px)) !important;
  max-width:1176px !important;
}
.creator-reference-shell.avatar-studio-shell{
  grid-template-columns:221px minmax(0,901px) !important;
  column-gap:14px !important;
  margin:20px 27px 0 !important;
  align-items:start !important;
}
.creator-reference-shell .avatar-studio-left{
  width:221px !important;
}
.creator-reference-shell .avatar-studio-preview{
  width:221px !important;
  height:221px !important;
  min-width:221px !important;
  min-height:221px !important;
  border-radius:7px !important;
  background:#cfcfcf !important;
}
.creator-reference-screen .creator-new-skin{
  width:120px !important;
  height:148px !important;
  transform:scale(1.77) !important;
  transform-origin:50% 100% !important;
}
.creator-reference-shell .avatar-mode-switch{
  width:207px !important;
  margin-top:45px !important;
  gap:8px !important;
}
.creator-reference-shell .avatar-mode-switch button{
  min-height:38px !important;
}
.creator-reference-shell .avatar-studio-main{
  width:901px !important;
  min-width:0 !important;
  min-height:623px !important;
  height:623px !important;
  padding:24px !important;
  box-sizing:border-box !important;
}
.creator-reference-shell .avatar-editor-tabs{
  grid-template-columns:repeat(6,1fr) !important;
  gap:10px !important;
  margin-bottom:20px !important;
}
.creator-reference-shell .avatar-editor-tab{
  min-height:42px !important;
  height:42px !important;
}
.creator-reference-shell .avatar-editor-panel{
  min-height:452px !important;
  height:452px !important;
}
.creator-reference-shell .avatar-editor-scroll{
  min-height:448px !important;
  max-height:448px !important;
  height:448px !important;
  box-sizing:border-box !important;
}
.creator-reference-shell .avatar-editor-panel:has(.avatar-hair-grid) .avatar-editor-scroll{
  padding:16px !important;
  min-height:448px !important;
  max-height:448px !important;
  height:448px !important;
}
.creator-reference-shell .avatar-hair-grid{
  grid-template-columns:repeat(10,73px) !important;
  grid-auto-rows:73px !important;
  gap:10px !important;
  justify-content:start !important;
}
.creator-reference-shell .avatar-choice-tile.avatar-hair-tile{
  width:73px !important;
  min-width:73px !important;
  height:73px !important;
  min-height:73px !important;
  border-radius:6px !important;
}
.creator-reference-shell .avatar-hair-tile .avatar-choice-preview{
  width:71px !important;
  height:71px !important;
  min-height:71px !important;
  border-radius:5px !important;
}
.creator-reference-shell .avatar-hair-reference,
.creator-reference-shell .avatar-hair-reference-colored,
.creator-reference-shell .avatar-hair-reference-default{
  max-width:58px !important;
  max-height:58px !important;
  width:auto !important;
  height:auto !important;
  image-rendering:pixelated !important;
}
.creator-reference-shell .avatar-color-strip{
  min-height:42px !important;
  height:42px !important;
  padding:0 14px 8px !important;
  gap:10px !important;
}
.creator-reference-shell .avatar-color-dot{
  width:31px !important;
  height:31px !important;
  min-width:31px !important;
}
@media(max-width:1180px){
  .creator-reference-shell.avatar-studio-shell{
    grid-template-columns:221px minmax(0,1fr) !important;
    margin-left:20px !important;
    margin-right:20px !important;
  }
  .creator-reference-shell .avatar-studio-main{
    width:auto !important;
  }
}

/* V44.43 — rapprochement visuel du créateur sur la référence utilisateur.
   Les cases restent compactes, mais les coiffures occupent réellement la case.
   Le panneau n'écrase plus la grille et l'avatar conserve le cadrage 221x221. */
.creator-reference-shell .avatar-studio-main{
  padding:24px 24px 22px !important;
}
.creator-reference-shell .avatar-editor-tabs{
  gap:12px !important;
  margin-bottom:20px !important;
}
.creator-reference-shell .avatar-editor-panel:has(.avatar-hair-grid){
  overflow:hidden !important;
}
.creator-reference-shell .avatar-editor-panel:has(.avatar-hair-grid) .avatar-editor-scroll{
  padding:16px !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  scrollbar-gutter:stable;
}
.creator-reference-shell .avatar-hair-grid{
  grid-template-columns:repeat(10,minmax(0,1fr)) !important;
  grid-auto-rows:73px !important;
  gap:10px !important;
  align-items:stretch !important;
  justify-content:stretch !important;
}
.creator-reference-shell .avatar-choice-tile.avatar-hair-tile{
  width:auto !important;
  min-width:0 !important;
  max-width:none !important;
  height:73px !important;
  min-height:73px !important;
  max-height:73px !important;
  margin:0 !important;
  padding:0 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  position:relative !important;
  overflow:hidden !important;
  border:1px solid #dfe4f0 !important;
  background:#fbfbfb !important;
}
.creator-reference-shell .avatar-hair-tile .avatar-choice-preview{
  width:100% !important;
  height:100% !important;
  min-width:0 !important;
  min-height:0 !important;
  margin:0 !important;
  padding:8px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  box-sizing:border-box !important;
  border:0 !important;
  overflow:hidden !important;
  background:transparent !important;
}
.creator-reference-shell .avatar-hair-reference,
.creator-reference-shell .avatar-hair-reference-colored,
.creator-reference-shell .avatar-hair-reference-default{
  display:block !important;
  width:52px !important;
  height:52px !important;
  max-width:52px !important;
  max-height:52px !important;
  object-fit:contain !important;
  object-position:center center !important;
  image-rendering:pixelated !important;
  transform:none !important;
}
.creator-reference-shell .avatar-hair-tile.selected,
.creator-reference-shell .avatar-hair-tile.selected .avatar-choice-preview{
  background:#e1aa18 !important;
  border-color:#d39700 !important;
}
.creator-reference-shell .avatar-hair-tile > i{
  position:absolute !important;
  top:4px !important;
  right:4px !important;
  z-index:5 !important;
}
/* Le carré d'aperçu doit avoir les mêmes proportions que la référence et remplir le cadre. */
.creator-reference-shell .avatar-studio-preview{
  display:grid !important;
  place-items:end center !important;
  overflow:hidden !important;
}
.creator-reference-screen .creator-new-skin{
  width:120px !important;
  height:148px !important;
  transform:scale(1.78) !important;
  transform-origin:50% 100% !important;
  margin:0 !important;
}
.creator-reference-screen .creator-pixel-canvas{
  width:120px !important;
  height:148px !important;
}
.creator-reference-shell .avatar-color-strip{
  border-bottom:0 !important;
  min-height:42px !important;
  height:42px !important;
  padding:0 14px 8px !important;
}


/* V44.44 — mêmes dimensions de cases pour Cheveux, Yeux, Bouche et Barbe. */
.creator-reference-shell .avatar-editor-panel:has(.avatar-eye-grid) .avatar-editor-scroll,
.creator-reference-shell .avatar-editor-panel:has(.avatar-mouth-grid) .avatar-editor-scroll,
.creator-reference-shell .avatar-editor-panel:has(.avatar-beard-grid) .avatar-editor-scroll{
  padding:16px !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  scrollbar-gutter:stable;
  min-height:448px !important;
  max-height:448px !important;
  height:448px !important;
}
.creator-reference-shell .avatar-eye-grid,
.creator-reference-shell .avatar-mouth-grid,
.creator-reference-shell .avatar-beard-grid{
  display:grid !important;
  grid-template-columns:repeat(10,73px) !important;
  grid-auto-rows:73px !important;
  gap:10px !important;
  align-items:start !important;
  justify-content:start !important;
  width:auto !important;
}
.creator-reference-shell .avatar-choice-tile.avatar-eye-tile,
.creator-reference-shell .avatar-choice-tile.avatar-mouth-tile,
.creator-reference-shell .avatar-choice-tile.avatar-beard-tile{
  width:73px !important;
  min-width:73px !important;
  max-width:73px !important;
  height:73px !important;
  min-height:73px !important;
  max-height:73px !important;
  margin:0 !important;
  padding:0 !important;
  display:grid !important;
  place-items:center !important;
  position:relative !important;
  overflow:hidden !important;
  border:1px solid #dfe4f0 !important;
  border-radius:6px !important;
  background:#fbfbfb !important;
  box-shadow:none !important;
}
.creator-reference-shell .avatar-eye-tile .avatar-choice-preview,
.creator-reference-shell .avatar-mouth-tile .avatar-choice-preview,
.creator-reference-shell .avatar-beard-tile .avatar-choice-preview{
  width:71px !important;
  height:71px !important;
  min-width:71px !important;
  min-height:71px !important;
  margin:0 !important;
  padding:0 !important;
  display:grid !important;
  place-items:center !important;
  border:0 !important;
  border-radius:5px !important;
  overflow:hidden !important;
  background:transparent !important;
}
.creator-reference-shell .avatar-eye-reference{
  width:62px !important;
  height:38px !important;
  max-width:62px !important;
  max-height:38px !important;
  object-fit:contain !important;
  image-rendering:pixelated !important;
}
.creator-reference-shell .avatar-mouth-tile .ninja-portrait,
.creator-reference-shell .avatar-mouth-tile .ninja-svg,
.creator-reference-shell .avatar-beard-tile .ninja-portrait,
.creator-reference-shell .avatar-beard-tile .ninja-svg{
  width:71px !important;
  height:80px !important;
  max-width:none !important;
  transform:translateY(7px) scale(1.35) !important;
  transform-origin:center top !important;
  image-rendering:pixelated !important;
}
.creator-reference-shell .avatar-eye-tile.selected,
.creator-reference-shell .avatar-eye-tile.selected .avatar-choice-preview,
.creator-reference-shell .avatar-mouth-tile.selected,
.creator-reference-shell .avatar-mouth-tile.selected .avatar-choice-preview,
.creator-reference-shell .avatar-beard-tile.selected,
.creator-reference-shell .avatar-beard-tile.selected .avatar-choice-preview{
  background:#e1aa18 !important;
  border-color:#d39700 !important;
  box-shadow:none !important;
}
.creator-reference-shell .avatar-eye-tile > i,
.creator-reference-shell .avatar-mouth-tile > i,
.creator-reference-shell .avatar-beard-tile > i{
  position:absolute !important;
  top:4px !important;
  right:4px !important;
  width:20px !important;
  height:20px !important;
  z-index:5 !important;
}
.creator-reference-shell .avatar-mouth-tile strong,
.creator-reference-shell .avatar-beard-tile strong{display:none !important;}
@media(max-width:1100px){
  .creator-reference-shell .avatar-eye-grid,
  .creator-reference-shell .avatar-mouth-grid,
  .creator-reference-shell .avatar-beard-grid{grid-template-columns:repeat(8,73px) !important;}
}
@media(max-width:800px){
  .creator-reference-shell .avatar-eye-grid,
  .creator-reference-shell .avatar-mouth-grid,
  .creator-reference-shell .avatar-beard-grid{grid-template-columns:repeat(5,73px) !important;}
}

/* V44.46 — calques officiels Shinobible, canevas 120x148 (2× 60x74). */
.creator-reference-screen .creator-native-body,
.creator-reference-screen .creator-native-armor,
.creator-reference-screen .creator-native-clothing,
.creator-reference-screen .creator-native-mouth,
.creator-reference-screen .creator-native-eyes,
.creator-reference-screen .creator-native-beard,
.creator-reference-screen .creator-native-hair,
.creator-reference-screen .creator-native-headband,
.creator-reference-screen .creator-native-weapon{
  position:absolute !important;
  inset:0 !important;
  left:0 !important;
  top:0 !important;
  width:120px !important;
  height:148px !important;
  max-width:none !important;
  object-fit:fill !important;
  image-rendering:pixelated !important;
  pointer-events:none;
}
.creator-reference-screen .creator-native-body{z-index:1; pointer-events:auto;}
.creator-reference-screen .creator-native-armor{z-index:2;}
.creator-reference-screen .creator-native-clothing{z-index:3;}
.creator-reference-screen .creator-native-mouth{z-index:4;}
.creator-reference-screen .creator-native-eyes{z-index:5;}
.creator-reference-screen .creator-native-beard{z-index:6;}
.creator-reference-screen .creator-native-hair{z-index:7;}
.creator-reference-screen .creator-native-headband{z-index:8;}
.creator-reference-screen .creator-native-weapon{z-index:9;}
.creator-reference-shell .avatar-clothes-grid{
  grid-template-columns:repeat(5,minmax(62px,1fr)) !important;
}
.avatar-empty-choice{
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  height:100%;
  color:#6a7380;
  font-size:11px;
}

/* Menu officiel : Toutes + pastilles + grille 10 colonnes */
.creator-reference-shell .avatar-color-strip{
  min-height:46px !important;
  padding:8px 14px !important;
  gap:8px !important;
  background:#fff !important;
  border-bottom:1px solid #ecece8 !important;
}
.creator-reference-shell .avatar-all-colors-btn{
  display:inline-flex !important;
  align-items:center !important;
  gap:6px !important;
  height:32px !important;
  padding:0 12px 0 8px !important;
  border:0 !important;
  border-radius:8px !important;
  background:#e8e4d8 !important;
  color:#5a5348 !important;
  font-size:13px !important;
  font-weight:700 !important;
  white-space:nowrap !important;
  cursor:pointer;
}
.creator-reference-shell .avatar-all-colors-btn.selected{
  background:#e0a800 !important;
  color:#fff !important;
}
.creator-reference-shell .avatar-all-colors-icon{
  width:16px;
  height:16px;
  display:inline-block;
  background:currentColor;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M10 4H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V8c0-1.1-.9-2-2-2h-8l-2-2z'/%3E%3C/svg%3E") center/contain no-repeat;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M10 4H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V8c0-1.1-.9-2-2-2h-8l-2-2z'/%3E%3C/svg%3E") center/contain no-repeat;
}
.creator-reference-shell .avatar-color-dot{
  width:28px !important;
  height:28px !important;
  min-width:28px !important;
  border:2px solid #ecece8 !important;
  border-radius:50% !important;
}
.creator-reference-shell .avatar-color-dot.selected{
  outline:2px solid #c99412 !important;
  outline-offset:2px !important;
  border-color:#fff !important;
}
.creator-reference-shell .avatar-hair-grid,
.creator-reference-shell .avatar-eye-grid,
.creator-reference-shell .avatar-mouth-grid,
.creator-reference-shell .avatar-beard-grid{
  display:grid !important;
  grid-template-columns:repeat(10,minmax(0,1fr)) !important;
  grid-auto-rows:73px !important;
  gap:8px !important;
  align-items:stretch !important;
  justify-content:stretch !important;
  width:100% !important;
}
.creator-reference-shell .avatar-choice-tile.avatar-hair-tile,
.creator-reference-shell .avatar-choice-tile.avatar-eye-tile,
.creator-reference-shell .avatar-choice-tile.avatar-mouth-tile,
.creator-reference-shell .avatar-choice-tile.avatar-beard-tile{
  width:auto !important;
  min-width:0 !important;
  max-width:none !important;
  height:73px !important;
  min-height:73px !important;
  max-height:73px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  border:1px solid #e6e6e2 !important;
  border-radius:8px !important;
  background:#fafafa !important;
  overflow:hidden !important;
}
.creator-reference-shell .avatar-hair-tile .avatar-choice-preview,
.creator-reference-shell .avatar-eye-tile .avatar-choice-preview,
.creator-reference-shell .avatar-mouth-tile .avatar-choice-preview,
.creator-reference-shell .avatar-beard-tile .avatar-choice-preview{
  width:100% !important;
  height:100% !important;
  min-width:0 !important;
  min-height:0 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  padding:8px !important;
  overflow:hidden !important;
  box-sizing:border-box !important;
  background:transparent !important;
}
.creator-reference-shell .avatar-hair-tile img,
.creator-reference-shell .avatar-eye-tile img,
.creator-reference-shell .avatar-mouth-tile img,
.creator-reference-shell .avatar-beard-tile img,
.creator-reference-shell .avatar-hair-tile .avatar-hair-reference,
.creator-reference-shell .avatar-hair-tile .avatar-hair-reference-default,
.creator-reference-shell .avatar-eye-tile .avatar-eye-reference,
.creator-reference-shell .avatar-mouth-tile .avatar-mouth-reference,
.creator-reference-shell .avatar-beard-tile .avatar-beard-reference{
  display:block !important;
  width:52px !important;
  height:52px !important;
  max-width:52px !important;
  max-height:52px !important;
  object-fit:contain !important;
  object-position:center center !important;
  transform:none !important;
  transform-origin:center center !important;
  image-rendering:pixelated !important;
}
.creator-reference-shell .avatar-mouth-tile img,
.creator-reference-shell .avatar-beard-tile img,
.creator-reference-shell .avatar-mouth-tile .avatar-mouth-reference,
.creator-reference-shell .avatar-beard-tile .avatar-beard-reference{
  width:58px !important;
  height:58px !important;
  max-width:58px !important;
  max-height:58px !important;
}
.creator-reference-shell .avatar-mouth-tile .avatar-choice-preview,
.creator-reference-shell .avatar-beard-tile .avatar-choice-preview{
  padding:6px !important;
}
.creator-reference-shell .avatar-hair-tile.selected,
.creator-reference-shell .avatar-eye-tile.selected,
.creator-reference-shell .avatar-mouth-tile.selected,
.creator-reference-shell .avatar-beard-tile.selected,
.creator-reference-shell .avatar-hair-tile.selected .avatar-choice-preview,
.creator-reference-shell .avatar-eye-tile.selected .avatar-choice-preview,
.creator-reference-shell .avatar-mouth-tile.selected .avatar-choice-preview,
.creator-reference-shell .avatar-beard-tile.selected .avatar-choice-preview{
  background:#f3d27a !important;
  border-color:#d7a21a !important;
}
@media(max-width:1100px){
  .creator-reference-shell .avatar-hair-grid,
  .creator-reference-shell .avatar-eye-grid,
  .creator-reference-shell .avatar-mouth-grid,
  .creator-reference-shell .avatar-beard-grid{grid-template-columns:repeat(8,minmax(0,1fr)) !important;}
}
@media(max-width:800px){
  .creator-reference-shell .avatar-hair-grid,
  .creator-reference-shell .avatar-eye-grid,
  .creator-reference-shell .avatar-mouth-grid,
  .creator-reference-shell .avatar-beard-grid{grid-template-columns:repeat(5,minmax(0,1fr)) !important;}
}

.creator-reference-shell .avatar-mode-switch button{
  position:relative;
}
.avatar-retro-warn{
  position:absolute;
  top:-6px;
  right:-6px;
  width:16px;
  height:16px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:#fff;
  color:#e3a31a;
  font-size:11px;
  line-height:1;
  font-weight:900;
  box-shadow:0 0 0 1px #f3d27a;
}
.creator-reference-shell .avatar-studio-main.objects-main{
  padding:14px 16px 16px !important;
  display:flex;
  flex-direction:column;
}
.avatar-objects-panel{
  display:flex;
  flex-direction:column;
  min-height:0;
  flex:1;
  gap:10px;
}
.avatar-object-toolbar{
  display:flex;
  align-items:center;
  gap:8px;
  overflow:visible;
}
.avatar-object-tabs{
  display:flex;
  flex-wrap:nowrap;
  gap:6px;
  min-width:0;
  overflow:visible;
  padding:10px 8px 8px 8px;
}
.avatar-object-tab{
  position:relative;
  flex:0 0 42px;
  width:42px !important;
  height:42px !important;
  min-width:42px !important;
  padding:0 !important;
  border:0 !important;
  border-radius:10px !important;
  background:var(--tab-color,#eceff1) !important;
  color:#fff !important;
  box-shadow:none !important;
  transform:none !important;
  filter:none !important;
}
.avatar-object-tab:hover,
.avatar-object-tab:active{
  transform:none !important;
  filter:brightness(1.05) !important;
  box-shadow:none !important;
}
.avatar-object-tab.active{
  outline:3px solid #5b3dff;
  outline-offset:1px;
}
.avatar-object-tab-icon{
  width:22px;
  height:22px;
  display:grid;
  place-items:center;
  line-height:0;
}
.avatar-object-tab-icon svg{
  width:22px;
  height:22px;
  display:block;
}
.avatar-object-tab[style*="#eceff1"] .avatar-object-tab-icon svg rect{
  fill:#cfd8dc;
}
.avatar-object-count{
  position:absolute;
  top:-7px;
  left:-4px;
  min-width:16px;
  height:16px;
  padding:0 4px;
  border-radius:8px;
  background:#fff;
  color:#333;
  font-size:10px;
  font-style:normal;
  font-weight:800;
  line-height:16px;
  box-shadow:0 1px 3px rgba(0,0,0,.15);
}
.avatar-object-tools{display:flex;gap:6px;margin-left:auto}
.avatar-object-tool{
  width:42px !important;
  height:42px !important;
  min-width:42px !important;
  padding:0 !important;
  border:0 !important;
  border-radius:50% !important;
  background:#f3efe4 !important;
  color:#333 !important;
  box-shadow:none !important;
  transform:none !important;
  font-size:16px !important;
}
.avatar-object-tool.close{background:#f8bbd0 !important;color:#fff !important}
.avatar-object-tool.search.active{background:#e8c96a !important}
.avatar-object-warning{
  display:flex;
  align-items:flex-start;
  gap:8px;
  padding:8px 12px;
  border-radius:8px;
  background:#fff6e5;
  color:#9a6a16;
  font-size:13px;
  line-height:1.35;
}
.avatar-object-search{
  width:100%;
  height:36px;
  border:1px solid #e4d7b4;
  border-radius:8px;
  padding:0 12px;
  background:#fff;
}
.avatar-object-group{
  display:flex;
  align-items:center;
  gap:8px;
  margin:4px 0 10px;
  color:#888;
  font-size:12px;
  font-weight:800;
  letter-spacing:.04em;
}
.avatar-object-scroll{
  flex:1;
  min-height:0 !important;
  max-height:none !important;
  height:auto !important;
  padding:4px 4px 10px !important;
}
.creator-reference-shell .avatar-object-grid{
  display:flex !important;
  flex-wrap:wrap !important;
  gap:10px !important;
  grid-template-columns:none !important;
}
.creator-reference-shell .avatar-choice-tile.avatar-object-tile{
  position:relative;
  width:72px !important;
  min-width:72px !important;
  max-width:72px !important;
  height:72px !important;
  min-height:72px !important;
  max-height:72px !important;
  padding:0 !important;
  display:grid !important;
  grid-template-rows:72px !important;
  gap:0 !important;
  border:1px solid #ecece8 !important;
  border-radius:8px !important;
  background:#fff !important;
  box-shadow:none !important;
  transform:none !important;
  overflow:hidden !important;
}
.creator-reference-shell .avatar-choice-tile.avatar-object-tile.selected{
  background:#f3d27a !important;
  border-color:#e0b33a !important;
}
.creator-reference-shell .avatar-choice-tile.avatar-object-tile .avatar-choice-preview,
.creator-reference-shell .avatar-choice-tile.avatar-object-tile.selected .avatar-choice-preview{
  width:72px !important;
  height:72px !important;
  min-height:72px !important;
  max-height:72px !important;
  border:0 !important;
  border-radius:8px !important;
  background:transparent !important;
  box-shadow:none !important;
  display:grid;
  place-items:center;
  overflow:hidden;
}
.creator-reference-shell .avatar-object-tile .avatar-clothes-reference{
  width:64px !important;
  height:64px !important;
  max-width:64px !important;
  max-height:64px !important;
  object-fit:contain !important;
  object-position:center !important;
  image-rendering:pixelated;
}
.creator-reference-shell .avatar-object-tile .avatar-bandeau-reference{
  width:64px !important;
  height:64px !important;
  max-width:none !important;
  object-fit:contain !important;
  object-position:center !important;
  transform:none !important;
  image-rendering:pixelated;
}
.creator-reference-shell .avatar-object-tile .avatar-retro-warn{top:2px;left:2px;right:auto}
.creator-reference-shell .avatar-object-tile i{
  position:absolute;
  top:4px;
  right:6px;
  color:#3d7a2a;
  font-style:normal;
  font-weight:900;
}
.avatar-object-empty{color:#8a8a8a;font-size:13px;padding:18px 4px}
.avatar-equip-visibility{
  width:207px;
  margin-top:16px;
  padding:12px 10px 10px;
  border:1px solid #ead9a8;
  border-radius:10px;
  background:#fbf6e8;
}
.avatar-equip-visibility-title{
  margin-bottom:8px;
  color:#8a6a28;
  font-size:12px;
  font-weight:800;
  text-align:center;
}
.avatar-vis-row{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.avatar-vis-btn{
  position:relative;
  height:36px !important;
  padding:0 !important;
  border:0 !important;
  border-radius:8px !important;
  background:#f0c44a !important;
  color:#5a3d0c !important;
  box-shadow:none !important;
  transform:none !important;
  font-size:16px !important;
}
.avatar-vis-btn.off{background:#efe7cf !important;color:#9a8a68 !important}

/* Cases Objets : ignorer le défaut flex-end / 120px des tuiles Corps. */
.creator-reference-shell .avatar-object-grid .avatar-choice-tile.avatar-object-tile{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:72px !important;
  min-width:72px !important;
  max-width:72px !important;
  height:72px !important;
  min-height:72px !important;
  max-height:72px !important;
  padding:0 !important;
  margin:0 !important;
  border:1px solid #e8e8e4 !important;
  border-radius:8px !important;
  background:#fff !important;
  overflow:hidden !important;
}
.creator-reference-shell .avatar-object-grid .avatar-choice-preview{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  place-items:center !important;
  width:72px !important;
  height:72px !important;
  min-width:0 !important;
  min-height:0 !important;
  max-width:72px !important;
  max-height:72px !important;
  padding:0 !important;
  border:0 !important;
  border-radius:8px !important;
  background:transparent !important;
  box-shadow:none !important;
}
.creator-reference-shell .avatar-object-grid img{
  width:58px !important;
  height:58px !important;
  max-width:58px !important;
  max-height:58px !important;
  margin:0 !important;
  object-fit:contain !important;
  object-position:center center !important;
  align-self:center !important;
  image-rendering:pixelated;
}

/* Aperçu créateur = même taille que le portrait village, image entière visible. */
.creator-reference-shell .avatar-studio-preview{
  width:164px !important;
  min-width:164px !important;
  max-width:164px !important;
  height:202px !important;
  min-height:202px !important;
  max-height:202px !important;
  display:block !important;
  overflow:hidden !important;
  border-radius:7px !important;
  background:#d5d7cf !important;
}
.creator-reference-shell .avatar-studio-preview .ninja-portrait{
  display:block !important;
  width:164px !important;
  height:202px !important;
  max-width:none !important;
  transform:none !important;
  border:0 !important;
  border-radius:4px !important;
  background:#d5d7cf !important;
  box-shadow:none !important;
}
.creator-reference-screen .avatar-studio-preview .creator-new-skin,
.creator-reference-shell .avatar-studio-preview .creator-new-skin{
  position:relative !important;
  display:block !important;
  width:164px !important;
  height:202px !important;
  transform:none !important;
  margin:0 !important;
  overflow:hidden !important;
}
.creator-reference-screen .avatar-studio-preview .creator-pixel-canvas{
  position:absolute !important;
  inset:0 !important;
  width:164px !important;
  height:202px !important;
}
.creator-reference-screen .avatar-studio-preview .creator-native-body,
.creator-reference-screen .avatar-studio-preview .creator-native-armor,
.creator-reference-screen .avatar-studio-preview .creator-native-clothing,
.creator-reference-screen .avatar-studio-preview .creator-native-mouth,
.creator-reference-screen .avatar-studio-preview .creator-native-eyes,
.creator-reference-screen .avatar-studio-preview .creator-native-beard,
.creator-reference-screen .avatar-studio-preview .creator-native-hair,
.creator-reference-screen .avatar-studio-preview .creator-native-headband,
.creator-reference-screen .avatar-studio-preview .creator-native-weapon{
  position:absolute !important;
  inset:0 !important;
  width:164px !important;
  height:202px !important;
  object-fit:contain !important;
  object-position:top center !important;
}
.creator-reference-shell .avatar-mode-switch{
  margin-top:12px !important;
}

/* Survol = jaune pâle, équipé = or fixe même sans souris. */
.creator-reference-shell button.avatar-choice-tile{
  background:#fff !important;
  border:1px solid #e7e7e3 !important;
}
.creator-reference-shell button.avatar-choice-tile .avatar-choice-preview{
  background:inherit !important;
}
.creator-reference-shell button.avatar-choice-tile:not(.selected):hover,
.creator-reference-shell .avatar-object-grid button.avatar-choice-tile:not(.selected):hover{
  background:#f6e59a !important;
  border-color:#e5d36a !important;
}
.creator-reference-shell button.avatar-choice-tile:not(.selected):hover .avatar-choice-preview{
  background:#f6e59a !important;
}
.creator-reference-shell button.avatar-choice-tile.selected,
.creator-reference-shell button.avatar-choice-tile.selected:hover,
.creator-reference-shell button.avatar-choice-tile.selected:focus,
.creator-reference-shell .avatar-object-grid button.avatar-choice-tile.selected,
.creator-reference-shell .avatar-object-grid button.avatar-choice-tile.selected:hover,
.creator-reference-shell .avatar-object-grid button.avatar-choice-tile.avatar-object-tile.selected,
.creator-reference-shell button.avatar-choice-tile.avatar-hair-tile.selected,
.creator-reference-shell button.avatar-choice-tile.avatar-eye-tile.selected,
.creator-reference-shell button.avatar-choice-tile.avatar-mouth-tile.selected,
.creator-reference-shell button.avatar-choice-tile.avatar-beard-tile.selected,
.creator-reference-shell button.avatar-choice-tile.avatar-skin-tile.selected,
.creator-reference-shell button.avatar-choice-tile.avatar-clothes-tile.selected{
  background:#e2b21c !important;
  border-color:#c99412 !important;
}
.creator-reference-shell button.avatar-choice-tile.selected .avatar-choice-preview,
.creator-reference-shell button.avatar-choice-tile.selected:hover .avatar-choice-preview,
.creator-reference-shell .avatar-object-grid button.avatar-choice-tile.selected .avatar-choice-preview{
  background:#e2b21c !important;
}
.creator-reference-shell .avatar-choice-tile img,
.creator-reference-shell .avatar-choice-tile.selected img,
.creator-reference-shell .avatar-choice-tile:hover img{
  mix-blend-mode:normal !important;
  filter:none !important;
  opacity:1 !important;
}
.creator-reference-shell .avatar-choice-tile > i{
  background:#fff !important;
  color:#2f8a32 !important;
}
.creator-reference-shell .avatar-color-dot:hover{
  outline:3px solid #f6e59a !important;
  outline-offset:2px !important;
  border-color:#fff !important;
}
.creator-reference-shell .avatar-color-dot.selected,
.creator-reference-shell .avatar-color-dot.selected:hover{
  outline:3px solid #e2b21c !important;
  outline-offset:2px !important;
  border-color:#fff !important;
}
.creator-reference-shell .avatar-all-colors-btn:hover{
  background:#f6e59a !important;
}
.creator-reference-shell .avatar-all-colors-btn.selected,
.creator-reference-shell .avatar-all-colors-btn.selected:hover{
  background:#e2b21c !important;
  color:#fff !important;
}

.casino-screen .casino-play-card {
  background: #f7f1e3;
  border: 1px solid #d7c7a4;
  padding: 12px 16px 20px;
}
.casino-screen .casino-play-card h3 {
  margin: 0 0 10px;
  font-size: 15px;
  font-weight: 700;
  color: #3d3428;
}
.casino-machine-wrap {
  position: relative;
  width: 468px;
  height: 624px;
  margin: 0 auto;
}
.casino-machine {
  margin: 0;
  border-collapse: collapse;
  width: 397px;
  background: transparent;
}
.casino-machine td {
  padding: 0;
  vertical-align: top;
  background: transparent;
}
.casino-machine td.casino-machine-top {
  display: block;
  width: 397px;
  height: 196px;
  background: url("https://images.shinobi.fr/images/casino/machine/structure/ukabu_casino_machine_haut.gif") no-repeat 0 0;
}
.casino-machine td.casino-machine-reels {
  width: 397px;
  height: 182px;
  background: url("https://images.shinobi.fr/images/casino/machine/structure/ukabu_casino_machine_bas.gif") no-repeat 0 0;
  text-align: center;
}
.casino-gain,
.casino-machine img#gain {
  display: block;
  width: 397px;
  height: 196px;
  max-width: none;
  filter: brightness(500%);
}
.casino-machine-mid {
  display: block;
  width: 397px;
  height: 246px;
}
.casino-lever-link {
  position: absolute;
  top: 0;
  left: 397px;
  width: 71px;
  height: 624px;
  padding: 0;
  margin: 0;
  border: 0;
  background: transparent !important;
  box-shadow: none !important;
  filter: none !important;
  transform: none !important;
  text-decoration: none;
  line-height: 0;
  cursor: pointer;
}
.casino-lever-link:hover,
.casino-lever-link:active,
.casino-lever-link:focus {
  background: transparent !important;
  box-shadow: none !important;
  filter: none !important;
  transform: none !important;
  outline: none;
}
.casino-lever-link.is-spinning {
  pointer-events: none;
  cursor: default;
}
.casino-lever-link img {
  display: block;
  width: 71px;
  height: 624px;
  pointer-events: none;
}
.casino-slots {
  border-collapse: collapse;
  margin: 37px 41px 0;
}
.casino-slots td {
  padding: 0 4px;
}
.casino-slots img {
  display: block;
  width: 95px;
  height: 95px;
}
.casino-screen .shop-npc-portrait {
  width: 60px;
  height: 74px;
  overflow: hidden;
  background: var(--bg-panel-alt);
}
.casino-screen .shop-npc-portrait img {
  width: 60px;
  height: 74px;
  object-fit: cover;
}
.casino-screen .shop-npc-exit {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  border: 1px solid var(--button-secondary-border);
  border-radius: 8px;
  background: var(--button-secondary-bg);
  color: #5a4020;
  font-size: 12px;
  font-weight: 700;
  text-decoration: none;
}
.village-purse-card {
  position: relative;
  overflow: visible;
}
.purse-delta {
  position: absolute;
  right: 10px;
  top: 6px;
  font-weight: 800;
  font-size: 15px;
  pointer-events: none;
  animation: purseDeltaFly 1.25s ease-out forwards;
  text-shadow: 0 1px 0 #fff;
}
.purse-delta.is-gain { color: #1a8f3c; }
.purse-delta.is-loss { color: #c0392b; }
@keyframes purseDeltaFly {
  0% { opacity: 1; transform: translateY(10px) scale(1); }
  100% { opacity: 0; transform: translateY(-28px) scale(1.05); }
}
#etat_gain { font-weight: 700; }

/* v44.47 — fond de page : Jour parchemin, Classique anthracite, Nuit bleu-noir */
body.theme-day:has(.game-header) {
  background: var(--nr-page) !important;
  color: var(--nr-text);
}
body.theme-classic:has(.game-header),
body.theme-night:has(.game-header) {
  background: var(--nr-page) !important;
  color: var(--nr-text);
}
body:has(.game-header) .game-header {
  background: #111312 !important;
  border-bottom: 1px solid #2f2e2a !important;
  box-shadow: 0 2px 10px rgba(0,0,0,.22) !important;
}
body:has(.game-header) .game-header .game-tool-icon,
body:has(.game-header) .game-header .game-account-menu > summary {
  width: 40px !important;
  height: 40px !important;
  min-height: 40px !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: #9aa3ad !important;
}
body:has(.game-header) .game-header .game-tool-icon:hover:not(:disabled),
body:has(.game-header) .game-header .game-tool-icon.is-active,
body:has(.game-header) .game-header .game-account-menu[open] > summary,
body:has(.game-header) .game-header .game-account-menu > summary:hover {
  background: #2a2b28 !important;
  color: #e8e8ea !important;
}
body:has(.game-header) .game-header .game-nav-link {
  font-size: 13px !important;
  letter-spacing: .01em;
}
body:has(.game-header) .game-header .game-nav-link.is-active::after {
  background: #d4b06a !important;
  height: 3px !important;
}

body.theme-day:has(.village-screen) .village-profile-card,
body.theme-day:has(.village-screen) .village-purse-card,
body.theme-day:has(.village-screen) .village-radio,
body.theme-day:has(.village-screen) .map-detail,
body.theme-day:has(.legacy-shop-screen) .village-profile-card,
body.theme-day:has(.legacy-shop-screen) .village-purse-card,
body.theme-day:has(.legacy-shop-screen) .shop-side-card,
body.theme-day:has(.inventory-screen) .inventory-note-card,
body.theme-day:has(.inventory-screen) .inventory-browser-card {
  background: var(--nr-surface) !important;
  border-color: var(--nr-line) !important;
  box-shadow: var(--nr-shadow) !important;
}

.village-profile-card .bar,
.village-profile-card .progress-bar,
.village-profile-card .progress {
  height: 8px !important;
  border-radius: 99px !important;
  overflow: hidden;
  background: #e6dcc4 !important;
}
.village-profile-card .bar span,
.village-profile-card .progress {
  border-radius: 99px;
}
.village-purse-card .purse-row {
  padding: 2px 0;
}
.village-purse-card .purse-row strong {
  font-variant-numeric: tabular-nums;
  color: #3a3326;
}

body.theme-day:has(.village-screen) .village-screen .map-detail.location-choice-panel,
body.theme-day:has(.village-screen) .location-choice-panel {
  background: var(--nr-surface) !important;
  border-color: var(--nr-line) !important;
  color: var(--nr-text) !important;
}
body.theme-day:has(.village-screen) .village-screen .map-detail.location-choice-panel h2,
body.theme-day:has(.village-screen) .village-screen .location-choice-panel h2 {
  color: var(--nr-text) !important;
}
body.theme-day:has(.village-screen) .village-screen .location-choice-panel .eyebrow {
  color: var(--nr-muted) !important;
}
body.theme-day:has(.village-screen) .village-screen .location-choice-copy p {
  color: var(--nr-muted) !important;
}
body.theme-day:has(.village-screen) .village-screen .location-choice-hero {
  color: var(--nr-text) !important;
  background: var(--nr-surface-2) !important;
  border-bottom: 1px solid var(--nr-line-soft) !important;
}

.village-screen button.location-choice-row {
  min-height: 38px !important;
  padding: 8px 12px !important;
  border-radius: 6px !important;
  border-color: #d6c8a8 !important;
  background: var(--bg-panel) !important;
}
.village-screen button.location-choice-row:hover:not(:disabled) {
  background: #fffdf6 !important;
  border-color: #c9a45a !important;
}
.village-screen button.location-choice-row b {
  font-size: 12.5px !important;
  font-weight: 650 !important;
  color: #2c281f !important;
}
.village-screen button.location-choice-row em {
  color: #c49a4a !important;
  font-size: 13px !important;
  font-weight: 700 !important;
}
.village-screen .story-mission-action {
  background: var(--bg-card) !important;
  border-color: #e0b45a !important;
}

.legacy-shop-screen .legacy-shop-notice,
.inventory-note-card {
  background: var(--bg-panel) !important;
  border: 1px solid var(--border-soft) !important;
  border-radius: 6px !important;
  color: var(--text-primary) !important;
  font-size: 13px;
  line-height: 1.45;
}
.shop-npc-bubble {
  background: var(--bg-card) !important;
  color: var(--text-primary) !important;
  border-radius: 8px !important;
  box-shadow: none;
}
.legacy-shop-row,
.inventory-legacy-row {
  border-left-color: #e2b15a !important;
}
.inventory-tabs .secondary {
  border-radius: 10px !important;
  padding: 7px 14px !important;
}
.inventory-tabs .secondary.active-tab {
  background: var(--button-primary-hover) !important;
  color: #2f2618 !important;
}
.shop-side-card h3,
.village-radio h3 {
  font-size: 13px !important;
  letter-spacing: .04em;
  text-transform: none;
  color: var(--text-primary) !important;
}
.shop-mission-summary,
.shop-side-body {
  background: var(--bg-panel-alt) !important;
  border-radius: 7px !important;
}
.casino-screen .casino-play-card {
  background: var(--bg-panel) !important;
  border-color: var(--border-soft) !important;
  border-radius: 8px !important;
}
.casino-screen .casino-play-card h3 {
  color: var(--text-primary) !important;
  font-size: 14px;
}
.village-radio .radio-feed {
  background: var(--bg-panel) !important;
  border-radius: 6px;
}
.village-radio .radio-compose input {
  border-radius: 8px !important;
}

.message-card {
  background: var(--bg-card) !important;
  border-color: var(--border-soft) !important;
  color: var(--text-secondary) !important;
}

body.theme-day:has(.game-header) .legacy-shop-notice,
body.theme-day:has(.game-header) .inventory-note-card p,
body.theme-day:has(.game-header) .shop-npc-bubble p {
  color: var(--nr-muted) !important;
}
body.theme-day:has(.game-header) .shop-buy,
body.theme-day:has(.game-header) .legacy-shop-row button {
  border-radius: 6px !important;
  border-color: var(--nr-line) !important;
  background: var(--nr-control) !important;
  color: var(--nr-text) !important;
}
body.theme-day:has(.game-header) .quest-layout,
body.theme-day:has(.game-header) .quest-card,
body.theme-day:has(.game-header) .team-screen .card,
body.theme-day:has(.game-header) .seals-screen .card {
  background: var(--nr-surface);
  border-color: var(--nr-line);
}

/* v44.48 — contour carte + menus Builds */
.village-screen .map-card,
.village-screen .map-card-full {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  overflow: hidden !important;
  border-radius: 8px !important;
}
.village-screen .world-map-stage {
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  aspect-ratio: 2 / 1 !important;
  border: 1px solid #c4b089 !important;
  border-radius: 8px !important;
  box-shadow: 0 2px 8px rgba(60,40,15,.12) !important;
  background-color: #d4c4a0 !important;
  background-size: cover !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
}
.village-screen .world-map-stage.village-map-chikara,
.village-screen .world-map-stage.village-map-gensou,
.village-screen .world-map-stage.village-map-torikae,
.village-screen .world-map-stage.village-map-ukabu_north,
.village-screen .world-map-stage.village-map-ukabu_south,
.village-screen .world-map-stage.village-map-mahou,
.village-screen .world-map-stage.village-map-minato {
  aspect-ratio: 2 / 1 !important;
  min-height: 0 !important;
  background-size: cover !important;
  background-position: center !important;
}
.village-screen .world-map-stage:before,
.village-screen .world-map-stage:after,
.village-screen .map-overlay-shade {
  content: none !important;
  display: none !important;
  background: none !important;
}

.build-shell {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  width: min(1180px, calc(100vw - 24px)) !important;
}
.build-layout {
  grid-template-columns: minmax(260px, 360px) minmax(0, 1fr) !important;
  justify-content: stretch !important;
  align-items: start !important;
}
.build-left-panel.card,
.build-right-panel.card {
  background: var(--nr-surface) !important;
  border: 1px solid var(--nr-line) !important;
  border-radius: 8px !important;
  box-shadow: var(--nr-shadow) !important;
  padding-top: 14px;
}
.build-right-panel.card {
  padding: 0 !important;
  overflow: hidden !important;
  min-width: 0 !important;
}
.build-tabs {
  height: auto !important;
  min-height: 44px !important;
  flex-wrap: nowrap !important;
  overflow-x: auto !important;
  gap: 8px !important;
  padding: 8px 12px !important;
}
.build-tab {
  flex: 0 0 auto !important;
  white-space: nowrap !important;
  font-size: 12px !important;
  font-weight: 650 !important;
  padding: 6px 10px !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  transform: none !important;
}
.build-tab.active {
  background: #f8dfac !important;
  color: #c47a18 !important;
  border-radius: 6px !important;
}
.build-screen button:hover:not(:disabled),
.build-screen button:active:not(:disabled),
.build-screen button:focus-visible {
  transform: none !important;
  filter: none !important;
  outline: none !important;
}
.build-option-row.attitude {
  display: grid !important;
  grid-template-columns: 26px minmax(90px, 140px) minmax(0, 1fr) !important;
  align-items: center !important;
  height: auto !important;
  min-height: 48px !important;
}
.build-option-stats {
  justify-content: flex-end !important;
  flex-wrap: wrap !important;
}

.village-screen .innate-gift-layout .innate-gift-scene,
.village-screen .innate-gift-layout .awakening-sheet {
  grid-column: 1;
  grid-row: 1 / span 2;
  align-self: start;
}
.village-screen .innate-gift-layout .village-mission-card {
  grid-column: 2;
  grid-row: 1 / span 2;
}
.village-center-column .innate-gift-scene {
  display: grid;
  gap: 10px;
  padding: 12px;
  background: var(--bg-panel);
  border: 1px solid var(--border-primary);
}
.village-center-column .innate-gift-scene .tutorial-instructor-card,
.village-center-column .innate-gift-scene .tutorial-instructor-choice-card {
  background: #f5f5f5;
}
.village-center-column .awakening-sheet {
  width: 100%;
  margin: 0;
  padding: 16px 16px 20px;
  background: #f5eedb;
  border: 1px solid var(--border-primary);
  box-shadow: 0 5px 14px rgba(76,54,25,.12);
  color: #3d2d18;
}
.village-center-column .awakening-sheet h1 {
  font-size: 22px;
}
.village-center-column .awakening-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.awakening-sheet {
  width: min(1100px, 100%);
  margin: 0 auto;
  background: #f5eedb;
  color: #3d2d18;
  border: 1px solid #c6b18a;
  border-radius: 10px;
  box-shadow: 0 18px 48px rgba(0, 0, 0, .35);
  padding: 28px 22px 32px;
}
.awakening-kicker {
  letter-spacing: .16em;
  text-transform: uppercase;
  font-size: 11px;
  color: #7a6340;
  margin-bottom: 8px;
}
.awakening-sheet h1 {
  margin: 0 0 12px;
  font-size: clamp(22px, 4vw, 34px);
  letter-spacing: .04em;
}
.awakening-lead {
  font-size: 17px;
  line-height: 1.45;
  margin: 0 0 12px;
}
.awakening-sheet p {
  margin: 0 0 10px;
  line-height: 1.5;
}
.awakening-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 22px;
}
.awakening-actions button {
  min-height: 44px;
  padding: 10px 18px;
  letter-spacing: .06em;
}
.awakening-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin-top: 22px;
  align-items: stretch;
}
.awakening-card {
  display: flex;
  flex-direction: row;
  align-items: stretch;
  height: 148px;
  min-height: 148px;
  gap: 0;
  background: var(--bg-card);
  border: 1px solid #cbb991;
  border-radius: 8px;
  padding: 0;
  overflow: hidden;
  box-shadow: 0 3px 10px rgba(60, 40, 15, .08);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.awakening-card:hover {
  transform: translateY(-3px);
  border-color: #b08948;
  box-shadow: 0 10px 20px rgba(80, 50, 20, .14);
}
.awakening-card.is-none {
  background: var(--bg-card);
  border-style: solid;
}
.awakening-card-media {
  flex: 0 0 44%;
  width: 44%;
  min-width: 0;
  min-height: 0;
  align-self: stretch;
  background: transparent;
  overflow: hidden;
  border-radius: 7px 0 0 7px;
}
.awakening-card-image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
.awakening-card-placeholder {
  display: grid;
  place-items: center;
  width: 100%;
  height: 100%;
  min-height: 0;
  font-size: 34px;
  line-height: 1;
  color: #e8d7b0;
  background: linear-gradient(180deg, #2a231b 0%, #15110d 100%);
}
.awakening-card-body {
  display: flex;
  flex-direction: column;
  gap: 4px;
  flex: 1 1 auto;
  padding: 12px 12px 10px;
  min-width: 0;
  min-height: 0;
}
.awakening-card h2 {
  margin: 0;
  min-height: 0;
  font-size: 16px;
  line-height: 1.25;
  color: #2c2418;
}
.awakening-card small {
  color: #8b3c30;
  text-transform: uppercase;
  letter-spacing: .08em;
  font-size: 10px;
  font-weight: 800;
}
.awakening-card-hint,
.awakening-card p.awakening-card-hint {
  flex: 0 0 auto;
  margin: 0;
  font-size: 12px;
  line-height: 1.35;
  color: #6a5434;
  font-style: normal;
}
.awakening-card button.awakening-awaken {
  align-self: stretch;
  width: auto;
  margin: auto 0 0;
  min-height: 30px;
  padding: 6px 10px;
  border-radius: 5px;
  border: 1px solid #6e2c24;
  background: #8b3c30;
  color: #f4ead6;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .1em;
  box-shadow: none;
  transform: none;
}
.awakening-card button.awakening-awaken:hover:not(:disabled) {
  transform: none;
  filter: brightness(1.12);
  box-shadow: none;
  background: #a24738;
}
@media (max-width: 1180px) {
  .village-center-column .awakening-grid,
  .awakening-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 820px) {
  .village-center-column .awakening-grid,
  .awakening-grid {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 560px) {
  .village-center-column .awakening-grid,
  .awakening-grid {
    grid-template-columns: 1fr;
  }
}
.awakening-chosen {
  margin: 8px 0 16px;
  font-size: 28px;
}
.oc-banner {
  margin: 8px 0 0;
  color: #f3e2b0;
  white-space: pre-wrap;
}
@media (max-width: 640px) {
  .awakening-sheet { padding: 18px 14px 24px; }
  .awakening-grid { grid-template-columns: 1fr; }
}

/* ================================================================
   v44.49 — tous les menus suivent la palette Jour / Nuit / Classique
   ================================================================ */
body.theme-day,
body.theme-classic,
body.theme-night {
  --paper-page: var(--nr-page);
  --paper-panel: var(--nr-surface);
  --paper-panel-2: var(--nr-surface-2);
  --paper-panel-3: var(--nr-surface-3);
  --paper-border: var(--nr-line);
  --paper-border-soft: var(--nr-line-soft);
  --paper-text: var(--nr-text);
  --paper-muted: var(--nr-muted);
}

body.theme-day:has(.game-header),
body.theme-classic:has(.game-header),
body.theme-night:has(.game-header),
body.theme-day:has(.village-screen),
body.theme-classic:has(.village-screen),
body.theme-night:has(.village-screen),
body.theme-day:has(.build-screen),
body.theme-classic:has(.build-screen),
body.theme-night:has(.build-screen),
body.theme-day:has(.inventory-screen),
body.theme-classic:has(.inventory-screen),
body.theme-night:has(.inventory-screen),
body.theme-day:has(.legacy-shop-screen),
body.theme-classic:has(.legacy-shop-screen),
body.theme-night:has(.legacy-shop-screen),
body.theme-day:has(.missions-journal-screen),
body.theme-classic:has(.missions-journal-screen),
body.theme-night:has(.missions-journal-screen),
body.theme-day:has(.temple-screen),
body.theme-classic:has(.temple-screen),
body.theme-night:has(.temple-screen) {
  background: var(--nr-page) !important;
  color: var(--nr-text) !important;
}

body.theme-day .village-profile-card,
body.theme-classic .village-profile-card,
body.theme-night .village-profile-card,
body.theme-day .village-purse-card,
body.theme-classic .village-purse-card,
body.theme-night .village-purse-card,
body.theme-day .village-topline,
body.theme-classic .village-topline,
body.theme-night .village-topline,
body.theme-day .village-radio,
body.theme-classic .village-radio,
body.theme-night .village-radio,
body.theme-day .map-detail,
body.theme-classic .map-detail,
body.theme-night .map-detail,
body.theme-day .shop-side-card,
body.theme-classic .shop-side-card,
body.theme-night .shop-side-card,
body.theme-day .shop-main-column > .card,
body.theme-classic .shop-main-column > .card,
body.theme-night .shop-main-column > .card,
body.theme-day .legacy-shop-shell > .card,
body.theme-classic .legacy-shop-shell > .card,
body.theme-night .legacy-shop-shell > .card,
body.theme-day .inventory-browser-card,
body.theme-classic .inventory-browser-card,
body.theme-night .inventory-browser-card,
body.theme-day .inventory-note-card,
body.theme-classic .inventory-note-card,
body.theme-night .inventory-note-card,
body.theme-day .legacy-shop-notice,
body.theme-classic .legacy-shop-notice,
body.theme-night .legacy-shop-notice,
body.theme-day .build-left-panel,
body.theme-classic .build-left-panel,
body.theme-night .build-left-panel,
body.theme-day .build-right-panel,
body.theme-classic .build-right-panel,
body.theme-night .build-right-panel,
body.theme-day .quest-layout,
body.theme-classic .quest-layout,
body.theme-night .quest-layout,
body.theme-day .quest-card,
body.theme-classic .quest-card,
body.theme-night .quest-card,
body.theme-day .team-screen .card,
body.theme-classic .team-screen .card,
body.theme-night .team-screen .card,
body.theme-day .seals-screen .card,
body.theme-classic .seals-screen .card,
body.theme-night .seals-screen .card,
body.theme-day .options-panel,
body.theme-classic .options-panel,
body.theme-night .options-panel,
body.theme-day .admin-panel,
body.theme-classic .admin-panel,
body.theme-night .admin-panel,
body.theme-day .admin-head,
body.theme-classic .admin-head,
body.theme-night .admin-head,
body.theme-day .admin-section,
body.theme-classic .admin-section,
body.theme-night .admin-section,
body.theme-day .admin-current-value,
body.theme-classic .admin-current-value,
body.theme-night .admin-current-value,
body.theme-day .village-center-column .innate-gift-scene,
body.theme-classic .village-center-column .innate-gift-scene,
body.theme-night .village-center-column .innate-gift-scene,
body.theme-day .village-center-column .awakening-sheet,
body.theme-classic .village-center-column .awakening-sheet,
body.theme-night .village-center-column .awakening-sheet,
body.theme-day .awakening-card,
body.theme-classic .awakening-card,
body.theme-night .awakening-card,
body.theme-day .theme-setting-block,
body.theme-classic .theme-setting-block,
body.theme-night .theme-setting-block,
body.theme-day .option-setting,
body.theme-classic .option-setting,
body.theme-night .option-setting,
body.theme-day .volume-setting,
body.theme-classic .volume-setting,
body.theme-night .volume-setting,
body.theme-day .village-activity-chat,
body.theme-classic .village-activity-chat,
body.theme-night .village-activity-chat,
body.theme-day .location-choice-panel,
body.theme-classic .location-choice-panel,
body.theme-night .location-choice-panel {
  background: var(--nr-surface) !important;
  border-color: var(--nr-line) !important;
  color: var(--nr-text) !important;
}

body.theme-day .shop-side-body,
body.theme-classic .shop-side-body,
body.theme-night .shop-side-body,
body.theme-day .shop-pass-box,
body.theme-classic .shop-pass-box,
body.theme-night .shop-pass-box,
body.theme-day .shop-side-button,
body.theme-classic .shop-side-button,
body.theme-night .shop-side-button,
body.theme-day .build-content-area,
body.theme-classic .build-content-area,
body.theme-night .build-content-area,
body.theme-day .village-radio .radio-feed,
body.theme-classic .village-radio .radio-feed,
body.theme-night .village-radio .radio-feed {
  background: var(--nr-surface-2) !important;
  border-color: var(--nr-line-soft) !important;
  color: var(--nr-text) !important;
}

body.theme-day .village-profile-card h2,
body.theme-classic .village-profile-card h2,
body.theme-night .village-profile-card h2,
body.theme-day .village-profile-card h3,
body.theme-classic .village-profile-card h3,
body.theme-night .village-profile-card h3,
body.theme-day .village-profile-card strong,
body.theme-classic .village-profile-card strong,
body.theme-night .village-profile-card strong,
body.theme-day .village-purse-card strong,
body.theme-classic .village-purse-card strong,
body.theme-night .village-purse-card strong,
body.theme-day .shop-side-card h3,
body.theme-classic .shop-side-card h3,
body.theme-night .shop-side-card h3,
body.theme-day .admin-head h2,
body.theme-classic .admin-head h2,
body.theme-night .admin-head h2,
body.theme-day .admin-section h3,
body.theme-classic .admin-section h3,
body.theme-night .admin-section h3,
body.theme-day .awakening-sheet h1,
body.theme-classic .awakening-sheet h1,
body.theme-night .awakening-sheet h1,
body.theme-day .awakening-card h2,
body.theme-classic .awakening-card h2,
body.theme-night .awakening-card h2,
body.theme-day .game-menu-player strong,
body.theme-classic .game-menu-player strong,
body.theme-night .game-menu-player strong {
  color: var(--nr-text) !important;
}

body.theme-day .village-profile-card p,
body.theme-classic .village-profile-card p,
body.theme-night .village-profile-card p,
body.theme-day .village-purse-card span,
body.theme-classic .village-purse-card span,
body.theme-night .village-purse-card span,
body.theme-day .shop-mission-summary p,
body.theme-classic .shop-mission-summary p,
body.theme-night .shop-mission-summary p,
body.theme-day .options-head p,
body.theme-classic .options-head p,
body.theme-night .options-head p,
body.theme-day .option-setting small,
body.theme-classic .option-setting small,
body.theme-night .option-setting small,
body.theme-day .admin-head p,
body.theme-classic .admin-head p,
body.theme-night .admin-head p,
body.theme-day .awakening-sheet p,
body.theme-classic .awakening-sheet p,
body.theme-night .awakening-sheet p,
body.theme-day .awakening-card p,
body.theme-classic .awakening-card p,
body.theme-night .awakening-card p,
body.theme-day .awakening-card small,
body.theme-classic .awakening-card small,
body.theme-night .awakening-card small,
body.theme-day .awakening-card em,
body.theme-classic .awakening-card em,
body.theme-night .awakening-card em,
body.theme-day .game-menu-player span,
body.theme-classic .game-menu-player span,
body.theme-night .game-menu-player span {
  color: var(--nr-muted) !important;
}

body.theme-day .village-profile-card .bar,
body.theme-classic .village-profile-card .bar,
body.theme-night .village-profile-card .bar,
body.theme-day .village-profile-card .progress-bar,
body.theme-classic .village-profile-card .progress-bar,
body.theme-night .village-profile-card .progress-bar {
  background: var(--nr-surface-3) !important;
}

body.theme-day .village-screen button.location-choice-row,
body.theme-classic .village-screen button.location-choice-row,
body.theme-night .village-screen button.location-choice-row,
body.theme-day .admin-quick button,
body.theme-classic .admin-quick button,
body.theme-night .admin-quick button {
  background: var(--nr-control) !important;
  border-color: var(--nr-line) !important;
  color: var(--nr-text) !important;
}
body.theme-day .village-screen button.location-choice-row:hover:not(:disabled),
body.theme-classic .village-screen button.location-choice-row:hover:not(:disabled),
body.theme-night .village-screen button.location-choice-row:hover:not(:disabled) {
  background: var(--nr-control-hover) !important;
  border-color: var(--nr-line) !important;
}
body.theme-day .village-screen button.location-choice-row b,
body.theme-classic .village-screen button.location-choice-row b,
body.theme-night .village-screen button.location-choice-row b {
  color: var(--nr-text) !important;
}

body.theme-day .build-tab.active,
body.theme-classic .build-tab.active,
body.theme-night .build-tab.active {
  background: var(--nr-surface-3) !important;
  color: var(--nr-text) !important;
}

body.theme-day .village-center-column .innate-gift-scene .tutorial-instructor-card,
body.theme-classic .village-center-column .innate-gift-scene .tutorial-instructor-card,
body.theme-night .village-center-column .innate-gift-scene .tutorial-instructor-card,
body.theme-day .village-center-column .innate-gift-scene .tutorial-instructor-choice-card,
body.theme-classic .village-center-column .innate-gift-scene .tutorial-instructor-choice-card,
body.theme-night .village-center-column .innate-gift-scene .tutorial-instructor-choice-card {
  background: var(--nr-surface-2) !important;
  border-color: var(--nr-line) !important;
  color: var(--nr-text) !important;
}

/* Pins village : même cadre et même écriture que shinobi.fr. Seule la quête est jaune et saute. */
.village-screen .pin-badge,
.world-map-screen .pin-badge {
  min-height: 0 !important;
  gap: 0 !important;
  padding: 8px 10px !important;
  border: 0 !important;
  border-radius: 3px !important;
  background: rgba(0, 0, 0, 0.62) !important;
  box-shadow: 0 0 1px #000 !important;
  backdrop-filter: none !important;
  color: #fff !important;
  transition: background .12s ease !important;
}
.village-screen .pin-hop,
.world-map-screen .pin-hop {
  display: inline-flex;
  align-items: center;
  animation: none !important;
}
.village-screen .pin-text,
.world-map-screen .pin-text {
  color: #fff !important;
  font-family: "Trebuchet MS", Arial, sans-serif !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  text-transform: uppercase !important;
  text-shadow: none !important;
}
.village-screen .map-pin:not(.mission-target):hover .pin-badge,
.village-screen .map-pin:not(.mission-target):focus-visible .pin-badge,
.world-map-screen .map-pin:hover .pin-badge,
.world-map-screen .map-pin:focus-visible .pin-badge {
  background: rgba(0, 0, 0, 0.8) !important;
  transform: none !important;
  box-shadow: 0 0 1px #000 !important;
}
.village-screen .map-pin.current .pin-badge,
.village-screen .map-pin.selected .pin-badge,
.world-map-screen .map-pin.selected .pin-badge {
  background: rgba(255, 255, 255, 0.8) !important;
  color: #000 !important;
}
.village-screen .map-pin.current .pin-text,
.village-screen .map-pin.selected .pin-text,
.world-map-screen .map-pin.selected .pin-text {
  color: #000 !important;
  text-shadow: none !important;
}
.village-screen .map-pin.current:hover .pin-badge,
.village-screen .map-pin.selected:hover .pin-badge {
  background: #fff !important;
}
.village-screen .map-pin.mission-target .pin-badge,
.village-screen .map-pin.mission-target:hover .pin-badge,
.village-screen .map-pin.mission-target:focus-visible .pin-badge,
.village-screen .map-pin.mission-target.selected .pin-badge,
.village-screen .map-pin.mission-target.current .pin-badge {
  padding: 8px 10px !important;
  border: 0 !important;
  border-radius: 3px !important;
  background: rgba(255, 200, 0, 0.85) !important;
  color: #000 !important;
  box-shadow: 0 0 10px rgba(255, 200, 0, 0.6) !important;
  animation: fa-bounce 1s ease infinite !important;
  transform-origin: center bottom !important;
  transition: none !important;
}
.village-screen .map-pin.mission-target .pin-text,
.village-screen .map-pin.mission-target.selected .pin-text,
.village-screen .map-pin.mission-target.current .pin-text {
  color: #000 !important;
  text-shadow: none !important;
  font-family: "Trebuchet MS", Arial, sans-serif !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  text-transform: uppercase !important;
}
.village-screen .map-pin.mission-target .pin-hop {
  animation: none !important;
}

.game-account-dropdown { overflow: visible; }
.game-reset-menu > summary {
  list-style: none;
  padding: 8px 12px 6px;
  border-radius: 8px;
}
.game-reset-menu > summary::-webkit-details-marker { display: none; }

@media (max-width: 800px) {
  .game-account-dropdown {
    width: min(286px, calc(100vw - 16px));
  }
}

/* Options de jeu — compact cream panel, grouped rows, switches */
.options-backdrop {
  padding: 14px;
  background: rgba(18, 16, 12, .62);
  backdrop-filter: blur(8px);
}
.options-panel {
  display: flex;
  flex-direction: column;
  width: min(512px, 100%);
  height: auto;
  max-height: min(680px, calc(100dvh - 24px));
  overflow: auto;
  padding: 16px 16px 14px;
  border-radius: 14px;
  scrollbar-width: thin;
  scrollbar-color: #cbb48a transparent;
}
.options-head {
  flex: 0 0 auto;
  gap: 12px;
  padding-bottom: 4px;
}
.options-head .eyebrow {
  color: #8a6a32;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .18em;
  text-transform: uppercase;
}
.options-head h2 {
  margin: 2px 0 2px;
  font-size: 20px;
  font-weight: 700;
  letter-spacing: .01em;
}
.options-head p {
  font-size: 12px;
  line-height: 1.4;
}
.options-body {
  flex: 0 0 auto;
  min-height: 0;
  overflow: visible;
  padding: 2px 0 4px;
}
  scrollbar-width: thin;
  scrollbar-color: #cbb48a transparent;
}
.options-body::-webkit-scrollbar { width: 6px; }
.options-body::-webkit-scrollbar-track { background: transparent; }
.options-body::-webkit-scrollbar-thumb {
  background: #cbb48a;
  border-radius: 99px;
}
.options-group { margin: 0 0 6px; }
.options-group-label {
  margin: 0 2px 6px;
  color: #8a6a32;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .16em;
  text-transform: uppercase;
}
.options-list { display: grid; gap: 5px; margin-top: 0; }
.option-setting,
.volume-setting {
  min-height: 46px;
  padding: 8px 10px;
  border-radius: 10px;
  box-shadow: none;
  transform: none;
}
.option-setting-main {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}
.option-ico,
.options-panel .option-setting b,
.options-panel .volume-setting .option-ico {
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  flex: 0 0 28px;
  border-radius: 50%;
  font-size: 13px;
  font-weight: 500;
  line-height: 1;
}
.option-setting strong,
.volume-setting strong {
  display: block;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.2;
}
.option-setting small {
  display: block;
  margin-top: 2px;
  font-size: 11px;
  font-weight: 500;
  line-height: 1.3;
}
.option-switch {
  position: relative;
  flex: 0 0 40px;
  width: 40px;
  height: 22px;
  margin: 0;
  border-radius: 99px;
  background: #cfc3ab;
  box-shadow: inset 0 0 0 1px #bfb196;
  font-style: normal;
}
.option-switch i {
  position: absolute;
  top: 2px;
  left: 2px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: var(--bg-card);
  box-shadow: 0 1px 3px rgba(40, 28, 10, .18);
  transition: transform .18s ease;
}
.option-switch.is-on i { transform: translateX(18px); }
.option-switch-text {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
}
.volume-setting {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-rows: auto auto;
  grid-template-areas: "main value" "slider slider";
  align-items: center;
  align-content: start;
  height: auto;
  gap: 4px 10px;
}
.volume-setting .option-setting-main { grid-area: main; }
.volume-setting output {
  grid-area: value;
  font-size: 12px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.volume-setting input[type="range"] {
  grid-area: slider;
  width: 100%;
  height: 18px;
  margin: 2px 0 0;
  background: transparent;
  accent-color: #8b3c30;
}
.volume-setting input[type="range"]::-webkit-slider-runnable-track {
  height: 4px;
  border-radius: 99px;
  background: #d8c9a8;
}
.volume-setting input[type="range"]::-webkit-slider-thumb {
  -webkit-appearance: none;
  width: 16px;
  height: 16px;
  margin-top: -6px;
  border-radius: 50%;
  background: #8b3c30;
  border: 2px solid #f7efe0;
  box-shadow: 0 1px 3px rgba(40, 20, 10, .25);
}
.volume-setting input[type="range"]::-moz-range-track {
  height: 4px;
  border-radius: 99px;
  background: #d8c9a8;
}
.volume-setting input[type="range"]::-moz-range-thumb {
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: #8b3c30;
  border: 2px solid #f7efe0;
}
.theme-setting-block {
  margin-top: 0;
  padding: 10px;
  border-radius: 10px;
}
.theme-setting-head { margin-bottom: 8px; gap: 8px; }
.theme-setting-head strong { font-size: 13px; }
.theme-setting-head small { font-size: 11px; }
.theme-setting-head > span {
  padding: 3px 8px;
  border-radius: 99px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .04em;
}
.theme-choice-grid { gap: 7px; }
.theme-choice {
  gap: 5px;
  padding: 8px;
  border-radius: 10px !important;
}
.theme-choice-preview {
  height: 36px;
  padding: 4px;
  border-radius: 7px;
}
.theme-choice strong { font-size: 12px; }
.theme-choice small {
  min-height: 0;
  font-size: 10px;
  line-height: 1.3;
}
.options-footer {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 10px;
  padding: 10px 0 0;
  position: static;
  z-index: 2;
  border-top: 1px solid #e4d6b8;
}
.options-footer > button {
  min-height: 40px;
  padding: 0 16px;
  border-radius: 9px;
  font-size: 13px;
  font-weight: 700;
  transform: none;
}
.options-panel .options-close {
  width: 34px;
  min-width: 34px;
  height: 34px;
  border-radius: 8px;
  font-size: 22px;
}

body.theme-day .options-panel,
body.theme-classic .options-panel {
  background: var(--bg-panel) !important;
  border: 1px solid #c9b184 !important;
  color: var(--text-primary) !important;
  box-shadow: 0 18px 40px rgba(40, 28, 12, .22), 0 0 0 1px rgba(255, 248, 230, .65) inset !important;
}
body.theme-day .options-head h2,
body.theme-classic .options-head h2,
body.theme-day .options-panel strong,
body.theme-classic .options-panel strong {
  color: var(--text-primary) !important;
}
body.theme-day .options-head p,
body.theme-classic .options-head p,
body.theme-day .option-setting small,
body.theme-classic .option-setting small,
body.theme-day .theme-setting-head small,
body.theme-classic .theme-setting-head small,
body.theme-day .theme-choice small,
body.theme-classic .theme-choice small {
  color: #8a7b64 !important;
}
body.theme-day .options-group-label,
body.theme-classic .options-group-label,
body.theme-day .options-head .eyebrow,
body.theme-classic .options-head .eyebrow {
  color: #8a6a32 !important;
}
body.theme-day .option-setting,
body.theme-classic .option-setting,
body.theme-day .volume-setting,
body.theme-classic .volume-setting {
  background: #f4ead6 !important;
  border: 1px solid #e4d6b8 !important;
  color: var(--text-primary) !important;
}
body.theme-day .option-setting:hover,
body.theme-classic .option-setting:hover,
body.theme-day .volume-setting:hover,
body.theme-classic .volume-setting:hover {
  background: #efe4c8 !important;
  border-color: #d7c49a !important;
  transform: none !important;
}
body.theme-day .option-ico,
body.theme-classic .option-ico,
body.theme-day .options-panel .option-setting b,
body.theme-classic .options-panel .option-setting b {
  background: #efe3c4 !important;
  color: #5c4a2e !important;
}
body.theme-day .option-switch.is-on,
body.theme-classic .option-switch.is-on {
  background: #8b3c30;
  box-shadow: inset 0 0 0 1px #7a3429;
}
body.theme-day .volume-setting output,
body.theme-classic .volume-setting output {
  color: #6d4a1c !important;
}
body.theme-day .theme-setting-block,
body.theme-classic .theme-setting-block {
  background: #f6edd8 !important;
  border-color: #e4d6b8 !important;
}
body.theme-day .theme-choice,
body.theme-classic .theme-choice {
  background: var(--bg-panel) !important;
  border: 1px solid #e0d2b4 !important;
  color: var(--text-primary) !important;
  box-shadow: none !important;
}
body.theme-day .theme-choice:hover,
body.theme-classic .theme-choice:hover {
  background: #fffdf6 !important;
  transform: none !important;
}
body.theme-day .theme-choice.active,
body.theme-classic .theme-choice.active {
  border-color: #a9844a !important;
  box-shadow: inset 0 0 0 1px #c4a574 !important;
  background: #fff9ee !important;
}
body.theme-day .theme-setting-head > span,
body.theme-classic .theme-setting-head > span {
  background: #efe3c4 !important;
  color: #6d4a1c !important;
}
body.theme-day .options-panel .options-close,
body.theme-classic .options-panel .options-close,
body.theme-day .options-reset-btn,
body.theme-classic .options-reset-btn {
  background: #f4ead6 !important;
  border: 1px solid #d7c49a !important;
  color: var(--text-secondary) !important;
  box-shadow: none !important;
}
body.theme-day .options-panel .options-close:hover,
body.theme-classic .options-panel .options-close:hover,
body.theme-day .options-reset-btn:hover,
body.theme-classic .options-reset-btn:hover {
  background: #efe4c8 !important;
  transform: none !important;
}
body.theme-day .options-done-btn,
body.theme-classic .options-done-btn {
  background: #8b3c30 !important;
  border: 1px solid #7a3429 !important;
  color: #f7efe0 !important;
  box-shadow: none !important;
}
body.theme-day .options-done-btn:hover,
body.theme-classic .options-done-btn:hover {
  background: #9a4638 !important;
  transform: none !important;
}
body.theme-day .options-footer,
body.theme-classic .options-footer {
  background: var(--bg-panel);
  border-top-color: #e4d6b8;
}

body.theme-night .options-panel {
  background: #1b2228 !important;
  border: 1px solid #6d5b3a !important;
  color: #e6e0d4 !important;
  box-shadow: 0 18px 40px rgba(0, 0, 0, .45) !important;
}
body.theme-night .options-head h2,
body.theme-night .options-panel strong {
  color: #e8e2d6 !important;
}
body.theme-night .options-head p,
body.theme-night .option-setting small,
body.theme-night .theme-setting-head small,
body.theme-night .theme-choice small {
  color: #9aa6ad !important;
}
body.theme-night .options-group-label,
body.theme-night .options-head .eyebrow {
  color: #d4b06a !important;
}
body.theme-night .option-setting,
body.theme-night .volume-setting {
  background: #232c33 !important;
  border: 1px solid #334048 !important;
  color: #e8e2d6 !important;
}
body.theme-night .option-setting:hover,
body.theme-night .volume-setting:hover {
  background: #2a343c !important;
  transform: none !important;
}
body.theme-night .option-ico,
body.theme-night .options-panel .option-setting b {
  background: #2c3840 !important;
}
body.theme-night .option-switch {
  background: #3a4650;
  box-shadow: inset 0 0 0 1px #4a5862;
}
body.theme-night .option-switch.is-on {
  background: #a9844a;
  box-shadow: inset 0 0 0 1px #8f703c;
}
body.theme-night .volume-setting output { color: #d4b06a !important; }
body.theme-night .theme-setting-block {
  background: #212a31 !important;
  border-color: #334048 !important;
}
body.theme-night .theme-choice {
  background: #1b2228 !important;
  border: 1px solid #334048 !important;
  color: #e8e2d6 !important;
  box-shadow: none !important;
}
body.theme-night .theme-choice.active {
  border-color: #c4a574 !important;
  box-shadow: inset 0 0 0 1px #a9844a !important;
}
body.theme-night .theme-setting-head > span {
  background: #2c3840 !important;
  color: #d4b06a !important;
}
body.theme-night .options-panel .options-close,
body.theme-night .options-reset-btn {
  background: #232c33 !important;
  border: 1px solid #3d4c56 !important;
  color: #d5dde1 !important;
  box-shadow: none !important;
}
body.theme-night .options-done-btn {
  background: #8b3c30 !important;
  border: 1px solid #7a3429 !important;
  color: #f7efe0 !important;
  box-shadow: none !important;
}
body.theme-night .options-footer {
  background: #1b2228;
  border-top-color: #334048;
}
body.theme-night .options-body {
  scrollbar-color: #6d5b3a transparent;
}

@media (max-width: 640px) {
  .options-backdrop { padding: 8px; align-items: stretch; }
  .options-panel {
    width: 100%;
    height: auto;
    max-height: calc(100dvh - 16px);
    border-radius: 12px;
    padding: 14px 12px 12px;
  }
  .theme-choice-grid { grid-template-columns: 1fr 1fr; }
  .theme-choice:last-child { grid-column: 1 / -1; }
  .options-body { padding-bottom: 56px; }
  .options-footer { position: sticky; bottom: 0; }
  .options-footer > button { flex: 1 1 140px; }
  .option-setting, .volume-setting { min-height: 48px; }
}
@media (max-width: 420px) {
  .theme-choice-grid { grid-template-columns: 1fr; }
  .theme-choice:last-child { grid-column: auto; }
}

body.theme-night .profile-innate-gift {
  background: #232c33 !important;
  border-color: #3d4c56 !important;
  color: #e8e2d6 !important;
}
body.theme-night .profile-innate-gift:hover {
  background: #2a343c !important;
  border-color: #6d5b3a !important;
}
body.theme-night .profile-innate-gift-icon {
  background: transparent;
}
body.theme-night .profile-innate-gift-copy small,
body.theme-night .profile-innate-gift-chevron {
  color: #b9a47a !important;
}
body.theme-night .profile-innate-gift-copy strong {
  color: #e8e2d6 !important;
}
body.theme-night .profile-innate-gift.is-empty .profile-innate-gift-copy strong {
  color: #9aa6ad !important;
}


/* ================================================================
   BOUTONS GLOBAUX — couleurs uniquement via tokens de theme
   ================================================================ */
.btn,
body.theme-day button,
body.theme-classic button,
body.theme-night button {
  color: var(--button-primary-text);
  background: var(--button-primary-bg);
  border: 1px solid var(--button-primary-border);
  box-shadow: none;
}
.btn:hover:not(:disabled),
body.theme-day button:hover:not(:disabled),
body.theme-classic button:hover:not(:disabled),
body.theme-night button:hover:not(:disabled) {
  background: var(--button-primary-hover);
  filter: none;
}
.btn:active:not(:disabled),
body.theme-day button:active:not(:disabled),
body.theme-classic button:active:not(:disabled),
body.theme-night button:active:not(:disabled) {
  filter: brightness(.96);
}
.btn:focus-visible,
body.theme-day button:focus-visible,
body.theme-classic button:focus-visible,
body.theme-night button:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}
.btn:disabled,
.btn-primary:disabled,
.btn-secondary:disabled,
.btn-danger:disabled,
.btn-ghost:disabled,
body.theme-day button:disabled,
body.theme-classic button:disabled,
body.theme-night button:disabled {
  background: var(--button-disabled-bg) !important;
  color: var(--button-disabled-text) !important;
  border-color: var(--border-soft) !important;
  opacity: 1;
  cursor: not-allowed;
  transform: none;
}
.btn-primary { color: var(--button-primary-text); background: var(--button-primary-bg); border: 1px solid var(--button-primary-border); }
.btn-secondary,
button.secondary,
body.theme-day button.secondary,
body.theme-classic button.secondary,
body.theme-night button.secondary {
  color: var(--button-secondary-text) !important;
  background: var(--button-secondary-bg) !important;
  border: 1px solid var(--button-secondary-border) !important;
  box-shadow: none !important;
}
.btn-secondary:hover:not(:disabled),
button.secondary:hover:not(:disabled),
body.theme-day button.secondary:hover:not(:disabled),
body.theme-classic button.secondary:hover:not(:disabled),
body.theme-night button.secondary:hover:not(:disabled) {
  background: var(--button-secondary-hover) !important;
}
.btn-danger,
button.danger,
body.theme-day button.danger,
body.theme-classic button.danger,
body.theme-night button.danger {
  color: var(--button-danger-text) !important;
  background: var(--button-danger-bg) !important;
  border-color: transparent !important;
}
.btn-ghost {
  color: var(--text-primary);
  background: transparent;
  border: 1px solid var(--border-soft);
  box-shadow: none;
}
.btn-ghost:hover:not(:disabled) {
  background: var(--bg-panel-alt);
}

body.theme-day .legacy-shop-screen button,
body.theme-classic .legacy-shop-screen button,
body.theme-night .legacy-shop-screen button,
body.theme-day .shop-side-button,
body.theme-classic .shop-side-button,
body.theme-night .shop-side-button {
  color: var(--button-primary-text) !important;
  background: var(--button-primary-bg) !important;
  border-color: var(--button-primary-border) !important;
}
body.theme-day .legacy-shop-screen button.secondary,
body.theme-classic .legacy-shop-screen button.secondary,
body.theme-night .legacy-shop-screen button.secondary {
  color: var(--button-secondary-text) !important;
  background: var(--button-secondary-bg) !important;
  border-color: var(--button-secondary-border) !important;
}

.shop-page-header,
.shop-theme-sidebar,
.shop-theme-main,
.shop-inline-message,
.shop-merchant-strip,
.shop-npc-card,
.shop-side-card,
.shop-list-row,
.legacy-shop-notice,
.inventory-note-card {
  color: var(--text-primary);
  background: var(--bg-panel);
  border-color: var(--border-primary);
}
.shop-page-heading h2,
.shop-sidebar-summary h3,
.compact-shop-heading h3,
.shop-npc-header strong,
.legacy-shop-row-main strong,
.legacy-shop-stock-card h3,
.shop-side-card h3,
.shop-mission-summary strong,
.shop-purse strong {
  color: var(--text-primary);
}
.shop-page-heading p,
.shop-category-screen .small,
.shop-category-screen .shop-item-desc,
.shop-merchant-copy p,
.legacy-shop-desc,
.legacy-shop-owned,
.legacy-shop-level,
.shop-mission-summary p,
.shop-mission-progress,
.shop-equipped,
.shop-purse,
.shop-side-body {
  color: var(--text-secondary);
}
.shop-npc-bubble {
  background: var(--bg-card) !important;
  color: var(--text-primary) !important;
  border-color: var(--border-primary) !important;
}
.legacy-shop-stats {
  color: var(--text-primary);
}
.stat-positive { color: var(--stat-positive); font-weight: 700; }
.stat-negative { color: var(--stat-negative); font-weight: 700; }
.shop-side-link-icon { color: var(--text-primary); }

.shop-list-row {
  background: var(--bg-card);
  border-color: var(--border-soft);
}
.shop-category-screen .stat-chip {
  color: var(--text-secondary);
  background: var(--bg-panel-alt);
  border-color: var(--border-soft);
}


@media (hover: none) {
  body.theme-day button:hover:not(:disabled),
  body.theme-classic button:hover:not(:disabled),
  body.theme-night button:hover:not(:disabled) {
    transform: none;
    filter: none;
  }
}

/* Bonus — pilules / étincelles */
.bonus-sheet {
  padding: 16px 18px 22px !important;
  background: var(--bg-panel) !important;
}
.bonus-tabs {
  display: flex;
  gap: 8px;
  margin: 0 0 16px;
  align-items: center;
}
.bonus-screen .bonus-tab {
  min-height: 34px;
  padding: 7px 14px !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--text-muted) !important;
  font-size: 13px;
  font-weight: 650;
  transform: none !important;
  filter: none !important;
}
.bonus-screen .bonus-tab.is-active {
  background: var(--bg-panel-alt) !important;
  color: var(--accent) !important;
}
.bonus-lead {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  margin: 0 0 16px;
  color: var(--text-secondary) !important;
  font-size: 13px;
  line-height: 1.45;
}
.bonus-lead-ico { font-size: 18px; line-height: 1.2; }
.bonus-panel {
  border: 1px solid var(--border-soft);
  border-radius: 10px;
  padding: 16px 18px 14px;
}
.bonus-panel h3 {
  margin: 0 0 14px;
  color: #8a8a8a !important;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .02em;
}
.bonus-offers { display: grid; gap: 11px; margin: 0 0 22px; }
.bonus-offer {
  display: grid;
  grid-template-columns: 18px 92px minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  color: var(--text-primary);
  font-size: 13px;
  cursor: pointer;
}
.bonus-offer input { margin: 0; accent-color: #8a8a8a; }
.bonus-offer-price { font-weight: 700; }
.bonus-offer-gift { color: #3db7c8; font-weight: 600; }
.bonus-paypal {
  display: inline-flex !important;
  align-items: center;
  gap: 10px;
  min-height: 52px;
  margin: 4px 0 16px;
  padding: 6px 10px 6px 12px !important;
  border: 1px solid #cfd3d6 !important;
  border-radius: 4px !important;
  background: #fff !important;
  box-shadow: none !important;
  color: #003087 !important;
  transform: none !important;
  filter: none !important;
  cursor: default;
}
.bonus-paypal-mark {
  font: italic 800 28px/1 Georgia, "Times New Roman", serif;
  letter-spacing: -.04em;
}
.bonus-paypal-mark b { color: #003087; font-style: italic; }
.bonus-paypal-mark i { color: #009cde; font-style: italic; font-weight: 800; }
.bonus-paypal-cart {
  display: grid;
  justify-items: center;
  gap: 2px;
  color: #009cde;
}
.bonus-paypal-cart svg { width: 28px; height: 22px; }
.bonus-paypal-cart small {
  color: #6a6a6a !important;
  font-size: 9px;
  font-weight: 600;
}
.bonus-legal {
  margin: 0;
  color: #9a9a9a !important;
  font-size: 12px;
  line-height: 1.4;
}
.bonus-alchemy {
  margin: -4px 0 14px;
  text-align: center;
  color: #b9a07a !important;
  font-size: 12px;
  font-style: italic;
}
.bonus-holdings {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin-bottom: 16px;
}
.bonus-holdings article {
  display: grid;
  justify-items: center;
  gap: 6px;
  padding: 14px 10px;
  border-radius: 8px;
  background: #f7f1e6;
  color: var(--text-primary);
}
.bonus-holdings small {
  color: #c4b08a !important;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.bonus-holdings strong { font-size: 22px; font-weight: 800; }
.bonus-convert {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) auto minmax(140px, .85fr);
  gap: 14px;
  align-items: center;
  margin-bottom: 16px;
}
.bonus-convert-from label {
  display: block;
  margin-bottom: 8px;
  font-size: 14px;
  font-weight: 700;
  color: var(--text-primary);
}
.bonus-convert-input-row {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 10px;
}
.bonus-convert-input-row input {
  width: 72px;
  min-height: 36px;
  text-align: center;
  border-radius: 6px !important;
}
.bonus-convert-input-row span {
  padding: 8px 10px;
  border-radius: 6px;
  background: #f3ead8;
  color: #8a7b64;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .04em;
}
.bonus-doses { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.bonus-doses > span {
  padding: 6px 8px;
  border-radius: 6px;
  background: #f3ead8;
  color: #8a7b64;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
}
.bonus-screen .bonus-dose {
  min-height: 28px;
  padding: 4px 9px !important;
  border: 1px solid #e4d8c0 !important;
  border-radius: 6px !important;
  background: #fffdf8 !important;
  box-shadow: none !important;
  color: #6d6253 !important;
  font-size: 11px;
  font-weight: 700;
  transform: none !important;
}
.bonus-convert-arrow { color: #c4b08a; font-size: 22px; }
.bonus-convert-to {
  display: grid;
  justify-items: center;
  gap: 4px;
  min-height: 108px;
  padding: 16px 12px;
  border-radius: 8px;
  background: #f7f1e6;
}
.bonus-convert-to small {
  color: #c4b08a !important;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.bonus-convert-to strong { font-size: 28px; }
.bonus-screen .bonus-convert-go {
  display: block;
  width: min(280px, 100%);
  margin: 0 auto;
  min-height: 40px;
  padding: 8px 16px !important;
  border: 1px solid #d8d0c4 !important;
  border-radius: 8px !important;
  background: #fff !important;
  box-shadow: none !important;
  color: #5c5348 !important;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
  transform: none !important;
}
body.theme-night .bonus-screen .bonus-tab.is-active,
body.theme-night .bonus-holdings article,
body.theme-night .bonus-convert-to,
body.theme-night .bonus-convert-input-row span,
body.theme-night .bonus-doses > span {
  background: var(--bg-panel-alt) !important;
}
body.theme-night .bonus-screen .bonus-paypal {
  background: #f7f9fb !important;
}
@media (max-width: 820px) {
  .bonus-convert { grid-template-columns: 1fr; }
  .bonus-convert-arrow { display: none; }
  .bonus-holdings { grid-template-columns: 1fr; }
}

/* Historique des combats */
.history-screen {
  width: min(1080px, calc(100% - 24px));
  margin: 0 auto 40px;
  padding: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
.history-sheet {
  min-height: calc(100vh - 88px);
  padding: 14px 18px 40px;
  background: var(--bg-page);
  color: var(--text-secondary);
}
.history-sheet h2 {
  margin: 0 0 10px;
  color: var(--text-muted) !important;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.history-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 14px;
}
.history-screen .history-filter {
  display: inline-flex !important;
  align-items: center;
  gap: 5px;
  min-height: 26px;
  padding: 3px 11px !important;
  border: 1px solid var(--border-soft) !important;
  border-radius: 999px !important;
  background: var(--bg-panel-alt) !important;
  box-shadow: none !important;
  color: var(--text-secondary) !important;
  font-size: 12px;
  font-weight: 600;
  transform: none !important;
  filter: none !important;
}
.history-screen .history-filter.is-active {
  background: var(--button-secondary-hover) !important;
  border-color: var(--border-primary) !important;
  color: var(--info) !important;
}
.history-empty {
  margin: 64px 0 24px;
  text-align: center;
  color: var(--text-muted) !important;
  font-size: 14px;
  font-style: italic;
}
.history-layout {
  display: grid;
  grid-template-columns: minmax(300px, 1fr) minmax(300px, 1fr);
  gap: 18px;
  align-items: start;
}
.history-feed {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.history-screen button.history-card {
  display: grid !important;
  grid-template-columns: 22px 70px minmax(0, 1fr) 88px;
  align-items: center;
  gap: 10px;
  width: 100%;
  min-height: 86px;
  margin: 0;
  padding: 8px 12px !important;
  border: 1px solid var(--border-soft) !important;
  border-left: 4px solid var(--text-muted) !important;
  border-radius: 8px !important;
  background: var(--bg-card) !important;
  box-shadow: none !important;
  color: var(--text-primary) !important;
  text-align: left;
  cursor: pointer;
  transform: none !important;
  filter: none !important;
  transition: background .15s, box-shadow .15s, transform .15s, filter .15s !important;
}
.history-screen button.history-card.is-win {
  border-left-color: var(--success) !important;
  background: color-mix(in srgb, var(--success) 12%, var(--bg-card)) !important;
}
.history-screen button.history-card.is-loss {
  border-left-color: var(--danger) !important;
  background: color-mix(in srgb, var(--danger) 12%, var(--bg-card)) !important;
}
.history-screen button.history-card.is-flee {
  border-left-color: var(--text-muted) !important;
  background: color-mix(in srgb, var(--text-muted) 12%, var(--bg-card)) !important;
}
.history-screen button.history-card:hover:not(:disabled),
.history-screen button.history-card:focus-visible {
  background: var(--bg-panel-alt) !important;
  box-shadow: var(--nr-shadow) !important;
  transform: translateX(6px) !important;
  filter: none !important;
}
.history-screen button.history-card.is-win:hover:not(:disabled) {
  background: color-mix(in srgb, var(--success) 22%, var(--bg-card)) !important;
}
.history-screen button.history-card.is-loss:hover:not(:disabled) {
  background: color-mix(in srgb, var(--danger) 22%, var(--bg-card)) !important;
}
.history-screen button.history-card.is-flee:hover:not(:disabled) {
  background: color-mix(in srgb, var(--text-muted) 22%, var(--bg-card)) !important;
}
.history-screen button.history-card:active:not(:disabled),
.history-screen button.history-card.is-active:active:not(:disabled) {
  transform: translateX(6px) !important;
  filter: none !important;
  box-shadow: 0 2px 8px rgba(0,0,0,.08) !important;
}
.history-screen button.history-card.is-active,
.history-screen button.history-card.is-active:hover:not(:disabled),
.history-screen button.history-card.is-active:focus-visible {
  position: relative;
  z-index: 2;
  transform: translateX(6px) !important;
  filter: none !important;
}
.history-screen button.history-card.is-active.is-win {
  background: color-mix(in srgb, var(--success) 28%, var(--bg-card)) !important;
  box-shadow: var(--nr-shadow) !important;
}
.history-screen button.history-card.is-active.is-loss {
  background: color-mix(in srgb, var(--danger) 28%, var(--bg-card)) !important;
  box-shadow: var(--nr-shadow) !important;
}
.history-screen button.history-card.is-active.is-flee {
  background: color-mix(in srgb, var(--text-muted) 28%, var(--bg-card)) !important;
  box-shadow: var(--nr-shadow) !important;
}
.history-mark {
  display: grid;
  place-items: center;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  font-size: 11px;
  font-weight: 800;
}
.history-card.is-win .history-mark { color: var(--success); background: color-mix(in srgb, var(--success) 18%, var(--bg-card)); }
.history-card.is-loss .history-mark,
.history-card.is-flee .history-mark { color: var(--warning); background: color-mix(in srgb, var(--warning) 18%, var(--bg-card)); }
.history-sprite,
.history-screen .oc-monster-gif.history-sprite {
  width: 70px;
  height: 74px;
  object-fit: cover;
  object-position: center top;
  border-radius: 6px;
  background: transparent;
  image-rendering: pixelated;
}
.history-sprite.fallback,
.history-sprite.ninja {
  display: grid;
  place-items: center;
  background: var(--bg-panel-alt);
  font-size: 22px;
  overflow: hidden;
}
.history-sprite.ninja .ninja-portrait { transform: scale(.62); transform-origin: center; }
.history-copy { min-width: 0; }
.history-copy strong {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  color: var(--text-primary) !important;
}
.history-copy small {
  display: block;
  margin-top: 2px;
  color: var(--text-muted) !important;
  font-size: 12px;
}
.history-kind {
  padding: 1px 5px;
  border-radius: 4px;
  font-size: 10px;
  font-style: normal;
  font-weight: 800;
}
.history-kind.pve { background: color-mix(in srgb, var(--success) 18%, var(--bg-card)); color: var(--success); }
.history-kind.pvp { background: color-mix(in srgb, var(--info) 18%, var(--bg-card)); color: var(--info); }
.history-meta {
  display: grid;
  justify-items: end;
  gap: 2px;
  color: var(--text-muted);
  font-size: 11px;
}
.history-meta b { color: var(--success); font-size: 12px; }
.history-detail {
  background: var(--bg-card);
  border: 1px solid var(--border-soft);
  border-radius: 12px;
  overflow: hidden;
  box-shadow: var(--nr-shadow);
  display: flex;
  flex-direction: column;
}
.history-detail-head {
  padding: 20px 24px;
  background: var(--bg-panel-alt);
  border-bottom: 1px solid var(--border-soft);
  color: var(--text-secondary);
  text-align: center;
}
.history-detail-head .outcome-title {
  font-size: 20px;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
}
.history-detail-head.outcome-win {
  background: color-mix(in srgb, var(--success) 16%, var(--bg-panel-alt));
}
.history-detail-head.outcome-lose {
  background: color-mix(in srgb, var(--danger) 16%, var(--bg-panel-alt));
}
.history-detail-head.outcome-flee {
  background: var(--bg-panel-alt);
}
.history-detail-head.outcome-win .outcome-title { color: var(--success); }
.history-detail-head.outcome-lose .outcome-title { color: var(--danger); }
.history-detail-head.outcome-flee .outcome-title { color: var(--text-muted); }
.history-highlights {
  padding: 12px 24px;
  display: flex;
  justify-content: center;
  border-bottom: 1px solid var(--border-soft);
}
.history-highlight {
  font-size: 12px;
  color: var(--text-secondary);
}
.history-highlight.is-kill,
.history-highlight.is-kill strong { color: var(--danger); }
.history-highlight.is-hit,
.history-highlight.is-hit strong { color: var(--warning); }
.history-detail-rounds {
  padding: 0 24px 12px;
  display: flex;
  flex-direction: column;
  gap: 1px;
}
.history-detail-empty {
  margin: 18px 0;
  text-align: center;
  color: var(--text-muted) !important;
  font-style: italic;
}
.history-round {
  display: grid;
  grid-template-columns: 1fr 36px 1fr;
  align-items: center;
  gap: 8px;
  padding: 6px 0;
  position: relative;
  font-size: 11px;
}
.history-round:nth-child(odd) { background: var(--bg-panel-alt); }
.history-round .hr-time {
  position: absolute;
  right: 4px;
  bottom: 2px;
  font-size: 9px;
  color: var(--text-muted);
}
.history-round .hr-num {
  width: 28px;
  height: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto;
  border-radius: 50%;
  background: var(--bg-panel-alt);
  color: var(--text-secondary);
  font-size: 11px;
  font-weight: 700;
}
.history-round .hr-side {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.history-round .hr-side.player { align-items: flex-end; text-align: right; }
.history-round .hr-side.enemy { align-items: flex-start; text-align: left; }
.history-round .hr-act { font-size: 11px; color: var(--text-secondary); }
.history-round .hr-act.action-attack { color: var(--danger); }
.history-round .hr-act.action-parry { color: var(--info); }
.history-round .hr-act.action-dodge { color: var(--accent); }
.history-round .hr-act.action-escape { color: var(--accent); }
.history-round .hr-act.action-heal { color: var(--success); }
.history-round .hr-act.action-special { color: var(--warning); }
.history-round .hr-dmg { font-weight: 700; font-size: 13px; color: var(--danger); }
.history-round .hr-dmg.miss { color: var(--text-muted); font-weight: 400; font-size: 11px; }
.history-total {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  gap: 16px;
  align-items: center;
  margin-top: 8px;
  padding: 12px 20px;
  border-top: 2px solid var(--border-soft);
  border-radius: 6px;
  background: var(--bg-panel-alt);
  font-size: 18px;
  font-weight: 700;
  color: var(--text-primary);
}
.history-total span {
  color: var(--text-muted);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 1px;
  text-align: center;
}
.history-total b:last-child { text-align: right; }
.history-rewards {
  margin: 0;
  padding: 12px 16px;
  background: var(--bg-panel-alt);
  border-top: 1px solid var(--border-soft);
}
.history-rewards-title {
  display: block;
  margin-bottom: 8px;
  text-align: center;
  color: var(--text-secondary);
  font-size: 12px;
  font-weight: 600;
}
.history-reward-list {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 6px;
}
.history-reward {
  min-width: 88px;
  padding: 6px 10px;
  background: var(--bg-card);
  border: 1px solid var(--border-soft);
  border-radius: 6px;
  text-align: center;
  box-shadow: var(--nr-shadow);
}
.history-reward .title {
  margin-bottom: 2px;
  color: var(--text-muted);
  font-size: 9px;
}
.history-reward > span {
  display: block;
  font-size: 12px;
  font-weight: 600;
  color: var(--text-primary);
}
.history-reward .orange { color: var(--warning); }
.history-reward .jaune { color: var(--accent); }
.history-reward .marron { color: var(--text-secondary); }
.history-reward .violet { color: var(--info); }
.history-detail-actions {
  display: flex;
  gap: 12px;
  padding: 16px 24px 24px;
}
.history-screen .history-replay,
.history-screen .history-share {
  flex: 1;
  min-height: 36px;
  padding: 8px 10px !important;
  border: 1px solid var(--button-secondary-border) !important;
  border-radius: 8px !important;
  background: var(--button-secondary-bg) !important;
  box-shadow: none !important;
  color: var(--button-secondary-text) !important;
  font-size: 12px;
  font-weight: 700;
  transform: none !important;
}
.history-extra {
  position: relative;
  flex: 0 0 40px;
}
.history-screen .history-more {
  width: 40px;
  min-height: 36px;
  padding: 0 !important;
  border: 1px solid var(--border-soft) !important;
  border-radius: 8px !important;
  background: var(--bg-panel-alt) !important;
  box-shadow: none !important;
  color: var(--text-secondary) !important;
  font-size: 18px;
  line-height: 1;
  transform: none !important;
  filter: none !important;
}
.history-screen .history-more:hover:not(:disabled) {
  background: var(--button-secondary-hover) !important;
  transform: none !important;
  filter: none !important;
}
.history-extra-menu {
  position: absolute;
  right: 0;
  bottom: calc(100% + 6px);
  min-width: 210px;
  padding: 6px 0;
  background: var(--bg-card);
  border: 1px solid var(--border-soft);
  border-radius: 10px;
  box-shadow: var(--nr-shadow);
  z-index: 8;
}
.history-extra-menu button {
  display: flex !important;
  width: 100%;
  margin: 0;
  padding: 10px 14px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--text-primary) !important;
  font-size: 13px;
  text-align: left;
  transform: none !important;
  filter: none !important;
}
.history-extra-menu button:hover:not(:disabled) {
  background: var(--bg-panel-alt) !important;
  transform: none !important;
  filter: none !important;
}
.history-extra-menu button.is-report { color: var(--danger) !important; }
@media (max-width: 820px) {
  .history-layout { grid-template-columns: 1fr; }
}

.messages-screen {
  width: min(1180px, calc(100% - 24px));
  margin: 0 auto 40px;
  padding: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
.messages-main { min-width: 0; }
.mail-flash {
  margin: 0 0 8px;
  padding: 10px 14px;
  background: color-mix(in srgb, var(--warning) 18%, var(--bg-panel));
  border: 1px solid var(--border-primary);
  border-radius: 6px;
  color: var(--text-primary);
  font-size: 13px;
}
.messages-sheet {
  background: var(--bg-panel);
  border: 1px solid var(--border-primary);
  border-radius: 8px;
  overflow: hidden;
  min-height: 280px;
  box-shadow: var(--nr-shadow);
}
.mail-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 2px;
  padding: 10px 12px 8px;
  background: var(--bg-card);
  border-bottom: 1px solid var(--border-soft);
}
.messages-screen .mail-tab {
  min-height: 26px;
  padding: 4px 10px !important;
  border: 0 !important;
  border-radius: 4px !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--text-muted) !important;
  font-size: 13px;
  font-weight: 600;
  transform: none !important;
  filter: none !important;
}
.messages-screen .mail-tab.is-active {
  background: var(--bg-panel-alt) !important;
  color: var(--text-primary) !important;
}
.messages-screen .mail-tab.is-icon {
  min-width: 32px;
  padding: 4px 8px !important;
}
.mail-list { display: grid; }
.messages-screen .mail-row {
  display: grid !important;
  grid-template-columns: 22px minmax(0, 1.6fr) 140px 132px 22px;
  align-items: center;
  gap: 8px;
  width: 100%;
  margin: 0;
  padding: 8px 12px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--text-primary) !important;
  text-align: left;
  transform: none !important;
  filter: none !important;
}
.messages-screen .mail-row:nth-child(even) { background: var(--bg-panel-alt) !important; }
.messages-screen .mail-row.is-active,
.messages-screen .mail-row:hover:not(:disabled) {
  background: color-mix(in srgb, var(--accent) 16%, var(--bg-card)) !important;
  transform: none !important;
  filter: none !important;
}
.mail-ico { color: var(--accent); font-size: 13px; }
.mail-subject {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 13px;
}
.mail-place, .mail-date {
  color: var(--text-secondary);
  font-size: 12px;
  white-space: nowrap;
}
.messages-screen .mail-del {
  color: var(--danger);
  font-size: 14px;
  font-weight: 800;
  cursor: pointer;
}
.mail-empty,
.mail-empty-note {
  margin: 28px 16px;
  text-align: center;
  color: var(--text-muted);
  font-size: 13px;
}
.mail-compose { padding: 14px 18px 18px; }
.mail-compose-row {
  display: grid;
  grid-template-columns: 84px minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  margin-bottom: 10px;
}
.mail-compose-row label { color: var(--text-secondary); font-size: 13px; }
.mail-compose-row input[type="text"],
.mail-compose-body textarea {
  width: 100%;
  border: 1px solid var(--border-primary);
  border-radius: 3px;
  background: var(--bg-input);
  color: var(--text-primary);
  font: inherit;
  padding: 6px 8px;
}
.mail-compose-body {
  align-items: start;
}
.mail-compose-body textarea {
  min-height: 180px;
  resize: vertical;
}
.mail-team {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  white-space: nowrap;
  font-size: 12px !important;
  color: var(--text-secondary);
}
.mail-privacy {
  margin: 8px 0 12px;
  text-align: center;
  color: var(--text-muted);
  font-size: 12px;
  font-style: italic;
}
.mail-compose-actions { text-align: center; }
.messages-screen .mail-compose-actions button {
  min-height: 32px;
  padding: 6px 18px !important;
  border: 1px solid var(--button-secondary-border) !important;
  border-radius: 5px !important;
  background: var(--button-secondary-bg) !important;
  box-shadow: none !important;
  color: var(--button-secondary-text) !important;
  transform: none !important;
}
@media (max-width: 900px) {
  .messages-screen .mail-row {
    grid-template-columns: 22px minmax(0, 1fr) 22px;
  }
  .mail-place, .mail-date { display: none; }
  .mail-compose-row { grid-template-columns: 1fr; }
}

/* Shinobi hamburger — tokens officiels, au-dessus des anciens overrides crème */
body.theme-day .game-account-dropdown,
body.theme-classic .game-account-dropdown,
body.theme-night .game-account-dropdown,
body.theme-day .game-header .game-account-dropdown,
body.theme-classic .game-header .game-account-dropdown,
body.theme-night .game-header .game-account-dropdown {
  background: var(--dropdown-bg) !important;
  border: 1px solid var(--dropdown-divider) !important;
  box-shadow: 0 4px 6px rgba(0,0,0,.18) !important;
  color: var(--dropdown-text) !important;
}
body.theme-day .game-account-dropdown .game-menu-item,
body.theme-classic .game-account-dropdown .game-menu-item,
body.theme-night .game-account-dropdown .game-menu-item,
body.theme-day .game-header .game-account-dropdown button,
body.theme-classic .game-header .game-account-dropdown button,
body.theme-night .game-header .game-account-dropdown button {
  background: transparent !important;
  color: var(--dropdown-text) !important;
  box-shadow: none !important;
  transform: none !important;
  filter: none !important;
}
body.theme-day .game-account-dropdown .game-menu-item:hover:not(:disabled),
body.theme-classic .game-account-dropdown .game-menu-item:hover:not(:disabled),
body.theme-night .game-account-dropdown .game-menu-item:hover:not(:disabled),
body.theme-day .game-header .game-account-dropdown button:hover,
body.theme-classic .game-header .game-account-dropdown button:hover,
body.theme-night .game-header .game-account-dropdown button:hover {
  background: var(--dropdown-hover-bg) !important;
  color: var(--dropdown-hover-text) !important;
}
body.theme-day .game-account-dropdown .game-menu-ico,
body.theme-classic .game-account-dropdown .game-menu-ico,
body.theme-night .game-account-dropdown .game-menu-ico {
  color: var(--dropdown-icon) !important;
  opacity: 1;
}

.account-hub-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 14px;
}
.account-hub-table th,
.account-hub-table td {
  padding: 10px 12px;
  border-bottom: 1px solid var(--border-soft);
  text-align: left;
  color: var(--text-primary);
}
.account-hub-table th { color: var(--text-muted); font-weight: 700; font-size: 12px; }
.account-hub-table tr.is-me td { color: var(--accent, var(--dropdown-icon)); font-weight: 700; }
.account-hub-stat {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 8px;
  padding: 10px 0;
  border-bottom: 1px solid var(--border-soft);
  color: var(--text-primary);
}
.account-hub-stat small { color: var(--text-muted); }
.account-hub-copy {
  display: flex;
  gap: 8px;
  align-items: center;
  margin: 10px 0 16px;
}
.account-hub-copy code {
  padding: 8px 12px;
  border: 1px solid var(--border-soft);
  border-radius: 6px;
  background: var(--bg-panel-alt, var(--bg-card));
  color: var(--text-primary);
  font-weight: 800;
  letter-spacing: .08em;
}
.account-hub-note { color: var(--text-muted); font-size: 13px; line-height: 1.5; }
.account-hub-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.inventory-screen textarea {
  width: 100%;
  min-height: 140px;
  margin: 8px 0;
  padding: 10px 12px;
  border: 1px solid var(--border-soft);
  border-radius: 6px;
  background: var(--bg-panel-alt, var(--bg-card));
  color: var(--text-primary);
  box-shadow: none;
}

.account-manage-main {
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.coming-soon-card {
  display: grid;
  justify-items: center;
  gap: 8px;
  padding: 36px 18px;
  border: 1px dashed var(--border-soft);
  border-radius: 10px;
  background: var(--bg-panel-alt, var(--bg-card));
  color: var(--text-primary);
  opacity: .7;
  pointer-events: none;
  text-align: center;
}
.coming-soon-card small {
  color: var(--text-muted);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.account-sheet {
  background: var(--bg-card);
  border: 1px solid var(--border-soft);
  border-radius: 10px;
  padding: 14px 18px 8px;
  color: var(--text-primary);
  box-shadow: var(--nr-shadow, none);
}
.account-sheet h2 {
  margin: 0 0 6px;
  color: var(--text-primary);
  font-size: 15px;
  font-weight: 700;
}
.account-row {
  display: grid;
  grid-template-columns: 150px minmax(0, 1fr) auto;
  gap: 6px 14px;
  align-items: center;
  padding: 11px 0;
  border-top: 1px solid var(--border-soft);
  font-size: 13px;
}
.account-row > span:first-child { color: var(--text-muted); }
.account-row strong { font-weight: 700; }
.account-muted,
.account-hint,
.account-lead {
  margin: 0 0 10px;
  color: var(--text-muted);
  font-size: 12px;
  line-height: 1.45;
}
.account-row-actions { display: flex; align-items: center; justify-content: flex-end; gap: 10px; }
.account-mail-actions { flex-direction: column; align-items: flex-end; gap: 4px; }
.account-link {
  display: inline !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--dropdown-icon, #c9a24d) !important;
  font-size: 13px;
  font-weight: 700;
  transform: none !important;
  filter: none !important;
}
.account-flag.is-on { color: var(--dropdown-icon, #c9a24d); font-weight: 700; }
.account-flag.is-off { color: var(--text-muted); }
.account-info { color: var(--text-muted); cursor: help; }
.account-exp-row {
  grid-template-columns: 150px minmax(190px, max-content) minmax(0, 1fr);
  align-items: center;
}
.account-exp-row small {
  color: var(--text-muted);
  font-size: 12px;
  line-height: 1.4;
}
.account-exp-toggle {
  display: inline-flex !important;
  align-items: center;
  gap: 10px;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: inherit !important;
  transform: none !important;
  filter: none !important;
  text-align: left;
}
.account-exp-toggle em {
  color: var(--text-muted);
  font-size: 12px;
  font-style: italic;
  font-weight: 600;
}
.account-exp-ico { color: var(--dropdown-icon, #c9a24d); font-style: normal; }
.account-sheet input {
  max-width: 220px;
  margin: 0 8px 0 0;
  padding: 6px 8px;
  border: 1px solid var(--border-soft);
  border-radius: 6px;
  background: var(--bg-panel-alt, var(--bg-card));
  color: var(--text-primary);
}