
:root{
 --bg:#f5f8fc;--surface:#ffffff;--surface2:#eef4fb;--line:#d9e4ef;--text:#1d2a38;--muted:#718296;
 --blue:#4f8df7;--cyan:#2fc9c0;--green:#36bf82;--yellow:#f2b94b;--orange:#ef8e3c;--red:#e96565;--nav:#ffffff;
}
*{box-sizing:border-box}
body{margin:0;font-family:Inter,Segoe UI,Arial,sans-serif;background:linear-gradient(180deg,#f6f9fd,#eef4f9);color:var(--text);min-height:100vh}
a{text-decoration:none;color:inherit}
.shell{display:grid;grid-template-columns:245px minmax(0,1fr);min-height:100vh}
.sidebar{background:rgba(255,255,255,.97);border-right:1px solid var(--line);padding:24px 18px;position:sticky;top:0;height:100vh;box-shadow:8px 0 30px rgba(50,80,120,.05)}
.brand{display:flex;align-items:center;gap:12px;margin-bottom:30px}
.brand-logo{width:43px;height:43px;border-radius:14px;display:grid;place-items:center;background:linear-gradient(135deg,#5b9df7,#4ec9c0);color:#fff;font-weight:900;box-shadow:0 10px 24px rgba(65,140,230,.22)}
.brand b{display:block}.brand span{display:block;color:var(--muted);font-size:11px;margin-top:3px}
.menu{display:grid;gap:7px}
.menu a{padding:12px 14px;border-radius:12px;color:#5f7389;font-size:14px;font-weight:600}
.menu a:hover{background:#edf5ff;color:#2f68b3}
.sidebar-bottom{position:absolute;left:18px;right:18px;bottom:20px;border-top:1px solid var(--line);padding-top:15px;display:flex;justify-content:space-between;font-size:12px;color:var(--muted)}
.sidebar-bottom a{color:#d75a5a;font-weight:700}
.main{padding:28px;min-width:0}
.topbar{display:flex;justify-content:space-between;gap:20px;align-items:flex-end;margin-bottom:22px}
.eyebrow{font-size:11px;font-weight:800;letter-spacing:1.7px;color:#3f80d3}
h1{font-size:30px;margin:5px 0 0}.topbar p{margin:7px 0 0;color:var(--muted);font-size:13px}
.user-chip{background:#fff;border:1px solid var(--line);border-radius:14px;padding:9px 13px;box-shadow:0 8px 22px rgba(70,100,130,.06)}
.user-chip span{display:block;color:#3d83d0;font-size:10px;text-transform:uppercase}.user-chip b{display:block;font-size:13px;margin-top:3px}
.hero{display:flex;justify-content:space-between;gap:20px;align-items:center;background:linear-gradient(135deg,#e7f2ff,#ecfbf8);border:1px solid #cfe0ee;border-radius:20px;padding:22px;margin-bottom:16px}
.hero-kicker{font-size:10px;letter-spacing:1.3px;font-weight:800;color:#4783c6}.hero h2{margin:7px 0 5px;font-size:23px}.hero p{margin:0;color:#667a8f;font-size:12px}
.primary-btn{display:block;width:100%;border:0;border-radius:12px;padding:12px 16px;background:linear-gradient(135deg,#4f8df7,#43c5b8);color:#fff;font-weight:800;cursor:pointer;text-align:center}
.primary-btn.inline{width:auto;display:inline-flex}
.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:16px}
.stat-card{background:#fff;border:1px solid var(--line);border-radius:17px;padding:18px;box-shadow:0 8px 24px rgba(62,93,128,.05)}
.stat-card span,.stat-card small{display:block;color:var(--muted);font-size:11px}.stat-card strong{display:block;font-size:30px;margin:7px 0 4px}
.stat-card.success strong{color:var(--green)}.stat-card.warning strong{color:var(--orange)}.stat-card.danger strong{color:var(--red)}
.generation-overview{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:16px}
.gen-card{display:flex;align-items:center;gap:12px;background:#fff;border:1px solid var(--line);padding:16px;border-radius:17px;transition:.2s}
.gen-card:hover{transform:translateY(-2px);box-shadow:0 12px 25px rgba(60,95,130,.08)}
.gen-icon{width:42px;height:42px;border-radius:14px;display:grid;place-items:center;background:#eaf3ff;color:#3d79c8;font-weight:900}
.gen-card span{display:block;font-size:10px;color:var(--muted);font-weight:800}.gen-card strong{display:block;margin-top:4px}
.gen-card>b{margin-left:auto;color:#6d8aab}
.decision-card,.attendance-card,.form-card{background:#fff;border:1px solid var(--line);border-radius:20px;padding:18px;box-shadow:0 10px 26px rgba(60,90,120,.05)}
.section-head{display:flex;justify-content:space-between;align-items:center}.section-head h3{margin:0}.section-head p{margin:5px 0 0;color:var(--muted);font-size:12px}.section-head a{color:#3c7bc4;font-weight:700;font-size:12px}
.mini-tree{text-align:center;padding:20px 10px 4px}.tree-root{display:inline-block;padding:9px 18px;background:#eaf4ff;border:1px solid #b8d6f5;border-radius:12px;font-weight:800;color:#3a77bd}
.tree-line{width:2px;height:24px;background:#b8cce1;margin:auto}.tree-line.wide{height:18px}
.tree-level{display:flex;justify-content:center;gap:40px}.tree-level span{padding:8px 14px;border-radius:10px;background:#eff9f7;border:1px solid #c9ebe5;color:#3c756e;font-size:11px;font-weight:800}
.tree-level.small{gap:12px;margin-top:4px}.tree-level.small span{font-size:9px;padding:7px 9px}
.filter-tabs{display:flex;gap:8px;margin-bottom:15px;flex-wrap:wrap}.filter-tabs a{background:#fff;border:1px solid var(--line);border-radius:11px;padding:9px 14px;color:#6a7d91;font-size:12px;font-weight:700}.filter-tabs a.active{background:#e9f3ff;border-color:#94bee9;color:#3473ba}
.account-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:14px}
.account-card{background:#fff;border:1px solid var(--line);border-left:5px solid #ddd;border-radius:18px;padding:16px;box-shadow:0 8px 24px rgba(65,95,120,.05)}
.account-card.green{border-left-color:var(--green)}.account-card.yellow{border-left-color:var(--yellow)}.account-card.red{border-left-color:var(--red)}
.account-head{display:flex;gap:12px;align-items:center}.profile{width:52px;height:52px;position:relative;flex:0 0 auto}.profile img,.report-profile img,.account-cell img{width:100%;height:100%;object-fit:cover;border-radius:50%}
.profile-fallback,.mini-avatar{width:100%;height:100%;display:grid;place-items:center;border-radius:50%;background:linear-gradient(135deg,#dfeeff,#dff7f3);color:#3979b8;font-weight:900}
.profile span{position:absolute;right:0;top:0;width:13px;height:13px;border:2px solid #fff;background:#4a8bf6;border-radius:50%}
.account-id{min-width:0}.account-id small{display:block;color:var(--muted);font-size:9px}.account-id b{display:block;font-size:18px;margin-top:2px}.account-id span{display:block;color:#6c8093;font-size:11px;margin-top:3px}.gen-badge{margin-left:auto;background:#eef5fc;color:#477bb2;border-radius:999px;padding:6px 9px;font-size:10px;font-weight:800}
.account-meta{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:14px;padding-top:14px;border-top:1px solid var(--line)}.account-meta span{display:block;color:var(--muted);font-size:9px}.account-meta b{display:block;margin-top:4px;font-size:11px}
.account-status{display:flex;align-items:center;gap:7px;margin-top:13px;font-size:11px}.account-status i{width:9px;height:9px;border-radius:50%;background:#bbb}.green .account-status i{background:var(--green)}.yellow .account-status i{background:var(--yellow)}.red .account-status i{background:var(--red)}.account-status span{margin-left:auto;color:var(--muted)}
.account-actions{display:flex;gap:7px;margin-top:13px}.account-actions a{flex:1;text-align:center;padding:8px;border:1px solid var(--line);border-radius:9px;font-size:10px;color:#4f759f;background:#f9fbfd}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.form-grid .full{grid-column:1/-1}
label{display:block;font-size:11px;color:#61758b;margin-bottom:6px;font-weight:700}
input,select,textarea{width:100%;border:1px solid #cfdce9;background:#fbfdff;color:#22303e;border-radius:11px;padding:11px 12px;outline:none}
input:focus,select:focus,textarea:focus{border-color:#7fb0e7;box-shadow:0 0 0 3px rgba(85,145,215,.1)}
textarea{min-height:90px;resize:vertical}.success-box,.alert{padding:11px 13px;border-radius:11px;margin-bottom:14px}.success-box{background:#e9f8f1;color:#34795e;border:1px solid #bfe7d2}.alert{background:#fff0f0;color:#a94c4c;border:1px solid #f0c5c5}
.date-box label{font-size:10px}.date-box input{background:#fff}
.attendance-legend{display:flex;gap:16px;flex-wrap:wrap;margin-bottom:14px;color:#63788f;font-size:11px}.attendance-legend i{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:5px}.green-dot{background:var(--green)}.yellow-dot{background:var(--yellow)}.red-dot{background:var(--red)}
.table-wrap{overflow:auto;border:1px solid var(--line);border-radius:14px}
.attendance-table{border-collapse:separate;border-spacing:0;width:max-content;min-width:100%;font-size:12px}
.attendance-table th,.attendance-table td{height:60px;min-width:88px;text-align:center;border-right:1px solid #dce6ef;border-bottom:1px solid #dce6ef;background:#fff}
.attendance-table th{position:sticky;top:0;z-index:5;background:#dfeeff;color:#35546f}.attendance-table th small{display:block;color:#728ba2;margin-top:4px}.sticky{position:sticky;z-index:4}.attendance-table th.sticky{z-index:6}.no{left:0;width:58px;min-width:58px}.account{left:58px;min-width:220px;width:220px;background:#f8fbfe!important}
.account-cell{display:flex;align-items:center;gap:10px;text-align:left;padding:0 10px}.account-cell img,.mini-avatar{width:36px;height:36px;flex:0 0 auto}.account-cell b{display:block}.account-cell span{display:block;font-size:9px;color:var(--muted);margin-top:3px}
.row-green .account{border-left:4px solid var(--green)}.row-yellow .account{border-left:4px solid var(--yellow)}.row-red .account{border-left:4px solid var(--red)}
.att-check input{display:none}.att-check span{display:inline-block;width:23px;height:23px;border:2px solid #7d93aa;border-radius:6px;background:#fff;cursor:pointer;position:relative}.att-check.today span{box-shadow:0 0 0 4px rgba(242,185,75,.12)}.att-check.checked span{background:var(--green);border-color:var(--green);cursor:not-allowed}.att-check.checked span:after{content:"";position:absolute;left:6px;top:2px;width:5px;height:11px;border:solid white;border-width:0 2px 2px 0;transform:rotate(45deg)}
.report-list{display:grid;gap:9px}.report-row{display:grid;grid-template-columns:52px 1fr 180px 120px 90px;gap:12px;align-items:center;background:#fff;border:1px solid var(--line);border-left:5px solid #ddd;border-radius:14px;padding:11px 14px}.report-row.done{border-left-color:var(--green)}.report-row.missing{border-left-color:var(--red)}.report-profile{width:42px;height:42px}.report-row b{display:block}.report-row span{display:block;color:var(--muted);font-size:10px;margin-top:2px}.report-status{font-weight:900;font-size:11px}.done .report-status{color:var(--green)}.missing .report-status{color:var(--red)}
.tree-canvas{min-width:900px;background:#fff;border:1px solid var(--line);border-radius:20px;padding:24px;overflow:auto}.tree-root-card{display:flex;justify-content:center}.tree-row{display:flex;justify-content:center;gap:18px;flex-wrap:wrap}.tree-node-card{width:145px;text-align:center;border:1px solid #cfdce9;border-radius:15px;padding:11px;background:#f9fbfe;box-shadow:0 6px 16px rgba(70,100,130,.05)}.tree-node-card img,.tree-avatar{width:50px;height:50px;border-radius:50%;margin:0 auto 7px;object-fit:cover}.tree-avatar{display:grid;place-items:center;background:#e4f1ff;color:#3c7ec4;font-weight:900}.tree-node-card b,.tree-node-card span,.tree-node-card em{display:block}.tree-node-card b{font-size:11px}.tree-node-card span{font-size:9px;color:var(--muted);margin-top:3px}.tree-node-card em{font-size:8px;color:#3b7dbc;margin-top:5px;font-style:normal}.level-title{text-align:center;color:#72869a;font-size:10px;font-weight:900;letter-spacing:1.4px;margin:26px 0 10px}
.user-table{display:grid;gap:8px;margin-top:14px}.user-table>div{display:grid;grid-template-columns:140px 1fr 100px 170px;gap:12px;background:#fff;border:1px solid var(--line);padding:12px;border-radius:12px}.user-table span,.user-table small{color:var(--muted)}.user-table em{font-style:normal;color:#3f7ab8;font-weight:800}
.toast{position:fixed;right:22px;bottom:22px;background:#eaf8f2;border:1px solid #b9e4d1;color:#2f7256;padding:11px 15px;border-radius:11px;opacity:0;transform:translateY(15px);transition:.2s;z-index:50}.toast.show{opacity:1;transform:none}.toast.error{background:#fff0f0;border-color:#efcaca;color:#a54d4d}

.login-page{background:linear-gradient(135deg,#edf5ff,#f6fbff 45%,#edfbf8);display:grid;place-items:center;padding:24px}
.login-wrap{width:min(1000px,96vw);display:grid;grid-template-columns:1.1fr .9fr;background:#fff;border:1px solid var(--line);border-radius:26px;overflow:hidden;box-shadow:0 25px 80px rgba(74,105,135,.14)}
.login-visual{padding:46px;background:linear-gradient(135deg,#e6f2ff,#eafaf7)}.logo-big{width:64px;height:64px;border-radius:20px;display:grid;place-items:center;color:#fff;font-weight:900;background:linear-gradient(135deg,#4f8df7,#43c5b8);margin-bottom:22px}.login-visual h1{font-size:36px;max-width:470px}.login-visual p{color:#64788d;line-height:1.6}.login-points{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:24px}.login-points span{background:rgba(255,255,255,.75);border:1px solid #d5e5f2;border-radius:11px;padding:10px;font-size:11px}
.login-card{padding:46px}.login-card h2{font-size:28px;margin:7px 0}.login-card>p{color:var(--muted);font-size:12px}.login-card form{margin-top:22px}.login-card input{margin-bottom:14px}.demo-box{display:grid;gap:4px;background:#f6f9fc;border:1px solid var(--line);border-radius:12px;padding:12px;margin-top:16px;font-size:10px;color:#65798f}.demo-box b{font-size:11px;color:#344e68}

@media(max-width:1050px){.stats-grid{grid-template-columns:repeat(2,1fr)}.generation-overview{grid-template-columns:1fr}.report-row{grid-template-columns:48px 1fr 100px 80px}.report-mobile{display:none}}
@media(max-width:850px){.shell{grid-template-columns:1fr}.sidebar{position:relative;height:auto;padding:14px}.brand{margin-bottom:12px}.menu{grid-template-columns:repeat(4,1fr)}.sidebar-bottom{position:relative;left:auto;right:auto;bottom:auto;margin-top:12px}.main{padding:16px}.topbar{align-items:flex-start;flex-direction:column}.login-wrap{grid-template-columns:1fr}.login-visual{display:none}.form-grid{grid-template-columns:1fr}.form-grid .full{grid-column:auto}}
@media(max-width:600px){.menu{grid-template-columns:1fr 1fr}.stats-grid{grid-template-columns:1fr 1fr;gap:9px}.stat-card{padding:14px}.stat-card strong{font-size:24px}.hero{align-items:flex-start;flex-direction:column}.account-grid{grid-template-columns:1fr}.account-meta{grid-template-columns:1fr 1fr}.login-card{padding:28px}.report-row{grid-template-columns:42px 1fr 85px}.report-time{display:none}}


/* ===== v2 Premium refinements ===== */
.menu a{display:flex;align-items:center;gap:10px}
.menu-icon{
  width:24px;height:24px;border-radius:8px;display:grid;place-items:center;
  background:#eef5fb;border:1px solid #d8e6f2;color:#4d7faa;font-size:12px;font-weight:900;flex:0 0 auto
}
.menu a:hover .menu-icon{background:#dfeeff;border-color:#bfd7ec;color:#2f70ac}
.mini-user{display:flex;align-items:center;gap:8px;min-width:0}
.mini-user-avatar{
  width:28px;height:28px;border-radius:9px;display:grid;place-items:center;
  background:linear-gradient(135deg,#dcecff,#e3f8f3);color:#3b76ae;font-size:11px;font-weight:900
}
.mini-user b,.mini-user span{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mini-user b{font-size:10px;color:#40586e}.mini-user span{font-size:8px;text-transform:uppercase;color:#7b91a5}

.top-actions{display:flex;align-items:center;gap:10px}
.role-pill{padding:7px 10px;border-radius:999px;font-size:9px;font-weight:900;letter-spacing:.7px;border:1px solid #c9dae8;background:#f5f9fd;color:#54718b}
.role-pill.admin{background:#e9f2ff;border-color:#bfd6f1;color:#3b72ab}
.role-pill.operator{background:#eaf9f5;border-color:#c2e9dc;color:#397c6b}
.role-pill.user{background:#f5f3ff;border-color:#dcd4f1;color:#655d91}

.account-actions a{display:flex;align-items:center;justify-content:center;gap:5px}
.account-actions a span{font-size:11px;color:#5584b1}
.account-actions .edit-action{background:#eef6ff;border-color:#c8ddf1;color:#386d9e}

.profile-edit-head{
  display:flex;align-items:center;gap:14px;background:linear-gradient(135deg,#f8fbff,#eef8f6);
  border:1px solid var(--line);border-radius:18px;padding:16px;margin-bottom:14px
}
.profile-edit-avatar{width:58px;height:58px;flex:0 0 auto}
.profile-edit-avatar img,.profile-edit-avatar>div{
  width:100%;height:100%;border-radius:16px;object-fit:cover
}
.profile-edit-avatar>div{
  display:grid;place-items:center;background:linear-gradient(135deg,#dcecff,#ddf6f1);
  color:#3977b1;font-size:20px;font-weight:900
}
.profile-edit-head span{display:block;font-size:9px;font-weight:800;color:#6b8aa7;letter-spacing:1px}
.profile-edit-head h3{margin:4px 0 2px;font-size:17px}.profile-edit-head p{margin:0;color:var(--muted);font-size:10px}

.report-status{display:flex;align-items:center;gap:6px}
.status-dot{width:8px;height:8px;border-radius:50%;background:currentColor;display:inline-block}

.user-access-grid{display:grid;gap:9px;margin-top:14px}
.access-card{
  display:grid;grid-template-columns:42px minmax(0,1fr) 95px 90px 34px;gap:12px;align-items:center;
  background:#fff;border:1px solid var(--line);border-radius:14px;padding:11px 13px
}
.access-avatar{
  width:36px;height:36px;border-radius:10px;display:grid;place-items:center;background:linear-gradient(135deg,#e1efff,#e0f7f2);
  color:#3975aa;font-size:12px;font-weight:900
}
.access-info b,.access-info span{display:block}.access-info b{font-size:12px}.access-info span{font-size:9px;color:var(--muted);margin-top:2px}
.access-role,.access-state{font-size:9px;font-weight:900;text-transform:uppercase;text-align:center;border-radius:999px;padding:5px 8px}
.access-role.admin{background:#eaf2ff;color:#3e70a8}.access-role.operator{background:#e8f8f4;color:#3a7b6c}.access-role.user{background:#f2f1fb;color:#645e8e}
.access-state.on{background:#e8f8ef;color:#37795c}.access-state.off{background:#fff0f0;color:#a64f4f}
.icon-edit{
  width:30px;height:30px;border-radius:9px;display:grid;place-items:center;border:1px solid #d7e3ee;background:#f7fafc;color:#527b9e;font-size:12px
}
.toggle-row{display:flex;align-items:center;gap:10px}
.toggle-row b,.toggle-row small{display:block}.toggle-row b{font-size:11px}.toggle-row small{font-size:9px;color:var(--muted);margin-top:2px}
.switch{margin:0;position:relative;width:42px;height:24px}
.switch input{display:none}
.switch span{position:absolute;inset:0;background:#ccd8e3;border-radius:999px;transition:.2s}
.switch span:before{content:"";position:absolute;width:18px;height:18px;left:3px;top:3px;background:#fff;border-radius:50%;box-shadow:0 2px 6px rgba(0,0,0,.14);transition:.2s}
.switch input:checked+span{background:#49c69a}.switch input:checked+span:before{transform:translateX(18px)}
.form-actions{display:flex;gap:9px}
.secondary-btn{display:flex;align-items:center;justify-content:center;border:1px solid var(--line);border-radius:12px;padding:11px 15px;background:#fff;color:#65798d;font-weight:700}

.att-check.admin-editable:not(.checked) span{border-color:#6c8ba8;background:#fff}
.att-check.admin-editable.checked span{cursor:pointer}
.att-check.admin-editable.checked span:hover{box-shadow:0 0 0 4px rgba(233,101,101,.10);border-color:#e97979}
.att-check input:disabled + span{cursor:not-allowed;opacity:.88}

@media(max-width:700px){
  .access-card{grid-template-columns:38px 1fr 75px 30px}
  .access-state{display:none}
  .top-actions{width:100%;justify-content:space-between}
}


/* ===== v4 PREMIUM UI ===== */
:root{--sidebar-w:245px;--sidebar-collapsed:78px;--shadow:0 12px 34px rgba(52,83,113,.08)}
.shell{grid-template-columns:var(--sidebar-w) minmax(0,1fr);transition:grid-template-columns .22s ease}
.sidebar{width:var(--sidebar-w);transition:width .22s ease;padding:20px 16px;z-index:40}
.brand-row{display:flex;align-items:center;gap:8px;margin-bottom:28px}.brand-row .brand{margin:0;flex:1;min-width:0}.brand-copy{transition:.2s}.brand-logo{flex:0 0 43px}
.sidebar-toggle{width:30px;height:30px;display:grid;place-items:center;border:1px solid #d9e6f1;background:#f7fbff;color:#55799b;border-radius:9px;cursor:pointer}.sidebar-toggle svg,.mobile-menu-btn svg,.logout-icon svg{width:17px;height:17px;fill:currentColor}.sidebar-toggle:hover{background:#edf6ff}
.menu a{position:relative}.menu-icon{width:31px;height:31px;border-radius:10px}.menu-icon svg{width:16px;height:16px;fill:currentColor}.menu a.active{background:linear-gradient(90deg,#eaf4ff,#f1fbf9);color:#3678b4}.menu a.active .menu-icon{background:#dceeff;border-color:#c6def5;color:#3779b7}.menu-label{white-space:nowrap}
.sidebar-bottom{align-items:center}.logout-icon{width:30px;height:30px;display:grid;place-items:center;border:1px solid #f0d4d4;background:#fff7f7;color:#d35e5e;border-radius:9px}.mini-user-copy{min-width:0}
.mobile-menu-btn{display:none;position:fixed;top:12px;left:12px;width:38px;height:38px;border:1px solid #d5e3ef;border-radius:11px;background:#fff;color:#4e759a;z-index:60;box-shadow:var(--shadow)}.sidebar-backdrop{display:none}
body.sidebar-collapsed .shell{grid-template-columns:var(--sidebar-collapsed) minmax(0,1fr)}body.sidebar-collapsed .sidebar{width:var(--sidebar-collapsed);padding-left:13px;padding-right:13px}body.sidebar-collapsed .brand-copy,body.sidebar-collapsed .menu-label,body.sidebar-collapsed .mini-user-copy,body.sidebar-collapsed .sidebar-bottom .logout-icon{display:none}body.sidebar-collapsed .brand-row{display:block}body.sidebar-collapsed .brand{justify-content:center}body.sidebar-collapsed .sidebar-toggle{margin:10px auto 0;transform:rotate(180deg)}body.sidebar-collapsed .menu a{justify-content:center;padding:10px 0}body.sidebar-collapsed .sidebar-bottom{justify-content:center;left:13px;right:13px}
.premium-topbar{align-items:center}.premium-topbar h1{letter-spacing:-.5px}.btn-plus{font-size:15px;margin-right:5px}
.accounts-toolbar{display:flex;gap:12px;align-items:center;margin-bottom:14px}.smart-search{height:48px;display:flex;align-items:center;flex:1;max-width:760px;background:#fff;border:1px solid #d6e3ef;border-radius:14px;padding:0 7px 0 13px;box-shadow:0 6px 20px rgba(60,95,125,.05)}.search-icon{width:25px;height:25px;display:grid;place-items:center;color:#7391ac}.search-icon svg{width:18px;height:18px;fill:currentColor}.smart-search input{border:0;box-shadow:none!important;background:transparent;flex:1;min-width:0}.smart-search button{height:34px;border:0;background:#e9f3ff;color:#3c76b3;border-radius:9px;padding:0 14px;font-size:11px;font-weight:800;cursor:pointer}.clear-search{width:27px;height:27px;display:grid;place-items:center;color:#9aabba;font-size:18px}.result-count{margin-left:auto;text-align:right;background:#fff;border:1px solid var(--line);border-radius:12px;padding:7px 12px;min-width:74px}.result-count b,.result-count span{display:block}.result-count b{font-size:17px}.result-count span{font-size:9px;color:var(--muted)}
.generation-filter-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:16px}.generation-filter-card{display:flex;align-items:center;gap:10px;background:#fff;border:1px solid #d9e5ef;border-radius:15px;padding:12px;min-width:0;transition:.2s}.generation-filter-card:hover{transform:translateY(-2px);box-shadow:var(--shadow)}.generation-filter-card.active{background:linear-gradient(135deg,#eef6ff,#eefaf8);border-color:#a9cfea}.filter-number{width:34px;height:34px;display:grid;place-items:center;background:#eef5fc;border-radius:10px;color:#467caf;font-weight:900}.generation-filter-card.active .filter-number{background:linear-gradient(135deg,#5d9ded,#50c9bb);color:#fff}.generation-filter-card div:nth-child(2){min-width:0}.generation-filter-card span,.generation-filter-card strong{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.generation-filter-card span{font-size:10px;color:#71869b}.generation-filter-card strong{font-size:13px;margin-top:2px}.generation-filter-card em{margin-left:auto;font-style:normal;font-size:8px;font-weight:900;color:#7790a8;background:#f3f7fb;padding:4px 6px;border-radius:999px}
.premium-account-grid{grid-template-columns:repeat(auto-fit,minmax(350px,1fr))}.account-card{position:relative;overflow:hidden}.card-accent{position:absolute;left:0;right:0;top:0;height:3px;background:#d8e4ef}.account-card.green .card-accent{background:linear-gradient(90deg,#34c686,#73dbb2)}.account-card.yellow .card-accent{background:linear-gradient(90deg,#efb84c,#f4d078)}.account-card.red .card-accent{background:linear-gradient(90deg,#e96767,#f09a9a)}.profile-lg{width:58px;height:58px}.profile-lg .profile-fallback{font-size:18px}.phone-country{display:flex;align-items:center;gap:10px;background:#f8fbfe;border:1px solid #e2eaf2;border-radius:12px;padding:9px 10px;margin-top:13px}.flag{font-size:23px;line-height:1}.phone-country small,.phone-country b{display:block}.phone-country small{font-size:8px;color:#8294a6;font-weight:800;letter-spacing:.5px}.phone-country b{font-size:12px;margin-top:2px}.account-actions a svg{width:13px;height:13px;fill:currentColor}.account-actions a{gap:5px}.empty-premium{text-align:center;padding:55px 20px;background:#fff;border:1px dashed #cbdce9;border-radius:18px}.empty-premium div{font-size:38px;color:#8eabc3}.empty-premium h3{margin:10px 0 5px}.empty-premium p{margin:0;color:var(--muted);font-size:12px}
.premium-hero{background:linear-gradient(125deg,#eaf4ff 0%,#f5fbff 48%,#ecfaf7 100%);min-height:180px;overflow:hidden;position:relative}.hero-actions{display:flex;gap:8px;margin-top:16px}.secondary-btn.inline{width:auto;display:inline-flex;background:#fff}.hero-visual{width:170px;display:grid;place-items:center}.pulse-ring{width:126px;height:126px;border-radius:50%;display:grid;place-items:center;align-content:center;background:#fff;border:11px solid #d9eef0;box-shadow:inset 0 0 0 5px #e5f0ff,0 16px 35px rgba(70,120,150,.12)}.pulse-ring b{font-size:27px;color:#397ebc}.pulse-ring span{font-size:9px;color:#7e91a5;margin-top:2px}.premium-stats .stat-card{position:relative;padding-left:62px}.stat-icon{position:absolute;left:16px;top:18px;width:34px;height:34px;display:grid;place-items:center;border-radius:10px;font-weight:900}.stat-icon.blue{background:#e4f0ff;color:#4c83c4}.stat-icon.green{background:#e5f8ef;color:#3c9a72}.stat-icon.amber{background:#fff5df;color:#c8872d}.stat-icon.red{background:#fff0f0;color:#cc6262}
.dashboard-panel{background:#fff;border:1px solid var(--line);border-radius:20px;padding:18px;margin-bottom:16px;box-shadow:var(--shadow)}.slider-controls{display:flex;gap:6px}.slider-controls button{width:32px;height:32px;border:1px solid #d5e2ed;background:#f7fbff;color:#557b9d;border-radius:9px;font-size:19px;cursor:pointer}.profile-slider{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;padding:14px 2px 3px;scrollbar-width:none}.profile-slider::-webkit-scrollbar{display:none}.profile-slide{min-width:270px;scroll-snap-align:start;display:flex;align-items:center;gap:10px;border:1px solid #dce6ef;border-left:4px solid #ddd;border-radius:14px;padding:11px;background:#fbfdff}.profile-slide.green{border-left-color:var(--green)}.profile-slide.yellow{border-left-color:var(--yellow)}.profile-slide.red{border-left-color:var(--red)}.slide-photo{width:46px;height:46px;position:relative;flex:0 0 auto}.slide-photo img,.slide-photo .profile-fallback{width:100%;height:100%;border-radius:12px;object-fit:cover}.slide-photo i{position:absolute;right:-2px;top:-2px;width:11px;height:11px;border:2px solid #fff;border-radius:50%;background:#bbb}.green .slide-photo i{background:var(--green)}.yellow .slide-photo i{background:var(--yellow)}.red .slide-photo i{background:var(--red)}.slide-copy{min-width:0}.slide-copy b,.slide-copy span,.slide-copy small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.slide-copy b{font-size:12px}.slide-copy span{font-size:10px;color:#668099;margin-top:2px}.slide-copy small{font-size:8px;color:#8a9bab;margin-top:4px}.profile-slide em{margin-left:auto;font-style:normal;color:#7390aa}.premium-gen-overview .gen-card small{display:block;color:#8496a7;font-size:9px;margin-top:2px}
@media(max-width:1100px){.generation-filter-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:850px){.shell{grid-template-columns:1fr!important}.sidebar{position:fixed;left:-270px;top:0;height:100vh;width:245px!important;transition:left .23s ease;box-shadow:10px 0 34px rgba(40,70,100,.16)}body.sidebar-mobile-open .sidebar{left:0}.sidebar-toggle{display:none}.mobile-menu-btn{display:grid}.sidebar-backdrop{position:fixed;inset:0;background:rgba(25,45,65,.22);z-index:35}body.sidebar-mobile-open .sidebar-backdrop{display:block}.main{padding-top:62px}.brand-copy,.menu-label,.mini-user-copy,.sidebar-bottom .logout-icon{display:block!important}.menu{grid-template-columns:1fr!important}.menu a{justify-content:flex-start!important;padding:10px 12px!important}.accounts-toolbar{align-items:stretch}.result-count{display:none}}
@media(max-width:600px){.generation-filter-grid{grid-template-columns:1fr 1fr}.generation-filter-card{padding:10px}.generation-filter-card em{display:none}.premium-account-grid{grid-template-columns:1fr}.premium-hero{flex-direction:column}.hero-visual{width:100%;padding-top:8px}.premium-stats .stat-card{padding-left:14px;padding-top:56px}.stat-icon{top:13px}.accounts-toolbar{display:block}.smart-search{max-width:none}.profile-slide{min-width:235px}}



/* ===== v5 Premium Auto Slider ===== */
.premium-account-slider{
  background:linear-gradient(135deg,#ffffff,#f7fbff 55%,#f2faf8);
  border:1px solid var(--line);
  border-radius:22px;
  padding:18px;
  margin-bottom:16px;
  overflow:hidden;
  box-shadow:0 12px 34px rgba(67,94,120,.07)
}
.slider-section-head{
  display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:14px
}
.slider-section-head h3{margin:3px 0 2px;font-size:18px}
.slider-section-head p{margin:0;color:var(--muted);font-size:11px}
.slider-head-actions{display:flex;align-items:center;gap:7px}
.slider-status{
  height:34px;display:flex;align-items:center;gap:7px;padding:0 10px;border-radius:999px;
  background:#edf8f4;border:1px solid #cce9df;color:#367563;font-size:9px;letter-spacing:.5px
}
.slider-status.paused{background:#fff7e8;border-color:#f0ddb5;color:#9a7024}
.slider-live-dot{width:7px;height:7px;border-radius:50%;background:#3ac18a;box-shadow:0 0 0 5px rgba(58,193,138,.10)}
.slider-pause-icon{font-size:10px;font-weight:900}
.slider-control-btn{
  width:34px;height:34px;border:1px solid #d4e1ed;background:#fff;color:#4c759a;
  border-radius:10px;display:grid;place-items:center;font-size:22px;line-height:1;cursor:pointer
}
.slider-control-btn:hover{background:#eef6fd;border-color:#bdd4e9}
.slider-viewport{
  overflow:hidden;border-radius:18px;outline:none;touch-action:pan-y
}
.slider-viewport:focus-visible{box-shadow:0 0 0 3px rgba(79,141,247,.18)}
.slider-track{
  display:flex;gap:14px;will-change:transform;align-items:stretch
}
.slider-account-card{
  min-width:100%;
  position:relative;
  border:1px solid #d8e5ef;
  border-radius:18px;
  background:#fff;
  padding:17px;
  overflow:hidden;
  opacity:.78;
  transform:scale(.985);
  transition:opacity .35s ease,transform .35s ease,border-color .35s ease;
  box-shadow:0 8px 22px rgba(66,96,124,.05)
}
.slider-account-card.active{
  opacity:1;transform:scale(1);border-color:#c3d9eb
}
.slider-card-accent{
  position:absolute;left:0;top:0;bottom:0;width:5px;background:#f2b94b
}
.slider-account-card.done .slider-card-accent{background:#36bf82}
.slider-account-card.overdue .slider-card-accent{background:#e96565}
.slider-card-top{
  display:flex;align-items:flex-start;justify-content:space-between;gap:12px
}
.slider-profile{display:flex;align-items:center;gap:12px;min-width:0}
.slider-avatar{
  width:58px;height:58px;flex:0 0 auto;border-radius:16px;overflow:hidden;
  background:linear-gradient(135deg,#e1efff,#ddf7f1);
  display:grid;place-items:center;color:#3b78ad;font-size:18px;font-weight:900;
  border:1px solid #cfe0ed
}
.slider-avatar img{width:100%;height:100%;object-fit:cover}
.slider-profile-text{min-width:0}
.slider-profile-text small{display:block;color:#7f94a8;font-size:8px;font-weight:900;letter-spacing:1px}
.slider-profile-text h4{margin:4px 0 2px;font-size:18px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.slider-profile-text p{margin:0;color:#73889c;font-size:10px}
.slider-badges{display:flex;align-items:center;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.generation-chip,.order-state{
  display:inline-flex;align-items:center;height:27px;border-radius:999px;padding:0 9px;
  font-size:8px;font-weight:900;letter-spacing:.5px
}
.generation-chip{background:#edf4fb;color:#4d769b;border:1px solid #d5e2ed}
.order-state.done{background:#e8f8f0;color:#31775a;border:1px solid #c5e8d6}
.order-state.waiting{background:#fff7e7;color:#9a6d20;border:1px solid #f0ddb2}
.order-state.overdue{background:#fff0f0;color:#a64e4e;border:1px solid #efcaca}
.slider-detail-grid{
  display:grid;grid-template-columns:repeat(4,1fr);gap:9px;margin-top:15px
}
.slider-detail-item{
  display:flex;align-items:center;gap:9px;min-width:0;
  background:#f8fbfd;border:1px solid #e0e9f1;border-radius:13px;padding:10px
}
.detail-icon{
  width:28px;height:28px;flex:0 0 auto;border-radius:9px;display:grid;place-items:center;
  background:#edf5fb;color:#4f7ca3;font-size:11px;font-weight:900
}
.slider-detail-item div{min-width:0}
.slider-detail-item small{display:block;color:#8295a8;font-size:8px;margin-bottom:3px}
.slider-detail-item b{
  display:block;color:#334a60;font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis
}
.slider-card-footer{
  margin-top:14px;padding-top:12px;border-top:1px solid #e1e9f0
}
.slider-progress-meta{display:flex;justify-content:space-between;color:#8295a7;font-size:8px}
.slider-progress-line{
  height:3px;background:#e8eef4;border-radius:999px;overflow:hidden;margin-top:7px
}
.slider-progress-line i{
  display:block;height:100%;width:0;background:linear-gradient(90deg,#5a94e8,#42c6b8);border-radius:999px
}
@keyframes ddiSliderProgress{from{width:0}to{width:100%}}
.slider-card-actions{display:flex;gap:7px;margin-top:11px;flex-wrap:wrap}
.slider-card-actions a{
  min-height:32px;display:flex;align-items:center;justify-content:center;
  border:1px solid #d8e4ee;background:#fbfdff;color:#50779a;border-radius:9px;
  padding:0 10px;font-size:9px;font-weight:800
}
.slider-card-actions a:hover{background:#eef6fd;border-color:#bfd6e9}
.slider-bottom{
  display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:12px
}
.slider-dots{display:flex;align-items:center;gap:5px;flex-wrap:wrap}
.slider-dots button{
  width:7px;height:7px;border:0;border-radius:999px;padding:0;background:#ccd8e3;cursor:pointer;
  transition:width .25s ease,background .25s ease
}
.slider-dots button.active{width:22px;background:#598ed0}
.slider-hint{font-size:9px;color:#8093a6}

@media(max-width:900px){
  .slider-detail-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:600px){
  .premium-account-slider{padding:13px}
  .slider-section-head{align-items:flex-start;flex-direction:column}
  .slider-head-actions{width:100%;justify-content:flex-end}
  .slider-card-top{flex-direction:column}
  .slider-badges{justify-content:flex-start}
  .slider-detail-grid{grid-template-columns:1fr}
  .slider-bottom{align-items:flex-start;flex-direction:column}
  .slider-hint{font-size:8px}
}
@media(prefers-reduced-motion:reduce){
  .slider-account-card,.slider-track,.slider-dots button{transition:none!important}
  .slider-progress-line i{animation:none!important;width:100%!important}
}



/* ===== v6 Compact Auto-Sliding Account Profile Monitor ===== */
.account-profile-monitor{
  background:#fff;
  border:1px solid var(--line);
  border-radius:22px;
  padding:20px 22px;
  margin-bottom:18px;
  box-shadow:0 12px 34px rgba(64,91,120,.07);
  overflow:hidden
}
.monitor-head{
  display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:14px
}
.monitor-head h3{margin:0;font-size:22px;letter-spacing:-.3px}
.monitor-head p{margin:5px 0 0;color:#6f85a0;font-size:12px}
.monitor-actions{display:flex;align-items:center;gap:8px}
.monitor-actions button{
  width:42px;height:42px;border:1px solid #d4e1ed;background:#f8fbfe;color:#55799d;
  border-radius:12px;font-size:20px;cursor:pointer
}
.monitor-actions button:hover{background:#edf5fc}
.monitor-state{
  height:32px;display:flex;align-items:center;gap:7px;padding:0 10px;border-radius:999px;
  background:#eaf8f3;border:1px solid #cbeadd;color:#397762;font-size:9px;font-weight:900;letter-spacing:.6px
}
.monitor-state i{width:7px;height:7px;background:#35bf85;border-radius:50%;box-shadow:0 0 0 4px rgba(53,191,133,.10)}
.monitor-state.paused{background:#fff7e8;border-color:#f0deb8;color:#976d25}

.profile-carousel-viewport{
  overflow:hidden;
  width:100%;
  padding:2px 0;
  cursor:default
}
.profile-carousel-track{
  display:flex;
  gap:12px;
  width:max-content;
  align-items:stretch;
  will-change:transform;
  transform:translate3d(0,0,0)
}
.profile-slide-card{
  position:relative;
  display:flex;
  align-items:center;
  gap:11px;
  width:338px;
  min-width:338px;
  height:88px;
  padding:12px 13px;
  border:1px solid #d9e5ef;
  border-left:5px solid #f1b84c;
  border-radius:16px;
  background:linear-gradient(135deg,#fbfdff,#f7fbfe);
  color:var(--text);
  transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease
}
.profile-slide-card.done{border-left-color:#38bf83}
.profile-slide-card.overdue{border-left-color:#e86666}
.profile-slide-card:hover{
  transform:translateY(-2px);
  box-shadow:0 10px 24px rgba(68,96,125,.10);
  border-color:#c5d9e9
}
.compact-avatar{
  width:58px;height:58px;min-width:58px;border-radius:14px;overflow:hidden;position:relative;
  display:grid;place-items:center;background:linear-gradient(135deg,#dfeeff,#e0f8f3);
  color:#3976ad;font-size:20px;font-weight:900
}
.compact-avatar img{width:100%;height:100%;object-fit:cover}
.compact-avatar i{
  position:absolute;right:2px;top:2px;width:11px;height:11px;border-radius:50%;
  background:#ef6969;border:2px solid #fff
}
.done .compact-avatar i{background:#38bf83}
.waiting .compact-avatar i{background:#f1b84c}
.compact-info{min-width:0;flex:1}
.compact-info b{
  display:block;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis
}
.compact-info span{
  display:block;color:#5f7894;font-size:11px;margin-top:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis
}
.compact-info small{
  display:block;color:#8095aa;font-size:9px;margin-top:5px;text-transform:uppercase
}
.compact-arrow{
  width:26px;height:26px;display:grid;place-items:center;color:#6085aa;font-size:15px
}
.monitor-footer{
  display:flex;align-items:center;gap:12px;margin-top:12px
}
.monitor-footer>span{font-size:9px;color:#8093a6;white-space:nowrap}
.monitor-progress{
  flex:1;height:3px;background:#e8eef4;border-radius:999px;overflow:hidden
}
.monitor-progress i{
  display:block;width:0;height:100%;background:linear-gradient(90deg,#5b94e9,#42c5b7);border-radius:999px
}

@media(max-width:1100px){
  .profile-slide-card{width:300px;min-width:300px}
}
@media(max-width:700px){
  .account-profile-monitor{padding:15px}
  .monitor-head{align-items:flex-start;flex-direction:column}
  .monitor-actions{width:100%;justify-content:flex-end}
  .profile-slide-card{width:270px;min-width:270px;height:82px}
  .compact-avatar{width:52px;height:52px;min-width:52px}
  .monitor-head h3{font-size:18px}
  .monitor-footer{align-items:flex-start;flex-direction:column}
  .monitor-progress{width:100%}
}
@media(prefers-reduced-motion:reduce){
  .profile-carousel-track{transform:none!important}
}

/* ===== v6 DDI Unlimited-Width 3-Generation Network Tree ===== */
.network-topbar{gap:18px}.network-focus-panel{display:flex;align-items:center;justify-content:space-between;gap:20px;background:linear-gradient(125deg,#eef6ff,#fff 52%,#eefbf7);border:1px solid #d7e5f0;border-radius:20px;padding:18px 20px;margin-bottom:14px;box-shadow:0 10px 28px rgba(64,92,120,.06)}
.focus-copy span{font-size:8px;letter-spacing:1.2px;font-weight:900;color:#5682aa}.focus-copy h2{margin:4px 0 3px;font-size:21px}.focus-copy p{margin:0;color:#71869a;font-size:11px}.focus-copy p a{color:#3d7ebd;font-weight:800}
.network-user-picker{min-width:330px}.network-user-picker label{display:block;font-size:9px;font-weight:900;color:#7a8fa2;margin-bottom:6px}.network-user-picker>div{display:flex;gap:7px}.network-user-picker select{height:40px;min-width:0;flex:1;border:1px solid #d4e2ee;border-radius:10px;background:#fff;padding:0 10px;color:#36546f}.network-user-picker button{height:40px;border:0;border-radius:10px;background:#e8f3ff;color:#3977b5;font-weight:800;padding:0 13px;cursor:pointer}
.network-stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:14px}.network-stat-grid article{background:#fff;border:1px solid #dbe6ef;border-radius:16px;padding:14px 16px;position:relative;overflow:hidden}.network-stat-grid article:before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:#6fa8df}.network-stat-grid article:nth-child(2):before{background:#52b9a8}.network-stat-grid article:nth-child(3):before{background:#b18add}.network-stat-grid article.network-total:before{background:#efb456}.network-stat-grid span,.network-stat-grid b,.network-stat-grid small{display:block}.network-stat-grid span{font-size:8px;color:#7b90a3;font-weight:900;letter-spacing:.7px}.network-stat-grid b{font-size:25px;margin:3px 0 1px}.network-stat-grid small{font-size:9px;color:#8a9bab}
.network-toolbar{display:flex;justify-content:space-between;gap:14px;align-items:center;background:#fff;border:1px solid #dce6ef;border-radius:14px;padding:9px 12px;margin-bottom:10px}.generation-legend{display:flex;gap:15px;flex-wrap:wrap}.generation-legend span{font-size:9px;color:#657d93;font-weight:700;display:flex;align-items:center;gap:5px}.legend-dot{width:8px;height:8px;border-radius:50%;display:inline-block}.legend-dot.g1{background:#5b9ee4}.legend-dot.g2{background:#52b9a8}.legend-dot.g3{background:#aa84d2}.tree-tools{display:flex;align-items:center;gap:5px}.tree-tools button{height:30px;min-width:30px;border:1px solid #d6e2ec;border-radius:8px;background:#f8fbfe;color:#4b7397;cursor:pointer;font-weight:900}.tree-tools span{min-width:45px;text-align:center;font-size:9px;font-weight:800;color:#71869a}.tree-tools .fit-tree{padding:0 9px;font-size:9px}
.network-tree-shell{background:radial-gradient(circle at 50% 0,#f7fbff 0,#f2f7fb 45%,#edf3f8 100%);border:1px solid #d6e2ec;border-radius:22px;min-height:560px;overflow:auto;padding:32px 28px 60px;box-shadow:inset 0 1px 0 #fff}.network-tree-stage{width:max-content;min-width:100%;transform-origin:top center}.network-tree{display:flex;justify-content:center;width:max-content;min-width:100%;padding:0 12px}.network-tree ul{padding-top:34px;position:relative;display:flex;justify-content:center;margin:0;padding-left:0}.network-tree li{list-style-type:none;text-align:center;position:relative;padding:34px 9px 0}.network-tree li::before,.network-tree li::after{content:"";position:absolute;top:0;right:50%;border-top:1.5px solid #b9cddd;width:50%;height:34px}.network-tree li::after{right:auto;left:50%;border-left:1.5px solid #b9cddd}.network-tree li:only-child::after,.network-tree li:only-child::before{display:none}.network-tree li:only-child{padding-top:0}.network-tree li:first-child::before,.network-tree li:last-child::after{border:0 none}.network-tree li:last-child::before{border-right:1.5px solid #b9cddd;border-radius:0 8px 0 0}.network-tree li:first-child::after{border-radius:8px 0 0 0}.network-tree ul ul::before{content:"";position:absolute;top:0;left:50%;border-left:1.5px solid #b9cddd;width:0;height:34px}
.network-node{width:168px;min-height:148px;display:block;text-align:left;background:linear-gradient(180deg,#fff,#f9fcff);border:1px solid #cadbe8;border-radius:16px;padding:11px;box-shadow:0 9px 24px rgba(68,97,126,.08);position:relative;transition:transform .18s,box-shadow .18s,border-color .18s}.network-node:hover{transform:translateY(-4px);box-shadow:0 16px 32px rgba(62,101,138,.15);border-color:#91b9d9}.network-node.focus-node{width:184px;background:linear-gradient(145deg,#eaf5ff,#fff 58%,#eafaf6);border-color:#83b6dc;box-shadow:0 15px 35px rgba(65,118,165,.16)}.network-node-top{display:flex;align-items:flex-start;justify-content:space-between;gap:7px;margin-bottom:7px}.network-avatar{width:42px;height:42px;border-radius:12px;overflow:hidden;background:#e5f1fb;flex:0 0 auto}.network-avatar img,.network-avatar-fallback{width:100%;height:100%;object-fit:cover}.network-avatar-fallback{display:grid;place-items:center;color:#3e7fb9;font-size:15px;font-weight:900}.relative-gen{font-size:7px;font-weight:900;letter-spacing:.55px;padding:5px 6px;border-radius:999px;background:#edf3f8;color:#5f7991;white-space:nowrap}.relative-gen.gen-0{background:#e0f0ff;color:#3478b3}.relative-gen.gen-1{background:#e7f2ff;color:#477fb2}.relative-gen.gen-2{background:#e7f8f4;color:#3d897b}.relative-gen.gen-3{background:#f2eafb;color:#7e5ca5}.network-node>b{display:block;font-size:11px;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#26394a}.network-ddi{display:block;font-size:8px;color:#7d91a3;margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.network-node-meta{display:flex;justify-content:space-between;gap:5px;margin-top:9px;border-top:1px solid #e4ebf1;padding-top:7px}.network-node-meta span{font-size:8px;color:#7890a4}.network-node-meta strong{font-size:10px;color:#3d729f}.open-tree-hint{font-size:7px;color:#4e8dc4;font-weight:800;margin-top:7px;opacity:.82}.cycle-warning{background:#fff2f2;border:1px solid #efcaca;color:#a45b5b;border-radius:10px;padding:8px;font-size:9px}
.network-rule-note{margin-top:12px;background:#fff;border:1px solid #d9e5ef;border-radius:14px;padding:12px 14px;color:#657d92;font-size:10px;line-height:1.6}.network-rule-note b{color:#344f68}.network-rule-note strong{color:#3b78ae}
@media(max-width:1000px){.network-stat-grid{grid-template-columns:repeat(2,1fr)}.network-focus-panel{align-items:stretch;flex-direction:column}.network-user-picker{min-width:0}}
@media(max-width:650px){.network-stat-grid{grid-template-columns:1fr 1fr}.network-toolbar{align-items:flex-start;flex-direction:column}.network-tree-shell{padding-left:12px;padding-right:12px}.network-node{width:150px}.network-node.focus-node{width:165px}}

/* v7 Global Profile / Country Intelligence */
.country-route-card{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:10px;margin-top:10px;padding:11px 12px;border:1px solid #dfeaf2;border-radius:14px;background:linear-gradient(135deg,#fbfdff,#f2f8f7)}
.country-route-card>div{min-width:0}.country-route-card small{display:block;font-size:7px;letter-spacing:.65px;font-weight:900;color:#8697a7;margin-bottom:4px}.country-route-card b{display:block;font-size:10px;color:#24435f;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.country-route-card em{display:block;margin-top:3px;font-size:8px;color:#7f92a4;font-style:normal}.route-arrow{width:27px;height:27px;border-radius:999px;background:#e7f6f2;display:grid;place-items:center;color:#3d9d8f;font-weight:900}
.focus-country-route{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:8px;font-size:11px;font-weight:800;color:#4b6f8e}.focus-country-route i{font-style:normal;color:#40a394;background:#e7f7f3;width:24px;height:24px;border-radius:999px;display:grid;place-items:center}
.network-node{width:190px;min-height:184px}.network-node.focus-node{width:205px}.network-country-route{display:flex;align-items:center;gap:4px;margin-top:7px;padding:5px 6px;border-radius:9px;background:#f3f8fb;border:1px solid #e2ebf1;white-space:nowrap;overflow:hidden}.network-country-route span{font-size:7px;color:#56758e;overflow:hidden;text-overflow:ellipsis}.network-country-route i{font-style:normal;color:#45a696;font-weight:900;flex:0 0 auto}.network-location,.network-phone{font-size:7px;color:#7b90a2;margin-top:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.network-location{color:#4c7f84}
@media(max-width:650px){.network-node{width:170px}.network-node.focus-node{width:185px}.country-route-card{grid-template-columns:1fr}.route-arrow{transform:rotate(90deg);margin:auto}}
.compact-country-route{display:block;margin-top:3px;font-style:normal;font-size:8px;color:#64839d;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* ===== v8 Living Leadership Network Tree ===== */
.network-tree-shell{
  position:relative;
  background:
    radial-gradient(circle at 50% -10%,rgba(91,158,228,.13),transparent 34%),
    radial-gradient(circle at 15% 45%,rgba(82,185,168,.07),transparent 28%),
    linear-gradient(180deg,#f9fcff 0%,#f2f7fb 54%,#eef4f8 100%);
  border-color:#cfdeea;
}
.network-tree-shell:before{
  content:"";position:absolute;inset:0;pointer-events:none;border-radius:inherit;opacity:.48;
  background-image:linear-gradient(rgba(95,135,170,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(95,135,170,.035) 1px,transparent 1px);
  background-size:28px 28px;
}
.network-tree-stage{position:relative;isolation:isolate;padding:10px 4px 18px}
.network-connectors{position:absolute;inset:0;z-index:0;overflow:visible;pointer-events:none}
.network-tree{position:relative;z-index:2}
/* Hide legacy CSS elbow connectors; v8 SVG draws exact leader-to-member paths. */
.network-tree li::before,.network-tree li::after,.network-tree ul ul::before{display:none!important}
.network-tree ul{padding-top:46px}
.network-tree li{padding:46px 12px 0}
.network-tree>ul>li{padding-top:0}
.connector-base{fill:none;stroke:#b9ccdc;stroke-width:2.2;stroke-linecap:round;vector-effect:non-scaling-stroke;opacity:.88}
.connector-flow{fill:none;stroke:#5f9fd6;stroke-width:2.4;stroke-linecap:round;stroke-dasharray:4 12;vector-effect:non-scaling-stroke;opacity:.82;animation:ddiFlow 1.6s linear infinite}
.connector-group:nth-child(3n+2) .connector-flow{stroke:#55ad9d;animation-duration:1.85s}
.connector-group:nth-child(3n+3) .connector-flow{stroke:#8e7bbb;animation-duration:2.05s}
.connector-group.is-active .connector-base{stroke:#72a8d2;stroke-width:4;opacity:.45}
.connector-group.is-active .connector-flow{stroke:#2f83c6;stroke-width:3.4;opacity:1;filter:drop-shadow(0 0 3px rgba(47,131,198,.25))}
.motion-paused .connector-flow{animation-play-state:paused;opacity:.45}
@keyframes ddiFlow{to{stroke-dashoffset:-32}}
.network-node:before,.network-node:after{content:"";position:absolute;left:50%;transform:translateX(-50%);width:9px;height:9px;border-radius:50%;background:#fff;border:2px solid #90b4d0;box-shadow:0 0 0 3px rgba(144,180,208,.12);z-index:3}
.network-node:before{top:-6px}.network-node:after{bottom:-6px}
.network-tree>ul>li>.network-node:before{display:none}
.network-node{box-shadow:0 10px 26px rgba(53,83,112,.09),0 1px 0 rgba(255,255,255,.9) inset;backdrop-filter:blur(8px);transform:translateZ(0)}
.network-node:hover,.network-node:focus-visible{transform:translateY(-5px) scale(1.018);box-shadow:0 18px 38px rgba(58,103,144,.17);outline:none}
.network-node:hover:before,.network-node:hover:after,.network-node:focus-visible:before,.network-node:focus-visible:after{background:#4e95ce;border-color:#fff;box-shadow:0 0 0 4px rgba(78,149,206,.16)}
.network-node.focus-node{border-width:1.5px;box-shadow:0 16px 42px rgba(60,119,164,.19)}
.network-node.focus-node:after{animation:focusPort 2.2s ease-in-out infinite}
@keyframes focusPort{0%,100%{box-shadow:0 0 0 3px rgba(78,149,206,.12)}50%{box-shadow:0 0 0 8px rgba(78,149,206,.04)}}
.tree-tools .motion-toggle{min-width:86px;padding:0 10px;color:#397c73;background:#effaf7;border-color:#cfeae4;font-size:8px;letter-spacing:.2px}
.tree-tools .motion-toggle[aria-pressed="false"]{color:#7b8792;background:#f5f7f9;border-color:#dfe5ea}
.generation-legend .legend-dot{box-shadow:0 0 0 3px rgba(100,140,175,.08)}
@media(prefers-reduced-motion:reduce){.connector-flow,.network-node.focus-node:after{animation:none!important}.network-node{transition:none}}
@media(max-width:650px){.network-tree ul{padding-top:38px}.network-tree li{padding:38px 9px 0}.tree-tools{flex-wrap:wrap}}

/* ===== v9 Universal Searchable Dropdown ===== */
.ddi-search-select{position:relative;width:100%;min-width:0}
.ddi-search-select .ddi-select-native{position:absolute!important;opacity:0!important;pointer-events:none!important;width:1px!important;height:1px!important;overflow:hidden!important}
.ddi-select-trigger{width:100%;min-height:48px;border:1px solid #cbddec;border-radius:14px;background:#fff;color:#173a5c;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:0 14px;font:inherit;text-align:left;cursor:pointer;transition:border-color .18s ease,box-shadow .18s ease,background .18s ease}
.ddi-select-trigger:hover{border-color:#9dbbd3;background:#fbfdff}
.ddi-select-trigger:focus-visible{outline:none;border-color:#4f93d8;box-shadow:0 0 0 3px rgba(79,147,216,.14)}
.ddi-select-trigger .ddi-select-value{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}
.ddi-select-chevron{font-size:12px;color:#63819c;transition:transform .18s ease;flex:0 0 auto}
.ddi-search-select.open .ddi-select-chevron{transform:rotate(180deg)}
.ddi-select-panel{position:absolute;z-index:1200;left:0;right:0;top:calc(100% + 7px);background:rgba(255,255,255,.98);border:1px solid #c9dceb;border-radius:16px;box-shadow:0 18px 45px rgba(24,58,91,.16);padding:10px;display:none;backdrop-filter:blur(10px)}
.ddi-search-select.open .ddi-select-panel{display:block;animation:ddiDropIn .16s ease-out}
@keyframes ddiDropIn{from{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}
.ddi-select-search-wrap{position:relative;margin-bottom:8px}
.ddi-select-search{width:100%!important;min-height:42px!important;border:1px solid #d4e2ee!important;border-radius:11px!important;padding:9px 38px 9px 12px!important;background:#f8fbfe!important;color:#173a5c!important;font-size:14px!important;box-sizing:border-box!important}
.ddi-select-search:focus{outline:none!important;border-color:#6c9fd0!important;box-shadow:0 0 0 3px rgba(75,143,207,.10)!important}
.ddi-select-search-icon{position:absolute;right:12px;top:50%;transform:translateY(-50%);color:#7b93aa;font-size:15px;pointer-events:none}
.ddi-select-options{max-height:260px;overflow:auto;overscroll-behavior:contain;padding:2px;scrollbar-width:thin}
.ddi-select-option{width:100%;border:0;background:transparent;color:#274b6c;border-radius:10px;padding:10px 11px;display:flex;align-items:center;gap:8px;text-align:left;cursor:pointer;font:inherit;line-height:1.35;transition:background .12s ease,color .12s ease}
.ddi-select-option:hover,.ddi-select-option.active{background:#eef6fd;color:#0f4b7d}
.ddi-select-option.selected{background:linear-gradient(135deg,#e8f3ff,#edf9f6);color:#0a4976;font-weight:800}
.ddi-select-empty{padding:18px 10px;text-align:center;color:#8295a8;font-size:13px}
.ddi-select-count{padding:7px 9px 2px;color:#8a9cad;font-size:10px;font-weight:800;letter-spacing:.07em;text-transform:uppercase}
@media(max-width:760px){.ddi-select-panel{position:fixed;left:12px;right:12px;top:auto;bottom:12px;max-height:65%;border-radius:20px}.ddi-select-options{max-height:310px}.ddi-select-trigger{min-height:50px}}

/* ===== v10 Professional Country Icons + Flag UI ===== */
.ddi-icon{width:16px;height:16px;display:inline-block;vertical-align:-3px;flex:0 0 auto}
.label-with-icon{display:flex!important;align-items:center;gap:7px;color:#476b8e!important}
.label-with-icon .ddi-icon{width:15px;height:15px;color:#3d7fb6}
.global-profile-icon .ddi-icon{width:23px;height:23px}
.professional-country-line{gap:7px!important;align-items:center;flex-wrap:wrap}
.country-role{display:inline-flex;align-items:center;gap:5px;padding:5px 8px;border:1px solid #dce8f1;border-radius:10px;background:#fff;color:#4f6f8d}
.country-role .ddi-icon{width:13px;height:13px;color:#4b84b5}.country-role b{font-size:8px;letter-spacing:.06em;text-transform:uppercase;color:#7690a6}.country-role em{font-style:normal}
.country-flag-badge{display:inline-grid;place-items:center;min-width:25px;height:21px;padding:0 4px;border-radius:7px;background:#fff;border:1px solid #dce7ef;box-shadow:0 2px 7px rgba(43,74,101,.07);font-size:16px;line-height:1}
.country-route-arrow{color:#42a394!important;background:#e8f7f3;border-radius:999px;width:22px;height:22px;display:grid;place-items:center}
.country-route-card .country-card-side small{display:flex;align-items:center;gap:5px}.country-route-card .country-card-side small .ddi-icon{width:12px;height:12px;color:#4a84b3}.country-route-card .country-card-side em{display:flex;align-items:center;gap:4px}.country-route-card .country-card-side em .ddi-icon{width:11px;height:11px}

/* Searchable country dropdowns: real flag badge + professional row */
.ddi-select-value.country-value{display:flex!important;align-items:center;gap:8px}
.ddi-option-flag,.ddi-trigger-flag{display:inline-grid;place-items:center;width:29px;height:24px;border-radius:7px;background:#fff;border:1px solid #dae6ee;box-shadow:0 2px 6px rgba(46,76,101,.06);font-size:18px;line-height:1;flex:0 0 auto}
.ddi-option-copy{display:flex;flex-direction:column;min-width:0;line-height:1.15}.ddi-option-copy b{font-size:12px;color:#244b6b;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ddi-option-copy small{font-size:9px;color:#8799aa;margin-top:3px}.ddi-select-option.selected .ddi-option-copy b{color:#0a4976}.ddi-country-code{margin-left:auto;font-size:9px;color:#8296a7;font-weight:800;background:#f3f7fa;border-radius:999px;padding:4px 7px}

/* Dashboard slider: origin -> current country always visible */
.slider-country-journey{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-top:7px}
.slider-country-chip{display:inline-flex;align-items:center;gap:4px;min-width:0;border:1px solid #dde9f1;background:#f7fbfe;border-radius:9px;padding:4px 6px;color:#56738b}
.slider-country-chip.current{background:#f2faf7;border-color:#d8ebe5}.slider-country-chip .ddi-icon{width:11px;height:11px;color:#5684ab}.slider-country-chip.current .ddi-icon{color:#3d9b88}.slider-country-chip i{font-style:normal;font-size:16px;line-height:1}.slider-country-chip b{font-size:8px;max-width:88px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.slider-country-arrow{font-size:10px;font-weight:900;color:#3f9c8d}.slider-current-city{display:flex!important;align-items:center;gap:4px;margin-top:5px!important;color:#71899d!important}.slider-current-city .ddi-icon{width:10px;height:10px}

/* Tree country journey */
.network-country-route.professional-route{padding:5px!important;gap:3px!important}.professional-route .route-side{display:flex;align-items:center;gap:3px;min-width:0;flex:1}.professional-route .route-side .ddi-icon{width:9px;height:9px;color:#5981a2}.professional-route .route-side.current .ddi-icon{color:#3b9a87}.professional-route .route-side em{font-style:normal;font-size:13px;line-height:1}.professional-route .route-side b{font-size:6.5px;font-weight:800;color:#617b91;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media(max-width:600px){.slider-country-chip b{max-width:68px}.country-role{max-width:100%}}

/* v11 — reliable visual country flags + premium profile badges */
.country-flag-media{display:inline-grid;place-items:center;width:29px;height:21px;border-radius:5px;overflow:hidden;flex:0 0 auto;background:#eef4f8;border:1px solid rgba(15,55,86,.13);box-shadow:0 2px 6px rgba(15,55,86,.10);vertical-align:middle;position:relative}
.country-flag-media img{width:100%;height:100%;object-fit:cover;display:block}
.country-flag-media .country-flag-fallback{width:100%;height:100%;place-items:center;font-size:9px;font-style:normal;font-weight:900;letter-spacing:.05em;color:#234765;background:linear-gradient(145deg,#f8fbfd,#dfeaf1)}
.country-flag-media.country-flag-empty{background:#f2f5f7}
.country-flag-badge .country-flag-media{width:27px;height:19px;margin-right:5px}
.profile-photo-flags{position:absolute;left:50%;bottom:-10px;transform:translateX(-50%);display:flex;align-items:center;gap:4px;padding:3px 5px;border-radius:9px;background:rgba(255,255,255,.97);border:1px solid rgba(28,72,109,.12);box-shadow:0 5px 14px rgba(25,65,99,.16);z-index:4;white-space:nowrap}
.profile-photo-flags .country-flag-media{width:26px;height:18px;border-radius:4px}
.profile-photo-flags .origin-flag::after,.profile-photo-flags .current-flag::after{position:absolute;right:1px;bottom:1px;display:grid;place-items:center;width:7px;height:7px;border-radius:50%;color:#fff;font-size:5px;font-weight:900;border:1px solid rgba(255,255,255,.9)}
.profile-photo-flags .origin-flag::after{content:'O';background:#174c7b}.profile-photo-flags .current-flag::after{content:'C';background:#2d9b8f}
.profile,.profile-lg,.compact-avatar,.profile-edit-avatar,.network-avatar{position:relative;overflow:visible!important}
.profile-lg{margin-bottom:8px}.compact-avatar{margin-bottom:9px}.network-avatar{margin-bottom:8px}.profile-edit-avatar{margin-bottom:10px}
.visual-country-chip{display:inline-flex;align-items:center;gap:7px;min-width:0}.visual-country-chip b{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.slider-country-chip .country-flag-media{width:24px;height:17px}
.network-country-route .country-flag-media{width:25px;height:18px}
.focus-country-route .country-flag-media{width:28px;height:20px}
.profile-country-line .country-flag-media{width:27px;height:19px}
.phone-country>.country-flag-media{width:37px;height:27px;border-radius:6px}
.flag-pair-label{font-size:9px;line-height:1;text-transform:uppercase;font-weight:900;letter-spacing:.05em;color:#7690a6}
@media(max-width:760px){.profile-photo-flags{bottom:-8px}.profile-photo-flags .country-flag-media{width:23px;height:16px}}
.ddi-visual-flag{display:inline-grid;place-items:center;overflow:hidden;background:#eef4f8;border:1px solid #dae6ee;box-shadow:0 2px 6px rgba(46,76,101,.07)}
.ddi-visual-flag img{width:100%;height:100%;object-fit:cover;display:block}
.ddi-visual-flag .ddi-flag-code{width:100%;height:100%;place-items:center;font-size:9px;font-weight:900;letter-spacing:.04em;color:#254a67;background:linear-gradient(145deg,#f8fbfd,#e3edf3)}
.ddi-option-flag,.ddi-trigger-flag{font-size:0!important;overflow:hidden!important;padding:0!important}

/* ===== v12 Clean Premium Country UI =====
   Flags belong to country information, never on top of profile photos. */
.profile-photo-flags{display:none!important}
.profile,.profile-lg,.compact-avatar,.profile-edit-avatar,.network-avatar{overflow:hidden!important}
.profile-lg,.compact-avatar,.profile-edit-avatar,.network-avatar{margin-bottom:0!important}

/* Smaller, calm visual flags */
.country-flag-media{width:20px;height:14px;border-radius:3px;border:1px solid rgba(20,57,85,.12);box-shadow:0 1px 3px rgba(20,57,85,.08)}
.country-flag-media .country-flag-fallback{font-size:6px;letter-spacing:0}
.country-flag-badge .country-flag-media{width:20px;height:14px;margin-right:4px}
.phone-country>.country-flag-media{width:24px;height:17px;border-radius:4px}
.slider-country-chip .country-flag-media{width:18px;height:13px;border-radius:3px}
.network-country-route .country-flag-media{width:18px;height:13px;border-radius:3px}
.focus-country-route .country-flag-media{width:20px;height:14px;border-radius:3px}
.profile-country-line .country-flag-media{width:19px;height:14px;border-radius:3px}

/* Cleaner account country blocks */
.phone-country{gap:8px;padding:8px 10px;margin-top:12px;background:#fbfcfe;border-color:#e3ebf2;box-shadow:none}
.phone-country small{font-size:7px;letter-spacing:.55px}
.phone-country b{font-size:11px}
.country-route-card{gap:8px;padding:9px 10px;margin-top:8px;border-radius:12px;background:#fbfdfd;border-color:#e1eaf0;box-shadow:none}
.country-route-card small{font-size:6.5px;letter-spacing:.55px;margin-bottom:3px;color:#8495a5}
.country-route-card b{font-size:9.5px;font-weight:750;color:#213f59}
.country-route-card .country-card-side small .ddi-icon{width:9px;height:9px;color:#5a8aac}
.country-route-card .country-card-side em .ddi-icon{width:9px;height:9px}
.route-arrow{width:22px;height:22px;font-size:11px;background:#edf7f4;color:#47988f}

/* Keep the header clean: portrait, identity and generation only */
.account-head{align-items:center}
.account-head .profile{flex:0 0 auto}

/* Tree and slider: tiny flags with readable labels */
.network-country-route{gap:5px!important}
.network-country-route .route-side{gap:4px!important}
.network-country-route .ddi-icon{width:9px!important;height:9px!important}
.slider-country-chip{gap:4px!important}
.slider-country-chip .ddi-icon{width:9px!important;height:9px!important}

@media(max-width:650px){
  .country-route-card{grid-template-columns:1fr auto 1fr}
  .route-arrow{transform:none;margin:0}
  .country-flag-media{width:18px;height:13px}
  .phone-country>.country-flag-media{width:22px;height:16px}
}


/* ===== v13 Compact Decision Tree + Premium Reports + Delete Actions ===== */
.tree-generation-filter{display:flex;align-items:center;gap:7px;flex-wrap:wrap}.tree-generation-filter>span{font-size:8px;font-weight:900;letter-spacing:.12em;color:#8295a8;margin-right:2px}.tree-generation-filter a{padding:7px 10px;border:1px solid #d7e3ec;border-radius:999px;background:#fff;color:#617b91;font-size:9px;font-weight:900}.tree-generation-filter a.active{background:#153f66;color:#fff;border-color:#153f66;box-shadow:0 6px 16px rgba(21,63,102,.14)}
.compact-network-node.network-node{width:112px!important;min-height:0!important;padding:8px 7px 7px!important;border-radius:14px!important;text-align:center!important;display:flex!important;flex-direction:column;align-items:center;gap:4px;background:rgba(255,255,255,.96)!important}.compact-network-node.focus-node{width:122px!important}.compact-network-node:before,.compact-network-node:after{width:7px;height:7px}.compact-node-photo{width:38px;height:38px;border-radius:11px;overflow:hidden;background:#e8f1f7;border:1px solid #d5e2eb}.compact-node-photo img,.compact-node-photo .network-avatar-fallback{width:100%;height:100%;object-fit:cover}.compact-node-copy{width:100%;min-width:0}.compact-node-copy b{display:block;font-size:9px;line-height:1.2;color:#203b53;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.compact-node-copy span{display:block;margin-top:2px;font-size:7px;color:#8395a6;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.compact-gen-pill{font-style:normal;font-size:6.5px;font-weight:900;letter-spacing:.06em;color:#52758e;background:#edf4f8;border-radius:999px;padding:3px 6px}.compact-network-node.focus-node .compact-gen-pill{background:#e2f0fb;color:#2f76ae}.node-hover-card{position:absolute;left:50%;bottom:calc(100% + 12px);transform:translate(-50%,8px);width:240px;padding:12px;border-radius:15px;background:rgba(16,43,68,.97);color:#fff;text-align:left;box-shadow:0 18px 46px rgba(17,43,67,.28);opacity:0;visibility:hidden;pointer-events:none;transition:.16s ease;z-index:50}.node-hover-card:after{content:"";position:absolute;top:100%;left:50%;margin-left:-6px;border:6px solid transparent;border-top-color:rgba(16,43,68,.97)}.compact-network-node:hover .node-hover-card,.compact-network-node:focus-visible .node-hover-card{opacity:1;visibility:visible;transform:translate(-50%,0)}.node-hover-title{display:flex;justify-content:space-between;gap:8px;align-items:center;border-bottom:1px solid rgba(255,255,255,.12);padding-bottom:7px;margin-bottom:6px}.node-hover-title b{font-size:11px}.node-hover-title span{font-size:7px;background:rgba(255,255,255,.1);padding:3px 5px;border-radius:999px}.node-hover-card>div:not(.node-hover-title){display:grid;grid-template-columns:66px 1fr;gap:6px;padding:3px 0}.node-hover-card small{font-size:7px;color:#9eb3c4}.node-hover-card strong{font-size:8px;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.node-hover-card .country-flag-media{width:18px;height:13px;border-radius:3px}.node-hover-meta{display:flex!important;gap:5px!important;grid-template-columns:none!important;margin-top:5px;flex-wrap:wrap}.node-hover-meta span{font-size:7px;background:rgba(255,255,255,.09);border-radius:999px;padding:3px 5px}.node-hover-card em{display:block;margin-top:7px;font-size:7px;color:#a9d5f2;font-style:normal}.network-tree ul{padding-top:38px!important}.network-tree li{padding:38px 7px 0!important}.network-tree>ul>li{padding-top:0!important}
.inline-delete-form{display:contents}.account-actions .delete-action{border:1px solid #f0d3d3!important;background:#fff8f8!important;color:#b65555!important;cursor:pointer}.account-actions .delete-action svg{fill:currentColor}.danger-link-btn{display:inline-flex;align-items:center;justify-content:center;padding:11px 14px;border-radius:12px;border:1px solid #efcece;color:#b64e4e;background:#fff8f8;font-weight:800;font-size:12px}.access-actions{margin-left:auto;display:flex;gap:6px;align-items:center}.access-actions form{margin:0}.icon-delete{width:34px;height:34px;border:1px solid #efd4d4;border-radius:9px;background:#fff8f8;color:#b75959;cursor:pointer;font-size:16px}.icon-delete:hover{background:#fff0f0}
.slider-quick-meta{display:flex;gap:5px;flex-wrap:wrap;margin-top:5px}.slider-quick-meta span{display:inline-flex!important;gap:3px;align-items:center;padding:3px 5px;border-radius:7px;background:#f3f7fa;color:#7a90a4!important;font-size:7px!important}.slider-quick-meta b{font-size:7px!important;color:#395f7d!important}.profile-slide-card{min-width:315px!important;border-radius:16px!important;background:linear-gradient(145deg,#fff,#f9fcff)!important;box-shadow:0 8px 22px rgba(41,76,108,.07)}
.report-filter-card{display:flex;align-items:flex-end;justify-content:space-between;gap:14px;flex-wrap:wrap;background:#fff;border:1px solid #d8e4ed;border-radius:18px;padding:14px 16px;margin-bottom:14px;box-shadow:0 8px 24px rgba(45,78,108,.06)}.report-range-form{display:flex;gap:9px;align-items:flex-end;flex-wrap:wrap}.report-range-form>div{min-width:170px}.report-range-form label{display:block;font-size:8px;font-weight:900;letter-spacing:.08em;color:#7990a5;margin-bottom:5px}.report-range-form input{min-height:42px}.report-preset,.export-btn{height:42px;display:inline-flex;align-items:center;justify-content:center;padding:0 12px;border-radius:11px;border:1px solid #d7e3ec;background:#f8fbfd;color:#4d708e;font-size:10px;font-weight:900}.report-preset.active{background:#e9f3fb;color:#236da7;border-color:#bbd7ea}.report-export-actions{display:flex;gap:7px}.export-btn.pdf{background:#fff5f5;color:#b44f4f;border-color:#efd1d1}.export-btn.excel{background:#eef9f3;color:#2d8161;border-color:#cfe8db}.report-summary-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:14px}.report-summary-grid article{background:#fff;border:1px solid #dce6ee;border-radius:16px;padding:14px}.report-summary-grid span{display:block;font-size:8px;font-weight:900;letter-spacing:.1em;color:#8194a6}.report-summary-grid b{display:block;font-size:22px;color:#173b5d;margin:4px 0 2px}.report-summary-grid small{color:#8194a6;font-size:8px}.report-table-card{background:#fff;border:1px solid #dae5ed;border-radius:18px;padding:14px;box-shadow:0 8px 24px rgba(45,78,108,.05)}.report-table-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}.report-table-head h3{margin:0;font-size:15px}.report-table-head p{margin:3px 0 0;color:#8194a6;font-size:9px}.report-table-head>span{font-size:9px;background:#eff5f9;color:#607b92;padding:5px 8px;border-radius:999px}.report-table-scroll{overflow:auto}.premium-report-table{width:100%;border-collapse:collapse;min-width:850px}.premium-report-table th{text-align:left;padding:9px 8px;border-bottom:1px solid #dfe8ef;color:#7890a4;font-size:8px;letter-spacing:.06em}.premium-report-table td{padding:9px 8px;border-bottom:1px solid #edf2f6;font-size:9px;color:#506c83}.premium-report-table td b{display:block;color:#263f55;font-size:10px}.premium-report-table td small{display:block;color:#899aa9;font-size:7px;margin-top:2px}.report-avatar{width:34px;height:34px;border-radius:10px;overflow:hidden;background:#e8f0f5;display:grid;place-items:center}.report-avatar img{width:100%;height:100%;object-fit:cover}.report-avatar span{font-weight:900;color:#4d7798}.report-gen{font-size:7px;font-weight:900;background:#eef4f8;border-radius:999px;padding:4px 6px}.done-number{color:#288362}.missing-number{color:#b55454}.rate-cell{display:flex;align-items:center;gap:6px}.rate-cell>span{width:70px;height:5px;background:#e8eef3;border-radius:999px;overflow:hidden}.rate-cell>span i{display:block;height:100%;background:#55a68c;border-radius:999px}.rate-cell b{font-size:8px!important;min-width:30px}
@media(max-width:800px){.report-summary-grid{grid-template-columns:1fr 1fr}.report-filter-card{align-items:stretch}.report-range-form{width:100%}.report-range-form>div{flex:1;min-width:145px}.node-hover-card{width:205px}.profile-slide-card{min-width:280px!important}}

/* ===== v25 Clean Compact Account Directory ===== */
.premium-account-grid{
  gap:14px!important;
  grid-template-columns:repeat(auto-fit,minmax(300px,1fr))!important;
}
.account-card{
  padding:16px 16px 13px!important;
  border-radius:18px!important;
  box-shadow:0 8px 22px rgba(31,65,94,.055)!important;
}
.account-card .card-accent{height:3px!important;border-radius:18px 18px 0 0!important}
.account-head{gap:11px!important;margin-bottom:10px!important}
.account-head .profile-lg{width:58px!important;height:58px!important;min-width:58px!important}
.account-head .profile-lg img,.account-head .profile-lg .profile-fallback{width:58px!important;height:58px!important}
.account-id small{font-size:7px!important;letter-spacing:.08em!important}
.account-id b{font-size:18px!important;line-height:1.12!important;margin-top:2px!important}
.account-id span{font-size:10px!important;margin-top:3px!important}
.gen-badge{padding:6px 10px!important;font-size:9px!important;border-radius:999px!important}
.phone-country{min-height:0!important;padding:8px 10px!important;margin-top:8px!important;border-radius:11px!important}
.phone-country>.country-flag-media{width:20px!important;height:14px!important;border-radius:3px!important}
.phone-country small{font-size:6.5px!important}.phone-country b{font-size:10.5px!important}
.country-route-card{padding:8px 10px!important;margin-top:7px!important;gap:6px!important;border-radius:11px!important}
.country-route-card small{font-size:6px!important}.country-route-card b{font-size:9px!important}
.country-route-card .country-flag-media{width:16px!important;height:11px!important;border-radius:2px!important}
.route-arrow{width:20px!important;height:20px!important;font-size:10px!important}
.account-meta{padding:11px 0 8px!important;margin-top:8px!important;gap:9px!important}
.account-meta span{font-size:7px!important}.account-meta b{font-size:10px!important;margin-top:2px!important}
.account-status{min-height:28px!important;padding:3px 0!important;margin-bottom:8px!important;gap:6px!important}
.account-status i{width:9px!important;height:9px!important}.account-status b{font-size:10px!important}.account-status span{font-size:8px!important}

.account-actions-compact{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:7px!important;
  padding-top:8px!important;
  border-top:1px solid #e6edf3!important;
}
.account-actions-compact .icon-action{
  position:relative;
  width:36px!important;
  height:36px!important;
  min-width:36px!important;
  padding:0!important;
  border-radius:10px!important;
  display:inline-grid!important;
  place-items:center!important;
  border:1px solid #d8e4ed!important;
  background:#fff!important;
  color:#557997!important;
  box-shadow:none!important;
  transition:transform .15s ease,border-color .15s ease,background .15s ease,color .15s ease!important;
}
.account-actions-compact .icon-action svg{width:15px!important;height:15px!important;fill:currentColor!important;margin:0!important}
.account-actions-compact .icon-action>span{
  position:absolute;
  left:50%;bottom:calc(100% + 7px);
  transform:translate(-50%,4px);
  opacity:0;visibility:hidden;pointer-events:none;
  white-space:nowrap;
  background:#173b5d;color:#fff;
  font-size:8px;font-weight:800;
  padding:5px 7px;border-radius:7px;
  transition:.15s ease;
  z-index:30;
}
.account-actions-compact .icon-action>span:after{content:"";position:absolute;top:100%;left:50%;margin-left:-4px;border:4px solid transparent;border-top-color:#173b5d}
@media(hover:hover) and (pointer:fine){
  .account-actions-compact .icon-action:hover{transform:translateY(-1px);border-color:#bdd1e1!important;background:#f7fbfe!important;color:#285f8c!important}
  .account-actions-compact .icon-action:hover>span{opacity:1;visibility:visible;transform:translate(-50%,0)}
}
.account-actions-compact .attendance-action{background:#f8fbfd!important}
.account-actions-compact .tree-action{background:#f8fbfd!important}
.account-actions-compact .edit-action{background:#eef6fd!important;color:#356f9f!important;border-color:#cfe0ee!important}
.account-actions-compact .delete-action{background:#fff8f8!important;color:#b75b5b!important;border-color:#efd5d5!important;cursor:pointer!important}
.compact-delete-form{display:block!important;margin:0!important}

@media(max-width:760px){
  .premium-account-grid{grid-template-columns:1fr!important}
  .account-card{padding:14px!important}
  .account-actions-compact{justify-content:flex-end!important}
}
