/* 1. Variables */
:root {
  --color-bg: #f5f7fa; --color-surface: #fff; --color-text: #111827; --color-muted: #6b7280;
  --color-border: #e5e7eb; --color-primary: #0f766e; --color-primary-dark: #0b5f59; --color-primary-soft: #ecfdf5;
  --color-pv: #16a34a; --color-bess: #7c3aed; --color-grid: #2563eb; --color-diesel: #d97706;
  --color-wind: #0891b2; --color-danger: #dc2626; --sidebar-width: 248px; --topbar-height: 70px;
  --shadow-sm: 0 1px 2px rgba(15,23,42,.04); --shadow-md: 0 8px 24px rgba(15,23,42,.06);
}

/* 2. Reset / base */
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--color-bg); color: var(--color-text); font-family: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif; font-size: 14px; }
a { color: inherit; }
h1,h2,h3,p { margin-top: 0; }
h1 { font-size: clamp(1.65rem,2.2vw,2.15rem); font-weight: 700; letter-spacing: -.035em; }
h2 { font-size: 1.05rem; font-weight: 700; }
h3 { font-size: .95rem; font-weight: 700; }
.text-muted,.text-secondary { color: var(--color-muted)!important; }

/* 3. App layout */
.app-shell { display: flex; min-height: 100vh; }
.app-workspace { min-width: 0; width: calc(100% - var(--sidebar-width)); margin-left: var(--sidebar-width); }
.page-shell { width: 100%; max-width: 1680px; margin: 0 auto; padding: 28px 32px 48px; }
.page-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 24px; }
.page-heading h1 { margin: 4px 0 5px; }
.page-heading p,.section-header p,.panel-title p,.chart-heading p { color: var(--color-muted); margin: 0; }
.heading-actions { display: flex; flex-wrap: wrap; gap: 9px; align-items: center; }
.heading-actions form { display: flex; }
.eyebrow { display: block; color: var(--color-primary); font-size: .72rem; font-weight: 750; letter-spacing: .09em; text-transform: uppercase; }
.app-alert { border: 0; box-shadow: var(--shadow-sm); }

/* 4. Sidebar */
.app-sidebar { position: fixed; inset: 0 auto 0 0; z-index: 1040; width: var(--sidebar-width); display: flex; flex-direction: column; padding: 20px 14px; background: #fff; border-right: 1px solid var(--color-border); transition: transform .22s ease; }
.brand { display: flex; gap: 11px; align-items: center; padding: 2px 7px 24px; text-decoration: none; }
.brand-mark { width: 38px; height: 38px; display: grid; place-items: center; flex: 0 0 38px; color: #fff; border-radius: 10px; background: var(--color-primary); box-shadow: 0 6px 14px rgba(15,118,110,.2); }
.brand strong,.brand small { display: block; }
.brand strong { font-size: .92rem; letter-spacing: -.02em; }
.brand small { margin-top: 2px; color: var(--color-muted); font-size: .67rem; }
.sidebar-nav { display: flex; flex-direction: column; gap: 3px; }
.nav-section { padding: 17px 11px 6px; color: #9ca3af; font-size: .65rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.sidebar-nav a,.nav-disabled,.sidebar-footer .nav-disabled { min-height: 40px; padding: 9px 11px; display: flex; align-items: center; gap: 11px; border-radius: 8px; color: #4b5563; text-decoration: none; font-weight: 550; }
.sidebar-nav a i,.nav-disabled i { width: 18px; font-size: 1rem; text-align: center; }
.sidebar-nav a:hover { color: var(--color-primary); background: #f3f8f7; }
.sidebar-nav a.active { color: var(--color-primary); background: #eaf5f3; font-weight: 700; }
.nav-tree { margin: 1px 0; }
.nav-tree summary { min-height: 40px; padding: 9px 11px; display: flex; align-items: center; gap: 11px; color: #4b5563; border-radius: 8px; cursor: pointer; font-weight: 550; list-style: none; }
.nav-tree summary::-webkit-details-marker { display: none; }
.nav-tree summary:hover,.nav-tree summary.active { color: var(--color-primary); background: #f3f8f7; }
.nav-tree summary>i:first-child { width: 18px; text-align: center; }
.nav-tree .tree-chevron { width: auto; margin-left: auto; font-size: .7rem; transition: transform .18s ease; }
.nav-tree[open] .tree-chevron { transform: rotate(180deg); }
.nav-tree-items { position: relative; display: flex; flex-direction: column; gap: 2px; margin: 3px 0 7px 20px; padding-left: 12px; border-left: 1px solid #dfe5ea; }
.sidebar-nav .nav-tree-items a { min-height: 32px; padding: 6px 8px; gap: 8px; font-size: .76rem; font-weight: 500; }
.sidebar-nav .nav-tree-items a small { margin-left: auto; min-width: 20px; padding: 1px 5px; color: var(--color-muted); background: #f1f3f5; border-radius: 999px; text-align: center; }
.sidebar-nav .nav-tree-items a.active { font-weight: 700; }
.tech-dot { width: 7px; height: 7px; flex: 0 0 7px; border-radius: 50%; background: var(--color-muted); }
.tech-dot.pv { background: var(--color-pv); }.tech-dot.wind { background: var(--color-wind); }.tech-dot.bess { background: var(--color-bess); }.tech-dot.grid { background: var(--color-grid); }.tech-dot.diesel { background: var(--color-diesel); }
.sidebar-nav .nav-tree-items .all-assets { margin-top: 3px; padding-top: 7px; border-top: 1px solid #edf0f2; border-radius: 0 0 7px 7px; }.nav-tree-items .all-assets i { width: 7px; font-size: .7rem; }
.nav-disabled { color: #adb3bd; cursor: default; }
.nav-disabled small { margin-left: auto; font-size: .6rem; }
.sidebar-footer { margin-top: auto; padding-top: 12px; border-top: 1px solid var(--color-border); }
.version-pill { margin: 12px 11px 2px; color: var(--color-muted); font-size: .72rem; }
.version-pill span { display: inline-block; width: 7px; height: 7px; margin-right: 6px; background: var(--color-pv); border-radius: 50%; }

/* 5. Topbar */
.app-topbar { position: sticky; top: 0; z-index: 1020; height: var(--topbar-height); padding: 0 32px; display: flex; align-items: center; gap: 14px; background: rgba(255,255,255,.94); border-bottom: 1px solid var(--color-border); backdrop-filter: blur(12px); }
.sidebar-toggle { display: none; width: 36px; height: 36px; padding: 0; border: 1px solid var(--color-border); border-radius: 8px; background: #fff; }
.topbar-context { min-width: 0; }
.breadcrumbs { display: flex; align-items: center; gap: 7px; white-space: nowrap; overflow: hidden; font-weight: 650; }
.breadcrumbs a { color: var(--color-muted); text-decoration: none; }
.breadcrumbs i { color: #c5c9d0; font-size: .65rem; }
.breadcrumbs span { overflow: hidden; text-overflow: ellipsis; }
.topbar-context small { color: var(--color-muted); }
.topbar-actions { margin-left: auto; display: flex; gap: 8px; }
.topbar-actions form { display: flex; }

/* 6. Cards */
.panel,.modal-content { background: var(--color-surface); border: 1px solid var(--color-border); border-radius: 12px; box-shadow: var(--shadow-sm); }
.panel { padding: 20px; }
.section-header { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-bottom: 17px; }
.section-header h2,.section-header h3 { margin-bottom: 3px; }
.section-header.compact { margin-bottom: 12px; }
.project-description { display: flex; gap: 12px; margin: -8px 0 22px; padding: 14px 16px; color: #4b5563; background: #fff; border: 1px solid var(--color-border); border-radius: 10px; }
.project-description i { color: var(--color-primary); }
.project-description p { margin: 0; }
.content-grid-main { display: grid; grid-template-columns: minmax(0,2fr) minmax(280px,.7fr); gap: 20px; }
.single-section { max-width: 980px; }
.single-section>.panel { min-height: 420px; }
.focused-panel { max-width: 980px; min-height: 420px; }
.overview-grid { display: grid; grid-template-columns: minmax(0,1.6fr) minmax(280px,.7fr); gap: 18px; }
.overview-checks { display: grid; gap: 8px; }
.overview-checks a { padding: 12px; display: flex; align-items: center; gap: 12px; color: var(--color-muted); background: #f9fafb; border: 1px solid var(--color-border); border-radius: 9px; text-decoration: none; }
.overview-checks a>i:first-child { color: #9ca3af; }.overview-checks a.complete>i:first-child { color: var(--color-pv); }.overview-checks a>i:last-child { margin-left: auto; }
.overview-checks span,.overview-checks strong,.overview-checks small { display: block; }.overview-checks strong { color: var(--color-text); }.overview-checks small { margin-top: 2px; }
.overview-action { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; }.overview-action h2 { margin: 16px 0 5px; }.overview-action p { color: var(--color-muted); line-height: 1.55; }.overview-action .btn { margin-top: auto; }
.scenario-concept-panel { padding: 20px; overflow: hidden; }.scenario-concept-canvas { position: relative; min-height: 390px; border: 1px solid #edf0f3; border-radius: 11px; background: radial-gradient(circle at 50% 50%,#ffffff 0,#ffffff 28%,#f8fafc 100%); }.scenario-concept-lines { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }.scenario-concept-lines line { stroke: #94a3b8; stroke-width: .55; stroke-linecap: round; stroke-dasharray: 1.5 1.3; opacity: .72; }.concept-node { --accent: var(--color-primary); position: absolute; z-index: 1; min-width: 128px; padding: 12px 14px; display: grid; justify-items: center; gap: 4px; color: inherit; text-align: center; text-decoration: none; background: rgba(255,255,255,.94); border: 1px solid color-mix(in srgb,var(--accent) 24%,#dbe5ea); border-radius: 13px; box-shadow: 0 12px 28px rgba(15,23,42,.07); transform: translate(-50%,-50%); }.concept-node:hover { color: var(--accent); border-color: color-mix(in srgb,var(--accent) 42%,#dbe5ea); }.concept-icon { width: 38px; height: 38px; display: grid; place-items: center; color: var(--accent); background: color-mix(in srgb,var(--accent) 10%,white); border-radius: 11px; font-size: 1.15rem; }.concept-node strong,.concept-node small { display: block; }.concept-node strong { font-size: .86rem; }.concept-node small { color: var(--color-muted); font-size: .7rem; }.concept-center { left: 50%; top: 50%; --accent: var(--color-primary); min-width: 154px; padding: 16px 18px; border-width: 2px; }.concept-center .concept-icon { width: 46px; height: 46px; font-size: 1.35rem; }.concept-grid { left: 50%; top: 15%; --accent: var(--color-grid); }.concept-pv { left: 82%; top: 30%; --accent: var(--color-pv); }.concept-wind { left: 18%; top: 30%; --accent: var(--color-wind); }.concept-bess { left: 18%; top: 73%; --accent: var(--color-bess); }.concept-diesel { left: 82%; top: 73%; --accent: var(--color-diesel); }.concept-empty { position: absolute; left: 50%; top: 78%; transform: translateX(-50%); display: inline-flex; align-items: center; gap: 8px; padding: 8px 11px; color: var(--color-muted); background: #fff; border: 1px dashed #cfd8e3; border-radius: 999px; font-size: .78rem; }
.feature-placeholder { min-height: 330px; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; }.feature-placeholder h2 { margin: 15px 0 6px; }.feature-placeholder p { max-width: 560px; color: var(--color-muted); }.placeholder-icon { width: 58px; height: 58px; margin-bottom: 14px; display: grid; place-items: center; color: var(--color-primary); background: #eaf5f3; border-radius: 14px; font-size: 1.5rem; }.placeholder-icon.wind { color: var(--color-wind); background: #ecfeff; }
.future-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; }
.future-card { min-height: 90px; padding: 18px; display: flex; align-items: center; gap: 15px; background: #fff; border: 1px solid var(--color-border); border-radius: 12px; }
.future-card>i { color: var(--color-primary); font-size: 1.35rem; }
.future-card div { flex: 1; }
.future-card strong,.future-card span { display: block; }
.future-card div span { margin-top: 3px; color: var(--color-muted); font-size: .82rem; }
.badge-soft { width: fit-content; padding: 4px 8px; color: var(--color-primary); background: #eaf5f3; border-radius: 999px; font-size: .68rem; font-weight: 700; }
.resource-placeholder { overflow: hidden; }
.resource-placeholder h2 { margin: 16px 0 7px; }
.resource-placeholder p { color: var(--color-muted); line-height: 1.6; }
.placeholder-visual { position: relative; height: 130px; margin: -20px -20px 18px; display: grid; place-items: center; color: var(--color-primary); background: linear-gradient(135deg,#f0fdfa,#eff6ff); overflow: hidden; }
.placeholder-visual>i { z-index: 1; width: 48px; height: 48px; display: grid; place-items: center; font-size: 1.35rem; background: #fff; border-radius: 50%; box-shadow: var(--shadow-md); }
.map-line { position: absolute; width: 180px; height: 60px; border: 1px solid rgba(15,118,110,.15); border-radius: 50%; transform: rotate(-15deg); }
.map-line.two { width: 280px; height: 100px; transform: rotate(22deg); }

/* 7. KPI cards */
.kpi-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(165px,1fr)); gap: 14px; }
.dashboard-kpis { grid-template-columns: repeat(3,minmax(0,1fr)); }
.scenario-kpis { grid-template-columns: repeat(6,minmax(150px,1fr)); }
.consumption-kpis { grid-template-columns: repeat(4,minmax(180px,1fr)); }
.kpi-card { --kpi-color: var(--color-primary); min-height: 108px; padding: 16px; display: flex; gap: 13px; background: #fff; border: 1px solid var(--color-border); border-top: 3px solid var(--kpi-color); border-radius: 11px; box-shadow: var(--shadow-sm); }
.kpi-icon { width: 34px; height: 34px; flex: 0 0 34px; display: grid; place-items: center; color: var(--kpi-color); background: color-mix(in srgb,var(--kpi-color) 9%,white); border-radius: 8px; }
.kpi-content { min-width: 0; }
.kpi-content span,.kpi-content small,.kpi-content strong { display: block; }
.kpi-content span { color: var(--color-muted); font-size: .76rem; font-weight: 650; }
.kpi-content strong { margin-top: 5px; font-size: 1.25rem; letter-spacing: -.025em; white-space: nowrap; }
.scenario-kpis .kpi-card { position: relative; display: block; }
.scenario-kpis .kpi-icon { position: absolute; top: 15px; right: 15px; }
.scenario-kpis .kpi-content span { padding-right: 38px; }
.scenario-kpis .kpi-content strong { font-size: clamp(.98rem,1.15vw,1.2rem); }
.kpi-content small { margin-top: 3px; color: #9ca3af; font-size: .68rem; }
.kpi-pv { --kpi-color: var(--color-pv); }.kpi-grid { --kpi-color: var(--color-grid); }.kpi-bess { --kpi-color: var(--color-bess); }.kpi-cost,.kpi-diesel { --kpi-color: var(--color-diesel); }.kpi-emission { --kpi-color: #64748b; }.kpi-demand { --kpi-color: var(--color-primary); }

/* 8. Forms */
.form-panel { height: 100%; }
.panel-title { display: flex; gap: 12px; align-items: center; margin-bottom: 18px; padding-bottom: 15px; border-bottom: 1px solid var(--color-border); }
.panel-title h2 { margin: 0 0 3px; }
.panel-icon { width: 38px; height: 38px; display: grid; place-items: center; color: var(--color-primary); background: #eaf5f3; border-radius: 9px; }
.panel-icon.grid { color: var(--color-grid); background: #eff6ff; }
.form-label { margin-bottom: 5px; color: #4b5563; font-size: .78rem; font-weight: 650; }
.form-control,.form-select { min-height: 40px; color: var(--color-text); border-color: #d9dee6; border-radius: 8px; font-size: .86rem; }
.form-control:focus,.form-select:focus { border-color: #5ba69f; box-shadow: 0 0 0 3px rgba(15,118,110,.1); }
.form-field+.form-field { margin-top: 17px; }
.form-help { display: block; margin-top: 5px; color: var(--color-muted); }
.input-icon { position: relative; }.input-icon i { position: absolute; z-index: 1; left: 12px; top: 11px; color: var(--color-muted); }.input-icon input { padding-left: 35px; }
.input-unit { position: relative; }.input-unit input { padding-right: 73px; }.input-unit span { position: absolute; top: 1px; right: 1px; bottom: 1px; padding: 0 9px; display: flex; align-items: center; color: var(--color-muted); background: #f9fafb; border-left: 1px solid var(--color-border); border-radius: 0 7px 7px 0; font-size: .72rem; }
.form-separator { display: flex; align-items: center; gap: 12px; margin: 20px 0; color: #9ca3af; font-size: .72rem; text-transform: uppercase; }.form-separator:before,.form-separator:after { content:""; flex: 1; border-top: 1px solid var(--color-border); }
.consumer-forms { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px; align-items: start; }
.consumer-form { height: 100%; }
.consumer-actions { display: flex; justify-content: flex-end; gap: 6px; }.consumer-actions form { display: flex; }
.consumer-type { color: var(--color-text); font-weight: 650; }
.ops-schedule-builder { overflow: hidden; }
.ops-terminal-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 10px; }
.ops-terminal-option { min-height: 128px; padding: 14px; display: flex; flex-direction: column; gap: 8px; cursor: pointer; background: #f8fafc; border: 1px solid var(--color-border); border-radius: 10px; transition: border-color .16s ease, box-shadow .16s ease, background .16s ease; }
.ops-terminal-option input { position: absolute; opacity: 0; pointer-events: none; }
.ops-terminal-option.is-selected { background: #f0fdfa; border-color: #5ba69f; box-shadow: 0 0 0 3px rgba(15,118,110,.10); }
.ops-terminal-option strong { display: block; color: var(--color-text); }
.ops-terminal-option small { color: var(--color-muted); line-height: 1.35; }
.ops-terminal-visual { height: 42px; display: flex; align-items: flex-end; gap: 7px; color: var(--color-primary); }
.ops-terminal-visual i:first-child { font-size: 1.45rem; }
.ops-terminal-visual i:last-child { color: #0891b2; font-size: 1rem; }
.ops-schedule-mode { display: inline-flex; flex-wrap: wrap; gap: 7px; margin: 4px 0 14px; padding: 4px; background: #f1f5f9; border: 1px solid #e2e8f0; border-radius: 10px; }
.ops-mode-pill { min-height: 34px; padding: 7px 12px; display: inline-flex; align-items: center; gap: 7px; color: #475569; cursor: pointer; border-radius: 8px; font-weight: 700; }
.ops-mode-pill input { margin: 0; }
.ops-mode-pill.is-selected { color: #0f766e; background: #fff; box-shadow: var(--shadow-sm); }
.ops-schedule-section { padding-top: 8px; border-top: 1px solid var(--color-border); }
.ops-helper { margin-bottom: 14px; padding: 11px 12px; display: flex; gap: 9px; color: #475569; background: #f8fafc; border: 1px solid #e7edf3; border-radius: 9px; line-height: 1.45; }
.ops-helper i { margin-top: 2px; color: var(--color-primary); }
.ops-vessel-table { min-width: 1180px; }
.ops-vessel-table th { color: var(--color-muted); font-size: .68rem; letter-spacing: .04em; text-transform: uppercase; white-space: nowrap; }
.ops-vessel-table td { padding: 8px 6px; vertical-align: middle; }
.ops-vessel-table .form-control,.ops-vessel-table .form-select { min-height: 36px; padding: 6px 8px; font-size: .78rem; }
.ops-vessel-table td:nth-child(1) { min-width: 170px; }
.ops-vessel-table td:nth-child(2) { min-width: 165px; }
.ops-vessel-table td:nth-child(n+3):nth-child(-n+9) { min-width: 96px; }
.modal-header,.modal-footer { padding: 18px 20px; border-color: var(--color-border); }.modal-body { padding: 22px 20px; }.modal-title { margin: 3px 0 0; font-size: 1.2rem; }

/* 9. Tables */
.project-panel { padding: 0; overflow: hidden; }.project-panel>.section-header { padding: 20px 20px 0; }
.app-table { --bs-table-bg: transparent; }
.app-table thead th { padding: 11px 16px; color: var(--color-muted); background: #f9fafb; border: 0; border-top: 1px solid var(--color-border); border-bottom: 1px solid var(--color-border); font-size: .68rem; font-weight: 750; letter-spacing: .055em; text-transform: uppercase; white-space: nowrap; }
.app-table tbody td { padding: 14px 16px; color: #4b5563; border-color: #eef0f3; }
.app-table tbody tr:hover { background: #fafcfb; }
.table-title { display: block; color: var(--color-text); font-weight: 700; text-decoration: none; }.table-title:hover { color: var(--color-primary); }.table-title+small,.app-table td small { display: block; max-width: 380px; margin-top: 3px; color: var(--color-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.table-search { position: relative; }.table-search i { position: absolute; left: 11px; top: 9px; color: var(--color-muted); }.table-search input { width: 230px; height: 36px; padding: 0 10px 0 34px; border: 1px solid var(--color-border); border-radius: 8px; outline: none; }.table-search input:focus { border-color: var(--color-primary); }
.count-badge { display: inline-flex; min-width: 28px; justify-content: center; padding: 3px 8px; color: var(--color-primary); background: #eaf5f3; border-radius: 999px; font-size: .75rem; font-weight: 700; }
.panel-table { padding: 0; overflow: hidden; border: 1px solid var(--color-border); border-radius: 10px; }.panel-table .table { margin: 0; }.panel-table thead th { color: var(--color-muted); background: #f9fafb; font-size: .72rem; }.panel-table td,.panel-table th { padding: 12px; border-color: #eef0f3; }

/* 10. Buttons */
.btn { border-radius: 8px; font-weight: 650; }.btn i { margin-right: 3px; }.btn-primary { --bs-btn-bg: var(--color-primary); --bs-btn-border-color: var(--color-primary); --bs-btn-hover-bg: var(--color-primary-dark); --bs-btn-hover-border-color: var(--color-primary-dark); }.btn-outline-primary { --bs-btn-color: var(--color-primary); --bs-btn-border-color: #80b8b3; --bs-btn-hover-bg: var(--color-primary); --bs-btn-hover-border-color: var(--color-primary); }.btn-outline-secondary { --bs-btn-color: #4b5563; --bs-btn-border-color: #d1d5db; }.text-link { color: var(--color-primary); font-weight: 650; text-decoration: none; }

/* 11. Badges / empty states */
.empty-state { padding: 42px 20px; text-align: center; color: var(--color-muted); }.empty-state h3 { margin: 12px 0 5px; color: var(--color-text); }.empty-state p { margin: 0 auto 15px; }.compact-empty { padding: 28px 20px; background: #fafbfc; border: 1px dashed #d7dce3; border-radius: 10px; }.empty-icon { width: 42px; height: 42px; margin: auto; display: grid; place-items: center; color: var(--color-primary); background: #eaf5f3; border-radius: 50%; font-size: 1.1rem; }
.asset-state { padding: 4px 8px; border-radius: 999px; font-size: .68rem; font-weight: 700; }.asset-state.on { color: #15803d; background: #ecfdf3; }.asset-state.off { color: #991b1b; background: #fef2f2; }

/* 12. Assets */
.asset-summary-grid,.asset-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 15px; }
.asset-grid.single-asset-form { grid-template-columns: minmax(0,760px); }
.asset-summary { padding: 17px; background: #fff; border: 1px solid var(--color-border); border-left: 4px solid var(--color-primary); border-radius: 10px; }.asset-kind-pv { border-left-color: var(--color-pv); }.asset-kind-bess { border-left-color: var(--color-bess); }.asset-kind-grid { border-left-color: var(--color-grid); }.asset-kind-diesel { border-left-color: var(--color-diesel); }
.asset-summary-head { display: flex; justify-content: space-between; gap: 12px; }.asset-type { color: var(--color-muted); font-size: .66rem; font-weight: 750; letter-spacing: .08em; }.asset-summary h3 { margin: 3px 0 0; }
.asset-metrics { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 7px; margin-top: 15px; }.asset-metrics div { padding: 9px; background: #f9fafb; border-radius: 7px; }.asset-metrics span,.asset-metrics strong { display: block; }.asset-metrics span { color: var(--color-muted); font-size: .65rem; }.asset-metrics strong { margin-top: 4px; font-size: .8rem; }
.asset-actions { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 14px; }.asset-actions form { display: flex; }
.asset-form { border-top: 3px solid var(--color-primary); }.asset-form-grid { border-top-color: var(--color-grid); }.asset-form-pv { border-top-color: var(--color-pv); }.asset-form-bess { border-top-color: var(--color-bess); }.asset-form-diesel { border-top-color: var(--color-diesel); }
.asset-form-title { display: flex; gap: 11px; align-items: center; margin-bottom: 15px; }.asset-form-title>span { width: 36px; height: 36px; display: grid; place-items: center; color: var(--color-primary); background: #f0fdfa; border-radius: 8px; }.asset-form-title small { color: var(--color-muted); font-size: .65rem; text-transform: uppercase; }.asset-form-title h3 { margin: 1px 0 0; }
.param { display: inline-block; margin-right: 8px; white-space: nowrap; }

/* 13. Scenario / results / PV */
.scenario-status { display: flex; align-items: center; gap: 8px; color: var(--color-muted); }.scenario-status strong { color: #374151; }.scenario-status span:last-child:before { content:"·"; margin-right: 8px; }.status-dot { width: 8px; height: 8px; border-radius: 50%; background: #d97706; box-shadow: 0 0 0 4px #fef3c7; }.status-dot.ready { background: var(--color-pv); box-shadow: 0 0 0 4px #dcfce7; }
.section-tabs { flex-wrap: nowrap; overflow-x: auto; background: #fff; border: 1px solid var(--color-border); border-radius: 10px; }.section-tabs .nav-link { padding: 12px 16px; color: var(--color-muted); border-bottom: 2px solid transparent; border-radius: 0; white-space: nowrap; }.section-tabs .nav-link:hover,.section-tabs .nav-link.active { color: var(--color-primary); border-bottom-color: var(--color-primary); background: #fafdfc; }
.simulation-panel>.section-header h2 { margin: 3px 0 0; }.readiness-strip { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 18px; }.readiness-strip span { padding: 6px 10px; color: var(--color-muted); background: #f9fafb; border: 1px solid var(--color-border); border-radius: 999px; font-size: .75rem; }.readiness-strip span.complete { color: #15803d; background: #f0fdf4; border-color: #bbf7d0; }
.result-toolbar { display: flex; align-items: center; justify-content: space-between; }.toolbar-label { display: block; margin-bottom: 6px; color: var(--color-muted); font-size: .72rem; }
.coverage-strip,.technical-strip { display: grid; grid-template-columns: repeat(auto-fit,minmax(145px,1fr)); background: #fff; border: 1px solid var(--color-border); border-radius: 10px; overflow: hidden; }.coverage-strip div,.technical-strip div { padding: 12px 14px; border-right: 1px solid var(--color-border); }.coverage-strip span,.technical-strip span,.coverage-strip strong,.technical-strip strong { display: block; }.coverage-strip span,.technical-strip span { color: var(--color-muted); font-size: .68rem; }.coverage-strip strong,.technical-strip strong { margin-top: 3px; }.technical-strip { gap: 8px; padding: 8px; background: transparent; border: 0; }.technical-strip div { background: #fff; border: 1px solid var(--color-border); border-radius: 8px; }
.chart-card { padding: 0; overflow: hidden; }.chart-heading { padding: 20px 20px 10px; }.chart-heading h2 { margin: 3px 0; }.chart-wrap { min-width: 0; overflow: hidden; }.consumption-chart { min-height: 460px; }.consumption-chart .plotly-graph-div { min-height: 460px; }
.consumer-table-scroll { overflow-x: auto; scrollbar-gutter: stable; }.consumer-table { min-width: 980px; }.consumer-table th,.consumer-table td { white-space: nowrap; }.consumer-table td:first-child,.consumer-table td:nth-child(2) { white-space: normal; min-width: 210px; }
.tariff-period-editor { padding: 12px; background: #f8fafb; border: 1px solid var(--color-border); border-radius: 8px; }.tariff-period-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 10px; }.tariff-period-head small { display: block; color: var(--color-muted); }.tariff-period-table { min-width: 720px; }.tariff-period-table th { color: var(--color-muted); font-size: .68rem; letter-spacing: .05em; text-transform: uppercase; }.tariff-period-table td { vertical-align: middle; }.tariff-period-table td:last-child { width: 42px; }
.wizard-modal .modal-body { padding: 24px; }.wizard-progress { display: flex; gap: 7px; margin-bottom: 18px; }.wizard-progress span { height: 6px; flex: 1; background: #e5e7eb; border-radius: 999px; }.wizard-progress span.active { background: var(--color-primary); }.wizard-modal h3 { margin: 0 0 10px; font-size: 1.05rem; }.wizard-modal p { color: var(--color-muted); line-height: 1.65; }.wizard-choice-row { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 18px; }

/* Decision dashboards */
.scenario-overview-kpis,.result-hero-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 16px; }
.overview-kpi { position: relative; min-height: 126px; padding: 20px; display: flex; align-items: center; gap: 16px; overflow: hidden; background: linear-gradient(145deg,#fff 35%,#f8fafc); border: 1px solid var(--color-border); border-radius: 14px; box-shadow: 0 5px 18px rgba(15,23,42,.045); }
.overview-kpi::after { content:""; position: absolute; width: 90px; height: 90px; right: -34px; bottom: -45px; background: var(--accent,#0f766e); border-radius: 50%; opacity: .08; }
.overview-kpi-icon { width: 43px; height: 43px; display: grid; flex: 0 0 43px; place-items: center; color: var(--accent,#0f766e); background: color-mix(in srgb,var(--accent,#0f766e) 10%,white); border-radius: 11px; font-size: 1.1rem; }
.overview-kpi small,.overview-kpi strong,.overview-kpi div>span { display: block; }.overview-kpi small { color: var(--color-muted); font-weight: 650; }.overview-kpi strong { margin-top: 5px; font-size: clamp(1.25rem,1.65vw,1.65rem); letter-spacing: -.04em; }.overview-kpi div>span { color: var(--color-muted); font-size: .72rem; }.overview-kpi.renewable { --accent:var(--color-pv); }.overview-kpi.autonomy { --accent:var(--color-bess); }.overview-kpi.economy { --accent:var(--color-diesel); }
.result-hero { --accent:var(--color-primary); position: relative; min-height: 150px; padding: 22px; display: flex; justify-content: space-between; overflow: hidden; color: #fff; background: linear-gradient(135deg,color-mix(in srgb,var(--accent) 92%,#111827),var(--accent)); border-radius: 16px; box-shadow: 0 10px 28px color-mix(in srgb,var(--accent) 18%,transparent); }
.result-hero::after { content:""; position:absolute; width:125px; height:125px; right:-45px; bottom:-55px; border:22px solid rgba(255,255,255,.10); border-radius:50%; }.result-hero>div,.result-hero>i { position:relative; z-index:1; }.result-hero>i { font-size:1.4rem; opacity:.8; }.result-hero span,.result-hero strong,.result-hero small { display:block; }.result-hero span { font-size:.76rem; font-weight:700; opacity:.82; }.result-hero strong { margin-top:12px; font-size:clamp(1.35rem,1.8vw,1.8rem); letter-spacing:-.045em; }.result-hero small { margin-top:5px; opacity:.72; }.result-hero.autonomy { --accent:#7c3aed; }.result-hero.cost { --accent:#d97706; }.result-hero.saving { --accent:#16a34a; }.result-hero.saving.negative { --accent:#dc2626; }
.energy-balance-card { padding:24px; }.energy-stack { height:22px; display:flex; overflow:hidden; background:#eef2f6; border-radius:999px; box-shadow:inset 0 1px 2px rgba(15,23,42,.08); }.energy-stack span { min-width:0; transition:width .3s ease; }.energy-stack .pv,.energy-legend i.pv { background:var(--color-pv); }.energy-stack .wind,.energy-legend i.wind { background:var(--color-wind); }.energy-stack .bess,.energy-legend i.bess { background:var(--color-bess); }.energy-stack .grid,.energy-legend i.grid { background:var(--color-grid); }.energy-stack .diesel,.energy-legend i.diesel { background:var(--color-diesel); }.energy-stack .unmet,.energy-legend i.unmet { background:var(--color-danger); }.energy-stack .unclassified,.energy-legend i.unclassified { background:#94a3b8; }
.energy-legend { margin-top:20px; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:13px 18px; }.energy-legend span { display:grid; grid-template-columns:9px 1fr; align-items:center; gap:0 8px; color:var(--color-muted); font-size:.72rem; }.energy-legend i { width:9px; height:9px; grid-row:1/3; border-radius:50%; }.energy-legend strong { display:block; color:var(--color-text); font-size:.82rem; }
.result-finance-table td,.result-finance-table th { padding:13px 24px; border-color:#eef0f3; }.result-finance-table td { color:var(--color-muted); }.result-finance-table th { text-align:right; }
.result-details { padding:0; overflow:hidden; }.result-details>summary,.comparison-charts>summary { padding:18px 20px; display:flex; align-items:center; justify-content:space-between; cursor:pointer; list-style:none; }.result-details>summary::-webkit-details-marker,.comparison-charts>summary::-webkit-details-marker { display:none; }.result-details>summary span { display:grid; grid-template-columns:34px 1fr; }.result-details>summary span>i { grid-row:1/3; width:34px; height:34px; display:grid; place-items:center; color:var(--color-primary); background:#eaf5f3; border-radius:9px; }.result-details>summary strong,.result-details>summary small { margin-left:12px; }.result-details>summary small { color:var(--color-muted); }.result-details[open]>summary>i,.comparison-charts[open]>summary i { transform:rotate(180deg); }.result-details>summary>i,.comparison-charts>summary i { transition:transform .2s; }
.result-detail-groups { padding:0 20px 20px; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }.result-detail-groups section { padding:16px; background:#f8fafc; border:1px solid #edf0f3; border-radius:10px; }.result-detail-groups h3 { display:flex; align-items:center; gap:8px; }.result-detail-groups dl { margin:0; }.result-detail-groups dl div { padding:8px 0; display:flex; justify-content:space-between; gap:12px; border-top:1px solid #e8edf2; }.result-detail-groups dt { color:var(--color-muted); font-weight:500; }.result-detail-groups dd { margin:0; text-align:right; font-weight:700; }
.comparison-leaders { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }.comparison-leaders article { min-height:110px; padding:18px; display:flex; align-items:center; gap:14px; background:#fff; border:1px solid var(--color-border); border-radius:13px; box-shadow:var(--shadow-sm); }.leader-icon { width:42px; height:42px; display:grid; flex:0 0 42px; place-items:center; color:var(--color-primary); background:#eaf5f3; border-radius:11px; }.leader-icon.cost { color:var(--color-diesel); background:#fff7ed; }.leader-icon.autonomy { color:var(--color-bess); background:#f5f3ff; }.comparison-leaders small,.comparison-leaders strong,.comparison-leaders article div>span { display:block; }.comparison-leaders small { color:var(--color-muted); }.comparison-leaders strong { margin:3px 0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }.comparison-leaders article div { min-width:0; }.comparison-leaders article div>span { color:var(--color-primary); font-weight:750; }
.comparison-table .comparison-baseline { background:#f0fdfa; box-shadow:inset 3px 0 var(--color-primary); }.delta { font-weight:700; white-space:nowrap; }.delta.is-good { color:#15803d; }.delta.is-bad { color:#b91c1c; }.pareto-badge { display:inline-flex; align-items:center; gap:4px; padding:4px 8px; color:#0f766e; background:#ccfbf1; border-radius:999px; font-size:.68rem; font-weight:750; }.pareto-list { display:grid; gap:8px; }.pareto-list a { padding:11px 12px; display:flex; justify-content:space-between; gap:12px; color:inherit; background:#f8fafc; border:1px solid #edf0f3; border-radius:9px; text-decoration:none; }.pareto-list span { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.pareto-list strong { color:var(--color-primary); white-space:nowrap; }.comparison-charts { padding:4px 20px 20px; }.comparison-charts>summary { margin:0 -20px -4px; font-weight:700; }.optimization-batches { display:grid; gap:8px; }.optimization-batches>div { padding:11px 12px; display:flex; align-items:center; justify-content:space-between; background:#f8fafc; border:1px solid #edf0f3; border-radius:9px; }.optimization-batches strong,.optimization-batches small { display:block; }.optimization-batches small { color:var(--color-muted); }
.pv-workspace { display: grid; grid-template-columns: minmax(0,1.35fr) minmax(390px,.65fr); gap: 18px; align-items: stretch; }.pv-map-panel { display: flex; flex-direction: column; min-height: 680px; }.pv-map { flex: 1 1 auto; min-height: 560px; border: 1px solid var(--color-border); border-radius: 9px; overflow: hidden; }.pv-map-hint { margin-top: 10px; color: var(--color-muted); font-size: .78rem; }.pv-reference-toolbar { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 10px; }.pv-reference-toolbar form { display: flex; align-items: center; gap: 7px; }.pv-reference-toolbar .form-control { width: min(310px,42vw); }.pv-reference-toolbar #pv-reference-status { margin-left: auto; }.pv-form { position: static; }.pv-form-section { margin: 18px 0 7px; padding-top: 13px; border-top: 1px solid var(--color-border); color: #334155; font-size: .78rem; text-transform: uppercase; letter-spacing: .05em; }.pv-sizing-preview { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 7px; padding: 10px; color: var(--color-muted); background: #f8fafc; border: 1px solid var(--color-border); border-radius: 8px; font-size: .72rem; }.pv-sizing-preview div { padding: 7px; background: #fff; border-radius: 6px; }.pv-sizing-preview span,.pv-sizing-preview strong { display: block; }.pv-sizing-preview strong { margin-top: 2px; color: var(--color-text); font-size: .8rem; }.pv-sizing-preview.is-error { color: #b91c1c; background: #fef2f2; border-color: #fecaca; }
.wind-map-panel { padding: 20px; }.wind-map { height: 610px; border: 1px solid var(--color-border); border-radius: 9px; overflow: hidden; }.wind-layout-status { padding: 8px 12px; color: #475569; background: #f1f5f9; border-radius: 999px; font-size: .78rem; font-weight: 700; }.wind-layout-status.is-valid { color: #047857; background: #ecfdf5; }.wind-layout-status.is-error { color: #b91c1c; background: #fef2f2; }.wind-turbine-marker-wrap { background: transparent; border: 0; }.wind-turbine-marker { display: grid; width: 34px; height: 34px; place-items: center; color: #fff; background: #0e7490; border: 3px solid #fff; border-radius: 50%; box-shadow: 0 2px 8px rgba(15,23,42,.35); font-size: 1rem; }.wind-turbine-marker.invalid { background: #dc2626; }.wind-turbine-marker.muted { background: #64748b; opacity: .72; }.wind-analysis-kpis { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 12px; }.wind-analysis-kpis div { padding: 14px 16px; background: #fff; border: 1px solid var(--color-border); border-radius: 10px; }.wind-analysis-kpis span,.wind-analysis-kpis strong { display: block; }.wind-analysis-kpis span { color: var(--color-muted); font-size: .75rem; }.wind-analysis-kpis strong { margin-top: 4px; font-size: 1.05rem; }.wind-curve-editor { max-height: 390px; overflow: auto; border: 1px solid var(--color-border); border-radius: 8px; }.wind-curve-editor table { margin: 0; }.wind-curve-editor thead { position: sticky; top: 0; z-index: 1; background: #f8fafc; }
.pv-assets-table th { color: var(--color-muted); font-size: .68rem; text-transform: uppercase; letter-spacing: .04em; white-space: nowrap; }.pv-assets-table td { font-size: .78rem; }.pv-warning { display: block; max-width: 430px; margin-top: 5px; color: #b45309; font-weight: 500; }.pv-warning i { margin-right: 3px; }
.pv-asset-select { color: var(--color-text); text-decoration: none; }.pv-asset-select:hover,.pv-asset-select.active { color: var(--color-primary); text-decoration: underline; text-underline-offset: 3px; }
.pv-config-details { padding: 9px 10px; background: #fbfcfd; border: 1px solid var(--color-border); border-radius: 8px; }.pv-config-details summary { color: #334155; cursor: pointer; font-size: .74rem; font-weight: 700; }.pv-design-grid,.pv-economic-kpis { display: grid; grid-template-columns: repeat(auto-fit,minmax(155px,1fr)); gap: 8px; }.pv-design-grid div,.pv-economic-kpis div { padding: 11px 12px; background: #f8fafc; border: 1px solid #edf0f3; border-radius: 8px; }.pv-design-grid span,.pv-design-grid strong,.pv-economic-kpis span,.pv-economic-kpis strong { display: block; }.pv-design-grid span,.pv-economic-kpis span { color: var(--color-muted); font-size: .68rem; }.pv-design-grid strong,.pv-economic-kpis strong { margin-top: 4px; font-size: .84rem; }.pv-economic-kpis strong { color: var(--color-primary-dark); font-size: 1rem; }.pv-bom-table th { color: var(--color-muted); font-size: .68rem; text-transform: uppercase; }

/* 14. Responsive */
@media (max-width: 1250px) { .scenario-kpis { grid-template-columns: repeat(3,minmax(150px,1fr)); }.scenario-overview-kpis,.result-hero-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }.asset-metrics { grid-template-columns: 1fr; }.page-shell { padding: 24px; } }
@media (max-width: 1024px) { .app-sidebar { transform: translateX(-100%); box-shadow: var(--shadow-md); }.app-sidebar.open { transform: translateX(0); }.app-workspace { width: 100%; margin-left: 0; }.sidebar-toggle { display: block; }.app-topbar { padding: 0 24px; }.content-grid-main,.overview-grid,.consumer-forms,.pv-workspace { grid-template-columns: 1fr; }.pv-form { position: static; }.asset-grid { grid-template-columns: 1fr; }.pv-map-panel { min-height: 620px; } }
@media (max-width: 760px) { .page-shell { padding: 20px 15px 40px; }.app-topbar { height: 62px; padding: 0 15px; }.topbar-actions .btn span { display: none; }.page-heading { align-items: flex-start; flex-direction: column; }.dashboard-kpis,.scenario-kpis,.scenario-overview-kpis,.result-hero-grid,.comparison-leaders,.consumption-kpis,.future-grid,.asset-summary-grid,.result-detail-groups { grid-template-columns: 1fr; }.energy-legend { grid-template-columns:repeat(2,minmax(0,1fr)); }.section-header { align-items: flex-start; flex-direction: column; }.table-search,.table-search input { width: 100%; }.heading-actions { width: 100%; }.scenario-status span:last-child { display: none; }.asset-metrics { grid-template-columns: repeat(3,minmax(0,1fr)); }.pv-map { min-height: 420px; }.scenario-concept-canvas { min-height: 0; padding: 12px; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }.scenario-concept-lines { display: none; }.concept-node,.concept-center,.concept-grid,.concept-pv,.concept-wind,.concept-bess,.concept-diesel { position: static; min-width: 0; transform: none; }.concept-center { grid-column: 1 / -1; }.concept-empty { position: static; grid-column: 1 / -1; justify-content: center; transform: none; } }
.report-outline { display: grid; gap: 15px; margin: 20px 0 0; padding: 0; counter-reset: report-section; list-style: none; }.report-outline li { position: relative; padding: 13px 14px 13px 48px; background: #f8fafc; border: 1px solid var(--color-border); border-radius: 9px; }.report-outline li::before { position: absolute; left: 14px; top: 13px; display: grid; width: 25px; height: 25px; place-items: center; color: #fff; background: #0f766e; border-radius: 50%; counter-increment: report-section; content: counter(report-section); font-size: .72rem; font-weight: 800; }.report-outline strong,.report-outline span { display: block; }.report-outline span { margin-top: 3px; color: var(--color-muted); font-size: .78rem; }
.asset-detail-status{display:flex;align-items:center;gap:.75rem;color:var(--bs-secondary-color);font-size:.82rem}.asset-detail-list{margin:1rem 0 0}.asset-detail-list div{display:flex;justify-content:space-between;gap:2rem;padding:.75rem 0;border-bottom:1px solid #e2e8f0}.asset-detail-list div:last-child{border-bottom:0}.asset-detail-list dt{font-weight:500;color:#64748b}.asset-detail-list dd{margin:0;font-weight:700;color:#0f172a;text-align:right}.asset-detail-header .d-flex{flex-wrap:wrap}
.asset-detail-shortcuts{display:flex;align-items:center;gap:.55rem;flex-wrap:wrap;padding:.65rem .8rem;border:1px solid #dbe5ea;border-radius:.75rem;background:#fff}.asset-detail-shortcuts>span{font-size:.68rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#64748b;margin-right:.25rem}.asset-detail-shortcuts a{display:inline-flex;align-items:center;gap:.35rem;padding:.35rem .6rem;border-radius:.5rem;background:#edf7f5;color:#0f766e;font-size:.78rem;font-weight:700;text-decoration:none}.asset-detail-shortcuts a:hover{background:#dff1ed}

/* NAS portal integration: shared dark navigation language */
.app-sidebar {
  color: #f8fafc;
  background: #17483f;
  border-right-color: rgba(255,255,255,.08);
  box-shadow: 8px 0 28px rgba(15,23,42,.06);
}
.brand { margin: 0 2px 11px; padding: 6px 7px 20px; border-bottom: 1px solid rgba(255,255,255,.12); }
.brand-mark { color: #fff; background: rgba(255,255,255,.11); border: 1px solid rgba(255,255,255,.20); box-shadow: none; }
.brand strong { color: #fff; }
.brand small { color: #a9c9c2; }
.nav-section { color: #8db2aa; }
.sidebar-nav a,.nav-disabled,.sidebar-footer .nav-disabled,.nav-tree summary { color: #c8d9d5; }
.sidebar-nav a i,.nav-disabled i,.nav-tree summary>i:first-child { color: #b5cdc8; }
.sidebar-nav a:hover,.nav-tree summary:hover { color: #fff; background: rgba(255,255,255,.075); }
.sidebar-nav a:hover i,.nav-tree summary:hover>i:first-child { color: #fff; }
.sidebar-nav>a.active,.sidebar-nav>details+ a.active {
  color: #0b5f59;
  background: #fff;
  box-shadow: 0 7px 18px rgba(5,35,31,.14);
}
.sidebar-nav>a.active i,.sidebar-nav>details+ a.active i { color: #0f766e; }
.nav-tree summary.active { color: #fff; background: rgba(255,255,255,.075); }
.nav-tree summary.active>i:first-child { color: #d8e8e4; }
.nav-tree-items { border-left-color: rgba(255,255,255,.16); }
.sidebar-nav .nav-tree-items a { color: #bdd2cd; }
.sidebar-nav .nav-tree-items a:hover { color: #fff; background: rgba(255,255,255,.075); }
.sidebar-nav .nav-tree-items a.active { color: #0b5f59; background: #fff; box-shadow: 0 5px 15px rgba(5,35,31,.12); }
.sidebar-nav .nav-tree-items a small { color: #c6d9d5; background: rgba(255,255,255,.10); }
.sidebar-nav .nav-tree-items a.active small { color: #0f766e; background: #e8f3f1; }
.sidebar-nav .nav-tree-items .all-assets { border-top-color: rgba(255,255,255,.13); }
.nav-disabled { color: #789f97; }
.nav-disabled i { color: #789f97; }
.sidebar-footer { border-top-color: rgba(255,255,255,.12); }
.version-pill { color: #a9c9c2; }
.version-pill span { background: #63d9ad; box-shadow: 0 0 0 4px rgba(99,217,173,.10); }

/* Authenticated user in the shared NAS-style navigation. */
.sidebar-user { display:flex; align-items:center; gap:10px; margin:0 2px 8px; padding:10px 8px; color:#fff; }
.sidebar-user-avatar { width:34px; height:34px; display:grid; flex:0 0 34px; place-items:center; color:#17483f; background:#fff; border-radius:9px; font-weight:800; }
.sidebar-user>span:last-child { min-width:0; }
.sidebar-user strong,.sidebar-user small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.sidebar-user strong { font-size:.78rem; }
.sidebar-user small { margin-top:2px; color:#9fc4bc; font-size:.62rem; }
.sidebar-logout { width:100%; padding:7px 11px; color:#c8d9d5; background:transparent; border:0; border-radius:7px; text-align:left; font-size:.74rem; }
.sidebar-logout:hover { color:#fff; background:rgba(255,255,255,.075); }

/* OPS business module */
.ops-layout { display:grid; grid-template-columns:minmax(0,1.55fr) minmax(340px,.65fr); gap:18px; align-items:start; }
.ops-form { padding:22px; }
.ops-form-section { margin:20px 0 10px; padding-top:14px; border-top:1px solid var(--color-border); color:#334155; font-size:.72rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.ops-form-section:first-of-type { margin-top:4px; padding-top:0; border-top:0; }
.ops-side { display:grid; gap:18px; }
.ops-metric-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; }
.ops-metric-grid.one-col { grid-template-columns:1fr; }
.ops-metric-grid div { padding:13px 14px; background:#f8fafc; border:1px solid #edf0f3; border-radius:9px; }
.ops-metric-grid span,.ops-metric-grid strong { display:block; }
.ops-metric-grid span { color:var(--color-muted); font-size:.72rem; font-weight:650; }
.ops-metric-grid strong { margin-top:5px; font-size:1rem; }
.ops-inventory-summary { margin-top:14px; padding:12px; background:#f8fafc; border:1px solid var(--color-border); border-radius:9px; }
.ops-inventory-summary strong,.ops-inventory-summary span { display:block; }
.ops-inventory-summary span { margin-top:3px; color:var(--color-muted); font-size:.78rem; }
.ops-verdict { display:grid; grid-template-columns:minmax(0,.8fr) minmax(420px,1.2fr); gap:18px; align-items:center; border-left:5px solid var(--color-primary); }
.ops-verdict h2 { margin:5px 0 6px; font-size:1.45rem; }
.ops-verdict p { margin:0; color:var(--color-muted); }
.ops-verdict.is-viable { border-left-color:#16a34a; background:linear-gradient(90deg,#f0fdf4 0,#fff 34%); }
.ops-verdict.is-watch { border-left-color:#d97706; background:linear-gradient(90deg,#fff7ed 0,#fff 34%); }
.ops-verdict.is-not-viable { border-left-color:#dc2626; background:linear-gradient(90deg,#fef2f2 0,#fff 34%); }
.ops-verdict-checks { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.ops-verdict-checks span { min-height:42px; padding:9px 11px; display:flex; align-items:center; gap:8px; color:#475569; background:#f8fafc; border:1px solid #e5e7eb; border-radius:8px; font-size:.78rem; }
.ops-verdict-checks i { font-size:.95rem; }
.ops-verdict-checks strong { margin-left:auto; color:#111827; white-space:nowrap; }
.ops-verdict-checks .ok i { color:#16a34a; }
.ops-verdict-checks .ko i { color:#dc2626; }
.ops-chart-grid { display:grid; grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr); gap:18px; }
.ops-result-callout { display:flex; align-items:center; justify-content:space-between; gap:18px; border-left:5px solid #0f766e; }
.ops-result-callout.is-viable { border-left-color:#16a34a; }
.ops-result-callout.is-watch { border-left-color:#d97706; }
.ops-result-callout.is-not-viable { border-left-color:#dc2626; }
.ops-result-callout h2 { margin:4px 0 5px; }
.ops-result-callout p { margin:0; color:var(--color-muted); }
.ops-price-readout { display:grid; grid-template-columns:minmax(0,.9fr) minmax(520px,1.1fr); gap:18px; align-items:center; border-left:5px solid #7c3aed; }
.ops-price-readout h2 { margin:4px 0 6px; font-size:1.2rem; }
.ops-price-readout p { margin:0; color:var(--color-muted); line-height:1.55; }
.ops-price-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.ops-price-grid div { padding:13px 14px; background:#f8fafc; border:1px solid #e5e7eb; border-radius:9px; }
.ops-price-grid div.is-watch { background:#fff7ed; border-color:#fed7aa; }
.ops-price-grid div.is-ok { background:#f0fdf4; border-color:#bbf7d0; }
.ops-price-grid span,.ops-price-grid strong,.ops-price-grid small { display:block; }
.ops-price-grid span { color:var(--color-muted); font-size:.72rem; font-weight:700; }
.ops-price-grid strong { margin-top:5px; color:var(--color-text); font-size:1.02rem; }
.ops-price-grid small { margin-top:4px; color:#64748b; line-height:1.35; }
.ops-decision-callout { display:flex; align-items:center; justify-content:space-between; gap:18px; border-left:5px solid #dc2626; background:linear-gradient(90deg,#fef2f2 0,#fff 34%); }
.ops-decision-callout.viable { border-left-color:#16a34a; background:linear-gradient(90deg,#f0fdf4 0,#fff 34%); }
.ops-decision-callout h2 { margin:4px 0 6px; font-size:1.28rem; line-height:1.35; }
.ops-decision-callout p { margin:0; color:var(--color-muted); }
.ops-alert-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:12px; }
.ops-alert { padding:15px 16px; border-left:4px solid #64748b; }
.ops-alert span { display:flex; align-items:center; gap:7px; color:#0f172a; font-weight:800; }
.ops-alert p { margin:7px 0 0; color:#64748b; line-height:1.45; font-size:.82rem; }
.ops-alert.danger { border-left-color:#dc2626; background:#fef2f2; }
.ops-alert.warning { border-left-color:#d97706; background:#fff7ed; }
.ops-alert.info { border-left-color:#2563eb; background:#eff6ff; }
.ops-exploitation-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; }
.ops-exploitation-grid div { padding:14px; background:#f8fafc; border:1px solid #edf0f3; border-radius:9px; }
.ops-exploitation-grid span,.ops-exploitation-grid strong,.ops-exploitation-grid small { display:block; }
.ops-exploitation-grid span { color:var(--color-muted); font-size:.72rem; font-weight:700; }
.ops-exploitation-grid strong { margin-top:5px; color:var(--color-text); font-size:1.06rem; }
.ops-exploitation-grid strong.is-positive { color:#15803d; }
.ops-exploitation-grid strong.is-negative { color:#b91c1c; }
.ops-exploitation-grid small { margin-top:4px; color:#64748b; line-height:1.35; }
.ops-sensitivity-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
.ops-sensitivity h3 { margin:0 0 12px; font-size:1rem; }
.ops-sensitivity-table { min-width:520px; margin:0; border:1px solid #e5e7eb; border-radius:9px; overflow:hidden; }
.ops-sensitivity-table th,.ops-sensitivity-table td { padding:10px 12px; border-color:#edf0f3; font-size:.78rem; text-align:right; white-space:nowrap; }
.ops-sensitivity-table thead th { color:#64748b; background:#f8fafc; font-size:.68rem; letter-spacing:.04em; text-transform:uppercase; }
.ops-sensitivity-table th:first-child { text-align:left; }
.ops-sensitivity-table td.ok { color:#15803d; background:#f0fdf4; font-weight:750; }
.ops-sensitivity-table td.ko { color:#b91c1c; background:#fef2f2; font-weight:750; }
.ops-variant-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.ops-variant-button { width:100%; min-height:104px; padding:14px; text-align:left; color:inherit; background:#f8fafc; border:1px solid #dbe5ea; border-radius:9px; transition:border-color .15s ease, box-shadow .15s ease, background .15s ease; }
.ops-variant-button:hover { background:#fff; border-color:#0f766e; box-shadow:0 0 0 3px rgba(15,118,110,.09); }
.ops-variant-button strong,.ops-variant-button span { display:block; }
.ops-variant-button strong { color:var(--color-text); }
.ops-variant-button span { margin-top:5px; color:var(--color-muted); font-size:.78rem; line-height:1.4; }
.ops-comparison-table { min-width:1120px; }
.ops-comparison-table td { vertical-align:middle; }
.ops-comparison-table td strong,.ops-comparison-table td small { display:block; }
.ops-comparison-table td small { max-width:260px; margin-top:3px; color:var(--color-muted); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ops-report-alert-list { display:grid; gap:10px; }
.ops-report-alert-list .ops-alert { box-shadow:none; }
.breos-status-panel { display:flex; align-items:center; justify-content:space-between; gap:18px; border-left:5px solid #64748b; }
.breos-status-panel.is-ready { border-left-color:#16a34a; background:linear-gradient(90deg,#f0fdf4 0,#fff 35%); }
.breos-status-panel.is-missing { border-left-color:#d97706; background:linear-gradient(90deg,#fff7ed 0,#fff 35%); }
.breos-status-panel h2 { margin:4px 0 6px; }
.breos-status-panel p { margin:0; color:var(--color-muted); }
.breos-status-panel code { padding:8px 10px; color:#0f172a; background:#f8fafc; border:1px solid #e5e7eb; border-radius:8px; white-space:nowrap; }
.breos-kpi-strip { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
.breos-kpi { display:flex; align-items:flex-start; gap:14px; padding:18px; background:#fff; border:1px solid var(--color-border); border-radius:10px; }
.breos-kpi.negative { border-color:#fecaca; background:#fff5f5; }
.breos-kpi.warning { border-color:#fde68a; background:#fffbeb; }
.breos-kpi-icon { font-size:1.6rem; flex-shrink:0; margin-top:2px; }
.breos-kpi-icon.pv { color:#f59e0b; }
.breos-kpi-icon.indep { color:#0f766e; }
.breos-kpi-icon.export { color:#6366f1; }
.breos-kpi-icon.invest { color:#0284c7; }
.breos-kpi-icon.npv { color:#16a34a; }
.breos-kpi-icon.bess { color:#7c3aed; }
.breos-kpi-label { display:block; font-size:.72rem; text-transform:uppercase; letter-spacing:.06em; color:var(--color-muted); margin-bottom:2px; }
.breos-kpi-value { display:block; font-size:1.45rem; font-weight:700; line-height:1.15; }
.breos-kpi small { display:block; font-size:.78rem; color:var(--color-muted); margin-top:3px; }
.breos-chart-wrap { width:100%; overflow:hidden; }
.breos-chart-row { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.breos-bess-detail { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; border-top:1px solid var(--color-border); padding-top:12px; }
.breos-bess-detail > div { text-align:center; }
.breos-bess-detail span { display:block; font-size:.72rem; text-transform:uppercase; letter-spacing:.05em; color:var(--color-muted); }
.breos-bess-detail strong { display:block; font-size:1.1rem; font-weight:700; margin-top:2px; }
.breos-payback-note { margin:12px 0 0; font-size:.88rem; color:var(--color-muted); }
.breos-json { max-height:520px; margin:0; padding:16px; overflow:auto; color:#dbeafe; background:#0f172a; border-radius:9px; font-size:.78rem; }
.breos-json-toggle { cursor:pointer; font-size:.85rem; color:var(--color-muted); padding:8px 0; list-style:none; }
.breos-json-toggle::-webkit-details-marker { display:none; }
.breos-json-toggle::before { content:"▶  "; font-size:.7rem; }
details[open] .breos-json-toggle::before { content:"▼  "; }
.breos-co2-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-top:12px; }
.breos-co2-kpi { display:flex; align-items:flex-start; gap:12px; padding:14px 16px; background:#f0fdf4; border:1px solid #bbf7d0; border-radius:9px; }
.breos-co2-kpi > div { display:flex; flex-direction:column; }
.breos-co2-kpi span { font-size:.72rem; text-transform:uppercase; letter-spacing:.06em; color:#166534; margin-bottom:2px; }
.breos-co2-kpi strong { font-size:1.2rem; font-weight:700; color:#14532d; line-height:1.2; }
.breos-co2-kpi small { font-size:.75rem; color:#4ade80; margin-top:2px; }
.breos-co2-chart { grid-column:1 / -1; }
.breos-opt-charts { display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:8px; }
.breos-chart-label { font-size:.78rem; color:var(--color-muted); margin:0 0 4px; text-transform:uppercase; letter-spacing:.05em; }
.breos-mc-header { margin-bottom:4px; }
.breos-mc-header h2 { margin:4px 0 2px; }
.breos-mc-header p { color:var(--color-muted); font-size:.85rem; margin:0; }
.breos-mc-chart-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
@media (max-width:1024px) { .breos-kpi-strip { grid-template-columns:repeat(2,1fr); } .breos-chart-row { grid-template-columns:1fr; } .breos-mc-chart-grid { grid-template-columns:1fr; } }
@media (max-width:1024px) { .ops-layout { grid-template-columns:1fr; } }
@media (max-width:1024px) { .ops-verdict,.ops-chart-grid,.ops-price-readout,.ops-sensitivity-grid { grid-template-columns:1fr; }.ops-result-callout,.ops-decision-callout { align-items:flex-start; flex-direction:column; } }
@media (max-width:760px) { .ops-metric-grid,.ops-verdict-checks,.ops-price-grid,.ops-exploitation-grid,.ops-variant-grid { grid-template-columns:1fr; } }

/* Standalone login: visually aligned with the AFR Hub portal. */
.auth-body { min-height:100vh; display:grid; place-items:center; padding:30px; background:radial-gradient(circle at 8% 18%,#e6f1ef 0,transparent 25%),#f2f5f7; }
.auth-shell { width:min(1120px,100%); min-height:650px; display:grid; grid-template-columns:1.05fr 1fr; overflow:hidden; background:#fff; border:1px solid #e1e7eb; border-radius:26px; box-shadow:0 26px 70px rgba(15,23,42,.13); }
.auth-presentation { position:relative; padding:56px; display:flex; flex-direction:column; overflow:hidden; color:#fff; background:#17483f; }
.auth-presentation::before,.auth-presentation::after { content:""; position:absolute; border-radius:50%; border:1px solid rgba(255,255,255,.10); }
.auth-presentation::before { width:280px; height:280px; right:-105px; top:-105px; }
.auth-presentation::after { width:150px; height:150px; right:70px; bottom:55px; background:rgba(255,255,255,.035); }
.auth-brand { position:relative; z-index:1; display:flex; align-items:center; gap:12px; }
.auth-brand .brand-mark { width:48px; height:48px; flex-basis:48px; border-radius:13px; }
.auth-brand strong { font-size:1rem; letter-spacing:.08em; }
.auth-presentation-copy { position:relative; z-index:1; margin:auto 0; max-width:450px; }
.auth-presentation-copy .eyebrow { color:#a7d9cf; }
.auth-presentation-copy h1 { max-width:440px; margin:18px 0 20px; color:#fff; font-size:clamp(2.4rem,4vw,4rem); line-height:1.02; }
.auth-presentation-copy p { color:#d2e4e0; font-size:1.05rem; line-height:1.65; }
.auth-service-state { position:relative; z-index:1; color:#d2e4e0; font-size:.78rem; }
.auth-service-state span { display:inline-block; width:9px; height:9px; margin-right:8px; background:#63d9ad; border-radius:50%; box-shadow:0 0 0 6px rgba(99,217,173,.10); }
.auth-form-panel { display:grid; place-items:center; padding:56px; }
.auth-form-wrap { width:min(410px,100%); }
.auth-form-wrap h2 { margin:12px 0 8px; font-size:2.25rem; letter-spacing:-.04em; }
.auth-form-wrap>p { margin-bottom:32px; color:var(--color-muted); }
.auth-form-wrap .form-label { font-weight:700; }
.auth-form-wrap .form-control { min-height:54px; padding:13px 16px; background:#f6f8fa; border-color:#dce4e8; border-radius:11px; }
.auth-form-wrap .form-control:focus { background:#fff; border-color:#0f766e; box-shadow:0 0 0 4px rgba(15,118,110,.12); }
.auth-submit { width:100%; min-height:54px; margin-top:8px; border-radius:11px; font-weight:750; box-shadow:0 10px 24px rgba(15,118,110,.18); }
.auth-footnote { margin-top:28px; color:#7b8797; text-align:center; font-size:.72rem; }
.auth-footnote i { margin-right:5px; color:#0f766e; }
@media (max-width:800px) { .auth-body{padding:16px}.auth-shell{grid-template-columns:1fr;min-height:0}.auth-presentation{min-height:240px;padding:32px}.auth-presentation-copy{margin:38px 0 10px}.auth-presentation-copy h1{font-size:2.1rem;margin:10px 0}.auth-presentation-copy p{font-size:.9rem}.auth-service-state{display:none}.auth-form-panel{padding:36px 28px} }