:root{--bg-deep: #080d1a;--bg-surface: #111827;--bg-card: #1e293b;--bg-card-hover: #283548;--bg-input: #0f172a;--border-subtle: #2d3a4d;--border-strong: #3b4a60;--text-primary: #f1f5f9;--text-secondary: #94a3b8;--text-muted: #64748b;--accent: #818cf8;--accent-strong: #6366f1;--accent-dim: rgba(129, 140, 248, .12);--accent-ring: rgba(129, 140, 248, .4);--brand: var(--accent);--status-active: #34d399;--status-problem: #f87171;--status-deactivated: #64748b;--status-checking: #fbbf24;--danger: #f87171;--success: #34d399;--font-ui: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace;--sp-1: 4px;--sp-2: 8px;--sp-3: 12px;--sp-4: 16px;--sp-5: 24px;--sp-6: 32px;--sp-7: 48px;--sp-8: 64px;--radius-sm: 8px;--radius: 10px;--radius-lg: 14px;--shadow-sm: 0 1px 2px rgba(2, 6, 16, .4);--shadow-md: 0 12px 32px -14px rgba(2, 6, 16, .7);--shadow-glow: 0 0 0 1px rgba(129, 140, 248, .25), 0 18px 40px -20px rgba(99, 102, 241, .5)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body,#root{min-height:100%}body{font-family:var(--font-ui);color:var(--text-primary);background-color:var(--bg-deep);background-image:radial-gradient(1100px 520px at 12% -8%,rgba(99,102,241,.16),transparent 60%),radial-gradient(900px 480px at 100% 0%,rgba(56,189,248,.07),transparent 55%);background-attachment:fixed;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}h1,h2,h3{margin:0;font-weight:600;letter-spacing:-.02em}a{color:inherit}.shell{max-width:1120px;margin:0 auto;padding:var(--sp-7) var(--sp-5) var(--sp-8)}.topbar{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-4);flex-wrap:wrap;margin-bottom:var(--sp-7)}.topbar-left{display:flex;align-items:center;gap:var(--sp-5)}.brand{display:flex;align-items:center;gap:var(--sp-3)}.brand-mark{display:grid;place-items:center;width:34px;height:34px;border-radius:var(--radius-sm);color:#0b1120;background:linear-gradient(135deg,var(--brand),var(--accent-strong));box-shadow:0 6px 16px -8px var(--brand)}.wordmark{font-size:1.0625rem;font-weight:600;letter-spacing:-.02em}.wordmark .dot{color:var(--brand)}nav{display:flex;gap:var(--sp-1)}.nav-link{font-size:.8125rem;font-weight:500;color:var(--text-muted);background:none;border:none;font-family:inherit;cursor:pointer;text-decoration:none;padding:var(--sp-1) var(--sp-3);border-radius:7px;transition:color .15s ease,background .15s ease}.nav-link:hover{color:var(--text-primary);background:var(--bg-card)}.nav-link.active{color:var(--brand);background:var(--accent-dim)}.topbar-right{display:flex;align-items:center;gap:var(--sp-3)}.user-pill{display:inline-flex;align-items:center;gap:var(--sp-2);font-family:var(--font-mono);font-size:.75rem;color:var(--text-secondary);background:var(--bg-surface);border:1px solid var(--border-subtle);padding:var(--sp-1) var(--sp-3);border-radius:20px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--sp-2);font-family:inherit;font-size:.8125rem;font-weight:600;line-height:1;padding:9px 14px;border-radius:var(--radius-sm);border:1px solid transparent;cursor:pointer;white-space:nowrap;transition:background .15s ease,border-color .15s ease,color .15s ease,transform .06s ease}.btn:active{transform:translateY(.5px)}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:var(--accent-strong);color:#fff}.btn-primary:hover:not(:disabled){background:var(--accent)}.btn-ghost{background:transparent;color:var(--text-secondary);border-color:var(--border-subtle)}.btn-ghost:hover:not(:disabled){color:var(--text-primary);border-color:var(--border-strong);background:var(--bg-card)}.btn-danger{background:transparent;color:var(--danger);border-color:#f8717159}.btn-danger:hover:not(:disabled){background:#f871711f;border-color:var(--danger)}.btn-block{width:100%;padding:11px 14px}.btn-sm{padding:6px 10px;font-size:.75rem}.hero{margin-bottom:var(--sp-6)}.hero-title{font-size:1.75rem;line-height:1.1}.hero-sub{margin-top:var(--sp-2);color:var(--text-secondary);font-size:.9375rem}.cat-section{margin-top:var(--sp-6)}.cat-head{display:flex;align-items:center;gap:var(--sp-2);margin-bottom:var(--sp-4);font-size:.6875rem;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted)}.cat-head:before{content:"";width:5px;height:5px;border-radius:50%;background:var(--brand);box-shadow:0 0 8px var(--brand)}.cat-count{color:var(--text-muted);font-weight:500}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(248px,1fr));gap:var(--sp-4)}.card{position:relative;display:flex;flex-direction:column;gap:var(--sp-2);background:linear-gradient(180deg,var(--bg-card),#1a2536);border:1px solid var(--border-subtle);border-radius:var(--radius);padding:var(--sp-5) var(--sp-5) var(--sp-4);text-decoration:none;color:inherit;overflow:hidden;transition:background .15s ease,border-color .15s ease,transform .15s ease,box-shadow .15s ease}.card:after{content:"";position:absolute;inset:0 0 auto 0;height:1px;background:linear-gradient(90deg,transparent,rgba(148,163,184,.25),transparent)}.card:hover{background:var(--bg-card-hover);border-color:var(--brand);transform:translateY(-3px);box-shadow:var(--shadow-md)}.card-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--sp-1)}.card-icon{display:grid;place-items:center;width:38px;height:38px;border-radius:var(--radius-sm);color:var(--brand);background:var(--accent-dim);border:1px solid rgba(129,140,248,.18);flex-shrink:0}.card-name{font-size:1rem;font-weight:600;letter-spacing:-.01em}.card-desc{font-size:.8125rem;line-height:1.45;color:var(--text-secondary)}.card-url{font-family:var(--font-mono);font-size:.6875rem;color:var(--text-muted);margin-top:auto;padding-top:var(--sp-3)}.status-badge{display:inline-flex;align-items:center;gap:var(--sp-2);font-size:.6875rem;font-weight:600;text-transform:uppercase;letter-spacing:.04em;padding:3px 9px;border-radius:20px;background:#ffffff0a;color:var(--text-secondary)}.led{width:7px;height:7px;border-radius:50%;flex-shrink:0;background:var(--status-deactivated)}.status-badge.active,.led.active{color:var(--status-active)}.led.active{background:var(--status-active);box-shadow:0 0 8px var(--status-active)}.status-badge.problem{color:var(--status-problem)}.led.problem{background:var(--status-problem);box-shadow:0 0 8px var(--status-problem)}.status-badge.checking{color:var(--status-checking)}.led.checking{background:var(--status-checking);box-shadow:0 0 8px var(--status-checking)}.settings-layout{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:var(--sp-5);align-items:start}.form-col{display:flex;flex-direction:column;gap:var(--sp-5)}.panel{background:var(--bg-card);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);padding:var(--sp-5)}.panel.is-disabled{opacity:.72}.panel-title{display:flex;align-items:center;gap:var(--sp-2);font-size:.6875rem;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--text-muted);padding-bottom:var(--sp-3);margin-bottom:var(--sp-4);border-bottom:1px solid var(--border-subtle)}.panel-note{font-size:.75rem;line-height:1.5;color:var(--text-muted);margin-top:var(--sp-3)}.field-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-4)}.field-grid.full{grid-template-columns:1fr}.field{display:flex;flex-direction:column;gap:6px}.field-label{font-size:.75rem;font-weight:500;color:var(--text-secondary)}.input{font-family:inherit;font-size:.8125rem;color:var(--text-primary);background:var(--bg-input);border:1px solid var(--border-subtle);border-radius:var(--radius-sm);padding:10px 12px;transition:border-color .15s ease,box-shadow .15s ease;width:100%}.input::placeholder{color:var(--text-muted)}.input:disabled{opacity:.6;cursor:not-allowed}.color-field{display:flex;align-items:center;gap:var(--sp-3)}.color-field input[type=color]{width:46px;height:38px;padding:3px;border:1px solid var(--border-subtle);border-radius:var(--radius-sm);background:var(--bg-input);cursor:pointer}.color-field .input{flex:1;font-family:var(--font-mono);font-size:.75rem}.upload-zone{position:relative;display:flex;flex-direction:column;align-items:center;gap:6px;border:1.5px dashed var(--border-subtle);border-radius:var(--radius-sm);padding:var(--sp-5) var(--sp-3);text-align:center;cursor:pointer;color:var(--text-muted);transition:border-color .15s ease,background .15s ease,color .15s ease}.upload-zone:hover{border-color:var(--brand);background:var(--accent-dim);color:var(--text-secondary)}.upload-zone.has-logo{border-style:solid;border-color:var(--success);color:var(--success)}.upload-zone input[type=file]{position:absolute;top:0;right:0;bottom:0;left:0;opacity:0;cursor:pointer}.upload-hint{font-size:.6875rem;font-weight:500}.save-bar{display:flex;align-items:center;gap:var(--sp-3);padding-top:var(--sp-2)}.preview{position:sticky;top:var(--sp-5);display:flex;flex-direction:column;gap:var(--sp-4);background:var(--bg-card);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);padding:var(--sp-5)}.preview-brand{display:flex;align-items:center;gap:var(--sp-3);padding:var(--sp-4);border-radius:var(--radius);background:var(--bg-deep);border:1px solid var(--border-subtle)}.preview-logo{max-width:40px;max-height:40px;border-radius:var(--radius-sm);object-fit:contain}.preview-mark{display:grid;place-items:center;width:40px;height:40px;border-radius:var(--radius-sm);color:#0b1120;background:linear-gradient(135deg,var(--brand),var(--accent-strong))}.preview-name{font-size:.9375rem;font-weight:600}.preview-tagline{font-size:.75rem;color:var(--text-muted)}.swatch-row{display:flex;gap:var(--sp-4)}.swatch{display:flex;align-items:center;gap:var(--sp-2)}.swatch-chip{width:26px;height:26px;border-radius:7px;border:1px solid var(--border-subtle)}.swatch-label{font-family:var(--font-mono);font-size:.6875rem;color:var(--text-muted)}.toast{position:fixed;right:var(--sp-5);bottom:var(--sp-5);display:flex;align-items:center;gap:var(--sp-2);background:var(--bg-card);border:1px solid var(--success);color:var(--success);border-radius:var(--radius-sm);padding:12px 16px;font-size:.8125rem;font-weight:600;box-shadow:var(--shadow-md);z-index:60;animation:rise .24s ease both}.state{border:1px dashed var(--border-subtle);border-radius:var(--radius);padding:var(--sp-7) var(--sp-5);text-align:center;color:var(--text-secondary);background:#11182780}.state-title{font-size:1.125rem;color:var(--text-primary);margin-bottom:var(--sp-2)}.state-error{border-color:#f8717166;background:#f871710f}.skeleton{min-height:148px;border-radius:var(--radius);background:linear-gradient(100deg,var(--bg-card) 30%,var(--bg-card-hover) 50%,var(--bg-card) 70%);background-size:300% 100%;animation:shimmer 1.3s ease infinite}@keyframes shimmer{0%{background-position:100% 0}to{background-position:0 0}}.spin{animation:spin .9s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.login-scene{min-height:100vh;display:grid;place-items:center;padding:var(--sp-5)}.login-card{width:100%;max-width:360px;background:var(--bg-card);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);padding:var(--sp-6);box-shadow:var(--shadow-md)}.login-mark{display:grid;place-items:center;width:44px;height:44px;border-radius:12px;color:#0b1120;background:linear-gradient(135deg,var(--brand),var(--accent-strong));margin-bottom:var(--sp-4)}.login-title{font-size:1.375rem}.login-sub{color:var(--text-secondary);font-size:.875rem;margin:var(--sp-2) 0 var(--sp-5)}.login-card .field{margin-bottom:var(--sp-4)}.form-error{color:var(--danger);font-size:.8125rem;margin-bottom:var(--sp-3)}.footer{margin-top:var(--sp-8);padding-top:var(--sp-5);border-top:1px solid var(--border-subtle);text-align:center;font-size:.75rem;color:var(--text-muted)}:focus-visible{outline:none;box-shadow:0 0 0 3px var(--accent-ring);border-radius:var(--radius-sm)}.card:focus-visible,.input:focus-visible,.upload-zone:focus-within{border-color:var(--brand);box-shadow:0 0 0 3px var(--accent-ring)}@keyframes rise{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}.rise{animation:rise .48s cubic-bezier(.2,.7,.2,1) both}@media(max-width:900px){.settings-layout{grid-template-columns:1fr}.preview{position:static}}@media(max-width:560px){.shell{padding:var(--sp-5) var(--sp-4) var(--sp-7)}.topbar{flex-direction:column;align-items:flex-start}.hero-title{font-size:1.5rem}.grid,.field-grid{grid-template-columns:1fr}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}.card:hover{transform:none}}
