/* ============================================================================
   CellScope Pro — skin v7 "Studio"  (2026-06-12)
   The definitive professional white workspace. Loads after v2–v6 and settles
   every visual argument with one coherent design system:
     chrome #f8fafc · surface #fff · hairline #e2e8f0 · ink #0f172a
     accent indigo #4f46e5 · ok #059669 · warn #d97706 · bad #dc2626
   Desktop-software density: 13px base, 26px rows, 30px toolbar buttons.
   ========================================================================== */

:root{
  --v7-bg:#f8fafc; --v7-surface:#ffffff; --v7-line:#e2e8f0; --v7-line-2:#cbd5e1;
  --v7-ink:#0f172a; --v7-ink-2:#334155; --v7-mut:#64748b; --v7-faint:#94a3b8;
  --v7-acc:#4f46e5; --v7-acc-soft:#eef2ff; --v7-acc-line:#c7d2fe;
  --v7-ok:#059669; --v7-warn:#d97706; --v7-bad:#dc2626;
  --v7-r:8px; --v7-r-lg:14px;
  --v7-sh-sm:0 1px 2px rgba(15,23,42,.05);
  --v7-sh:0 4px 16px rgba(15,23,42,.08),0 1px 3px rgba(15,23,42,.05);
  --v7-sh-lg:0 24px 60px rgba(15,23,42,.18);
  --v7-font:'Inter','Segoe UI',system-ui,-apple-system,sans-serif;
  --v7-mono:'JetBrains Mono','Cascadia Code','Consolas',monospace;
}

/* ---------- global reset of legacy skin noise ---------- */
body, .app{font-family:var(--v7-font)!important;font-size:13px;color:var(--v7-ink);background:var(--v7-bg)!important;}
.app{--panel-bg:#fff;}
*::-webkit-scrollbar{width:9px;height:9px}
*::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:8px;border:2px solid #fff}
*::-webkit-scrollbar-thumb:hover{background:#94a3b8}
*::-webkit-scrollbar-track{background:transparent}
:focus-visible{outline:2px solid var(--v7-acc);outline-offset:1px;border-radius:4px}

/* ---------- title / brand bar ---------- */
.brand-bar{background:#fff!important;border-bottom:1px solid var(--v7-line)!important;height:40px!important;box-shadow:none!important;}
.brand-bar *{font-family:var(--v7-font)!important}

/* ---------- menubar ---------- */
.menubar{background:#fff!important;border-bottom:1px solid var(--v7-line)!important;}
.menu-item{font-size:12.5px!important;font-weight:600!important;color:var(--v7-ink-2)!important;padding:5px 11px!important;border-radius:6px!important;transition:.15s}
.menu-item:hover{background:var(--v7-acc-soft)!important;color:var(--v7-acc)!important}
.menu-dropdown{background:#fff!important;border:1px solid var(--v7-line)!important;border-radius:10px!important;box-shadow:var(--v7-sh-lg)!important;padding:5px!important;}
.menu-dropdown-item{font-size:12.5px!important;border-radius:6px!important;padding:7px 11px!important;color:var(--v7-ink-2)!important}
.menu-dropdown-item:hover{background:var(--v7-acc-soft)!important;color:var(--v7-acc)!important}
.menu-sep{background:var(--v7-line)!important;margin:5px 8px!important}
.shortcut{color:var(--v7-faint)!important;font-family:var(--v7-mono)!important;font-size:10.5px!important}

/* ---------- toolbar → ribbon ---------- */
.toolbar{background:#fff!important;border-bottom:1px solid var(--v7-line)!important;padding:5px 10px 7px!important;gap:2px!important;box-shadow:none!important}
.tb-group{border:none!important;background:transparent!important;padding:0 10px!important;position:relative;display:flex;align-items:center;gap:2px}
.tb-group:not(:last-child)::after{content:'';position:absolute;right:0;top:15%;height:70%;width:1px;background:var(--v7-line)}
/* ribbon group caption injected by skin-v7.js */
.tb-group[data-v7label]{padding-bottom:13px!important}
.tb-group[data-v7label]::before{content:attr(data-v7label);position:absolute;left:10px;right:10px;bottom:0;text-align:center;font-size:8.5px;font-weight:700;letter-spacing:.8px;text-transform:uppercase;color:var(--v7-faint);pointer-events:none}
.tb-btn{background:transparent!important;border:1px solid transparent!important;border-radius:7px!important;padding:5px 9px!important;height:30px!important;font-size:12px!important;font-weight:600!important;color:var(--v7-ink-2)!important;box-shadow:none!important;transition:.14s!important;display:inline-flex!important;align-items:center;gap:6px}
.tb-btn i{font-size:12.5px!important}
.tb-btn:hover{background:#f1f5f9!important;border-color:var(--v7-line)!important;color:var(--v7-ink)!important;transform:none!important}
.tb-btn.active{background:var(--v7-acc-soft)!important;border-color:var(--v7-acc-line)!important;color:var(--v7-acc)!important}
.tb-btn.active i{color:var(--v7-acc)!important}
.tb-btn-label{font-size:11.5px!important;font-weight:600!important}
.tb-dropdown-panel{background:#fff!important;border:1px solid var(--v7-line)!important;border-radius:10px!important;box-shadow:var(--v7-sh-lg)!important}
.tb-dd-item{font-size:12.5px!important;border-radius:6px!important}
.tb-dd-item:hover{background:var(--v7-acc-soft)!important}

/* primary action buttons keep weight, but flat-modern */
.toolbar button[title*="Open Operator Project"],
.toolbar .tb-btn.csp-primary{background:var(--v7-acc)!important;border-color:var(--v7-acc)!important;color:#fff!important;box-shadow:var(--v7-sh-sm)!important}
.toolbar button[title*="Open Operator Project"]:hover{background:#4338ca!important}

/* ---------- left panel (network tree) ---------- */
.left-panel{background:#fff!important;border-right:1px solid var(--v7-line)!important;box-shadow:none!important}
.left-panel input[type="text"]{background:var(--v7-bg)!important;border:1px solid var(--v7-line)!important;border-radius:8px!important;font-size:12.5px!important;padding:6px 10px!important}
.left-panel input[type="text"]:focus{border-color:var(--v7-acc-line)!important;background:#fff!important}
.tree-row{border-radius:7px!important;min-height:26px!important;padding-top:2px!important;padding-bottom:2px!important;margin:1px 6px!important;transition:background .12s!important;position:relative}
.tree-row:hover{background:#f1f5f9!important}
.tree-row.selected{background:var(--v7-acc-soft)!important;box-shadow:inset 2.5px 0 0 var(--v7-acc)!important}
.tree-row.selected .tree-label{color:var(--v7-acc)!important;font-weight:700!important}
.tree-label{font-size:12.5px!important;color:var(--v7-ink-2)!important;font-weight:500!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.tree-toggle{width:20px!important;height:20px!important;display:inline-flex!important;align-items:center;justify-content:center;border-radius:5px!important;color:var(--v7-faint)!important;cursor:pointer}
.tree-toggle:hover{background:#e2e8f0!important;color:var(--v7-ink)!important}
.tree-icon{box-shadow:none!important;width:18px!important;height:18px!important;font-size:10px!important}
.tree-badge{font-size:9px!important;font-weight:700!important;border-radius:5px!important;padding:1.5px 6px!important;letter-spacing:.3px}
.tree-cb{accent-color:var(--v7-acc)!important;width:13px!important;height:13px!important}
.folder-row{font-weight:700!important;color:var(--v7-ink)!important;font-size:12px!important}
.panel-tabs,.panel-tabs-bottom{background:#fff!important;border-top:1px solid var(--v7-line)!important}
.panel-btab{font-size:10.5px!important;font-weight:700!important;color:var(--v7-mut)!important;border-radius:7px!important}
.panel-btab.active,.panel-btab[data-active="true"]{background:var(--v7-acc-soft)!important;color:var(--v7-acc)!important}

/* layer-group strip below tree */
.layer-strip{background:#fff!important;border-top:1px solid var(--v7-line)!important}
.layer-strip-btn{border-radius:7px!important;font-size:11.5px!important}

/* ---------- right dock (properties / inspector) ---------- */
.dock-panel{background:#fff!important;border-left:1px solid var(--v7-line)!important;box-shadow:none!important}
.dock-panel-title{background:#fff!important;border-bottom:1px solid var(--v7-line)!important;font-size:12px!important;font-weight:800!important;letter-spacing:.6px;color:var(--v7-ink)!important;text-transform:uppercase}
.dock-panel-body{background:#fff!important}
.prop-grid{font-size:12.5px!important}
.prop-grid-header{background:var(--v7-bg)!important;border-radius:7px!important;font-weight:700!important;color:var(--v7-ink)!important}
.prop-grid input,.prop-grid select{background:#fff!important;border:1px solid var(--v7-line)!important;border-radius:7px!important;font-size:12.5px!important;padding:4px 8px!important;color:var(--v7-ink)!important}
.prop-grid input:focus,.prop-grid select:focus{border-color:var(--v7-acc)!important;box-shadow:0 0 0 3px rgba(79,70,229,.12)!important}
.empty-state{color:var(--v7-mut)!important}

/* ---------- map area ---------- */
.map-area{background:#eef1f5!important}
#map{background:#eef1f5!important}
/* calmer cartography: soften the saturated voyager palette */
.leaflet-tile-pane{filter:saturate(.82) contrast(1.01) brightness(1.015)}
.leaflet-control-zoom a{background:#fff!important;color:var(--v7-ink-2)!important;border:1px solid var(--v7-line)!important;width:30px!important;height:30px!important;line-height:28px!important;font-size:15px!important;border-radius:8px!important;margin-bottom:4px;box-shadow:var(--v7-sh-sm)!important}
.leaflet-control-zoom a:hover{background:var(--v7-acc-soft)!important;color:var(--v7-acc)!important;border-color:var(--v7-acc-line)!important}
.leaflet-bar{border:none!important;box-shadow:none!important}
.leaflet-control-scale-line{background:rgba(255,255,255,.85)!important;border:1px solid var(--v7-line-2)!important;border-top:none!important;color:var(--v7-ink-2)!important;font-size:10px!important;border-radius:0 0 6px 6px}
.leaflet-popup-content-wrapper{border-radius:12px!important;box-shadow:var(--v7-sh-lg)!important;border:1px solid var(--v7-line)}
.leaflet-tooltip{border-radius:7px!important;border:1px solid var(--v7-line)!important;box-shadow:var(--v7-sh)!important;font-family:var(--v7-font)!important;font-size:11px!important}
.cell-pci-label{font-family:var(--v7-mono)!important;font-size:9.5px!important;text-shadow:0 1px 2px #fff,0 -1px 2px #fff,1px 0 2px #fff,-1px 0 2px #fff}
.map-info-bar{background:rgba(255,255,255,.92)!important;backdrop-filter:blur(8px);border:1px solid var(--v7-line)!important;border-radius:9px!important;box-shadow:var(--v7-sh-sm)!important;font-size:11px!important;color:var(--v7-ink-2)!important}
.legend{background:rgba(255,255,255,.95)!important;border:1px solid var(--v7-line)!important;border-radius:12px!important;box-shadow:var(--v7-sh)!important}
.legend-title{font-size:11px!important;font-weight:800!important;color:var(--v7-ink)!important}
.cov-opacity-ctrl{background:rgba(255,255,255,.95)!important;border:1px solid var(--v7-line)!important;border-radius:9px!important;box-shadow:var(--v7-sh-sm)!important}

/* ---------- status bar ---------- */
.statusbar,.footer{background:#fff!important;border-top:1px solid var(--v7-line)!important;color:var(--v7-mut)!important;font-size:11.5px!important;font-family:var(--v7-font)!important;height:26px!important}
.statusbar .mono,.footer .mono{font-family:var(--v7-mono)!important;font-size:11px!important}
.status-section{border-right:1px solid var(--v7-line)!important;padding:0 12px!important;display:inline-flex;align-items:center;gap:6px}

/* ---------- dialogs ---------- */
.dialog-overlay{background:rgba(15,23,42,.45)!important;backdrop-filter:blur(3px)}
.dialog,.dialog-panel,.pw-dialog{border-radius:var(--v7-r-lg)!important;border:1px solid var(--v7-line)!important;box-shadow:var(--v7-sh-lg)!important;overflow:hidden}
.dialog-titlebar,.dialog-header,.pw-header{background:#fff!important;color:var(--v7-ink)!important;border-bottom:1px solid var(--v7-line)!important;position:relative}
.dialog-titlebar::before,.dialog-header::before,.pw-header::before{content:'';position:absolute;left:0;top:0;right:0;height:3px;background:linear-gradient(90deg,#4f46e5,#7c3aed,#0891b2)}
.dialog-titlebar *,.dialog-header *{color:var(--v7-ink)!important}
.dialog-titlebar i,.dialog-header i{color:var(--v7-acc)!important}
.dialog-titlebar button,.dialog-header button{background:var(--v7-bg)!important;color:var(--v7-mut)!important;border:1px solid var(--v7-line)!important}
.dialog-titlebar button:hover{background:#fee2e2!important;color:#dc2626!important;border-color:#fecaca!important}
.dialog-body,.pw-body{background:#fff!important}
.dialog-footer,.pw-footer{background:var(--v7-bg)!important;border-top:1px solid var(--v7-line)!important}
.dialog-btn{border-radius:8px!important;font-size:12.5px!important;font-weight:600!important;border:1px solid var(--v7-line-2)!important;background:#fff!important;color:var(--v7-ink-2)!important;box-shadow:none!important}
.dialog-btn:hover{background:var(--v7-bg)!important;border-color:var(--v7-faint)!important;transform:none!important}
.dialog-btn.primary{background:var(--v7-acc)!important;border-color:var(--v7-acc)!important;color:#fff!important}
.dialog-btn.primary:hover{background:#4338ca!important}
.dlg-input,.dlg-select{background:#fff!important;border:1px solid var(--v7-line)!important;border-radius:8px!important;font-size:12.5px!important}
.dlg-input:focus,.dlg-select:focus{border-color:var(--v7-acc)!important;box-shadow:0 0 0 3px rgba(79,70,229,.12)!important}
.dlg-label{color:var(--v7-mut)!important;font-size:11px!important;font-weight:700!important;letter-spacing:.4px}
.dlg-fieldset{border:1px solid var(--v7-line)!important;border-radius:10px!important;background:var(--v7-bg)!important}
.kpi-card,.dash-card,.cap-card,.lb-result-card{border:1px solid var(--v7-line)!important;border-radius:10px!important;box-shadow:var(--v7-sh-sm)!important;background:#fff!important}
.data-table th{background:var(--v7-bg)!important;color:var(--v7-ink)!important;font-size:11px!important;letter-spacing:.4px}
.data-table td{font-size:12px!important;border-color:var(--v7-line)!important}
.progress-overlay{background:rgba(255,255,255,.86)!important;backdrop-filter:blur(4px)}
.progress-bar{border-radius:99px!important;background:var(--v7-line)!important}
.progress-fill{border-radius:99px!important;background:linear-gradient(90deg,#4f46e5,#7c3aed)!important}

/* context menu */
.ctx-menu{background:#fff!important;border:1px solid var(--v7-line)!important;border-radius:10px!important;box-shadow:var(--v7-sh-lg)!important;padding:5px!important}
.ctx-item{border-radius:6px!important;font-size:12.5px!important}
.ctx-item:hover{background:var(--v7-acc-soft)!important;color:var(--v7-acc)!important}

/* ---------- declutter: legacy artifacts (also force-removed by v7.js) ---------- */
#csp-skin-loader,[data-csp-modern-nudge],.csp-skin-nudge{display:none!important}

/* bottom analysis panel */
.bottom-panel{background:#fff!important;border-top:1px solid var(--v7-line)!important}
.bottom-tab{font-size:11.5px!important;font-weight:600!important;border-radius:7px 7px 0 0!important}

/* float dashboard + copilot */
.float-dashboard,.copilot-panel,.compare-panel,.hist-panel,.lb-panel,.profile-panel,.cap-panel{background:#fff!important;border:1px solid var(--v7-line)!important;border-radius:12px!important;box-shadow:var(--v7-sh-lg)!important}

/* toasts (generic) */
[class*="toast"]{font-family:var(--v7-font)!important;border-radius:10px!important}

/* ---------- responsive ---------- */
@media (max-width:1100px){
  .tb-btn-label{display:none!important}
  .tb-group[data-v7label]::before{display:none}
  .tb-group{padding:0 4px!important}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}
}

/* tree panel: breathe a little wider so cell names read */
.left-panel{min-width:248px}
