/* One scale for legacy and new leaf-level roles. A role never belongs on a layout wrapper. */
:root{
  --ui-type-l1-size:32px;--ui-type-l1-line:1.3;--ui-type-l1-weight:700;
  --ui-type-l2-size:22px;--ui-type-l2-line:1.4;--ui-type-l2-weight:700;
  --ui-type-l3-size:16px;--ui-type-l3-line:1.4;--ui-type-l3-weight:700;
  --ui-type-l4-size:14px;--ui-type-l4-line:1.65;--ui-type-l4-weight:400;
  --ui-type-note-size:12px;--ui-type-input-size:16px;
  --site-type-l1-size:var(--ui-type-l1-size);
  --site-type-l2-size:var(--ui-type-l2-size);
  --site-type-l3-size:var(--ui-type-l3-size);
}
@media(max-width:899px){:root{--ui-type-l1-size:28px;--ui-type-l2-size:20px;--ui-type-l3-size:15px}}
body{font-size:var(--ui-type-l4-size);line-height:var(--ui-type-l4-line)}
/* Legacy classes select a default role; explicit semantic component roles
   follow. Comma selectors retain their own specificity, unlike one giant :is(). */
.type-l1,
.ui-type-l1,
.site-page-intro__title{font-size:var(--ui-type-l1-size)!important;line-height:var(--ui-type-l1-line)!important;font-weight:var(--ui-type-l1-weight)!important;font-style:normal!important;letter-spacing:-.02em!important}

.type-l2,
.ui-type-l2{font-size:var(--ui-type-l2-size)!important;line-height:var(--ui-type-l2-line)!important;font-weight:var(--ui-type-l2-weight)!important;font-style:normal!important;letter-spacing:-.02em!important}

.type-l3,
.ui-type-l3{font-size:var(--ui-type-l3-size)!important;line-height:var(--ui-type-l3-line)!important;font-weight:var(--ui-type-l3-weight)!important;font-style:normal!important;letter-spacing:-.02em!important}

.cardHead h2,
.explainBox h3,
.raidModeHead h3,
.bossDropCardsHead h3,
.enhDropBox h3,
.pqDropBox h3,
.exceptionCard h3,
.ec-card-head h3,
.jt-formSection h3,
.finalSkillColumn__head h3,
.skillTreeColumn__head h4,
.finalSkillCard__head h4,
.finalCompactAttack__name,
.skillCard__titleRow h4,
.masteryCard h4,
.equipSourceTab,
.stageModeTab,
.bossContentTab,
.contentTab,
.pqQuestTab,
.detailTab,
.summonTabs button>span,
.ec-tab>span{font-size:var(--ui-type-l3-size)!important;line-height:var(--ui-type-l3-line)!important;font-weight:var(--ui-type-l3-weight)!important;font-style:normal!important;letter-spacing:-.02em!important}

.skillSetupStep__heading h2,
.skillResultTitle h2,
.skillFinalBoard__heading h2,
.skillTreeSection__heading h3,
.gearGuideHead h2,
.bossSectionCard>h2,
.pqQuestHead h2,
.pqCommonHead h2,
.jt-priority h2,
.jt-layout .jt-card__head h2,
.jt-known .jt-card__head h2,
.jt-levelToolbar h2,
.summonControls .summonCard__head h2,
.summonTableCard .summonCard__head h2,
.ec-card-head h2,
.sideTitle h2,
.epHead h2,
.infoArticle section>h2{font-size:var(--ui-type-l2-size)!important;line-height:var(--ui-type-l2-line)!important;font-weight:var(--ui-type-l2-weight)!important;font-style:normal!important;letter-spacing:-.02em!important}

.summonInfoGrid .summonCard__head h2,
.jt-infoGrid .jt-card__head h2{font-size:var(--ui-type-l3-size)!important;line-height:var(--ui-type-l3-line)!important;font-weight:var(--ui-type-l3-weight)!important;font-style:normal!important;letter-spacing:-.02em!important}

.ui-type-l4,
.site-page-intro__description,
.summonCard__head p,
.jt-card__head p,
.ec-card-head p,
.skillSetupStep__heading p,
.skillResultTitle p{font-size:var(--ui-type-l4-size)!important;line-height:var(--ui-type-l4-line)!important;font-weight:var(--ui-type-l4-weight)!important;font-style:normal!important;letter-spacing:-.02em!important}

.ui-type-note{font-size:var(--ui-type-note-size)!important;line-height:var(--ui-type-l4-line)!important;font-weight:var(--ui-type-l4-weight)!important;font-style:normal!important}
.ui-type-input{font-size:var(--ui-type-input-size)!important;line-height:1.4!important;font-weight:var(--ui-type-l4-weight)!important;font-variant-numeric:tabular-nums}
.ui-type-number{font-variant-numeric:tabular-nums}
/* Existing calculator leaf roles retain their semantic HTML level. */
#damageTreeTitle,
#gameStatTitle,
#skillDamageTitle,
#itemEfficiencyTitle,
#growthLab>.wire-column-head h2,
#v4SimulationTitle,
#v4LoadoutTitle,
#wizardTitle,
#profileEditChoiceTitle,
#presetRestoreChoiceTitle,
#presetRecoveryTitle{font-size:var(--ui-type-l2-size)!important;line-height:var(--ui-type-l2-line)!important;font-weight:var(--ui-type-l2-weight)!important;font-style:normal!important;letter-spacing:-.02em!important}

#currentReferenceTitle,
#skillBaseSummaryTitle,
#skillOneHitTitle,
#skillDamagePanel .skill-section-head h3{font-size:var(--ui-type-l3-size)!important;line-height:var(--ui-type-l3-line)!important;font-weight:var(--ui-type-l3-weight)!important;font-style:normal!important;letter-spacing:-.02em!important}

/* Artwork/hero display size is component-owned; it is not a page intro title. */
.type-display{font-style:normal!important;font-weight:700!important;line-height:1.1!important;letter-spacing:-.035em!important}

/* Font families are owned here, once. Component styles own size/weight/spacing.
   Maple is for copy, guidance, headings, table headings and buttons. System UI
   is for numeric readouts, table data, controls and code; no layout wrapper is
   marked as numeric. These are the existing site's explicit readout selectors. */
:root{
  --site-font-display:'Maplestory','Malgun Gothic','맑은 고딕',sans-serif;
  --site-font-ui:system-ui,-apple-system,'Segoe UI','Noto Sans KR','Apple SD Gothic Neo',Arial,sans-serif;
  --font-display-maple:var(--site-font-display);
  --font-body-maple:var(--site-font-display);
  --ui-font-display:var(--font-display-maple);
  --ui-font-body:var(--font-body-maple);
  --ui-font-number:var(--site-font-ui);
}
body,button,optgroup{font-family:var(--font-body-maple)}
td,td *,input,select,textarea,code,pre,kbd,samp,
.ui-type-input,.ui-type-number,.ui-type-number *,
.num,.number,.numeric,.formula,.ocr-debug,.v4i-readout,
.fixed-cell em,.manual-summary-delta em,.track-shift-impact em,
.v4-result-summary strong,.v4-skill-amount,.v4-skill-share,
.cube-efficiency-number input,#cubeEfficiencyResult dd,
.v4-graph-axis-label,.v4-tooltip-head,.v4-tooltip-skills strong,
.summonKpi>strong,.ec-metric>strong,.jt-levelHero>strong,
.jt-kpi>strong,.jt-timeCard>strong,.jt-rateTrace>strong,.jt-resultNote>strong,
.jt-accelOutcome>strong,.jt-accelOutcome>span,
#speedResult,#pierceResult,body.ui-maple-tools .example>strong,
.skillResultFact>strong,.finalCompactDamageLine p>span,.finalCompactDamageLine p>b,
.finalCompactDamageSum>b,.damageEquation__row div>b,.damageEquation__row div>em,
.damageEquation__sum>strong,.coefficientFlow__formula b,.coefficientFlow__result b,
.coefficientFlow__result em,.coefficientFlow__sum>strong,.finalAggregate span>b,.localBonusLine b,
.v4-lane-axis,.v4-lane-axis *,#v4SequenceLog time,#v4SequenceLog strong,
.astat b,.statsSummaryCards b,#statsChart .statsAxisLabel,
.updateTime,.homeUpdateDate,time{
  font-family:var(--site-font-ui);
}
/* Copy can be nested in table data or buttons. Explicit number/control tokens
   below remain numeric, while table headings never inherit td/table UI rules. */
th,th *,button,button *,
.type-l1,.type-l2,.type-l3,.type-display,
.ui-type-l1,.ui-type-l2,.ui-type-l3,.ui-type-l4,.ui-type-note{
  font-family:var(--font-body-maple);
}
input,select,textarea,code,pre,kbd,samp,
.ui-type-input,.ui-type-number,.ui-type-number *,
.v4-result-summary strong,.v4-skill-amount,.v4-skill-share{
  font-family:var(--site-font-ui);
}