/* LEVL Back Office: dashboard styles and small overrides on top of styles.css */
.hq{text-transform:uppercase}
.sec>h3{flex-wrap:wrap}
.sec>h3 .pill{letter-spacing:.006em;text-transform:none;white-space:normal;height:auto;min-height:28px}
@media (max-width:860px){.tabs button[data-v=links]{display:none}}
/* dashboard */
.card{background:var(--panel);border:1px solid var(--hair2);border-radius:var(--r);padding:20px;min-width:0;text-align:left;display:block;width:100%}
.card h3{letter-spacing:.12em}
.cardhead{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.cardsub{color:var(--soft);font-size:16px;margin:6px 0 0}
.need{font-size:16px;margin:12px 0 0;padding-top:12px;border-top:1px solid var(--hair)}
.need b{font-weight:500}
.kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:16px 0}
.kl{font-size:15px;font-weight:500;letter-spacing:.12em;text-transform:uppercase}
.kvn{font-size:44px;font-weight:200;line-height:1.1;letter-spacing:-.02em;margin:10px 0 8px;word-spacing:.04em}
.kpi .kvn{white-space:nowrap;letter-spacing:.012em}
.kvn .txt{font-size:.62em;white-space:normal;letter-spacing:0;display:inline-block;line-height:1.2;padding:.3em 0}
.kv dd,.onyou .kvn{letter-spacing:.012em}
.dl{display:block;font-size:16px;color:var(--soft)}
.onyou{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;cursor:pointer}
.onyou:hover{border-color:#fff}
.onyou .kvn{margin:6px 0 0;font-size:34px}
.oy{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.oy .tag{height:auto;min-height:28px;white-space:normal;padding:4px 10px}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.kv{display:grid;grid-template-columns:1fr 1fr;gap:14px 12px;margin:16px 0 0}
.kv dt{font-size:15px;color:var(--soft)}
.kv dd{margin:2px 0 0;font-size:26px;font-weight:300}
.chartcard{margin-top:0}
.chartbox{position:relative;margin-top:16px}
.chartbox svg{display:block;width:100%;overflow:visible}
.chartbox .ax{fill:rgba(255,255,255,.86);font-size:15px;font-family:inherit}
.chartbox .hit:hover{fill:rgba(255,255,255,.07)}
.tip{position:absolute;pointer-events:none;background:#fff;color:#000;border-radius:10px;padding:10px 12px;font-size:15px;line-height:1.4;white-space:nowrap;z-index:5;box-shadow:0 6px 24px rgba(0,0,0,.5)}
.tip b{display:block;font-weight:500}.tip span{display:block}
.tip i,.legend i{display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:6px}
.legend{display:flex;gap:16px;flex-wrap:wrap;margin-top:12px;font-size:15px}
.bars{margin-top:16px;display:flex;flex-direction:column;gap:14px}
.bl{display:flex;justify-content:space-between;gap:12px;font-size:16px;margin-bottom:6px}
.bt{height:10px;background:rgba(255,255,255,.1);border-radius:0 4px 4px 0}
.bt i{display:block;height:100%;background:#fff;border-radius:0 4px 4px 0}
.tblwrap{overflow-x:auto;margin-top:14px;max-height:420px;overflow-y:auto}
.tbl{width:100%;border-collapse:collapse;font-size:16px}
.tbl th,.tbl td{text-align:right;padding:10px 12px;border-bottom:1px solid var(--hair);white-space:nowrap}
.tbl th:first-child,.tbl td:first-child{text-align:left;white-space:normal;min-width:160px}
.tbl thead th{font-size:15px;font-weight:500;position:sticky;top:0;background:var(--panel)}
.tbl tbody th{font-weight:400}
@media (max-width:1100px){.grid3{grid-template-columns:1fr 1fr}.kpis{grid-template-columns:1fr 1fr}}
@media (max-width:860px){.grid3{grid-template-columns:1fr}.kpis{gap:10px}.kvn{font-size:32px}.card{padding:16px}.onyou .btn{display:none}}
.kvn,.kpi .kvn{font-weight:300;letter-spacing:.02em}
.kvn small{font-size:.55em;font-weight:400;letter-spacing:.04em;margin-left:.1em}
/* command center */
.hero{display:grid;grid-template-columns:1fr 42%;border:1px solid var(--hair2);border-radius:var(--r);overflow:hidden;margin-bottom:18px;background:var(--panel);min-height:260px}
.hero.nophoto{grid-template-columns:1fr}
.hero .hl{padding:32px;display:flex;flex-direction:column;justify-content:center;min-width:0}
.hero h1{font-size:52px;margin-top:12px}
.hero .hp{position:relative;min-height:220px;border-left:1px solid var(--hair2)}
.hero .hp img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.tabsrow{position:sticky;top:0;z-index:10;background:var(--bg);padding:12px 0;margin:0 0 6px;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}
.tabsrow .chip{flex:none}
.kvrow{display:flex;align-items:flex-end;justify-content:space-between;gap:10px}
.spark{width:120px;height:34px;flex:none;margin-bottom:12px}
.attn{margin-bottom:0}
.alist{list-style:none;margin:14px 0 0;padding:0}
.alist li{display:grid;grid-template-columns:86px 1fr auto;gap:14px;align-items:center;padding:14px 0;border-top:1px solid var(--hair)}
.alist .ab{min-width:0}.alist .ab b{display:block;font-weight:500;font-size:18px;line-height:1.3}.alist .ab span{display:block;color:var(--soft);font-size:16px;margin-top:3px}
.alist .aa{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.lv{display:inline-flex;align-items:center;justify-content:center;height:28px;border-radius:8px;font-size:15px;font-weight:500;border:1px solid var(--hair2)}
.lv-High{background:var(--mag);border-color:var(--mag);color:#fff}.lv-Medium{background:var(--amber);border-color:var(--amber);color:#000}
button.card.chan{cursor:pointer;color:inherit;font:inherit}
button.card.chan:hover{border-color:#fff}
.will{margin:12px 0 0;padding:0 0 0 20px;font-size:16px;color:var(--soft)}.will li{margin:4px 0}
.plain{list-style:none;margin:14px 0 0;padding:0}.plain li{display:flex;flex-wrap:wrap;gap:4px 12px;justify-content:space-between;padding:10px 0;border-top:1px solid var(--hair);font-size:16px}.plain li b{font-weight:500;flex:1 1 100%}.plain li span{color:var(--soft)}
.rank{display:inline-grid;place-items:center;width:26px;height:26px;border-radius:50%;border:1px solid var(--hair2);font-size:15px;margin-right:10px}
.tbl a{text-underline-offset:3px}
.bkhero{display:flex;align-items:center;gap:28px;flex-wrap:wrap;border:1px solid var(--hair2);border-radius:var(--r);padding:28px;background:#000;margin-bottom:18px}
.bklogo{width:220px;flex:none}.bklogo svg{display:block;width:100%;height:auto}
.bkbtns{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
@media (max-width:860px){.hero{grid-template-columns:1fr;min-height:0}.hero .hp{order:-1;min-height:170px;border-left:0;border-bottom:1px solid var(--hair2)}.hero .hl{padding:20px 16px}.hero h1{font-size:34px}.tabsrow{margin:0 -16px 6px;padding:10px 16px}.alist li{grid-template-columns:1fr;gap:8px}.alist .lv{width:86px}.alist .aa{justify-content:flex-start}.spark{width:84px}.bklogo{width:160px}}

/* long sync labels wrap instead of pushing the page wide */
.cardhead{flex-wrap:wrap;gap:8px}.cardhead .pill{white-space:normal;height:auto;min-height:28px;padding-top:3px;padding-bottom:3px;line-height:1.25}