/* CareerLift's screen palette. Printed resume pages keep their existing styles. */
@media screen {
  :root {
    --green: #215e4c;
    --green-dark: #123f34;
    --ink: #203c31;
    --muted: #62735e;
    --line: #cbd8c6;
    --cream: #e9eee5;
    --sage: #dbe7d6;
    --orange: #ad7b3d;
  }

  body, .seo-document {
    background: radial-gradient(ellipse at 95% 15%, #d9e7de 0, transparent 42%),
      linear-gradient(135deg, #edf0e5, #e4ece3 58%, #ececde);
  }

  .site-header {
    background: #123f35;
    border-bottom-color: #356455;
    box-shadow: 0 3px 16px #123f3514;
  }
  .site-header .brand, .seo-footer .brand { color: #fff8e9; }
  .site-header .brand-lift, .site-header .brand-dot,
  .seo-footer .brand-lift, .seo-footer .brand-dot { color: #edc38a; }
  .site-header .brand-wordmark small, .seo-footer .brand-wordmark small { color: #c3d4bd; }
  .site-header .brand-icon, .seo-footer .brand-icon {
    color: #fff8e9;
    background: #ffffff0d;
    border: 1px solid #739a7b6b;
    box-shadow: none;
  }
  .site-header .brand-arrow, .seo-footer .brand-arrow { stroke: #edc38a; }
  .site-header .top-nav > button { color: #d4e3d5; }
  .site-header .top-nav > button:hover { color: #fff7e3; }
  .site-header .top-nav > button.active { color: #f0cb93; }
  .site-header .top-nav > button.active::after { background: #edc38a; }
  .site-header .nav-tag { color: #e4ecda; background: #356b54; }
  .site-header .free-label { color: #c4d5bf; }
  .site-header .header-cta {
    color: #173f32;
    background: #e8bf85;
    box-shadow: 0 3px 9px #081e1524;
  }
  .site-header .header-cta:hover { background: #f2d09c; }
  .seo-header > nav, .seo-header > nav a { color: #d4e3d5; }
  .seo-header > nav a[aria-current=page] { color: #f0cb93; }
  .seo-header > nav a:hover { color: #fff7e3; }

  .page-intro {
    margin: 23px 0 27px;
    padding: 31px 33px;
    border: 1px solid #316956;
    border-radius: 11px;
    background: radial-gradient(ellipse at 95% 10%, #347764aa, transparent 50%),
      linear-gradient(115deg, #173f34, #205d4d 70%, #286c59);
    box-shadow: 0 7px 21px #193f2e0d;
  }
  .page-intro h1 { color: #fff8e9; }
  .page-intro h1 > span { color: #ecc38b; }
  .page-intro > div > p { color: #d5e3d4; }
  .page-intro .eyebrow { color: #e3c798; }
  .page-intro .eyebrow > span:empty { background: #ebc68c; }
  .page-intro .intro-actions .local-status { color: #d1e1c9; }
  .page-intro .status-dot { background: #b9d39c; }
  .page-intro .text-button { color: #f0d19f; }
  .page-intro .text-button:hover { color: #fff8e9; }
  .page-intro .divider { background: #b2c2a65c; }

  .workflow {
    background: #f1f5e9;
    border-color: #bfceb7;
    box-shadow: 0 4px 13px #24472f08;
    overflow: hidden;
  }
  .workflow > button:hover { background: #e1ebd9; }
  .workflow > button.active { background: #e7efde; }
  .workflow > button:not(:last-child)::after { background: #cbd8bf; }
  .workflow > button > span:nth-child(2) { color: #546c48; }
  .workflow small { color: #65795c; }
  .step-circle { background: #f9faf3; border-color: #b7c9ad; color: #657a59; }
  .step-line { background: #b7c9ac; }
  .step-arrow { color: #6d8f64; }

  .editor-panel {
    background: #fffdf5;
    border-color: #c7d4bf;
    box-shadow: 0 5px 21px #24442f0b;
  }
  .field > input, .field > textarea, .field > select {
    background: #fcfdf8;
    border-color: #ccd9c2;
  }
  .field > input:hover, .field > textarea:hover, .field > select:hover { border-color: #8caa7c; }
  .field-divider { border-color: #dce4d3; }
  .form-footer { background: #edf2e4; border-color: #d4dfc8; }
  .sample-note { background: #f2ead7; border-color: #e4d5b3; color: #79613a; }
  .inline-tip { background: #e8efdd; border-color: #d2dfc1; }
  .entry-card { background: #fbfcf5; border-color: #ceddc2; }
  .entry-card-header { border-color: #dce6d0; }
  .add-entry { background: #e7efdd; border-color: #9cb88a; color: #426c36; }
  .add-entry:hover { background: #dae8ce; }
  .settings-group, .writing-help { border-color: #d7e2cb; }

  #section-nav > button { color: #526c46; }
  #section-nav > button:hover { background: #dce8d3; }
  #section-nav > button.active { background: #cbded0; border-color: #a7c3ad; color: #1c543f; }
  .section-number { color: #6c825d; }
  .active .section-number { color: #396c47; }
  .section-done { color: #487b45; }
  .sidebar-review { background: #d7e5d3; border-color: #b6cead; color: #2c5f3d; }
  .sidebar-review > span:last-child { background: #e9d6aa; color: #75551f; }
  .sidebar-bottom { border-color: #bdcfb4; }

  .paper-stage { background-color: #d6e3d0; border-color: #b5cbaa; }
  .preview-template { background: #dce8cf; border-color: #bfcea9; color: #4e7040; }
  .preview-controls button { color: #4f7040; }
  .preview-controls button:hover { background: #d0e0c2; }
  .preview-tip { background: #dce9d6; border-color: #bbd0ae; }
  .preview-tip strong { color: #365f37; }
  .preview-tip p { color: #506c43; }
  .preview-tip button { color: #2d6037; }
  .tip-icon { color: #77944d; }

  .audit-dropzone { background: #e3efdc; border-color: #91ae7f; }
  .audit-dropzone:hover, .audit-dropzone.dragging { background: #d6e7cd; }
  .audit-file-card { background: #e6efdd; border-color: #c0d5ad; }
  .audit-job-panel { background: #f3f6e9; border-color: #cbdab9; }
  .audit-verdict { background: #dcebd4; border-color: #b6cea3; }
  .audit-verdict.needs-review { background: #f0e4c8; border-color: #d8c393; }
  .audit-fix, .audit-update-hint { background: #eaf1df; }
  .audit-text-panel { background: #fbfdf6; border-color: #bdcfae; }
  .audit-text-empty { background: #dce8d2; }
  .audit-extraction-bar { background: #dce8d2; border-color: #bfcead; }
  .audit-preview-tip { background: #dbe9d8; border-color: #b8cfb1; }
  .audit-local-tag { background: #d8e6cb; border-color: #b9cfa7; }
  .audit-other-checks { background: #f6f8ee; border-color: #cfddbf; }

  .seo-home { border-top-color: #bfcfb5; }
  .seo-feature-grid > article { background: #f5f3e5; border-color: #cbd7be; box-shadow: 0 4px 13px #2b4b2d07; }
  .seo-feature-grid > article:nth-child(2) { background: #dcebe0; }
  .seo-feature-grid > article:nth-child(3) { background: #eae5cf; }
  .seo-feature-grid > article > span { color: #90703f; }
  .seo-home-note { background: #1d5545; border-color: #356d55; }
  .seo-home-note h3 { color: #f0d09c; }
  .seo-home-note p { color: #d8e5d4; }
  .seo-home-note a { color: #f1d39f; }
  .seo-home-faq { border-top-color: #bfd0b4; }
  .seo-home-faq details { border-color: #c5d5b9; }
  .seo-hero {
    max-width: none;
    padding: 38px 40px 40px;
    margin: 24px 0 39px;
    border: 1px solid #316956;
    border-radius: 11px;
    background: radial-gradient(ellipse at 94% 12%, #357a67a1, transparent 48%),
      linear-gradient(115deg, #173f34, #225f4e 75%, #2b705a);
    box-shadow: 0 7px 21px #193f2e0d;
  }
  .seo-hero h1 { color: #fff8e9; }
  .seo-hero > p { color: #d7e4d5; }
  .seo-hero .eyebrow { color: #edcd98; }
  .seo-hero .eyebrow > span:empty { background: #ebc68c; }
  .seo-reassurance { color: #c9ddc1; }
  .seo-hero .button.primary, .seo-bottom-cta .button.primary { background: #e8bf85; border-color: #e8bf85; color: #173f32; }
  .seo-hero .button.primary:hover, .seo-bottom-cta .button.primary:hover { background: #f2d09c; border-color: #f2d09c; }
  .seo-hero .button.secondary, .seo-bottom-cta .button.secondary { background: #ffffff08; border-color: #94b797; color: #f7f5e5; }
  .seo-hero .button.secondary:hover, .seo-bottom-cta .button.secondary:hover { background: #ffffff17; }
  .seo-article { background: #fbfcf4; border: 1px solid #cbd8bf; border-radius: 9px; padding: 28px 32px 3px; box-shadow: 0 4px 17px #24462b08; }
  .seo-toc { background: #dfe9d6; border-color: #bed0af; }
  .seo-side-note { border-top-color: #bfd0b1; }
  .seo-example { background: #e5eed8; border-left-color: #8dac71; }
  .seo-template-grid > article { background: #eff4e7; border-color: #c5d6b5; }
  .seo-bottom-cta { background: #1d5547; border-color: #396f58; box-shadow: 0 5px 17px #183c2812; }
  .seo-bottom-cta h2 { color: #fff7e7; }
  .seo-bottom-cta p { color: #d7e5d0; }
  .seo-bottom-cta .eyebrow { color: #edca93; }

  .site-footer { background: #1a493b; border-color: #396851; border-radius: 8px 8px 0 0; padding: 23px 22px; color: #d1e0c9; }
  .site-footer button { color: #eac58c; }
  .site-footer .footer-dot { color: #95b28a; }
  .seo-footer { background: #173f34; border-top-color: #3a6a51; border-radius: 10px 10px 0 0; }
  .seo-footer > div > p { color: #c5d7bb; }
  .seo-footer > nav a, .seo-footer > nav button { color: #e6ca9e; }

  .analytics-banner, .analytics-dialog { background: #f4f0df; border-color: #b7c9a5; box-shadow: 0 9px 35px #183e2c2b; }
  .analytics-decline { background: #fffaf0; border-color: #b4c6a4; }
}

@media screen and (max-width:1180px) {
  .page-intro { padding: 29px 27px; }
  .seo-hero { padding: 33px 32px 35px; }
  .seo-article { padding: 26px 27px 2px; }
}

@media screen and (max-width:820px) {
  .page-intro { margin-top: 19px; padding: 26px 25px; }
  .page-intro > div:first-child { max-width: 65%; }
  .site-footer { padding: 22px 18px; }
}

@media screen and (max-width:620px) {
  .page-intro { margin: 17px 0 21px; padding: 25px 22px 23px; border-radius: 8px; }
  .page-intro > div:first-child { max-width: none; }
  .page-intro h1 { font-size: 31px; max-width: none; }
  .page-intro > div > p { font-size: 11px; }
  .page-intro .intro-actions { gap: 8px; padding-top: 19px; }
  .page-intro .intro-actions .local-status { font-size: 8px; }
  .page-intro .intro-buttons { gap: 7px; }
  .page-intro .intro-buttons .text-button { font-size: 8px; }
  .checking-resume .page-intro { padding-bottom: 23px; }
  .seo-hero { padding: 28px 23px 29px; margin: 20px 0 27px; border-radius: 8px; }
  .seo-hero h1 { font-size: 35px; }
  .seo-article { padding: 23px 20px 0; border-radius: 8px; }
  .seo-footer { border-radius: 8px 8px 0 0; }
  .site-footer { padding: 22px 18px 25px; }
}
