
/* V4 management preview modules: design-only, no live data integration */
.v4-panel{display:grid;gap:22px}
.v4-head{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;padding:5px 0}
.v4-kicker{font-size:11px;color:#1b5ac0;font-weight:800;letter-spacing:2px}
.v4-head h1{font-size:clamp(25px,3vw,36px);color:#173e7b;margin:9px 0 4px;line-height:1.2}
.v4-head h1 span{font-size:16px;color:#6580ab;font-weight:600}
.v4-head p,.v4-drawer p{color:#657a97;font-size:13px;margin:5px 0}
.v4-demo{font-size:11px;color:#925c1b;background:#fff3dd;border:1px solid #f8dfb5;padding:10px 13px;border-radius:99px;white-space:nowrap}
.v4-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px}
.v4-metrics article{background:linear-gradient(140deg,#e4efff,#f0f5ff);border-radius:22px;padding:20px;min-height:145px;display:grid;align-content:space-between;gap:9px}
.v4-metrics article:nth-child(2){background:linear-gradient(130deg,#fff0e0,#fff9f0)}
.v4-metrics article:nth-child(3){background:linear-gradient(130deg,#e3f8f0,#f0fffa)}
.v4-metrics article:nth-child(4){background:linear-gradient(130deg,#eee5fc,#f9f6ff)}
.v4-metrics article span{color:#1954b4;font-weight:800}
.v4-metrics article strong{font-size:25px}
.v4-metrics article small{color:#385277;font-size:12px;font-weight:700}
.v4-toolbar{display:flex;gap:9px;align-items:center;flex-wrap:wrap}
.v4-toolbar input{flex:1;min-width:180px;border:1px solid #e0e7f1;border-radius:12px;background:#fff;padding:13px;color:#203454;font:inherit}
.v4-btn{border:0;border-radius:12px;background:#0f4ed0;color:#fff;padding:12px 15px;cursor:pointer;font-weight:700}
.v4-btn.secondary{background:#ecf2ff;color:#16499d}
.v4-tabs{display:flex;gap:7px;overflow-x:auto;padding-bottom:4px}
.v4-tabs button{border:1px solid #e3e7ef;background:#fff;color:#446080;border-radius:99px;white-space:nowrap;padding:9px 13px;cursor:pointer}
.v4-tabs button.selected{background:#1649a5;color:#fff;border-color:#1649a5}
.v4-table-wrap{background:#fff;border:1px solid #e7ebf2;border-radius:20px;overflow-x:auto}
.v4-table{border-collapse:collapse;width:100%;min-width:610px;font-size:13px}
.v4-table th{text-align:left;color:#6d7d93;background:#f8faff;padding:17px 16px}
.v4-table td{border-top:1px solid #edf0f5;padding:16px;color:#263b59}
.v4-pill{background:#f6f2e9;color:#865d2b;padding:6px 9px;border-radius:99px;font-size:11px}
.v4-footnote{font-size:12px;color:#667b99}
.v4-empty{display:grid;justify-items:center;text-align:center;gap:8px;padding:40px 18px;background:#fff;border:1px solid #e7ebf2;border-radius:20px}
.v4-empty span{font-size:38px;color:#4474cc}.v4-empty strong{color:#163e76}
.v4-empty p,.v4-code-body p{color:#637795;font-size:13px;max-width:490px}
.v4-code-body h2{color:#173e7b;font-size:20px}
.v4-overlay-panel{position:fixed;inset:0;background:#17274977;z-index:100;display:flex;justify-content:flex-end}
.v4-drawer{background:#fff;width:min(450px,100%);height:100%;overflow-y:auto;padding:25px;box-shadow:-5px 0 40px #152e4d22}
.v4-drawer h2{color:#173e7b;margin-top:14px}
.v4-drawer form{display:grid;gap:16px;margin-top:20px}
.v4-drawer label{display:grid;gap:7px;color:#385277;font-size:13px;font-weight:700}
.v4-drawer input,.v4-drawer select{border:1px solid #dce5f1;background:#fff;border-radius:10px;padding:12px;font:inherit;width:100%}
.v4-close{float:right;font-size:26px;background:#edf3ff;border:0;border-radius:9px;cursor:pointer}
@media(max-width:760px){.v4-panel{gap:14px}.v4-head{display:block}.v4-demo{display:inline-block;margin-top:10px}.v4-metrics{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.v4-metrics article{min-height:104px;padding:12px;border-radius:17px}.v4-metrics article strong{font-size:22px}.v4-toolbar input{width:100%;flex-basis:100%}.v4-toolbar .v4-btn{flex:1}.v4-head h1 span{display:block;margin-top:4px}.v4-drawer{padding:20px}}
