/* ============ Section styles (4): Executive dashboard ============ */
#executive{position:relative}
.exec-frame{
  margin-top:46px; background:var(--surface); border:1px solid var(--border-2);
  border-radius:18px; box-shadow:var(--sh-3); overflow:hidden;
}
.exec-chrome{display:flex; align-items:center; gap:8px; padding:12px 16px; border-bottom:1px solid var(--border); background:var(--surface-2)}
.exec-chrome .dots{display:flex; gap:7px} .exec-chrome .dots i{width:11px;height:11px;border-radius:50%;background:var(--border-2)}
.exec-url{margin-left:10px; flex:1; max-width:340px; height:28px; border-radius:8px; background:var(--surface-3); border:1px solid var(--border); display:flex; align-items:center; gap:7px; padding:0 11px; font-size:12px; color:var(--ink-3); font-family:var(--mono)}
.exec-body{padding:22px; background:var(--bg-2)}
@media(max-width:760px){ .exec-body{padding:14px} }

.exec-head{display:flex; align-items:flex-start; justify-content:space-between; gap:16px; margin-bottom:18px; flex-wrap:wrap}
.exec-head h3{font-size:22px; font-weight:700; letter-spacing:-.02em}
.exec-head .sub{font-size:13px; color:var(--ink-3); margin-top:4px; max-width:60ch}
.exec-tools{display:flex; align-items:center; gap:9px; flex-shrink:0}
.exec-pill{display:inline-flex; align-items:center; gap:8px; padding:8px 13px; border-radius:9px; background:var(--surface); border:1px solid var(--border-2); font-size:12.5px; font-weight:500; color:var(--ink-2); box-shadow:var(--sh-1)}

/* KPI row */
.kpi-row{display:grid; grid-template-columns:repeat(6,1fr); gap:11px; margin-bottom:13px}
@media(max-width:1100px){ .kpi-row{grid-template-columns:repeat(3,1fr)} }
@media(max-width:620px){ .kpi-row{grid-template-columns:repeat(2,1fr)} }
.kpi{background:var(--surface); border:1px solid var(--border); border-radius:13px; padding:14px; transition:.16s; cursor:default}
.kpi:hover{box-shadow:var(--sh-2); transform:translateY(-2px); border-color:var(--border-strong)}
.kpi .klab{display:flex; align-items:center; gap:7px; font-size:11.5px; color:var(--ink-3); font-weight:500; line-height:1.3}
.kpi .kico{width:22px;height:22px;border-radius:6px; background:var(--accent-soft); color:var(--accent-700); display:grid; place-items:center; flex-shrink:0}
.kpi .kval{font-size:23px; font-weight:700; letter-spacing:-.02em; margin:9px 0 7px; line-height:1; display:flex; align-items:baseline; gap:4px}
.kpi .kval .u{font-size:14px; color:var(--ink-3); font-weight:600}
.kpi .knote{font-size:11px; color:var(--ink-4)}
.kbar{height:5px; border-radius:3px; background:var(--surface-3); overflow:hidden; margin:8px 0 7px}
.kbar i{display:block; height:100%; background:var(--accent); border-radius:3px}

/* dashboard grid */
.dash{display:grid; grid-template-columns:1fr 1.45fr 1fr; gap:13px; margin-bottom:13px}
@media(max-width:1000px){ .dash{grid-template-columns:1fr} }
.dash2{display:grid; grid-template-columns:1.1fr 1.25fr 1fr; gap:13px; margin-bottom:13px}
@media(max-width:1000px){ .dash2{grid-template-columns:1fr} }
.dash3{display:grid; grid-template-columns:1fr 1fr 1fr; gap:13px}
@media(max-width:1000px){ .dash3{grid-template-columns:1fr 1fr} }
@media(max-width:760px){ .dash3{grid-template-columns:1fr} }

.panel{background:var(--surface); border:1px solid var(--border); border-radius:13px; padding:16px}
.panel-h{display:flex; align-items:center; gap:8px; margin-bottom:14px}
.panel-h .ph-ico{width:24px;height:24px;border-radius:7px; display:grid; place-items:center; background:var(--accent-soft); color:var(--accent-700)}
.panel-h .ph-t{font-size:14px; font-weight:600; letter-spacing:-.01em}
.panel-h .ph-x{margin-left:auto; font-size:11px; color:var(--ink-4); font-family:var(--mono)}

/* scorecard */
.score-row{display:flex; align-items:center; gap:10px; padding:7.5px 0; border-bottom:1px solid var(--border)}
.score-row:last-child{border-bottom:0}
.score-row .sn{width:18px; font-size:11px; color:var(--ink-4); font-family:var(--mono); flex-shrink:0}
.score-row .sk{font-size:13px; color:var(--ink-2); flex:1}
.score-row .sv{font-size:13.5px; font-weight:700; letter-spacing:-.01em; font-variant-numeric:tabular-nums}
.score-row .sa{width:16px; text-align:center; flex-shrink:0}

/* AI vs operators */
.aivs-head{display:flex; align-items:center; justify-content:space-between; margin-bottom:6px}
.aivs-leg{display:flex; gap:13px; font-size:11.5px; color:var(--ink-3)}
.aivs-leg span{display:inline-flex; align-items:center; gap:5px}
.aivs-leg i{width:8px;height:8px;border-radius:50%}
.aivs-row{display:grid; grid-template-columns:1.5fr .7fr .7fr 1.1fr; gap:8px; align-items:center; padding:8px 0; border-bottom:1px solid var(--border)}
.aivs-row:last-child{border-bottom:0}
.aivs-row .mk{font-size:12.5px; color:var(--ink-2)}
.aivs-row .mv{font-size:13px; font-weight:600; text-align:right; font-variant-numeric:tabular-nums}
.aivs-row .mv.op{color:var(--ink-3); font-weight:500}
.aivs-adv{display:flex; align-items:center; gap:7px; justify-content:flex-end}
.aivs-track{flex:1; height:6px; border-radius:3px; background:var(--surface-3); overflow:hidden; max-width:60px}
.aivs-track i{display:block; height:100%; background:var(--accent); border-radius:3px}
.aivs-pct{font-size:12px; font-weight:600; width:46px; text-align:right; font-variant-numeric:tabular-nums}
.aivs-note{margin-top:12px; padding:11px 13px; border-radius:10px; background:var(--accent-soft); border:1px solid var(--accent-line); font-size:12.5px; color:var(--accent-700); line-height:1.45; display:flex; gap:9px; align-items:flex-start}

/* funnel */
.fn-row{display:flex; align-items:center; gap:11px; padding:10px 12px; border-radius:10px; margin-bottom:7px; border:1px solid var(--border)}
.fn-ico{width:30px;height:30px;border-radius:8px; display:grid; place-items:center; flex-shrink:0; color:#fff}
.fn-k{font-size:13px; font-weight:600}
.fn-n{font-size:11px; color:var(--ink-3); font-family:var(--mono)}
.fn-money{margin-left:auto; text-align:right}
.fn-money .m{font-size:13px; font-weight:700; font-variant-numeric:tabular-nums}
.fn-money .p{font-size:11px; color:var(--ink-3)}
.fn-conv{display:flex; align-items:center; justify-content:space-between; margin-top:10px; padding-top:12px; border-top:1px solid var(--border); font-size:13px; font-weight:600}
.fn-conv .big{font-size:18px; color:var(--success); font-weight:700}

/* small tables */
.mini-tab{width:100%; border-collapse:collapse; font-size:12px}
.mini-tab th{text-align:left; font-size:10.5px; font-weight:600; color:var(--ink-4); text-transform:uppercase; letter-spacing:.04em; padding:0 8px 9px 0; font-family:var(--mono)}
.mini-tab td{padding:8px 8px 8px 0; border-top:1px solid var(--border); color:var(--ink-2); vertical-align:middle}
.mini-tab td.num{text-align:right; font-variant-numeric:tabular-nums; font-weight:600; color:var(--ink)}
.mini-tab .src{display:flex; align-items:center; gap:8px; font-weight:600; color:var(--ink)}
.src-glyph{width:22px;height:22px;border-radius:6px; display:grid; place-items:center; background:var(--surface-3); border:1px solid var(--border); font-size:12px; flex-shrink:0}
.mini-tab tr.total td{border-top:1.5px solid var(--border-2); font-weight:700; color:var(--ink)}

/* VIP / VOC */
.vip-row{display:flex; align-items:center; gap:10px; padding:9px 0; border-bottom:1px solid var(--border)}
.vip-row:last-child{border-bottom:0}
.vip-av{width:32px;height:32px;border-radius:9px; display:grid; place-items:center; font-size:11px; font-weight:700; font-family:var(--mono); color:#fff; flex-shrink:0; background:linear-gradient(150deg,var(--accent),var(--accent-700))}
.vip-name{font-size:12.5px; font-weight:600; line-height:1.2}
.vip-risk{font-size:11px; margin-top:2px}
.vip-pot{margin-left:auto; text-align:right; flex-shrink:0}
.vip-pot .pp{font-size:12.5px; font-weight:700; font-variant-numeric:tabular-nums}
.vip-pot .pa{font-size:10px; color:var(--ink-4)}
.voc-row{display:flex; align-items:center; gap:10px; padding:8.5px 0; border-bottom:1px solid var(--border)}
.voc-row:last-child{border-bottom:0}
.voc-k{font-size:12.5px; color:var(--ink-2); flex:1}
.voc-bar{width:70px; height:6px; border-radius:3px; background:var(--surface-3); overflow:hidden}
.voc-bar i{display:block; height:100%; background:var(--accent); opacity:.55; border-radius:3px}
.voc-share{font-size:12px; font-weight:600; width:34px; text-align:right; font-variant-numeric:tabular-nums}

/* ---------- InfoTip popover ---------- */
.infotip-wrap{position:relative; display:inline-flex; vertical-align:middle}
.infotip-btn{width:17px;height:17px;border-radius:50%; border:1px solid var(--border-2); background:var(--surface); color:var(--ink-3); display:grid; place-items:center; cursor:help; padding:0; transition:.14s; flex-shrink:0}
.infotip-btn:hover{border-color:var(--accent-line); color:var(--accent-700); background:var(--accent-soft)}
.infotip{position:absolute; z-index:60; width:236px; background:var(--ink); color:#fff; border-radius:11px; padding:13px 14px; box-shadow:0 14px 40px rgba(20,27,41,.26); display:flex; flex-direction:column; gap:7px; animation:fadeUp .16s ease; text-align:left; cursor:default; font-weight:400}
.infotip.pop-bottom{top:calc(100% + 9px); left:50%; transform:translateX(-50%)}
.infotip.pop-right{left:calc(100% + 9px); top:50%; transform:translateY(-50%)}
.infotip::after{content:""; position:absolute; width:10px;height:10px; background:var(--ink); transform:rotate(45deg)}
.infotip.pop-bottom::after{top:-4px; left:50%; margin-left:-5px}
.infotip.pop-right::after{left:-4px; top:50%; margin-top:-5px}
.infotip .it-title{font-size:13px; font-weight:700; letter-spacing:-.01em}
.infotip .it-what{font-size:12.5px; line-height:1.5; color:rgba(255,255,255,.82)}
.infotip .it-how{font-size:11.5px; line-height:1.45; color:#fff; font-family:var(--mono); background:rgba(255,255,255,.1); border-radius:8px; padding:8px 10px; display:flex; flex-direction:column; gap:3px}
.infotip .it-how-l{font-size:9.5px; letter-spacing:.08em; text-transform:uppercase; color:rgba(255,255,255,.5); font-weight:600}
.kpi .infotip-wrap{margin-left:auto}

/* ---------- Radar / spider chart ---------- */
.radar-box{display:flex; flex-direction:column; align-items:center; padding-top:4px}
.radar-svg{width:100%; max-width:248px; height:auto; overflow:visible}
.radar-ring{fill:none; stroke:var(--border-2); stroke-width:1}
.radar-ring:last-of-type{stroke:var(--border-strong)}
.radar-axis{stroke:var(--border-2); stroke-width:1}
.radar-area{fill:color-mix(in srgb,var(--accent) 16%,transparent); stroke:var(--accent); stroke-width:2.5; stroke-linejoin:round; transition:.2s}
.radar-dot{fill:var(--accent); stroke:#fff; stroke-width:2; cursor:pointer; transition:.14s}
.radar-label{font-size:11px; font-weight:600; fill:var(--ink-3); font-family:var(--font); transition:.14s}
.radar-label.on{fill:var(--accent-700)}
.radar-read{display:flex; flex-direction:column; align-items:center; text-align:center; margin-top:8px; min-height:74px; justify-content:center}
.radar-read .rr-v{font-size:26px; font-weight:800; letter-spacing:-.02em; color:var(--accent-700); line-height:1; font-variant-numeric:tabular-nums}
.radar-read .rr-v .rr-u{font-size:13px; font-weight:600; color:var(--ink-4); margin-left:2px}
.radar-read .rr-k{font-size:12.5px; font-weight:600; color:var(--ink); margin-top:5px}
.radar-read .rr-i{font-size:11.5px; color:var(--ink-3); line-height:1.4; margin-top:3px; max-width:30ch}

/* highlight glow on the exec section */
.exec-glow{position:absolute; inset:0; z-index:-1; pointer-events:none;
  background:radial-gradient(700px 360px at 50% -4%, color-mix(in srgb,var(--accent) 7%,transparent), transparent 70%)}

/* ---------- BASIC (Без Jay) dashboard ---------- */
.bd-metrics{display:grid; grid-template-columns:repeat(4,1fr); gap:11px; margin-bottom:13px}
@media(max-width:760px){ .bd-metrics{grid-template-columns:repeat(2,1fr)} }
.bd-metric{background:var(--surface); border:1px solid var(--border); border-radius:13px; padding:15px}
.bd-metric .bl{font-size:11.5px; color:var(--ink-3); font-weight:500; display:flex; align-items:center; gap:7px}
.bd-metric .bl .bi{width:22px;height:22px;border-radius:6px; background:var(--surface-3); color:var(--ink-3); display:grid; place-items:center; flex-shrink:0}
.bd-metric .bv{font-size:23px; font-weight:700; letter-spacing:-.02em; margin-top:10px; line-height:1; color:var(--ink-2); font-variant-numeric:tabular-nums}
.bd-metric .bn{font-size:11px; color:var(--ink-4); margin-top:7px; font-family:var(--mono)}
.bd-split{display:grid; grid-template-columns:1.35fr 1fr; gap:13px}
@media(max-width:860px){ .bd-split{grid-template-columns:1fr} }
.bd-log{width:100%; border-collapse:collapse; font-size:12.5px}
.bd-log th{text-align:left; font-size:10.5px; font-weight:600; color:var(--ink-4); text-transform:uppercase; letter-spacing:.04em; padding:0 10px 10px 0; font-family:var(--mono)}
.bd-log td{padding:9px 10px 9px 0; border-top:1px solid var(--border); color:var(--ink-3); white-space:nowrap}
.bd-log td.num{font-variant-numeric:tabular-nums}
.bd-log td .nm{color:var(--ink-2); font-weight:500; font-family:var(--mono)}
.bd-stat{display:inline-flex; align-items:center; gap:6px; font-weight:600; font-size:12px}
.bd-stat.done{color:var(--ink-3)} .bd-stat.miss{color:var(--risk)}
.bd-blank{background:var(--surface); border:1px dashed var(--border-2); border-radius:13px; padding:6px 16px}
.bd-blank-h{display:flex; align-items:center; gap:8px; padding:13px 0 11px; font-size:13px; font-weight:600; color:var(--ink-2); border-bottom:1px solid var(--border)}
.bd-q{display:flex; align-items:center; gap:11px; padding:12px 0; border-bottom:1px dashed var(--border)}
.bd-q:last-child{border-bottom:0}
.bd-q .ql{width:26px;height:26px;border-radius:7px; background:var(--surface-3); color:var(--ink-4); display:grid; place-items:center; flex-shrink:0}
.bd-q .qq{font-size:13px; color:var(--ink-2); flex:1; line-height:1.3}
.bd-q .qa{font-family:var(--mono); font-size:11px; color:var(--ink-4); flex-shrink:0; display:inline-flex; align-items:center; gap:5px}
.bd-watermark{display:inline-flex; align-items:center; gap:7px; font-size:12px; color:var(--ink-4); font-weight:500}
