:root{
  --bg:#050b14;
  --bg-soft:#081220;
  --panel:#0d192a;
  --panel-2:#101f33;
  --panel-3:#14263d;
  --line:rgba(148,163,184,.14);
  --line-strong:rgba(148,163,184,.24);
  --text:#f7f9fc;
  --muted:#91a0b6;
  --muted-2:#64748b;
  --green:#19d68c;
  --green-soft:rgba(25,214,140,.12);
  --blue:#3da2ff;
  --blue-soft:rgba(61,162,255,.12);
  --purple:#8b5cf6;
  --purple-soft:rgba(139,92,246,.14);
  --amber:#f5b942;
  --amber-soft:rgba(245,185,66,.13);
  --red:#ff647c;
  --red-soft:rgba(255,100,124,.12);
  --shadow:0 24px 70px rgba(0,0,0,.36);
  --radius:18px;
  --radius-sm:12px;
  --sidebar:252px;
  --bottom-nav:72px;
  --ease:cubic-bezier(.2,.8,.2,1);
}
*{box-sizing:border-box}
html{background:var(--bg);color-scheme:dark}
body{margin:0;min-height:100vh;background:
  radial-gradient(circle at 10% -10%,rgba(25,214,140,.08),transparent 28%),
  radial-gradient(circle at 95% 0,rgba(139,92,246,.11),transparent 32%),
  var(--bg);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-size:14px;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit}
button{color:inherit}
::selection{background:rgba(139,92,246,.4)}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:rgba(148,163,184,.2);border-radius:999px;border:2px solid transparent;background-clip:padding-box}

/* App shell */
.arvo-app{min-height:100vh}
.arvo-sidebar{position:fixed;inset:0 auto 0 0;width:var(--sidebar);padding:20px 16px;display:flex;flex-direction:column;background:linear-gradient(180deg,rgba(9,19,33,.98),rgba(5,12,22,.99));border-right:1px solid var(--line);z-index:40}
.arvo-brand{display:flex;align-items:center;gap:12px;padding:6px 10px 20px}
.arvo-brand-mark{position:relative;width:34px;height:32px;flex:0 0 auto}
.arvo-brand-mark:before,.arvo-brand-mark:after{content:"";position:absolute;inset:auto}
.arvo-brand-mark:before{left:2px;bottom:1px;width:30px;height:30px;background:linear-gradient(145deg,#24e0a0,#179d78);clip-path:polygon(50% 0,100% 100%,70% 100%,50% 58%,32% 100%,0 100%)}
.arvo-brand-mark:after{left:13px;bottom:8px;width:13px;height:13px;background:var(--bg);clip-path:polygon(50% 0,100% 100%,0 100%)}
.arvo-brand-copy strong{display:block;font-size:18px;letter-spacing:.16em}.arvo-brand-copy span{display:block;color:var(--muted);font-size:10px;letter-spacing:.08em;margin-top:2px}
.arvo-user{display:flex;align-items:center;gap:10px;padding:12px;margin:0 4px 18px;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.02)}
.arvo-avatar{width:34px;height:34px;border-radius:12px;display:grid;place-items:center;background:linear-gradient(145deg,var(--purple),#5b32c8);box-shadow:0 10px 28px rgba(139,92,246,.23);font-weight:800}
.arvo-user-meta{min-width:0}.arvo-user-meta strong{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.arvo-user-meta span{display:block;color:var(--muted);font-size:11px;margin-top:2px}
.arvo-nav-title{padding:0 12px 8px;color:var(--muted-2);font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.12em}
.arvo-nav{display:flex;flex-direction:column;gap:5px}
.arvo-nav a,.arvo-logout{display:flex;align-items:center;gap:12px;min-height:44px;padding:0 12px;border-radius:12px;color:#b6c1d1;transition:.2s var(--ease);border:1px solid transparent;background:none;width:100%;cursor:pointer;text-align:left}
.arvo-nav a:hover,.arvo-logout:hover{color:white;background:rgba(255,255,255,.035)}
.arvo-nav a.active{color:var(--green);background:var(--green-soft);border-color:rgba(25,214,140,.14);box-shadow:inset 3px 0 0 var(--green)}
.arvo-nav svg,.arvo-logout svg{width:19px;height:19px;stroke-width:1.8;flex:0 0 auto}
.arvo-sidebar-bottom{margin-top:auto;padding-top:16px;border-top:1px solid var(--line)}
.arvo-logout{color:#ff8295}.arvo-version{padding:12px;color:var(--muted-2);font-size:10px}
.arvo-main{min-height:100vh;margin-left:var(--sidebar);padding:26px 30px 42px}
.arvo-topbar{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;margin-bottom:24px}
.arvo-heading h1{font-size:28px;line-height:1.15;margin:0 0 7px;letter-spacing:-.03em}.arvo-heading p{margin:0;color:var(--muted);max-width:720px}
.arvo-top-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:flex-end}
.arvo-mobile-top{display:none}
.arvo-bottom-nav{display:none}
.arvo-drawer-overlay{display:none}

/* Layout helpers */
.container-wide{max-width:1500px;margin:0 auto}
.grid{display:grid;gap:14px}.grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}.grid-4{grid-template-columns:repeat(4,minmax(0,1fr))}.grid-5{grid-template-columns:repeat(5,minmax(0,1fr))}.grid-6{grid-template-columns:repeat(6,minmax(0,1fr))}
.stack{display:flex;flex-direction:column;gap:14px}.row{display:flex;align-items:center;gap:10px}.row-wrap{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.space-between{justify-content:space-between}.grow{flex:1;min-width:0}.muted{color:var(--muted)}.subtle{color:var(--muted-2)}.nowrap{white-space:nowrap}.hide{display:none!important}
.section{margin-top:22px}.section-title{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:12px}.section-title h2{font-size:17px;margin:0}.section-title p{margin:3px 0 0;color:var(--muted);font-size:12px}

/* Surfaces */
.card,.panel{border:1px solid var(--line);background:linear-gradient(180deg,rgba(15,29,48,.94),rgba(9,20,35,.96));border-radius:var(--radius);box-shadow:0 14px 38px rgba(0,0,0,.16)}
.card{padding:17px}.panel{padding:20px}.card.hover{transition:.22s var(--ease)}.card.hover:hover{transform:translateY(-2px);border-color:var(--line-strong);box-shadow:var(--shadow)}
.metric-card{position:relative;overflow:hidden;min-height:126px;padding:17px;border:1px solid var(--line);border-radius:16px;background:linear-gradient(145deg,rgba(17,34,56,.96),rgba(8,19,34,.96))}
.metric-card:after{content:"";position:absolute;width:90px;height:90px;border-radius:50%;right:-32px;top:-36px;background:var(--metric-glow,rgba(139,92,246,.12));filter:blur(2px)}
.metric-icon{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:var(--metric-soft,var(--purple-soft));color:var(--metric-color,var(--purple));margin-bottom:18px}.metric-icon svg{width:19px;height:19px}
.metric-label{color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.07em}.metric-value{font-size:23px;line-height:1.1;font-weight:760;margin-top:7px;letter-spacing:-.03em}.metric-foot{display:flex;align-items:center;gap:6px;margin-top:8px;color:var(--muted);font-size:11px}.metric-foot.positive{color:var(--green)}.metric-foot.negative{color:var(--red)}
.kpi-compact{padding:14px;border-radius:14px;border:1px solid var(--line);background:rgba(255,255,255,.022)}.kpi-compact span{display:block;color:var(--muted);font-size:10px;text-transform:uppercase;letter-spacing:.06em}.kpi-compact strong{display:block;font-size:17px;margin-top:7px}

/* Buttons / controls */
.btn{min-height:40px;padding:0 14px;border-radius:12px;border:1px solid var(--line);background:rgba(255,255,255,.035);display:inline-flex;align-items:center;justify-content:center;gap:8px;font-weight:650;cursor:pointer;transition:.2s var(--ease);white-space:nowrap}
.btn:hover{transform:translateY(-1px);border-color:var(--line-strong);background:rgba(255,255,255,.06)}
.btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.btn svg{width:17px;height:17px}
.btn-primary{border-color:transparent;background:linear-gradient(135deg,#22d99a,#11a877);color:#03130d;box-shadow:0 12px 30px rgba(25,214,140,.18)}.btn-primary:hover{background:linear-gradient(135deg,#35e5a8,#19b982)}
.btn-purple{border-color:transparent;background:linear-gradient(135deg,#8f65ff,#6f46df);box-shadow:0 12px 30px rgba(139,92,246,.2)}
.btn-danger{color:#ff8b9d;border-color:rgba(255,100,124,.24);background:var(--red-soft)}
.btn-ghost{background:transparent}.btn-sm{min-height:32px;padding:0 10px;border-radius:10px;font-size:12px}.btn-icon{width:40px;padding:0}.btn-icon.btn-sm{width:32px}
.field{display:flex;flex-direction:column;gap:7px}.field label,.field-label{font-size:11px;font-weight:650;color:#b7c2d2}.field small{color:var(--muted-2)}
.input,.select,.textarea,input[type="text"],input[type="email"],input[type="password"],input[type="number"],input[type="date"],input[type="month"],select,textarea{width:100%;min-height:42px;border:1px solid var(--line);border-radius:12px;background:#081525;color:var(--text);padding:9px 12px;outline:none;transition:.18s var(--ease)}
textarea{min-height:90px;resize:vertical}.input:focus,.select:focus,.textarea:focus,input:focus,select:focus,textarea:focus{border-color:rgba(139,92,246,.62);box-shadow:0 0 0 3px rgba(139,92,246,.11)}
.input-icon{position:relative}.input-icon svg{position:absolute;left:12px;top:50%;transform:translateY(-50%);width:17px;height:17px;color:var(--muted)}.input-icon input{padding-left:38px}
.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.form-grid-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.field-span-2{grid-column:span 2}.field-span-all{grid-column:1/-1}
.check-row{display:flex;align-items:flex-start;gap:10px}.check-row input{width:17px;height:17px;min-height:0;margin-top:2px}.check-row label{color:#cbd5e1;line-height:1.45}

/* Badges / alerts */
.badge{display:inline-flex;align-items:center;gap:6px;min-height:24px;padding:0 9px;border-radius:999px;font-size:10px;font-weight:700;letter-spacing:.02em;border:1px solid var(--line);background:rgba(255,255,255,.035);white-space:nowrap}.badge:before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.badge-success{color:var(--green);background:var(--green-soft);border-color:rgba(25,214,140,.2)}.badge-info{color:var(--blue);background:var(--blue-soft);border-color:rgba(61,162,255,.2)}.badge-warning{color:var(--amber);background:var(--amber-soft);border-color:rgba(245,185,66,.22)}.badge-danger{color:var(--red);background:var(--red-soft);border-color:rgba(255,100,124,.22)}.badge-purple{color:#a88cff;background:var(--purple-soft);border-color:rgba(139,92,246,.22)}
.alert{display:flex;align-items:flex-start;gap:12px;padding:13px 14px;border-radius:13px;border:1px solid var(--line);background:rgba(255,255,255,.022)}.alert svg{width:18px;height:18px;flex:0 0 auto;margin-top:1px}.alert strong{display:block;font-size:12px}.alert span{display:block;color:var(--muted);font-size:11px;margin-top:3px;line-height:1.4}.alert-success{border-color:rgba(25,214,140,.18);background:var(--green-soft);color:var(--green)}.alert-warning{border-color:rgba(245,185,66,.2);background:var(--amber-soft);color:var(--amber)}.alert-danger{border-color:rgba(255,100,124,.2);background:var(--red-soft);color:var(--red)}.alert-info{border-color:rgba(61,162,255,.2);background:var(--blue-soft);color:var(--blue)}

/* Tables / lists */
.table-wrap{width:100%;overflow:auto;border:1px solid var(--line);border-radius:15px}.table{width:100%;border-collapse:collapse;min-width:820px}.table th{padding:12px 14px;color:var(--muted-2);font-size:10px;text-align:left;text-transform:uppercase;letter-spacing:.06em;background:rgba(255,255,255,.018);border-bottom:1px solid var(--line);white-space:nowrap}.table td{padding:13px 14px;border-bottom:1px solid rgba(148,163,184,.08);vertical-align:middle}.table tr:last-child td{border-bottom:0}.table tbody tr{transition:.15s}.table tbody tr.clickable{cursor:pointer}.table tbody tr.clickable:hover{background:rgba(139,92,246,.055)}
.product-cell{display:flex;align-items:center;gap:11px;min-width:240px}.product-thumb{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;background:linear-gradient(145deg,rgba(139,92,246,.22),rgba(61,162,255,.1));border:1px solid var(--line);font-weight:800;color:#c5b4ff;overflow:hidden}.product-thumb img{width:100%;height:100%;object-fit:cover}.product-meta strong{display:block;max-width:310px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.product-meta span{display:block;color:var(--muted);font-size:10px;margin-top:3px}.money-positive{color:var(--green);font-weight:700}.money-negative{color:var(--red);font-weight:700}
.list{display:flex;flex-direction:column}.list-item{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:13px 0;border-bottom:1px solid rgba(148,163,184,.09)}.list-item:last-child{border-bottom:0}.list-item-main{min-width:0}.list-item-main strong{display:block}.list-item-main span{display:block;color:var(--muted);font-size:11px;margin-top:3px}.list-item-value{text-align:right;font-weight:700}
.empty{padding:36px 20px;text-align:center;color:var(--muted)}.empty svg{width:34px;height:34px;margin-bottom:10px;color:var(--muted-2)}.empty strong{display:block;color:#c8d1df;margin-bottom:4px}

/* Tabs / segmented */
.tabs{display:flex;gap:5px;padding:5px;background:rgba(255,255,255,.025);border:1px solid var(--line);border-radius:13px;overflow:auto}.tab{min-height:34px;padding:0 12px;border:0;border-radius:9px;background:transparent;color:var(--muted);cursor:pointer;white-space:nowrap}.tab.active{background:rgba(139,92,246,.16);color:#cdbfff;box-shadow:inset 0 0 0 1px rgba(139,92,246,.18)}
.chips{display:flex;gap:7px;flex-wrap:wrap}.chip{min-height:32px;padding:0 11px;border-radius:999px;border:1px solid var(--line);background:transparent;color:var(--muted);cursor:pointer}.chip.active{color:white;background:rgba(139,92,246,.15);border-color:rgba(139,92,246,.28)}

/* Drawer / modal */
.overlay{position:fixed;inset:0;background:rgba(0,0,0,.62);backdrop-filter:blur(5px);z-index:80;opacity:0;pointer-events:none;transition:.22s}.overlay.open{opacity:1;pointer-events:auto}
.drawer{position:fixed;inset:0 0 0 auto;width:min(720px,100%);background:linear-gradient(180deg,#0a1728,#07111f);border-left:1px solid var(--line);z-index:81;transform:translateX(102%);transition:.28s var(--ease);display:flex;flex-direction:column;box-shadow:-20px 0 60px rgba(0,0,0,.45)}.drawer.open{transform:none}.drawer-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:19px 22px;border-bottom:1px solid var(--line)}.drawer-head h2{margin:0;font-size:19px}.drawer-body{padding:20px 22px 32px;overflow:auto;flex:1}.drawer-foot{padding:15px 22px;border-top:1px solid var(--line);display:flex;gap:10px;justify-content:flex-end;background:rgba(5,11,20,.92)}
.modal{position:fixed;left:50%;top:50%;width:min(680px,calc(100% - 28px));max-height:90vh;background:linear-gradient(180deg,#0c1a2c,#071321);border:1px solid var(--line);border-radius:20px;z-index:82;transform:translate(-50%,-46%) scale(.98);opacity:0;pointer-events:none;transition:.23s var(--ease);box-shadow:var(--shadow);display:flex;flex-direction:column}.modal.open{transform:translate(-50%,-50%) scale(1);opacity:1;pointer-events:auto}.modal-head{padding:19px 21px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:12px}.modal-head h2{margin:0;font-size:18px}.modal-body{padding:20px 21px;overflow:auto}.modal-foot{padding:14px 21px;border-top:1px solid var(--line);display:flex;justify-content:flex-end;gap:10px}
.close-btn{border:0;background:transparent;width:34px;height:34px;border-radius:10px;display:grid;place-items:center;cursor:pointer;color:var(--muted)}.close-btn:hover{background:rgba(255,255,255,.05);color:white}.close-btn svg{width:19px;height:19px}

/* Progress / timeline */
.progress{height:8px;border-radius:999px;background:rgba(255,255,255,.06);overflow:hidden}.progress>span{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--purple),var(--green));transition:.3s}
.timeline{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:0;margin:20px 0}.timeline-step{position:relative;text-align:center;padding-top:34px;color:var(--muted);font-size:10px}.timeline-step:before{content:"";position:absolute;top:13px;left:50%;width:12px;height:12px;border-radius:50%;background:#24334a;border:2px solid #526077;transform:translateX(-50%);z-index:2}.timeline-step:after{content:"";position:absolute;top:19px;left:0;width:100%;height:2px;background:#24334a;z-index:1}.timeline-step:first-child:after{left:50%;width:50%}.timeline-step:last-child:after{width:50%}.timeline-step.done{color:#c8d4e4}.timeline-step.done:before{background:var(--green);border-color:var(--green);box-shadow:0 0 0 5px var(--green-soft)}.timeline-step.done:after{background:var(--green)}.timeline-step.current{color:white}.timeline-step.current:before{background:var(--purple);border-color:#b8a6ff;box-shadow:0 0 0 6px var(--purple-soft)}

/* Charts */
.chart-card{position:relative;overflow:hidden}.chart-svg{width:100%;height:260px;display:block}.chart-grid line{stroke:rgba(148,163,184,.12)}.chart-label{fill:var(--muted-2);font-size:10px}.legend{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-top:8px}.legend span{display:flex;align-items:center;gap:7px;color:var(--muted);font-size:11px}.legend i{width:8px;height:8px;border-radius:50%}
.donut{width:150px;height:150px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(var(--purple) 0 42%,var(--green) 42% 70%,var(--blue) 70% 88%,var(--amber) 88% 100%);position:relative}.donut:before{content:"";position:absolute;width:94px;height:94px;border-radius:50%;background:#0c192a}.donut-center{position:relative;text-align:center}.donut-center strong{display:block;font-size:17px}.donut-center span{display:block;color:var(--muted);font-size:10px}

/* Toast */
.toast-area{position:fixed;right:18px;top:18px;z-index:120;display:flex;flex-direction:column;gap:10px;pointer-events:none}.toast{min-width:280px;max-width:420px;padding:13px 14px;border-radius:14px;border:1px solid var(--line);background:#0f2035;box-shadow:var(--shadow);display:flex;align-items:flex-start;gap:10px;animation:toastIn .24s var(--ease)}.toast svg{width:18px;height:18px;flex:0 0 auto}.toast strong{display:block;font-size:12px}.toast span{display:block;color:var(--muted);font-size:11px;margin-top:3px}.toast.success{border-color:rgba(25,214,140,.25)}.toast.error{border-color:rgba(255,100,124,.25)}@keyframes toastIn{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}

/* Page specific utilities */
.summary-strip{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px}.summary-strip .kpi-compact{min-height:78px}
.toolbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:14px}.toolbar .input-icon{min-width:260px;flex:1}.filters-panel{display:flex;gap:8px;flex-wrap:wrap}
.detail-hero{display:flex;gap:16px;align-items:flex-start;padding-bottom:18px;border-bottom:1px solid var(--line)}.detail-hero .product-thumb{width:62px;height:62px;border-radius:17px;font-size:20px}.detail-hero h2{margin:0 0 6px;font-size:21px}.detail-meta{display:flex;gap:8px;flex-wrap:wrap;color:var(--muted);font-size:11px}
.calc-summary{position:sticky;top:10px}.calc-line{display:flex;justify-content:space-between;gap:14px;padding:9px 0;border-bottom:1px solid rgba(148,163,184,.09)}.calc-line:last-child{border-bottom:0}.calc-line span{color:var(--muted)}.calc-line strong{white-space:nowrap}.calc-total{padding-top:13px;margin-top:4px;border-top:1px solid var(--line-strong)}.calc-total strong{font-size:20px;color:var(--green)}
.wizard-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:18px}.wizard-step{padding:10px;border-radius:11px;border:1px solid var(--line);color:var(--muted);font-size:11px;text-align:center}.wizard-step.active{color:#d8ceff;border-color:rgba(139,92,246,.34);background:var(--purple-soft)}.wizard-step.done{color:var(--green);border-color:rgba(25,214,140,.25);background:var(--green-soft)}
.sync-module{display:grid;grid-template-columns:42px minmax(0,1fr) auto;gap:13px;align-items:center;padding:14px;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.02)}.sync-module-icon{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;background:rgba(255,255,255,.035)}.sync-module-icon svg{width:20px;height:20px}.sync-module strong{display:block}.sync-module p{margin:4px 0 0;color:var(--muted);font-size:11px}.sync-module-actions{text-align:right}
.mobile-card-list{display:none}

/* Login */
.login-page{min-height:100vh;display:grid;grid-template-columns:minmax(380px,.9fr) minmax(500px,1.1fr)}.login-panel{display:flex;align-items:center;justify-content:center;padding:40px;background:rgba(5,11,20,.9)}.login-card{width:min(430px,100%)}.login-card .arvo-brand{padding-left:0}.login-card h1{font-size:34px;letter-spacing:-.04em;margin:34px 0 10px}.login-card>p{color:var(--muted);line-height:1.65;margin:0 0 28px}.login-visual{position:relative;overflow:hidden;background:radial-gradient(circle at 70% 30%,rgba(139,92,246,.28),transparent 34%),radial-gradient(circle at 30% 72%,rgba(25,214,140,.18),transparent 32%),#081221}.login-orb{position:absolute;border-radius:50%;filter:blur(2px)}.login-orb.one{width:320px;height:320px;right:8%;top:12%;background:linear-gradient(145deg,rgba(139,92,246,.4),rgba(61,162,255,.08));box-shadow:0 0 90px rgba(139,92,246,.18)}.login-orb.two{width:230px;height:230px;left:18%;bottom:16%;background:linear-gradient(145deg,rgba(25,214,140,.28),rgba(25,214,140,.02));box-shadow:0 0 80px rgba(25,214,140,.13)}.login-preview{position:absolute;left:50%;top:50%;width:min(660px,80%);transform:translate(-50%,-50%) rotate(-3deg);padding:24px;border:1px solid rgba(255,255,255,.12);border-radius:24px;background:rgba(8,20,35,.72);backdrop-filter:blur(18px);box-shadow:0 40px 100px rgba(0,0,0,.5)}

/* Responsive */
@media(max-width:1200px){.grid-6{grid-template-columns:repeat(3,minmax(0,1fr))}.grid-5{grid-template-columns:repeat(3,minmax(0,1fr))}.grid-4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:900px){
  :root{--sidebar:0px}
  .arvo-sidebar{transform:translateX(-102%);width:min(290px,86vw);transition:.28s var(--ease);z-index:100}.arvo-sidebar.open{transform:none}
  .arvo-drawer-overlay{display:block;position:fixed;inset:0;background:rgba(0,0,0,.65);backdrop-filter:blur(4px);z-index:99;opacity:0;pointer-events:none;transition:.2s}.arvo-drawer-overlay.open{opacity:1;pointer-events:auto}
  .arvo-main{margin:0;padding:88px 16px calc(var(--bottom-nav) + 26px)}
  .arvo-mobile-top{display:flex;position:fixed;top:0;left:0;right:0;height:66px;z-index:70;padding:0 16px;align-items:center;justify-content:space-between;background:rgba(5,11,20,.88);backdrop-filter:blur(16px);border-bottom:1px solid var(--line)}
  .arvo-mobile-top .arvo-brand{padding:0}.arvo-mobile-top .arvo-brand-copy span{display:none}.arvo-mobile-top .arvo-brand-copy strong{font-size:15px}
  .mobile-menu-btn{width:40px;height:40px;border-radius:12px;border:1px solid var(--line);background:rgba(255,255,255,.03);display:grid;place-items:center}.mobile-menu-btn svg{width:19px;height:19px}
  .arvo-bottom-nav{display:grid;position:fixed;z-index:65;left:12px;right:12px;bottom:10px;height:var(--bottom-nav);grid-template-columns:repeat(3,1fr);padding:7px;border:1px solid var(--line);border-radius:20px;background:rgba(8,18,32,.92);backdrop-filter:blur(18px);box-shadow:0 18px 60px rgba(0,0,0,.4)}
  .arvo-bottom-nav a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;color:var(--muted);font-size:10px;border-radius:14px}.arvo-bottom-nav a svg{width:20px;height:20px}.arvo-bottom-nav a.active{color:var(--green);background:var(--green-soft)}
  .arvo-topbar{align-items:center}.arvo-heading h1{font-size:24px}.arvo-top-actions{display:none}
  .grid-5,.grid-6{grid-template-columns:repeat(2,minmax(0,1fr))}
  .grid-3{grid-template-columns:repeat(2,minmax(0,1fr))}
  .login-page{grid-template-columns:1fr}.login-visual{display:none}.login-panel{padding:28px 20px}.login-card h1{font-size:30px}
}
@media(max-width:680px){
  body{font-size:13px}.arvo-main{padding-left:13px;padding-right:13px}.arvo-topbar{margin-bottom:18px}.arvo-heading p{font-size:12px}.arvo-heading h1{font-size:22px}
  .grid-2,.grid-3,.grid-4,.grid-5,.grid-6{grid-template-columns:1fr 1fr}.metric-card{min-height:112px;padding:14px}.metric-icon{width:34px;height:34px;margin-bottom:13px}.metric-value{font-size:19px}.metric-label{font-size:9px}
  .panel{padding:15px}.card{padding:14px}.form-grid,.form-grid-3{grid-template-columns:1fr}.field-span-2{grid-column:auto}
  .table-wrap.desktop-table{display:none}.mobile-card-list{display:flex;flex-direction:column;gap:10px}.mobile-list-card{padding:14px;border:1px solid var(--line);border-radius:15px;background:linear-gradient(145deg,rgba(16,31,51,.94),rgba(8,19,34,.96));cursor:pointer}.mobile-list-card-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}.mobile-list-card-meta{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-top:13px}.mobile-list-card-meta div{padding:9px;border-radius:10px;background:rgba(255,255,255,.025)}.mobile-list-card-meta span{display:block;color:var(--muted);font-size:9px;text-transform:uppercase}.mobile-list-card-meta strong{display:block;margin-top:4px;font-size:12px}
  .toolbar .input-icon{min-width:100%}.toolbar>.select,.toolbar>select{flex:1}.summary-strip{grid-template-columns:1fr 1fr}.detail-hero{align-items:center}.detail-hero .product-thumb{width:52px;height:52px}.detail-meta{gap:5px}.timeline{overflow-x:auto;grid-template-columns:repeat(7,90px);padding-bottom:5px}.drawer-body{padding:16px}.drawer-head{padding:16px}.drawer-foot{padding:12px 16px}.wizard-steps{grid-template-columns:1fr}.calc-summary{position:static}.chart-svg{height:220px}.sync-module{grid-template-columns:38px minmax(0,1fr)}.sync-module-actions{grid-column:1/-1;text-align:left;display:flex;gap:8px}.donut{width:130px;height:130px}.donut:before{width:82px;height:82px}
}
@media(max-width:420px){.grid-2,.grid-3,.grid-4,.grid-5,.grid-6{grid-template-columns:1fr 1fr}.metric-card{min-height:104px}.metric-value{font-size:17px}.summary-strip{grid-template-columns:1fr 1fr}.btn{padding-left:12px;padding-right:12px}.modal-body{padding:16px}.modal-head{padding:16px}.modal-foot{padding:12px 16px}}
