
    :root {
      --ink: #243653;
      --muted: #64738d;
      --line: #dce5f5;
      --canvas: #f7f9ff;
      --card: #ffffff;
      --brand: #4f80df;
      --brand-strong: #3065c6;
      --brand-soft: #eaf0ff;
      --blue: #91b5f4;
      --shadow: 0 14px 36px rgba(62,96,170,.07);
      --radius: 22px;
    }
    * { box-sizing: border-box; }
    html { scroll-behavior: smooth; }
    body { margin: 0; background: var(--canvas); color: var(--ink); font-family: "Pretendard", "Noto Sans KR", "Malgun Gothic", "Apple SD Gothic Neo", Arial, sans-serif; font-size: 14px; line-height: 1.5; }
    button, select, input { font: inherit; }
    button { cursor: pointer; }
    button:focus-visible, select:focus-visible, input:focus-visible, a:focus-visible { outline: 3px solid #7199ec; outline-offset: 3px; }
    .app { display: grid; grid-template-columns: 244px minmax(0, 1fr); min-height: 100vh; }
    .sidebar { color: var(--ink); background: #ffffff; border-right:1px solid var(--line); min-height: 100vh; display: flex; flex-direction: column; padding: 28px 17px 22px; position: sticky; top: 0; height: 100vh; }
    .brand { display: flex; gap: 11px; align-items: center; padding: 0 14px; margin-bottom: 54px; }
    .brand-mark { width: 37px; height: 37px; display: grid; place-items: center; border-radius: 12px; background: linear-gradient(145deg,#75a2f3,#4079dc); color: #ffffff; flex: none; }
    .brand-mark svg { width: 22px; }
    .brand b { display:block; font-size: 15px; letter-spacing: -.05em; line-height: 1.1; }
    .brand small { display:block; color: var(--brand-strong); font-size: 10px; font-weight: 700; letter-spacing: .17em; margin-top: 5px; }
    .nav-label { color: #818ea7; letter-spacing: .18em; font-size: 10px; font-weight: 800; padding: 0 16px; margin-bottom: 12px; }
    .nav { display: grid; gap: 5px; }
    .nav a { display: flex; align-items: center; gap: 13px; padding: 12px 15px; color: #5f6d88; text-decoration: none; border-radius: 11px; font-size: 13px; font-weight: 700; transition: .18s ease; }
    .nav a svg { width: 18px; height: 18px; stroke: currentColor; fill: none; stroke-width: 1.8; }
    .nav a:hover, .nav a.active { background: var(--brand-soft); color: var(--brand-strong); }
    .nav a.active::after { content: ""; width: 6px; height: 6px; margin-left: auto; border-radius: 50%; background: var(--brand); }
    .sidebar-bottom { margin-top: auto; padding: 20px 14px 0; }
    .sidebar-note { border: 1px solid #d8e5fa; background: #eef4ff; border-radius: 15px; padding: 15px; }
    .sidebar-note .tiny { color: var(--brand-strong); font-size: 10px; letter-spacing: .13em; font-weight: 800; }
    .sidebar-note strong { display:block; margin: 7px 0 3px; font-size: 12px; }
    .sidebar-note span { display:block; color: #607194; font-size: 11px; line-height: 1.55; }
    .sidebar-foot { color: #93a0bb; font-size: 10px; margin-top: 20px; line-height: 1.6; }
    main { min-width: 0; padding: 0 40px 56px; }
    .topbar { min-height: 90px; display: flex; align-items: center; justify-content: space-between; gap: 24px; border-bottom: 1px solid var(--line); }
    .crumb { color: var(--muted); font-size: 12px; font-weight: 700; }
    .crumb strong { color: var(--ink); }
    .topright { display: flex; align-items: center; gap: 13px; color: #586277; font-size: 11px; font-weight: 700; }
    .topright .sep { width: 1px; height: 20px; background: #d5dae5; }
    .avatar { width: 32px; height: 32px; border-radius: 50%; background: #e7efff; color: var(--brand-strong); display:grid;place-items:center; font-size: 11px; font-weight: 900; }
    .content { max-width: 1560px; margin: 0 auto; }
    .intro { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; padding: 38px 0 27px; }
    .eyebrow { color: var(--brand-strong); letter-spacing: .16em; font-size: 11px; font-weight: 900; text-transform: uppercase; }
    h1 { margin: 7px 0 8px; font-size: clamp(28px,3vw,39px); letter-spacing: -.06em; line-height: 1.23; word-break: keep-all; }
    .intro p { margin: 0; color: var(--muted); font-size: 13px; }
    .tag { display: inline-flex; align-items: center; gap: 7px; border-radius: 999px; padding: 7px 11px; background: #e9f1ff; border: 1px solid #cfdefa; color: #2653ac; font-size: 11px; font-weight: 800; white-space: nowrap; }
    .tag::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--brand); }
    .demo-banner { display: flex; gap: 12px; align-items: flex-start; padding: 13px 17px; border-radius: 13px; background: #eef4ff; color: #49608e; border: 1px solid #d8e5fa; margin-bottom: 20px; font-size: 12px; }
    .demo-banner svg { flex: none; width: 17px; height: 17px; margin-top: 1px; }
    .demo-banner strong { color: #314877; }
    .filters { display: flex; align-items: center; flex-wrap: wrap; gap: 9px; padding: 13px; background: #ffffff; border: 1px solid var(--line); border-radius: 17px; box-shadow: var(--shadow); margin-bottom: 20px; }
    .explore-panel { margin:0 0 16px;padding:22px 24px;border:1px solid var(--line);border-radius:var(--radius);background:#ffffff;box-shadow:var(--shadow);scroll-margin-top:20px; }
    .explore-head { display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:16px; }
    .explore-head h2 { margin:0;font-size:17px;letter-spacing:-.04em; }
    .explore-head p { margin:5px 0 0;color:#65738a;font-size:11px;line-height:1.5; }
    .explore-controls { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px; }
    .explore-controls label { display:grid;gap:6px;color:#526583;font-size:11px;font-weight:800; }
    .explore-controls .filter-field select { width:100%;height:40px;background:#f6f9ff;border-color:#dbe5f6;font-size:12px; }
    .explore-result { display:flex;align-items:center;justify-content:space-between;gap:18px;margin-top:14px;padding:16px 18px;border:1px solid #dce7fa;border-radius:13px;background:linear-gradient(110deg,#f4f8ff,#eaf2ff); }
    .explore-result-copy { min-width:160px; }
    .explore-kicker { display:block;color:#3b68be;font-size:10px;font-weight:900;letter-spacing:.08em; }
    .explore-result h3 { margin:5px 0 3px;font-size:18px;letter-spacing:-.04em; }
    .explore-result p { margin:0;color:#60728d;font-size:11px;line-height:1.5; }
    .explore-stats { display:flex;justify-content:flex-end;flex-wrap:wrap;gap:8px; }
    .explore-stat { min-width:94px;padding:8px 10px;border:1px solid #d7e4fa;border-radius:10px;background:rgba(255,255,255,.8); }
    .explore-stat span { display:block;color:#6f7e95;font-size:10px;font-weight:700; }
    .explore-stat b { display:block;margin-top:3px;color:#214d9e;font-size:18px;letter-spacing:-.04em; }
    .explore-note { margin:10px 0 0;color:#6a7890;font-size:11px;line-height:1.55; }
    .jump-link { padding:8px 10px;border:1px solid #cfdefa;border-radius:9px;color:#285ab3;background:#f2f7ff;text-decoration:none;font-size:11px;font-weight:800;white-space:nowrap; }
    .jump-link:hover { background:#e8f1ff; }
    .filter-field { position: relative; }
    .filter-field select { appearance: none; min-width: 115px; height: 37px; border: 1px solid #d6ddeb; background: #f6f9fb; border-radius: 9px; padding: 0 31px 0 12px; color: #23375e; font-size: 12px; font-weight: 700; }
    .filter-field::after { content: ""; position: absolute; right: 13px; top: 13px; width: 6px; height: 6px; border-right: 1.6px solid #4f586b; border-bottom: 1.6px solid #4f586b; transform: rotate(45deg); pointer-events:none; }
    .filter-search { height: 37px; display: flex; align-items: center; gap: 7px; flex: 1 1 200px; min-width: 170px; padding: 0 11px; border: 1px solid #d6ddeb; background: #f6f9fb; border-radius: 9px; color: #626e85; }
    .filter-search svg { width: 15px; height: 15px; flex: none; }
    .filter-search input { min-width:0; width: 100%; background:transparent; border:0; outline:0; color: var(--ink); font-size: 12px; }
    .filter-search:focus-within { border-color: var(--brand); box-shadow: 0 0 0 3px #dbe8ff; }
    .filter-search input::placeholder { color: #838ea4; }
    .filter-actions { margin-left: auto; display: flex; gap: 7px; }
    .text-button, .export-button, .small-button { height: 37px; border-radius: 9px; padding: 0 12px; border: 1px solid #d6ddeb; background:#ffffff; color:#29406f; font-size: 12px; font-weight:800; white-space:nowrap; }
    .text-button:hover, .small-button:hover { background:#eff4f7; }
    .export-button { display:flex;align-items:center;gap:7px;border-color:var(--brand-strong);background:var(--brand-strong);color:#ffffff; }
    .export-button:hover { background:#1e499e; }
    .export-button svg { width:14px;height:14px; }
    .overview { display: grid; grid-template-columns: minmax(0,1.5fr) minmax(280px,.8fr); gap: 16px; margin-bottom: 16px; }
    .feature-card { position:relative; overflow:hidden; min-height: 200px; padding: 25px 29px; border:1px solid #d5e4fa; border-radius: var(--radius); background: linear-gradient(118deg,#eef4ff 0%,#dceaff 100%); color: var(--ink); }
    .feature-card::before { content:"";position:absolute;right:-30px;bottom:-112px;width:295px;height:295px;border:1px solid rgba(82,125,216,.18);border-radius:50%;box-shadow:0 0 0 44px rgba(126,159,231,.11),0 0 0 88px rgba(126,159,231,.07); }
    .feature-card::after { content:"";position:absolute;right:79px;top:27px;width:103px;height:103px;border: 24px solid rgba(103,143,225,.10);border-radius:50%; }
    .feature-card .eyebrow { color:var(--brand-strong); position:relative;z-index:1; }
    .feature-card h2 { position:relative;z-index:1; font-size: 27px; letter-spacing:-.05em; line-height:1.35;margin:19px 0 8px; }
    .feature-card h2 em { font-style:normal;color:#346fce; }
    .feature-card p { position:relative;z-index:1;margin:0;color:#596a8b;font-size:12px; }
    .feature-meta { position:relative;z-index:1;display:flex;gap:8px;flex-wrap:wrap;margin-top:20px; }
    .feature-meta span { padding:6px 9px;border:1px solid #bfceec;background:rgba(255,255,255,.55);border-radius:7px;color:#4b5e83;font-size:11px; }
    .feature-meta strong { color:#24478d; }
    .completion-card { min-height: 200px; border:1px solid #d5e4fa; border-radius:var(--radius); background:#e9f1ff; padding:23px 25px; display:flex; align-items:center; justify-content:space-between;gap:12px; }
    .completion-card .label { color:var(--brand-strong);font-size:11px;letter-spacing:.12em;font-weight:900; }
    .completion-card .big { display:block;font-size:39px;font-weight:900;letter-spacing:-.07em;line-height:1.2;margin-top:13px; }
    .completion-card p { max-width:145px;margin:9px 0 0;font-size:11px;color:#616d84; }
    .completion-ring { width:117px;height:117px;display:grid;place-items:center;flex:none;border-radius:50%;background:conic-gradient(var(--brand) 0%,#d3e1fa 0%); transform:rotate(-90deg); }
    .completion-ring div { width:86px;height:86px;display:grid;place-items:center;background:#e9f1ff;border-radius:50%;transform:rotate(90deg);font-size:11px;font-weight:800;color:#4c6f9d; }
    .metric-grid { display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-bottom:16px; }
    .metric { min-height:126px;border:1px solid var(--line);border-radius:var(--radius);background:#ffffff;padding:21px 21px 16px;box-shadow:var(--shadow); }
    .metric-top { display:flex;align-items:center;justify-content:space-between;gap:8px; }
    .metric-label { color:#66728b;font-size:12px;font-weight:700; }
    .metric-icon { width:31px;height:31px;border-radius:10px;display:grid;place-items:center;background:#eaf0ff;color:#3162c5; }
    .metric:nth-child(2) .metric-icon { background:#e6edfc;color:#3769ce; }
    .metric:nth-child(3) .metric-icon { background:#edf2fb;color:#6080bf; }
    .metric:nth-child(4) .metric-icon { background:#eef1fa;color:#7187be; }
    .metric-icon svg { width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:1.7; }
    .metric-value { display:flex;align-items:baseline;gap:4px;margin-top:10px;font-size:29px;font-weight:900;letter-spacing:-.05em;line-height:1.1; }
    .metric-value small { font-size:13px;font-weight:700;color:#66728b;letter-spacing:0; }
    .metric-foot { color:#929caf;font-size:11px;margin-top:6px; }
    .analytics { display:grid;grid-template-columns:minmax(0,1.8fr) minmax(300px,1fr);gap:16px;margin-bottom:16px; }
    .panel { min-width:0;background:#ffffff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:23px 24px; }
    .panel-head { display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:19px; }
    .panel-head h2 { font-size:17px;margin:0;letter-spacing:-.04em; }
    .panel-head p { color:#959eb0;font-size:11px;margin:4px 0 0; }
    .chart-legend { display:flex;gap:15px;align-items:center;flex-wrap:wrap;margin-top:4px;color:#636f87;font-size:11px;font-weight:700; }
    .legend-dot { display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:5px; }
    .trend-wrap { width:100%;height:223px; }
    .scroll-hint { display:none; }
    #trendChart { width:100%;height:100%;overflow:visible; }
    .chart-axis { fill:#8a94a8;font-size:10px;font-family:inherit; }
    .chart-grid { stroke:#e7eff4;stroke-width:1;stroke-dasharray:3 4; }
    .chart-bar { fill:#93b8f2;rx:4;transition:fill .2s; }
    .chart-bar:hover { fill:#4d7cdd; }
    .chart-line { stroke:#6d82db;stroke-width:2.5;fill:none;stroke-linejoin:round;stroke-linecap:round; }
    .chart-point { fill:#ffffff;stroke:#6d82db;stroke-width:2.3; }
    .grade-layout { display:flex;align-items:center;justify-content:space-around;gap:20px;min-height:218px; }
    .grade-donut { width:168px;height:168px;border-radius:50%;background:#e9f0f5;display:grid;place-items:center;flex:none;position:relative; }
    .grade-donut::before { content:"";position:absolute;inset:25px;border-radius:50%;background:#ffffff; }
    .grade-center { position:relative;text-align:center; }
    .grade-center b { display:block;font-size:28px;line-height:1.1;letter-spacing:-.06em; }
    .grade-center span { color:#8a94a8;font-size:11px; }
    .grade-legend { min-width:106px;display:grid;gap:9px; }
    .grade-legend-row { display:flex;align-items:center;gap:9px;color:#5e6980;font-size:12px; }
    .grade-legend-row b { color:#203256;margin-left:auto; }
    .grade-legend-row .swatch { width:9px;height:9px;border-radius:3px; }
    .leader-grid { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-bottom:16px; }
    .ai-section { margin:0 0 16px; scroll-margin-top:20px; }
    .ai-intro { display:flex;align-items:center;gap:16px;border:1px solid #d7e3fa;border-radius:var(--radius);background:linear-gradient(112deg,#f0f5ff,#e4edff);padding:22px 25px; }
    .ai-mark { flex:none;width:45px;height:45px;border-radius:14px;background:linear-gradient(145deg,#77a0ef,#4778db);color:#ffffff;display:grid;place-items:center;font-size:26px;line-height:1; }
    .ai-intro h2 { margin:4px 0 2px;font-size:21px;letter-spacing:-.05em; }
    .ai-intro p { margin:0;color:#62728f;font-size:12px; }
    .ai-label { margin-left:auto;padding:7px 10px;border:1px solid #c9daf8;border-radius:999px;color:#315fb9;background:#ffffff;font-size:10px;font-weight:800;white-space:nowrap; }
    .ai-grid { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:12px; }
    .ai-card { background:#ffffff;border:1px solid var(--line);border-radius:17px;padding:18px 19px;box-shadow:var(--shadow); }
    .ai-card .overline { color:#446abb;font-size:10px;font-weight:900;letter-spacing:.07em; }
    .ai-card strong { display:block;margin:9px 0 8px;color:#253f76;font-size:18px;letter-spacing:-.045em;line-height:1.36;word-break:keep-all; }
    .ai-card p { margin:0;color:#65738a;font-size:12px;line-height:1.6; }
    .ai-detail-grid { display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:16px;margin-top:16px; }
    .ai-panel { min-width:0;background:#ffffff;border:1px solid var(--line);border-radius:var(--radius);padding:22px 24px;box-shadow:var(--shadow); }
    .ai-panel h3 { margin:0 0 4px;font-size:16px;letter-spacing:-.04em; }
    .ai-panel-sub { margin:0 0 18px;color:#7a869a;font-size:12px; }
    .ai-rate-list { display:grid;gap:15px; }
    .ai-rate-head { display:flex;justify-content:space-between;align-items:baseline;gap:8px;font-size:12px;font-weight:800; }
    .ai-rate-head span { color:#526786;font-size:11px;white-space:nowrap; }
    .ai-rate-row.low .ai-rate-head,.ai-rate-row.low .ai-rate-head span { color:#315fb9; }
    .ai-rate-track { height:7px;margin-top:7px;background:#e9effb;border-radius:99px;overflow:hidden; }
    .ai-rate-track span { display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,#a8c4f4,#628dde); }
    .ai-rate-row.low .ai-rate-track span { background:linear-gradient(90deg,#a9bded,#567bce); }
    .ai-rate-note { margin:18px 0 0;border-top:1px solid var(--line);padding-top:13px;color:#728096;font-size:12px;line-height:1.6; }
    .ai-actions { display:grid;gap:0; }
    .ai-action { display:grid;grid-template-columns:28px minmax(0,1fr);gap:10px;padding:12px 0;border-top:1px solid #edf1f9; }
    .ai-action:first-child { border-top:0;padding-top:0; }
    .ai-action-index { width:25px;height:25px;border-radius:8px;display:grid;place-items:center;background:#e8efff;color:#3867c2;font-size:11px;font-weight:900; }
    .ai-action b { display:block;color:#2a4169;font-size:13px; }
    .ai-action p { margin:4px 0 0;color:#68768c;font-size:12px;line-height:1.55; }
    .ai-method { margin-top:12px;border:1px solid #dbe5f7;border-radius:12px;background:#f4f7ff;padding:12px 15px;color:#65758e;font-size:12px;line-height:1.6; }
    .ai-method strong { color:#355aa1; }
    .ranking { display:grid;gap:14px; }
    .rank-row { display:grid;grid-template-columns:18px minmax(0,1fr) 35px;align-items:center;gap:11px; }
    .rank-num { color:#9aa3b4;font-size:11px;font-weight:900; }
    .rank-label { display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:12px;font-weight:700;margin-bottom:7px; }
    .rank-label small { color:#939caf;font-weight:600;white-space:nowrap; }
    .rank-track { height:6px;background:#eaf1f5;border-radius:99px;overflow:hidden; }
    .rank-track > span { display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,#a9c9fa,#5288e6); }
    .person .rank-track > span { background:linear-gradient(90deg,#c1d8fa,#79a4ec); }
    .rank-count { font-size:12px;font-weight:900;text-align:right; }
    .table-panel { padding-bottom:14px; }
    .table-head { margin-bottom:17px; }
    .table-count { color:#6e7a93;font-size:11px;font-weight:700;white-space:nowrap; }
    .table-scroll { overflow-x:auto; }
    table { width:100%;border-collapse:collapse;text-align:left;min-width:730px; }
    th { padding:11px 12px;background:#f4f8fa;color:#78849c;font-size:11px;font-weight:800;white-space:nowrap; }
    th:first-child { border-radius:8px 0 0 8px; }
    th:last-child { border-radius:0 8px 8px 0; }
    td { border-bottom:1px solid #e9f0f4;padding:15px 12px;color:#283e6b;font-size:12px;vertical-align:middle; }
    tr:last-child td { border-bottom:0; }
    .id { color:#8f99ad;font-size:11px;white-space:nowrap; }
    .title-button { color:#1a2948;background:none;border:none;padding:0;text-align:left;font-weight:800;max-width:310px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:block; }
    .title-button:hover { color:var(--brand-strong);text-decoration:underline; }
    .sub { display:block;color:#929caf;font-size:10px;margin-top:3px; }
    .status { display:inline-block;padding:5px 8px;border-radius:7px;font-size:10px;font-weight:800;white-space:nowrap; }
    .status.complete { background:#eaf1ff;color:#3065c6; }
    .status.review { background:#edf0f9;color:#6179b4; }
    .status.received { background:#edf2fc;color:#3864bb; }
    .grade-badge { display:inline-grid;place-items:center;min-width:24px;height:24px;padding:0 5px;border-radius:6px;background:#eaf1ff;color:#3065c6;font-size:11px;font-weight:900; }
    .grade-badge.B { background:#ebf2f6;color:#4f6da9; }
    .grade-badge.C { background:#eef1fa;color:#6479b8; }
    .grade-badge.D { background:#ecedf6;color:#5a65b1; }
    .grade-badge.none { background:#eff4f8;color:#959eb0; }
    .table-footer { border-top:1px solid var(--line);padding-top:14px;margin-top:2px;display:flex;align-items:center;justify-content:space-between;gap:12px;color:#949db0;font-size:11px; }
    .pagination { display:flex;align-items:center;gap:7px; }
    .pagination button { width:29px;height:29px;border:1px solid #d9e0ed;border-radius:8px;background:#ffffff;color:#3f5787;font-size:17px; }
    .pagination button:disabled { opacity:.4;cursor:not-allowed; }
    .pagination span { min-width:44px;text-align:center;color:#5e697e;font-weight:800; }
    .footnote { display:flex;justify-content:space-between;gap:20px;color:#949db0;font-size:11px;margin-top:25px; }
    dialog { width:min(480px,calc(100% - 28px));border:0;border-radius:18px;padding:0;box-shadow:0 25px 80px rgba(16,33,44,.3); }
    dialog::backdrop { background:rgba(13,26,34,.46); }
    .dialog-body { padding:27px 29px; }
    .dialog-head { display:flex;justify-content:space-between;align-items:flex-start;gap:14px; }
    .dialog-head .eyebrow { font-size:10px; }
    .dialog-head h2 { font-size:21px;letter-spacing:-.05em;margin:7px 0 2px;line-height:1.4; }
    .icon-button { width:30px;height:30px;display:grid;place-items:center;border:1px solid #dee4ef;border-radius:8px;background:#ffffff;color:#405888;font-size:20px;line-height:1; }
    .details { display:grid;grid-template-columns:1fr 1fr;gap:17px 14px;margin:26px 0 0;padding-top:22px;border-top:1px solid var(--line); }
    .details dt { color:#8e98ac;font-size:11px;font-weight:700; }
    .details dd { margin:4px 0 0;font-size:12px;font-weight:800;color:#243962; }
    .empty { padding:26px 10px;color:#8a94a8;text-align:center;font-size:12px; }
    @media (max-width: 1200px) { main { padding:0 25px 48px; } .app {grid-template-columns:209px minmax(0,1fr)} .sidebar{padding-left:12px;padding-right:12px} .grade-layout{gap:10px} .grade-donut{width:142px;height:142px}.grade-donut::before{inset:22px} }
    @media (max-width: 980px) { .overview{grid-template-columns:1fr 260px}.metric-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.analytics{grid-template-columns:1fr}.grade-layout{justify-content:center;gap:45px}.leader-grid{grid-template-columns:1fr 1fr} }
    @media (max-width: 750px) { .app{display:block}.sidebar{position:static;height:auto;min-height:0;padding:13px 17px;display:flex;flex-direction:row;align-items:center;gap:18px}.brand{margin:0;padding:0}.brand small,.nav-label,.sidebar-bottom{display:none}.nav{display:flex;gap:3px;overflow:auto}.nav a{padding:8px 10px;font-size:11px;white-space:nowrap}.nav a svg{width:15px;height:15px}.nav a.active::after{display:none} main{padding:0 18px 36px}.topbar{min-height:59px}.intro{padding:27px 0 21px}.overview{grid-template-columns:1fr}.feature-card{min-height:190px}.completion-card{min-height:145px}.leader-grid{grid-template-columns:1fr}.footnote{display:block}.trend-wrap{height:211px;overflow-x:auto;overflow-y:hidden;scrollbar-width:thin;scrollbar-color:#acbbd8 transparent}#trendChart{min-width:650px;width:650px;height:205px}.scroll-hint{display:block;color:#949db0;font-size:10px;text-align:right;margin-top:-3px} }
    @media (max-width: 480px) { .brand b{font-size:13px}.brand-mark{width:32px;height:32px}.brand-mark svg{width:18px}.nav a{font-size:0;gap:0;padding:8px}.nav a svg{width:18px;height:18px}.topright .sep,.topright .avatar{display:none}.topbar{min-height:50px}.intro{display:block}.intro .tag{margin-top:14px}.intro p{max-width:100%}.filters{gap:7px}.filter-field{flex:1 1 calc(50% - 8px)}.filter-field select{width:100%}.filter-search{flex-basis:100%}.filter-actions{width:100%;justify-content:flex-end}.metric-grid{gap:9px}.metric{min-height:115px;padding:16px}.metric-value{font-size:25px}.metric-foot{font-size:10px}.panel{padding:20px 18px}.panel-head{display:block}.chart-legend{margin-top:9px}.grade-layout{gap:14px}.grade-donut{width:140px;height:140px}.feature-card h2{font-size:24px}.feature-card{padding:21px}.completion-card{padding:20px}.footnote{font-size:10px} }

    .scope { display:flex;align-items:center;gap:10px;min-width:260px; }
    .scope-icon { width:36px;height:36px;border-radius:10px;background:#eaf0ff;color:var(--brand-strong);display:grid;place-items:center;font-size:19px;font-weight:900; }
    .scope strong { display:block;font-size:12px;color:#1e2f51; }
    .scope small { display:block;font-size:10px;color:#848fa4;margin-top:2px; }
    .scope-pills { display:flex;gap:7px;flex-wrap:wrap;align-items:center; }
    .scope-pills span { padding:6px 9px;border:1px solid #dbe1ee;border-radius:999px;background:#f5f8fa;color:#647088;font-size:10px;font-weight:800;white-space:nowrap; }
    .filters .export-button { margin-left:auto; }
    .data-note { border-top:1px solid #e7eff4;padding-top:12px;margin-top:17px;color:#7b869d;font-size:10px;line-height:1.55; }
    .segmented { display:flex;gap:3px;padding:3px;background:#eaf0ff;border-radius:9px;white-space:nowrap; }
    .segmented button { border:0;background:transparent;border-radius:7px;padding:6px 9px;color:#737f98;font-size:10px;font-weight:800; }
    .segmented button.selected { background:#ffffff;color:var(--brand-strong);box-shadow:0 1px 3px rgba(62,96,170,.11); }
    .table-tools { display:grid;grid-template-columns:repeat(5,minmax(0,1fr));align-items:end;gap:8px;margin-bottom:10px; }
    .table-tools label { display:grid;gap:5px;color:#62718c;font-size:10px;font-weight:800; }
    .table-tools .filter-field select { width:100%;min-width:0; }
    .table-tools .filter-search { flex:initial;min-width:0;width:100%; }
    .table-tools .search-group { grid-column:span 3; }
    .table-tools .text-button { align-self:end; }
    .table-filter-note { margin:0 0 12px;color:#76849b;font-size:10px;line-height:1.5; }
    @media (max-width: 750px) { .scope-pills { display:none; } .filters .export-button { margin-left:auto; } .table-panel .scroll-hint { margin:0 0 7px; } }
    @media (max-width: 750px) { .explore-controls { grid-template-columns:repeat(2,minmax(0,1fr)); } .explore-result { display:block; } .explore-stats { justify-content:flex-start;margin-top:12px; } .table-tools { grid-template-columns:repeat(3,minmax(0,1fr)); } .table-tools .search-group { grid-column:span 2; } }
    @media (max-width: 480px) { .scope { min-width:0;flex:1 1 100%; } .filters .export-button { margin:0 0 0 auto; } .explore-panel { padding:18px; } .explore-head { display:block; } .explore-head .text-button { margin-top:10px; } .explore-controls { grid-template-columns:1fr; } .explore-stats { display:grid;grid-template-columns:repeat(2,minmax(0,1fr)); } .explore-stat { min-width:0; } .table-tools { grid-template-columns:repeat(2,minmax(0,1fr)); } .table-tools .search-group { grid-column:span 2; } .table-tools .filter-field select { width:100%; } }

    @media (max-width: 980px) { .ai-detail-grid{grid-template-columns:1fr} }
    @media (max-width: 750px) { .ai-grid{grid-template-columns:1fr 1fr}.ai-card:last-child{grid-column:1/-1} }
    @media (max-width: 560px) { .ai-grid{grid-template-columns:1fr}.ai-card:last-child{grid-column:auto}.ai-intro{padding:18px;align-items:flex-start}.ai-mark{width:38px;height:38px;font-size:22px}.ai-intro h2{font-size:17px}.ai-intro p{font-size:11px}.ai-label{display:none}.ai-panel{padding:19px}.ai-card{padding:17px} }
    @media (prefers-reduced-motion: reduce) { html{scroll-behavior:auto} *{transition:none!important;animation:none!important} }
  /* PST-LIVE workspace integration */
.app{display:block;min-height:100vh}
.app .sidebar{display:none}
#proposal-main{max-width:1700px;margin:0 auto;padding:0 38px 56px}
#proposal-main .content{max-width:1500px}
.section-nav{display:flex;gap:5px;overflow-x:auto;scrollbar-width:thin;padding:9px 0;border-bottom:1px solid var(--line)}
.section-nav a{display:inline-flex;align-items:center;gap:8px;white-space:nowrap;padding:9px 12px;border-radius:10px;color:#61728e;font-size:12px;font-weight:800;text-decoration:none}
.section-nav a svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:1.8}
.section-nav a:hover,.section-nav a.active{color:#275ab6;background:#eaf1ff}
#dataState{margin:24px 0;padding:23px 25px;border:1px solid #d3e2f9;border-radius:18px;background:#eef4ff;color:#35588f;font-size:13px;line-height:1.65}
#dataState[data-kind=error]{background:#fff2f2;border-color:#f0d5d5;color:#8e3d3d}
#dataState h2{font-size:17px;margin:0 0 5px}
#dataState p{margin:0}
#dataState button{margin-top:14px;border:1px solid #b9cbed;border-radius:9px;padding:8px 14px;background:white;color:#285ab3;font-weight:800}
#dashboardContent[hidden],#dataState[hidden]{display:none!important}
.ai-rate-list:empty,.ai-actions:empty{min-height:35px}
.small-muted{color:#74839c;font-size:11px}
#proposalRows .title-button{max-width:400px}
@media(max-width:1200px){#proposal-main{padding:0 25px 45px}}
@media(max-width:800px){#proposal-main{padding:0 17px 35px}.topbar{min-height:61px}}
@media(max-width:480px){.section-nav{gap:1px}.section-nav a{padding:8px 10px;font-size:11px}#proposal-main{padding:0 14px 32px}.topright{display:none}.intro{padding-top:24px}}