/* V2 keeps the original visual system and adds explicit scope and compact analysis. */
[hidden] { display:none !important; }
.scope-banner { display:flex; gap:18px; align-items:center; padding:20px 24px; margin:18px 0; background:#eaf3ed; border:1px solid #d2e2d6; border-left:5px solid #287966; border-radius:14px; }
.scope-content { min-width:0; flex:1; }
.scope-content h2 { font-size:23px; line-height:1.45; margin:5px 0 10px; color:#24473d; }
.scope-photo { width:88px; height:88px; object-fit:contain; border-radius:10px; background:white; flex:none; }
.scope-meta { display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.scope-coverage { font-size:12px; line-height:1.7; color:#5a7067; margin:12px 0 0; }
.view-tabs { display:flex; gap:6px; padding:6px; background:#e7ece8; border:1px solid #d8dfda; border-radius:12px; width:fit-content; flex-wrap:wrap; }
.view-tabs .button { border:0; background:transparent; box-shadow:none; font-weight:600; }
.view-tabs .button.active { background:#fff; color:#146757; box-shadow:0 2px 6px #223e2912; }
.panel-actions { flex-shrink:0; }
.section-head { flex-wrap:wrap; gap:12px; }
.section-head > div:first-child { flex:1; min-width:200px; }
.panel-expanded { position:fixed; inset:18px; z-index:70; overflow:auto; width:auto; max-height:calc(100vh - 36px); margin:0; background:white; grid-column:1/-1 !important; box-shadow:0 0 0 100vmax #14281d70,0 15px 50px #163a2735; }
.panel-expanded .section-head { position:sticky; top:0; z-index:5; background:white; }
.panel-expanded .section-body { min-height:280px; }
.panel-expanded .table-wrap { max-height:78vh; }
.table-wrap { max-height:580px; overflow:auto; overscroll-behavior:contain; }
.data-table thead th { position:sticky; top:0; background:#f4f7f4; z-index:2; white-space:nowrap; }
.data-table td { vertical-align:top; }
.data-table .sort-button { background:none; border:0; box-shadow:none; padding:0; color:inherit; font:inherit; justify-content:inherit; }
.data-table th.numeric .sort-button { margin-left:auto; }
.pagination { flex-wrap:wrap; gap:10px; margin:0; padding:10px 15px; border-top:1px solid #e2e8e3; border-bottom:1px solid #e2e8e3; background:#fbfcfa; }
.pagination .field { margin:0; display:flex; gap:7px; align-items:center; min-width:0; }
.pagination .field label { font-size:12px; margin:0; white-space:nowrap; }
.pagination select { width:80px; padding:6px 8px; min-height:32px; }
.page-jump { width:54px !important; padding:5px !important; min-height:30px !important; }
.pagination > .actions { flex-wrap:wrap; }
.table-component .data-table { width:100%; }
.cell-link { display:inline-flex; text-align:left; background:none; border:0; color:#166758; padding:0; box-shadow:none; font-weight:600; }
.cell-link:hover { text-decoration:underline; background:none; }
.hierarchy-style { border:1px solid #dfe7df; border-radius:10px; margin-bottom:10px; }
.hierarchy-panel > .section-body { max-height:400px; overflow:auto; }
.hierarchy-panel.panel-expanded > .section-body { max-height:calc(100vh - 150px); }
.hierarchy-style > summary,.hierarchy-color > summary { display:list-item; padding:14px 18px; cursor:pointer; background:#f5f8f4; }
.hierarchy-style > summary > div,.hierarchy-color > summary > div { display:inline-block; vertical-align:middle; }
.hierarchy-style > summary .badge { margin-left:14px; }
.hierarchy-children { padding:8px 12px 12px; }
.hierarchy-color { border-bottom:1px solid #e3e9e1; }
.hierarchy-color > summary { background:white; padding:12px; }
.hierarchy-color .actions { padding:10px; }
.hierarchy-color .table-wrap { max-height:420px; }
.chart-controls { display:flex; gap:16px; align-items:end; flex-wrap:wrap; margin-bottom:16px; }
.chart-controls .field { margin:0; }
.bar-label { display:block; text-align:left; white-space:normal; padding:0; color:#34574a; font-size:12px; line-height:1.45; background:none; border:0; box-shadow:none; }
.bar-row { grid-template-columns:minmax(120px,1.1fr) minmax(80px,2fr) minmax(125px,1fr); gap:12px; }
.bar-value { font-size:12px; white-space:nowrap; }
.series-picker { display:flex; gap:8px; flex-wrap:wrap; margin:14px 0; max-height:160px; overflow:auto; padding:8px; border:1px solid #e2e8df; border-radius:8px; }
.series-picker label { display:flex; gap:6px; align-items:center; padding:5px 8px; background:#f4f7f2; border-radius:5px; font-size:12px; cursor:pointer; }
.series-picker input,.checkbox-line input { width:16px; min-height:16px; margin:0; accent-color:#167262; }
.series-legend { display:flex; flex-wrap:wrap; gap:16px; font-size:12px; margin-top:16px; }
.series-legend span:before { content:''; display:inline-block; width:11px; height:11px; border-radius:3px; background:var(--series-color); margin-right:5px; }
.multi-trend { display:block; width:100%; min-width:600px; max-height:360px; }
.multi-trend text { font:11px system-ui,sans-serif; fill:#637268; }
.section-body:has(.multi-trend) { overflow-x:auto; }
.heat-cell { padding:10px 5px; border-radius:5px; min-width:64px; color:#173f33; font-variant-numeric:tabular-nums; }
.heat-cell small { display:block; color:#835c1e; font-size:10px; }
.partial-cell { outline:1px dashed #b99244; }
.missing-cell { color:#919d94; font-size:12px; white-space:nowrap; }
.checkbox-line { display:flex; gap:8px; align-items:center; margin-bottom:14px; font-size:13px; }
.week-actions { min-width:200px; max-width:280px; font-size:12px; white-space:normal; }
.week-actions > div + div { border-top:1px solid #e2e8df; padding-top:8px; margin-top:8px; }
.subheading { font-size:17px; color:#3b5748; margin:20px 0 12px; }
.overview-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; align-items:start; }
.overview-grid .section { min-width:0; }
.overview-grid .section-body { padding:16px; }
.overview-grid .kpis { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.overview-grid .kpi { padding:12px; min-height:100px; }
.overview-grid .kpi-value { font-size:25px; }
.currency-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
.currency-grid .kpis { grid-template-columns:repeat(3,minmax(0,1fr)); }
.currency-grid .kpi-value { font-size:20px; }
.insight-card { padding:12px 0; border-bottom:1px solid #e3e9df; }
.insight-card:last-child { border-bottom:0; }
.insight-card h3 { font-size:14px; margin:5px 0; }
.insight-card p { font-size:12px; line-height:1.65; margin:4px 0 10px; overflow-wrap:anywhere; }
.rank-row { display:flex; width:100%; align-items:center; gap:10px; border:0; border-radius:0; border-bottom:1px solid #e3e9df; padding:12px 0; text-align:left; background:white; color:#294c3f; }
.rank-row > div { flex:1; min-width:0; }
.rank-row .cell-main { white-space:normal; font-size:13px; }
.rank-row > strong { font-size:14px; text-align:right; flex:none; }
.rank-number { display:flex; align-items:center; justify-content:center; width:23px; height:23px; border-radius:6px; background:#edf3e8; color:#65824a; font-size:12px; flex:none; }
.template-help { border:1px solid #dbe4d7; border-radius:10px; padding:14px 18px; background:#fbfcf9; margin:14px 0; }
.template-help summary { cursor:pointer; color:#476843; }
.template-help p { font-size:13px; line-height:1.8; }
.template-help .button { margin:10px 8px 0 0; }
.style-card .cell-link { font-size:14px; }
.style-card .field { margin:8px 0 0; }
.style-card select { padding:5px 8px; min-height:32px; }
.kpis { grid-template-columns:repeat(3,minmax(0,1fr)); }
.filters { flex-wrap:wrap; }
.filters .field { max-width:360px; min-width:135px; }
.filters .field.wide { max-width:500px; }
.filters input[type=number] { max-width:120px; }
.button:focus-visible,summary:focus-visible { outline:3px solid #8cb7a7; outline-offset:3px; }
@media(min-width:1700px) { .kpis { grid-template-columns:repeat(6,minmax(0,1fr)); } }
@media(max-width:1250px) { .overview-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .overview-grid > .section:last-child { grid-column:1/-1; } .currency-grid { grid-template-columns:1fr; } }
@media(max-width:760px) { .scope-banner { padding:15px; gap:10px; } .scope-photo { width:56px; height:56px; } .scope-content h2 { font-size:18px; } .overview-grid { grid-template-columns:1fr; } .overview-grid > .section { grid-column:auto; } .kpis { grid-template-columns:repeat(2,minmax(0,1fr)); } .view-tabs { width:100%; } .view-tabs .button { flex:1; font-size:12px; padding:8px; } .section-head > div:first-child { min-width:0; } .bar-row { grid-template-columns:100px minmax(40px,1fr) 110px; } .panel-actions { width:100%; justify-content:flex-end; } }
