:root[data-project="downstream"] { --accent: #116149; --accent-strong: #0a4433; --accent-soft: #e5f3ed; --focus: #116149; }
:root[data-project="downstream"][data-theme="dark"] { --accent: #78cfad; --accent-strong: #a9e3ca; --accent-soft: #153129; --focus: #78cfad; }
.partner-shell { display: grid; grid-template-columns: 270px minmax(380px, 1fr) 360px; gap: 14px; }
.progress-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 9px; }
.progress-list li { display: grid; grid-template-columns: 24px 1fr; gap: 10px; align-items: start; color: var(--text-muted); font-size: .86rem; }
.progress-list .mark { display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; background: var(--surface-2); border: 1px solid var(--border); font-size: .62rem; }
.progress-list li.done .mark { background: var(--accent); color: var(--accent-text); border-color: var(--accent); }
.question-card { padding: 26px; border-radius: 20px; border: 1px solid color-mix(in srgb, var(--accent) 35%, var(--border)); background: linear-gradient(145deg, var(--surface), color-mix(in srgb, var(--accent-soft) 42%, var(--surface))); box-shadow: var(--shadow); }
.question-card h3 { font-size: 1.35rem; margin-top: 8px; }.question-meta { display: flex; gap: 8px; align-items: center; color: var(--text-muted); font-size: .78rem; }
.gloss { padding: 10px 12px; margin: 14px 0; background: var(--accent-soft); border-radius: 9px; color: var(--accent-strong); font-size: .86rem; }
.plan-stack { display: grid; gap: 9px; max-height: 630px; overflow-y: auto; }.plan-section { border: 1px solid var(--border); border-radius: 12px; padding: 14px; background: var(--bg); }
.plan-section h4 { margin: 0; font-size: .9rem; }.plan-section p { margin: 7px 0 0; font-size: .82rem; color: var(--text-muted); }
.section-status { display: inline-block; margin-top: 8px; padding: 3px 7px; border-radius: 999px; font-size: .67rem; font-weight: 740; background: var(--surface-2); }.section-status.ready_for_review { color: var(--ok); background: var(--ok-soft); }.section-status.blocked_for_qualified_review { color: var(--danger); background: var(--danger-soft); }
.meter { display: grid; gap: 8px; margin-top: 15px; }.meter-track { height: 8px; border-radius: 99px; background: var(--surface-2); overflow: hidden; }.meter-fill { height: 100%; background: var(--accent); border-radius: inherit; }
.map-frame { position: relative; min-height: 350px; overflow: hidden; border: 1px solid var(--border); border-radius: 20px; background: linear-gradient(150deg, #eff5ee, #dce9e4); box-shadow: var(--shadow-soft); }:root[data-theme="dark"] .map-frame { background: linear-gradient(150deg, #15221d, #182b25); }.map-frame svg { display: block; width: 100%; height: 350px; }
.map-label { position: absolute; padding: 7px 10px; background: color-mix(in srgb, var(--surface) 92%, transparent); border: 1px solid var(--border); border-radius: 8px; font-size: .76rem; box-shadow: var(--shadow-soft); }.map-label.dam { left: 27%; top: 29%; }.map-label.road { right: 12%; bottom: 22%; }
.safe-stop { display: grid; grid-template-columns: auto 1fr; gap: 14px; padding: 18px; margin-top: 14px; border: 1px solid var(--danger); border-radius: 14px; background: var(--danger-soft); }.safe-stop b { display: grid; place-items: center; width: 32px; height: 32px; border: 1px solid var(--danger); border-radius: 50%; }.safe-stop p { margin: 0; font-size: .86rem; }
.source-table td:first-child { font-weight: 650; }.live-badge { display: inline-flex; gap: 7px; align-items: center; padding: 5px 9px; border: 1px solid var(--border); border-radius: 999px; font-size: .72rem; color: var(--text-muted); }.live-badge::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--ok); }
.demo-banner { padding: 11px 14px; border: 1px solid var(--warn); background: var(--warn-soft); border-radius: 10px; color: var(--warn); font-size: .82rem; }.profile-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }.profile-item { padding: 13px; border: 1px solid var(--border); border-radius: 10px; background: var(--bg); }.profile-item small { display: block; color: var(--text-muted); }
@media (max-width: 1100px) { .partner-shell { grid-template-columns: 240px 1fr; } .partner-shell > :last-child { grid-column: 1 / -1; } } @media (max-width: 740px) { .partner-shell { grid-template-columns: 1fr; } .partner-shell > :last-child { grid-column: auto; } .profile-grid { grid-template-columns: 1fr; } }
@media (max-width: 740px) { #mapping .grid-3 { grid-template-columns: 1fr !important; } }