@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&family=JetBrains+Mono:wght@400;500;600&display=swap');

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:'Inter',system-ui,sans-serif;background:var(--bg);color:var(--text);font-size:14px;line-height:1.6;-webkit-font-smoothing:antialiased}
a{text-decoration:none;color:inherit}img{max-width:100%;display:block}
button,input,select,textarea{font-family:inherit}button{cursor:pointer}
::selection{background:rgba(39,168,26,.18)}
::-webkit-scrollbar{width:5px;height:5px}
::-webkit-scrollbar-thumb{background:var(--border-2);border-radius:99px}
::-webkit-scrollbar-thumb:hover{background:var(--g3)}

@keyframes fadeUp{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes slideDown{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
@keyframes popIn{from{opacity:0;transform:scale(.97) translateY(8px)}to{opacity:1;transform:scale(1) translateY(0)}}
@keyframes pulse{0%,100%{box-shadow:0 0 0 0 rgba(229,62,62,.35)}50%{box-shadow:0 0 0 8px rgba(229,62,62,0)}}

/* ══ SIDEBAR ══ */
.sidebar{
  width:var(--sidebar-w);position:fixed;top:0;left:0;bottom:0;
  background:#0f1923;
  display:flex;flex-direction:column;z-index:100;
  border-right:1px solid rgba(255,255,255,.06);
}
.sb-brand{
  padding:18px 16px;
  border-bottom:1px solid rgba(255,255,255,.06);
  flex-shrink:0;
}
.sb-logo-wrap{
  background:#ffffff;border-radius:10px;
  padding:7px 12px;display:inline-flex;
  align-items:center;justify-content:center;
}
.sb-logo{height:28px;width:auto;object-fit:contain;display:block}

.nav{flex:1;padding:10px 10px;overflow-y:auto}
.nav-sec{
  font-size:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
  color:rgba(255,255,255,.42);padding:14px 10px 5px;
}
.nav-a{
  display:flex;align-items:center;gap:10px;
  padding:9px 12px;border-radius:8px;
  color:rgba(255,255,255,.82);
    font-size:13.5px;font-weight:500;
  cursor:pointer;transition:all .15s;
  text-decoration:none;margin-bottom:1px;position:relative;
}
.nav-a:hover{background:rgba(255,255,255,.07);color:#fff}
.nav-a.active{
  background:linear-gradient(135deg,rgba(39,168,26,.25),rgba(39,168,26,.15));
  color:#6ee86a;font-weight:600;
  box-shadow:inset 0 0 0 1px rgba(39,168,26,.2);
}
.nav-a.active::before{
  content:'';position:absolute;left:0;top:50%;transform:translateY(-50%);
  width:3px;height:16px;background:#4dcf3f;border-radius:0 3px 3px 0;
}
.nav-ico{width:16px;text-align:center;flex-shrink:0;font-size:14px;line-height:1}
.nav-lbl{flex:1}
.nav-bdg{
  background:#e53e3e;color:#fff;font-size:10px;font-weight:700;
  font-family:var(--font-m);padding:1px 7px;border-radius:99px;min-width:20px;text-align:center;
}
.nav-bdg.warn{background:#dd6b20}

.sb-footer{padding:10px;border-top:1px solid rgba(255,255,255,.06);flex-shrink:0}
.sb-user-block{
  display:flex;align-items:center;gap:9px;
  padding:8px 10px;border-radius:8px;margin-bottom:7px;
  background:rgba(255,255,255,.05);
}
.ava{
  width:32px;height:32px;border-radius:8px;
  background:linear-gradient(135deg,var(--g2),var(--g5));
  display:flex;align-items:center;justify-content:center;
  font-size:12px;font-weight:700;color:#fff;flex-shrink:0;
}
.sb-uname{font-size:13px;font-weight:600;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1;min-width:0}
.sb-uplan{font-size:10px;color:rgba(110,232,106,.55);font-family:var(--font-m);margin-top:1px}
.sb-logout{
  display:flex;align-items:center;justify-content:center;gap:7px;
  width:100%;padding:8px 10px;border-radius:8px;
  background:rgba(229,62,62,.1);border:1px solid rgba(229,62,62,.2);
  color:#fc8181;font-size:12.5px;font-weight:600;
  text-decoration:none;transition:all .15s;cursor:pointer;
}
.sb-logout:hover{background:rgba(229,62,62,.2);color:#fff;border-color:rgba(229,62,62,.45)}

.theme-toggle{
  width:30px;height:30px;border-radius:7px;
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.1);
  cursor:pointer;display:flex;align-items:center;justify-content:center;
  font-size:14px;color:rgba(255,255,255,.55);transition:all .2s;flex-shrink:0;line-height:1;
}
.theme-toggle:hover{background:rgba(255,255,255,.14);color:#fff;transform:rotate(12deg)}

/* ══ MAIN ══ */
.main{margin-left:var(--sidebar-w);min-height:100vh;display:flex;flex-direction:column}
.topbar{
  position:sticky;top:0;z-index:50;height:var(--topbar-h);
  background:var(--topbar-bg);border-bottom:1px solid var(--topbar-border);
  padding:0 24px;display:flex;align-items:center;justify-content:space-between;
  box-shadow:0 1px 3px rgba(0,0,0,.05);
}
.tb-left{display:flex;align-items:center;gap:12px}
.tb-right{display:flex;align-items:center;gap:8px}
.pg-title{font-size:20px;font-weight:700;color:var(--text);letter-spacing:-.02em}
.content{padding:22px 24px;flex:1;animation:fadeUp .25s ease both}

/* ══ BUTTONS ══ */
.btn{display:inline-flex;align-items:center;gap:6px;padding:8px 16px;border-radius:var(--r-md);font-size:13.5px;font-weight:600;cursor:pointer;transition:all .15s;border:none;letter-spacing:-.01em;white-space:nowrap;text-decoration:none}
.btn-primary{background:var(--g2);color:#fff;box-shadow:var(--sh-green)}
.btn-primary:hover{background:var(--g1);box-shadow:0 6px 18px rgba(33,144,22,.4);transform:translateY(-1px)}
.btn-secondary{background:var(--card-bg);color:var(--text);border:1.5px solid var(--border);box-shadow:var(--sh-xs)}
.btn-secondary:hover{border-color:var(--g3);color:var(--g3)}
.btn-danger{background:var(--red-lt);color:var(--red);border:1.5px solid var(--red-border)}
.btn-danger:hover{background:var(--red);color:#fff;border-color:var(--red)}
.btn-ghost{background:transparent;color:var(--text-muted);border:1.5px solid var(--border)}
.btn-ghost:hover{border-color:var(--g3);color:var(--g3);background:var(--green-lt)}
.btn-sm{padding:5px 11px;font-size:12.5px;border-radius:6px}
.btn-lg{padding:10px 22px;font-size:15px}
.btn-icon{width:36px;height:36px;padding:0;border-radius:8px;background:var(--card-bg);border:1.5px solid var(--border);color:var(--text-muted);font-size:16px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:all .15s;line-height:1}
.btn-icon:hover{border-color:var(--g3);color:var(--g3)}
.notif-wrap{position:relative}
.nb-dot{position:absolute;top:-2px;right:-2px;width:8px;height:8px;border-radius:50%;background:var(--red);border:2px solid var(--topbar-bg)}

/* ══ STAT CARDS ══ */
.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-bottom:22px}
.stat{
  background:var(--card-bg);border:1px solid var(--border);
  border-radius:var(--r-lg);padding:20px;
  display:flex;flex-direction:column;gap:12px;
  cursor:pointer;text-decoration:none;
  box-shadow:var(--sh-card);transition:all .2s;
}
.stat:hover{box-shadow:var(--sh-md);transform:translateY(-2px)}
.stat-top{display:flex;align-items:flex-start;justify-content:space-between}
.stat-icon-wrap{width:48px;height:48px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:22px;flex-shrink:0}
.si-green {background:#e6ffed;color:#219016}
.si-blue  {background:#ebf8ff;color:#2b6cb0}
.si-purple{background:#faf5ff;color:#6b46c1}
.si-orange{background:#fffaf0;color:#c05621}
.si-red   {background:#fff5f5;color:#c53030}
[data-theme="dark"] .si-green {background:#052e16;color:#68d391}
[data-theme="dark"] .si-blue  {background:#0c1a2e;color:#63b3ed}
[data-theme="dark"] .si-purple{background:#100818;color:#b794f4}
[data-theme="dark"] .si-orange{background:#1c1000;color:#f6ad55}
[data-theme="dark"] .si-red   {background:#1c0505;color:#fc8181}
.stat-val{font-size:26px;font-weight:800;color:var(--text);letter-spacing:-.04em;line-height:1}
.stat-lbl{font-size:13px;font-weight:500;color:var(--text-muted)}
.stat-trend{font-size:12px;font-weight:600;display:flex;align-items:center;gap:4px}
.trend-up  {color:#27a81a}.trend-down{color:#e53e3e}.trend-neu{color:var(--text-muted)}

/* Sparkline canvas inside stat */
.stat-sparkline{height:36px;width:100%;margin-top:-4px;opacity:.7}

/* ══ CARDS ══ */
.card{background:var(--card-bg);border:1px solid var(--border);border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--sh-card)}
.card-hd{padding:16px 20px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--border)}
.card-title{font-size:15px;font-weight:700;color:var(--text);display:flex;align-items:center;gap:8px}
.card-lnk{font-size:13px;color:var(--g3);font-weight:600}
.card-lnk:hover{text-decoration:underline}
.card-body{padding:20px}

/* ══ BADGES ══ */
.badge{display:inline-flex;align-items:center;gap:4px;padding:3px 9px;border-radius:99px;font-size:11px;font-weight:600;white-space:nowrap;border:1px solid transparent}
.badge::before{content:'';width:5px;height:5px;border-radius:50%;background:currentColor;flex-shrink:0}
.badge-active,.badge-paid,.badge-confirmed,.badge-resolved,.badge-answered,.badge-low{background:#f0fff4;color:#276749;border-color:#9ae6b4}
.badge-expiring,.badge-pending,.badge-medium,.badge-unpaid,.badge-client_replied,.badge-orange,.badge-on_hold{background:#fffaf0;color:#c05621;border-color:#fbd38d}
.badge-expired,.badge-overdue,.badge-critical,.badge-rejected,.badge-high{background:#fff5f5;color:#c53030;border-color:#feb2b2}
.badge-suspended,.badge-muted,.badge-cancelled,.badge-closed,.badge-inactive{background:#f7fafc;color:#718096;border-color:#e2e8f0}
.badge-open,.badge-blue,.badge-in_progress{background:#ebf8ff;color:#2c5282;border-color:#90cdf4}
.badge-admin{background:#faf5ff;color:#553c9a;border-color:#d6bcfa}
.badge-client{background:#f0fff4;color:#276749;border-color:#9ae6b4}
[data-theme="dark"] .badge-active,.badge-paid,.badge-confirmed,.badge-resolved,.badge-answered,.badge-low{background:#052e16;color:#68d391;border-color:#276749}
[data-theme="dark"] .badge-open,.badge-blue,.badge-in_progress{background:#0c1a2e;color:#63b3ed;border-color:#2c5282}
[data-theme="dark"] .badge-pending,.badge-expiring,.badge-medium,.badge-unpaid,.badge-client_replied,.badge-on_hold{background:#1c1000;color:#f6ad55;border-color:#c05621}
[data-theme="dark"] .badge-expired,.badge-overdue,.badge-critical,.badge-rejected,.badge-high{background:#1c0505;color:#fc8181;border-color:#c53030}
[data-theme="dark"] .badge-suspended,.badge-muted,.badge-cancelled,.badge-closed,.badge-inactive{background:#1f2937;color:#718096;border-color:#374151}

/* ══ TABLES ══ */
.tbl-wrap{overflow-x:auto}
.tbl{width:100%;border-collapse:collapse}
.tbl th{padding:10px 16px;font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--text-muted);text-align:left;background:var(--bg);border-bottom:1px solid var(--border)}
.tbl td{padding:13px 16px;border-bottom:1px solid var(--border);font-size:13.5px;vertical-align:middle;color:var(--text)}
.tbl tr:last-child td{border-bottom:none}
.tbl tr:hover td{background:var(--bg)}
.tbl-name{font-weight:600;color:var(--text);display:block}
.tbl-sub{font-size:12px;color:var(--text-muted);margin-top:2px}

/* ══ FORMS ══ */
.form-grid{display:grid;gap:16px}
.form-grid-2{grid-template-columns:1fr 1fr}
.form-grid-3{grid-template-columns:1fr 1fr 1fr}
.fg{display:flex;flex-direction:column;gap:5px}
.fl{font-size:12px;font-weight:600;color:var(--text-2)}
.fi,.fs,.fta{width:100%;background:var(--inp-bg);border:1.5px solid var(--inp-border);border-radius:var(--r-md);padding:9px 12px;font-size:14px;color:var(--text);outline:none;transition:border-color .15s,box-shadow .15s}
.fi:focus,.fs:focus,.fta:focus{border-color:var(--inp-focus);background:var(--card-bg);box-shadow:0 0 0 3px rgba(39,168,26,.1)}
.fi::placeholder,.fta::placeholder{color:var(--text-light)}
.fi-icon{position:relative}.fi-icon .fi{padding-left:38px}
.fi-icon .ico{position:absolute;left:12px;top:50%;transform:translateY(-50%);font-size:15px;opacity:.4;pointer-events:none}
.fta{resize:vertical;min-height:88px;line-height:1.6}
.form-hint{font-size:11.5px;color:var(--text-muted)}

/* ══ ALERTS ══ */
.alert{display:flex;align-items:flex-start;gap:10px;padding:12px 14px;border-radius:var(--r-md);font-size:13.5px;line-height:1.55;animation:slideDown .2s ease;margin-bottom:14px;border:1.5px solid transparent}
.alert-err {background:var(--red-lt);border-color:var(--red-border);color:#742a2a}
.alert-ok  {background:var(--green-lt);border-color:var(--green-mid);color:#22543d}
.alert-warn{background:var(--orange-lt);border-color:var(--orange-border);color:#7b341e}
.alert-info{background:var(--blue-lt);border-color:var(--blue-border);color:#1a365d}
.alert-bar{display:flex;align-items:center;gap:12px;padding:12px 16px;border-radius:var(--r-md);margin-bottom:10px;font-size:13.5px;border:1.5px solid transparent}
.alert-bar.crit{background:var(--red-lt);border-color:var(--red-border);animation:pulse 2.5s infinite}
.alert-bar.warn{background:var(--orange-lt);border-color:var(--orange-border)}
.ab-body{flex:1}.ab-title{font-weight:700;color:var(--text)}.ab-desc{font-size:12.5px;color:var(--text-muted);margin-top:1px}

/* ══ FLASH ══ */
.flash{display:flex;align-items:center;gap:10px;padding:11px 14px;border-radius:var(--r-md);margin-bottom:16px;font-size:13.5px;font-weight:500;border:1.5px solid transparent;cursor:pointer}
.flash-ok,.flash-success{background:var(--green-lt);border-color:var(--green-mid);color:#22543d}
.flash-err,.flash-error{background:var(--red-lt);border-color:var(--red-border);color:#742a2a}

/* ══ DRAWER ══ */
.drawer-ov{display:none;position:fixed;inset:0;z-index:200;background:rgba(0,0,0,.25);backdrop-filter:blur(3px)}
.drawer-ov.open{display:block}
.drawer{position:fixed;top:0;right:-440px;bottom:0;width:420px;background:var(--card-bg);border-left:1px solid var(--border);z-index:201;transition:right .28s cubic-bezier(.4,0,.2,1);display:flex;flex-direction:column;box-shadow:var(--sh-lg)}
.drawer.open{right:0}
.dr-hd{padding:18px 20px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between}
.dr-title{font-size:15px;font-weight:700;color:var(--text)}
.dr-close{width:28px;height:28px;border-radius:6px;background:var(--bg);border:1px solid var(--border);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:13px;color:var(--text-muted);transition:all .15s}.dr-close:hover{color:var(--text)}
.dr-body{flex:1;overflow-y:auto}
.ni{display:flex;gap:11px;padding:13px 18px;border-bottom:1px solid var(--border);cursor:pointer;transition:background .12s}.ni:hover{background:var(--bg)}
.ni.unread{background:var(--green-lt)}
.ni-em{font-size:17px;flex-shrink:0;margin-top:1px;line-height:1.5}
.ni-bd{flex:1}.ni-tt{font-size:13px;font-weight:600;color:var(--text);margin-bottom:2px}
.ni-tx{font-size:12px;color:var(--text-muted);line-height:1.55}
.ni-tm{font-size:10.5px;color:var(--text-light);font-family:var(--font-m);margin-top:2px}
.ni-dot{width:7px;height:7px;border-radius:50%;background:var(--g3);margin-top:7px;flex-shrink:0}

/* ══ MODALS ══ */
.modal-ov,.ph-modal-overlay{display:none;position:fixed;inset:0;z-index:300;background:rgba(0,0,0,.4);backdrop-filter:blur(6px);align-items:center;justify-content:center;padding:20px}
.modal-ov.open,.ph-modal-overlay.open{display:flex}
.modal,.ph-modal{background:var(--card-bg);border-radius:var(--r-xl);width:500px;max-width:100%;overflow:hidden;box-shadow:var(--sh-lg);animation:popIn .2s ease;border:1px solid var(--border)}
.ph-modal-lg{width:640px}.ph-modal-xl{width:820px}
.modal-hd,.ph-modal-head{padding:20px 22px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;background:var(--card-bg)}
.modal-title,.ph-modal-title{font-size:16px;font-weight:700;color:var(--text)}
.modal-body,.ph-modal-body{padding:22px;max-height:72vh;overflow-y:auto}
.modal-ft,.ph-modal-foot{padding:14px 22px;border-top:1px solid var(--border);display:flex;gap:8px;justify-content:flex-end;background:var(--bg)}
.ph-modal-close{width:28px;height:28px;border-radius:6px;background:var(--bg);border:1px solid var(--border);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:13px;color:var(--text-muted)}.ph-modal-close:hover{color:var(--text)}

/* ══ TABS ══ */
.tabs{display:flex;gap:0;background:var(--bg);border:1px solid var(--border);border-radius:var(--r-md);padding:3px;margin-bottom:18px}
.tab{flex:1;text-align:center;padding:7px 10px;border-radius:6px;font-size:13px;font-weight:500;color:var(--text-muted);cursor:pointer;transition:all .15s;text-decoration:none;display:block}
.tab.active{background:var(--card-bg);color:var(--g2);box-shadow:var(--sh-xs);font-weight:700}

/* ══ PAGINATION ══ */
.pagination,.ph-pagination{display:flex;align-items:center;gap:4px;padding:13px 18px;border-top:1px solid var(--border)}
.page-btn,.ph-page-btn{width:32px;height:32px;border-radius:var(--r-sm);border:1.5px solid var(--border);background:var(--card-bg);color:var(--text-muted);font-size:13px;font-weight:600;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;transition:all .15s;text-decoration:none}
.page-btn:hover,.ph-page-btn:hover{border-color:var(--g3);color:var(--g3)}
.page-btn.active,.ph-page-btn.active{background:var(--g2);color:#fff;border-color:var(--g2)}

/* ══ TOGGLE ══ */
.tgl{position:relative;display:inline-block;width:38px;height:21px;flex-shrink:0}
.tgl input{opacity:0;width:0;height:0}
.tgl-sl{position:absolute;cursor:pointer;inset:0;background:#cbd5e0;border-radius:21px;transition:all .2s}
.tgl-sl::before{content:'';position:absolute;width:15px;height:15px;border-radius:50%;left:3px;top:3px;background:#fff;transition:transform .2s;box-shadow:0 1px 3px rgba(0,0,0,.2)}
.tgl input:checked+.tgl-sl{background:var(--g2)}
.tgl input:checked+.tgl-sl::before{transform:translateX(17px)}

/* ══ MISC ══ */
.breadcrumb{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--text-muted);margin-bottom:16px}
.breadcrumb a{color:var(--g2);font-weight:500}.breadcrumb a:hover{text-decoration:underline}
.breadcrumb .sep{color:var(--border-2)}
.empty{text-align:center;padding:48px 24px;color:var(--text-muted)}
.empty-ico{font-size:40px;margin-bottom:12px;opacity:.6}
.empty-title{font-size:15px;font-weight:700;color:var(--text);margin-bottom:6px}
.empty-txt{font-size:13.5px}
.dpill{display:inline-flex;align-items:center;padding:2px 9px;border-radius:99px;font-size:11.5px;font-weight:700;font-family:var(--font-m)}

/* Layouts */
.g2{display:grid;grid-template-columns:1.5fr 1fr;gap:20px;margin-bottom:20px}
.g2eq{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:20px}
.g3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-bottom:20px}
.mb-18{margin-bottom:18px}.mb-20{margin-bottom:20px}
.flex{display:flex}.flex-center{align-items:center}.flex-between{justify-content:space-between}.flex-end{justify-content:flex-end}

/* ══ TICKET THREAD ══ */
.thread{display:flex;flex-direction:column}
.msg{display:flex;gap:12px;padding:16px 20px;border-bottom:1px solid var(--border)}.msg:last-child{border-bottom:none}
.msg-ava{width:34px;height:34px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;color:#fff;flex-shrink:0}
.msg-ava.client{background:linear-gradient(135deg,var(--g2),var(--g5))}
.msg-ava.staff{background:linear-gradient(135deg,#1e40af,#3b82f6)}
.msg-ava.internal{background:linear-gradient(135deg,#6d28d9,var(--purple))}
.msg-meta{display:flex;align-items:center;gap:8px;margin-bottom:6px;flex-wrap:wrap}
.msg-from{font-size:13.5px;font-weight:700;color:var(--text)}
.msg-when{font-size:11px;color:var(--text-muted);font-family:var(--font-m)}
.msg-body{font-size:13.5px;color:var(--text-2);line-height:1.7;white-space:pre-wrap}
.staff-tag{font-size:9.5px;font-weight:700;color:#fff;background:#2b6cb0;padding:2px 6px;border-radius:4px}
.internal-tag{font-size:9.5px;font-weight:700;color:#fff;background:var(--purple);padding:2px 6px;border-radius:4px}
.msg.internal-note{background:var(--purple-lt);border-left:3px solid var(--purple)}

/* ══ INVOICE ══ */
.inv-preview{background:var(--card-bg);border:1px solid var(--border);border-radius:var(--r-lg);padding:40px;max-width:760px;margin:0 auto;box-shadow:var(--sh-sm)}
.inv-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:32px;padding-bottom:24px;border-bottom:2px solid var(--border)}
.inv-logo{height:44px;object-fit:contain;object-position:left}
.inv-meta{text-align:right}
.inv-word{font-size:30px;font-weight:800;color:var(--g2);letter-spacing:-.04em;line-height:1}
.inv-num{font-family:var(--font-m);font-size:13px;color:var(--text-muted);margin-top:6px}
.inv-lbl{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.12em;color:var(--text-muted);margin-bottom:8px}
.inv-parties{display:grid;grid-template-columns:1fr 1fr;gap:32px;margin-bottom:24px}
.inv-party-name{font-size:15px;font-weight:700;color:var(--text);margin-bottom:4px}
.inv-party-info{font-size:13px;color:var(--text-muted);line-height:1.8}
.inv-dates{display:flex;gap:32px;margin-bottom:28px;padding-bottom:24px;border-bottom:1px solid var(--border);flex-wrap:wrap}
.inv-date-item{display:flex;flex-direction:column;gap:3px}
.inv-date-lbl{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.12em;color:var(--text-muted)}
.inv-date-val{font-size:14px;font-weight:700;color:var(--text)}
.inv-tbl{width:100%;border-collapse:collapse;margin-bottom:16px}
.inv-tbl th{padding:9px 0;font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted);text-align:left;border-bottom:2px solid var(--border)}
.inv-tbl td{padding:12px 0;font-size:14px;border-bottom:1px solid var(--border);color:var(--text)}
.inv-tbl tr:last-child td{border-bottom:none}
.inv-totals{border-top:2px solid var(--border);padding-top:14px;display:flex;flex-direction:column;align-items:flex-end;gap:5px}
.inv-tot-row{display:flex;gap:28px;justify-content:flex-end;font-size:13.5px;color:var(--text)}
.inv-tot-row .l{color:var(--text-muted);min-width:90px;text-align:right}
.inv-tot-row.grand{font-size:18px;font-weight:800;color:var(--g2);margin-top:6px;padding-top:10px;border-top:1px solid var(--border)}
.inv-bank{margin-top:28px;background:var(--green-lt);border:1.5px solid var(--green-mid);border-radius:10px;padding:18px 20px}
.inv-bank-title{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.14em;color:#276749;margin-bottom:14px}
.inv-bank-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px 32px}
.inv-bank-lbl{font-size:11px;color:var(--text-muted);margin-bottom:2px}
.inv-bank-val{font-size:14px;font-weight:700;color:var(--text);font-family:var(--font-m)}
.inv-paid-stamp{text-align:center;padding:20px;border:2px solid var(--green-mid);border-radius:10px;margin-top:24px;font-size:22px;font-weight:800;color:var(--g2);background:var(--green-lt)}
.inv-footer{margin-top:28px;padding-top:18px;border-top:1px solid var(--border);text-align:center;font-size:12px;color:var(--text-muted);line-height:2}

/* Domain, upload */
.dc-input{flex:1;border:1.5px solid var(--inp-border);border-radius:var(--r-md);padding:10px 14px;font-size:14px;outline:none;background:var(--inp-bg);color:var(--text);transition:border-color .15s}
.dc-input:focus{border-color:var(--inp-focus);box-shadow:0 0 0 3px rgba(39,168,26,.1)}
.upload-zone{border:2px dashed var(--border-2);border-radius:10px;padding:28px;text-align:center;cursor:pointer;transition:all .2s}
.upload-zone:hover,.upload-zone.drag{border-color:var(--g3);background:var(--green-lt)}

/* Responsive */
@media(max-width:1200px){.stats-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:1000px){.g2{grid-template-columns:1fr}}
@media(max-width:900px){.sidebar{transform:translateX(-100%)}.main{margin-left:0}.g2eq,.g3{grid-template-columns:1fr}}
@media(max-width:640px){.content{padding:14px}.stats-grid{grid-template-columns:1fr 1fr}.form-grid-2,.form-grid-3{grid-template-columns:1fr}}

/* Print */
@media print{.sidebar,.topbar,.btn,.no-print,.theme-toggle,.ph-topbar{display:none!important}.main{margin-left:0!important}.content{padding:0!important}.inv-preview{border:none;padding:20px;box-shadow:none}body{background:#fff!important;color:#000!important}}