:root{--spargs-blue: #004990;--spargs-blue-deep: #003468;--midnight: #031f3c;--midnight-2: #072b52;--orange: #f47225;--ember: #ff9a4d;--orange-deep: #c9541a;--paper: #f7f4ee;--paper-2: #efe9df;--steel: #8fa3b8;--steel-dim: #b9c4d0;--ink: #0c1b2b;--bg: var(--paper);--surface: #ffffff;--surface-alt: var(--paper-2);--text: var(--ink);--text-mute: #4a5b6d;--text-faint: var(--steel);--line: #dcd6ca;--line-strong: #c3bdaf;--brand: var(--spargs-blue);--brand-hover: var(--spargs-blue-deep);--accent: var(--orange);--accent-hover: var(--orange-deep);--on-brand: #ffffff;--on-accent: #ffffff;--ok: #2f8f5b;--warn: #d9922b;--err: #c0392b;--font-display: "Archivo", "Arial Black", sans-serif;--font-body: "Familjen Grotesk", system-ui, sans-serif;--font-mono: "Space Mono", ui-monospace, monospace;--step--1: clamp(.78rem, .76rem + .1vw, .84rem);--step-0: clamp(.95rem, .92rem + .15vw, 1.02rem);--step-1: clamp(1.2rem, 1.1rem + .5vw, 1.44rem);--step-2: clamp(1.6rem, 1.4rem + 1vw, 2.1rem);--step-3: clamp(2.2rem, 1.8rem + 2vw, 3.3rem);--step-4: clamp(3rem, 2.2rem + 4vw, 5.6rem);--sp-1: 4px;--sp-2: 8px;--sp-3: 12px;--sp-4: 16px;--sp-5: 24px;--sp-6: 32px;--sp-7: 48px;--sp-8: 72px;--radius: 10px;--radius-lg: 18px;--radius-pill: 999px;--shadow-sm: 0 1px 2px rgba(3,31,60,.08);--shadow-md: 0 6px 20px rgba(3,31,60,.12);--shadow-lg: 0 18px 50px rgba(3,31,60,.18);--ease: cubic-bezier(.2,.7,.2,1)}[data-theme=night]{--bg: var(--midnight);--surface: var(--midnight-2);--surface-alt: #0a2140;--text: #eaf1f8;--text-mute: #a9bccf;--text-faint: var(--steel);--line: rgba(143,163,184,.2);--line-strong: rgba(143,163,184,.38);--brand: #2f7fca;--brand-hover: #4f9bde;--on-brand: #ffffff;--shadow-md: 0 6px 24px rgba(0,0,0,.5);--shadow-lg: 0 20px 60px rgba(0,0,0,.6)}.stripes{--stripe-h: 4px;--stripe-gap: 5px;--stripe-w: 56px;display:inline-flex;flex-direction:column;gap:var(--stripe-gap)}.stripes i{display:block;height:var(--stripe-h);background:var(--accent);border-radius:2px}.stripes i:nth-child(1){width:calc(var(--stripe-w) * .62)}.stripes i:nth-child(2){width:calc(var(--stripe-w) * .85)}.stripes i:nth-child(3){width:calc(var(--stripe-w) * 1)}.stripes i:nth-child(4){width:calc(var(--stripe-w) * .48)}.stripe-rule{height:4px;border:0;margin:var(--sp-5) 0;background:repeating-linear-gradient(90deg,var(--accent) 0 44px,transparent 44px 54px);border-radius:2px}html{scroll-behavior:smooth}body{margin:0;font-family:var(--font-body);font-size:var(--step-0);line-height:1.55;color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased}h1,h2,h3,h4{font-family:var(--font-display);font-weight:800;line-height:1.02;letter-spacing:-.01em;margin:0;color:var(--text)}.display{font-family:var(--font-display);font-weight:900;font-stretch:125%;text-transform:uppercase;letter-spacing:-.005em}.eyebrow{font-family:var(--font-mono);font-size:var(--step--1);letter-spacing:.28em;text-transform:uppercase;color:var(--accent)}.mono{font-family:var(--font-mono)}.mute{color:var(--text-mute)}a{color:var(--brand);text-decoration:none}a:hover{color:var(--accent)}.btn{display:inline-flex;align-items:center;gap:var(--sp-2);font-family:var(--font-display);font-weight:700;font-stretch:112%;text-transform:uppercase;letter-spacing:.04em;font-size:var(--step--1);padding:12px 22px;border-radius:var(--radius-pill);border:2px solid transparent;cursor:pointer;transition:transform .15s var(--ease),background .2s var(--ease),color .2s var(--ease),box-shadow .2s var(--ease)}.btn:active{transform:translateY(1px)}.btn-primary{background:var(--accent);color:var(--on-accent);box-shadow:0 6px 18px #f4722559}.btn-primary:hover{background:var(--accent-hover);box-shadow:0 8px 24px #f4722580}.btn-brand{background:var(--brand);color:var(--on-brand)}.btn-brand:hover{background:var(--brand-hover)}.btn-ghost{background:transparent;color:var(--brand);border-color:var(--line-strong)}.btn-ghost:hover{border-color:var(--accent);color:var(--accent)}.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);padding:var(--sp-6);box-shadow:var(--shadow-sm);position:relative;overflow:hidden;transition:box-shadow .25s var(--ease),transform .25s var(--ease)}.card:hover{box-shadow:var(--shadow-md);transform:translateY(-2px)}.card:before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--accent);transform:scaleY(0);transform-origin:top;transition:transform .3s var(--ease)}.card:hover:before{transform:scaleY(1)}.tag{display:inline-flex;align-items:center;gap:6px;font-family:var(--font-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;padding:4px 12px;border-radius:var(--radius-pill);background:#00499014;color:var(--brand);border:1px solid rgba(0,73,144,.2)}.tag-accent{background:#f472251f;color:var(--accent-hover);border-color:#f472254d}.field{width:100%;font-family:var(--font-body);font-size:var(--step-0);color:var(--text);background:var(--surface);border:1.5px solid var(--line-strong);border-radius:var(--radius);padding:12px 14px;transition:border-color .2s var(--ease),box-shadow .2s var(--ease)}.field:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 4px #0049901f}label.lbl{display:block;font-family:var(--font-mono);font-size:var(--step--1);letter-spacing:.1em;text-transform:uppercase;color:var(--text-mute);margin-bottom:6px}:focus-visible{outline:3px solid var(--accent);outline-offset:2px}@media (prefers-reduced-motion: reduce){*{animation-duration:.001ms!important;transition-duration:.001ms!important}}*,:before,:after{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::backdrop{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }.mb-5{margin-bottom:1.25rem}.inline-block{display:inline-block}.flex{display:flex}.table{display:table}.grid{display:grid}.border{border-width:1px}.uppercase{text-transform:uppercase}*{box-sizing:border-box}body{margin:0;min-height:100vh}.app-shell{min-height:100vh;display:flex;flex-direction:column}.app-header{background:var(--midnight);color:#fff;padding:var(--sp-4) var(--sp-6);display:flex;align-items:center;justify-content:space-between;gap:var(--sp-5);box-shadow:var(--shadow-md);position:sticky;top:0;z-index:10}.app-header .brand{display:flex;align-items:center;gap:var(--sp-3)}.app-header .brand img{width:34px;height:34px;border-radius:8px}.app-header .brand-name{font-family:var(--font-display);font-weight:800;letter-spacing:-.01em;font-size:var(--step-1)}.app-nav{display:flex;gap:var(--sp-2);flex-wrap:wrap}.app-nav a{color:#cfe0f3;font-family:var(--font-mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;padding:8px 14px;border-radius:var(--radius-pill);transition:background .15s var(--ease),color .15s var(--ease)}.app-nav a:hover,.app-nav a.active{background:#ffffff1f;color:#fff}.app-main{flex:1;padding:var(--sp-6);max-width:1280px;width:100%;margin:0 auto}.user-chip{display:flex;align-items:center;gap:var(--sp-3);font-family:var(--font-mono);font-size:12px;color:#cfe0f3}.user-chip button{background:none;border:1px solid rgba(255,255,255,.25);color:#fff;border-radius:var(--radius-pill);padding:6px 12px;cursor:pointer;font-family:var(--font-mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase}.user-chip button:hover{border-color:var(--accent);color:var(--accent)}.page-head{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--sp-5);margin-bottom:var(--sp-6);flex-wrap:wrap}.page-head h1{font-size:var(--step-3)}.page-head p{color:var(--text-mute);margin:4px 0 0}.site-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:var(--sp-5)}.site-card{display:block;color:inherit}.site-card .site-name{font-family:var(--font-display);font-weight:800;font-size:var(--step-1);margin:0 0 4px}.site-card .device-count{font-family:var(--font-mono);font-size:12px;color:var(--text-mute)}.data-table{width:100%;border-collapse:collapse;font-size:var(--step--1)}.data-table th{text-align:left;font-family:var(--font-mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--text-mute);padding:10px 12px;border-bottom:2px solid var(--line-strong)}.data-table td{padding:10px 12px;border-bottom:1px solid var(--line);vertical-align:top}.data-table tr:hover td{background:#00499008}.table-wrap{overflow-x:auto;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg)}.status-active{color:var(--ok)}.status-decommissioned{color:var(--text-faint);text-decoration:line-through}.status-replacement_pending{color:var(--warn)}.search-bar{display:flex;gap:var(--sp-3);margin-bottom:var(--sp-5);flex-wrap:wrap}.search-bar .field{max-width:320px}.credential-row{display:flex;align-items:center;justify-content:space-between;padding:var(--sp-3) 0;border-bottom:1px solid var(--line)}.credential-row:last-child{border-bottom:none}.masked{font-family:var(--font-mono);letter-spacing:.15em;color:var(--text-faint)}.spinner{display:inline-block;width:14px;height:14px;border:2px solid var(--line-strong);border-top-color:var(--accent);border-radius:50%;animation:spin .7s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.empty-state{text-align:center;padding:var(--sp-8) var(--sp-5);color:var(--text-mute)}.empty-state .stripes{margin:0 auto var(--sp-4)}