:root{
  --navy:#0c3154;
  --navy-deep:#082642;
  --navy-2:#123f68;
  --blue:#0a98e8;
  --blue-2:#188cff;
  --blue-soft:#eaf6ff;
  --ink:#132236;
  --muted:#6b7888;
  --line:#dfe8f0;
  --surface:#ffffff;
  --surface-2:#f6f9fc;
  --surface-3:#eef4f8;
  --good:#167a50;
  --good-bg:#e8f7ef;
  --warn:#a66a0a;
  --warn-bg:#fff4dc;
  --bad:#b93f3f;
  --bad-bg:#fdecec;
  --shadow:0 20px 60px rgba(9,42,72,.10);
  --shadow-soft:0 8px 30px rgba(9,42,72,.07);
  --radius:20px;
  --radius-sm:14px;
}
*{box-sizing:border-box}
html{background:var(--surface-2)}
html,body{margin:0;min-height:100%;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink)}
body{background:
  radial-gradient(circle at 85% -10%,rgba(10,152,232,.08),transparent 30%),
  linear-gradient(180deg,#fbfdff 0,#f5f8fb 42%,#f6f9fc 100%)}
button,input,select,textarea{font:inherit}
button{cursor:pointer}
button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid rgba(10,152,232,.18);outline-offset:2px}

/* BRAND INTRO */
.brand-splash{position:fixed;inset:0;z-index:1000;background:#fff;display:grid;place-items:center;align-content:center;gap:18px;overflow:hidden;transition:opacity .58s ease,visibility .58s ease;animation:splashExit 2s ease forwards}
.brand-splash::after{content:"";position:absolute;left:0;right:0;bottom:0;height:5px;background:linear-gradient(90deg,var(--navy) 0 74%,var(--blue) 74%)}
.splash-halo{position:absolute;width:520px;height:520px;border-radius:50%;background:radial-gradient(circle,rgba(10,152,232,.08),rgba(10,152,232,0) 68%);filter:blur(10px)}
.splash-logo{position:relative;width:min(280px,56vw);max-height:190px;object-fit:contain;animation:brandReveal 1.4s cubic-bezier(.2,.8,.2,1) both}
.splash-copy{position:relative;display:flex;align-items:center;gap:10px;letter-spacing:.08em;text-transform:uppercase;animation:copyReveal 1.35s .22s both}
.splash-copy strong{font-size:.78rem;color:var(--navy);letter-spacing:.25em}
.splash-copy span{font-size:.65rem;color:#8793a0;letter-spacing:.08em;text-transform:none}
@keyframes brandReveal{0%{opacity:0;filter:blur(18px);transform:scale(.92)}45%{opacity:1;filter:blur(3px);transform:scale(1.015)}100%{opacity:1;filter:blur(0);transform:scale(1)}}
@keyframes copyReveal{0%{opacity:0;transform:translateY(8px)}100%{opacity:1;transform:none}}
@keyframes splashExit{0%,68%{opacity:1;visibility:visible}100%{opacity:0;visibility:hidden;pointer-events:none}}
@media(prefers-reduced-motion:reduce){.brand-splash{animation:none;display:none}.splash-logo,.splash-copy{animation:none}}

/* APP FRAME */
.app-shell{display:grid;grid-template-columns:268px minmax(0,1fr);min-height:100vh}
.sidebar{position:sticky;top:0;height:100vh;background:linear-gradient(180deg,var(--navy) 0,var(--navy-deep) 100%);color:#fff;padding:18px 16px 16px;display:flex;flex-direction:column;z-index:30;border-right:1px solid rgba(255,255,255,.06);box-shadow:16px 0 50px rgba(7,36,61,.06)}
.sidebar::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:var(--blue)}
.brand{display:flex;gap:12px;align-items:center;padding:6px 6px 16px;border-bottom:1px solid rgba(255,255,255,.09)}
.brand-logo-wrap{width:80px;height:54px;display:grid;place-items:center;flex:0 0 auto}
.brand-logo{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 5px 9px rgba(0,0,0,.13))}
.brand-copy{display:flex;flex-direction:column;gap:3px}.brand-copy strong{letter-spacing:.20em;font-size:.78rem}.brand-copy small{color:#afc3d4;font-size:.67rem;line-height:1.25}
.brand-mantra{padding:14px 10px 18px;color:#b7c9d8;font-size:.72rem;line-height:1.45}.brand-mantra b{color:#fff;font-weight:750}
.nav{display:grid;gap:6px}.nav-item{position:relative;border:0;background:transparent;color:#b8cad9;display:flex;align-items:center;gap:12px;padding:12px 13px;border-radius:14px;text-align:left;font-weight:760;transition:.18s ease}.nav-item::after{content:"";position:absolute;right:9px;width:5px;height:5px;border-radius:50%;background:transparent}.nav-item:hover{color:#fff;background:rgba(255,255,255,.065)}.nav-item.active{color:#fff;background:rgba(10,152,232,.14);box-shadow:inset 0 0 0 1px rgba(116,206,255,.11)}.nav-item.active::after{background:var(--blue);box-shadow:0 0 0 4px rgba(10,152,232,.13)}.nav-icon{width:24px;text-align:center;font-size:1.04rem;color:#8dcffa}.nav-item.active .nav-icon{color:#fff}
.sidebar-section{margin-top:24px;border-top:1px solid rgba(255,255,255,.09);padding:18px 8px 0}.section-label{display:block;color:#7598b5;font-size:.63rem;text-transform:uppercase;letter-spacing:.15em;margin-bottom:10px;font-weight:800}
.sidebar .field span{color:#b6c7d5}.sidebar select{background:#123f68;border-color:#2c5678;color:#fff}
.sidebar-foot{margin-top:auto;padding:15px 8px 0;border-top:1px solid rgba(255,255,255,.09);display:flex;justify-content:space-between;align-items:center;color:#8eabc0}.status-dot{display:flex;gap:8px;align-items:center;font-size:.71rem}.status-dot i,.live-pill i{width:7px;height:7px;border-radius:50%;background:#37d88b;box-shadow:0 0 0 4px rgba(55,216,139,.10)}
.main{min-width:0;position:relative}
.topbar{height:84px;background:rgba(255,255,255,.88);backdrop-filter:blur(18px) saturate(1.15);border-bottom:1px solid rgba(213,225,235,.8);display:flex;align-items:center;justify-content:space-between;padding:0 30px;position:sticky;top:0;z-index:20}
.topbar-title{min-width:0}.topbar h1{margin:2px 0 0;font-size:1.42rem;letter-spacing:-.035em;color:var(--navy);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.eyebrow{font-size:.64rem;letter-spacing:.17em;color:var(--blue);font-weight:900}.topbar-actions{display:flex;gap:9px;align-items:center}.live-pill{display:flex;align-items:center;gap:8px;border:1px solid #dce8f1;background:#fff;border-radius:999px;padding:8px 10px;font-size:.69rem;color:#53677a;font-weight:760}.avatar{width:39px;height:39px;border-radius:12px;background:linear-gradient(145deg,var(--navy),var(--navy-2));color:#fff;display:grid;place-items:center;font-weight:900;font-size:.72rem;box-shadow:0 6px 16px rgba(12,49,84,.18)}
.brand-ribbon{height:32px;display:flex;align-items:center;gap:0;background:#fff;border-bottom:1px solid var(--line);overflow:hidden;color:#7b8997;font-size:.60rem;font-weight:850;letter-spacing:.07em;white-space:nowrap}.brand-ribbon span{position:relative;padding:0 18px}.brand-ribbon span:not(:last-child)::after{content:"";position:absolute;right:0;top:50%;width:3px;height:3px;border-radius:50%;background:var(--blue);transform:translateY(-50%)}
.icon-btn,.ghost-btn,.primary-btn,.secondary-btn,.danger-btn{border:1px solid var(--line);background:#fff;color:var(--ink);border-radius:12px;min-height:40px;padding:0 14px;font-weight:780;transition:.16s ease}.icon-btn{width:40px;padding:0}.ghost-btn:hover,.icon-btn:hover{background:var(--surface-3);border-color:#d0dde8}.primary-btn{background:var(--navy);border-color:var(--navy);color:#fff;box-shadow:0 7px 16px rgba(12,49,84,.13)}.primary-btn:hover{background:var(--navy-2);transform:translateY(-1px)}.secondary-btn{background:var(--blue-soft);border-color:#cceaff;color:#0875b8}.secondary-btn:hover{background:#dff2ff}.danger-btn{background:var(--bad-bg);color:var(--bad);border-color:#f1caca}.menu-btn{display:none}
.view{display:none;padding:28px 30px 56px;animation:viewIn .24s ease both}.view.active{display:block}@keyframes viewIn{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}

/* HEADERS */
.hero-row{position:relative;display:flex;align-items:flex-end;justify-content:space-between;gap:22px;margin-bottom:20px;padding:2px 0 0}.hero-row::before{content:"";position:absolute;left:-30px;top:-28px;width:5px;height:74px;background:var(--blue);border-radius:0 0 4px 0}.hero-row h2{font-size:1.28rem;margin:0 0 6px;color:var(--navy);letter-spacing:-.025em}.hero-row p{margin:0;color:var(--muted);font-size:.87rem;line-height:1.5}.action-row{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}

/* KPI */
.kpi-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:18px}.kpi-card{position:relative;overflow:hidden;background:rgba(255,255,255,.96);border:1px solid var(--line);border-radius:var(--radius);padding:18px;box-shadow:var(--shadow-soft);transition:.16s ease}.kpi-card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:linear-gradient(180deg,var(--blue),rgba(10,152,232,.15))}.kpi-card:hover{transform:translateY(-2px);box-shadow:0 12px 34px rgba(9,42,72,.09)}.kpi-top{display:flex;justify-content:space-between;gap:8px;align-items:center}.kpi-label{font-size:.73rem;color:var(--muted);font-weight:780}.kpi-value{font-size:1.85rem;line-height:1;margin-top:13px;font-weight:920;letter-spacing:-.055em;color:var(--navy)}.kpi-sub{margin-top:8px;font-size:.71rem;color:var(--muted);line-height:1.35}.trend{font-size:.64rem;font-weight:880;padding:4px 7px;border-radius:999px;background:var(--good-bg);color:var(--good)}.trend.warn{background:var(--warn-bg);color:var(--warn)}.trend.bad{background:var(--bad-bg);color:var(--bad)}

/* PANELS */
.grid-2{display:grid;grid-template-columns:1.32fr .68fr;gap:16px}.grid-even{grid-template-columns:1fr 1fr}.panel{background:rgba(255,255,255,.96);border:1px solid var(--line);border-radius:var(--radius);padding:19px;box-shadow:0 5px 22px rgba(9,42,72,.045);min-width:0}.panel-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:16px}.panel h3{font-size:.96rem;margin:0;color:var(--navy);letter-spacing:-.015em}.panel-sub{font-size:.73rem;color:var(--muted);margin-top:4px;line-height:1.45}
.health-list,.timeline,.compact-list{display:grid;gap:10px}.health-item{display:grid;grid-template-columns:auto 1fr auto;gap:11px;align-items:center;padding:11px 0;border-bottom:1px solid var(--line)}.health-item:last-child{border-bottom:0}.health-dot{width:10px;height:10px;border-radius:50%;background:var(--good);box-shadow:0 0 0 4px rgba(22,122,80,.08)}.health-dot.warn{background:#e4a11b;box-shadow:0 0 0 4px rgba(228,161,27,.09)}.health-dot.bad{background:#d54c4c;box-shadow:0 0 0 4px rgba(213,76,76,.08)}.health-title{font-weight:800;font-size:.82rem}.health-meta{color:var(--muted);font-size:.70rem;margin-top:2px}.health-score{font-weight:900;font-size:.78rem;color:var(--navy)}
.alert{display:flex;gap:11px;padding:12px;border-radius:14px;background:#fbfdff;border:1px solid var(--line);align-items:flex-start}.alert strong{display:block;font-size:.78rem;color:var(--navy)}.alert span{display:block;font-size:.70rem;color:var(--muted);margin-top:3px;line-height:1.35}.alert-icon{width:31px;height:31px;border-radius:10px;display:grid;place-items:center;background:var(--warn-bg);color:var(--warn);font-weight:900;flex:0 0 auto}.alert-icon.bad{background:var(--bad-bg);color:var(--bad)}

/* SALES */
.funnel{display:grid;grid-template-columns:repeat(7,1fr);gap:8px;margin-bottom:16px}.funnel-step{position:relative;background:#f8fbfd;border:1px solid var(--line);border-radius:13px;padding:12px 8px;text-align:center;overflow:hidden}.funnel-step strong{display:block;font-size:1.24rem;color:var(--navy);letter-spacing:-.03em}.funnel-step span{display:block;font-size:.61rem;color:var(--muted);margin-top:4px;line-height:1.2}.funnel-step.active{background:linear-gradient(180deg,#f3faff,#eaf6ff);border-color:#cde9fb}.funnel-step.active::after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;background:var(--blue)}
.board-scroll{overflow:auto;padding-bottom:6px;scrollbar-color:#b7c8d6 transparent;scrollbar-width:thin}.kanban{display:grid;grid-template-columns:repeat(6,minmax(226px,1fr));gap:12px;min-width:1400px}.kanban-col{background:#f6f9fc;border:1px solid var(--line);border-radius:16px;padding:11px;min-height:190px}.kanban-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;padding:0 2px}.kanban-head strong{font-size:.72rem;color:#4d6274}.count{background:#dfe9f1;color:#4c6375;border-radius:999px;padding:3px 7px;font-size:.62rem;font-weight:850}.deal-card{position:relative;background:#fff;border:1px solid #dfe8ef;border-radius:14px;padding:12px;margin-bottom:8px;box-shadow:0 5px 15px rgba(9,42,72,.04);transition:.16s ease}.deal-card:hover{border-color:#c9deed;transform:translateY(-1px)}.deal-card:last-child{margin-bottom:0}.deal-top{display:flex;justify-content:space-between;gap:8px;align-items:flex-start}.deal-card h4{margin:0;font-size:.80rem;color:var(--navy)}.deal-card p{margin:4px 0 0;color:var(--muted);font-size:.67rem;line-height:1.35}.deal-value{font-weight:900;font-size:.70rem;white-space:nowrap;color:#087abf}.deal-foot{display:flex;justify-content:space-between;gap:7px;align-items:center;margin-top:10px}
.tag{display:inline-flex;align-items:center;gap:5px;border-radius:999px;padding:4px 7px;background:var(--surface-3);font-size:.62rem;font-weight:820;color:#536779}.tag.good{background:var(--good-bg);color:var(--good)}.tag.warn{background:var(--warn-bg);color:var(--warn)}.tag.bad{background:var(--bad-bg);color:var(--bad)}.tag.blue{background:var(--blue-soft);color:#0876b9}
.table-wrap{overflow:auto}.data-table{width:100%;border-collapse:collapse;min-width:720px}.data-table th{text-align:left;padding:10px 9px;border-bottom:1px solid var(--line);font-size:.63rem;color:#81909e;text-transform:uppercase;letter-spacing:.065em}.data-table td{padding:11px 9px;border-bottom:1px solid var(--line);font-size:.75rem;vertical-align:top}.data-table tr:hover td{background:#fbfdff}.data-table tr:last-child td{border-bottom:0}.data-table strong{font-size:.77rem;color:var(--navy)}.muted{color:var(--muted)}
.activity{display:grid;grid-template-columns:34px 1fr auto;gap:10px;align-items:start;padding:10px 0;border-bottom:1px solid var(--line)}.activity:last-child{border-bottom:0}.activity-icon{width:32px;height:32px;border-radius:10px;background:var(--blue-soft);display:grid;place-items:center;color:#0876b9;font-size:.75rem;font-weight:900;border:1px solid #d9efff}.activity strong{font-size:.76rem;color:var(--navy)}.activity p{margin:3px 0 0;font-size:.68rem;color:var(--muted);line-height:1.35}.activity time{font-size:.63rem;color:#8a98a5;white-space:nowrap}
.progress{height:7px;background:#e7eef4;border-radius:999px;overflow:hidden}.progress i{display:block;height:100%;background:linear-gradient(90deg,var(--blue),#43b6f4);border-radius:999px}.metric-row{display:grid;grid-template-columns:1fr auto;gap:8px;align-items:center}.metric-row strong{font-size:.74rem}.metric-row span{font-size:.68rem;color:var(--muted)}

/* OPERATIONS */
.site-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.site-card{position:relative;border:1px solid var(--line);border-radius:16px;padding:15px;background:#fff;overflow:hidden}.site-card::before{content:"";position:absolute;left:0;top:0;right:0;height:3px;background:linear-gradient(90deg,var(--navy),var(--blue))}.site-card h4{margin:0;font-size:.83rem;color:var(--navy)}.site-card p{margin:4px 0 10px;color:var(--muted);font-size:.68rem}.site-meta{display:flex;flex-wrap:wrap;gap:6px}.site-score{margin-top:12px;display:grid;grid-template-columns:1fr auto;align-items:center;gap:8px}
.ticket-list{display:grid;gap:9px}.ticket{display:grid;grid-template-columns:5px 1fr auto;gap:12px;border:1px solid var(--line);border-radius:15px;background:#fff;overflow:hidden;box-shadow:0 4px 15px rgba(9,42,72,.035)}.ticket-bar{background:var(--good)}.ticket-bar.warn{background:#e6a51e}.ticket-bar.bad{background:#d44a4a}.ticket-main{padding:12px 0}.ticket-main h4{margin:0;font-size:.78rem;color:var(--navy)}.ticket-main p{margin:4px 0 0;font-size:.67rem;color:var(--muted);line-height:1.35}.ticket-side{padding:12px 12px 12px 0;text-align:right}.ticket-side strong{font-size:.71rem;color:var(--navy)}.ticket-side span{display:block;color:var(--muted);font-size:.62rem;margin-top:3px}
.operator-home{max-width:640px;margin:0 auto}.operator-home .hero-row::before{display:none}.operator-big-action{width:100%;min-height:88px;border-radius:18px;border:1px solid var(--line);background:#fff;text-align:left;padding:16px 18px;display:flex;align-items:center;gap:14px;margin-bottom:11px;box-shadow:0 5px 18px rgba(9,42,72,.04);transition:.16s ease}.operator-big-action:hover{transform:translateY(-1px);border-color:#cae2f3}.operator-big-action b{font-size:.96rem;color:var(--navy)}.operator-big-action span{display:block;color:var(--muted);font-size:.74rem;margin-top:3px}.big-icon{width:48px;height:48px;border-radius:14px;background:var(--blue-soft);color:#0876b9;display:grid;place-items:center;font-size:1.18rem;font-weight:900;border:1px solid #d8effe}

/* FORMS */
.field{display:grid;gap:6px;margin-bottom:13px}.field>span{font-size:.68rem;font-weight:800;color:var(--muted)}.field input,.field select,.field textarea{width:100%;border:1px solid #cfdbe5;background:#fff;border-radius:12px;padding:10px 11px;color:var(--ink);outline:none;transition:.15s ease}.field input:focus,.field select:focus,.field textarea:focus{border-color:#77c7f3;box-shadow:0 0 0 3px rgba(10,152,232,.10)}.field textarea{min-height:88px;resize:vertical}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.form-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:18px}.compact{margin:0}.compact select{padding:8px 9px;font-size:.74rem}
.modal-backdrop{position:fixed;inset:0;background:rgba(4,23,40,.55);backdrop-filter:blur(6px);z-index:100;display:grid;place-items:center;padding:20px}.modal-backdrop[hidden]{display:none}.modal{width:min(690px,100%);max-height:90vh;overflow:auto;background:#fff;border-radius:24px;box-shadow:0 34px 90px rgba(4,23,40,.28);border:1px solid rgba(255,255,255,.65)}.modal-head{padding:20px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:flex-start;background:linear-gradient(180deg,#fff,#fbfdff)}.modal-head h2{margin:2px 0 0;font-size:1.1rem;color:var(--navy)}.modal-body{padding:20px}.toast{position:fixed;right:22px;bottom:22px;z-index:200;background:var(--navy);color:#fff;border-radius:13px;padding:12px 15px;font-size:.73rem;font-weight:760;box-shadow:var(--shadow);opacity:0;transform:translateY(8px);pointer-events:none;transition:.2s}.toast.show{opacity:1;transform:none}
.section-tabs{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:16px}.section-tab{border:1px solid var(--line);background:#fff;color:var(--muted);border-radius:999px;padding:8px 11px;font-size:.69rem;font-weight:800}.section-tab.active{background:var(--navy);color:#fff;border-color:var(--navy)}
.callout{position:relative;overflow:hidden;background:linear-gradient(135deg,var(--navy-deep),var(--navy-2));color:#fff;border-radius:19px;padding:19px}.callout::after{content:"";position:absolute;right:-45px;top:-45px;width:140px;height:140px;border:26px solid rgba(10,152,232,.13);border-radius:50%}.callout strong{font-size:.97rem}.callout p{color:#c6d5e1;font-size:.75rem;line-height:1.5;margin:7px 0 0;max-width:90%}.callout .tag{margin-top:11px;background:rgba(255,255,255,.1);color:#fff}

/* RESPONSIVE */
@media(max-width:1180px){.kpi-grid{grid-template-columns:repeat(2,1fr)}.site-grid{grid-template-columns:repeat(2,1fr)}.grid-2{grid-template-columns:1fr}}
@media(max-width:860px){
  .app-shell{grid-template-columns:1fr}.sidebar{position:fixed;left:-290px;width:268px;transition:.22s cubic-bezier(.2,.8,.2,1);box-shadow:22px 0 60px rgba(0,0,0,.20)}.sidebar.open{left:0}.menu-btn{display:inline-grid;place-items:center}.topbar{height:76px;padding:0 14px;gap:10px;justify-content:flex-start}.topbar-actions{margin-left:auto}.topbar h1{font-size:1.10rem}.view{padding:20px 14px 40px}.hero-row{align-items:flex-start;flex-direction:column}.hero-row::before{left:-14px;top:-20px;height:62px}.action-row{justify-content:flex-start}.site-grid{grid-template-columns:1fr}.form-grid{grid-template-columns:1fr}.brand-ribbon{overflow:auto;scrollbar-width:none}.brand-ribbon::-webkit-scrollbar{display:none}.live-pill{display:none}.funnel{grid-template-columns:repeat(4,1fr)}
}
@media(max-width:560px){
  .kpi-grid{grid-template-columns:1fr 1fr;gap:9px}.kpi-card{padding:14px}.kpi-value{font-size:1.42rem}.view{padding-left:10px;padding-right:10px}.panel{padding:14px;border-radius:17px}.topbar .eyebrow{display:none}.avatar{display:none}.ghost-btn{display:none}.hero-row h2{font-size:1.10rem}.hero-row p{font-size:.80rem}.funnel{display:flex;overflow:auto;scroll-snap-type:x mandatory}.funnel-step{min-width:122px;scroll-snap-align:start}.data-table{min-width:650px}.ticket{grid-template-columns:4px 1fr}.ticket-side{grid-column:2;text-align:left;padding:0 10px 12px 0}.brand-ribbon{height:29px;font-size:.56rem}.brand-ribbon span{padding:0 14px}.modal-backdrop{padding:9px}.modal{border-radius:19px}.modal-body,.modal-head{padding:16px}.splash-copy{flex-direction:column;gap:3px}.splash-copy span{font-size:.60rem}
}