/* ================================================================
   VALORIX UI 4.0 — PRODUCT SYSTEM
   One visual language for the complete Valorix App Suite.
   The app data layer remains online-only; this file is presentation.
   ================================================================ */
:root{
  --vx-bg:#020713;--vx-bg-2:#040b18;--vx-bg-3:#071225;--vx-bg-4:#0a1930;
  --vx-surface:#071225;--vx-surface-2:#09182d;--vx-surface-3:#0d203a;
  --vx-blue:#087cff;--vx-blue-2:#12a7ff;--vx-cyan:#06e5e8;--vx-cyan-2:#79f7ff;
  --vx-text:#f3f8fd;--vx-text-2:#c3d3e2;--vx-muted:#8298ad;--vx-dim:#5e748b;
  --vx-green:#48dfa0;--vx-amber:#ffbf66;--vx-red:#ff6b82;--vx-purple:#a88cff;
  --vx-line:rgba(69,158,232,.13);--vx-line-2:rgba(74,186,255,.26);--vx-line-3:rgba(100,220,255,.42);
  --vx-shadow:0 24px 80px rgba(0,0,0,.34);--vx-shadow-soft:0 12px 36px rgba(0,0,0,.20);
  --vx-sidebar:252px;--vx-radius:18px;--vx-radius-sm:12px;--vx-max:1520px;
  --accent:var(--vx-blue-2)!important;--accent2:var(--vx-cyan)!important;
  --green:var(--vx-green)!important;--red:var(--vx-red)!important;--orange:var(--vx-amber)!important;
  --purple:var(--vx-purple)!important;--yellow:#ffe070!important;
  --bg:var(--vx-bg)!important;--bg2:var(--vx-bg-2)!important;--panel:var(--vx-surface)!important;
  --border:var(--vx-line)!important;--border2:var(--vx-line-2)!important;
  --text:var(--vx-text)!important;--muted:var(--vx-muted)!important;--muted2:var(--vx-dim)!important;
}
*{box-sizing:border-box}
html{background:var(--vx-bg);color-scheme:dark;scroll-behavior:smooth}
html.vx-cloud-loading body[data-vx-app]{opacity:.08;pointer-events:none}
body{
  min-height:100vh!important;color:var(--vx-text)!important;
  background:
    radial-gradient(900px 540px at 77% -16%,rgba(8,124,255,.16),transparent 61%),
    radial-gradient(700px 460px at 22% 86%,rgba(6,229,232,.055),transparent 67%),
    linear-gradient(180deg,#01050d 0%,#020713 48%,#01040a 100%)!important;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
}
body::before{content:"";position:fixed;inset:0;z-index:-2;pointer-events:none;background-image:linear-gradient(rgba(255,255,255,.012) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.012) 1px,transparent 1px);background-size:82px 82px;mask-image:linear-gradient(to bottom,#000,transparent 88%)}
::selection{background:rgba(18,167,255,.32);color:#fff}a{color:inherit}

/* ---------- real brand ---------- */
.logo,.logo-big,.logo-ring{background:url('/valorix-logo.png') center/cover no-repeat!important;color:transparent!important;font-size:0!important;border:1px solid rgba(18,167,255,.22)!important;box-shadow:0 0 28px rgba(8,124,255,.13)!important}

/* ---------- fixed suite navigation ---------- */
.vx-suite-nav{position:fixed;left:0;top:0;bottom:0;width:var(--vx-sidebar);z-index:80;padding:18px 14px 14px;border-right:1px solid rgba(82,172,240,.105);background:linear-gradient(180deg,rgba(3,10,22,.985),rgba(2,7,16,.965));backdrop-filter:blur(22px);display:flex;flex-direction:column;gap:12px}
.vx-brand{height:54px;padding:5px 8px;display:flex;align-items:center;gap:11px;text-decoration:none;border-radius:13px}
.vx-brand:hover{background:rgba(255,255,255,.025)}
.vx-brand img{width:38px;height:38px;border-radius:11px;object-fit:cover;border:1px solid rgba(18,167,255,.24)}
.vx-brand-copy{min-width:0}.vx-brand-name{font-size:13px;line-height:1;font-weight:850;letter-spacing:.17em}.vx-brand-name b{color:#35cdfc}.vx-brand-sub{margin-top:6px;color:var(--vx-dim);font-size:10px;font-weight:650;letter-spacing:.04em}
.vx-nav-search{width:100%;height:38px;border:1px solid rgba(77,164,234,.12);border-radius:11px;background:rgba(255,255,255,.025);color:var(--vx-muted);display:flex;align-items:center;justify-content:space-between;padding:0 11px;cursor:pointer;font:600 11px/1 inherit}
.vx-nav-search:hover{border-color:var(--vx-line-2);background:rgba(8,124,255,.065);color:#e8f7ff}.vx-nav-search kbd{font:600 9px/1 inherit;color:var(--vx-dim);border:1px solid rgba(255,255,255,.09);border-radius:5px;padding:4px 5px;background:rgba(255,255,255,.025)}
.vx-nav-scroll{min-height:0;overflow:auto;padding-right:2px;scrollbar-width:none}.vx-nav-scroll::-webkit-scrollbar{display:none}
.vx-nav-label{padding:12px 10px 6px;color:#526b83;font-size:9px;font-weight:800;letter-spacing:.13em;text-transform:uppercase}
.vx-nav-link{min-height:39px;display:flex;align-items:center;gap:10px;padding:7px 9px;border-radius:11px;text-decoration:none;color:#829aaf;font-size:11.5px;font-weight:650;border:1px solid transparent;transition:.16s ease}
.vx-nav-link:hover{color:#e9f7ff;background:rgba(255,255,255,.025)}.vx-nav-link.active{color:#fff;border-color:rgba(18,167,255,.17);background:linear-gradient(100deg,rgba(8,124,255,.13),rgba(6,229,232,.045));box-shadow:inset 0 0 26px rgba(8,124,255,.035)}
.vx-nav-ico{width:27px;height:27px;border-radius:8px;display:grid;place-items:center;flex:none;background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.055);font-size:9px;font-weight:900;letter-spacing:.02em;color:#7ddfff}.vx-nav-link.active .vx-nav-ico{background:linear-gradient(135deg,rgba(8,124,255,.23),rgba(6,229,232,.10));border-color:rgba(18,167,255,.22);color:#9cf9ff}
.vx-nav-footer{padding:10px 7px 4px;border-top:1px solid rgba(255,255,255,.055)}.vx-user-mini{display:flex;align-items:center;gap:9px}.vx-avatar{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;background:linear-gradient(135deg,rgba(8,124,255,.24),rgba(6,229,232,.13));border:1px solid rgba(18,167,255,.20);font-weight:850;font-size:11px;color:#dffcff}.vx-user-lines{min-width:0;flex:1}.vx-user-lines b{display:block;font-size:10.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.vx-user-lines small{display:block;color:var(--vx-dim);font-size:9px;margin-top:2px}.vx-logout-mini{border:0;background:transparent;color:#607991;cursor:pointer;font-size:15px;padding:5px;border-radius:7px}.vx-logout-mini:hover{background:rgba(255,255,255,.04);color:#fff}

/* ---------- app workspace ---------- */
body.vx-app-shell .app{width:auto!important;max-width:var(--vx-max)!important;margin:0 auto 0 var(--vx-sidebar)!important;padding:24px 32px 92px!important;position:relative;z-index:1}
body.vx-app-shell .back{display:none!important}
body.vx-app-shell .hdr{min-height:72px;display:flex!important;align-items:center!important;justify-content:space-between!important;gap:18px!important;margin:0 0 18px!important;padding:0 2px 14px!important;border-bottom:1px solid rgba(255,255,255,.055)!important;position:relative!important;background:none!important}
body.vx-app-shell .hdr-left{gap:0!important}.hdr-left>.logo{display:none!important}
body.vx-app-shell .hdr h1{font-family:"Space Grotesk","DM Sans",system-ui,sans-serif!important;font-size:clamp(23px,2vw,30px)!important;font-weight:700!important;letter-spacing:-.035em!important;color:#fff!important}.hdr h1 span{display:block!important;margin:6px 0 0!important;color:var(--vx-muted)!important;font-family:"DM Sans",system-ui,sans-serif!important;font-size:11px!important;font-weight:550!important;letter-spacing:.015em!important}
.hdr-actions{display:flex!important;gap:8px!important;align-items:center!important;flex-wrap:wrap!important}

/* compact top tools */
.vx-context-pill{display:inline-flex;align-items:center;gap:7px;min-height:34px;padding:0 10px;border:1px solid rgba(74,174,246,.13);border-radius:999px;background:rgba(255,255,255,.022);color:#7f98ae;font-size:10px;font-weight:700}.vx-context-pill i{width:6px;height:6px;border-radius:50%;background:var(--vx-green);box-shadow:0 0 10px rgba(72,223,160,.36)}
.vx-context-pill[data-state="saving"] i,.vx-context-pill[data-state="loading"] i{background:var(--vx-amber)}.vx-context-pill[data-state="error"] i,.vx-context-pill[data-state="offline"] i{background:var(--vx-red)}
.vx-header-tools{display:flex;align-items:center;gap:8px}.vx-command-btn{height:36px;min-width:42px;padding:0 11px;border:1px solid rgba(74,174,246,.13);border-radius:11px;background:rgba(255,255,255,.025);color:#9cb2c6;cursor:pointer;font-weight:800}.vx-command-btn:hover{background:rgba(8,124,255,.075);border-color:var(--vx-line-2);color:#fff}

/* ---------- app overview / bento hero ---------- */
.vx-overview{display:grid;grid-template-columns:minmax(0,1.52fr) minmax(300px,.72fr);gap:14px;margin:0 0 18px}
.vx-overview-main,.vx-focus{position:relative;overflow:hidden;border:1px solid rgba(61,159,230,.14);border-radius:22px;background:linear-gradient(140deg,rgba(8,26,50,.90),rgba(4,14,29,.91));box-shadow:var(--vx-shadow-soft)}
.vx-overview-main{padding:24px 24px 20px}.vx-overview-main::after{content:"";position:absolute;right:-105px;top:-140px;width:320px;height:320px;border-radius:50%;background:radial-gradient(circle,rgba(18,167,255,.12),transparent 68%);pointer-events:none}.vx-eyebrow{position:relative;z-index:1;display:flex;align-items:center;gap:8px;color:#68dfff;font-size:9px;font-weight:850;letter-spacing:.16em;text-transform:uppercase}.vx-eyebrow::before{content:"";width:22px;height:1px;background:linear-gradient(90deg,var(--vx-cyan),var(--vx-blue))}.vx-overview h2{position:relative;z-index:1;margin:11px 0 5px!important;font:700 clamp(22px,2vw,31px)/1.08 "Space Grotesk","DM Sans",system-ui,sans-serif!important;letter-spacing:-.038em!important;color:#fff}.vx-overview-sub{position:relative;z-index:1;color:var(--vx-muted);font-size:12px;line-height:1.6;max-width:720px}.vx-overview-actions{position:relative;z-index:1;display:flex;gap:8px;flex-wrap:wrap;margin:18px 0 20px}.vx-hero-btn{min-height:38px;padding:0 14px;border-radius:11px;border:1px solid rgba(18,167,255,.16);background:rgba(8,124,255,.07);color:#c6e8ff;font-size:11px;font-weight:800;cursor:pointer}.vx-hero-btn:hover{background:rgba(8,124,255,.14);border-color:rgba(18,167,255,.32);color:#fff;transform:translateY(-1px)}.vx-hero-btn.primary{border:0!important;background:linear-gradient(105deg,var(--vx-cyan),var(--vx-blue-2))!important;color:#001725!important;box-shadow:0 11px 28px rgba(0,137,255,.18)!important}.vx-hero-btn.primary:hover{box-shadow:0 14px 36px rgba(0,137,255,.27)!important}
.vx-metrics{position:relative;z-index:1;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.vx-metric{min-width:0;padding:12px 13px;border:1px solid rgba(76,169,234,.10);border-radius:13px;background:rgba(0,7,18,.31)}.vx-metric small{display:block;color:#688096;font-size:9px;font-weight:750;text-transform:uppercase;letter-spacing:.065em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.vx-metric strong{display:block;margin-top:6px;font:700 17px/1.1 "Space Grotesk","DM Sans",system-ui,sans-serif;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;letter-spacing:-.025em}
.vx-focus{padding:19px}.vx-focus-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px}.vx-focus-head span:first-child{font-size:9px;font-weight:850;letter-spacing:.13em;color:#7f98ae;text-transform:uppercase}.vx-focus-head span:last-child{font-size:9px;color:#536b82}.vx-focus-list{display:grid;gap:6px}.vx-focus-item{width:100%;min-height:49px;display:grid;grid-template-columns:8px 1fr auto;align-items:center;gap:10px;padding:9px 10px;border:1px solid rgba(76,169,234,.08);border-radius:11px;background:rgba(255,255,255,.018);color:inherit;text-align:left;cursor:pointer}.vx-focus-item:hover{border-color:rgba(18,167,255,.22);background:rgba(8,124,255,.055)}.vx-focus-dot{width:6px;height:6px;border-radius:50%;background:#27d4f7;box-shadow:0 0 12px rgba(39,212,247,.23)}.vx-focus-copy{min-width:0}.vx-focus-copy b{display:block;font-size:11px;font-weight:730;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.vx-focus-copy small{display:block;margin-top:3px;color:#687f94;font-size:9.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.vx-focus-arrow{color:#587086;font-size:13px}.vx-focus-empty{padding:18px 8px;color:#6c849a;font-size:11px;line-height:1.6}.vx-insight{margin-top:10px;padding-top:10px;border-top:1px solid rgba(255,255,255,.05);color:#8199ad;font-size:10.5px;line-height:1.55}.vx-insight b{color:#8be9ff}

/* ---------- sub navigation ---------- */
body.vx-app-shell .tabs{position:sticky!important;top:0!important;z-index:55!important;display:flex!important;gap:4px!important;margin:0 0 16px!important;padding:6px!important;border:1px solid rgba(63,160,229,.11)!important;border-radius:14px!important;background:rgba(2,9,20,.88)!important;box-shadow:0 12px 34px rgba(0,0,0,.17)!important;backdrop-filter:blur(18px);overflow-x:auto!important;scrollbar-width:none!important}
.tabs::-webkit-scrollbar{display:none}.tab,.cat-tab,.nav-tab{min-height:36px!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;padding:0 13px!important;border:1px solid transparent!important;border-radius:9px!important;color:#758da3!important;background:transparent!important;font-size:10.5px!important;font-weight:750!important;letter-spacing:.005em!important;white-space:nowrap!important;cursor:pointer!important;transition:.16s ease!important}.tab:hover,.cat-tab:hover,.nav-tab:hover{background:rgba(255,255,255,.026)!important;color:#d9e9f5!important}.tab.active,.cat-tab.active,.nav-tab.active{border-color:rgba(18,167,255,.20)!important;background:linear-gradient(105deg,rgba(8,124,255,.14),rgba(6,229,232,.055))!important;color:#91efff!important;box-shadow:none!important}

/* ---------- sections / bento content ---------- */
.section{animation:vxSection .18s ease}.section.active{display:block}@keyframes vxSection{from{opacity:.35;transform:translateY(4px)}to{opacity:1;transform:none}}
body.vx-app-shell .section>.kpi-row{display:none!important}
.grid2{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important;margin-bottom:12px!important}.kpi-row{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:10px!important}.card,.panel,.box,.widget,.tile,.kpi,.cp,.card-panel,.quick-card,.feed-card{border:1px solid rgba(67,159,226,.11)!important;border-radius:16px!important;background:linear-gradient(155deg,rgba(8,21,41,.78),rgba(4,13,27,.76))!important;box-shadow:0 10px 34px rgba(0,0,0,.15)!important}.card,.panel,.box,.widget,.tile,.cp,.card-panel{padding:18px!important}.card:hover,.tile:hover,.proj-card:hover,.pet-card:hover,.trip-card:hover,.tcg-card:hover{border-color:rgba(18,167,255,.25)!important;box-shadow:0 17px 44px rgba(0,0,0,.22)!important}.card::before,.kpi::before{opacity:.35!important}.card h3,.cp h3,.chart-card h3{margin-bottom:12px!important;color:#8399ad!important;font-size:9.5px!important;font-weight:850!important;text-transform:uppercase!important;letter-spacing:.09em!important}.chart-wrap{height:210px!important}.empty{padding:28px 18px!important;border:1px dashed rgba(70,166,234,.14)!important;border-radius:14px!important;background:rgba(8,124,255,.018)!important;color:#6f879d!important}.empty .ei{opacity:.65!important}

/* cards generated by the individual apps */
.kb-grid{gap:10px!important}.kb-col{border:1px solid rgba(65,158,226,.10)!important;border-radius:15px!important;background:rgba(5,15,30,.69)!important;overflow:hidden!important}.kb-col-hdr{padding:12px 13px!important;background:rgba(255,255,255,.015)!important;border-color:rgba(255,255,255,.045)!important}.kb-body{padding:8px!important;gap:7px!important}.kb-card{padding:12px!important;border:1px solid rgba(65,158,226,.105)!important;border-radius:11px!important;background:rgba(7,20,37,.87)!important;box-shadow:0 7px 20px rgba(0,0,0,.12)!important}.kb-card:hover{border-color:rgba(18,167,255,.26)!important;box-shadow:0 12px 28px rgba(0,0,0,.21)!important;transform:translateY(-1px)!important}.proj-grid,.pet-grid,.trip-grid,.card-grid,.catch-grid,.member-grid,.meal-grid{gap:10px!important}.proj-card,.pet-card,.trip-card,.tcg-card{border-color:rgba(65,158,226,.11)!important;background:linear-gradient(150deg,rgba(8,22,42,.82),rgba(4,13,27,.75))!important;border-radius:15px!important;box-shadow:0 10px 30px rgba(0,0,0,.14)!important}

/* ---------- buttons ---------- */
.btn,.auth-btn,button{transition:transform .14s ease,border-color .14s ease,background .14s ease,box-shadow .14s ease,opacity .14s ease}.btn{min-height:36px!important;padding:0 13px!important;border:1px solid rgba(69,160,228,.13)!important;border-radius:10px!important;background:rgba(255,255,255,.026)!important;color:#b5c8d8!important;font-size:10.5px!important;font-weight:750!important;box-shadow:none!important}.btn:hover{transform:translateY(-1px)!important;border-color:rgba(18,167,255,.25)!important;background:rgba(8,124,255,.06)!important;color:#fff!important}.btn:active,button:active{transform:translateY(0)!important}.btn.primary,.auth-btn.primary,.primary{border-color:transparent!important;background:linear-gradient(108deg,var(--vx-cyan),var(--vx-blue-2))!important;color:#001623!important;font-weight:850!important;box-shadow:0 9px 26px rgba(0,139,255,.17)!important}.btn.primary:hover,.auth-btn.primary:hover,.primary:hover{box-shadow:0 12px 32px rgba(0,139,255,.25)!important}.btn.danger,.danger{border-color:rgba(255,107,130,.17)!important;background:rgba(255,107,130,.055)!important;color:#ff8da0!important}.btn.sm{min-height:32px!important;padding:0 10px!important;font-size:10px!important}.btn.xs{min-height:27px!important;padding:0 8px!important;font-size:9px!important}.mclose,.modal-close{border:0!important;background:transparent!important;box-shadow:none!important}.mclose:hover,.modal-close:hover{background:rgba(255,255,255,.045)!important}

/* ---------- forms ---------- */
input,select,textarea{border:1px solid rgba(65,158,226,.15)!important;border-radius:10px!important;background:rgba(1,8,19,.70)!important;color:#eaf6ff!important;box-shadow:none!important;outline:none!important}input:hover,select:hover,textarea:hover{border-color:rgba(68,171,241,.23)!important}input:focus,select:focus,textarea:focus{border-color:rgba(18,167,255,.56)!important;box-shadow:0 0 0 3px rgba(18,167,255,.075)!important}.fd input,.fd select,.fd textarea,.field input,.field select,.field textarea{min-height:40px!important;padding:9px 11px!important;font-size:12px!important}.fd textarea,.field textarea{min-height:90px!important}.fd label,.field label,label{color:#839db2!important;font-size:9px!important;font-weight:780!important;letter-spacing:.075em!important;text-transform:uppercase!important}.fg,.form-grid{gap:11px!important}.filters{gap:7px!important}.filters input,.filters select{min-height:37px!important;padding:7px 10px!important;font-size:11px!important}.filters input{max-width:340px!important}::placeholder{color:#526a80!important}

/* ---------- tables ---------- */
.tbl-wrap{overflow:hidden!important;border:1px solid rgba(67,159,226,.11)!important;border-radius:15px!important;background:rgba(3,12,25,.62)!important;box-shadow:0 9px 30px rgba(0,0,0,.12)!important}.tbl-scroll{scrollbar-width:thin;scrollbar-color:rgba(18,167,255,.18) transparent}table{width:100%!important;border-collapse:separate!important;border-spacing:0!important}thead{position:sticky!important;top:0!important;z-index:3!important}th{padding:10px 12px!important;background:rgba(5,16,31,.975)!important;border-bottom:1px solid rgba(66,157,225,.11)!important;color:#6d879d!important;font-size:8.5px!important;font-weight:850!important;letter-spacing:.085em!important;text-transform:uppercase!important}td{padding:11px 12px!important;border-bottom:1px solid rgba(66,157,225,.055)!important;color:#c6d6e4!important;font-size:11px!important}tbody tr:last-child td{border-bottom:0!important}tbody tr:hover td{background:rgba(8,124,255,.035)!important}

/* ---------- modal = focused work sheet ---------- */
.overlay{position:fixed!important;inset:0!important;z-index:140!important;display:none!important;align-items:stretch!important;justify-content:flex-end!important;padding:0!important;background:rgba(0,4,11,.73)!important;backdrop-filter:blur(11px)!important}.overlay.open{display:flex!important}.modal{width:min(680px,calc(100vw - 24px))!important;max-width:680px!important;min-height:100vh!important;margin:0!important;padding:26px 27px 30px!important;border:0!important;border-left:1px solid rgba(74,178,248,.18)!important;border-radius:0!important;background:linear-gradient(180deg,#071426,#030b17)!important;box-shadow:-30px 0 90px rgba(0,0,0,.40)!important;overflow:auto!important;animation:vxDrawer .22s cubic-bezier(.2,.8,.2,1)!important}.modal.sm{max-width:560px!important}@keyframes vxDrawer{from{opacity:.45;transform:translateX(32px)}to{opacity:1;transform:none}}.mhdr,.modal-hdr{position:sticky!important;top:-26px!important;z-index:5!important;margin:-2px 0 18px!important;padding:11px 0 14px!important;background:linear-gradient(180deg,#071426 72%,rgba(7,20,38,0))!important}.mhdr h2,.modal-hdr h2,.modal h2{font:700 18px/1.15 "Space Grotesk","DM Sans",system-ui,sans-serif!important;letter-spacing:-.025em!important}.fa,.form-actions{position:sticky!important;bottom:-30px!important;z-index:5!important;margin:20px -2px -10px!important;padding:14px 2px 10px!important;background:linear-gradient(0deg,#030b17 75%,rgba(3,11,23,0))!important}.photo-zone,.photo-upload-zone{border:1px dashed rgba(72,172,240,.20)!important;background:rgba(8,124,255,.025)!important;border-radius:13px!important}

/* ---------- badges ---------- */
.badge,.tag,.pill,.pri{border-color:rgba(18,167,255,.15)!important}.tag,.pill{font-size:9px!important}.toast{border-radius:12px!important;box-shadow:0 15px 42px rgba(0,0,0,.32)!important;backdrop-filter:blur(14px)}

/* ---------- command palette ---------- */
.vx-command-backdrop{position:fixed;inset:0;z-index:220;display:none;place-items:start center;padding:11vh 16px 24px;background:rgba(0,4,11,.74);backdrop-filter:blur(12px)}.vx-command-backdrop.open{display:grid}.vx-command{width:min(690px,100%);overflow:hidden;border:1px solid rgba(18,167,255,.24);border-radius:19px;background:linear-gradient(180deg,rgba(7,21,40,.99),rgba(3,10,22,.99));box-shadow:0 34px 110px rgba(0,0,0,.54)}.vx-command-search{display:flex;align-items:center;gap:10px;padding:12px 14px;border-bottom:1px solid rgba(66,157,225,.10)}.vx-command-search span{color:#5f788f;font-size:18px}.vx-command-search input{flex:1;height:44px!important;border:0!important;background:transparent!important;box-shadow:none!important;font-size:14px!important}.vx-command-list{max-height:430px;overflow:auto;padding:7px}.vx-command-group{padding:9px 10px 4px;color:#526b82;font-size:8px;font-weight:850;text-transform:uppercase;letter-spacing:.13em}.vx-command-item{width:100%;min-height:49px;display:grid;grid-template-columns:31px 1fr auto;align-items:center;gap:10px;padding:7px 9px;border:1px solid transparent;border-radius:10px;background:transparent;color:#d8e7f2;text-align:left;cursor:pointer}.vx-command-item:hover,.vx-command-item.active{background:rgba(8,124,255,.075);border-color:rgba(18,167,255,.13)}.vx-command-icon{width:28px;height:28px;display:grid;place-items:center;border:1px solid rgba(66,157,225,.10);border-radius:8px;background:rgba(255,255,255,.025);color:#7cdff4;font-size:9px;font-weight:850}.vx-command-item b{display:block;font-size:11px}.vx-command-item small{display:block;margin-top:2px;color:#647d93;font-size:9.5px}.vx-command-enter{color:#4f687e;font-size:9px}.vx-command-empty{padding:30px;text-align:center;color:#60798f;font-size:11px}

/* ---------- more menu ---------- */
.vx-more{position:relative}.vx-more-pop{position:absolute;right:0;top:43px;z-index:95;min-width:190px;padding:6px;border:1px solid rgba(73,168,236,.14);border-radius:12px;background:rgba(4,14,28,.985);box-shadow:0 20px 55px rgba(0,0,0,.38);display:none}.vx-more.open .vx-more-pop{display:grid;gap:4px}.vx-more-pop .btn{width:100%!important;justify-content:flex-start!important;border:0!important;background:transparent!important;box-shadow:none!important}.vx-more-pop .btn:hover{background:rgba(8,124,255,.075)!important}

/* ---------- mobile dock ---------- */
.vx-mobile-dock{display:none}

/* ---------- cloud gate ---------- */
.vx-cloud-gate{min-height:100vh;display:grid;place-items:center;padding:24px}.vx-cloud-gate-card{width:min(440px,100%);padding:32px;border:1px solid rgba(70,167,235,.15);border-radius:24px;background:linear-gradient(155deg,#08172b,#030b17);box-shadow:var(--vx-shadow);text-align:center}.vx-cloud-gate-card img{width:70px;height:70px;border-radius:20px;object-fit:cover;margin-bottom:18px}.vx-cloud-gate-card h1{font:700 26px/1.1 "Space Grotesk",system-ui;margin:10px 0}.vx-cloud-gate-card p{color:var(--vx-muted);font-size:12px;line-height:1.65}.vx-gate-actions{display:flex;gap:8px;justify-content:center;margin-top:20px}

/* ================================================================
   COCKPIT
   ================================================================ */
body.vx-cockpit-shell .wrap{width:auto!important;max-width:var(--vx-max)!important;margin:0 auto 0 var(--vx-sidebar)!important;padding:24px 32px 80px!important}
body.vx-cockpit-shell header{min-height:72px!important;margin:0 0 18px!important;padding:0 2px 14px!important;border-bottom:1px solid rgba(255,255,255,.055)!important}.vx-cockpit-shell header .logo{display:none!important}.vx-cockpit-shell header h1{font:700 clamp(23px,2vw,30px)/1.1 "Space Grotesk",system-ui!important;letter-spacing:-.035em!important}.vx-cockpit-shell header h1 span{display:block!important;margin:5px 0 0!important;font-size:11px!important;color:var(--vx-muted)!important}.vx-cockpit-shell .ub{padding:28px!important;border:1px solid rgba(63,160,229,.14)!important;border-radius:22px!important;background:linear-gradient(120deg,rgba(8,124,255,.12),rgba(6,229,232,.035) 48%,rgba(7,18,37,.83))!important;box-shadow:var(--vx-shadow-soft)!important}.vx-cockpit-shell .ub .ico{display:none!important}.vx-cockpit-shell .ub .text h3{font:700 clamp(24px,2.5vw,34px)/1.05 "Space Grotesk",system-ui!important;letter-spacing:-.04em!important;color:#fff!important}.vx-cockpit-shell .ub .text p{max-width:720px!important;margin-top:8px!important;font-size:12px!important;line-height:1.65!important;color:var(--vx-muted)!important}.vx-cockpit-shell .search-wrap{position:relative;margin:14px 0!important}.vx-cockpit-shell .search-wrap input{width:100%!important;max-width:none!important;height:46px!important;padding:0 15px!important;border:1px solid rgba(66,159,228,.13)!important;border-radius:13px!important;background:rgba(4,14,28,.72)!important}.vx-cockpit-shell .stats{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:9px!important;margin:0 0 16px!important}.vx-cockpit-shell .stat{padding:13px 14px!important;border:1px solid rgba(67,159,226,.10)!important;border-radius:13px!important;background:rgba(5,16,31,.60)!important}.vx-cockpit-shell .stat .label{font-size:8px!important;letter-spacing:.085em!important;color:#60798f!important}.vx-cockpit-shell .stat .val{font:700 18px/1.1 "Space Grotesk",system-ui!important;margin-top:6px!important}.vx-cockpit-shell .cat-title{margin:21px 0 8px!important;padding:0 2px!important;color:#60798f!important;font-size:8.5px!important;font-weight:850!important;letter-spacing:.12em!important}.vx-cockpit-shell .grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:10px!important}.vx-cockpit-shell #appC .card{min-height:150px!important;padding:18px!important;display:flex!important;flex-direction:column!important;border:1px solid rgba(67,159,226,.105)!important;border-radius:16px!important;background:linear-gradient(150deg,rgba(8,22,42,.80),rgba(4,13,27,.76))!important;box-shadow:0 10px 32px rgba(0,0,0,.13)!important}.vx-cockpit-shell #appC .card::before{display:none!important}.vx-cockpit-shell #appC .card:hover{transform:translateY(-2px)!important;border-color:rgba(18,167,255,.25)!important;box-shadow:0 18px 42px rgba(0,0,0,.22)!important}.vx-cockpit-shell #appC .card .ico{width:34px;height:34px;display:grid;place-items:center;margin:0 0 14px!important;border:1px solid rgba(18,167,255,.12);border-radius:10px;background:rgba(8,124,255,.07);color:#7be8ff;font-size:9px!important;font-weight:900!important;letter-spacing:.02em}.vx-cockpit-shell #appC .card h3{margin:0 0 5px!important;color:#f2f9ff!important;font-size:13px!important;text-transform:none!important;letter-spacing:-.01em!important}.vx-cockpit-shell #appC .card p{font-size:10.5px!important;line-height:1.55!important;color:#72899f!important}.vx-cockpit-shell #appC .card .card-open{margin-top:auto!important;padding-top:14px!important;color:#70dcf8!important;font-size:9.5px!important;font-weight:800!important}.vx-cockpit-shell #referralBox{display:none!important}.vx-cockpit-shell .footer{margin-top:28px!important;border-color:rgba(255,255,255,.055)!important;color:#536b82!important}.vx-cockpit-shell .recent-grid{gap:8px!important}

/* auth */
.auth-wrap{background:radial-gradient(600px 320px at 50% 0%,rgba(8,124,255,.14),transparent 70%),var(--vx-bg)!important}.auth-box,.onb-box{max-width:430px!important;padding:30px!important;border:1px solid rgba(68,164,232,.14)!important;border-radius:24px!important;background:linear-gradient(155deg,#08172b,#030b17)!important;box-shadow:0 28px 90px rgba(0,0,0,.40)!important}.auth-box .logo-big{width:64px!important;height:64px!important;border-radius:19px!important;margin:0 auto 18px!important}.auth-box h2{font:700 24px/1.1 "Space Grotesk",system-ui!important;letter-spacing:-.035em!important}.auth-box .subtitle{font-size:11px!important;line-height:1.55!important;color:var(--vx-muted)!important}.auth-btn{min-height:43px!important;border-radius:11px!important;font-size:11px!important;font-weight:800!important}

/* ---------- app-specific simplification ---------- */
/* Keep operational views prominent; reduce dashboard noise. */
.timer-card{border-color:rgba(18,167,255,.15)!important;background:linear-gradient(150deg,rgba(8,26,50,.90),rgba(4,14,29,.88))!important}.timer-time{font-size:clamp(45px,7vw,78px)!important;letter-spacing:-.055em!important}.quick-grid{gap:9px!important}.quick-card{padding:14px!important}.mood-btn{border-radius:11px!important}.gallery{gap:8px!important}.row-item{border-color:rgba(66,157,225,.09)!important;background:rgba(5,16,31,.54)!important;border-radius:12px!important}.row-item:hover{background:rgba(8,124,255,.045)!important;border-color:rgba(18,167,255,.20)!important}

/* ---------- responsive ---------- */
@media(max-width:1180px){:root{--vx-sidebar:218px}.vx-nav-link{font-size:10.5px}.vx-nav-ico{width:25px;height:25px}.vx-overview{grid-template-columns:1fr}.vx-focus-list{grid-template-columns:repeat(3,minmax(0,1fr))}.vx-focus-item{grid-template-columns:7px 1fr}.vx-focus-arrow{display:none}.vx-cockpit-shell .grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}.kb-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(max-width:820px){
  .vx-suite-nav{display:none}.vx-mobile-dock{position:fixed;left:50%;bottom:12px;transform:translateX(-50%);z-index:120;display:flex;align-items:center;gap:4px;padding:5px;border:1px solid rgba(70,166,234,.16);border-radius:15px;background:rgba(3,11,23,.91);backdrop-filter:blur(18px);box-shadow:0 16px 45px rgba(0,0,0,.35)}.vx-mobile-dock a,.vx-mobile-dock button{width:44px;height:40px;display:grid;place-items:center;border:0;border-radius:10px;background:transparent;color:#7991a7;text-decoration:none;font-size:14px;cursor:pointer}.vx-mobile-dock a:hover,.vx-mobile-dock button:hover,.vx-mobile-dock .active{background:rgba(8,124,255,.10);color:#8cecff}.vx-mobile-dock .vx-mobile-primary{width:auto;padding:0 15px;background:linear-gradient(105deg,var(--vx-cyan),var(--vx-blue-2));color:#001623;font-size:10px;font-weight:850}
  body.vx-app-shell .app,body.vx-cockpit-shell .wrap{width:min(calc(100% - 26px),var(--vx-max))!important;margin:0 auto!important;padding:16px 0 88px!important}.hdr{min-height:62px!important}.hdr-actions{gap:6px!important}.vx-context-pill{display:none}.vx-overview{grid-template-columns:1fr;gap:9px}.vx-overview-main{padding:19px}.vx-focus{padding:15px}.vx-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.vx-focus-list{grid-template-columns:1fr}.grid2{grid-template-columns:1fr!important}.kb-grid{grid-template-columns:1fr!important}.vx-cockpit-shell .grid{grid-template-columns:1fr!important}.vx-cockpit-shell .stats{grid-template-columns:repeat(2,minmax(0,1fr))!important}.tabs{top:0!important}.modal{width:100%!important;max-width:none!important;min-height:100vh!important;border-left:0!important}.fg,.form-grid{grid-template-columns:1fr!important}.fd.full{grid-column:auto!important}.vx-command-backdrop{padding-top:6vh}}
@media(max-width:520px){body.vx-app-shell .app,body.vx-cockpit-shell .wrap{width:calc(100% - 20px)!important}.hdr{align-items:flex-start!important}.hdr h1{font-size:21px!important}.hdr-actions>.btn:not(.primary),.hdr-actions>.vx-more{display:none!important}.vx-overview h2{font-size:24px!important}.vx-metric{padding:10px 11px}.vx-metric strong{font-size:15px}.vx-cockpit-shell .ub{padding:21px!important}.vx-cockpit-shell .ub .text h3{font-size:25px!important}.chart-wrap{height:185px!important}.tbl-wrap{margin-inline:-2px!important}.tabs{border-radius:12px!important}.tab{padding:0 11px!important}}
