:root {
  --bg: #0e0c14;
  --bg2: #15111e;
  --panel: rgba(28, 23, 39, .92);
  --panel2: rgba(36, 29, 49, .92);
  --line: rgba(232, 222, 255, .14);
  --line-strong: rgba(232, 222, 255, .28);
  --text: #f5f0ff;
  --muted: #b9aecb;
  --dim: #8c819f;
  --accent: #9c8cff;
  --accent2: #69d7cf;
  --accent3: #e4bd63;
  --danger: #ff808f;
  --success: #79dfb3;
  --warning: #ffd279;
  --shadow: 0 22px 70px rgba(0,0,0,.34);
  --radius: 18px;
  --radius-sm: 12px;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
* { box-sizing: border-box; }
html { background: var(--bg); }
body { margin: 0; min-height: 100vh; color: var(--text); background:
  radial-gradient(circle at 16% 0%, rgba(135, 84, 211, .18), transparent 34%),
  radial-gradient(circle at 100% 12%, rgba(55, 170, 160, .13), transparent 31%),
  linear-gradient(145deg, var(--bg), #100d17 55%, #0b0a10); }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }
button:disabled { cursor: not-allowed; opacity: .42; }
a { color: var(--accent2); }
.app-shell { min-height: 100vh; }
.topbar { position: sticky; top: 0; z-index: 30; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 13px 22px; border-bottom: 1px solid var(--line); background: rgba(12,10,18,.9); backdrop-filter: blur(16px); }
.brand { display: flex; align-items: center; gap: 12px; min-width: 0; }
.brand-mark { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 12px; font-weight: 900; color: #180d26; background: conic-gradient(from 15deg, var(--accent), var(--accent2), var(--accent3), var(--accent)); box-shadow: 0 0 0 1px rgba(255,255,255,.14), 0 8px 22px rgba(124,77,184,.25); }
.brand-copy strong { display: block; font-size: .98rem; letter-spacing: .01em; }
.brand-copy span { color: var(--muted); font-size: .78rem; }
.top-actions { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
.btn { border: 1px solid var(--line-strong); border-radius: 12px; padding: 10px 14px; color: var(--text); background: rgba(255,255,255,.045); transition: .18s ease; box-shadow: none; }
.btn:hover:not(:disabled) { transform: translateY(-1px); border-color: rgba(184,140,255,.55); background: rgba(184,140,255,.10); }
.btn.primary { color: #160d21; border-color: transparent; background: linear-gradient(135deg, var(--accent), #d2b4ff); font-weight: 800; }
.btn.secondary { background: rgba(255,255,255,.055); }
.btn.ghost { border-color: transparent; background: transparent; color: var(--muted); }
.btn.danger { color: #ffecef; border-color: rgba(255,128,143,.36); background: rgba(255,128,143,.08); }
.btn.small { padding: 7px 10px; font-size: .82rem; border-radius: 9px; }
.pill { display: inline-flex; align-items: center; gap: 7px; border: 1px solid var(--line); border-radius: 999px; padding: 6px 10px; color: var(--muted); font-size: .76rem; background: rgba(255,255,255,.035); }
.pill.success { color: var(--success); border-color: rgba(121,223,179,.28); }
.pill.warning { color: var(--warning); border-color: rgba(255,210,121,.28); }
.layout { display: grid; grid-template-columns: 290px minmax(0, 1fr); min-height: calc(100vh - 65px); }
.sidebar { position: sticky; top: 65px; height: calc(100vh - 65px); overflow: auto; padding: 20px 16px 28px; border-right: 1px solid var(--line); background: rgba(12,10,18,.46); }
.sidebar h3 { margin: 8px 10px 12px; color: var(--muted); font-size: .74rem; text-transform: uppercase; letter-spacing: .16em; }
.section-nav { display: grid; gap: 8px; }
.section-link { width: 100%; display: grid; grid-template-columns: 34px 1fr auto; align-items: center; gap: 9px; padding: 11px 10px; border: 1px solid transparent; border-radius: 13px; color: var(--muted); text-align: left; background: transparent; }
.section-link:hover { background: rgba(255,255,255,.035); color: var(--text); }
.section-link.active { color: var(--text); border-color: rgba(184,140,255,.30); background: linear-gradient(135deg, rgba(184,140,255,.13), rgba(98,212,197,.055)); }
.section-code { width: 31px; height: 31px; display: grid; place-items: center; border-radius: 10px; color: #160d21; background: linear-gradient(135deg, #c39cff, #8fe0d5); font-size: .79rem; font-weight: 900; }
.section-link small { color: var(--dim); font-size: .7rem; }
.sidebar-card { margin-top: 18px; padding: 14px; border: 1px solid var(--line); border-radius: 14px; background: rgba(255,255,255,.025); }
.sidebar-card p { color: var(--muted); font-size: .8rem; line-height: 1.45; margin: 6px 0; }
.progress-track { height: 8px; overflow: hidden; border-radius: 999px; background: rgba(255,255,255,.075); }
.progress-fill { height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--accent), var(--accent2)); transition: width .25s ease; }
.main { width: min(1100px, 100%); margin: 0 auto; padding: 34px 30px 70px; }
.welcome { width: min(1120px, 100%); margin: 0 auto; padding: 68px 30px 90px; }
.hero { position: relative; overflow: hidden; padding: 48px; border: 1px solid var(--line); border-radius: 28px; background: linear-gradient(145deg, rgba(40,31,55,.95), rgba(19,16,27,.95)); box-shadow: var(--shadow); }
.hero::after { content:""; position:absolute; width:340px; height:340px; right:-120px; top:-150px; border-radius:50%; background: radial-gradient(circle, rgba(184,140,255,.28), transparent 67%); }
.eyebrow { display: inline-block; color: var(--accent2); font-weight: 800; font-size: .74rem; letter-spacing: .16em; text-transform: uppercase; }
h1, h2, h3 { line-height: 1.12; }
h1 { margin: 12px 0 16px; font-size: clamp(2.5rem, 6vw, 5.4rem); letter-spacing: -.055em; }
h2 { margin: 0 0 12px; font-size: clamp(1.55rem, 3vw, 2.3rem); letter-spacing: -.025em; }
.hero p { max-width: 760px; color: var(--muted); font-size: 1.08rem; line-height: 1.72; }
.hero-actions { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 26px; }
.domain-grid, .summary-grid, .review-grid, .result-grid { display: grid; gap: 14px; }
.domain-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); margin-top: 20px; }
.domain-tile, .summary-card, .review-card, .result-card { border: 1px solid var(--line); border-radius: var(--radius); background: var(--panel); box-shadow: 0 10px 35px rgba(0,0,0,.18); }
.domain-tile { padding: 18px; }
.domain-tile .code { color: var(--accent); font-weight: 900; font-size: 1.55rem; }
.domain-tile h3 { margin: 7px 0; font-size: .98rem; }
.domain-tile p { margin: 0; color: var(--muted); font-size: .8rem; line-height: 1.45; }
.notice { margin-top: 18px; padding: 14px 16px; border-left: 3px solid var(--accent3); border-radius: 9px; color: var(--muted); background: rgba(255,182,110,.065); line-height: 1.55; }
.section-header { margin-bottom: 22px; padding: 24px; border: 1px solid var(--line); border-radius: var(--radius); background: linear-gradient(145deg, rgba(40,31,55,.78), rgba(25,21,34,.86)); }
.section-header h1 { margin: 8px 0 10px; font-size: clamp(2rem, 5vw, 3.4rem); }
.section-header p { max-width: 870px; margin: 0; color: var(--muted); line-height: 1.64; }
.section-meta { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 15px; }
.question-list { display: grid; gap: 16px; }
.question-card { position: relative; padding: 22px; border: 1px solid var(--line); border-radius: var(--radius); background: linear-gradient(145deg, rgba(32,27,43,.95), rgba(22,19,30,.96)); box-shadow: 0 12px 34px rgba(0,0,0,.16); }
.question-card:focus-within { border-color: rgba(184,140,255,.48); box-shadow: 0 0 0 3px rgba(184,140,255,.08), 0 14px 38px rgba(0,0,0,.18); }
.question-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; }
.question-id { color: var(--accent2); font-weight: 800; font-size: .72rem; letter-spacing: .1em; text-transform: uppercase; }
.question-card h3 { margin: 7px 0 5px; font-size: 1.05rem; font-weight: 750; line-height: 1.42; }
.question-meta { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; margin-bottom: 15px; }
.meta-chip { border-radius: 999px; padding: 4px 8px; color: var(--dim); background: rgba(255,255,255,.04); font-size: .68rem; }
.meta-chip.sensitive { color: #e6d8ff; background: rgba(184,140,255,.09); }
.help { color: var(--muted); font-size: .82rem; line-height: 1.5; margin: 7px 0 14px; }
.control { display: grid; gap: 10px; }
.option-grid { display: grid; gap: 8px; }
.option { display: flex; align-items: flex-start; gap: 10px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 11px; background: rgba(255,255,255,.025); color: var(--muted); }
.option:hover { border-color: rgba(184,140,255,.32); color: var(--text); }
.option input { margin-top: 3px; accent-color: var(--accent); }
.option.selected { border-color: rgba(184,140,255,.43); color: var(--text); background: rgba(184,140,255,.075); }
.text-input, textarea, select { width: 100%; border: 1px solid var(--line-strong); border-radius: 11px; padding: 11px 12px; color: var(--text); background: rgba(7,6,11,.55); outline: none; }
textarea { min-height: 118px; resize: vertical; line-height: 1.5; }
.text-input:focus, textarea:focus, select:focus { border-color: var(--accent); box-shadow: 0 0 0 3px rgba(184,140,255,.10); }
.slider-wrap { display: grid; grid-template-columns: minmax(0,1fr) 76px; gap: 12px; align-items: center; }
.slider-wrap input[type="range"] { width: 100%; accent-color: var(--accent); }
.number-box { text-align: center; font-weight: 800; }
.anchor-row { display: flex; justify-content: space-between; gap: 8px; color: var(--dim); font-size: .66rem; }
.matrix { width: 100%; border-collapse: separate; border-spacing: 0 8px; }
.matrix th { color: var(--muted); font-size: .73rem; font-weight: 700; text-align: center; padding: 5px 7px; }
.matrix th:first-child { text-align: left; }
.matrix td { padding: 10px 8px; background: rgba(255,255,255,.025); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); vertical-align: middle; }
.matrix td:first-child { border-left: 1px solid var(--line); border-radius: 10px 0 0 10px; color: var(--text); min-width: 220px; }
.matrix td:last-child { border-right: 1px solid var(--line); border-radius: 0 10px 10px 0; }
.matrix .radio-cell { text-align: center; min-width: 76px; }
.matrix input[type="radio"], .matrix input[type="checkbox"] { accent-color: var(--accent); transform: scale(1.08); }
.matrix-slider-row { display: grid; grid-template-columns: minmax(210px, 1fr) minmax(260px, 2fr) 72px; gap: 14px; align-items: center; padding: 11px 12px; border: 1px solid var(--line); border-radius: 12px; background: rgba(255,255,255,.025); }
.matrix-slider-row .row-label { color: var(--text); font-size: .86rem; line-height: 1.4; }
.repeatable { display: grid; gap: 8px; }
.repeat-row { display: grid; grid-template-columns: 1fr auto; gap: 8px; }
.rank-list { display: grid; gap: 8px; }
.rank-item { display: grid; grid-template-columns: 34px 1fr auto; gap: 10px; align-items: center; padding: 10px 12px; border: 1px solid var(--line); border-radius: 11px; background: rgba(255,255,255,.025); }
.rank-number { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 9px; color: #160d21; background: var(--accent2); font-size: .78rem; font-weight: 900; }
.rank-actions { display: flex; gap: 5px; }
.role-pair { display: grid; gap: 10px; padding: 13px; border: 1px solid var(--line); border-radius: 12px; background: rgba(255,255,255,.025); }
.role-pair-head { display: flex; justify-content: space-between; gap: 12px; color: var(--text); font-size: .86rem; }
.question-actions { display: flex; justify-content: flex-end; margin-top: 12px; }
.skipped { opacity: .62; }
.required-note { color: var(--warning); font-size: .75rem; }
.nav-actions { display: flex; justify-content: space-between; gap: 12px; margin-top: 24px; padding-top: 18px; border-top: 1px solid var(--line); }
.validation-error { margin: 12px 0 0; padding: 11px 13px; border: 1px solid rgba(255,128,143,.35); border-radius: 10px; color: #ffdfe4; background: rgba(255,128,143,.075); }
.review-grid { grid-template-columns: repeat(3, minmax(0,1fr)); }
.review-card { padding: 18px; }
.review-card h3 { margin: 7px 0; }
.review-card p { color: var(--muted); font-size: .82rem; }
.summary-grid { grid-template-columns: repeat(4, minmax(0,1fr)); margin: 18px 0; }
.summary-card { padding: 16px; }
.summary-card .value { font-size: 2rem; font-weight: 900; letter-spacing: -.04em; }
.summary-card .label { color: var(--muted); font-size: .76rem; }
.result-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
.result-card { padding: 20px; }
.result-card.full { grid-column: 1 / -1; }
.result-card h3 { margin: 0 0 10px; font-size: 1.2rem; }
.result-card p, .result-card li { color: var(--muted); line-height: 1.55; }
.result-card ul { padding-left: 20px; }
.bar-list { display: grid; gap: 10px; }
.bar-item { display: grid; grid-template-columns: minmax(120px, 1fr) minmax(150px, 2fr) 48px; gap: 10px; align-items: center; }
.bar-label { color: var(--muted); font-size: .78rem; line-height: 1.25; }
.bar-track { height: 10px; border-radius: 999px; overflow: hidden; background: rgba(255,255,255,.075); }
.bar-fill { height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--accent), var(--accent2)); }
.bar-value { text-align: right; font-weight: 800; font-size: .8rem; }
.triad-svg { width: 100%; height: auto; min-height: 310px; }
.triad-node { fill: rgba(184,140,255,.18); stroke: #c8a8ff; stroke-width: 2; }
.triad-edge { stroke: #79daca; stroke-linecap: round; opacity: .75; }
.triad-label { fill: #f5f0ff; font-size: 14px; font-weight: 700; text-anchor: middle; }
.pattern { margin-top: 10px; padding: 13px; border: 1px solid var(--line); border-radius: 12px; background: rgba(255,255,255,.028); }
.pattern strong { color: var(--accent2); }
.feedback-box { margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--line); }
.feedback-controls { display: flex; flex-wrap: wrap; gap: 7px; margin: 8px 0; }
.feedback-choice.active { color: #160d21; background: var(--accent2); border-color: transparent; }
.empty-state { padding: 28px; border: 1px dashed var(--line-strong); border-radius: var(--radius); color: var(--muted); text-align: center; }
.modal-backdrop { position: fixed; inset: 0; z-index: 100; display: grid; place-items: center; padding: 20px; background: rgba(0,0,0,.66); backdrop-filter: blur(8px); }
.modal { width: min(680px, 100%); max-height: 86vh; overflow: auto; padding: 24px; border: 1px solid var(--line-strong); border-radius: 20px; background: #191421; box-shadow: var(--shadow); }
.modal h2 { margin-top: 0; }
.settings-grid { display: grid; gap: 14px; }
.setting-row { display: flex; justify-content: space-between; gap: 20px; align-items: center; padding: 12px 0; border-bottom: 1px solid var(--line); }
.setting-row p { margin: 5px 0 0; color: var(--muted); font-size: .8rem; }
.toggle { width: 48px; height: 26px; border: 0; border-radius: 999px; padding: 3px; background: rgba(255,255,255,.12); }
.toggle span { display: block; width: 20px; height: 20px; border-radius: 50%; background: #fff; transition: transform .18s ease; }
.toggle.on { background: var(--accent); }
.toggle.on span { transform: translateX(22px); }
.footer { width: min(1100px,100%); margin: 0 auto; padding: 18px 30px 40px; color: var(--dim); font-size: .75rem; text-align: center; }
@media (max-width: 1050px) {
  .domain-grid { grid-template-columns: repeat(3, minmax(0,1fr)); }
  .summary-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 820px) {
  .layout { grid-template-columns: 1fr; }
  .sidebar { position: static; height: auto; border-right: 0; border-bottom: 1px solid var(--line); padding: 12px; }
  .section-nav { display: flex; overflow-x: auto; padding-bottom: 5px; }
  .section-link { min-width: 210px; }
  .sidebar-card { display: none; }
  .main { padding: 24px 16px 60px; }
  .welcome { padding: 34px 16px 70px; }
  .hero { padding: 30px 22px; }
  .domain-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .review-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .result-grid { grid-template-columns: 1fr; }
  .result-card.full { grid-column: auto; }
  .matrix-wrap { overflow-x: auto; }
  .matrix { min-width: 700px; }
  .matrix-slider-row { grid-template-columns: 1fr; }
  .bar-item { grid-template-columns: 1fr; }
  .bar-value { text-align: left; }
}
@media (max-width: 560px) {
  .topbar { padding: 10px 12px; }
  .brand-copy span { display: none; }
  .top-actions .hide-mobile { display:none; }
  .domain-grid, .review-grid, .summary-grid { grid-template-columns: 1fr; }
  h1 { font-size: 2.6rem; }
  .hero { border-radius: 20px; }
  .nav-actions { flex-direction: column-reverse; }
  .nav-actions .btn { width: 100%; }
}
@media print {
  body { background: white; color: black; }
  .topbar, .sidebar, .nav-actions, .feedback-box, .no-print { display:none !important; }
  .layout { display:block; }
  .main { width:100%; padding:0; }
  .result-card, .summary-card { box-shadow:none; background:white; color:black; break-inside:avoid; border-color:#bbb; }
  .result-card p, .result-card li, .summary-card .label { color:#333; }
  .bar-track { border:1px solid #ccc; }
  .bar-fill { background:#666; }
}


.btn.primary.alt { background: linear-gradient(135deg, var(--accent2), #b8fff4); }
.slider-unset { opacity: .68; }
.slider-unset input[type="range"] { filter: grayscale(.7); }
.unset-note { margin-top: 6px; color: var(--warning); font-size: .72rem; }
.slider-shell { display: grid; gap: 6px; }
.domain-grid { grid-template-columns: repeat(5, minmax(0,1fr)); }
.section-link strong { line-height: 1.25; }
.section-link small { display:block; margin-top:3px; }
select option { color: #111; }
@media (max-width: 1100px) { .domain-grid { grid-template-columns: repeat(3,minmax(0,1fr)); } }

/* SCOPE relationship-ecology module */
.pill.scope-pill { color: #7de6bf; border-color: rgba(125,230,191,.34); background: rgba(63,176,139,.08); }
.btn.primary.scope-btn { background: linear-gradient(135deg, #52c99f, #a8f5d8); }
.btn.primary.all-btn { background: linear-gradient(135deg, var(--accent), var(--accent2) 58%, var(--accent3)); }
.module-offers { display:grid; gap:10px; margin-bottom:18px; }
.module-offers .notice { margin-top:0; display:flex; align-items:center; justify-content:space-between; gap:14px; }
.toggle.scope-on { background:#45b88e; }
.roster-toolbar { display:flex; gap:10px; align-items:center; flex-wrap:wrap; margin-bottom:12px; }
.record-list { display:grid; gap:12px; }
.record-card { padding:14px; border:1px solid var(--line); border-radius:14px; background:rgba(60,142,113,.055); }
.record-head { display:flex; justify-content:space-between; align-items:center; gap:12px; margin-bottom:10px; }
.record-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.record-grid label { color:var(--muted); font-size:.75rem; line-height:1.35; }
.record-grid input,.record-grid select { margin-top:5px; }
.edge-list { display:grid; gap:9px; }
.edge-row { display:grid; grid-template-columns:1fr 1fr 1.4fr auto; gap:8px; align-items:center; padding:10px; border:1px solid var(--line); border-radius:12px; background:rgba(60,142,113,.05); }
.matrix-multi { min-width:210px; display:grid; gap:6px; text-align:left; }
.matrix-multi label { display:flex; align-items:flex-start; gap:7px; color:var(--muted); font-size:.72rem; }
.scope-slider-cell { min-width:170px; display:grid; grid-template-columns:minmax(120px,1fr) 66px; gap:7px; align-items:center; }
.scope-slider-cell input[type="range"] { width:100%; accent-color:#52c99f; }
.scope-slider-cell input[type="number"] { width:66px; padding:7px; }
.repeat-matrix { display:grid; gap:8px; margin:14px 0; padding:12px; border:1px solid var(--line); border-radius:13px; background:rgba(60,142,113,.04); }
.metric-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin:14px 0; }
.metric { padding:13px; border:1px solid var(--line); border-radius:13px; background:rgba(255,255,255,.025); }
.metric > strong { display:block; margin:4px 0; font-size:1.75rem; }
.metric small { display:block; color:var(--dim); font-size:.67rem; line-height:1.35; }
.meter { height:7px; margin-top:8px; overflow:hidden; border-radius:999px; background:rgba(255,255,255,.075); }
.meter i { display:block; height:100%; background:linear-gradient(90deg,#52c99f,var(--accent2)); }
.scope-dashboard-grid { display:grid; grid-template-columns:1.15fr .85fr; gap:12px; margin-top:15px; }
.scope-panel { min-width:0; padding:15px; border:1px solid var(--line); border-radius:14px; background:rgba(10,28,23,.34); }
.scope-panel h4 { margin:0 0 10px; }
.heatmap { overflow:auto; }
.heatmap table { width:100%; min-width:720px; border-collapse:separate; border-spacing:5px; }
.heatmap th { padding:5px; color:var(--muted); font-size:.67rem; }
.heatmap td { min-width:70px; padding:9px 5px; border-radius:8px; text-align:center; font-weight:850; }
.heatmap td small { display:block; margin-top:2px; font-size:.58rem; font-weight:500; }
.openness-table { width:100%; border-collapse:collapse; min-width:620px; }
.openness-table th,.openness-table td { padding:8px; border-bottom:1px solid var(--line); font-size:.73rem; text-align:left; }
.openness-table th:not(:first-child),.openness-table td:not(:first-child) { text-align:center; }
.mini-bar { height:7px; overflow:hidden; border-radius:999px; background:rgba(255,255,255,.08); }
.mini-bar i { display:block; height:100%; background:#52c99f; }
.network-svg { width:100%; min-height:320px; border:1px solid var(--line); border-radius:13px; background:rgba(7,27,21,.52); }
.network-svg text { fill:var(--text); font-size:12px; font-weight:800; }
.network-edge { stroke:#6bbda3; stroke-width:3; opacity:.8; }
.network-node { fill:rgba(64,180,140,.34); stroke:#83e8c3; stroke-width:2; }
@media (max-width:900px){ .scope-dashboard-grid { grid-template-columns:1fr; } .metric-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:560px){ .record-grid,.edge-row,.metric-grid { grid-template-columns:1fr; } .module-offers .notice { align-items:flex-start; flex-direction:column; } .scope-slider-cell { grid-template-columns:1fr; } }

.route-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:12px;margin:24px 0}.route-card{display:flex;flex-direction:column;align-items:flex-start;text-align:left;background:var(--surface);color:var(--ink);border:1px solid var(--line);padding:16px;border-radius:14px}.route-card.selected,.route-card:hover{border-color:var(--accent);box-shadow:0 0 0 2px color-mix(in srgb,var(--accent) 28%,transparent)}.route-card span{color:var(--accent2);font-weight:800;margin:4px 0}.route-card small{font-weight:500;color:var(--muted)}
.structured-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:12px}.structured-grid label,.compound-block>label{background:var(--surface-soft);border:1px solid var(--line);border-radius:12px;padding:12px}.compound-block h4{margin:18px 0 8px}.profile-list{display:grid;gap:12px}.profile-row{display:grid;grid-template-columns:minmax(190px,1.2fr) repeat(auto-fit,minmax(180px,1fr));gap:12px;align-items:start;border:1px solid var(--line);background:var(--surface-soft);border-radius:12px;padding:12px}.profile-row textarea{grid-column:1/-1}.ack-list{display:grid;gap:8px}.result-tabs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:18px;position:sticky;top:72px;z-index:5;background:var(--bg);padding:8px 0}.metric-big{font-size:3rem;font-weight:900;color:var(--accent)}
@media(max-width:700px){.profile-row{grid-template-columns:1fr}.result-tabs{position:static}.route-grid{grid-template-columns:1fr}}