:root {
      --ink: #172033;
      --muted: #667085;
      --brand: #334E8C;
      --brand-dark: #263B6A;
      --brand-soft: #EEF2FF;
      --accent: #D85C41;
      --blue: #334E8C;
      --danger: #B4233C;
      --danger-soft: #fff0f2;
      --warning: #9A6700;
      --warning-soft: #FFF7D6;
      --ok: #334E8C;
      --ok-soft: #EEF2FF;
      --paper: #ffffff;
      --canvas: #F6F7FB;
      --line: #D7DEEA;
      --shadow: 0 14px 38px rgba(38, 59, 106, .10);
      --radius: 20px;
    }

    * { box-sizing: border-box; }
    html { scroll-behavior: smooth; }
    body {
      margin: 0;
      color: var(--ink);
      background:
        radial-gradient(circle at 8% 4%, rgba(216, 92, 65, .16), transparent 28rem),
        radial-gradient(circle at 96% 20%, rgba(51, 78, 140, .12), transparent 30rem),
        var(--canvas);
      font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
      line-height: 1.5;
    }

    button, input, select, textarea { font: inherit; }
    button { cursor: pointer; }
    a { color: inherit; }

    .site-header {
      position: sticky;
      top: 0;
      z-index: 30;
      border-bottom: 1px solid rgba(215, 222, 234, .9);
      background: rgba(255, 255, 255, .88);
      backdrop-filter: blur(14px);
    }

    .header-inner, .page, .footer-inner {
      width: min(1120px, calc(100% - 32px));
      margin-inline: auto;
    }

    .header-inner {
      min-height: 68px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 18px;
    }

    .brand {
      display: inline-flex;
      align-items: center;
      gap: 10px;
      font-size: 1.18rem;
      font-weight: 850;
      letter-spacing: -.03em;
      text-decoration: none;
    }

    .brand-mark {
      width: 38px;
      height: 38px;
      display: grid;
      place-items: center;
      color: white;
      background: var(--brand);
      border-radius: 12px;
      box-shadow: 0 8px 16px rgba(51, 78, 140, .22);
    }

    .brand-mark svg, .info-brand-mark svg { width: 25px; height: 25px; display: block; }

    .header-tag {
      color: var(--muted);
      font-size: .84rem;
      font-weight: 650;
    }

    .page { padding: 54px 0 70px; }

    .hero {
      max-width: 820px;
      margin: 0 auto 28px;
      text-align: center;
    }

    .eyebrow {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      margin: 0 0 14px;
      padding: 7px 12px;
      color: var(--brand-dark);
      background: var(--brand-soft);
      border: 1px solid #D7DEEA;
      border-radius: 999px;
      font-size: .78rem;
      font-weight: 800;
      letter-spacing: .06em;
      text-transform: uppercase;
    }

    h1, h2, h3, p { margin-top: 0; }
    h1 {
      margin-bottom: 14px;
      font-size: clamp(2.1rem, 5.5vw, 4rem);
      line-height: 1.03;
      letter-spacing: -.055em;
    }

    .hero strong { color: var(--brand); }
    .hero > p {
      max-width: 680px;
      margin: 0 auto;
      color: var(--muted);
      font-size: clamp(1rem, 2vw, 1.15rem);
    }

    .trust-row {
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      gap: 10px 18px;
      margin-top: 20px;
      color: #475467;
      font-size: .88rem;
      font-weight: 700;
    }

    .trust-row span::before { content: "✓"; color: var(--ok); margin-right: 6px; }

    .ad-slot {
      min-height: 76px;
      display: grid;
      place-items: center;
      margin: 26px auto;
      padding: 12px;
      color: #98A2B3;
      background: rgba(255,255,255,.65);
      border: 1px dashed #D7DEEA;
      border-radius: 14px;
      text-align: center;
      font-size: .75rem;
      letter-spacing: .07em;
      text-transform: uppercase;
    }

    .workspace {
      overflow: hidden;
      background: var(--paper);
      border: 1px solid var(--line);
      border-radius: 26px;
      box-shadow: var(--shadow);
    }

    .audience-tabs {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 8px;
      padding: 10px;
      background: #EEF2FF;
      border-bottom: 1px solid var(--line);
    }

    .audience-tab {
      min-height: 58px;
      padding: 10px 16px;
      color: #667085;
      background: transparent;
      border: 0;
      border-radius: 15px;
      font-weight: 800;
      transition: .18s ease;
    }

    .audience-tab small {
      display: block;
      margin-top: 2px;
      font-size: .74rem;
      font-weight: 600;
      opacity: .82;
    }

    .audience-tab[aria-selected="true"] {
      color: var(--brand-dark);
      background: white;
      box-shadow: 0 5px 16px rgba(38, 59, 106, .09);
    }

    .panel { display: none; padding: clamp(20px, 4vw, 38px); }
    .panel.active { display: block; }

    .tool-nav {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      margin-bottom: 28px;
    }

    .tool-tab {
      padding: 9px 14px;
      color: #667085;
      background: white;
      border: 1px solid var(--line);
      border-radius: 999px;
      font-size: .87rem;
      font-weight: 750;
    }

    .tool-tab.active {
      color: white;
      background: var(--brand);
      border-color: var(--brand);
    }

    .tool-view { display: none; }
    .tool-view.active { display: block; }

    .section-heading {
      display: flex;
      align-items: flex-start;
      justify-content: space-between;
      gap: 18px;
      margin-bottom: 22px;
    }

    .section-heading h2 {
      margin-bottom: 6px;
      font-size: clamp(1.35rem, 3vw, 2rem);
      letter-spacing: -.035em;
    }

    .section-heading p { margin: 0; color: var(--muted); }

    .badge {
      flex: 0 0 auto;
      padding: 6px 10px;
      color: var(--brand-dark);
      background: var(--brand-soft);
      border-radius: 999px;
      font-size: .73rem;
      font-weight: 850;
    }

    .grid { display: grid; gap: 18px; }
    .grid.two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .grid.three { grid-template-columns: repeat(3, minmax(0, 1fr)); }

    .field { min-width: 0; }
    .field label, .field-label {
      display: block;
      margin-bottom: 7px;
      font-size: .82rem;
      font-weight: 800;
    }

    .field small {
      display: block;
      margin-top: 6px;
      color: var(--muted);
      font-size: .73rem;
    }

    input, select, textarea {
      width: 100%;
      color: var(--ink);
      background: #FFFFFF;
      border: 1px solid #D7DEEA;
      border-radius: 12px;
      outline: 0;
      transition: border-color .18s, box-shadow .18s, background .18s;
    }

    input, select { min-height: 46px; padding: 9px 12px; }
    textarea { min-height: 182px; padding: 13px; resize: vertical; }
    input:focus, select:focus, textarea:focus {
      background: white;
      border-color: var(--brand);
      box-shadow: 0 0 0 4px rgba(51, 78, 140, .12);
    }

    .quick-picks { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 9px; }
    .chip {
      padding: 6px 10px;
      color: var(--brand-dark);
      background: var(--brand-soft);
      border: 1px solid #D7DEEA;
      border-radius: 999px;
      font-size: .75rem;
      font-weight: 800;
    }

    details.advanced {
      margin-top: 18px;
      padding: 14px 16px;
      background: #F8FAFC;
      border: 1px solid var(--line);
      border-radius: 14px;
    }

    details.advanced summary { cursor: pointer; font-size: .87rem; font-weight: 800; }
    details.advanced[open] summary { margin-bottom: 16px; }

    .actions { display: flex; flex-wrap: wrap; gap: 10px; margin: 22px 0; }
    .button {
      min-height: 44px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      padding: 9px 15px;
      color: var(--ink);
      background: white;
      border: 1px solid var(--line);
      border-radius: 12px;
      font-weight: 800;
    }

    .button.primary { color: white; background: var(--brand); border-color: var(--brand); }
    .button.primary:hover { background: var(--brand-dark); }
    .button.ghost:hover { background: #F6F7FB; }
    .button.danger { color: var(--danger); }

    .notice {
      margin: 18px 0;
      padding: 13px 15px;
      color: #344054;
      background: var(--brand-soft);
      border-left: 4px solid var(--brand);
      border-radius: 10px;
      font-size: .88rem;
    }

    .notice.error { color: #B4233C; background: var(--danger-soft); border-left-color: var(--danger); }
    [hidden], .hidden { display: none !important; }

    .sr-only {
      position: absolute;
      width: 1px;
      height: 1px;
      padding: 0;
      margin: -1px;
      overflow: hidden;
      clip: rect(0, 0, 0, 0);
      white-space: nowrap;
      border: 0;
    }

    .result-card {
      margin-top: 22px;
      padding: 20px;
      background: linear-gradient(145deg, #F8FAFC, #EEF2FF);
      border: 1px solid #D7DEEA;
      border-radius: 18px;
    }

    .result-lead { color: var(--muted); font-size: .82rem; font-weight: 750; }
    .result-value {
      margin: 3px 0;
      color: var(--brand-dark);
      font-size: clamp(2rem, 6vw, 3.4rem);
      font-weight: 900;
      letter-spacing: -.06em;
      line-height: 1.05;
    }
    .result-value.outcome-value {
      font-size: clamp(1.45rem, 4vw, 2.4rem);
      letter-spacing: -.035em;
    }
    .result-value.outcome-value.success { color: var(--ok); }
    .result-value.outcome-value.failure { color: var(--danger); }

    .result-note { margin: 0; color: var(--muted); font-size: .88rem; }

    .stats {
      display: grid;
      grid-template-columns: repeat(5, minmax(0, 1fr));
      gap: 10px;
      margin: 18px 0;
    }

    .stat {
      min-width: 0;
      padding: 14px;
      background: #F8FAFC;
      border: 1px solid var(--line);
      border-radius: 14px;
    }

    .stat span { display: block; color: var(--muted); font-size: .7rem; font-weight: 750; text-transform: uppercase; }
    .stat strong { display: block; margin-top: 3px; font-size: 1.25rem; }
    .course-stats { display: grid; gap: 10px; margin: 18px 0; }
    .course-primary-stats { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .course-secondary-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 0; }
    .course-stat-secondary { padding: 10px 12px; }
    .course-summary-bar {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      margin: 0 0 12px;
    }
    .course-summary { margin: 0; color: var(--muted); font-size: .84rem; font-weight: 850; }
    .course-summary-bar .button, .bulk-input-panel > .button { min-height: 44px; }
    .bulk-input-panel[hidden] { display: none; }
    .bulk-input-panel {
      margin-bottom: 14px;
      padding: 16px;
      background: #FFFFFF;
      border: 1px solid var(--line);
      border-radius: 17px;
    }
    .bulk-input-panel .procedure-list { margin-bottom: 10px; }
    .bulk-input-panel .example-line { margin-bottom: 12px; }
    .bulk-input-panel textarea { min-height: 130px; }
    .bulk-input-panel .actions { margin-top: 12px; }
    .bulk-input-panel > .button { margin-top: 12px; }
    .level-distribution { margin: 18px 0; }
    .level-distribution h3 { margin: 0 0 9px; font-size: .86rem; }
    .level-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
    .level-card { min-width: 0; padding: 10px 11px; border: 1px solid var(--line); border-radius: 12px; }
    .level-card strong { display: block; font-size: .82rem; line-height: 1.2; overflow-wrap: anywhere; }
    .level-card span { display: block; margin-top: 4px; color: var(--muted); font-size: .78rem; font-weight: 750; }
    .level-support { background: #FFF0EC; border-color: #F2B8A9; }
    .level-developing { background: #FFF7D6; border-color: #E8D28A; }
    .level-expected { background: #EEF2FF; border-color: #C5D0EE; }
    .level-outstanding { background: #EEF2FF; border-color: #B8C5E6; }
    .result-badge { display: inline-block; padding: 4px 8px; border: 1px solid transparent; border-radius: 999px; font-size: .75rem; font-weight: 800; line-height: 1.2; white-space: normal; }
    .result-badge.approved { color: #334E8C; background: #EEF2FF; border-color: #B8C5E6; }
    .result-badge.support { color: #B4233C; background: #FFF0EC; border-color: #F2B8A9; }
    .result-badge.developing { color: #9A6700; background: #FFF7D6; border-color: #E8D28A; }
    .result-badge.expected { color: #334E8C; background: #EEF2FF; border-color: #C5D0EE; }
    .result-badge.outstanding { color: #334E8C; background: #EEF2FF; border-color: #B8C5E6; }
    .mobile-status { display: none; }
    .bulk-results .table-shell { width: 100%; }
    .bulk-results .table-actions { display: flex; flex-wrap: nowrap; gap: 6px; margin: 0 0 10px; }
    .bulk-results .table-actions .button { min-width: 0; min-height: 44px; flex: 1 1 0; padding: 7px 9px; font-size: .76rem; white-space: nowrap; }

    .table-shell {
      overflow: auto;
      max-height: 480px;
      border: 1px solid var(--line);
      border-radius: 15px;
    }

    table { width: 100%; border-collapse: collapse; font-size: .87rem; }
    th, td { padding: 8px 10px; border-bottom: 1px solid #D7DEEA; text-align: left; white-space: nowrap; }
    th {
      position: sticky;
      top: 0;
      z-index: 2;
      color: #475467;
      background: #EEF2FF;
      font-size: .74rem;
      text-transform: uppercase;
      letter-spacing: .04em;
    }
    tr:last-child td { border-bottom: 0; }
    tr.passing td:last-child, .passing-note { color: var(--ok); font-weight: 850; }
    tr.failing td:last-child, .failing-note { color: var(--danger); font-weight: 850; }

    .split-layout {
      display: grid;
      grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr);
      gap: 22px;
      align-items: start;
    }

    .scale-table-column { min-width: 0; }
    #scaleTool > .section-heading { margin-bottom: 14px; }
    #scaleTool > .section-heading h2 { font-size: clamp(1.2rem, 2.5vw, 1.7rem); }
    .scale-summary-bar {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      margin-bottom: 10px;
    }
    .scale-view-summary { margin: 0; color: var(--muted); font-size: .82rem; font-weight: 800; }
    .scale-summary-bar .button { min-height: 44px; padding: 7px 11px; font-size: .78rem; white-space: nowrap; }
    #scaleConfigToggle:focus-visible, #scaleConfigDone:focus-visible { outline: 3px solid rgba(51, 78, 140, .35); outline-offset: 2px; }
    .scale-config-panel[hidden] { display: none; }
    .scale-config-panel {
      margin-bottom: 12px;
      padding: 16px;
      background: #F8FAFC;
      border: 1px solid var(--line);
      border-radius: 16px;
    }
    .scale-basic-config {
      display: grid;
      grid-template-columns: minmax(160px, .7fr) minmax(0, 1.3fr);
      gap: 16px;
    }
    .scale-config-panel .quick-picks { margin-top: 8px; }
    .scale-config-panel > .button { min-height: 44px; margin-top: 16px; }
    .scale-config-panel #scaleSummary { margin-bottom: 0; }
    .scale-table-grid {
      display: grid;
      grid-template-columns: repeat(5, minmax(0, 1fr));
      gap: 12px;
      overflow: visible;
    }
    .scale-table-block {
      min-width: 0;
      overflow: hidden;
      background: #FFFFFF;
      border: 1px solid var(--line);
      border-radius: 15px;
    }
    .scale-table-block table { font-size: .82rem; }
    .scale-table-block th, .scale-table-block td { padding: 6px 8px; }
    .scale-table-block th { position: static; }
    .table-description { margin: 8px 0 0; color: var(--muted); font-size: .76rem; }
    .scale-pagination {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      margin-top: 12px;
    }
    .scale-pagination[hidden] { display: none; }
    .scale-pagination .button { min-height: 40px; padding: 6px 10px; font-size: .78rem; }
    .scale-pagination-label { min-width: 90px; color: var(--muted); font-size: .78rem; font-weight: 800; text-align: center; }
    .procedure-list { margin: 0 0 14px; padding-left: 20px; color: var(--muted); font-size: .84rem; }
    .procedure-list li + li { margin-top: 4px; }
    .example-line { margin: 0 0 16px; color: var(--muted); font-size: .82rem; }
    .example-line code { padding: 3px 6px; color: var(--brand-dark); background: var(--brand-soft); border-radius: 6px; font-family: inherit; font-weight: 800; }
    .table-toolbar {
      display: flex;
      align-items: center;
      gap: 8px;
      margin: 0 0 10px;
    }
    .scale-table-column .table-actions {
      min-width: 0;
      flex: 1 1 auto;
      flex-wrap: nowrap;
      gap: 6px;
      margin: 0;
    }
    .scale-table-column .table-actions .button {
      min-width: 0;
      min-height: 44px;
      padding: 7px 9px;
      font-size: .76rem;
      white-space: nowrap;
    }
    .pdf-hint { display: none; }
    .print-only { display: none; }

    .paste-card, .output-card {
      padding: 18px;
      border: 1px solid var(--line);
      border-radius: 17px;
    }
    .paste-card { background: #FFFFFF; }

    .sample-link {
      padding: 0;
      color: var(--brand);
      background: none;
      border: 0;
      font-size: .78rem;
      font-weight: 800;
      text-decoration: underline;
    }

    .grade-rows { display: grid; gap: 10px; }
    .grade-row {
      display: grid;
      grid-template-columns: 1fr 1fr 44px;
      gap: 10px;
      align-items: end;
    }

    .icon-button {
      width: 44px;
      height: 46px;
      display: grid;
      place-items: center;
      color: var(--danger);
      background: white;
      border: 1px solid var(--line);
      border-radius: 12px;
      font-size: 1.15rem;
    }

    .progress-track {
      height: 9px;
      overflow: hidden;
      margin: 12px 0 7px;
      background: #D7DEEA;
      border-radius: 999px;
    }
    .progress-fill { width: 0; height: 100%; background: var(--brand); border-radius: inherit; transition: width .2s; }

    .explain-grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 16px;
      margin-top: 30px;
    }
    .explain-card {
      padding: 18px;
      background: white;
      border: 1px solid var(--line);
      border-radius: 16px;
    }
    .explain-card b { display: block; margin-bottom: 6px; }
    .explain-card p { margin: 0; color: var(--muted); font-size: .84rem; }

    .faq { margin-top: 34px; }
    .faq h2 { font-size: 1.35rem; }
    .faq details { padding: 14px 0; border-bottom: 1px solid var(--line); }
    .faq summary { cursor: pointer; font-weight: 800; }
    .faq details p { margin: 10px 0 0; color: var(--muted); }

    footer { color: #EEF2FF; background: #263B6A; }
    .footer-inner {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 22px;
      padding: 30px 0;
    }
    .footer-inner p { margin: 3px 0 0; color: #D7DEEA; font-size: .82rem; }
    .footer-links { display: flex; flex-wrap: wrap; gap: 8px; }
    .footer-links a { color: #EEF2FF; text-decoration: underline; }

    .toast {
      position: fixed;
      right: 20px;
      bottom: 20px;
      z-index: 60;
      padding: 12px 16px;
      color: white;
      background: #263B6A;
      border-radius: 12px;
      box-shadow: var(--shadow);
      font-size: .85rem;
      font-weight: 750;
      transform: translateY(20px);
      opacity: 0;
      pointer-events: none;
      transition: .2s ease;
    }
    .toast.show { transform: none; opacity: 1; }

    @media (max-width: 760px) {
      .header-tag { display: none; }
      .page { padding-top: 36px; }
      .grid.two, .grid.three, .split-layout, .explain-grid { grid-template-columns: 1fr; }
      .stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
      .section-heading { display: block; }
      .section-heading .badge { display: inline-block; margin-top: 10px; }
      .footer-inner { align-items: flex-start; flex-direction: column; }
    }

    @media (max-width: 1199px) {
      .scale-table-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
      .chip, .sample-link, .tool-tab, .scale-pagination .button { min-height: 44px; }
      .chip, .sample-link { display: inline-flex; align-items: center; justify-content: center; }
      .chip { padding: 6px 10px; }
      .sample-link { padding: 9px 0; }
      .pdf-hint { display: block; margin: -2px 0 10px; color: var(--muted); font-size: .74rem; }
    }

    @media (max-width: 900px) {
      .scale-table-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
      .scale-basic-config { grid-template-columns: 1fr; }
      .table-toolbar { flex-wrap: nowrap; }
      .scale-table-column .table-actions { flex: 1 1 auto; }
      .scale-table-column .table-actions { flex-wrap: wrap; }
      .scale-table-column .table-actions .button { flex: 1 1 18%; }
      .course-primary-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
      .level-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    }

    @media (max-width: 480px) {
      .header-inner, .page, .footer-inner { width: min(100% - 20px, 1120px); }
      .page { padding-bottom: 44px; }
      .workspace { border-radius: 20px; }
      .panel { padding: 18px 14px 24px; }
      .audience-tab { padding-inline: 8px; }
      .grade-row { grid-template-columns: 1fr 1fr 40px; gap: 7px; }
      th, td { padding: 9px 10px; }
      .scale-table-grid { grid-template-columns: 1fr; }
      .table-toolbar { flex-wrap: wrap; }
      .scale-table-column .table-actions { flex: 1 1 100%; }
      .scale-table-column .table-actions .button { flex: 1 1 30%; }
      .scale-summary-bar { align-items: flex-start; flex-wrap: wrap; }
      .scale-basic-config { grid-template-columns: 1fr; }
      .course-primary-stats, .course-secondary-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
      .course-summary-bar { align-items: flex-start; flex-wrap: wrap; }
      .level-grid { grid-template-columns: 1fr 1fr; }
      .bulk-results th.course-status-column, .bulk-results td.course-status-column { display: none; }
      .bulk-results table { table-layout: fixed; }
      .bulk-results th:first-child, .bulk-results td:first-child,
      .bulk-results th:last-child, .bulk-results td:last-child {
        white-space: normal;
        word-break: normal;
        overflow-wrap: normal;
      }
      .bulk-results th:first-child, .bulk-results td:first-child { width: 52%; }
      .bulk-results th:nth-child(2), .bulk-results td:nth-child(2) { width: 14%; }
      .bulk-results th:nth-child(4), .bulk-results td:nth-child(4) { width: 34%; }
      .bulk-results th:nth-child(2), .bulk-results .course-note-column {
        text-align: center;
        white-space: nowrap;
        word-break: normal;
        overflow-wrap: normal;
        vertical-align: top;
      }
      .bulk-results .course-name-column, .bulk-results td:last-child {
        word-break: normal;
        overflow-wrap: normal;
      }
      .bulk-results .mobile-status {
        display: block;
        width: fit-content;
        max-width: 100%;
        margin-top: 3px;
        padding: 2px 5px;
        font-size: .68rem;
        line-height: 1.15;
        white-space: normal;
        word-break: normal;
        overflow-wrap: normal;
      }
      .bulk-results .table-actions { flex-wrap: wrap; }
      .bulk-results .table-actions .button { flex: 1 1 30%; }
    }

    @media print {
      @page { size: A4 portrait; margin: 14mm; }
      body { background: white; }
      .site-header, .hero, .ad-slot, .audience-tabs, .tool-nav, .actions, .explain-grid, .faq, footer, .toast, .no-print { display: none !important; }
      .page { width: 100%; padding: 0; }
      .workspace { border: 0; box-shadow: none; }
      .panel { display: none !important; padding: 0; }
      .panel.active, .tool-view.active { display: block !important; }
      .bulk-input, .section-heading, .procedure-list, .example-line, .instructions, .scale-summary-bar, .scale-config-panel, .course-summary-bar { display: none !important; }
      .scale-table-column, .bulk-results { width: 100%; }
      .table-shell { max-height: none; overflow: visible; border-color: #aaa; }
      th { position: static; }
      thead { display: table-header-group; }
      tr { break-inside: avoid; }
      .stats, .print-only { break-inside: avoid; }
      .print-only { display: block; }
      .print-title { margin-bottom: 12px; }
      .print-title h1 { margin: 0 0 4px; font-size: 1.5rem; }
      .print-title p { margin: 0 0 5px; color: #444; font-size: .85rem; }
      .table-description { display: none !important; }
      .scale-table-grid.print-layout { display: block; width: 100%; min-width: 0; }
      .scale-print-page { width: 100%; min-width: 0; break-inside: avoid; page-break-inside: avoid; }
      .scale-print-page:not(:last-child) { break-after: page; page-break-after: always; }
      .scale-print-grid {
        width: 100%;
        min-width: 0;
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 6px;
      }
      .scale-print-grid .scale-table-block,
      .scale-print-grid table {
        width: 100%;
        min-width: 0;
      }
      .scale-print-grid .scale-table-block { overflow: hidden; break-inside: avoid; page-break-inside: avoid; }
      .scale-print-grid table { table-layout: fixed; font-size: 8pt; }
      .scale-print-grid th,
      .scale-print-grid td {
        min-width: 0;
        padding: 3px 4px;
        white-space: normal;
        word-break: normal;
        overflow-wrap: normal;
        line-height: 1.2;
      }
      .scale-print-grid th:nth-child(1), .scale-print-grid td:nth-child(1) { width: 36%; }
      .scale-print-grid th:nth-child(2), .scale-print-grid td:nth-child(2) { width: 38%; }
      .scale-print-grid th:nth-child(3), .scale-print-grid td:nth-child(3) { width: 26%; }
      .scale-print-grid tr { break-inside: avoid; page-break-inside: avoid; }
    }

    .info-page {
      min-height: 100vh;
      display: flex;
      flex-direction: column;
    }
    .info-header {
      border-bottom: 1px solid rgba(215, 222, 234, .9);
      background: rgba(255, 255, 255, .9);
    }
    .info-header-inner,
    .info-main,
    .info-footer-inner {
      width: min(920px, calc(100% - 32px));
      margin-inline: auto;
    }
    .info-header-inner {
      min-height: 68px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 18px;
    }
    .info-brand {
      display: inline-flex;
      align-items: center;
      gap: 10px;
      color: var(--ink);
      font-size: 1.18rem;
      font-weight: 850;
      letter-spacing: -.03em;
      text-decoration: none;
    }
    .info-brand-mark {
      width: 38px;
      height: 38px;
      display: grid;
      place-items: center;
      color: white;
      background: var(--brand);
      border-radius: 12px;
      box-shadow: 0 8px 16px rgba(51, 78, 140, .22);
    }
    .info-home-link {
      color: var(--brand-dark);
      font-size: .88rem;
      font-weight: 800;
    }
    .info-main {
      flex: 1;
      padding: 46px 0 64px;
    }
    .info-card {
      padding: clamp(22px, 4vw, 42px);
      background: var(--paper);
      border: 1px solid var(--line);
      border-radius: 24px;
      box-shadow: var(--shadow);
    }
    .info-card h1 {
      margin-bottom: 12px;
      color: var(--ink);
      font-size: clamp(2rem, 5vw, 3.25rem);
      letter-spacing: -.05em;
      line-height: 1.08;
    }
    .info-intro {
      max-width: 720px;
      margin-bottom: 30px;
      color: var(--muted);
      font-size: 1.08rem;
    }
    .info-section {
      padding-top: 24px;
      border-top: 1px solid var(--line);
    }
    .info-section + .info-section { margin-top: 24px; }
    .info-section h2 {
      margin-bottom: 9px;
      color: var(--brand-dark);
      font-size: 1.25rem;
      letter-spacing: -.025em;
    }
    .info-section p { color: #344054; }
    .info-list {
      display: grid;
      gap: 8px;
      margin: 0;
      padding-left: 22px;
      color: #344054;
    }
    .info-list li::marker { color: var(--brand); }
    .info-notice {
      margin: 22px 0 28px;
      padding: 16px 18px;
      color: var(--brand-dark);
      background: var(--brand-soft);
      border-left: 4px solid var(--brand);
      border-radius: 10px;
      font-weight: 800;
    }
    .legal-updated {
      margin: 0 0 26px;
      color: var(--muted);
      font-size: .84rem;
      font-weight: 750;
    }
    .info-footer {
      color: #EEF2FF;
      background: #263B6A;
    }
    .info-footer-inner {
      display: flex;
      align-items: flex-start;
      justify-content: space-between;
      gap: 24px;
      padding: 28px 0;
    }
    .info-footer p { margin: 4px 0 0; color: #D7DEEA; font-size: .82rem; }
    .info-footer-links {
      display: flex;
      flex-wrap: wrap;
      justify-content: flex-end;
      gap: 8px 14px;
    }
    .info-footer-links a { color: #EEF2FF; font-size: .86rem; text-decoration: underline; }

    @media (max-width: 620px) {
      .info-header-inner { align-items: flex-start; flex-direction: column; padding: 14px 0; }
      .info-main { padding: 24px 0 38px; }
      .info-card { border-radius: 18px; }
      .info-footer-inner { flex-direction: column; }
      .info-footer-links { justify-content: flex-start; }
    }

    @media print {
      .info-page { background: white; }
      .info-header { border: 0; background: white; }
      .info-header .info-home-link, .info-footer, .info-page .eyebrow { display: none; }
      .info-header-inner, .info-main { width: 100%; }
      .info-main { padding: 0; }
      .info-card { padding: 0; border: 0; box-shadow: none; }
      .info-card h1 { margin-bottom: 18px; font-size: 24pt; }
      .info-section { break-inside: avoid; page-break-inside: avoid; }
      .info-section + .info-section { margin-top: 18px; }
      .info-section h2 { color: #111; }
      .info-section p, .info-list { color: #111; }
      .info-notice { color: #111; background: white; border: 1px solid #999; }
    }

    .learning-links {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 20px;
      margin: 24px 0 30px;
      padding: 20px 22px;
      background: var(--paper);
      border: 1px solid var(--line);
      border-radius: 16px;
      box-shadow: 0 8px 24px rgba(38, 59, 106, .06);
    }
    .learning-links .eyebrow { margin-bottom: 7px; padding: 5px 9px; font-size: .68rem; }
    .learning-links h2 { margin-bottom: 4px; font-size: 1.2rem; }
    .learning-links p { margin-bottom: 0; color: var(--muted); }
    .learning-links-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }

    .info-index {
      margin: 24px 0 4px;
      padding: 18px 20px;
      background: var(--brand-soft);
      border-radius: 12px;
    }
    .info-index ol { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px 28px; margin: 8px 0 0; padding-left: 22px; }
    .info-index a, .info-actions a { color: var(--brand-dark); font-weight: 750; }
    .info-example {
      margin: 16px 0;
      padding: 14px 16px;
      background: #F8FAFC;
      border: 1px solid var(--line);
      border-left: 4px solid var(--accent);
      border-radius: 10px;
    }
    .info-example p { margin: 4px 0 0; color: #344054; }
    .info-warning {
      padding: 13px 15px;
      color: #6B4F00 !important;
      background: #FFF7D6;
      border: 1px solid #E8D28A;
      border-radius: 10px;
    }
    .info-actions { margin: 28px 0 0; }
    .info-faq-list details {
      margin: 0;
      border-bottom: 1px solid var(--line);
    }
    .info-faq-list details:first-child { border-top: 1px solid var(--line); }
    .info-faq-list summary {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 14px;
      min-height: 52px;
      padding: 14px 2px;
      color: var(--brand-dark);
      cursor: pointer;
      font-weight: 800;
      list-style: none;
    }
    .info-faq-list summary::-webkit-details-marker { display: none; }
    .info-faq-list summary::after { content: "+"; flex: 0 0 auto; font-size: 1.25rem; font-weight: 500; }
    .info-faq-list details[open] summary::after { content: "−"; }
    .info-faq-list summary:focus-visible { outline: 3px solid rgba(47, 111, 237, .35); outline-offset: 3px; border-radius: 4px; }
    .info-faq-list details > p { margin: 0 28px 16px 2px; color: #344054; }

    @media (max-width: 700px) {
      .learning-links { align-items: flex-start; flex-direction: column; }
      .learning-links-actions { justify-content: flex-start; width: 100%; }
      .info-index ol { grid-template-columns: 1fr; }
    }

    @media print {
      .learning-links { display: none !important; }
      .info-index { background: white; border: 1px solid #999; }
      .info-example, .info-warning { break-inside: avoid; page-break-inside: avoid; }
      .info-faq-list details { break-inside: avoid; page-break-inside: avoid; }
      .info-faq-list summary::after { display: none; }
    }