/*
 * Exition cross-surface finish layer.
 *
 * Loaded after the host-specific themes. This file owns only the final
 * topology, typography and control consistency shared by public pages.
 * Input fields, menus and real interactive panels keep a visible boundary;
 * reading groups and navigation lists rely on spacing or one shared rule.
 */

:root {
  --ex-polish-font: "Noto Sans KR", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --ex-polish-canvas: #f6f8fb;
  --ex-polish-surface: #ffffff;
  --ex-polish-soft: #eef3f8;
  --ex-polish-text: #172033;
  --ex-polish-muted: #5d6b7a;
  --ex-polish-line: #dce4ed;
  --ex-polish-line-strong: #c7d2df;
  --ex-polish-action: #2164e8;
  --ex-polish-signal: #0f8f8a;
}

body[data-exition-surface] {
  color: var(--ex-polish-text);
  font-family: var(--ex-polish-font) !important;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

/* The previous halls embedded ornamental fonts in many local and runtime
 * selectors. The current homepage face is the public default everywhere. */
body[data-exition-surface] * {
  font-family: var(--ex-polish-font) !important;
}

body[data-exition-surface] :where(
  code,
  pre,
  kbd,
  samp,
  var,
  math,
  .equation,
  .eq,
  .formula,
  .workbook-formula
) {
  font-family: ui-monospace, "SFMono-Regular", Consolas, monospace !important;
}

body[data-exition-surface] :where(button, [role="button"], summary, input, select, textarea, a):focus-visible {
  outline: 3px solid var(--ex-polish-signal) !important;
  outline-offset: 3px !important;
}

body[data-exition-surface] summary {
  min-height: 44px;
  box-sizing: border-box;
  padding-block: 10px;
}

body[data-exition-surface="test"] .integ-hint .ih-cta {
  min-height: 44px;
  padding: 10px 14px !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
}

/* Test hall: retire the old ornamental face from every task surface. */
body[data-exition-surface="test"] :where(
  h1,
  h2,
  h3,
  h4,
  .logo,
  .title,
  .subtitle,
  .tool-title,
  .result-title,
  .section-title,
  .card-title
) {
  font-family: var(--ex-polish-font) !important;
  letter-spacing: -0.026em !important;
}

body[data-exition-surface="test"] :where(p, li, dd, label, .description, .desc, .hint, .notice) {
  font-family: var(--ex-polish-font) !important;
  letter-spacing: -0.012em;
}

/* World reading: the current home typography becomes the default voice. */
body[data-exition-surface="world"] :where(
  h1,
  h2,
  h3,
  h4,
  .cover h1,
  .note-title,
  .note-index-item b,
  .locked-item .li-title,
  .next .nx-title,
  .exition-article-title h1
) {
  font-family: var(--ex-polish-font) !important;
}

body[data-exition-surface="world"] :where(p, li, dd, blockquote) {
  font-family: var(--ex-polish-font) !important;
}

/* A quote is part of the reading flow, not a detached card or blue rail. */
body[data-exition-surface="world"] :where(
  blockquote,
  .section blockquote,
  .chapter-copy blockquote
) {
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
}

body[data-exition-surface="world"] .chapter-copy blockquote {
  margin-block: 34px 0 !important;
  padding: 26px 0 0 !important;
  border-top: 1px solid var(--ex-polish-line) !important;
  color: var(--ex-polish-text) !important;
}

/* Notes read as one continuous page. Equations keep their own quiet field. */
body[data-exition-surface="world"] .note {
  padding-inline: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
}

body[data-exition-surface="world"] .note .lead {
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--ex-polish-text) !important;
  font-weight: 650;
}

body[data-exition-surface="world"] .note .equation {
  margin-block: 26px !important;
  padding: 22px clamp(16px, 4vw, 34px) !important;
  border: 0 !important;
  border-radius: 12px !important;
  background: var(--ex-polish-soft) !important;
}

/* Search is interactive, so the field stays bounded; its wrapper does not. */
body[data-exition-surface="world"] :where(.notes-finder, .concept-finder) {
  border: 0 !important;
  box-shadow: none !important;
  background: var(--ex-polish-soft) !important;
}

body[data-exition-surface="world"] :where(.note-index, .locked-list) {
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
}

body[data-exition-surface="world"] .locked-item {
  min-height: 82px;
  margin: 0 !important;
  padding: 18px 0 !important;
  border: 0 !important;
  border-top: 1px solid var(--ex-polish-line) !important;
  border-radius: 0 !important;
  background: transparent !important;
}

body[data-exition-surface="world"] .locked-item:last-child {
  border-bottom: 1px solid var(--ex-polish-line) !important;
}

body[data-exition-surface="world"] .locked-item .li-lock {
  min-width: 44px;
  padding: 6px 8px;
  border: 0 !important;
  border-radius: 8px !important;
  background: var(--ex-polish-soft) !important;
  color: var(--ex-polish-muted) !important;
  font-size: 12px !important;
}

/* One next-reading device, not two unrelated floating cards. */
body[data-exition-surface="world"] .next {
  gap: 0 !important;
  border-block: 1px solid var(--ex-polish-line) !important;
  border-inline: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
}

body[data-exition-surface="world"] .next > :where(a, .next-upcoming) {
  margin: 0 !important;
  padding: 28px clamp(0px, 3vw, 30px) !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  opacity: 1 !important;
}

body[data-exition-surface="world"] .next > :where(a, .next-upcoming) + :where(a, .next-upcoming) {
  border-left: 1px solid var(--ex-polish-line) !important;
}

/* Footnotes and cross-surface prompts belong to the page, not a white slab. */
body[data-exition-surface="world"] :where(.colophon, .footer-cta) {
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
}

body[data-exition-surface="world"] .colophon a {
  border: 0 !important;
  text-decoration: underline !important;
  text-decoration-color: color-mix(in srgb, currentColor 36%, transparent) !important;
  text-underline-offset: 4px;
}

/* Secondary account action is a real quiet button, not an underlined orphan. */
body[data-exition-surface="world"] .cta-row .secondary {
  min-height: 44px;
  padding: 10px 16px !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 0 !important;
  border-radius: 12px !important;
  background: var(--ex-polish-soft) !important;
  color: var(--ex-polish-text) !important;
  font-weight: 700;
  text-decoration: none !important;
}

body[data-exition-surface="world"] .cta-row .secondary:hover {
  background: #e2eaf3 !important;
  color: var(--ex-polish-action) !important;
}

/* Small public annotations must remain readable on compact screens. */
body[data-exition-surface] :where(
  .surface-role-badge,
  .nm-group-title,
  .global-nav .nav-tier,
  .preview-banner .pb-tag,
  .source-card .sc-label,
  .trigger-rank,
  .top-card .tc-tag,
  .top-card .tc-rank,
  .q-item .q-scale-legend,
  .balance-card .bal-tag,
  .score-tile .st-label,
  .print-btn .pb-hint,
  .hero-tagline,
  .col-card .cc-rank,
  .col-card .cc-cat,
  .axis-tag,
  .char-count,
  .di-label,
  .scale-legend,
  .axis-card .ac-name,
  .result-kicker,
  .state-card .target-quote .label,
  .profile-row .pr-sub,
  .ai-header .ai-note,
  .breakdown-group-label,
  .diag-card .diag-tag,
  .assessment-answer-count,
  .essay-count,
  .q-label .rev,
  .delta-item .dl,
  .stat .v .num-label,
  .stat .sub,
  .followup-card .fu-quota,
  .followup-card .fu-counter,
  .followup-card .fu-warning,
  .saju-cta-tag,
  .diagnose-cta-tag,
  .catalog-meta,
  .intent-label,
  .article .a-foot,
  h2 .chapter-num,
  .series-tag,
  .cat-tag,
  .tc-label,
  .karma-q .kq-tag,
  .karma-q .kq-scale-legend,
  .bd-item .bd-tag,
  .dist-card .d-tag,
  .ax-item .ax-delta,
  .ax-legend,
  .figure-card .fc-rank,
  .figure-card .fc-cat,
  .figure-card .fc-basis-label,
  .figure-card .fc-basis-chip,
  .user-basis-label,
  .legacy-aggregate .la-tag,
  .legacy-figure .lf-rank,
  .legacy-figure .lf-trait,
  .verdict-card .v-tag,
  .axis-item .ax-vals,
  .axis-poles,
  .scale label,
  .scale label .s-anchor,
  .chart-x,
  .reflection-counter,
  .q-why,
  .gyul-card .gc-meta,
  .account-card .ac-name .ac-tag,
  .diag-progress .dp-count,
  .diag-progress .dp-meta,
  .diag-progress .dp-cta,
  .credits-balance .cb-label,
  .pay-item .pi-meta,
  .pay-item .pi-status,
  .rcpt-foot,
  .stat-tile .st-label,
  .stat-tile .st-sub,
  .pa-row .pa-sub,
  .profile-aggregate .pa-foot,
  .persona-card .pc-trait,
  .persona-card .pc-ai-meta,
  .actions-card .ac-section-label .ac-tag,
  .actions-card .ac-foot,
  .cert-config .cc-hint,
  .tool-group .tg-count,
  .entry .e-meta,
  .entry .e-act,
  .cert-header .cert-name-prefix,
  .single-card .sg-label,
  .single-card .sg-foot,
  .ps-price .ps-strike,
  .ps-price .ps-disc-tag,
  .consent-list li.required::after,
  .consent-list li.optional::after,
  .consent-list .c-text small,
  .pack-card.featured::before,
  .pack-card .pk-discount,
  .first-disc-line .fd-strike,
  .tool-table .tt-price,
  .subscriber-card .sc-tag,
  .subscriber-card .sc-fair,
  .footer,
  .footer .biz-info,
  .footer-info,
  .gyul .g-num,
  .gyul .g-from,
  .roadmap-tag,
  .info-item .k,
  .planet .pk,
  .planet .pe,
  .planet .ph,
  .chart-legend,
  .house-card .hc-cusp,
  .house-card .hc-theme,
  .house-card .hc-planets,
  .aspects-board .ab-row .ab-orb,
  .lr-row .lr-tag,
  .k-axes .ax-num,
  .k-axes .ax-tag,
  .k-diag-tier,
  .a-index-card .ai-tag,
  .life-area-card .la-label,
  .life-area-card .la-signal,
  .life-area-card .la-signal-label,
  .note-mark,
  .note-ref,
  .applied .ap-tag,
  .locked-list-title,
  .locked-item .li-ref,
  .sub-badge,
  .cover .meta,
  .section-mark,
  .thesis .t-label,
  .toc .toc-title,
  .toc a .no,
  .closing .c-label,
  .hedge .h-label,
  .next .nx-label,
  .diagram,
  .quick > summary .q-arrow,
  .footer-note,
  .result-footer-note,
  .result-biz-info
) {
  font-size: 12px !important;
}

/* Remaining aliases live in the home reader, workbook and shared widgets. */
body[data-exition-surface] :where(
  .advanced-terms > summary span,
  .brand,
  .category,
  .chapter-copy blockquote span,
  .chapter-jump-panel .jump-no,
  .col-label,
  .concept-list small,
  .concept-meta,
  .concept-route small,
  .demo-label,
  .demo-scale-legend,
  .err .ek,
  .ex-auth-login .ex-naver-N,
  .ex-auth-pill .ex-check,
  .ex-auth-pill .ex-my-tag,
  .ex-coin-chip,
  .ex-credits-btn::after,
  .exition-article-brand small,
  .exition-result-main .target-quote .label,
  .exition-signature-home .worldview-boundary > span,
  .global-nav .nav-links .nav-menu .nav-menu-panel a span,
  .glossary-list dt span,
  .hall-list small,
  .hall-list span,
  .landscape-labels,
  .layer-map .card::before,
  .locked-item .li-lock,
  .meta,
  .nav-label,
  .nav-menu-panel .nm-group a span,
  .note-index-item span,
  .principle-list small,
  .reading-list small,
  .reading-percent,
  .reading-position,
  .resume-reading,
  .route-label,
  .section-label,
  .state-consequence span,
  .state-detail-meta,
  .state-equation-boundary,
  .state-equation-grid > div > span,
  .state-equations summary small,
  .state-landscape figcaption span,
  .state-landscape-heading > div span,
  .state-landscape-heading > span,
  .state-step-controls button > span,
  .state-step-controls button small,
  .tool-price,
  .trace-step span,
  .trajectory-labels,
  .workbook-answer span,
  .workbook-evidence h4,
  .worldview-boundary > span,
  .worldview-eyebrow,
  .worldview-structure-heading span,
  .worldview-structure-list .structure-number,
  footer p
) {
  font-size: 12px !important;
}

body[data-exition-surface] :where(
  [style*="font-size:10px"],
  [style*="font-size: 10px"],
  [style*="font-size:10.5px"],
  [style*="font-size: 10.5px"],
  [style*="font-size:11px"],
  [style*="font-size: 11px"],
  [style*="font-size:11.5px"],
  [style*="font-size: 11.5px"]
) {
  font-size: 12px !important;
}

/* Standalone status pages inherit the same calm, bounded public surface. */
body[data-exition-surface] > :where(.box, main.box) {
  color: var(--ex-polish-text) !important;
  background: var(--ex-polish-surface) !important;
  border: 1px solid var(--ex-polish-line) !important;
  border-radius: 16px !important;
  box-shadow: none !important;
}

body[data-exition-surface] > :where(.box, main.box) :where(p, .dim, .muted) {
  color: var(--ex-polish-muted) !important;
}

/* Control aliases used by pricing, payment, auth, profile, saju and my pages. */
body[data-exition-surface] :where(
  .pk-cta,
  .sc-cta,
  .btn.primary,
  .btn-primary,
  .pricing-auth-notice a
),
body[data-exition-surface] > :where(.box, main.box) > .btn:not(.btn-secondary) {
  min-height: 48px !important;
  padding: 12px 20px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #ffffff !important;
  background: var(--ex-polish-action) !important;
  background-image: none !important;
  border: 1px solid var(--ex-polish-action) !important;
  border-radius: 12px !important;
  box-shadow: none !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  text-decoration: none !important;
}

body[data-exition-surface] :where(
  .pk-cta,
  .sc-cta,
  .btn.primary,
  .btn-primary,
  .pricing-auth-notice a
):hover,
body[data-exition-surface] > :where(.box, main.box) > .btn:not(.btn-secondary):hover {
  color: #ffffff !important;
  background: #1d56d8 !important;
  border-color: #1d56d8 !important;
  transform: none !important;
}

body[data-exition-surface] :where(.btn.secondary, .btn-secondary, .btn-cancel, .rcpt-print) {
  min-height: 44px !important;
  padding: 10px 16px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: var(--ex-polish-text) !important;
  background: var(--ex-polish-surface) !important;
  background-image: none !important;
  border: 1px solid var(--ex-polish-line-strong) !important;
  border-radius: 12px !important;
  box-shadow: none !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  text-decoration: none !important;
}

body[data-exition-surface] :where(.btn.secondary, .btn-secondary, .btn-cancel, .rcpt-print):hover {
  color: var(--ex-polish-action) !important;
  background: var(--ex-polish-soft) !important;
  border-color: var(--ex-polish-action) !important;
  transform: none !important;
}

body[data-exition-surface] :where(.modal-close, .rcpt-close) {
  width: 44px !important;
  min-width: 44px !important;
  height: 44px !important;
  min-height: 44px !important;
  padding: 0 !important;
  display: inline-grid !important;
  place-items: center !important;
  color: var(--ex-polish-muted) !important;
  background: var(--ex-polish-soft) !important;
  border: 0 !important;
  border-radius: 12px !important;
  box-shadow: none !important;
}

body[data-exition-surface] :where(.modal-close, .rcpt-close):hover {
  color: var(--ex-polish-text) !important;
  background: #e2eaf3 !important;
  transform: none !important;
}

body[data-exition-surface] :where(.cta-card, .diagnose-cta, .saju-cta) {
  min-height: 96px !important;
  padding: 18px 20px !important;
  display: block !important;
  color: var(--ex-polish-text) !important;
  background: var(--ex-polish-surface) !important;
  background-image: none !important;
  border: 1px solid var(--ex-polish-line) !important;
  border-radius: 16px !important;
  box-shadow: none !important;
  text-decoration: none !important;
}

body[data-exition-surface] :where(.cta-card, .diagnose-cta, .saju-cta):hover {
  color: var(--ex-polish-action) !important;
  background: var(--ex-polish-soft) !important;
  border-color: var(--ex-polish-action) !important;
  transform: none !important;
}

body[data-exition-surface] :where(.diagnose-cta-title, .saju-cta-title) {
  color: var(--ex-polish-text) !important;
  background: none !important;
  -webkit-background-clip: border-box !important;
  background-clip: border-box !important;
  -webkit-text-fill-color: currentColor !important;
}

body[data-exition-surface="world"] :where(.quick, .cards, .prop, .hedge, .closing, .eq, .cta-box) {
  box-shadow: none !important;
}

@media (max-width: 720px) {
  body[data-exition-surface="world"] .next {
    display: block !important;
  }

  body[data-exition-surface="world"] .next > :where(a, .next-upcoming) + :where(a, .next-upcoming) {
    border-top: 1px solid var(--ex-polish-line) !important;
    border-left: 0 !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  body[data-exition-surface] *,
  body[data-exition-surface] *::before,
  body[data-exition-surface] *::after {
    scroll-behavior: auto !important;
  }
}
