:root {
  color-scheme:dark;
  --bg:#07070c;
  --panel:#111019;
  --panel-2:#181321;
  --ink:#f5f0ff;
  --muted:#bcb1ca;
  --green:#83ff55;
  --purple:#a34cff;
  --line:#3a2850;
  --gold:#ffd76a;
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body {
  margin:0;
  overflow-x:hidden;
  color:var(--ink);
  font-family:Inter,Segoe UI,Arial,sans-serif;
  line-height:1.55;
  background:
    radial-gradient(circle at 50% -15%,rgba(116,47,175,.28),transparent 36rem),
    linear-gradient(#09080f,#050509 55%,#08060c);
}
a { color:#8bddff; }
img { display:block;max-width:100%; }
.shell { width:min(1180px,calc(100% - 28px));margin:auto; }
.site-nav {
  position:sticky;top:0;z-index:40;
  border-bottom:1px solid #50356e;
  background:rgba(7,7,12,.92);
  backdrop-filter:blur(14px);
}
.nav-inner {
  min-height:58px;display:flex;align-items:center;justify-content:space-between;gap:16px;
}
.brand {
  color:var(--green);font:900 clamp(18px,3vw,25px)/1 Georgia,serif;
  text-decoration:none;text-shadow:0 0 14px rgba(101,255,63,.48);
}
.nav-links { display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end; }
.nav-links a {
  color:#e8dcf3;text-decoration:none;font-weight:800;font-size:13px;
  padding:8px 11px;border:1px solid #42304f;border-radius:8px;background:#120f18;
}
.nav-links a.active,.nav-links a:hover { color:#fff;border-color:var(--purple);background:#251634; }
.hero {
  padding:clamp(48px,8vw,94px) 0 44px;text-align:center;
}
.eyebrow {
  color:#d69cff;text-transform:uppercase;letter-spacing:.18em;
  font-weight:900;font-size:12px;
}
h1,h2,h3 { font-family:Georgia,serif;line-height:1.08; }
h1 {
  margin:10px 0 13px;color:var(--green);
  font-size:clamp(42px,8vw,78px);text-shadow:0 0 20px rgba(100,255,61,.34);
}
.hero p { max-width:760px;margin:0 auto;color:#d0c4da;font-size:clamp(16px,2vw,20px); }
.button-row { display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin-top:26px; }
.button {
  display:inline-flex;align-items:center;justify-content:center;min-height:44px;
  padding:10px 17px;border:1px solid #7550a0;border-radius:9px;
  color:#fff;background:linear-gradient(180deg,#39204d,#21142e);
  text-decoration:none;font-weight:900;
}
.button.primary { border-color:#78dc51;background:linear-gradient(180deg,#3e772b,#254a1b); }
main section { margin:0 0 42px;scroll-margin-top:75px; }
.section-heading { margin-bottom:18px; }
.section-heading h2 { margin:0 0 6px;font-size:clamp(28px,5vw,43px);color:#fff; }
.section-heading p { margin:0;color:var(--muted);max-width:820px; }
.panel {
  border:1px solid var(--line);border-radius:14px;
  background:linear-gradient(145deg,rgba(25,20,34,.96),rgba(12,11,17,.98));
  box-shadow:0 16px 45px rgba(0,0,0,.42);
}
.steps { display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px; }
.step { padding:18px; }
.step-number {
  display:grid;place-items:center;width:34px;height:34px;margin-bottom:12px;
  border:1px solid #9d62d3;border-radius:50%;color:#fff;background:#38204f;font-weight:1000;
}
.step h3 { margin:0 0 7px;color:#fff;font-size:20px; }
.step p { margin:0;color:var(--muted);font-size:14px; }
code,.command {
  color:#fff6bc;background:#191322;border:1px solid #533768;border-radius:6px;
  font-family:Consolas,monospace;font-weight:800;
}
code { padding:2px 6px;white-space:nowrap; }
.command { display:inline-block;margin-top:10px;padding:6px 9px; }
.class-grid { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px; }
.class-card {
  --class:#eee;position:relative;display:flex;flex-direction:column;overflow:hidden;min-height:410px;
  border:1px solid color-mix(in srgb,var(--class) 62%,#332840);
  border-radius:14px;background:linear-gradient(150deg,color-mix(in srgb,var(--class) 10%,#17111d),#09090e 70%);
  box-shadow:0 14px 36px #000;
}
.class-card .portrait {
  height:230px;display:flex;align-items:flex-end;justify-content:center;overflow:hidden;
  background:radial-gradient(ellipse at 50% 80%,color-mix(in srgb,var(--class) 30%,transparent),transparent 66%);
}
.class-card .portrait img { width:100%;height:100%;object-fit:contain;object-position:center bottom; }
.class-copy { flex:1;display:flex;flex-direction:column;padding:16px; }
.class-role { margin-bottom:10px;color:var(--class);font-weight:1000;text-transform:uppercase;letter-spacing:.11em;font-size:11px;line-height:1.4; }
.class-card h3 { margin:0 0 4px;font-size:25px; }
.class-card p { margin:0 0 12px;color:#c9bed1;font-size:14px;line-height:1.55; }
.class-card .command { align-self:flex-start;margin-top:auto;color:var(--class);border-color:color-mix(in srgb,var(--class) 55%,#332840); }
.ironbreaker { --class:#77dfff; }.monk { --class:#ffc95f; }.ninja { --class:#bd77ff; }
.cleric { --class:#fff19a; }.bard { --class:#ff81d3; }.ranger { --class:#75e78b; }
.berserker { --class:#ff665f; }.elementalist { --class:#52d8ff; }.blademaster { --class:#9eb2ff; }
.info-grid { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px; }
.info-card { padding:20px; }
.info-card h3 { margin:0 0 8px;color:var(--gold);font-size:23px; }
.info-card p,.info-card li { color:var(--muted); }
.info-card ul { margin:10px 0 0;padding-left:20px; }
.gender-panel {
  display:grid;grid-template-columns:1.1fr .9fr;gap:22px;align-items:center;padding:24px;
  border-color:#a848aa;background:
    radial-gradient(circle at 80% 40%,rgba(213,74,203,.17),transparent 40%),
    linear-gradient(145deg,#211327,#0d0b12);
}
.gender-art { display:grid;grid-template-columns:1fr 1fr;gap:8px;height:290px;overflow:hidden; }
.gender-art img { width:100%;height:100%;object-fit:contain;object-position:center bottom; }
.gender-panel h2 { margin:0 0 8px;font-size:clamp(29px,5vw,43px); }
.gender-panel p { color:#d3c6dc; }
.notice {
  padding:14px 16px;border-left:4px solid var(--green);border-radius:7px;
  color:#ddfbd4;background:#11200f;
}
.command-table { width:100%;border-collapse:collapse;overflow:hidden; }
.command-table th,.command-table td { padding:13px 14px;border-bottom:1px solid #33263e;text-align:left; }
.command-table th { color:#fff;background:#21162c; }
.command-table td { color:#cfc3d8; }
.command-table tr:last-child td { border-bottom:0; }
.doc-intro { padding:22px;margin-bottom:25px; }
.doc-intro p { margin:0;color:#d1c4da; }
.hero-doc-grid { display:grid;gap:22px; }
.hero-doc {
  --class:#eee;overflow:hidden;
  border:1px solid color-mix(in srgb,var(--class) 58%,#372642);
  border-radius:16px;background:linear-gradient(145deg,color-mix(in srgb,var(--class) 8%,#17121d),#09090e 72%);
  box-shadow:0 18px 48px #000;
}
.hero-doc-head {
  display:grid;grid-template-columns:minmax(430px,46%) minmax(0,1fr);min-height:380px;
}
.hero-doc-portrait {
  position:relative;display:flex;align-items:flex-end;justify-content:center;
  overflow:hidden;padding:8px 8px 0;
  background:radial-gradient(ellipse at 50% 80%,color-mix(in srgb,var(--class) 30%,transparent),transparent 68%);
}
.hero-doc-portrait img {
  width:54%;height:100%;min-width:0;flex:0 0 54%;
  object-fit:contain;object-position:center bottom;
  filter:drop-shadow(0 10px 10px rgba(0,0,0,.58));
}
.hero-doc-portrait img + img { margin-left:-8%; }
/* Each approved hero has a different source canvas and silhouette. Keep the
   male/female artwork aligned by visible character height instead of applying
   one class-wide scale to both files. */
.hero-doc.ironbreaker .hero-doc-portrait img:first-child { transform:scale(1.56); }
.hero-doc.ironbreaker .hero-doc-portrait img:last-child { transform:scale(1.48); }
.hero-doc.monk .hero-doc-portrait img:first-child { transform:scale(1.34); }
.hero-doc.monk .hero-doc-portrait img:last-child { transform:scale(1.44); }
.hero-doc.cleric .hero-doc-portrait img:first-child { transform:translateY(20px) scale(.82); }
.hero-doc.cleric .hero-doc-portrait img:last-child { transform:translateY(20px) scale(.82); }
.hero-doc.bard .hero-doc-portrait img:first-child { transform:scale(.94); }
.hero-doc.bard .hero-doc-portrait img:last-child { transform:scale(.95); }
.hero-doc.berserker .hero-doc-portrait img:first-child { transform:translateX(2%) scale(1.52); }
.hero-doc.berserker .hero-doc-portrait img:last-child { transform:scale(.87); }
.hero-doc.blademaster .hero-doc-portrait img:first-child { transform:translateX(4%) scale(1.45); }
.hero-doc.blademaster .hero-doc-portrait img:last-child { transform:translateX(4%) scale(1.55); }
.hero-doc.ironbreaker .hero-doc-portrait img,
.hero-doc.monk .hero-doc-portrait img,
.hero-doc.cleric .hero-doc-portrait img,
.hero-doc.bard .hero-doc-portrait img,
.hero-doc.berserker .hero-doc-portrait img,
.hero-doc.blademaster .hero-doc-portrait img {
  transform-origin:center bottom;
}
.hero-doc-summary { min-width:0;padding:clamp(22px,3vw,34px);align-self:center; }
.hero-doc-summary .class-role { color:var(--class); }
.hero-doc-summary h2 { margin:4px 0 12px;color:#fff;font-size:clamp(34px,6vw,55px); }
.hero-doc-summary p { margin:0;color:#d3c8da;font-size:16px; }
.hero-doc-body {
  display:grid;grid-template-columns:1fr 1fr;gap:18px;padding:0 clamp(20px,4vw,38px) 30px;
}
.doc-box { padding:17px;border:1px solid #35283f;border-radius:11px;background:rgba(7,7,11,.58); }
.doc-box h3 { margin:0 0 9px;color:var(--class);font-size:20px; }
.doc-box p,.doc-box li { margin-top:0;color:#c9bed1;font-size:14px; }
.doc-box ul { margin:0;padding-left:19px; }
.skills { grid-column:1/-1; }
.skill-list { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 18px; }
.skill { padding:9px 0;border-bottom:1px solid #2d2335;color:#cfc3d8;font-size:14px; }
.skill strong { color:#fff; }.level { color:var(--gold);font-weight:900; }
.stance-pills { display:flex;gap:9px;flex-wrap:wrap;margin-top:10px; }
.stance-pill { padding:7px 9px;border-radius:7px;background:#181221;border:1px solid #49345c;color:#d7c8e1;font-size:13px; }
footer { padding:30px 0 48px;text-align:center;color:#8e8198;font-size:13px; }
@media (max-width:900px) {
  .steps,.class-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .hero-doc-head { grid-template-columns:minmax(340px,48%) minmax(0,1fr);min-height:350px; }
  .hero-doc-summary { padding:22px; }
}
@media (max-width:650px) {
  .shell { width:min(100% - 18px,1180px); }
  .nav-inner { flex-direction:column;align-items:center;padding:10px 0; }
  .brand { padding-top:2px; }
  .nav-links { display:grid;width:100%;max-width:100%;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px; }
  .nav-links a { min-width:0;padding:7px 5px;text-align:center;font-size:10px;overflow-wrap:anywhere; }
  .hero { padding-top:43px; }
  .hero p,.doc-intro p,.section-heading p,.reference-notes p,.dungeon-row p { overflow-wrap:anywhere; }
  .hero .button-row { width:100%;flex-direction:column;align-items:stretch; }
  .hero .button { width:100%;white-space:normal; }
  .steps,.class-grid,.info-grid,.gender-panel,.hero-doc-body { grid-template-columns:1fr; }
  .class-card { min-height:0; }
  .class-card .portrait { height:285px; }
  .gender-art { order:-1;height:250px; }
  .hero-doc-head { grid-template-columns:1fr; }
  .hero-doc-portrait { height:350px;padding-inline:4px; }
  .hero-doc-portrait img { width:53%;flex-basis:53%; }
  .hero-doc-portrait img + img { margin-left:-6%; }
  .hero-doc-summary { padding-top:12px; }
  .skills { grid-column:auto; }
  .skill-list { grid-template-columns:1fr; }
  .command-table { display:block;overflow-x:auto;white-space:nowrap; }
}
.credits-section {
  margin-top: 42px;
}

.credits-section .section-heading {
  text-align: center;
}

.credit-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.credit-card {
  position: relative;
  display: flex;
  align-items: center;
  gap: 18px;
  overflow: hidden;
  padding: 16px 20px 16px 16px;
  text-align: left;
  border: 1px solid rgba(153, 88, 255, 0.55);
  background:
    radial-gradient(circle at 50% 0%, rgba(105, 255, 92, 0.12), transparent 55%),
    rgba(8, 8, 15, 0.92);
}

.credit-avatar {
  position: relative;
  z-index: 1;
  width: clamp(82px, 9vw, 118px);
  aspect-ratio: 1;
  flex: 0 0 auto;
  border: 2px solid rgba(105, 255, 92, 0.72);
  border-radius: 12px;
  object-fit: cover;
  box-shadow: 0 8px 22px rgba(0,0,0,.55), 0 0 18px rgba(105,255,92,.2);
}

.credit-copy {
  position: relative;
  z-index: 1;
  min-width: 0;
}

.credit-card::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  box-shadow: inset 0 0 28px rgba(126, 51, 255, 0.1);
}

.credit-role {
  margin-bottom: 7px;
  color: var(--green);
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

.credit-name {
  margin: 0;
  color: #fff;
  font-size: clamp(1.35rem, 3vw, 2rem);
}

@media (max-width: 620px) {
  .credit-grid {
    grid-template-columns: 1fr;
  }

  .credit-card {
    padding: 14px;
  }

  .credit-avatar {
    width: 84px;
  }
}

/* Data-driven field manual ------------------------------------------------ */
.combat-reference { margin: 0 0 34px;scroll-margin-top:76px; }
.combat-reference > .section-heading { text-align:center; }
.combat-reference > .section-heading p { margin-inline:auto; }
.reference-grid { display:grid;grid-template-columns:minmax(0,.86fr) minmax(0,1.14fr);gap:18px;align-items:start; }
.reference-panel { min-width:0;padding:20px; }
.reference-heading { display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:16px; }
.reference-heading h3 { margin:4px 0 0;color:#fff;font-size:25px; }
.live-chip { flex:none;padding:5px 8px;border:1px solid #4c8a3d;border-radius:999px;color:#baff9e;background:#10200d;font-size:10px;font-weight:1000;letter-spacing:.12em;text-transform:uppercase; }
.table-scroll { max-width:100%;overflow-x:auto;border:1px solid #35273e;border-radius:10px; }
.deep-table { width:100%;border-collapse:collapse;min-width:540px;background:rgba(5,5,9,.58);font-size:13px; }
.deep-table th,.deep-table td { padding:10px 12px;border-bottom:1px solid #30243a;text-align:left;white-space:nowrap; }
.deep-table thead th { color:#fff;background:#21172a; }
.deep-table tbody th { color:#fff; }
.deep-table td { color:#cfc3d8; }
.deep-table td small { color:#9f91aa; }
.deep-table tr:last-child > * { border-bottom:0; }
.deep-table .high-party-row { background:linear-gradient(90deg,rgba(153,66,255,.11),rgba(255,94,85,.07)); }
.reference-notes { margin-top:14px;color:#c9bed1;font-size:13px; }
.reference-notes > strong { display:block;color:var(--green);margin-bottom:8px; }
.reference-notes p { margin:6px 0;padding-left:13px;border-left:2px solid #523966; }
.dungeon-progression { display:grid;gap:9px;max-height:635px;overflow:auto;padding-right:4px; }
.tier-manual { border:1px solid #3b2b48;border-radius:9px;background:#0d0b12; }
.tier-manual > summary { display:flex;justify-content:space-between;gap:12px;padding:12px 13px;cursor:pointer;color:#fff;list-style:none; }
.tier-manual > summary::-webkit-details-marker { display:none; }
.tier-manual > summary span { color:var(--green);font-weight:1000; }
.tier-manual > summary strong { color:#b9abc5;font-size:12px; }
.tier-manual[open] > summary { border-bottom:1px solid #392b43;background:#17101e; }
.tier-dungeons { display:grid;gap:10px;padding:10px; }
.dungeon-row { padding:13px;border:1px solid #2e2337;border-radius:8px;background:#08070b; }
.dungeon-row-title { display:flex;align-items:baseline;gap:9px; }
.dungeon-row-title span { color:var(--gold);font-size:11px;font-weight:1000;text-transform:uppercase; }
.dungeon-row h4 { margin:0;color:#fff;font:800 18px/1.1 Georgia,serif; }
.dungeon-row > p { margin:7px 0;color:#bfb4c8;font-size:12px; }
.dungeon-rule-grid,.mechanic-grid,.ai-grid { display:flex;flex-wrap:wrap;gap:7px; }
.mechanic-chip { display:flex;flex-direction:column;min-width:88px;padding:7px 9px;border:1px solid #3d2e48;border-radius:7px;background:#15101b; }
.mechanic-chip small { color:#a99bb5;font-size:9px;font-weight:900;letter-spacing:.08em;text-transform:uppercase; }
.mechanic-chip strong { color:#fff;font-size:12px;overflow-wrap:anywhere; }
.dungeon-row .mechanic-chip { min-width:104px; }
.compact-line strong { color:#eaddf2; }
.deep-link { display:inline-block;margin-top:5px;color:#8fddff;font-size:12px;font-weight:800;text-decoration:none; }
.class-jumpbar { position:sticky;top:67px;z-index:25;display:flex;align-items:center;justify-content:center;gap:7px;flex-wrap:wrap;margin:0 0 18px;padding:10px 12px;background:rgba(10,8,14,.94);backdrop-filter:blur(12px); }
.class-jumpbar span { color:#a99ab5;font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.1em; }
.class-jumpbar a { padding:5px 8px;border:1px solid #3d2d49;border-radius:999px;color:#e4d9ec;text-decoration:none;font-size:11px;font-weight:800; }
.class-jumpbar a:hover { color:#fff;border-color:var(--purple); }
.hero-doc { scroll-margin-top:122px; }
.field-manual { margin:0 clamp(20px,4vw,38px) 30px;border:1px solid color-mix(in srgb,var(--class) 52%,#33283d);border-radius:12px;overflow:hidden;background:rgba(5,5,8,.7); }
.field-manual > summary { display:flex;align-items:center;justify-content:space-between;gap:18px;padding:16px 18px;cursor:pointer;list-style:none;background:linear-gradient(100deg,color-mix(in srgb,var(--class) 11%,#15101b),#0b0910); }
.field-manual > summary::-webkit-details-marker { display:none; }
.field-manual > summary::after { content:"+";display:grid;place-items:center;width:29px;height:29px;flex:none;border:1px solid color-mix(in srgb,var(--class) 50%,#44324f);border-radius:50%;color:var(--class);font-size:20px; }
.field-manual[open] > summary::after { content:"−"; }
.field-manual > summary span:first-child { display:flex;flex-direction:column; }
.field-manual > summary small { color:var(--class);font-weight:900;letter-spacing:.09em;text-transform:uppercase; }
.field-manual > summary strong { color:#fff;font:800 clamp(18px,3vw,25px)/1.2 Georgia,serif; }
.manual-count { margin-left:auto;color:#b9adbf;font-size:11px;font-weight:800; }
.field-manual-body { padding:18px; }
.manual-lead { display:grid;grid-template-columns:minmax(0,1fr) auto;gap:20px;align-items:center;padding:18px;border:1px solid #34263e;border-radius:10px;background:radial-gradient(circle at 90% 50%,color-mix(in srgb,var(--class) 10%,transparent),transparent 42%),#0d0a11; }
.manual-lead h3 { margin:3px 0 8px;color:#fff;font-size:25px; }
.manual-lead p { margin:0;color:#cfc3d7; }
.resource-badge { min-width:130px;padding:12px;border:1px solid color-mix(in srgb,var(--class) 45%,#3c2d47);border-radius:9px;text-align:center;background:#131019; }
.resource-badge small,.resource-badge span { display:block;color:#a99caf;font-size:10px;text-transform:uppercase;letter-spacing:.1em; }
.resource-badge strong { display:block;color:var(--class);font-size:22px; }
.manual-section { padding:23px 0;border-bottom:1px solid #302438; }
.manual-section:last-child { border-bottom:0;padding-bottom:0; }
.manual-section-heading { display:flex;align-items:center;gap:12px;margin-bottom:14px; }
.manual-section-heading > span { display:grid;place-items:center;width:34px;height:34px;flex:none;border:1px solid color-mix(in srgb,var(--class) 48%,#45334f);border-radius:50%;color:var(--class);font-weight:1000;font-size:11px; }
.manual-section-heading h3 { margin:0;color:#fff;font-size:22px; }
.manual-section-heading p { margin:2px 0 0;color:#a99db2;font-size:12px; }
.stat-table { min-width:720px; }
.formula-note { margin:9px 0 0;color:#9f92aa;font-size:11px; }
.ability-timeline { display:grid;gap:10px; }
.ability-deep-card { display:grid;grid-template-columns:78px minmax(0,1fr);gap:13px;padding:14px;border:1px solid #34263e;border-radius:9px;background:#0c0a10; }
.ability-level { color:var(--gold);font-size:11px;font-weight:1000;letter-spacing:.06em;text-transform:uppercase; }
.ability-title { display:flex;align-items:center;justify-content:space-between;gap:12px; }
.ability-title h4,.passive-card h4 { margin:0;color:#fff;font:800 19px/1.15 Georgia,serif; }
.ability-title code { padding:3px 6px;color:#bba9c7;font-size:10px;white-space:normal;overflow-wrap:anywhere; }
.ability-copy > p,.passive-card > p { margin:7px 0 10px;color:#c7bbcF;font-size:13px; }
.passive-grid { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px; }
.passive-card { min-width:0;padding:15px;border:1px solid #3a2a45;border-radius:9px;background:#0d0a11; }
.passive-card .ability-level { margin-bottom:4px; }
.ai-grid .mechanic-chip { min-width:150px; }
.strategy-grid { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px; }
.strategy-card { padding:15px;border:1px solid #3a2b43;border-radius:9px;background:#0d0a11; }
.strategy-card h4 { margin:0 0 9px;color:#fff;font-size:17px; }
.strategy-card ul { margin:0;padding-left:18px; }
.strategy-card li { margin:7px 0;color:#c6bacf;font-size:12px; }
.strategy-card.answers { border-top:3px solid #72d9ff; }
.strategy-card.synergies { border-top:3px solid #8aff68; }
.strategy-card.pressure { border-top:3px solid #ff796f; }
@media (max-width:900px) {
  .reference-grid { grid-template-columns:1fr; }
  .dungeon-progression { max-height:none; }
  .strategy-grid { grid-template-columns:1fr; }
}
@media (max-width:650px) {
  .combat-reference { margin-bottom:24px; }
  .combat-reference,.reference-grid,.reference-panel,.hero-doc-grid,.hero-doc,.field-manual { min-width:0;max-width:100%; }
  .reference-panel { padding:14px; }
  .class-jumpbar { top:109px;justify-content:flex-start;overflow-x:auto;flex-wrap:nowrap;white-space:nowrap; }
  .class-jumpbar span { display:none; }
  .field-manual { margin-inline:10px; }
  .field-manual > summary { align-items:flex-start;padding:14px; }
  .manual-count { display:none; }
  .field-manual-body { padding:10px; }
  .manual-lead { grid-template-columns:1fr; }
  .resource-badge { text-align:left; }
  .ability-deep-card { grid-template-columns:1fr; }
  .ability-title { align-items:flex-start;flex-direction:column; }
  .passive-grid { grid-template-columns:1fr; }
  .mechanic-chip,.ai-grid .mechanic-chip { flex:1 1 120px;min-width:0; }
}