*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Segoe UI,Arial,sans-serif;background:linear-gradient(180deg,#081523 0%,#102744 100%);color:#132238}
a{color:#0b4ea2;text-decoration:none}
a:hover{text-decoration:underline}
h1,h2,h3{margin:0 0 .35rem}
p{margin:.2rem 0}
.muted{color:#607086}
.topbar{display:grid;gap:.55rem;padding:.85rem 1.5rem .7rem;background:linear-gradient(135deg,#0d233c 0%,#153b63 100%);color:#fff;border-bottom:1px solid rgba(255,255,255,.08);position:sticky;top:0;z-index:40}
.topbar-shell{display:grid;gap:.9rem;overflow:hidden;max-height:420px;opacity:1;transition:max-height .28s ease,opacity .2s ease}
.topbar .muted{color:#d7e3f4}
.topbar-main{display:flex;justify-content:space-between;gap:1rem;align-items:flex-start}
.topbar-brand{display:grid;gap:.25rem}
.topbar-eyebrow{display:inline-flex;align-items:center;gap:.4rem;padding:.35rem .7rem;border-radius:999px;background:rgba(255,255,255,.08);color:#d9e7f5;font-size:.8rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;width:max-content}
.crm-mobile-menu-btn{display:none;flex-direction:column;justify-content:center;gap:4px;width:46px;height:46px;border:none;border-radius:14px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.1);cursor:pointer}
.crm-mobile-menu-btn span{display:block;width:18px;height:2px;margin:0 auto;background:#dce9f8;border-radius:999px}
.page{padding:1.2rem;display:grid;gap:1rem;min-width:0}
.crm-page-shell{display:grid;gap:1rem;min-width:0;width:100%}
.crm-fullwidth-panels,.crm-table-area{width:100%;min-width:0;max-width:100%}
.topbar-actions{display:flex;gap:.8rem;align-items:center;justify-content:flex-end;flex-wrap:wrap}
.crm-header-nav{display:flex;gap:.7rem;align-items:center;flex-wrap:wrap;justify-content:flex-end}
.crm-header-nav-link{display:inline-flex;align-items:center;justify-content:center;padding:.72rem 1rem;border-radius:999px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);color:#dce9f8;font-weight:700}
.crm-header-nav-link:hover{text-decoration:none;background:rgba(255,255,255,.11)}
.user-badge{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.1);border-radius:16px;padding:.75rem 1rem;display:flex;flex-direction:column;gap:.15rem}
.crm-meta-strip{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:.7rem}
.crm-meta-strip-header{padding:.05rem 0 0}
.crm-meta-card{display:grid;gap:.15rem;padding:.62rem .78rem;border-radius:16px;background:rgba(7,18,32,.42);border:1px solid rgba(255,255,255,.08);color:#dbe8f7}
.crm-meta-card span{font-size:.68rem;color:#9fb3ca;text-transform:uppercase;letter-spacing:.08em}
.crm-meta-card strong{font-size:.92rem;line-height:1.15}
.crm-header-toggle{display:flex;align-items:center;justify-content:center;width:100%;min-height:24px;padding:.15rem 0;border:none;border-radius:999px;background:rgba(6,17,30,.55);border:1px solid rgba(255,255,255,.08);color:#dce9f8;cursor:pointer}
.crm-header-toggle:hover{background:rgba(6,17,30,.75)}
.crm-header-toggle-icon{font-size:.95rem;line-height:1;transition:transform .2s ease}
.topbar.is-collapsed{padding:.45rem 1.5rem}
.topbar.is-collapsed .topbar-shell{max-height:0;opacity:0;pointer-events:none}
.topbar.is-collapsed .crm-header-toggle{min-height:18px;padding:.08rem 0}
.panel{background:rgba(255,255,255,.96);border-radius:24px;padding:1.15rem;box-shadow:0 22px 50px rgba(7,22,38,.18);overflow:hidden;width:100%;max-width:100%;min-width:0;border:1px solid rgba(17,39,67,.08)}
.form-panel,.users-panel,.overview-panel{width:100%;max-width:100%}
.panel-header{display:flex;justify-content:space-between;gap:1rem;align-items:flex-start;margin-bottom:.8rem}
.btn{display:inline-flex;align-items:center;justify-content:center;border:none;border-radius:14px;padding:.78rem 1.05rem;background:#e7eef8;color:#10243b;font-weight:700;cursor:pointer;text-decoration:none}
.btn:hover{text-decoration:none;filter:brightness(.98)}
.btn-primary{background:linear-gradient(135deg,#1bb9cf 0%,#2fd0df 100%);color:#082033}
.btn-secondary{background:#f1f4f8}
.btn-danger{background:#ffe3e3;color:#8d2020}
.btn-small{padding:.45rem .6rem;font-size:.88rem}
.alert{padding:.9rem 1rem;border-radius:12px}
.alert-success{background:#e8f7ec;color:#14532d}
.alert-error{background:#ffe7e7;color:#842029}
.form-grid,.filter-grid{display:grid;gap:.9rem}
.form-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
.filter-grid{grid-template-columns:2fr repeat(4,minmax(140px,1fr)) auto;align-items:end}
label{display:flex;flex-direction:column;gap:.35rem;font-size:.92rem;font-weight:700;min-width:0}
label span{color:#34465e}
input,select,textarea{width:100%;padding:.72rem .82rem;border:1px solid #d8e0ea;border-radius:10px;background:#fff;font:inherit}
input[readonly]{background:#f3f7fc;color:#30435c}
textarea{resize:vertical;min-height:92px}
.span-4{grid-column:span 4}
.form-actions,.filter-actions,.action-row{display:flex;gap:.75rem;align-items:center;flex-wrap:wrap}
.form-spacer{display:block}
.summary-row{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:.75rem;margin:1rem 0 0}
.summary-card{background:#f4f7fb;border:1px solid #dbe4f2;border-radius:18px;padding:.9rem 1rem;display:flex;flex-direction:column;gap:.35rem}
.summary-card span{font-size:.86rem;color:#607086;text-transform:uppercase;letter-spacing:.03em}
.summary-card strong{font-size:1.15rem;white-space:nowrap}
.summary-card.accent{background:#fff6d8;border-color:#f2d36d}
.crm-grid{display:grid;gap:1rem}
.crm-grid-two{grid-template-columns:1.1fr .9fr}
.crm-hero-pills{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.9rem}
.crm-hero-pill{display:grid;gap:.25rem;padding:1rem 1.05rem;border-radius:18px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12)}
.crm-hero-pill span{font-size:.82rem;color:#c9d8ea;text-transform:uppercase;letter-spacing:.06em}
.crm-hero-pill strong{font-size:1.15rem}
.crm-quick-actions{display:grid;gap:.7rem}
.crm-action-card{display:grid;gap:.22rem;padding:.9rem 1rem;border-radius:18px;background:linear-gradient(180deg,#f6fbff 0%,#edf6ff 100%);border:1px solid #d6e6f5;color:#10243b}
.crm-action-card strong{font-size:1rem}
.crm-action-card span{color:#607086;font-size:.88rem}
.crm-action-card:hover{text-decoration:none;transform:translateY(-1px);box-shadow:0 12px 28px rgba(14,31,52,.08)}
.crm-picker-field{display:grid;gap:.55rem}
.crm-picker-field>span{color:#34465e;font-size:.92rem;font-weight:700}
.crm-choice-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.7rem}
.crm-choice-card{position:relative;display:grid;gap:.18rem;padding:.85rem .95rem .85rem 2.7rem;border:1px solid #dbe4f2;border-radius:16px;background:#fff;cursor:pointer;font-weight:600;color:#10243b}
.crm-choice-card input{position:absolute;left:.9rem;top:1rem;width:1rem;height:1rem}
.crm-choice-card-title{font-size:.95rem;font-weight:700;line-height:1.2;color:#10243b}
.crm-choice-card small{font-size:.82rem;color:#607086}
.crm-choice-card:has(input:checked){border-color:#21c3d5;background:linear-gradient(180deg,#f4feff 0%,#ebfbff 100%);box-shadow:0 10px 24px rgba(24,100,122,.08)}
.crm-tag-list{display:flex;flex-wrap:wrap;gap:.35rem}
.crm-tag{display:inline-flex;align-items:center;padding:.28rem .6rem;border-radius:999px;background:#edf6ff;border:1px solid #d6e6f5;color:#123b63;font-size:.82rem;font-weight:700;line-height:1.1}
.crm-tag-muted{background:#f4f7fb;border-color:#dbe4f2;color:#607086}
.table-shell{position:relative;width:100%;min-width:0}
.table-scroll-overlay{position:sticky;top:10px;z-index:30;overflow-x:auto;overflow-y:hidden;height:18px;margin:0 0 .65rem 0;background:rgba(255,255,255,.96);border:1px solid #d9e1ea;border-radius:999px;backdrop-filter:blur(8px);box-shadow:0 4px 14px rgba(15,23,42,.08)}
.table-scroll-overlay-inner{height:1px}
.table-wrap{overflow:auto;border:1px solid #dbe4f2;border-radius:14px;background:#fff;width:100%;min-width:0}
.crm-table{border-collapse:separate;border-spacing:0;background:#fff;table-layout:fixed}
.crm-table.main-table{width:max-content;min-width:1830px}
.crm-table.compact{width:100%;min-width:640px;table-layout:auto}
.crm-table th,.crm-table td{padding:.75rem .8rem;border-top:1px solid #edf1f6;vertical-align:top;font-size:.92rem;position:relative;background:#fff}
.crm-table thead th{position:sticky;top:0;background:#0c2f6b;color:#fff;text-align:left;font-size:.88rem;white-space:nowrap;z-index:15;border-top:none}
.crm-table thead .group-row th{background:#1d74bc;color:#fff;text-align:center;z-index:16}
.crm-table tbody tr:nth-child(even) td{background:#fafcff}
.crm-table th a{color:#fff;text-decoration:none}
.crm-table th a:hover{text-decoration:underline}
.amount-cell{white-space:nowrap;min-width:126px}
.actions-cell{display:flex;gap:.4rem;flex-wrap:wrap;min-width:220px}
.empty-state{text-align:center;padding:2rem !important;color:#607086}
.status-chip{display:inline-flex;align-items:center;justify-content:center;padding:.7rem 1rem;min-width:128px;border-radius:6px;font-weight:500;white-space:nowrap;text-align:center;border:1px solid transparent}
.status-done{background:#c8d7e4;color:#003f7d}
.status-progress{background:#c7dbc0;color:#435400}
.status-failed{background:#e8a3a3;color:#7c0000}
.status-cancelled{background:#e6e6e6;color:#5c4300}
.status-refunded{background:#e6e6e6;color:#6a5a32}
.status-default{background:#eef3fb;color:#20497a}
.sticky-col{position:sticky !important;z-index:12;box-shadow:1px 0 0 #dbe4f2}
.crm-table thead .sticky-col{z-index:20}
.crm-table thead .group-row .sticky-col{z-index:21}
.sticky-col-1{left:0;min-width:74px;width:74px}
.sticky-col-2{left:74px;min-width:146px;width:146px}
.sticky-col-3{left:220px;min-width:150px;width:150px}
.sticky-col-4{left:370px;min-width:170px;width:170px}
.users-layout{display:grid;grid-template-columns:minmax(280px,360px) minmax(0,1fr);gap:1rem;min-width:0}
.users-table-wrap{overflow:auto;border:1px solid #dbe4f2;border-radius:14px}
.two-col{display:grid;grid-template-columns:360px 1fr;gap:1rem}
.login-body{min-height:100vh;display:grid;place-items:center;padding:1.5rem;background:radial-gradient(circle at top,#143c63 0%,#081523 58%,#06111e 100%)}
.login-card{width:min(460px,100%);background:rgba(255,255,255,.96);border-radius:28px;padding:1.5rem;box-shadow:0 24px 60px rgba(16,36,59,.24);border:1px solid rgba(255,255,255,.35)}
.demo-box{margin-top:1rem;padding:.9rem 1rem;background:#f4f7fb;border-radius:12px}
.stack{display:grid;gap:.85rem}
.col-resize-handle{position:absolute;top:0;right:-3px;width:8px;height:100%;cursor:col-resize;z-index:35}
@media (max-width:1180px){
  .summary-row{grid-template-columns:repeat(3,minmax(0,1fr))}
  .form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .span-4{grid-column:span 2}
  .filter-grid,.users-layout,.two-col,.crm-grid-two{grid-template-columns:1fr}
  .form-spacer{display:none}
  .crm-meta-strip{grid-template-columns:repeat(3,minmax(0,1fr))}
  .crm-choice-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:720px){
  .topbar-main{flex-direction:column}
  .summary-row{grid-template-columns:repeat(2,minmax(0,1fr))}
  .form-grid{grid-template-columns:1fr}
  .span-4{grid-column:span 1}
  .filter-grid{grid-template-columns:1fr}
  .topbar-main{display:grid;grid-template-columns:1fr auto;align-items:start}
  .crm-mobile-menu-btn{display:flex}
  .topbar-actions{display:none;width:100%;flex-direction:column;align-items:stretch}
  .topbar.menu-open .topbar-actions{display:flex}
  .crm-header-nav{width:100%;justify-content:flex-start}
  .crm-header-nav-link{flex:1 1 100%}
  .crm-meta-strip{display:none}
  .crm-hero-pills{grid-template-columns:repeat(2,minmax(0,1fr))}
  .topbar{padding:.75rem 1rem .6rem}
  .topbar.is-collapsed{padding:.38rem 1rem}
  .crm-choice-grid{grid-template-columns:1fr}
}
.crm-panel-dark{background:linear-gradient(135deg,#112942 0%,#1b3e61 100%);color:#fff}
.crm-panel-dark .muted{color:#c9d8ea}
.crm-panel-dark .summary-card{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.12)}
.crm-panel-dark .summary-card span{color:#d9e7f5}
.users-table-wrap,.table-wrap{background:#fff}
.crm-inline-form{display:grid;grid-template-columns:minmax(180px,1.2fr) minmax(220px,1.4fr) minmax(150px,.8fr) minmax(220px,1.2fr) auto;gap:.65rem;align-items:center}
.crm-inline-form input,.crm-inline-form select{width:100%}
.crm-inline-meta{margin-top:.45rem;color:#607086;font-size:.88rem}
.crm-inline-projects{display:grid;gap:.75rem;margin-top:.8rem;padding-top:.8rem;border-top:1px solid #e6edf5}
.crm-inline-delete{margin-top:.65rem}
.crm-panel-accent{background:linear-gradient(135deg,#f8fbff 0%,#ecf6ff 100%)}
.summary-row-compact{grid-template-columns:repeat(5,minmax(0,1fr))}
.actions-cell form{display:inline-flex}
.actions-cell .btn{white-space:nowrap}
@media (max-width:1180px){
  .crm-inline-form{grid-template-columns:1fr}
  .summary-row-compact{grid-template-columns:repeat(2,minmax(0,1fr))}
}