:root{--vlo-blue:#1a5fb4;--vlo-blue-2:#2f7de1;--vlo-teal:#33c7b5;--vlo-teal-2:#8df2e6;--vlo-dark:#0b0f1a;--vlo-ink:#07111f;--vlo-panel:#091222b8;--vlo-panel-strong:#0d1b31e6;--vlo-line:#b0ddff29;--vlo-line-strong:#33c7b557;--vlo-muted:#9fb0c8;--vlo-text:#f6fbff;--vlo-danger:#fb7185;--vlo-success:#34d399;--vlo-warning:#fbbf24;--shadow-soft:0 24px 70px #00000057;--shadow-glow:0 0 0 1px #33c7b529, 0 24px 80px #33c7b51f}*{box-sizing:border-box}html{background:var(--vlo-dark);min-height:100%}body{min-height:100%;color:var(--vlo-text);text-rendering:optimizelegibility;background:radial-gradient(circle at 10% 0,#33c7b533,#0000 24rem),radial-gradient(circle at 88% 12%,#1a5fb438,#0000 26rem),linear-gradient(135deg,#050914 0%,#081220 48%,#050914 100%);margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}button{touch-action:manipulation}.screen{background:radial-gradient(circle at top left, #33c7b53d, transparent 30rem), radial-gradient(circle at bottom right, #1a5fb42e, transparent 34rem), var(--vlo-dark);min-height:100vh;padding:1.5rem;position:relative;overflow-x:hidden}.screen:before,.app-shell:before{content:"";pointer-events:none;opacity:.32;background-image:linear-gradient(#ffffff09 1px,#0000 1px),linear-gradient(90deg,#ffffff09 1px,#0000 1px);background-size:42px 42px;position:fixed;inset:0;-webkit-mask-image:linear-gradient(#000,#0000 78%);mask-image:linear-gradient(#000,#0000 78%)}.center{place-items:center;display:grid}.auth-screen{grid-template-columns:minmax(0,.92fr) minmax(22rem,34rem);justify-content:center;align-items:center;gap:clamp(1rem,5vw,5rem);display:grid}.auth-hero{place-items:center;min-height:min(70vh,42rem);display:grid;position:relative}.orb{filter:blur(2px);opacity:.72;border-radius:999px;animation:8s ease-in-out infinite float;position:absolute}.orb-one{background:radial-gradient(circle,#33c7b56b,#0000 68%);width:19rem;height:19rem;top:13%;left:12%}.orb-two{background:radial-gradient(circle,#1a5fb480,#0000 64%);width:25rem;height:25rem;animation-delay:-3s;bottom:7%;right:2%}.hero-panel{border:1px solid var(--vlo-line);max-width:34rem;box-shadow:var(--shadow-soft);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:linear-gradient(145deg,#ffffff1f,#ffffff09);border-radius:2rem;padding:clamp(1.5rem,5vw,3rem);position:relative}.hero-panel strong{letter-spacing:-.07em;margin-top:.7rem;font-size:clamp(2rem,5vw,4.7rem);font-style:italic;line-height:.93;display:block}.auth-card,.card,.metric-card{border:1px solid var(--vlo-line);background:linear-gradient(145deg, #ffffff18, #ffffff09), var(--vlo-panel);-webkit-backdrop-filter:blur(22px)saturate(1.25);backdrop-filter:blur(22px)saturate(1.25);box-shadow:var(--shadow-soft);border-radius:1.6rem;position:relative}.auth-card:after,.card:after,.metric-card:after{content:"";border-radius:inherit;pointer-events:none;opacity:.72;background:linear-gradient(135deg,#ffffff24,#0000 34%,#33c7b514);position:absolute;inset:0}.auth-card{z-index:1;width:100%;min-width:0;max-width:34rem;padding:clamp(1.5rem,5vw,3rem);animation:.55s both rise}.auth-card *{min-width:0}.auth-logo{filter:drop-shadow(0 14px 30px #33c7b529);width:min(17rem,78vw);height:auto;margin:0 0 1.4rem;display:block}.auth-card h1,.page-header h1{letter-spacing:-.065em;overflow-wrap:anywhere;margin:.35rem 0 0;font-size:clamp(2.2rem,7vw,4.5rem);font-style:italic;line-height:.92}.eyebrow,.page-header p,.nav-heading{color:var(--vlo-teal-2);text-transform:uppercase;letter-spacing:.25em;margin:0;font-size:.74rem;font-weight:950}.muted{color:var(--vlo-muted);overflow-wrap:anywhere;line-height:1.65}.form-stack{gap:1rem;margin-top:1.4rem;display:grid}.form-stack label{color:#d7e8f8;gap:.5rem;font-size:.88rem;font-weight:850;display:grid}input,select,textarea{color:#fff;background:#030914c7;border:1px solid #b0ddff2e;border-radius:1rem;outline:none;width:100%;min-width:0;max-width:100%;padding:.9rem 1rem;transition:border-color .18s,box-shadow .18s,background .18s,transform .18s;box-shadow:inset 0 1px #ffffff0a}textarea{resize:vertical;min-height:6rem}input:hover,select:hover,textarea:hover{background:#050e1ceb;border-color:#8df2e657}input:focus,select:focus,textarea:focus{border-color:var(--vlo-teal);box-shadow:0 0 0 4px #33c7b524,inset 0 1px #ffffff0f}input[type=file]{color:var(--vlo-muted)}.primary-button,.ghost-button{cursor:pointer;border-radius:999px;padding:.92rem 1.2rem;font-weight:950;transition:transform .18s,box-shadow .18s,border-color .18s,background .18s;position:relative}.primary-button{color:#03111a;background:linear-gradient(135deg, var(--vlo-teal), var(--vlo-teal-2));border:0;box-shadow:0 16px 36px #33c7b533}.primary-button:hover{transform:translateY(-1px);box-shadow:0 20px 46px #33c7b547}.primary-button:active,.ghost-button:active{transform:translateY(1px)scale(.99)}.primary-button:disabled{opacity:.65;cursor:wait;transform:none}.ghost-button{color:#fff;border:1px solid var(--vlo-line);background:#ffffff12}.ghost-button:hover{background:#33c7b51f;border-color:#33c7b55c;box-shadow:0 12px 34px #00000038}.error-box,.success-box{border-radius:1rem;padding:.9rem 1rem;font-weight:850;animation:.28s both fade-in}.error-box{color:#ffe1e6;background:#fb718526;border:1px solid #fb71855c}.success-box{color:#d9fff3;background:#34d39924;border:1px solid #34d39952}.app-shell{background:radial-gradient(circle at top right, #1a5fb447, transparent 29rem), radial-gradient(circle at 25% 90%, #33c7b51f, transparent 26rem), var(--vlo-dark);grid-template-columns:19.5rem minmax(0,1fr);min-height:100vh;display:grid;position:relative}.sidebar{-webkit-backdrop-filter:blur(24px)saturate(1.2);backdrop-filter:blur(24px)saturate(1.2);background:linear-gradient(#040a16e6,#040a16ad);border-right:1px solid #b0ddff24;flex-direction:column;gap:1rem;height:100vh;padding:1.15rem;display:flex;position:sticky;top:0;box-shadow:24px 0 70px #0000002e}.brand{border-radius:1.2rem;align-items:center;width:100%;min-height:4.4rem;padding:.35rem .55rem;transition:background .2s,transform .2s;display:inline-flex}.brand:hover{background:#ffffff0d;transform:translateY(-1px)}.brand-logo{object-fit:contain;width:min(100%,14.2rem);height:auto;display:block}.user-chip{border:1px solid var(--vlo-line);background:linear-gradient(135deg,#ffffff18,#ffffff09);border-radius:1.15rem;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:.75rem;padding:.85rem;display:grid}.user-avatar{color:#03111a;background:linear-gradient(135deg, var(--vlo-teal), var(--vlo-blue-2));border-radius:.85rem;place-items:center;width:2.45rem;height:2.45rem;font-weight:950;display:grid;box-shadow:0 12px 28px #33c7b52e}.user-chip strong{text-overflow:ellipsis;white-space:nowrap;display:block;overflow:hidden}.user-chip small{color:var(--vlo-muted);text-overflow:ellipsis;white-space:nowrap;display:block;overflow:hidden}.nav-heading{color:#8df2e6b8;margin:.35rem .85rem -.1rem;font-size:.68rem}.nav-list{gap:.35rem;display:grid}.nav-list a{color:#dce7f4;border-radius:1rem;justify-content:space-between;align-items:center;padding:.78rem .95rem;font-weight:900;transition:background .18s,color .18s,transform .18s,box-shadow .18s;display:flex;position:relative}.nav-list a:before{content:"";background:#9fb0c873;border-radius:999px;width:.48rem;height:.48rem;transition:background .18s,box-shadow .18s;box-shadow:0 0 #33c7b500}.nav-list a span{flex:1;margin-left:.7rem}.nav-list a:hover{color:#fff;background:#ffffff12;transform:translate(2px)}.nav-list a.active{color:#fff;background:linear-gradient(135deg,#33c7b533,#1a5fb429);box-shadow:inset 0 0 0 1px #33c7b52e,0 12px 32px #0000002e}.nav-list a.active:before{background:var(--vlo-teal);box-shadow:0 0 0 5px #33c7b521,0 0 18px #33c7b5b3}.sidebar .ghost-button{margin-top:auto}.content-panel{min-width:0;padding:clamp(1.2rem,4vw,3rem);position:relative;overflow:auto}.page-header{border-bottom:1px solid #b0ddff1a;justify-content:space-between;align-items:start;gap:1rem;margin-bottom:1.65rem;padding-bottom:1.1rem;animation:.45s both slide-down;display:flex}.header-pill{white-space:nowrap;border:1px solid var(--vlo-line);color:var(--vlo-teal-2);background:#33c7b514;border-radius:999px;align-self:center;padding:.55rem .8rem;font-size:.78rem;font-weight:900}.grid{gap:1rem;display:grid}.cards-4{grid-template-columns:repeat(4,minmax(0,1fr))}.metric-card{min-height:10.2rem;padding:1.25rem;animation:.45s both rise;overflow:hidden}.metric-card:nth-child(2){animation-delay:30ms}.metric-card:nth-child(3){animation-delay:60ms}.metric-card:nth-child(4){animation-delay:90ms}.metric-card:before{content:"";background:radial-gradient(circle,#33c7b533,#0000 65%);border-radius:999px;width:8rem;height:8rem;position:absolute;top:-3.2rem;right:-3.2rem}.metric-card strong{z-index:1;color:var(--vlo-teal-2);letter-spacing:-.055em;font-size:clamp(2rem,4vw,3.1rem);line-height:1;display:block;position:relative}.metric-card span{z-index:1;margin-top:.7rem;font-weight:950;display:block;position:relative}.metric-card p,.card p{z-index:1;color:var(--vlo-muted);line-height:1.58;position:relative}.card{padding:1.25rem;animation:.42s both rise;overflow:hidden}.card h2{z-index:1;letter-spacing:-.02em;align-items:center;gap:.55rem;margin:0 0 1rem;font-size:1.16rem;display:flex;position:relative}.card h2:before{content:"";background:var(--vlo-teal);border-radius:999px;width:.55rem;height:.55rem;box-shadow:0 0 18px #33c7b58c}.wide{grid-column:1/-1}.split{grid-template-columns:minmax(0,1.35fr) minmax(20rem,.85fr);align-items:start;gap:1rem;display:grid}.two-col{grid-template-columns:1fr 1fr;gap:.8rem;display:grid}table{z-index:1;border-collapse:separate;border-spacing:0;width:100%;min-width:42rem;position:relative;overflow:hidden}th,td{text-align:left;vertical-align:top;border-bottom:1px solid #b0ddff1a;padding:.88rem .75rem}th{color:var(--vlo-teal-2);text-transform:uppercase;letter-spacing:.13em;background:#33c7b50e;font-size:.74rem}tbody tr{transition:background .16s}tbody tr:hover{background:#ffffff0b}td{color:#e6f1ff}.empty-state{z-index:1;color:var(--vlo-muted);background:#33c7b50b;border:1px dashed #8df2e647;border-radius:1rem;padding:1.25rem;position:relative}ul{color:#d8e5f2}.status-pill{border:1px solid var(--vlo-line);border-radius:999px;align-items:center;gap:.45rem;margin:0 0 1rem;padding:.5rem .78rem;font-size:.8rem;font-weight:950;display:inline-flex}.status-pill:before{content:"";background:currentColor;border-radius:999px;width:.5rem;height:.5rem;box-shadow:0 0 12px}.status-pill.online{color:#bbf7d0;background:#22c55e24}.status-pill.offline{color:#fed7aa;background:#f9731629}.queue-list{z-index:1;gap:.8rem;display:grid;position:relative}.queue-item{border:1px solid var(--vlo-line);background:linear-gradient(135deg,#ffffff13,#ffffff08);border-radius:1.15rem;justify-content:space-between;gap:1rem;padding:1rem;transition:transform .18s,border-color .18s,background .18s;display:flex}.queue-item:hover{border-color:#33c7b54d;transform:translateY(-1px)}.queue-item strong{color:var(--vlo-teal-2)}.queue-item p{margin:.35rem 0}.queue-item small,label small{color:var(--vlo-muted)}.queue-item.failed,.queue-item.rejected{border-color:#fb718573}.queue-item.synced,.queue-item.approved{opacity:.9;border-color:#34d39973}.queue-actions{flex-wrap:wrap;align-content:start;gap:.5rem;display:flex}@keyframes rise{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes slide-down{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@keyframes float{0%,to{transform:translate(0,0)scale(1)}50%{transform:translateY(-14px)scale(1.035)}}@media (max-width:1180px){.cards-4{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width:980px){.auth-screen{grid-template-columns:1fr}.auth-hero{display:none}.app-shell{grid-template-columns:1fr}.sidebar{height:auto;position:static}.nav-list{grid-template-columns:repeat(2,minmax(0,1fr))}.split,.cards-4{grid-template-columns:1fr}table{font-size:.86rem}.card{overflow-x:auto}.page-header{align-items:start}}@media (max-width:560px){.screen,.content-panel,.sidebar{padding:1rem}.auth-logo{width:min(14rem,72vw)}.brand{min-height:3.4rem}.brand-logo{width:min(100%,11.5rem)}.two-col,.nav-list{grid-template-columns:1fr}.page-header{display:block}.header-pill{margin-top:.9rem;display:inline-flex}.queue-item{flex-direction:column}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.001ms!important;animation-duration:.001ms!important;animation-iteration-count:1!important}}
