/* Extracted inline style block 1; order preserved. */
:root {
      --ink: #172033;
      --muted: #5e6878;
      --line: #d9dee8;
      --paper: #ffffff;
      --soft: #f5f7fa;
      --navy: #153b6b;
      --blue: #1669aa;
      --cyan: #0e8d9a;
      --green: #16825d;
      --orange: #c96b18;
      --red: #b43c37;
      --current-bg: #eaf5ef;
      --target-bg: #edf4fb;
      --ai-bg: #fff3e6;
      --risk-bg: #fff0ef;
      --shadow: 0 8px 24px rgba(22, 32, 51, 0.08);
      --radius: 6px;
    }

    * { box-sizing: border-box; letter-spacing: 0; }
    html { scroll-behavior: smooth; }
    body {
      margin: 0;
      color: var(--ink);
      background: var(--soft);
      font-family: "Microsoft YaHei", "PingFang SC", Arial, sans-serif;
      font-size: 15px;
      line-height: 1.65;
    }
    img { max-width: 100%; display: block; }
    button, input { font: inherit; }
    button { cursor: pointer; }
    a { color: inherit; }

    .topbar {
      position: sticky;
      top: 0;
      z-index: 30;
      background: rgba(255,255,255,0.97);
      border-bottom: 1px solid var(--line);
    }
    .topbar-inner {
      max-width: 1460px;
      margin: 0 auto;
      min-height: 64px;
      padding: 8px 24px;
      display: flex;
      align-items: center;
      gap: 18px;
    }
    .brand-pair {
      display: flex;
      align-items: center;
      gap: 15px;
      min-width: 320px;
    }
    .brand {
      display: flex;
      align-items: center;
      gap: 8px;
      min-width: 0;
    }
    .brand-logo { width: 38px; height: 38px; object-fit: contain; }
    .brand-wordmark { width: 132px; height: 32px; object-fit: contain; }
    .brand-name { font-size: 13px; font-weight: 700; line-height: 1.2; white-space: nowrap; }
    .brand-sub { display: block; color: var(--muted); font-size: 10px; font-weight: 500; }
    .brand-divider { width: 1px; height: 30px; background: var(--line); }
    .nav {
      display: flex;
      align-items: center;
      gap: 4px;
      overflow-x: auto;
      scrollbar-width: none;
      margin-left: auto;
    }
    .nav::-webkit-scrollbar { display: none; }
    .nav a {
      text-decoration: none;
      white-space: nowrap;
      padding: 7px 9px;
      color: var(--muted);
      font-size: 13px;
      border-bottom: 2px solid transparent;
    }
    .nav a.active { color: var(--navy); border-bottom-color: var(--blue); }
    .print-btn {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      text-decoration: none;
      cursor: pointer;
      font: inherit;
      border: 1px solid var(--line);
      background: var(--paper);
      color: var(--navy);
      border-radius: var(--radius);
      min-width: 42px;
      height: 36px;
      padding: 0 11px;
    }

    main { overflow: hidden; }
    .band { background: var(--paper); border-bottom: 1px solid var(--line); }
    .band[id] { scroll-margin-top: 118px; }
    .band.alt { background: var(--soft); }
    .container { max-width: 1460px; margin: 0 auto; padding: 72px 24px; }
    .overview { padding-top: 54px; }
    .eyebrow { color: var(--blue); font-size: 13px; font-weight: 800; margin: 0 0 10px; }
    h1, h2, h3, p { margin-top: 0; }
    h1 { font-size: 38px; line-height: 1.22; margin-bottom: 14px; max-width: 980px; }
    h2 { font-size: 28px; line-height: 1.3; margin-bottom: 10px; }
    h3 { font-size: 18px; line-height: 1.35; margin-bottom: 8px; }
    .lead { color: var(--muted); max-width: 1000px; font-size: 17px; }
    .section-head {
      display: flex;
      justify-content: space-between;
      align-items: flex-end;
      gap: 24px;
      margin-bottom: 30px;
    }
    .section-head p { color: var(--muted); max-width: 780px; margin-bottom: 0; }
    .decision-strip {
      margin-top: 28px;
      display: grid;
      grid-template-columns: 1.3fr repeat(3, 1fr);
      border: 1px solid var(--line);
      background: var(--paper);
      box-shadow: var(--shadow);
    }
    .decision-main, .decision-item { padding: 22px; min-height: 132px; }
    .decision-main { background: var(--navy); color: #fff; }
    .decision-main strong { display: block; font-size: 21px; margin-bottom: 8px; }
    .decision-main p { color: #d9e8f7; margin: 0; }
    .decision-item { border-left: 1px solid var(--line); }
    .decision-item .label { color: var(--muted); font-size: 12px; font-weight: 700; }
    .decision-item strong { display: block; color: var(--navy); font-size: 19px; margin: 6px 0; }
    .decision-item p { color: var(--muted); margin: 0; font-size: 13px; }
    .risk-banner {
      margin-top: 16px;
      border-left: 5px solid var(--red);
      background: var(--risk-bg);
      padding: 16px 18px;
      display: grid;
      grid-template-columns: 155px 1fr;
      gap: 16px;
    }
    .risk-banner strong { color: var(--red); }
    .risk-banner p { margin: 0; }
    .chips { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 22px; }
    .chip { border: 1px solid var(--line); background: #fff; padding: 5px 9px; border-radius: 4px; font-size: 12px; color: var(--muted); }

    .segmented {
      display: inline-flex;
      border: 1px solid var(--line);
      background: #fff;
      padding: 3px;
      border-radius: var(--radius);
      white-space: nowrap;
    }
    .segmented button {
      border: 0;
      background: transparent;
      color: var(--muted);
      padding: 7px 12px;
      border-radius: 4px;
    }
    .segmented button.active { background: var(--navy); color: #fff; }

    .legend { display: flex; flex-wrap: wrap; gap: 14px; margin: 0 0 18px; }
    .legend span { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: var(--muted); }
    .legend i { width: 14px; height: 14px; border: 1px solid var(--line); }
    .legend .lg-current { background: var(--current-bg); border-color: var(--green); }
    .legend .lg-target { background: var(--target-bg); border-color: var(--blue); }
    .legend .lg-ai { background: var(--ai-bg); border-color: var(--orange); }
    .legend .lg-gap { background: #fff; border-style: dashed; border-color: #929bad; }

    .architecture-wrap { overflow-x: auto; padding-bottom: 8px; }
    .architecture {
      min-width: 1120px;
      border: 1px solid var(--line);
      background: #fff;
      box-shadow: var(--shadow);
    }
    .arch-row {
      display: grid;
      grid-template-columns: 170px 1fr;
      border-bottom: 1px solid var(--line);
      min-height: 112px;
    }
    .arch-row:last-child { border-bottom: 0; }
    .arch-label {
      padding: 20px 18px;
      background: #eef1f5;
      border-right: 1px solid var(--line);
      display: flex;
      flex-direction: column;
      justify-content: center;
    }
    .arch-label b { color: var(--navy); font-size: 16px; }
    .arch-label small { color: var(--muted); margin-top: 3px; }
    .arch-nodes {
      padding: 17px;
      display: grid;
      grid-template-columns: repeat(6, minmax(120px, 1fr));
      gap: 10px;
      align-content: center;
      position: relative;
    }
    .node {
      min-height: 66px;
      padding: 10px 11px;
      border: 1px solid var(--line);
      background: #fff;
      border-radius: var(--radius);
      transition: opacity .2s ease, transform .2s ease;
    }
    .node b { display: block; font-size: 14px; line-height: 1.35; }
    .node small { color: var(--muted); font-size: 11px; line-height: 1.35; display: block; margin-top: 3px; }
    .node.current { background: var(--current-bg); border-color: #8dc9b0; }
    .node.target { background: var(--target-bg); border-color: #91b8dc; }
    .node.ai { background: var(--ai-bg); border-color: #e1aa72; }
    .node.gap { border-style: dashed; border-color: #929bad; }
    .architecture[data-filter="current"] .node:not(.current),
    .architecture[data-filter="target"] .node:not(.target),
    .architecture[data-filter="ai"] .node:not(.ai) { opacity: .16; }
    .architecture[data-filter]:not([data-filter="all"]) .node:hover { opacity: 1; transform: translateY(-2px); }
    .arch-flow {
      margin-top: 18px;
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      border: 1px solid var(--line);
      background: #fff;
    }
    .arch-flow div { padding: 15px 18px; border-right: 1px solid var(--line); }
    .arch-flow div:last-child { border-right: 0; }
    .arch-flow b { color: var(--blue); }
    .arch-flow span { display: block; color: var(--muted); font-size: 12px; }

    .process-scroll { overflow-x: auto; padding: 4px 2px 18px; }
    .process-line {
      display: grid;
      grid-template-columns: repeat(13, 176px);
      gap: 28px;
      min-width: 2624px;
    }
    .process-step {
      position: relative;
      min-height: 218px;
      border: 1px solid var(--line);
      background: #fff;
      border-top: 4px solid var(--blue);
      padding: 16px 14px;
      box-shadow: 0 5px 16px rgba(22,32,51,.06);
    }
    .process-step::after {
      content: "→";
      position: absolute;
      right: -23px;
      top: 88px;
      color: var(--blue);
      font-size: 22px;
      font-weight: 800;
    }
    .process-step:last-child::after { display: none; }
    .process-step .num { color: var(--blue); font-size: 12px; font-weight: 800; }
    .process-step h3 { font-size: 16px; margin: 5px 0 8px; }
    .process-step p { font-size: 12px; color: var(--muted); margin-bottom: 8px; }
    .process-step .data-tag { display: inline-block; color: var(--green); font-size: 11px; font-weight: 700; border-top: 1px solid #bcd8cc; padding-top: 5px; }
    .quality-loop {
      display: grid;
      grid-template-columns: repeat(6, 1fr);
      align-items: stretch;
      border: 1px solid #e2b088;
      background: var(--ai-bg);
      margin-top: 18px;
    }
    .quality-loop div { padding: 15px; border-right: 1px solid #e2c7ad; position: relative; }
    .quality-loop div:last-child { border-right: 0; }
    .quality-loop b { color: var(--orange); display: block; }
    .quality-loop small { color: var(--muted); }
    .process-facts { display: grid; grid-template-columns: repeat(4, 1fr); border: 1px solid var(--line); margin-top: 18px; }
    .process-facts div { padding: 15px 18px; border-right: 1px solid var(--line); background: #fff; }
    .process-facts div:last-child { border-right: 0; }
    .process-facts strong { color: var(--navy); display: block; font-size: 17px; }
    .process-facts span { color: var(--muted); font-size: 12px; }

    .portfolio-grid { display: grid; grid-template-columns: 1.15fr .85fr; gap: 24px; align-items: start; }
    .scene-groups { display: grid; gap: 14px; }
    .scene-group { border: 1px solid var(--line); background: #fff; display: grid; grid-template-columns: 156px 1fr; }
    .scene-title { padding: 16px; background: #eef1f5; border-right: 1px solid var(--line); }
    .scene-title b { color: var(--navy); display: block; }
    .scene-title strong { color: var(--blue); font-size: 25px; }
    .scene-list { padding: 13px 15px; display: flex; flex-wrap: wrap; gap: 7px; align-content: center; }
    .scene-list span { border: 1px solid var(--line); background: #fff; padding: 5px 8px; font-size: 12px; border-radius: 4px; }
    .scene-list .priority { border-color: #8dc9b0; background: var(--current-bg); }
    .scene-list .candidate { border-style: dashed; }
    .ai-panel { border: 1px solid #e1aa72; background: #fff; }
    .ai-panel-head { background: var(--ai-bg); padding: 18px; border-bottom: 1px solid #e1c19e; }
    .ai-panel-head strong { color: var(--orange); font-size: 19px; }
    .ai-panel-head p { color: var(--muted); margin: 4px 0 0; font-size: 13px; }
    .ai-list { list-style: none; margin: 0; padding: 0; }
    .ai-list li { display: grid; grid-template-columns: 30px 1fr auto; gap: 9px; padding: 12px 16px; border-bottom: 1px solid var(--line); align-items: center; }
    .ai-list li:last-child { border-bottom: 0; }
    .ai-list .ai-index { color: var(--orange); font-weight: 800; }
    .ai-list b { display: block; font-size: 13px; }
    .ai-list small { color: var(--muted); font-size: 11px; }
    .priority-tag { font-size: 10px; color: var(--green); border: 1px solid #8dc9b0; background: var(--current-bg); padding: 2px 5px; white-space: nowrap; }

    .gate { border: 1px solid var(--red); background: var(--risk-bg); display: grid; grid-template-columns: 190px 1fr auto; gap: 18px; padding: 20px; align-items: center; margin-bottom: 24px; }
    .gate .gate-id { color: var(--red); font-size: 20px; font-weight: 800; }
    .gate p { margin: 0; }
    .gate .gate-action { color: var(--red); font-weight: 700; white-space: nowrap; }
    .level-table-wrap { overflow-x: auto; }
    .level-table { width: 100%; min-width: 920px; border-collapse: collapse; background: #fff; border: 1px solid var(--line); }
    .level-table th, .level-table td { padding: 14px 16px; border: 1px solid var(--line); text-align: left; vertical-align: top; }
    .level-table th { background: #eef1f5; color: var(--navy); }
    .level-table .excellent { background: #edf4fb; }
    .level-table small { color: var(--muted); display: block; margin-top: 3px; }
    .roadmap { margin-top: 24px; display: grid; grid-template-columns: repeat(5, 1fr); border: 1px solid var(--line); background: #fff; }
    .road-step { min-height: 210px; padding: 18px; border-right: 1px solid var(--line); }
    .road-step:last-child { border-right: 0; }
    .road-step .when { color: var(--blue); font-size: 12px; font-weight: 800; }
    .road-step h3 { margin-top: 5px; }
    .road-step p { color: var(--muted); font-size: 13px; }
    .road-step ul { margin: 0; padding-left: 18px; font-size: 12px; }

    .diagnosis-summary { display: grid; grid-template-columns: 1fr 260px; gap: 24px; align-items: stretch; margin-bottom: 24px; }
    .diagnosis-intro {
      display: flex;
      align-items: center;
      justify-content: flex-start;
      text-align: left;
      border-left: 5px solid var(--green);
      background: var(--current-bg);
      padding: 18px;
    }
    .diagnosis-intro > p {
      width: 100%;
      margin: 0;
      text-align: left;
    }
    .diagnosis-intro b { white-space: nowrap; }
    .progress-box { border: 1px solid var(--line); background: #fff; padding: 17px; }
    .progress-box strong { color: var(--navy); }
    .progress-track { height: 9px; background: #e6e9ef; margin-top: 12px; overflow: hidden; }
    .progress-fill { height: 100%; width: 0; background: var(--green); transition: width .2s; }
    .weeks { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
    .week { border: 1px solid var(--line); background: #fff; min-width: 0; }
    .week-head { padding: 16px; border-bottom: 1px solid var(--line); background: #eef1f5; }
    .week-head .week-no { color: var(--blue); font-weight: 800; font-size: 12px; }
    .week-head h3 { margin: 4px 0; }
    .week-head p { color: var(--muted); font-size: 12px; margin: 0; }
    .day-list { list-style: none; margin: 0; padding: 0; }
    .day-list li { border-bottom: 1px solid var(--line); padding: 11px 13px; }
    .day-list li:last-child { border-bottom: 0; }
    .day-list label { display: grid; grid-template-columns: 20px 36px 1fr; gap: 7px; align-items: start; cursor: pointer; }
    .day-list input { margin-top: 4px; accent-color: var(--green); }
    .day-list b { color: var(--blue); font-size: 11px; }
    .day-list span { font-size: 12px; }
    .day-list small { display: block; color: var(--muted); margin-top: 2px; }
    .deliverables { margin-top: 22px; display: grid; grid-template-columns: repeat(4, 1fr); border: 1px solid var(--line); background: #fff; }
    .deliverable { padding: 17px; border-right: 1px solid var(--line); }
    .deliverable:last-child { border-right: 0; }
    .deliverable b { color: var(--green); }
    .deliverable p { color: var(--muted); font-size: 12px; margin: 5px 0 0; }
    .scope-matrix { margin-top: 22px; display: grid; grid-template-columns: repeat(5, 1fr); border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
    .scope-item { min-height: 112px; padding: 14px; background: #fff; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
    .scope-item b { color: var(--navy); display: block; }
    .scope-item small { color: var(--muted); }

    .evidence-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
    .evidence-chain { border: 1px solid var(--line); background: #fff; }
    .evidence-step { display: grid; grid-template-columns: 62px 1fr; border-bottom: 1px solid var(--line); }
    .evidence-step:last-child { border-bottom: 0; }
    .evidence-step strong { padding: 14px; color: var(--blue); background: #eef1f5; text-align: center; }
    .evidence-step div { padding: 14px; }
    .evidence-step b { display: block; }
    .evidence-step small { color: var(--muted); }
    .kpi-groups { display: grid; grid-template-columns: 1fr 1fr; border: 1px solid var(--line); background: #fff; }
    .kpi { padding: 16px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
    .kpi:nth-child(2n) { border-right: 0; }
    .kpi:nth-last-child(-n+2) { border-bottom: 0; }
    .kpi b { color: var(--green); }
    .kpi p { color: var(--muted); font-size: 12px; margin: 5px 0 0; }

    .reference-gallery { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
    figure { margin: 0; border: 1px solid var(--line); background: #fff; }
    figure img { width: 100%; height: auto; object-fit: contain; background: #101d32; }
    figcaption { padding: 12px 14px; color: var(--muted); font-size: 12px; border-top: 1px solid var(--line); }
    .source-notes { margin-top: 24px; border-top: 1px solid var(--line); padding-top: 18px; color: var(--muted); font-size: 12px; }
    .source-notes ul { columns: 2; padding-left: 18px; }
    .disclaimer { margin-top: 18px; padding: 14px 16px; background: #fff; border-left: 4px solid var(--orange); }

    footer { background: #192235; color: #dfe5ee; }
    footer .container { padding-top: 30px; padding-bottom: 30px; display: flex; justify-content: space-between; gap: 24px; }
    footer p { margin: 0; font-size: 12px; }

    @media (max-width: 1050px) {
      .topbar-inner { flex-wrap: wrap; }
      .nav { order: 3; width: 100%; margin-left: 0; }
      .decision-strip { grid-template-columns: 1fr 1fr; }
      .decision-main { grid-column: 1 / -1; }
      .decision-item:nth-child(3) { border-left: 0; }
      .portfolio-grid, .evidence-grid { grid-template-columns: 1fr; }
      .weeks { grid-template-columns: 1fr 1fr; }
      .roadmap { grid-template-columns: 1fr 1fr; }
      .road-step { border-bottom: 1px solid var(--line); }
      .scope-matrix { grid-template-columns: repeat(3, 1fr); }
    }
    @media (max-width: 680px) {
      .topbar-inner, .container { padding-left: 16px; padding-right: 16px; }
      .brand-pair { min-width: 0; width: 100%; }
      .brand-wordmark { width: 112px; }
      .brand-name { font-size: 12px; }
      .print-btn { position: absolute; right: 16px; top: 14px; }
      h1 { font-size: 29px; }
      h2 { font-size: 24px; }
      .container { padding-top: 54px; padding-bottom: 54px; }
      .section-head { display: block; }
      .section-head .segmented { margin-top: 14px; overflow-x: auto; max-width: 100%; }
      .decision-strip, .diagnosis-summary, .weeks, .reference-gallery { grid-template-columns: 1fr; }
      .decision-item { border-left: 0; border-top: 1px solid var(--line); }
      .risk-banner, .gate { grid-template-columns: 1fr; }
      .gate .gate-action { white-space: normal; }
      .arch-flow, .process-facts, .quality-loop, .deliverables, .roadmap { grid-template-columns: 1fr; }
      .arch-flow div, .process-facts div, .quality-loop div, .deliverable, .road-step { border-right: 0; border-bottom: 1px solid var(--line); }
      .scene-group { grid-template-columns: 112px 1fr; }
      .scope-matrix { grid-template-columns: 1fr 1fr; }
      .source-notes ul { columns: 1; }
      footer .container { display: block; }
      footer p + p { margin-top: 8px; }
    }
    @media print {
      body { background: #fff; font-size: 11px; }
      .topbar { position: static; }
      .nav, .print-btn, .segmented { display: none !important; }
      .container { max-width: none; padding: 24px 18px; }
      .band { break-inside: avoid; }
      .architecture-wrap, .process-scroll, .level-table-wrap { overflow: visible; }
      .architecture { min-width: 0; box-shadow: none; }
      .arch-nodes { grid-template-columns: repeat(3, 1fr); }
      .process-line { min-width: 0; grid-template-columns: repeat(4, 1fr); }
      .process-step::after { display: none; }
      .weeks { grid-template-columns: repeat(2, 1fr); }
      a { text-decoration: none; }
    }

/* Extracted inline style block 2; order preserved. */
:root {
      --ink: #13212b;
      --ink-soft: #536470;
      --muted: #61727c;
      --line: rgba(26, 58, 72, 0.14);
      --paper: #f8fbfb;
      --soft: #e9f0f1;
      --navy: #0b2b3b;
      --blue: #087f98;
      --cyan: #14b8ae;
      --green: #278a68;
      --orange: #c86f2e;
      --red: #b34d49;
      --current-bg: #e4f4ec;
      --target-bg: #e6f3f6;
      --ai-bg: #fff0e1;
      --risk-bg: #fff0ee;
      --shadow: 0 18px 48px rgba(20, 54, 67, 0.11);
      --glass-shadow: 0 22px 60px rgba(3, 24, 37, 0.22);
      --radius: 8px;
      --scroll-progress: 0%;
    }

    html { background: #e9f0f1; }
    body {
      color: var(--ink);
      background-color: #e9f0f1;
      background-image:
        linear-gradient(rgba(12, 86, 101, 0.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(12, 86, 101, 0.045) 1px, transparent 1px);
      background-size: 48px 48px;
      font-family: "Microsoft YaHei UI", "HarmonyOS Sans SC", "PingFang SC", "Noto Sans CJK SC", sans-serif;
      line-height: 1.65;
    }

    .topbar {
      background: rgba(248, 251, 251, 0.82);
      border-bottom-color: rgba(15, 57, 71, 0.16);
      box-shadow: 0 8px 28px rgba(18, 48, 61, 0.08);
      backdrop-filter: blur(20px) saturate(140%);
      -webkit-backdrop-filter: blur(20px) saturate(140%);
    }
    .topbar::after {
      content: "";
      position: absolute;
      left: 0;
      bottom: -1px;
      width: var(--scroll-progress);
      height: 2px;
      background: linear-gradient(90deg, var(--cyan), #69d4bb);
      transition: width 0.15s ease-out;
    }
    .topbar-inner { max-width: 1440px; min-height: 72px; padding: 10px 32px; gap: 24px; }
    .brand-pair { min-width: 300px; gap: 14px; }
    .brand { gap: 8px; }
    .brand-logo { width: 34px; height: 34px; }
    .brand-wordmark { width: 128px; height: 30px; }
    .brand-name { color: var(--navy); font-size: 13px; }
    .brand-sub { color: var(--muted); }
    .brand-divider { height: 28px; background: rgba(19, 58, 72, 0.18); }
    .brand-link {
      color: inherit;
      text-decoration: none;
      border-radius: 6px;
      transition: opacity 0.2s ease, background 0.2s ease;
    }
    .brand-link:hover { opacity: 0.84; background: rgba(18, 170, 157, 0.06); }
    .brand-link:focus-visible { outline: 2px solid var(--cyan); outline-offset: 4px; }
    .nav { gap: 2px; }
    .nav a {
      position: relative;
      padding: 9px 10px;
      color: #62737c;
      border-bottom: 0;
      transition: color 0.2s ease;
    }
    .nav a::after {
      content: "";
      position: absolute;
      left: 10px;
      right: 10px;
      bottom: 2px;
      height: 2px;
      border-radius: 2px;
      background: var(--cyan);
      transform: scaleX(0);
      transform-origin: center;
      transition: transform 0.2s ease;
    }
    .nav a:hover, .nav a.active { color: var(--navy); }
    .nav a.active::after { transform: scaleX(1); }
    .print-btn {
      min-width: 74px;
      height: 38px;
      border: 1px solid var(--navy);
      border-radius: 6px;
      background: var(--navy);
      color: #f4ffff;
      box-shadow: 0 8px 18px rgba(11, 43, 59, 0.16);
      transition: transform 0.2s ease, background 0.2s ease;
    }
    .print-btn:hover { background: #12455a; transform: translateY(-1px); }

    main { position: relative; overflow: hidden; }
    .band {
      position: relative;
      background: rgba(249, 252, 252, 0.88);
      border-bottom: 1px solid rgba(25, 62, 75, 0.11);
    }
    .band.alt { background: rgba(226, 237, 239, 0.72); }
    .container { max-width: 1440px; padding: 88px 32px; }
    .overview {
      position: relative;
      isolation: isolate;
      padding-top: 76px;
      padding-bottom: 72px;
    }
    #overview {
      overflow: hidden;
      color: #edfafa;
      background:
        linear-gradient(115deg, rgba(6, 27, 40, 0.98) 0%, rgba(8, 43, 56, 0.97) 58%, rgba(8, 68, 75, 0.93) 100%);
      border-bottom-color: rgba(123, 220, 204, 0.22);
    }
    #overview::before {
      content: "";
      position: absolute;
      inset: 0;
      z-index: -1;
      background-image: url("../assets/source-ai-architecture.png");
      background-position: center right;
      background-size: cover;
      opacity: 0.075;
      mix-blend-mode: screen;
      pointer-events: none;
    }
    #overview::after {
      content: "";
      position: absolute;
      top: 0;
      right: -6vw;
      width: 48vw;
      height: 100%;
      z-index: -1;
      opacity: 0.35;
      background-image:
        linear-gradient(90deg, transparent 49%, rgba(100, 224, 207, 0.16) 50%, transparent 51%),
        linear-gradient(rgba(100, 224, 207, 0.16) 1px, transparent 1px);
      background-size: 64px 64px;
      mask-image: linear-gradient(90deg, transparent, #000 48%);
      -webkit-mask-image: linear-gradient(90deg, transparent, #000 48%);
      pointer-events: none;
    }
    #overview .container { position: relative; z-index: 1; }
    .overview-grid {
      display: grid;
      grid-template-columns: minmax(0, 1.16fr) minmax(340px, 0.84fr);
      gap: 52px;
      align-items: center;
    }
    .overview-copy { max-width: 840px; animation: rise-in 0.7s ease both; }
    .eyebrow {
      display: inline-flex;
      align-items: center;
      gap: 9px;
      color: var(--blue);
      font-size: 12px;
      font-weight: 800;
      margin-bottom: 13px;
    }
    .eyebrow::before {
      content: "";
      width: 22px;
      height: 2px;
      border-radius: 2px;
      background: currentColor;
    }
    #overview .eyebrow { color: #63d9c8; }
    #overview .overview-copy > .eyebrow::before { display: none; }
    #overview .overview-copy > .eyebrow {
      font-size: 15px;
      font-weight: 900;
      line-height: 1.35;
    }
    h1, h2, h3, p { margin-top: 0; }
    h1, h2, h3 { font-family: "Bahnschrift", "Aptos Display", "Microsoft YaHei UI", "PingFang SC", sans-serif; }
    h1 {
      max-width: 850px;
      color: #f5ffff;
      font-size: 48px;
      line-height: 1.2;
      margin-bottom: 18px;
      font-weight: 800;
    }
    h2 {
      color: var(--navy);
      font-size: 30px;
      line-height: 1.28;
      margin-bottom: 11px;
    }
    h3 { font-size: 18px; line-height: 1.35; margin-bottom: 8px; }
    .lead { max-width: 870px; color: rgba(226, 244, 244, 0.76); font-size: 17px; }
    .hero-index {
      position: relative;
      overflow: hidden;
      padding: 14px;
      border: 1px solid rgba(159, 238, 223, 0.3);
      border-radius: var(--radius);
      background: rgba(235, 255, 252, 0.09);
      box-shadow: var(--glass-shadow), inset 0 1px rgba(255, 255, 255, 0.18);
      backdrop-filter: blur(16px) saturate(130%);
      -webkit-backdrop-filter: blur(16px) saturate(130%);
      animation: rise-in 0.75s 0.12s ease both;
    }
    .hero-index::after {
      content: "";
      position: absolute;
      inset: 0;
      background: linear-gradient(112deg, transparent 24%, rgba(161, 255, 235, 0.13) 44%, transparent 62%);
      transform: translateX(-110%);
      animation: glass-sheen 8s 1s ease-in-out infinite;
      pointer-events: none;
    }
    .index-head, .index-caption, .index-metrics { position: relative; z-index: 1; }
    .index-head {
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 12px;
      color: rgba(212, 245, 240, 0.78);
      font-size: 11px;
      font-weight: 800;
    }
    .index-status { display: inline-flex; align-items: center; gap: 6px; color: #75e5b2; }
    .index-status i {
      width: 7px;
      height: 7px;
      border-radius: 50%;
      background: #72e3af;
      box-shadow: 0 0 0 4px rgba(114, 227, 175, 0.14), 0 0 14px rgba(114, 227, 175, 0.8);
    }
    .index-media {
      aspect-ratio: 2816 / 1536;
      height: auto;
      min-height: 0;
      margin-top: 13px;
      overflow: hidden;
      display: grid;
      place-items: center;
      border: 1px solid rgba(164, 237, 226, 0.28);
      border-radius: 5px;
      background: #081c2d;
    }
    .index-media img {
      width: 100%;
      height: 100%;
      object-fit: contain;
      object-position: center;
      opacity: 0.86;
      filter: saturate(0.86) contrast(1.06);
    }
    .index-caption {
      display: grid;
      grid-template-columns: auto 1fr;
      gap: 4px 12px;
      padding: 15px 2px 13px;
      border-bottom: 1px solid rgba(166, 233, 223, 0.2);
    }
    .index-caption span { color: #77d6c6; font-size: 11px; font-weight: 700; }
    .index-caption strong { color: #f5ffff; font-size: 19px; line-height: 1.2; }
    .index-caption small { grid-column: 2; color: rgba(218, 242, 240, 0.66); font-size: 11px; line-height: 1.45; }
    .index-metrics { display: grid; grid-template-columns: repeat(3, 1fr); padding-top: 14px; }
    .index-metrics div { display: grid; gap: 1px; padding-left: 13px; border-left: 1px solid rgba(166, 233, 223, 0.2); }
    .index-metrics div:first-child { padding-left: 0; border-left: 0; }
    .index-metrics strong { color: #f5ffff; font-size: 24px; line-height: 1.1; }
    .index-metrics span { color: rgba(218, 242, 240, 0.66); font-size: 11px; }

    .decision-strip {
      position: relative;
      z-index: 1;
      margin-top: 30px;
      overflow: hidden;
      display: grid;
      grid-template-columns: 1.3fr repeat(3, 1fr);
      border: 1px solid rgba(158, 238, 224, 0.28);
      border-radius: var(--radius);
      background: rgba(235, 255, 252, 0.08);
      box-shadow: var(--glass-shadow);
      backdrop-filter: blur(16px) saturate(130%);
      -webkit-backdrop-filter: blur(16px) saturate(130%);
      animation: rise-in 0.75s 0.2s ease both;
    }
    .decision-main, .decision-item { min-height: 146px; padding: 22px; }
    .decision-main {
      background: linear-gradient(135deg, rgba(18, 113, 111, 0.88), rgba(10, 66, 83, 0.92));
      border-right: 1px solid rgba(158, 238, 224, 0.22);
    }
    .decision-main strong { display: block; color: #f5ffff; font-size: 20px; line-height: 1.35; margin-bottom: 9px; }
    .decision-main p { color: rgba(229, 249, 245, 0.75); margin: 0; font-size: 13px; }
    .decision-item { border-left: 1px solid rgba(158, 238, 224, 0.2); }
    .decision-item .label { color: #71d8c7; font-size: 11px; font-weight: 800; }
    .decision-item strong { display: block; color: #f5ffff; font-size: 19px; line-height: 1.3; margin: 7px 0; }
    .decision-item p { color: rgba(222, 242, 240, 0.66); margin: 0; font-size: 12px; }
    .risk-banner {
      position: relative;
      z-index: 1;
      margin-top: 16px;
      display: grid;
      grid-template-columns: 155px 1fr;
      gap: 16px;
      padding: 16px 18px;
      border: 1px solid rgba(244, 146, 136, 0.32);
      border-left: 4px solid #e4766d;
      border-radius: 6px;
      background: rgba(154, 48, 49, 0.24);
      box-shadow: inset 0 1px rgba(255, 255, 255, 0.08);
      backdrop-filter: blur(12px);
      -webkit-backdrop-filter: blur(12px);
    }
    .risk-banner strong { color: #ff9b91; }
    .risk-banner p { color: rgba(255, 235, 231, 0.8); margin: 0; font-size: 13px; }
    .risk-banner p b { color: #fff1ed; }
    .chips { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 22px; }
    .chip {
      padding: 5px 10px;
      border: 1px solid rgba(126, 184, 190, 0.32);
      border-radius: 999px;
      background: rgba(255, 255, 255, 0.68);
      color: var(--ink-soft);
      font-size: 12px;
    }
    #overview .chip { border-color: rgba(165, 239, 227, 0.27); background: rgba(255, 255, 255, 0.08); color: rgba(225, 246, 243, 0.76); }

    .section-head {
      align-items: flex-start;
      gap: 30px;
      margin-bottom: 38px;
    }
    .section-head > div:first-child {
      position: relative;
      isolation: isolate;
      min-width: 0;
      padding-left: 24px;
      border-left: 0;
    }
    .section-head > div:first-child::before {
      content: "";
      position: absolute;
      left: 0;
      top: 14px;
      width: 3px;
      height: 36px;
      border-radius: 3px;
      background: linear-gradient(180deg, var(--cyan), rgba(20, 184, 174, 0.16));
      box-shadow: 0 0 16px rgba(20, 184, 174, 0.2);
      z-index: 2;
    }
    .section-kicker {
      position: relative;
      display: flex;
      align-items: flex-end;
      min-height: 64px;
      margin-bottom: 8px;
      padding: 0 0 7px;
      overflow: visible;
    }
    .section-kicker::before { display: none; }
    .section-number {
      position: absolute;
      left: -10px;
      top: -10px;
      z-index: 0;
      color: rgba(17, 128, 157, 0.13);
      font-family: "Bahnschrift", "Aptos Display", sans-serif;
      font-size: clamp(68px, 7vw, 104px);
      font-weight: 900;
      line-height: 0.82;
      letter-spacing: 0;
      -webkit-text-stroke: 1px rgba(17, 128, 157, 0.06);
      user-select: none;
      pointer-events: none;
    }
    .section-label {
      position: relative;
      z-index: 1;
      color: var(--blue);
      font-size: 15px;
      line-height: 1.35;
      font-weight: 900;
      letter-spacing: 0;
    }
    .section-head h2 {
      max-width: 980px;
      color: var(--navy);
      font-size: clamp(30px, 2.6vw, 38px);
      line-height: 1.18;
      margin-bottom: 13px;
    }
    .section-head p { color: var(--muted); max-width: 780px; margin-bottom: 0; }
    .segmented {
      padding: 4px;
      border: 1px solid rgba(24, 71, 83, 0.14);
      border-radius: 8px;
      background: rgba(255, 255, 255, 0.76);
      box-shadow: 0 8px 20px rgba(22, 59, 70, 0.07);
      backdrop-filter: blur(12px);
      -webkit-backdrop-filter: blur(12px);
    }
    .segmented button { padding: 7px 13px; border-radius: 5px; color: var(--muted); transition: background 0.2s ease, color 0.2s ease; }
    .segmented button.active { background: var(--navy); color: #f4ffff; box-shadow: 0 5px 12px rgba(11, 43, 59, 0.16); }

    .legend { gap: 16px; margin-bottom: 18px; }
    .legend span { color: var(--muted); }
    .legend i { width: 13px; height: 13px; border-radius: 4px; }
    .legend .lg-current { background: #b9e5ce; border-color: var(--green); }
    .legend .lg-target { background: #b9e1e8; border-color: var(--blue); }
    .legend .lg-ai { background: #f6cfaa; border-color: var(--orange); }
    .legend .lg-gap { background: rgba(255, 255, 255, 0.45); border-style: dashed; border-color: #78919a; }

    .architecture-wrap { padding: 5px 5px 15px; scrollbar-color: #70bdb8 rgba(14, 45, 57, 0.12); }
    .architecture {
      min-width: 1120px;
      overflow: hidden;
      border: 1px solid rgba(99, 188, 188, 0.43);
      border-radius: var(--radius);
      background: #0a2332;
      box-shadow: 0 24px 55px rgba(7, 34, 47, 0.2), inset 0 1px rgba(255, 255, 255, 0.09);
    }
    .arch-row { min-height: 116px; border-bottom-color: rgba(137, 211, 205, 0.17); }
    .arch-label { padding: 20px 18px; background: rgba(4, 24, 35, 0.72); border-right-color: rgba(137, 211, 205, 0.17); }
    .arch-label b { color: #e2f6f2; font-size: 15px; }
    .arch-label small { color: rgba(199, 225, 224, 0.6); }
    .arch-nodes { padding: 17px; gap: 10px; }
    .node {
      min-height: 70px;
      padding: 10px 11px;
      border-color: rgba(170, 230, 224, 0.19);
      border-radius: 6px;
      background: rgba(239, 255, 252, 0.065);
      box-shadow: inset 0 1px rgba(255, 255, 255, 0.11), 0 8px 18px rgba(1, 18, 29, 0.16);
      transition: opacity 0.2s ease, transform 0.2s ease, border-color 0.2s ease, background 0.2s ease;
    }
    .node:hover { transform: translateY(-3px); border-color: rgba(152, 237, 224, 0.68); background: rgba(239, 255, 252, 0.12); }
    .node b { color: #edfafa; font-size: 13px; }
    .node small { color: rgba(196, 224, 224, 0.64); font-size: 11px; }
    .node.current { background: rgba(47, 145, 104, 0.2); border-color: rgba(99, 204, 157, 0.64); }
    .node.target { background: rgba(17, 128, 157, 0.2); border-color: rgba(101, 198, 218, 0.55); }
    .node.ai { background: rgba(192, 104, 43, 0.21); border-color: rgba(236, 166, 102, 0.72); }
    .node.gap { border-style: dashed; border-color: rgba(205, 222, 225, 0.47); background: rgba(255, 255, 255, 0.035); }
    .arch-flow {
      margin-top: 18px;
      overflow: hidden;
      border: 1px solid rgba(24, 71, 83, 0.14);
      border-radius: var(--radius);
      background: rgba(255, 255, 255, 0.74);
      box-shadow: 0 12px 28px rgba(23, 62, 73, 0.07);
      backdrop-filter: blur(12px);
      -webkit-backdrop-filter: blur(12px);
    }
    .arch-flow div { padding: 16px 18px; border-right-color: var(--line); }
    .arch-flow b { color: var(--blue); }
    .arch-flow span { color: var(--muted); }

    .process-scroll { padding: 4px 2px 20px; scrollbar-color: #65bcb0 rgba(14, 45, 57, 0.12); }
    .process-line { gap: 30px; }
    .process-step {
      min-height: 226px;
      overflow: visible;
      border: 1px solid rgba(27, 78, 91, 0.16);
      border-top: 4px solid var(--blue);
      border-radius: var(--radius);
      background: rgba(255, 255, 255, 0.76);
      box-shadow: 0 13px 28px rgba(21, 61, 72, 0.1), inset 0 1px rgba(255, 255, 255, 0.92);
      transition: transform 0.22s ease, box-shadow 0.22s ease;
      scroll-snap-align: start;
    }
    .process-step:hover { transform: translateY(-5px); box-shadow: 0 19px 34px rgba(21, 61, 72, 0.15), inset 0 1px rgba(255, 255, 255, 0.92); }
    .process-step::after { color: var(--cyan); text-shadow: 0 0 14px rgba(20, 184, 174, 0.3); }
    .process-step .num { color: var(--blue); }
    .process-step h3 { color: var(--navy); }
    .process-step p { color: var(--muted); }
    .process-step .data-tag { color: var(--green); border-top-color: rgba(39, 138, 104, 0.32); }
    .quality-loop {
      overflow: hidden;
      border: 1px solid rgba(105, 218, 188, 0.32);
      border-radius: var(--radius);
      background: linear-gradient(115deg, #0c3442, #0b2637);
      box-shadow: 0 16px 32px rgba(12, 46, 58, 0.14);
    }
    .quality-loop div { padding: 16px 15px; border-right-color: rgba(144, 226, 211, 0.18); }
    .quality-loop b { color: #6ddcc0; }
    .quality-loop small { color: rgba(217, 241, 237, 0.68); }
    .process-facts {
      overflow: hidden;
      border: 1px solid rgba(24, 71, 83, 0.14);
      border-radius: var(--radius);
      background: rgba(255, 255, 255, 0.74);
      box-shadow: 0 12px 28px rgba(23, 62, 73, 0.07);
    }
    .process-facts div { padding: 16px 18px; background: transparent; border-right-color: var(--line); }
    .process-facts strong { color: var(--navy); }
    .process-facts span { color: var(--muted); }

    .portfolio-grid { gap: 26px; }
    .scene-groups { gap: 13px; }
    .scene-group {
      overflow: hidden;
      border: 1px solid rgba(27, 78, 91, 0.15);
      border-radius: var(--radius);
      background: rgba(255, 255, 255, 0.72);
      box-shadow: 0 10px 24px rgba(23, 62, 73, 0.07);
    }
    .scene-title { padding: 16px; background: rgba(218, 239, 238, 0.7); border-right-color: var(--line); }
    .scene-title b { color: var(--navy); }
    .scene-title strong { color: var(--blue); }
    .scene-list { padding: 13px 15px; }
    .scene-list span { border-color: rgba(27, 78, 91, 0.14); border-radius: 5px; background: rgba(255, 255, 255, 0.65); }
    .scene-list .priority { border-color: rgba(39, 138, 104, 0.4); background: var(--current-bg); color: #1e6b51; }
    .scene-list .candidate { border-color: rgba(65, 100, 110, 0.35); }
    .ai-panel {
      overflow: hidden;
      border: 1px solid rgba(111, 209, 190, 0.42);
      border-radius: var(--radius);
      background: #0c2a39;
      box-shadow: 0 20px 42px rgba(9, 45, 56, 0.2), inset 0 1px rgba(255, 255, 255, 0.1);
    }
    .ai-panel-head { padding: 20px; background: linear-gradient(135deg, rgba(189, 107, 43, 0.28), rgba(12, 79, 80, 0.56)); border-bottom-color: rgba(150, 224, 210, 0.18); }
    .ai-panel-head strong { color: #ffc17f; font-size: 19px; }
    .ai-panel-head p { color: rgba(229, 245, 239, 0.7); }
    .ai-list li { padding: 13px 16px; border-bottom-color: rgba(150, 224, 210, 0.14); }
    .ai-list .ai-index { color: #73dfc3; }
    .ai-list b { color: #f1fbfa; }
    .ai-list small { color: rgba(214, 235, 232, 0.66); }
    .priority-tag { color: #7ae0bb; border-color: rgba(122, 224, 187, 0.46); background: rgba(60, 159, 119, 0.18); border-radius: 4px; }

    @media (min-width: 1101px) {
      .portfolio-grid { align-items: stretch; }
      .scene-groups {
        height: 100%;
        grid-template-rows: repeat(5, minmax(100px, 1fr));
      }
      .scene-group { min-height: 0; }
      .scene-title {
        display: flex;
        flex-direction: column;
        justify-content: center;
      }
      .ai-panel { height: 100%; }
    }

    .gate {
      overflow: hidden;
      border: 1px solid rgba(199, 83, 74, 0.42);
      border-left: 4px solid var(--red);
      border-radius: var(--radius);
      background: rgba(255, 239, 235, 0.78);
      box-shadow: 0 12px 26px rgba(130, 60, 56, 0.08);
    }
    .gate .gate-id { color: var(--red); }
    .gate .gate-action { color: var(--red); }
    .level-table-wrap { overflow-x: auto; border-radius: var(--radius); box-shadow: 0 14px 30px rgba(23, 62, 73, 0.07); }
    .level-table { border: 1px solid rgba(27, 78, 91, 0.16); background: rgba(255, 255, 255, 0.82); }
    .level-table th, .level-table td { padding: 15px 16px; border-color: rgba(27, 78, 91, 0.13); }
    .level-table th { background: var(--navy); color: #eaf8f6; }
    .level-table .excellent { background: rgba(216, 241, 239, 0.7); }
    .roadmap {
      position: relative;
      gap: 12px;
      border: 0;
      background: transparent;
      counter-reset: phase;
    }
    .road-step {
      position: relative;
      overflow: hidden;
      min-height: 222px;
      padding: 20px 18px 18px;
      border: 1px solid rgba(27, 78, 91, 0.16);
      border-top: 3px solid var(--cyan);
      border-radius: var(--radius);
      background: rgba(255, 255, 255, 0.72);
      box-shadow: 0 12px 24px rgba(23, 62, 73, 0.07);
      counter-increment: phase;
    }
    .road-step::before {
      content: "0" counter(phase);
      position: absolute;
      right: 15px;
      top: 11px;
      color: rgba(8, 127, 152, 0.14);
      font-family: "Bahnschrift", "Aptos Display", sans-serif;
      font-size: 32px;
      font-weight: 800;
    }
    .road-step:nth-child(4) { border-top-color: var(--orange); }
    .road-step:nth-child(5) { border-top-color: var(--green); }
    .road-step:last-child { border-right: 1px solid rgba(27, 78, 91, 0.16); }
    .road-step .when { color: var(--blue); }
    .road-step h3 { position: relative; color: var(--navy); }
    .road-step p { color: var(--muted); }
    .road-step ul { color: var(--ink-soft); }

    .diagnosis-summary { gap: 26px; margin-bottom: 26px; }
    .diagnosis-intro {
      border: 1px solid rgba(39, 138, 104, 0.26);
      border-left: 4px solid var(--green);
      border-radius: var(--radius);
      background: rgba(226, 245, 236, 0.78);
      box-shadow: 0 12px 26px rgba(35, 112, 82, 0.07);
    }
    .progress-box {
      border: 1px solid rgba(27, 78, 91, 0.15);
      border-radius: var(--radius);
      background: rgba(255, 255, 255, 0.76);
      box-shadow: 0 12px 26px rgba(23, 62, 73, 0.07);
    }
    .progress-box strong { color: var(--navy); }
    .progress-track { height: 10px; overflow: hidden; border-radius: 99px; background: #dce9e9; }
    .progress-fill { border-radius: inherit; background: linear-gradient(90deg, #249c79, #6dd9ad); box-shadow: 0 0 16px rgba(65, 184, 136, 0.4); }
    .weeks { gap: 16px; }
    .week {
      overflow: hidden;
      border: 1px solid rgba(27, 78, 91, 0.15);
      border-radius: var(--radius);
      background: rgba(255, 255, 255, 0.72);
      box-shadow: 0 12px 26px rgba(23, 62, 73, 0.07);
    }
    .week-head { padding: 17px; background: linear-gradient(135deg, rgba(219, 239, 239, 0.86), rgba(241, 247, 245, 0.72)); border-bottom-color: rgba(27, 78, 91, 0.12); }
    .week-head .week-no { color: var(--blue); }
    .week-head h3 { color: var(--navy); }
    .week-head p { color: var(--muted); }
    .day-list li { padding: 12px 13px; border-bottom-color: rgba(27, 78, 91, 0.1); transition: background 0.18s ease; }
    .day-list li:hover { background: rgba(218, 242, 238, 0.5); }
    .day-list input { width: 15px; height: 15px; margin-top: 4px; accent-color: var(--green); }
    .day-list b { color: var(--blue); }
    .day-list span { color: var(--ink); }
    .day-list small { color: var(--muted); }
    .deliverables {
      overflow: hidden;
      border: 1px solid rgba(27, 78, 91, 0.15);
      border-radius: var(--radius);
      background: rgba(255, 255, 255, 0.72);
      box-shadow: 0 12px 26px rgba(23, 62, 73, 0.07);
    }
    .deliverable { padding: 18px 17px; border-right-color: rgba(27, 78, 91, 0.12); }
    .deliverable b { color: var(--green); }
    .deliverable p { color: var(--muted); }
    .scope-matrix { border-top-color: rgba(27, 78, 91, 0.15); border-left-color: rgba(27, 78, 91, 0.15); }
    .scope-item { min-height: 116px; padding: 15px; background: rgba(255, 255, 255, 0.67); border-right-color: rgba(27, 78, 91, 0.15); border-bottom-color: rgba(27, 78, 91, 0.15); }
    .scope-item b { color: var(--navy); }
    .scope-item small { color: var(--muted); }

    .evidence-grid { gap: 26px; }
    .evidence-chain {
      overflow: hidden;
      border: 1px solid rgba(111, 209, 190, 0.34);
      border-radius: var(--radius);
      background: #0c2a39;
      box-shadow: 0 20px 42px rgba(9, 45, 56, 0.17), inset 0 1px rgba(255, 255, 255, 0.09);
    }
    .evidence-step { border-bottom-color: rgba(150, 224, 210, 0.14); }
    .evidence-step strong { padding: 15px 14px; color: #73dfc3; background: rgba(255, 255, 255, 0.06); }
    .evidence-step div { padding: 15px; }
    .evidence-step b { color: #f1fbfa; }
    .evidence-step small { color: rgba(214, 235, 232, 0.66); }
    .kpi-groups {
      overflow: hidden;
      border: 1px solid rgba(27, 78, 91, 0.15);
      border-radius: var(--radius);
      background: rgba(255, 255, 255, 0.72);
      box-shadow: 0 12px 26px rgba(23, 62, 73, 0.07);
    }
    .kpi { padding: 18px 16px; border-right-color: rgba(27, 78, 91, 0.12); border-bottom-color: rgba(27, 78, 91, 0.12); }
    .kpi b { color: var(--green); }
    .kpi p { color: var(--muted); }

    .reference-gallery { gap: 20px; }
    figure {
      overflow: hidden;
      border: 1px solid rgba(27, 78, 91, 0.16);
      border-radius: var(--radius);
      background: rgba(255, 255, 255, 0.74);
      box-shadow: 0 16px 32px rgba(23, 62, 73, 0.09);
    }
    figure img { background: #0b2031; }
    figcaption { padding: 13px 15px; color: var(--muted); background: rgba(255, 255, 255, 0.76); border-top-color: rgba(27, 78, 91, 0.12); }
    .source-notes { border-top-color: rgba(27, 78, 91, 0.14); color: var(--muted); }
    .disclaimer { border-radius: 5px; background: rgba(255, 247, 235, 0.82); border-left-color: var(--orange); box-shadow: 0 8px 20px rgba(141, 82, 35, 0.06); }

    footer { background: #071d2a; color: rgba(224, 242, 240, 0.78); border-top: 1px solid rgba(113, 220, 199, 0.18); }
    footer .container { padding-top: 32px; padding-bottom: 32px; }
    footer p { color: rgba(224, 242, 240, 0.68); }

    @keyframes rise-in {
      from { opacity: 0; transform: translateY(14px); }
      to { opacity: 1; transform: translateY(0); }
    }
    @keyframes glass-sheen {
      0%, 65%, 100% { transform: translateX(-110%); }
      78% { transform: translateX(110%); }
    }
    @media (prefers-reduced-motion: reduce) {
      html { scroll-behavior: auto; }
      *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; }
    }

    @media (max-width: 1100px) {
      .topbar-inner { flex-wrap: wrap; }
      .nav { order: 3; width: 100%; margin-left: 0; }
      .overview-grid { grid-template-columns: 1fr; gap: 36px; }
      .overview-copy { max-width: 920px; }
      .hero-index { max-width: 720px; }
      .decision-strip { grid-template-columns: 1fr 1fr; }
      .decision-main { grid-column: 1 / -1; border-right: 0; }
      .decision-item:nth-child(3) { border-left: 0; }
      .portfolio-grid, .evidence-grid { grid-template-columns: 1fr; }
      .weeks { grid-template-columns: 1fr 1fr; }
      .roadmap { grid-template-columns: 1fr 1fr; }
      .road-step { border-bottom: 1px solid rgba(27, 78, 91, 0.16); }
      .scope-matrix { grid-template-columns: repeat(3, 1fr); }
    }
    @media (max-width: 680px) {
      .topbar-inner, .container { padding-left: 16px; padding-right: 16px; }
      .topbar-inner { min-height: 68px; }
      .brand-pair { width: 100%; min-width: 0; padding-right: 72px; }
      .brand-wordmark { width: 108px; }
      .brand-name { font-size: 12px; }
      .print-btn { position: absolute; right: 16px; top: 14px; min-width: 64px; height: 36px; }
      .nav { padding-bottom: 2px; overflow-x: auto; }
      .nav a { padding-left: 8px; padding-right: 8px; }
      .nav a::after { left: 8px; right: 8px; }
      .container { padding-top: 58px; padding-bottom: 58px; }
      .overview { padding-top: 58px; padding-bottom: 58px; }
      h1 { font-size: 31px; line-height: 1.25; }
      h2 { font-size: 24px; }
      .lead { font-size: 15px; }
      #overview .overview-copy > .eyebrow { font-size: 13px; }
      .hero-index { padding: 11px; }
      .index-media { height: auto; }
      .index-caption strong { font-size: 17px; }
      .decision-strip, .diagnosis-summary, .weeks, .reference-gallery { grid-template-columns: 1fr; }
      .decision-main, .decision-item { min-height: 0; padding: 18px; }
      .decision-item { border-left: 0; border-top: 1px solid rgba(158, 238, 224, 0.2); }
      .risk-banner, .gate { grid-template-columns: 1fr; }
      .gate { gap: 10px; padding: 17px; }
      .gate .gate-action { white-space: normal; }
      .arch-flow, .process-facts, .quality-loop, .deliverables, .roadmap { grid-template-columns: 1fr; }
      .arch-flow div, .process-facts div, .quality-loop div, .deliverable, .road-step { border-right: 0; border-bottom: 1px solid rgba(27, 78, 91, 0.12); }
      .quality-loop div { border-bottom-color: rgba(144, 226, 211, 0.18); }
      .quality-loop div:last-child, .process-facts div:last-child, .deliverable:last-child, .road-step:last-child { border-bottom: 0; }
      .scene-group { grid-template-columns: 104px 1fr; }
      .scene-title { padding: 14px 12px; }
      .scene-list { padding: 12px; }
      .scope-matrix { grid-template-columns: 1fr 1fr; }
      .scope-item { min-height: 108px; padding: 13px 11px; }
      .section-head > div:first-child { padding-left: 16px; }
      .section-kicker { min-height: 54px; padding-bottom: 6px; }
      .section-number { left: -6px; top: -8px; font-size: 68px; }
      .section-label { font-size: 13px; }
      .section-head h2 { font-size: 27px; line-height: 1.24; }
      .source-notes ul { columns: 1; }
      footer .container { display: block; }
      footer p + p { margin-top: 8px; }
    }
    @media print {
      body { background: #fff; color: #111; }
      .topbar { background: #fff; box-shadow: none; backdrop-filter: none; }
      .topbar::after, .nav, .print-btn, .segmented { display: none !important; }
      .container { max-width: none; padding: 24px 18px; }
      #overview { color: var(--ink); background: #fff; }
      #overview::before, #overview::after, .hero-index { display: none; }
      #overview .eyebrow { color: var(--blue); }
      #overview h1 { color: var(--ink); }
      #overview .lead { color: var(--muted); }
      .overview-grid { display: block; }
      .decision-strip, .risk-banner { box-shadow: none; background: #fff; color: var(--ink); }
      .decision-main { background: #e7f1f1; color: var(--ink); }
      .decision-main strong, .decision-item strong { color: var(--ink); }
      .decision-main p, .decision-item p, .risk-banner p { color: var(--muted); }
      .architecture { box-shadow: none; }
      .band { break-inside: avoid; }
      .node { box-shadow: none; }
      .process-step, .week, .road-step, figure, .ai-panel, .evidence-chain { box-shadow: none; }
    }

/* Extracted inline style block 3; order preserved. */
:root {
      color-scheme: light;
      --ink: #172c35;
      --ink-soft: #526872;
      --muted: #667b84;
      --line: rgba(24, 70, 82, 0.15);
      --paper: #ffffff;
      --soft: #edf4f4;
      --navy: #123c4c;
      --blue: #087f98;
      --cyan: #12aa9d;
      --green: #238a67;
      --orange: #c36d29;
      --red: #b34d49;
      --current-bg: #e5f4ec;
      --target-bg: #e7f3f6;
      --ai-bg: #fff1e3;
      --risk-bg: #fff0ed;
      --shadow: 0 16px 38px rgba(25, 71, 82, 0.08);
      --glass-shadow: 0 18px 42px rgba(25, 71, 82, 0.1);
    }

    html { background: #edf4f4; }
    body {
      color: var(--ink);
      background-color: #edf4f4;
      background-image:
        linear-gradient(rgba(12, 86, 101, 0.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(12, 86, 101, 0.045) 1px, transparent 1px);
      background-size: 48px 48px;
    }
    .topbar {
      background: rgba(255, 255, 255, 0.9);
      border-bottom-color: rgba(24, 70, 82, 0.16);
      box-shadow: 0 8px 28px rgba(25, 71, 82, 0.08);
      backdrop-filter: blur(20px) saturate(140%);
      -webkit-backdrop-filter: blur(20px) saturate(140%);
    }
    .topbar::after { background: linear-gradient(90deg, var(--cyan), #5ccbb8); }
    .brand-name { color: var(--navy); }
    .brand-sub { color: var(--muted); }
    .brand-divider { background: rgba(24, 70, 82, 0.18); }
    .nav a { color: var(--muted); }
    .nav a:hover, .nav a.active { color: var(--navy); }
    .print-btn {
      border-color: var(--navy);
      background: var(--navy);
      color: #f5ffff;
      box-shadow: 0 8px 18px rgba(18, 60, 76, 0.16);
    }
    .print-btn:hover { background: #1b5262; }

    main { background: transparent; }
    .band {
      background: rgba(255, 255, 255, 0.9);
      border-bottom-color: rgba(24, 70, 82, 0.11);
    }
    .band.alt { background: rgba(230, 241, 242, 0.78); }

    #overview {
      color: var(--ink);
      background:
        linear-gradient(115deg, #e3f0f1 0%, #f8fbfb 56%, #dff1ed 100%);
      border-bottom-color: rgba(18, 170, 157, 0.24);
    }
    #overview::before {
      opacity: 0.06;
      mix-blend-mode: multiply;
      background-position: center right;
    }
    #overview::after {
      opacity: 0.28;
      background-image:
        linear-gradient(90deg, transparent 49%, rgba(18, 136, 145, 0.13) 50%, transparent 51%),
        linear-gradient(rgba(18, 136, 145, 0.13) 1px, transparent 1px);
    }
    #overview .eyebrow { color: var(--blue); }
    .overview-grid { display: block; }
    .overview-copy {
      max-width: 1120px;
      margin: 0 auto;
      text-align: center;
    }
    #overview .overview-copy > .eyebrow {
      display: block;
      max-width: 100%;
      margin-bottom: 18px;
    }
    #overview .overview-copy > .eyebrow::before { display: none; }
    #overview h1 {
      max-width: 1120px;
      margin: 0 auto 20px;
      color: var(--navy);
      font-size: clamp(31px, 3.6vw, 56px);
      line-height: 1.14;
    }
    .hero-title-line { display: block; }
    #overview .lead {
      max-width: 900px;
      margin-left: auto;
      margin-right: auto;
      color: var(--muted);
    }
    #overview .chip {
      border-color: rgba(18, 127, 152, 0.22);
      background: rgba(255, 255, 255, 0.62);
      color: var(--muted);
    }
    .hero-index {
      border-color: rgba(8, 127, 152, 0.24);
      background: rgba(255, 255, 255, 0.62);
      box-shadow: var(--glass-shadow), inset 0 1px rgba(255, 255, 255, 0.92);
    }
    .hero-index::after { background: linear-gradient(112deg, transparent 24%, rgba(255, 255, 255, 0.56) 44%, transparent 62%); }
    .index-head { color: var(--muted); }
    .index-status { color: var(--green); }
    .index-media { border-color: rgba(8, 127, 152, 0.26); background: #102d3d; }
    .index-caption { border-bottom-color: rgba(24, 70, 82, 0.15); }
    .index-caption span { color: var(--green); }
    .index-caption strong { color: var(--navy); }
    .index-caption small, .index-metrics span { color: var(--muted); }
    .index-metrics div { border-left-color: rgba(24, 70, 82, 0.15); }
    .index-metrics strong { color: var(--navy); }

    .decision-strip {
      border-color: rgba(18, 127, 152, 0.2);
      background: rgba(255, 255, 255, 0.72);
      box-shadow: var(--glass-shadow);
    }
    .decision-main {
      background: linear-gradient(135deg, #d8efec, #eaf6f4);
      border-right-color: rgba(18, 127, 152, 0.18);
    }
    .decision-main strong, .decision-item strong { color: var(--navy); }
    .decision-main p, .decision-item p { color: var(--muted); }
    .decision-item { border-left-color: rgba(24, 70, 82, 0.14); }
    .decision-item .label { color: var(--green); }
    .risk-banner {
      border-color: rgba(179, 77, 73, 0.28);
      border-left-color: #d26961;
      background: rgba(255, 240, 237, 0.9);
      box-shadow: 0 12px 26px rgba(130, 60, 56, 0.06);
    }
    .risk-banner strong { color: var(--red); }
    .risk-banner p { color: var(--ink-soft); }
    .risk-banner p b { color: #9f423e; }

    .segmented {
      border-color: rgba(24, 70, 82, 0.16);
      background: rgba(255, 255, 255, 0.82);
      box-shadow: 0 8px 20px rgba(25, 71, 82, 0.07);
    }
    .segmented button { color: var(--muted); }
    .segmented button.active { background: var(--navy); color: #f5ffff; }
    .legend .lg-gap { background: rgba(255, 255, 255, 0.7); }

    .architecture-wrap { scrollbar-color: #71c5bb rgba(24, 70, 82, 0.08); }
    .architecture {
      border-color: rgba(8, 127, 152, 0.24);
      background: rgba(255, 255, 255, 0.86);
      box-shadow: 0 20px 42px rgba(25, 71, 82, 0.1), inset 0 1px rgba(255, 255, 255, 0.95);
    }
    .arch-row { border-bottom-color: rgba(24, 70, 82, 0.13); }
    .arch-label {
      background: rgba(225, 240, 241, 0.9);
      border-right-color: rgba(24, 70, 82, 0.13);
    }
    .arch-label b, .node b { color: var(--navy); }
    .arch-label small, .node small { color: var(--muted); }
    .arch-nodes { background: rgba(248, 252, 252, 0.74); }
    .node {
      border-color: rgba(24, 70, 82, 0.16);
      background: rgba(255, 255, 255, 0.88);
      box-shadow: inset 0 1px rgba(255, 255, 255, 0.96), 0 7px 16px rgba(25, 71, 82, 0.06);
    }
    .node:hover {
      border-color: rgba(8, 127, 152, 0.52);
      background: #ffffff;
      box-shadow: inset 0 1px rgba(255, 255, 255, 0.96), 0 10px 20px rgba(25, 71, 82, 0.1);
    }
    .node.current { background: var(--current-bg); border-color: rgba(39, 138, 104, 0.52); }
    .node.target { background: var(--target-bg); border-color: rgba(8, 127, 152, 0.42); }
    .node.ai { background: var(--ai-bg); border-color: rgba(195, 109, 41, 0.54); }
    .node.gap { border-color: rgba(82, 111, 120, 0.38); background: rgba(247, 250, 250, 0.82); }
    .arch-flow {
      border-color: rgba(24, 70, 82, 0.14);
      background: rgba(255, 255, 255, 0.82);
      box-shadow: 0 12px 28px rgba(25, 71, 82, 0.06);
    }
    .arch-flow div { border-right-color: rgba(24, 70, 82, 0.13); }

    .process-scroll { scrollbar-color: #71c5bb rgba(24, 70, 82, 0.08); }
    .quality-loop {
      border-color: rgba(195, 109, 41, 0.28);
      background: linear-gradient(115deg, #fff5e9, #e8f5f2);
      box-shadow: 0 14px 30px rgba(130, 84, 42, 0.07);
    }
    .quality-loop div { border-right-color: rgba(195, 109, 41, 0.18); }
    .quality-loop b { color: var(--orange); }
    .quality-loop small { color: var(--muted); }

    .portfolio-grid .scene-group {
      border-color: rgba(24, 70, 82, 0.15);
      background: rgba(255, 255, 255, 0.84);
      box-shadow: 0 10px 24px rgba(25, 71, 82, 0.06);
    }
    .portfolio-grid .scene-title { background: rgba(222, 239, 239, 0.82); border-right-color: rgba(24, 70, 82, 0.14); }
    .portfolio-grid .scene-title b { color: var(--navy); }
    .portfolio-grid .scene-title strong { color: var(--blue); }
    .portfolio-grid .scene-list span { border-color: rgba(24, 70, 82, 0.14); background: rgba(255, 255, 255, 0.78); }
    .portfolio-grid .scene-list .priority { border-color: rgba(39, 138, 104, 0.4); background: var(--current-bg); color: #1e6b51; }
    .ai-panel {
      border-color: rgba(195, 109, 41, 0.34);
      background: rgba(255, 255, 255, 0.88);
      box-shadow: 0 18px 38px rgba(25, 71, 82, 0.09), inset 0 1px rgba(255, 255, 255, 0.94);
    }
    .ai-panel-head {
      background: linear-gradient(135deg, rgba(255, 235, 211, 0.96), rgba(226, 244, 241, 0.96));
      border-bottom-color: rgba(195, 109, 41, 0.2);
    }
    .ai-panel-head strong { color: var(--orange); }
    .ai-panel-head p, .ai-list small { color: var(--muted); }
    .ai-list li { border-bottom-color: rgba(24, 70, 82, 0.13); }
    .ai-list .ai-index { color: var(--green); }
    .ai-list b { color: var(--navy); }
    .priority-tag { color: var(--green); border-color: rgba(39, 138, 104, 0.42); background: var(--current-bg); }

    .gate { box-shadow: 0 12px 26px rgba(130, 60, 56, 0.06); }
    .level-table { background: rgba(255, 255, 255, 0.9); }
    .level-table th { background: var(--navy); color: #edfafa; }
    .level-table thead th.excellent { background: #b8dfdc; color: var(--navy); font-weight: 800; }
    .road-step, .week, .progress-box, .deliverables, .kpi-groups, figure {
      box-shadow: 0 12px 26px rgba(25, 71, 82, 0.06);
    }
    .road-step, .week, .progress-box, .deliverables, .kpi-groups, figure { background: rgba(255, 255, 255, 0.84); }
    .week-head { background: linear-gradient(135deg, rgba(222, 239, 239, 0.9), rgba(247, 250, 249, 0.86)); }

    .evidence-chain {
      border-color: rgba(8, 127, 152, 0.24);
      background: rgba(255, 255, 255, 0.9);
      box-shadow: 0 18px 38px rgba(25, 71, 82, 0.08);
    }
    .evidence-step { border-bottom-color: rgba(24, 70, 82, 0.13); }
    .evidence-step strong { color: var(--blue); background: rgba(225, 240, 241, 0.9); }
    .evidence-step b { color: var(--navy); }
    .evidence-step small { color: var(--muted); }
    .source-notes { border-top-color: rgba(24, 70, 82, 0.14); }
    .disclaimer { background: rgba(255, 247, 235, 0.92); }

    footer {
      background: #e1eeee;
      color: var(--ink);
      border-top-color: rgba(18, 170, 157, 0.2);
    }
    footer p { color: var(--muted); }

    @media screen {
      body { font-size: 16px; }
      .nav a { font-size: 14px; font-weight: 700; }
      .lead { font-size: 18px; }
      .section-head p { font-size: 16px; }
      .decision-main p, .decision-item p, .risk-banner p { font-size: 14px; }
      .decision-item .label { font-size: 13px; }
      .chip, .legend span { font-size: 13px; }
      .node b { font-size: 15px; }
      .node small { font-size: 12px; }
      .arch-flow span { font-size: 13px; }
      .process-step .num { font-size: 13px; }
      .process-step h3 { font-size: 17px; }
      .process-step p { font-size: 13px; }
      .process-step .data-tag { font-size: 12px; }
      .process-facts span { font-size: 13px; }
      .scene-list span { font-size: 13px; }
      .ai-panel-head p { font-size: 14px; }
      .ai-list b { font-size: 14px; }
      .ai-list small { font-size: 12px; }
      .road-step .when { font-size: 13px; }
      .road-step p { font-size: 14px; }
      .road-step ul { font-size: 13px; }
      .week-head .week-no { font-size: 13px; }
      .week-head p { font-size: 13px; }
      .day-list b { font-size: 12px; }
      .day-list span { font-size: 13px; }
      .deliverable p, .kpi p { font-size: 13px; }
      figcaption, .source-notes, footer p { font-size: 13px; }
    }
    @media screen and (max-width: 680px) {
      .lead { font-size: 16px; }
    }

    @media (max-width: 680px) {
      #overview .overview-copy > .eyebrow { font-size: 13px; }
    }
    @media screen {
      #overview {
        background:
          linear-gradient(115deg, #c9e1e4 0%, #eaf5f5 55%, #c9e5dd 100%);
      }
      #overview .overview-copy > .eyebrow { font-size: 17px; }
      #overview .decision-main strong,
      #overview .decision-item strong { font-size: 20px; }
      #overview .chip { font-size: 14px; }
      .legend span { font-weight: 700; }
    }
    @media screen and (min-width: 1101px) {
      #roadmap .section-head > div > p:not(.section-kicker) {
        max-width: none;
        white-space: nowrap;
      }
    }
    @media screen and (max-width: 680px) {
      #overview .overview-copy > .eyebrow { font-size: 15px; }
      #overview .chip { font-size: 13px; }
      #roadmap .section-head > div > p:not(.section-kicker) {
        max-width: none;
        white-space: normal;
      }
    }
    @media print {
      #overview { color: var(--ink); background: #fff; }
      #overview::before, #overview::after { display: none; }
      .hero-index { box-shadow: none; }
      footer { background: #fff; color: #111; }
    }

    @media screen {
      .print-btn,
      .print-btn:visited,
      .print-btn:hover,
      .print-btn:focus,
      .print-btn:active {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        text-align: center;
        line-height: 1;
        font-size: 14px;
        font-weight: 700;
        text-decoration: none;
      }
      #overview .decision-main {
        background: linear-gradient(135deg, #2f8c87 0%, #145567 100%);
        border-right-color: rgba(210, 250, 243, 0.3);
        box-shadow: 0 14px 30px rgba(17, 70, 80, 0.16), inset 0 1px rgba(255, 255, 255, 0.18);
      }
      #overview .decision-main strong { color: #ffffff; }
      #overview .decision-main p { color: rgba(238, 253, 250, 0.84); }
      #overview .chips { justify-content: center; }
      #process .process-step {
        border-color: rgba(27, 105, 113, 0.24);
        border-top-color: #168f8b;
        background: linear-gradient(180deg, #c5e4e1 0%, #e3f2ef 100%);
        box-shadow: 0 14px 28px rgba(21, 82, 89, 0.13), inset 0 1px rgba(255, 255, 255, 0.78);
      }
      #process > .container > h3 {
        margin-top: 28px;
        margin-bottom: 0;
        text-align: left;
        font-weight: 800;
      }
      #roadmap > .container > .chips {
        justify-content: center;
        margin-bottom: 20px;
      }
      .architecture .node.gap {
        border: 2px dashed rgba(51, 91, 101, 0.78);
        background: rgba(255, 249, 239, 0.94);
        box-shadow: inset 0 0 0 1px rgba(51, 91, 101, 0.08), 0 7px 16px rgba(25, 71, 82, 0.07);
      }
      .architecture .node.gap:hover {
        border-color: rgba(35, 113, 122, 0.92);
      }
      .legend .lg-gap {
        width: 14px;
        height: 14px;
        border: 2px dashed rgba(51, 91, 101, 0.78);
        background: #fff9ef;
      }
    }
    @media screen and (min-width: 1101px) {
      #architecture .section-head > div > p:not(.section-kicker),
      #process .section-head > div > p:not(.section-kicker),
      #diagnosis .section-head > div > p:not(.section-kicker),
      #portfolio .section-head > div > p:not(.section-kicker),
      #references .section-head > div > p:not(.section-kicker) {
        max-width: none;
        white-space: nowrap;
      }
    }


    @media screen and (min-width: 1101px) {
      #evidence .section-head > div > p:not(.section-kicker) {
        max-width: none;
        white-space: nowrap;
      }
    }
    @media screen and (max-width: 680px) {
      #architecture .section-head > div > p:not(.section-kicker),
      #process .section-head > div > p:not(.section-kicker),
      #diagnosis .section-head > div > p:not(.section-kicker),
      #portfolio .section-head > div > p:not(.section-kicker),
      #references .section-head > div > p:not(.section-kicker),
      #evidence .section-head > div > p:not(.section-kicker) {
        max-width: none;
        white-space: normal;
      }
    }

    .particle-field {
      position: fixed;
      inset: 0;
      z-index: 2;
      display: block;
      width: 100%;
      height: 100%;
      pointer-events: none;
      opacity: 0.9;
    }

    @media screen {
      main,
      footer {
        position: relative;
        z-index: 1;
      }

      #overview {
        background:
          linear-gradient(115deg, rgba(201, 225, 228, 0.92) 0%, rgba(234, 245, 245, 0.92) 55%, rgba(201, 229, 221, 0.92) 100%);
      }

      #overview .decision-main {
        position: relative;
        isolation: isolate;
        overflow: hidden;
        transition: transform 0.22s ease;
        animation: decision-breathe 4.2s ease-in-out infinite;
      }
      #overview .decision-main > * {
        position: relative;
        z-index: 1;
      }
      #overview .decision-main::before {
        content: "";
        position: absolute;
        inset: 2px;
        z-index: 0;
        border: 2px solid rgba(168, 244, 226, 0.74);
        border-radius: calc(var(--radius) - 2px);
        box-shadow: inset 0 0 18px rgba(123, 235, 211, 0.11);
        pointer-events: none;
        animation: decision-ring 4.2s ease-in-out infinite;
      }
      #overview .decision-main::after {
        content: "";
        position: absolute;
        top: -25%;
        bottom: -25%;
        left: -42%;
        z-index: 0;
        width: 32%;
        background: linear-gradient(90deg, transparent, rgba(224, 255, 247, 0.24), transparent);
        transform: translateX(-150%) skewX(-18deg);
        pointer-events: none;
        animation: decision-sheen 5.8s 0.5s ease-in-out infinite;
      }
      #overview .decision-main:hover {
        transform: translateY(-2px);
      }
      #overview .decision-main:hover::before {
        border-color: rgba(205, 255, 242, 0.82);
      }

      @keyframes decision-breathe {
        0%, 100% {
          box-shadow: 0 14px 30px rgba(17, 70, 80, 0.18), inset 0 0 0 1px rgba(145, 241, 220, 0.2), inset 0 1px rgba(255, 255, 255, 0.2);
        }
        50% {
          box-shadow: 0 18px 38px rgba(17, 70, 80, 0.28), inset 0 0 0 2px rgba(181, 250, 230, 0.4), inset 0 0 24px rgba(123, 235, 211, 0.09), inset 0 1px rgba(255, 255, 255, 0.3);
        }
      }
      @keyframes decision-ring {
        0%, 100% {
          opacity: 0.68;
          border-color: rgba(168, 244, 226, 0.68);
          box-shadow: inset 0 0 12px rgba(123, 235, 211, 0.08);
        }
        50% {
          opacity: 1;
          border-color: rgba(202, 255, 240, 0.96);
          box-shadow: inset 0 0 26px rgba(123, 235, 211, 0.18);
        }
      }
      @keyframes decision-sheen {
        0%, 42%, 100% { transform: translateX(-150%) skewX(-18deg); }
        56% { transform: translateX(520%) skewX(-18deg); }
      }
    }

    @media screen and (max-width: 680px) {
      .particle-field { opacity: 0.78; }
      #overview .decision-main:hover { transform: none; }
    }

    @media (prefers-reduced-motion: reduce) {
      .particle-field { opacity: 0.42; }
      #overview .decision-main { animation: none; transition: none; }
      #overview .decision-main::before { animation: none; opacity: 0.72; }
      #overview .decision-main::after { display: none; }
    }

    @media print {
      .particle-field { display: none !important; }
      #overview .decision-main { animation: none; box-shadow: none; transform: none; }
      #overview .decision-main::before,
      #overview .decision-main::after { display: none; }
    }
