/* public/page-titles.css */
/* Home retains its existing shell. Only the other pages' title area changes. */
#app .shell.is-full-page { --page-title-gutter:14px; }
#app .is-full-page > .site-pass-header { display:none; }
#app .shell.is-full-page > .main { padding-top:0; }
#app .is-full-page :is(.page-intro,.ranking-intro,.calendar-intro,.calendar-hub-heading) { padding-top:0; }
#app .is-full-page .transfer-board { margin-top:0; }

#app .is-full-page :is(.page-intro,.ranking-intro,.calendar-intro,.calendar-hub-heading,.search-page) > h1 {
  display:flex; align-items:center; min-height:56px;
  margin-top:0; margin-inline:calc(-1 * var(--page-title-gutter));
  padding:16px var(--page-title-gutter);
  border-bottom:1px solid var(--line); background:var(--surface); color:var(--ink);
}

#app .is-full-page :is(.request-flow-header,.cancellation-flow-header,.tb-heading,.tb-detail-heading) {
  display:flex; align-items:center; justify-content:flex-start; gap:12px; min-height:56px;
  margin-top:0; margin-inline:calc(-1 * var(--page-title-gutter));
  padding:3px var(--page-title-gutter);
  border-bottom:1px solid var(--line); background:var(--surface); color:var(--ink);
}
#app .is-full-page :is(.request-flow-header,.cancellation-flow-header,.tb-heading) > h1 {
  flex:1; min-width:0; margin:0;
}
#app .is-full-page .tb-detail-heading > p { flex:1; }
#app .is-full-page .tb-detail-heading .tb-back { position:static; flex:none; }
#app .is-full-page .request-flow-header > a { flex:none; width:32px; }
#app .is-full-page .request-kind-tabs { margin-top:16px; }
#app .is-full-page .pass-wallet { margin-bottom:12px; }

@media(max-width:360px) {
  #app .shell.is-full-page { --page-title-gutter:12px; }
}

/* public/typography.css */
/* Approved 2026-10-05: typography only. Component geometry and colors stay
   in their existing stylesheets. Roles cascade into nested labels/numbers. */
:root {
  --tl-font: 'Noto Sans KR', sans-serif;
  --tl-size: 13px;
  --tl-weight: 400;
  --tl-leading: 1.5;
  --type-display: 16px;
  --type-heading: 16px;
  --type-body-lg: 13px;
  --type-body: 13px;
  --type-caption: 11px;
  --type-micro: 10px;
  --type-number: 14px;
}

/* A final text-only layer overrides the component-specific legacy scales.
   SVG icons keep their original sizing; notice editor documents retain
   author formatting, while their UI and default body use the shared scale. */
:is(body, #app, #toast, dialog, .request-modal, .certification-camera,
    .legal-header, .legal-main, .legal-foot),
:is(#app, #toast, dialog, .request-modal, .certification-camera,
    .legal-header, .legal-main, .legal-foot)
  :where(*):not(svg, svg *, .ql-editor *, .notice-rich *) {
  font-family: var(--tl-font) !important;
  font-size: var(--tl-size) !important;
  font-weight: var(--tl-weight) !important;
  line-height: var(--tl-leading) !important;
  letter-spacing: 0 !important;
}

/* body-md: information, form values, dates and counts. */
:is(#app, dialog, .request-modal, .certification-camera, .legal-main)
  :is(input, select, textarea, .performance-opening-line time,
      .performance-session-date, .performance-session-time,
      .attendance-session-time, .ticket-session-date,
      .session-saved-summary, .performance-readonly-fields dd,
      .session-performance-details dd, .performance-applicant-request,
      .performance-request-totals, .score-total, .stars-earned,
      .stars-spent, .stars-available, .ranking-score, .home-rank-score,
      .calendar-day > span, .opening-calendar-date, .ticket-calendar-day,
      .legal-lead, .legal-card p, .legal-card li) {
  --tl-size: 13px; --tl-weight: 500; --tl-leading: 1.5;
}

/* heading-md: titles and section headings; no lg/display tier. */
:is(#app, dialog, .request-modal, .certification-camera,
    .legal-header, .legal-main)
  :is(h1, h2, h3, h4, h5, h6, .brand, .legal-logo,
      .login-title, .login-logo, .welcome-logo, .logo, .pass-logo,
      .pass-brand, .site-pass-logo,
      .ticket-calendar-month, .calendar-head > strong,
      .opening-calendar-month, .admin-work-summary strong) {
  --tl-size: 16px; --tl-weight: 700; --tl-leading: 1.4;
}

/* Shared page titles retain heading-md when a component has a local scale. */
#app .shell.is-full-page :is(.tb-heading h1,.tb-detail-heading > p) {
  --tl-size:16px; --tl-weight:700; --tl-leading:1.4;
}

/* button-md: action labels and category/menu labels, including selected tabs. */
:is(#app, dialog, .request-modal, .certification-camera,
    .legal-header, .legal-main, .legal-foot)
  :is(button, .button, [role=tab], .bottom-tab,
      .legal-nav a, .text-link, .session-saved-link) {
  --tl-size: 12px; --tl-weight: 700; --tl-leading: 1;
}

/* caption: helper copy, metadata and information field labels. */
:is(#app, #toast, dialog, .request-modal, .certification-camera,
    .legal-main, .legal-foot)
  :is(small, .small, .muted, .meta, .lead, .field-hint, .field-note,
      .performance-heading-kind, .performance-heading-venue,
      .performance-readonly-fields dt, .session-performance-details dt,
      .performance-empty, .attendance-empty, .performance-registration-time,
      .performance-anonymous, .performance-application-totals,
      .session-performance-period, .record-calendar-legend,
      .calendar-event-status, .signup-question-note,
      .admin-member-row span, .admin-work-summary p,
      .admin-review-group p, .legal-grid span, .home-opening-copy p,
      .pass-user, .pass-concept, .opening-show-material,
      .opening-field-copy > span, .calendar-event > span) {
  --tl-size: 11px; --tl-weight: 400; --tl-leading: 1.45;
}

/* micro: badges, timers and compact status labels. */
:is(#app, dialog, .request-modal, .certification-camera,
    .legal-header, .legal-main)
  :is(.badge, .eyebrow, .priority-tag, .event-genre,
      .home-opening-sale, .home-opening-kind, .home-opening-counts,
      .performance-ticketing-badge, .performance-opening-countdown,
      .performance-mine, .performance-session-label,
      .attendance-session-status, .attendance-progress,
      .admin-menu-count, .admin-pending-label, .admin-review-count,
      .record-kind, .mine-verification-badge, .verification-ratio,
      .seat-card-picked-caption, .seat-pick-order,
      .legal-kicker, .site-pass-header .star-help, .header-star-wallet,
      .calendar-weekdays, .opening-calendar-weekdays) {
  --tl-size: 10px; --tl-weight: 500; --tl-leading: 1.45;
}

/* Section headings use the same clear bold as performance information. */
#app h2:not(.performance-heading-copy h2):not(.calendar-head h2):not(.ticket-calendar-month):not(.opening-calendar-month) {
  --tl-weight: 700;
}

/* Home request summary: button-md labels 600, counts 700. */
#app .pass-now-links {
  --tl-size: 12px; --tl-weight: 600; --tl-leading: 1;
}
#app .pass-now-links strong {
  --tl-weight: 700;
}

/* Compact main actions keep the approved micro size. */
#app .pass-ranking .pass-rank-person strong {
  --tl-weight: 700;
}

#app .pass-ranking .pass-rank-points {
  --tl-size: 16px; --tl-weight: 900; --tl-leading: 1.45;
}
#app .pass-ranking .pass-rank-points small {
  --tl-size: 12px; --tl-weight: 400;
}

#app .performance-information .performance-site-chips > a {
  --tl-size: 10px; --tl-weight: 700; --tl-leading: 1.38;
}

#app .home-opening-strip :is(.home-opening-apply, .home-opening-add) {
  --tl-size: 10px; --tl-weight: 700; --tl-leading: 1;
}
#app .shell.performance-detail-page .performance-request-tools > .performance-request-totals {
  --tl-size: 13px; --tl-weight: 600; --tl-leading: 1.45;
}
#app .pass-home .pass-ticket-main .pass-ticket-label {
  --tl-size: 15px; --tl-weight: 900; --tl-leading: 1.45;
}

/* Reference performance card typography, shared by home and calendar lists. */
#app :is(.ticketing-card-title, .home-opening-item h3, .performance-heading-copy h2) {
  --tl-size:14px; --tl-weight:700; --tl-leading:1.45;
}
#app :is(.ticketing-slot-time, .ticketing-session-copy time, .home-opening-date,
  .performance-opening-line time, .performance-readonly-fields dd, .session-performance-details dd) {
  --tl-size:13px; --tl-weight:500; --tl-leading:1.5;
}
#app :is(.ticketing-card-copy > span, .ticketing-card-deadline > span:first-child) {
  --tl-size:11px; --tl-weight:400; --tl-leading:1.5;
}
#app :is(.ticketing-card-copy > small, .ticketing-session-copy > small,
  .ticketing-card-sites a, .ticketing-card-sites span, .ticketing-card-status,
  .opening-select-session, .performance-readonly-fields dt) {
  --tl-size:10px; --tl-weight:500; --tl-leading:1.45;
}
#app :is(.ticketing-card-deadline .registration-clock, .pass-ticket-countdown,
  .performance-opening-countdown, .registration-clock) {
  --tl-size:10px; --tl-weight:500; --tl-leading:1.3;
}