:root { --muted: #59677b; }

.topbar { position: relative; }
.brand-copy { display: grid; gap: 4px; line-height: 1.25; }
.brand-copy strong { font-size: inherit; }
.brand-copy small { color: var(--muted); font-size: 12px; font-weight: 500; letter-spacing: 0; }
.footer-brand { display: grid; gap: 6px; }
footer .footer-brand b { color: var(--ink); font-size: 14px; }
.intake-entry .intake-note { font-size: 14px; }
.footer-brand a, .intake-entry .intake-note a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }
.intake-entry .intake-note a:focus-visible { outline: 3px solid #3564f5; outline-offset: 4px; }
.contact .intake-entry .intake-note a:focus-visible { outline-color: #ffdc80; }
.nav-toggle { display: none; }
.hero-files { margin: 18px 0 0; font-size: 14px; }
.hero-files a { color: #315bad; font-weight: 600; }

@media screen {
  .sample-panel > .sample-takeaway { margin: 0 0 24px; }
  .hero-note, .report-kicker, .decision p, .benefit-grid span,
  .service-result p, .core-note, .method-steps p,
  .theory-body p, .stock-method .method-note, .sheet-title p,
  .report-figure figcaption, .sample-takeaway small, .sample-note,
  .input-card .input-label, .input-card .requires,
  .extras p, .process-step p, .faq details p, .download-entry p,
  .guide-purpose p, .guide-menu-help, .guide-panel-intro,
  .guide-meta dd, .guide-step p, .screen-detail figcaption, .guide-fields p,
  .guide-note, .guide-optional .guide-optional-intro, .guide-followup p,
  .submission-item p, .guide-footer-note, .file-prep-heading p,
  .file-item-note, .file-prep-empty, .file-prep-note {
    color: var(--muted);
    font-size: 14px;
    line-height: 1.85;
  }

  .section-tag, .report-top small, .sheet-toolbar .mini-label, .sample-badge, .tag,
  .input-card .index, .report-actions, .report-tabs button,
  .guide-breadcrumb, .guide-eyebrow, .guide-panel-kicker,
  .guide-format, .guide-meta dt, .guide-menu button small,
  .guide-mobile-nav label, .screen-detail .screen-label, .field-tags span,
  .file-program-field label span, .file-prep-result h3, .file-requirement,
  .file-item-program, .file-guide-link, footer, footer b {
    font-size: 12px;
  }

  .report-top small, .report-kicker, .sheet-toolbar .mini-label, .report-actions,
  .guide-breadcrumb, .guide-breadcrumb a, .guide-menu-help, .guide-meta dt,
  .guide-mobile-nav label, .file-program-field label span,
  .file-item-program, .file-requirement.optional, footer, footer b {
    color: var(--muted);
  }

  .section-lead, .stock-method .method-intro, .sample-takeaway p,
  .input-card .input-desc, .guide-intro, .file-prep-result h3 { color: var(--muted); }

  .sample-badge, .tag, .input-card .index, .workspace-label::after,
  .report-open, .viewer-bar button, .guide-panel-kicker, .guide-format,
  .screen-detail .screen-label, .screen-viewer-bar button, .field-tags span,
  .file-guide-link, .file-requirement, .purpose-row span { color: #315bad; }

  .canister-cost .cost-kicker, .canister-cost .cost-note, .cost-main > span,
  .guide-warning strong, .guide-warning p, .guide-setting h4, .setting-checks li {
    font-size: 14px;
    color: #6e5b32;
  }

  .stock-method .method-kicker { color: #315bad; font-size: 12px; }
  .workspace-label::after { font-size: 12px; }
  .hero-report-link::after { font-size: 12px; }
  .example-tabs button:not([aria-selected="true"]),
  .report-tabs button:not([aria-pressed="true"]) { color: var(--muted); }
  .guide-menu button small { color: #6e5b32; }
  .contact p, .contact-guide ol, .contact-guide .contact-note { color: #fff; font-size: 14px; }
  .contact .intake-entry .intake-note, .contact .intake-entry .intake-privacy { font-size: 14px; }
  .nav-cta, .report-open, .viewer-bar button, .screen-viewer-bar button { min-height: 44px; }
  .report-open, .viewer-bar button, .screen-viewer-bar button { font-size: 14px; }
  .report-tabs button, .example-tabs button { min-height: 44px; }
}

@media screen and (max-width: 800px) {
  .topbar { height: auto; min-height: 78px; flex-wrap: wrap; }
  header .topbar nav {
    display: flex;
    flex: 1 0 100%;
    align-items: stretch;
    flex-direction: column;
    gap: 4px;
    padding: 12px;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 12px;
    box-shadow: 0 12px 30px #191c2514;
  }
  header .topbar nav a:not([hidden]) {
    display: flex;
    align-items: center;
    min-height: 44px;
    padding: 10px 14px;
    font-size: 14px;
    border-radius: 8px;
  }
  header .topbar nav a:not(.nav-cta):hover { background: var(--wash); }
  header.navigation-ready .topbar { height: 78px; flex-wrap: nowrap; }
  header.navigation-ready .nav-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 64px;
    min-height: 44px;
    padding: 8px 14px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #fff;
    color: var(--ink);
    font-size: 14px;
    font-weight: 700;
  }
  header.navigation-ready .nav-toggle[aria-expanded="true"] { background: var(--wash); }
  header.navigation-ready .topbar nav {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    max-height: calc(100dvh - 95px);
    overflow-y: auto;
  }
  header.navigation-ready nav:not(.is-open) { display: none; }
}

@media screen and (max-width: 600px) {
  header.navigation-ready .topbar { height: 68px; }
  .hero-lead { font-size: 16px; }
  .hero .eyebrow, .workspace-label, .sheet-toolbar, .example-tabs button,
  .service-label, .service-number, .sheet-toolbar > span:nth-child(2), .purpose-row { font-size: 12px; }
  .stock-method .method-intro, .sample-takeaway p, .guide-intro { font-size: 14px; }
  .hero .button, .contact .button, .guide-mobile-nav select,
  .file-program-field select { font-size: 14px; }
}

.mobile-contact { display: none; }
.breadcrumb { display: flex; flex-wrap: wrap; gap: 10px; font-size: 14px; }
.guide-breadcrumb a[href] { display: inline; }
.usage-examples { margin-top: 32px; }
.usage-examples .input-card { background: #fff; }
.usage-examples h3 { font-size: 20px; }
.usage-examples p { color: var(--muted); font-size: 14px; }
.faq summary { min-height: 44px; display: list-item; padding-block: 8px; }
.error-page { margin: 0; color: #191c25; background: #f6f8fc; font-family: "Malgun Gothic", "Apple SD Gothic Neo", Arial, sans-serif; line-height: 1.8; word-break: keep-all; }
.error-page .wrap { width: min(1040px, calc(100% - 40px)); margin: auto; }
.error-page header, .error-page footer { padding: 24px 0; background: #fff; }
.error-page .brand { color: #3564f5; font-size: 22px; font-weight: 800; }
.error-page main { padding-block: 72px; }
.error-page h1 { font-size: clamp(28px, 5vw, 40px); line-height: 1.4; }
.error-page nav { display: flex; gap: 12px; flex-wrap: wrap; }
.error-page .button { display: inline-flex; align-items: center; min-height: 48px; padding: 10px 18px; border: 1px solid #dce5fa; border-radius: 11px; background: #fff; color: #2452ce; }
.error-page .primary { background: #3564f5; color: #fff; }
.error-page a:focus-visible { outline: 3px solid #3564f5; outline-offset: 4px; }
.error-page .skip { position: absolute; top: -80px; padding: 12px; background: #fff; }
.error-page .skip:focus { top: 8px; }

@media screen and (max-width: 800px) {
  body.has-mobile-contact { padding-bottom: calc(88px + env(safe-area-inset-bottom, 0px)); }
  html { scroll-padding-bottom: calc(108px + env(safe-area-inset-bottom, 0px)); }
  .mobile-contact:not([hidden]) { display: block; position: fixed; inset: auto 0 0; z-index: 19; padding: 12px 18px calc(12px + env(safe-area-inset-bottom, 0px)); background: #fff; border-top: 1px solid var(--line); box-shadow: 0 -4px 18px #191c2510; }
  .mobile-contact .button { display: flex; width: 100%; min-height: 48px; padding: 12px 18px; background: #3564f5; color: #fff; font-size: 14px; }
  .mobile-contact .button:focus-visible { outline: 3px solid #183250; outline-offset: 3px; }
}

@media print { .mobile-contact { display: none!important; } }
