:root {
  --canvas: #f4f5f8;
  --surface: #ffffff;
  --surface-subtle: #f8f9fc;
  --ink: #12182a;
  --muted: #65708a;
  --muted-strong: #48536a;
  --line: #e6e8ef;
  --line-strong: #d8dce7;
  --navy: #10172b;
  --navy-soft: #1b2541;
  --indigo: #5048e5;
  --indigo-dark: #4239d2;
  --mint: #22af87;
  --mint-soft: #e6f7f1;
  --amber: #d78327;
  --amber-soft: #fff3e3;
  --rose: #ca4b63;
  --shadow-sm: 0 3px 12px rgb(21 29 50 / 0.04);
  --shadow-md: 0 18px 48px rgb(20 28 51 / 0.08);
  --radius-md: 14px;
  --radius-lg: 20px;
  --font-sans: Inter, "Segoe UI", "PingFang SC", "Microsoft YaHei", system-ui, sans-serif;
}

--- selectors ---
3:body { margin: 0; min-width: 320px; background: var(--canvas); color: var(--ink); font-family: var(--font-sans); font-size: 16px; line-height: 1.5; }
10:.brand strong, .brand small { display: block; line-height: 1; }.brand strong { font-size: 18px; letter-spacing: 0.14em; }.brand small { margin-top: 5px; color: #8f99b8; font-size: 8px; letter-spacing: 0.14em; }
12:.nav-list { display: grid; gap: 4px; margin-top: 56px; }.nav-link { display: flex; align-items: center; gap: 12px; border-radius: 10px; padding: 12px; color: #aeb8d3; font-size: 14px; font-weight: 600; text-decoration: none; transition: background 160ms ease, color 160ms ease; }.nav-link:hover, .nav-link.is-active { color: #fff; background: #222e50; }.nav-link.is-active { box-shadow: inset 3px 0 0 #8f98ff; }
14:.sidebar-footer { display: flex; align-items: center; gap: 9px; margin-top: auto; padding: 15px 11px; border-top: 1px solid #293554; }.sidebar-footer small { display: block; color: #8f99b8; font-size: 11px; }.sidebar-footer strong { display: block; color: #eef0fb; font-size: 12px; font-weight: 600; }.status-dot, .pulse-dot { width: 8px; height: 8px; flex: 0 0 auto; border-radius: 50%; background: #48d7a8; box-shadow: 0 0 0 4px rgb(72 215 168 / 0.12); }
15:.main-content { width: min(1440px, 100%); margin: 0 auto; padding: 44px clamp(20px, 4vw, 64px) 64px; }.topbar, .section-heading, .panel-heading, .report-callout { display: flex; align-items: center; justify-content: space-between; gap: 24px; }.eyebrow, .section-kicker { margin: 0; color: var(--indigo); font-size: 11px; font-weight: 800; letter-spacing: .12em; }.topbar h1 { margin: 4px 0 0; font-size: clamp(27px, 3vw, 38px); line-height: 1.15; letter-spacing: -.04em; }.snapshot-badge { display: flex; align-items: center; gap: 9px; padding: 9px 12px; border: 1px solid var(--line); border-radius: 99px; color: var(--muted-strong); background: var(--surface); box-shadow: var(--shadow-sm); font-size: 12px; font-weight: 700; white-space: nowrap; }
16:.filter-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 30px; padding: 12px; border: 1px solid var(--line); border-radius: var(--radius-md); background: var(--surface); box-shadow: var(--shadow-sm); }.search-field { position: relative; flex: 1 1 240px; min-width: 180px; }.search-field input { width: 100%; border: 1px solid transparent; border-radius: 9px; padding: 10px 12px 10px 35px; color: var(--ink); background: var(--surface-subtle); }.search-field input:focus { border-color: #bbb8f7; background: #fff; outline: none; }.search-icon { position: absolute; z-index: 1; top: 13px; left: 13px; width: 12px; height: 12px; border: 2px solid var(--muted); border-radius: 50%; pointer-events: none; }.search-icon::after { content: ""; position: absolute; right: -5px; bottom: -4px; width: 6px; border-top: 2px solid var(--muted); transform: rotate(45deg); }.select-field { display: flex; align-items: center; gap: 7px; color: var(--muted); font-size: 12px; font-weight: 700; }.select-field select { max-width: 150px; border: 1px solid var(--line); border-radius: 8px; padding: 9px 28px 9px 9px; color: var(--ink); background: white; font-size: 13px; }.button { min-height: 40px; border: 1px solid transparent; border-radius: 9px; padding: 9px 14px; font-size: 13px; font-weight: 750; transition: transform 150ms ease, background 150ms ease, border-color 150ms ease; }.button:hover { transform: translateY(-1px); }.button:disabled { cursor: not-allowed; opacity: .5; transform: none; }.button-primary { color: white; background: var(--indigo); box-shadow: 0 8px 18px rgb(80 72 229 / .2); }.button-primary:hover { background: var(--indigo-dark); }.button-ghost { border-color: var(--line-strong); color: var(--muted-strong); background: white; }.button-ghost:hover { border-color: #b8b6ea; color: var(--indigo); }.app-message { min-height: 0; margin-top: 14px; color: var(--rose); font-size: 13px; font-weight: 600; }.app-message:not(:empty) { padding: 10px 12px; border: 1px solid #f0c8d1; border-radius: 9px; background: #fff4f6; }
17:.section-anchor { scroll-margin-top: 24px; margin-top: 48px; }.section-heading { margin-bottom: 17px; }.section-heading h2 { margin: 3px 0 0; font-size: 23px; line-height: 1.2; letter-spacing: -.025em; }.scope-note { max-width: 475px; margin: 0; color: var(--muted); font-size: 12px; text-align: right; }.metric-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }.metric-card { min-height: 141px; overflow: hidden; padding: 18px; border: 1px solid var(--line); border-radius: var(--radius-md); background: var(--surface); box-shadow: var(--shadow-sm); }.metric-card p { margin: 0; color: var(--muted); font-size: 12px; font-weight: 700; }.metric-card strong { display: block; margin-top: 10px; font-size: 29px; line-height: 1; letter-spacing: -.05em; }.metric-card small { display: block; margin-top: 11px; color: var(--muted-strong); font-size: 11px; }.metric-accent { width: 36px; height: 4px; margin-top: 14px; border-radius: 4px; background: var(--indigo); }.metric-card:nth-child(2) .metric-accent { background: var(--mint); }.metric-card:nth-child(3) .metric-accent { background: var(--amber); }.metric-card:nth-child(4) .metric-accent { background: #8792b6; }.skeleton { position: relative; border: 0; background: linear-gradient(100deg, #edf0f6 30%, #f8f9fc 45%, #edf0f6 60%); background-size: 200% 100%; animation: shimmer 1.5s infinite; }@keyframes shimmer { to { background-position-x: -200%; } }
18:.dashboard-grid { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(310px, .9fr); gap: 16px; margin-top: 16px; }.panel { padding: 21px; border: 1px solid var(--line); border-radius: var(--radius-lg); background: var(--surface); box-shadow: var(--shadow-sm); }.panel-heading h3, .panel-heading h2 { margin: 3px 0 0; font-size: 18px; letter-spacing: -.02em; }.panel-tag { padding: 5px 8px; border-radius: 6px; color: var(--muted); background: var(--surface-subtle); font-size: 10px; font-weight: 800; white-space: nowrap; }.panel-tag-warm { color: #a65e18; background: var(--amber-soft); }.country-chart { display: grid; gap: 15px; margin-top: 26px; }.chart-row { display: grid; grid-template-columns: 76px minmax(0, 1fr) 44px; align-items: center; gap: 11px; }.chart-label { overflow: hidden; color: var(--muted-strong); font-size: 12px; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }.chart-track { height: 9px; overflow: hidden; border-radius: 99px; background: #edf0f6; }.chart-value { height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--indigo), #8a83f4); }.chart-number { color: var(--muted); font-size: 12px; font-variant-numeric: tabular-nums; text-align: right; }.quality-summary { display: grid; gap: 13px; margin-top: 22px; }.quality-line { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }.quality-line span { color: var(--muted); font-size: 12px; }.quality-line strong { font-size: 14px; font-variant-numeric: tabular-nums; }.quality-progress { height: 7px; overflow: hidden; border-radius: 99px; background: #edf0f6; }.quality-progress > i { display: block; height: 100%; border-radius: inherit; background: var(--mint); }.quality-alert { margin-top: 5px; padding: 11px; border-radius: 10px; color: #985624; background: var(--amber-soft); font-size: 11px; line-height: 1.55; }
19:.section-heading-inline { align-items: flex-end; }.opportunity-list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 13px; }.opportunity-card { position: relative; min-height: 224px; overflow: hidden; padding: 17px; border: 1px solid var(--line); border-radius: var(--radius-md); background: var(--surface); box-shadow: var(--shadow-sm); }.opportunity-card::before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 3px; background: linear-gradient(90deg, #6b62ed, #a099ff); }.opportunity-card h3 { display: -webkit-box; overflow: hidden; margin: 14px 0 9px; font-size: 14px; line-height: 1.45; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }.opportunity-card p { margin: 0; color: var(--muted); font-size: 11px; }.score-line { display: flex; align-items: center; justify-content: space-between; }.score-label { color: var(--muted); font-size: 10px; font-weight: 800; letter-spacing: .08em; }.score { color: var(--indigo); font-size: 24px; font-weight: 850; letter-spacing: -.06em; }.reason-list { display: grid; gap: 5px; margin: 13px 0 0; padding: 0; list-style: none; }.reason-list li { position: relative; padding-left: 12px; color: var(--muted-strong); font-size: 10px; line-height: 1.45; }.reason-list li::before { content: ""; position: absolute; top: 6px; left: 0; width: 5px; height: 5px; border-radius: 50%; background: var(--mint); }.card-link { display: inline-flex; margin-top: 13px; padding: 0; border: 0; color: var(--indigo); background: transparent; font-size: 11px; font-weight: 800; }
20:.insight-grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: 16px; }.sentiment-content, .price-context { margin-top: 24px; }.sentiment-summary { display: flex; align-items: flex-end; gap: 16px; }.sentiment-summary strong { font-size: 38px; letter-spacing: -.06em; }.sentiment-summary p { max-width: 265px; margin: 0 0 4px; color: var(--muted); font-size: 12px; }.star-bars { display: grid; gap: 9px; margin-top: 23px; }.star-row { display: grid; grid-template-columns: 28px minmax(0, 1fr) 42px; align-items: center; gap: 9px; color: var(--muted); font-size: 11px; }.star-track { height: 7px; overflow: hidden; border-radius: 99px; background: #eef0f5; }.star-fill { height: 100%; border-radius: inherit; background: linear-gradient(90deg, #f1b452, #f4cb82); }.empty-insight { padding: 17px; border-radius: 11px; color: var(--muted); background: var(--surface-subtle); font-size: 12px; }.price-list { display: grid; gap: 12px; }.price-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding-bottom: 11px; border-bottom: 1px solid var(--line); }.price-row:last-child { padding-bottom: 0; border: 0; }.price-row span { color: var(--muted-strong); font-size: 12px; font-weight: 700; }.price-row strong { font-size: 13px; }.price-row small { display: block; margin-top: 2px; color: var(--muted); font-size: 10px; text-align: right; }
21:.product-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }.product-card { overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius-md); background: var(--surface); box-shadow: var(--shadow-sm); transition: transform 160ms ease, box-shadow 160ms ease; }.product-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-md); }.product-image-wrap { position: relative; display: grid; height: 153px; place-items: center; overflow: hidden; background: linear-gradient(135deg, #e9eaff, #f7f4ef); }.product-image { width: 100%; height: 100%; object-fit: cover; }.product-image.is-missing { display: none; }.image-fallback { position: absolute; color: #7e86b1; font-size: 26px; font-weight: 800; }.product-card-body { padding: 14px; }.product-meta { display: flex; justify-content: space-between; gap: 8px; color: var(--muted); font-size: 10px; font-weight: 800; }.product-card h3 { display: -webkit-box; overflow: hidden; min-height: 41px; margin: 8px 0 11px; font-size: 13px; line-height: 1.55; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }.product-price-row { display: flex; align-items: center; justify-content: space-between; gap: 8px; }.product-price-row strong { font-size: 14px; }.product-score { padding: 4px 6px; border-radius: 5px; color: #3a35b7; background: #efefff; font-size: 10px; font-weight: 800; }.product-detail-button { width: 100%; margin-top: 12px; border: 0; border-top: 1px solid var(--line); padding: 10px 0 0; color: var(--indigo); background: transparent; font-size: 11px; font-weight: 800; text-align: left; }.pagination { display: flex; align-items: center; justify-content: center; gap: 13px; margin-top: 22px; }.pagination span { min-width: 70px; color: var(--muted); font-size: 12px; text-align: center; }
22:.report-callout { margin-top: 52px; padding: 25px 27px; border: 1px solid #dddafb; border-radius: var(--radius-lg); color: #eef0ff; background: linear-gradient(116deg, #1b2141, #31316d); box-shadow: 0 20px 45px rgb(30 35 76 / .16); }.report-callout .section-kicker { color: #b8bdff; }.report-callout h2 { margin: 4px 0 7px; font-size: 22px; }.report-callout p:not(.section-kicker) { max-width: 660px; margin: 0; color: #c9cdec; font-size: 13px; }.report-callout .button-primary { flex: 0 0 auto; color: #22215b; background: #d7d9ff; box-shadow: none; }.report-result { margin-top: 16px; padding: 24px; border: 1px solid #d9e8e2; border-radius: var(--radius-lg); background: #fbfffd; }.report-result-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }.report-result h2 { margin: 3px 0; font-size: 19px; }.report-status { padding: 5px 8px; border-radius: 5px; color: #176d56; background: var(--mint-soft); font-size: 11px; font-weight: 800; white-space: nowrap; }.report-section { padding: 16px 0; border-top: 1px solid #e4eee9; }.report-section h3 { margin: 0 0 7px; font-size: 13px; }.report-section p { margin: 0; color: var(--muted-strong); font-size: 12px; line-height: 1.75; white-space: pre-line; }
23:.product-dialog { width: min(760px, calc(100% - 28px)); max-height: min(800px, calc(100% - 44px)); overflow: auto; border: 0; border-radius: 20px; padding: 0; box-shadow: 0 25px 80px rgb(15 20 42 / .3); }.product-dialog::backdrop { background: rgb(15 19 37 / .52); backdrop-filter: blur(3px); }.dialog-close { position: sticky; z-index: 2; top: 13px; float: right; display: grid; width: 34px; height: 34px; margin: 13px; place-items: center; border: 1px solid var(--line); border-radius: 50%; color: var(--muted-strong); background: white; font-size: 21px; line-height: 1; }.dialog-body { padding: 30px; }.dialog-tag { color: var(--indigo); font-size: 11px; font-weight: 800; }.dialog-body h2 { margin: 6px 0 10px; font-size: 22px; line-height: 1.35; }.dialog-main { display: grid; grid-template-columns: 190px minmax(0, 1fr); gap: 24px; margin-top: 20px; }.dialog-image { width: 100%; height: 190px; border-radius: 12px; object-fit: cover; background: var(--surface-subtle); }.dialog-details { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }.detail-cell { padding: 10px; border-radius: 9px; background: var(--surface-subtle); }.detail-cell span { display: block; color: var(--muted); font-size: 10px; font-weight: 700; }.detail-cell strong { display: block; margin-top: 4px; font-size: 12px; overflow-wrap: anywhere; }.dialog-url { display: inline-block; margin-top: 18px; color: var(--indigo); font-size: 12px; font-weight: 800; overflow-wrap: anywhere; }
24:@media (max-width: 1100px) { .app-shell { grid-template-columns: 82px minmax(0, 1fr); }.sidebar { padding: 24px 12px; }.brand { justify-content: center; padding: 0; }.brand > span:last-child, .nav-link { font-size: 0; }.nav-list { margin-top: 52px; }.nav-link { justify-content: center; padding: 13px; }.nav-icon { width: 19px; height: 19px; }.sidebar-footer > div { display: none; }.sidebar-footer { justify-content: center; }.metric-grid, .opportunity-list, .product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
25:@media (max-width: 760px) { .app-shell { display: block; }.sidebar { position: sticky; z-index: 3; top: 0; height: auto; flex-direction: row; align-items: center; padding: 12px 16px; }.brand { margin-right: auto; }.brand > span:last-child { display: block; }.brand strong { font-size: 14px; }.brand small { display: none; }.nav-list { display: flex; gap: 1px; margin: 0; }.nav-link { width: 37px; overflow: hidden; padding: 9px; white-space: nowrap; }.nav-link:nth-child(n+4) { display: none; }.sidebar-footer { display: none; }.main-content { padding: 29px 16px 42px; }.topbar, .section-heading, .report-callout { align-items: flex-start; flex-direction: column; gap: 12px; }.topbar h1 { font-size: 29px; }.snapshot-badge { white-space: normal; }.filter-bar { align-items: stretch; }.select-field { flex: 1 1 calc(50% - 5px); justify-content: space-between; }.select-field select { width: 100%; }.button-ghost { flex: 1 1 100%; }.scope-note { text-align: left; }.metric-grid, .dashboard-grid, .insight-grid, .opportunity-list, .product-grid { grid-template-columns: 1fr; }.metric-card { min-height: 120px; }.section-anchor { margin-top: 38px; }.report-callout { padding: 23px; }.report-callout .button-primary { width: 100%; }.dialog-body { padding: 23px; }.dialog-main { grid-template-columns: 1fr; }.dialog-image { width: 160px; height: 160px; }.dialog-details { grid-template-columns: 1fr; } }
28:.manufacturing-panel { padding: 20px; border: 1px solid #d9d8f3; border-radius: var(--radius-lg); background: linear-gradient(135deg, #fbfbff, #fff); box-shadow: var(--shadow-sm); }.manufacturing-context { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; padding: 10px 12px; border: 1px solid #e4e4f6; border-radius: 10px; color: var(--muted-strong); background: #f7f7ff; font-size: 12px; font-weight: 700; }.context-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--indigo); }.context-tag { margin-left: auto; padding: 3px 7px; border-radius: 5px; color: #3e38ae; background: #ededff; font-size: 10px; font-weight: 800; }.manufacturing-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin-top: 17px; }.constraint-field { display: grid; gap: 7px; color: var(--muted-strong); font-size: 12px; font-weight: 800; }.constraint-field input, .constraint-field textarea, .custom-constraint-row input { width: 100%; border: 1px solid var(--line-strong); border-radius: 9px; padding: 10px 11px; color: var(--ink); background: #fff; font: inherit; font-size: 13px; }.constraint-field textarea { min-height: 82px; resize: vertical; }.constraint-field input:focus, .constraint-field textarea:focus, .custom-constraint-row input:focus { border-color: #aaa6f0; outline: none; box-shadow: 0 0 0 3px rgb(80 72 229 / .1); }.constraint-field-wide { grid-column: 1 / -1; }.custom-constraints-header { display: flex; align-items: end; justify-content: space-between; gap: 16px; margin-top: 20px; padding-top: 18px; border-top: 1px solid var(--line); }.custom-constraints-header strong { display: block; font-size: 13px; }.custom-constraints-header span { display: block; margin-top: 3px; color: var(--muted); font-size: 11px; }.custom-constraints { display: grid; gap: 9px; margin-top: 12px; }.custom-constraint-row { display: grid; grid-template-columns: minmax(150px, .7fr) minmax(0, 1.5fr) 40px; gap: 9px; align-items: center; }.custom-constraint-row .button { min-width: 40px; padding: 9px; color: var(--rose); }.manufacturing-actions { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-top: 18px; }.manufacturing-actions p { margin: 0; color: var(--muted); font-size: 11px; }.manufacturing-actions p.is-saved { color: #17795e; font-weight: 700; }
31:.workflow-console { margin-top: 28px; padding: 20px; border: 1px solid #dfe2f1; border-radius: var(--radius-lg); background: linear-gradient(135deg, #f8f8ff, #fff); box-shadow: var(--shadow-sm); }.workflow-console .section-heading { margin-bottom: 13px; }.workflow-status-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }.workflow-card { min-height: 112px; padding: 15px; border: 1px solid var(--line); border-radius: 12px; background: rgb(255 255 255 / .82); }.workflow-card p { margin: 0; color: var(--muted); font-size: 11px; font-weight: 800; letter-spacing: .04em; }.workflow-card strong { display: block; margin-top: 10px; color: var(--ink); font-size: 17px; line-height: 1.2; }.workflow-card small { display: block; margin-top: 8px; color: var(--muted-strong); font-size: 11px; line-height: 1.45; }.workflow-card-indigo { border-color: #cbc9f4; background: #f7f7ff; }.workflow-card-indigo strong { color: var(--indigo-dark); }.workflow-card-warm { border-color: #f0d5ae; background: #fffaf2; }.workflow-card-warm strong { color: #a85b12; }.workflow-card-mint { border-color: #bce7d8; background: #f3fcf8; }.workflow-card-mint strong { color: #17795e; }
37:.gate-panel .panel-heading { margin-bottom: 16px; }
41:.gate-card-head strong { font-size: 13px; line-height: 1.35; }
42:.gate-step { padding: 3px 5px; border-radius: 4px; color: #4338a7; background: #ecebff; font-size: 9px; font-weight: 900; white-space: nowrap; }
43:.gate-card p { margin: 12px 0 7px; color: var(--indigo); font-size: 11px; font-weight: 800; }
44:.gate-card ul { display: grid; gap: 5px; margin: 0; padding-left: 16px; color: var(--muted-strong); font-size: 11px; line-height: 1.35; }
45:.gate-card small { display: block; margin-top: 12px; color: var(--muted); font-size: 10px; line-height: 1.45; }
49:.priority-card strong { font-size: 13px; }
50:.priority-label { display: inline-grid; width: 27px; height: 27px; place-items: center; border-radius: 7px; color: #fff; background: #d07a19; font-size: 11px; font-weight: 900; }
53:.priority-state { float: right; margin-top: -24px; color: #a85b12; font-size: 10px; font-weight: 900; }.priority-card p { margin: 10px 0 0; color: var(--muted-strong); font-size: 11px; }
54:.gate-footnote { margin-top: 14px; padding-top: 13px; border-top: 1px solid var(--line); color: var(--muted); font-size: 11px; line-height: 1.55; }
59:.public-stage-card > span { color: var(--amber); font-size: 12px; font-weight: 900; letter-spacing: .12em; }.public-stage-card h3 { margin: 16px 0 8px; }.public-stage-card p { min-height: 55px; margin: 0; color: var(--muted-strong); font-size: 12px; line-height: 1.65; }.public-stage-card strong { display: inline-block; margin-top: 17px; color: var(--amber); font-size: 11px; }
60:.validation-card { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 25px; border: 1px solid #ded9bb; border-radius: var(--radius-lg); background: linear-gradient(120deg, #fffaf0, #fff); }.validation-kicker { display: block; color: var(--amber); font-size: 10px; font-weight: 900; letter-spacing: .12em; }.validation-card strong { display: block; margin-top: 8px; font-size: 23px; }.validation-card p { margin: 8px 0 0; color: var(--muted-strong); font-size: 12px; }.validation-lock { padding: 8px 11px; border-radius: 8px; color: #9a651e; background: #fff2d9; font-size: 11px; font-weight: 900; white-space: nowrap; }
62:.design-request-panel { padding: 21px; border: 1px solid rgb(212 175 55 / .28); border-radius: var(--radius-lg); background: linear-gradient(135deg, #fffdf7, #fff); box-shadow: var(--shadow-sm); }.design-request-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }.design-request-grid select { width: 100%; border: 1px solid var(--line-strong); border-radius: 9px; padding: 10px 11px; color: var(--ink); background: #fff; font: inherit; font-size: 13px; }.design-request-actions { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-top: 18px; }.design-request-actions p { margin: 0; color: var(--muted); font-size: 11px; }.design-request-actions .button { flex: 0 0 auto; }.design-gallery { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }.design-result-card { overflow: hidden; border: 1px solid #ded9bb; border-radius: var(--radius-lg); background: #fff; box-shadow: var(--shadow-sm); }.design-placeholder { display: grid; height: 210px; place-items: center; color: #c4a74c; background: linear-gradient(135deg, #f6f0dd, #fffdf7); font-size: 38px; }.design-result-card h3 { margin: 17px 18px 7px; font-size: 15px; }.design-result-card p { margin: 0 18px; color: var(--muted-strong); font-size: 12px; }.design-result-card span { display: inline-block; margin: 14px 18px 18px; padding: 5px 8px; border-radius: 6px; color: #99751d; background: #fff4d8; font-size: 10px; font-weight: 900; }
67:.topbar h1 { color: #fffaf0; letter-spacing: -.045em; }.eyebrow, .section-kicker { color: #d4af37; }.snapshot-badge { border-color: rgb(212 175 55 / .24); color: #d8d1bd; background: rgb(17 24 39 / .8); }
68:.filter-bar, .metric-card, .panel, .public-stage-card, .validation-card, .design-request-panel, .design-result-card, .report-result { border-color: rgb(255 255 255 / .1); background: linear-gradient(145deg, rgb(19 27 43 / .94), rgb(11 16 27 / .94)); box-shadow: 0 18px 50px rgb(0 0 0 / .24); }
69:.metric-card p, .scope-note, .chart-label, .quality-line span, .design-result-card p, .public-stage-card p, .validation-card p, .design-request-actions p { color: #9da7bb; }.metric-card strong, .panel-heading h3, .panel-heading h2, .section-heading h2, .public-stage-card h3, .design-result-card h3 { color: #f7f2e6; }.metric-accent { background: #d4af37 !important; }.chart-track, .quality-progress { background: #222b3d; }.chart-value { background: linear-gradient(90deg, #b58c29, #f1d57a); }.panel-tag { color: #c7c0ad; background: rgb(255 255 255 / .07); }.quality-alert { color: #f2d285; background: rgb(212 175 55 / .12); }.search-field input, .select-field select, .design-request-grid select, .constraint-field input, .constraint-field textarea { border-color: rgb(255 255 255 / .12); color: #f5f1e7; background: #101827; }.search-field input:focus, .constraint-field input:focus, .constraint-field textarea:focus { background: #141e30; }.button-primary { color: #15120a; background: linear-gradient(135deg, #d4af37, #f0d67a); box-shadow: 0 12px 26px rgb(212 175 55 / .2); }.button-primary:hover { background: linear-gradient(135deg, #ebca61, #fff0a8); }.button-ghost { border-color: rgb(255 255 255 / .15); color: #d9d2bf; background: rgb(255 255 255 / .05); }.button-ghost:hover { border-color: rgb(212 175 55 / .6); color: #f1d77c; background: rgb(212 175 55 / .1); }.public-stage-card > span, .public-stage-card strong, .validation-kicker { color: #d4af37; }.design-placeholder { color: #d4af37; background: radial-gradient(circle at 50% 30%, rgb(212 175 55 / .16), transparent 45%), #101827; }.design-result-card span, .validation-lock { color: #e2c45f; background: rgb(212 175 55 / .13); }.report-callout { border-color: rgb(212 175 55 / .25); background: linear-gradient(120deg, #151b2a, #282015); }
72:.overview-lower-grid, .opportunity-summary-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin-top: 16px; }.decision-status { display: grid; gap: 6px; padding: 14px; border-radius: 12px; }.decision-status strong { font-size: 15px; }.decision-status span { color: var(--muted); font-size: 12px; line-height: 1.55; }.decision-positive { border: 1px solid rgb(59 198 162 / .3); background: rgb(59 198 162 / .1); }.decision-positive strong { color: #52d8b0; }.decision-caution { border: 1px solid rgb(212 175 55 / .35); background: rgb(212 175 55 / .1); }.decision-caution strong { color: #e6c75e; }.decision-negative { border: 1px solid rgb(202 75 99 / .35); background: rgb(202 75 99 / .1); }.decision-negative strong { color: #ef8799; }.decision-actions { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 12px; color: var(--muted); font-size: 11px; }.decision-actions .button { min-height: 34px; padding: 7px 10px; }
73:.transparency-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }.transparency-list div { padding: 10px; border: 1px solid rgb(255 255 255 / .08); border-radius: 9px; background: rgb(255 255 255 / .035); }.transparency-list span { display: block; color: var(--muted); font-size: 10px; }.transparency-list strong { display: block; margin-top: 4px; color: var(--ink); font-size: 12px; line-height: 1.4; }
74:.method-grid { display: grid; gap: 8px; }.method-grid div { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 9px 10px; border-radius: 8px; background: rgb(255 255 255 / .05); }.method-grid strong { color: var(--ink); font-size: 12px; }.method-grid span { color: var(--muted); font-size: 10px; text-align: right; }.method-note { margin: 12px 0 0; color: var(--muted); font-size: 11px; line-height: 1.55; }
75:.sentiment-hero-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }.sentiment-hero-card { padding: 19px; border: 1px solid rgb(255 255 255 / .1); border-radius: var(--radius-lg); background: linear-gradient(145deg, rgb(19 27 43 / .95), rgb(11 16 27 / .95)); box-shadow: 0 18px 50px rgb(0 0 0 / .2); }.sentiment-hero-card span { display: block; color: #d4af37; font-size: 10px; font-weight: 900; letter-spacing: .12em; }.sentiment-hero-card strong { display: block; margin-top: 12px; color: #fff8e7; font-size: 30px; letter-spacing: -.04em; }.sentiment-hero-card small { display: block; margin-top: 8px; color: var(--muted); font-size: 11px; line-height: 1.45; }.sentiment-hero-primary { border-color: rgb(212 175 55 / .35); background: radial-gradient(circle at 80% 20%, rgb(212 175 55 / .17), transparent 45%), linear-gradient(145deg, #201b12, #111827); }
76:.comment-insight-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin-top: 16px; }.comment-insight-grid-wide { grid-template-columns: minmax(0, 1.25fr) minmax(0, .75fr); }.signal-list { display: grid; gap: 10px; }.signal-card { padding: 12px; border: 1px solid rgb(255 255 255 / .08); border-radius: 10px; background: rgb(255 255 255 / .035); }.signal-card-head { display: flex; justify-content: space-between; gap: 12px; }.signal-card-head strong { color: #f4df9a; font-size: 14px; }.signal-card-head span, .signal-card > small { color: var(--muted); font-size: 10px; }.signal-card blockquote { margin: 10px 0 0; padding: 9px 10px; border-left: 2px solid #d4af37; color: #d6d1c3; background: rgb(0 0 0 / .16); font-size: 11px; line-height: 1.5; }.signal-card cite { display: block; margin-top: 5px; color: #8e99ad; font-size: 9px; font-style: normal; }.matrix-table-wrap { overflow: auto; }.matrix-table { width: 100%; border-collapse: collapse; min-width: 500px; }.matrix-table th, .matrix-table td { padding: 9px 8px; border-bottom: 1px solid rgb(255 255 255 / .08); color: var(--muted); font-size: 11px; text-align: left; }.matrix-table th { color: #d4af37; font-size: 10px; letter-spacing: .04em; }.matrix-table td:nth-child(4), .matrix-table td:nth-child(5) { color: #f0d77c; font-weight: 800; }.trend-bars { display: flex; align-items: end; gap: 7px; height: 190px; padding-top: 15px; }.trend-bar-item { display: grid; flex: 1; height: 100%; min-width: 24px; grid-template-rows: 1fr auto auto; gap: 4px; align-items: end; text-align: center; }.trend-bar-track { display: flex; height: 100%; align-items: end; justify-content: center; }.trend-bar-track i { display: block; width: min(20px, 80%); border-radius: 5px 5px 2px 2px; background: linear-gradient(180deg, #efd475, #8e6d1f); }.trend-bar-item strong { color: #d8cb9d; font-size: 9px; }.trend-bar-item span, .trend-bar-item small { color: var(--muted); font-size: 9px; }.evidence-control-panel { margin-top: 16px; }.transparency-list-wide { grid-template-columns: repeat(5, minmax(0, 1fr)); }
77:.pagination { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 7px; margin-top: 22px; }.page-links { display: flex; align-items: center; gap: 5px; }.page-number { min-width: 32px; height: 32px; border: 1px solid rgb(255 255 255 / .12); border-radius: 7px; color: #c4bdac; background: rgb(255 255 255 / .04); cursor: pointer; font-size: 11px; }.page-number:hover, .page-number.is-current { border-color: rgb(212 175 55 / .6); color: #171208; background: #d4af37; }.page-ellipsis { padding: 0 2px; color: var(--muted); }.page-jump { display: flex; align-items: center; gap: 6px; margin-left: 8px; color: var(--muted); font-size: 11px; }.page-jump input { width: 66px; height: 32px; border: 1px solid rgb(255 255 255 / .12); border-radius: 7px; color: var(--ink); background: #101827; padding: 5px 8px; font-size: 11px; }.page-jump .button { min-height: 32px; padding: 5px 9px; }
78:@media (max-width: 900px) { .transparency-list-wide { grid-template-columns: repeat(2, minmax(0, 1fr)); }.comment-insight-grid-wide { grid-template-columns: 1fr; } }.@media (max-width: 760px) { .overview-lower-grid, .opportunity-summary-grid, .comment-insight-grid, .sentiment-hero-grid { grid-template-columns: 1fr; }.transparency-list, .transparency-list-wide { grid-template-columns: 1fr; }.decision-actions { align-items: stretch; flex-direction: column; }.decision-actions .button { width: 100%; }.pagination { justify-content: flex-start; }.page-jump { width: 100%; margin-left: 0; } }