.nav-shell.collapsible{z-index:1000;height:0;position:fixed;top:0;left:0;right:0}.nav-shell.collapsible:before{content:"";height:14px;position:absolute;top:0;left:0;right:0}.nav-shell.collapsible:after{content:"";background:linear-gradient(to bottom, var(--color-primary-dark), transparent);opacity:.5;pointer-events:none;height:8px;position:absolute;top:0;left:0;right:0}.nav-shell.collapsible .nav{transition:transform .25s;transform:translateY(-100%)}.nav-shell.collapsible:hover .nav,.nav-shell.collapsible:focus-within .nav{transform:translateY(0)}.nav{background:var(--color-primary-dark);border-bottom:1px solid var(--color-primary-deep);height:52px;box-shadow:0 10px 17px color-mix(in srgb, var(--base00) 30%, transparent);align-items:center;gap:4px;padding:0 24px;display:flex}.nav .nav-link{color:var(--color-primary-pale);letter-spacing:.02em;border-radius:1px;padding:12px 6px;font-size:.88rem;font-weight:500}.nav .nav-link:hover{background:var(--color-primary-deep);color:var(--color-accent-light)}.nav .nav-sep{color:var(--color-primary);-webkit-user-select:none;user-select:none;font-size:.8rem}.nav .nav-right{align-items:center;gap:10px;margin-left:auto;display:flex}.nav .auth-status{color:var(--color-primary-pale);letter-spacing:.02em;-webkit-user-select:none;user-select:none;white-space:nowrap;border-radius:2px;align-items:center;gap:6px;padding:4px 6px;font-size:.82rem;font-weight:500;display:inline-flex}.nav .dev-toggle{color:var(--color-primary);letter-spacing:.06em;cursor:pointer;background:0 0;border:none;border-radius:1px;align-items:center;gap:4px;padding:4px 8px;font-size:.65rem;font-weight:600;transition:color .15s;display:flex}.nav .dev-toggle:hover{color:var(--color-accent-light)}.nav .dev-toggle .dev-toggle-label-left,.nav .dev-toggle .dev-toggle-label-right{-webkit-user-select:none;user-select:none;transition:opacity .2s}.nav .dev-toggle .dev-toggle-label-left{opacity:.6}.nav .dev-toggle .dev-toggle-label-right,.nav .dev-toggle.dev .dev-toggle-label-left{opacity:1}.nav .dev-toggle.dev .dev-toggle-label-right{opacity:.6}.nav .dev-toggle .dev-toggle-track{background:var(--color-primary-deep);border-radius:7px;width:28px;height:14px;transition:background .2s;display:inline-flex;position:relative}.nav .dev-toggle .dev-toggle-thumb{background:var(--color-primary);border-radius:50%;width:10px;height:10px;transition:transform .2s,background .2s;display:block;position:absolute;top:2px;left:2px}.nav .dev-toggle.dev .dev-toggle-track{background:var(--color-accent)}.nav .dev-toggle.dev .dev-toggle-thumb{background:var(--base07);transform:translate(14px)}:root{--base00:#282828;--base01:#3c3836;--base02:#504945;--base03:#665c54;--base04:#bdae93;--base05:#d5c4a1;--base06:#ebdbb2;--base07:#fbf1c7;--base08:#fb4934;--base09:#fe8019;--base0a:#fabd2f;--base0b:#b8bb26;--base0c:#8ec07c;--base0d:#83a598;--base0e:#d3869b;--base0f:#d65d0e;--color-bg:var(--base00);--color-bg-deep:color-mix(in srgb, var(--base00) 55%, black);--color-surface:var(--base01);--color-surface-alt:var(--base02);--color-surface-raised:color-mix(in srgb, var(--base02) 75%, var(--base0d));--color-text:var(--base05);--color-text-muted:var(--base06);--color-text-faint:var(--base04);--color-border:var(--base03);--color-border-strong:color-mix(in srgb, var(--base03) 75%, var(--base0c));--color-border-focus:var(--base0d);--color-primary:var(--base0d);--color-primary-dark:color-mix(in srgb, var(--base0d) 75%, black);--color-primary-deep:color-mix(in srgb, var(--base0d) 40%, var(--base00));--color-primary-light:color-mix(in srgb, var(--base0c) 70%, var(--base07));--color-primary-pale:var(--base07);--color-primary-glow:var(--base0c);--color-accent:var(--base0a);--color-accent-light:color-mix(in srgb, var(--base0a) 45%, var(--base07));--color-accent-dark:color-mix(in srgb, var(--base0a) 65%, black);--color-magenta:var(--base0f);--color-purple:var(--base0e);--color-cyan:var(--base0c);--color-lime:var(--base0b);--color-error:var(--base08);--color-error-dark:color-mix(in srgb, var(--base08) 55%, black);--color-success:var(--base0b);--color-success-dark:color-mix(in srgb, var(--base0b) 55%, black);--color-warning:var(--base09);--color-warning-dark:color-mix(in srgb, var(--base09) 60%, black);--color-info:var(--base0c);--color-info-dark:color-mix(in srgb, var(--base0c) 55%, black);--color-live:var(--base08);--color-offline:var(--base04);--color-overlay:color-mix(in srgb, var(--base00) 72%, transparent);--color-shadow:#0006;--btn-primary-bg:var(--color-primary);--btn-primary-bg-hover:var(--color-primary-light);--btn-primary-bg-active:var(--color-primary-dark);--btn-primary-text:var(--base07);--btn-primary-text-hover:var(--color-bg);--btn-secondary-bg:var(--color-surface-alt);--btn-secondary-bg-hover:var(--color-surface-raised);--btn-secondary-bg-active:var(--color-surface);--btn-secondary-text:var(--color-text);--btn-secondary-border:var(--color-border-strong);--btn-ghost-bg:transparent;--btn-ghost-bg-hover:var(--color-surface-alt);--btn-ghost-text:var(--color-text-muted);--btn-ghost-text-hover:var(--color-text);--btn-danger-bg:var(--color-error);--btn-danger-bg-hover:color-mix(in srgb, var(--color-error) 60%, var(--base07));--btn-danger-bg-active:var(--color-error-dark);--btn-danger-text:var(--base07);--btn-success-bg:var(--color-success);--btn-success-bg-hover:color-mix(in srgb, var(--color-success) 60%, var(--base07));--btn-success-bg-active:var(--color-success-dark);--btn-success-text:var(--color-bg);--btn-accent-bg:var(--color-accent);--btn-accent-bg-hover:var(--color-accent-light);--btn-accent-bg-active:var(--color-accent-dark);--btn-accent-text:var(--color-bg-deep);--btn-disabled-bg:var(--color-surface);--btn-disabled-text:var(--color-text-faint);--link-color:var(--color-primary-light);--link-color-hover:var(--color-accent);--input-bg:var(--color-surface);--input-border:var(--color-border);--input-border-focus:var(--color-border-focus);--chip-bg:var(--color-surface-alt);--chip-text:var(--color-primary-light);--badge-live-bg:var(--color-live);--badge-offline-bg:var(--color-offline);--tooltip-bg:var(--color-bg-deep);--tooltip-text:var(--color-text)}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html,body{background-color:var(--color-bg-deep);height:100%;color:var(--color-text);font-family:Segoe UI,system-ui,-apple-system,sans-serif;font-size:16px;line-height:1.6}.app-root{flex-direction:column;min-height:90vh;display:flex}a{color:var(--link-color);text-decoration:none;transition:color .15s}a:hover{color:var(--link-color-hover)}h1,h2,h3,h4{color:var(--color-primary-pale);margin-bottom:.5rem;font-weight:600;line-height:1.3}h1{font-size:1.8rem}h2{font-size:1.35rem}h3{font-size:1.1rem}p{color:var(--color-text);margin-bottom:.6rem}label{text-transform:uppercase;letter-spacing:.06em;color:var(--color-text-muted);margin-bottom:4px;font-size:.78rem;font-weight:600;display:block}input[type=text],input[type=password],input[type=email],select,textarea{background:var(--color-surface);border:2px solid var(--color-border);width:100%;color:var(--color-text);border-radius:6px;outline:none;margin-bottom:14px;padding:8px 12px;font-size:.95rem;transition:border-color .15s,box-shadow .15s;display:block}input[type=text]:focus,input[type=password]:focus,input[type=email]:focus,select:focus,textarea:focus{border-color:var(--color-border-focus);box-shadow:0 0 0 3px color-mix(in srgb, var(--color-primary) 20%, transparent)}input[type=text]::placeholder,input[type=password]::placeholder,input[type=email]::placeholder,select::placeholder,textarea::placeholder{color:var(--color-text-muted);opacity:.6}button{background:var(--btn-primary-bg);color:var(--btn-primary-text);cursor:pointer;letter-spacing:.02em;border:1px solid #0000;border-radius:1px;padding:8px 20px;font-size:.9rem;font-weight:600;transition:background .15s,color .15s,border-color .15s,transform .1s,box-shadow .15s}button:hover{background:var(--btn-primary-bg-hover);color:var(--btn-primary-text-hover);box-shadow:0 2px 10px color-mix(in srgb, var(--color-primary) 35%, transparent)}button:active{background:var(--btn-primary-bg-active);transform:scale(.97)}button:disabled,button[disabled]{background:var(--btn-disabled-bg);color:var(--btn-disabled-text);border-color:var(--color-border);cursor:not-allowed;box-shadow:none;transform:none}button.btn-secondary{background:var(--btn-secondary-bg);color:var(--btn-secondary-text);border-color:var(--btn-secondary-border)}button.btn-secondary:hover{background:var(--btn-secondary-bg-hover);color:var(--btn-secondary-text);box-shadow:0 2px 10px var(--color-shadow)}button.btn-secondary:active{background:var(--btn-secondary-bg-active)}button.btn-ghost{background:var(--btn-ghost-bg);color:var(--btn-ghost-text)}button.btn-ghost:hover{background:var(--btn-ghost-bg-hover);color:var(--btn-ghost-text-hover);box-shadow:none}button.btn-ghost:active{background:var(--btn-ghost-bg-hover)}button.btn-danger{background:var(--btn-danger-bg);color:var(--btn-danger-text)}button.btn-danger:hover{background:var(--btn-danger-bg-hover);color:var(--btn-danger-text);box-shadow:0 2px 10px color-mix(in srgb, var(--color-error) 35%, transparent)}button.btn-danger:active{background:var(--btn-danger-bg-active)}button.btn-success{background:var(--btn-success-bg);color:var(--btn-success-text)}button.btn-success:hover{background:var(--btn-success-bg-hover);color:var(--btn-success-text);box-shadow:0 2px 10px color-mix(in srgb, var(--color-success) 35%, transparent)}button.btn-success:active{background:var(--btn-success-bg-active)}button.btn-accent{background:var(--btn-accent-bg);color:var(--btn-accent-text)}button.btn-accent:hover{background:var(--btn-accent-bg-hover);color:var(--btn-accent-text);box-shadow:0 2px 10px color-mix(in srgb, var(--color-accent) 35%, transparent)}button.btn-accent:active{background:var(--btn-accent-bg-active)}table{border-collapse:collapse;width:100%;font-size:.9rem}table th,table td{text-align:left;border-bottom:1px solid var(--color-border);padding:11px 16px}table thead th{background:var(--color-surface);color:var(--color-primary-light);text-transform:uppercase;letter-spacing:.07em;font-size:.72rem;font-weight:700}table tbody tr{transition:background .1s}table tbody tr:hover{background:var(--color-surface-alt)}table tbody tr:nth-child(2n){background:color-mix(in srgb, var(--color-surface) 60%, transparent)}table tbody tr:nth-child(2n):hover{background:var(--color-surface-alt)}.page{background-color:var(--color-bg);width:100%;max-width:1100px;height:95vh;margin:0 auto;padding:32px 40px}.card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:10px;padding:24px}.error{color:var(--color-error);background:color-mix(in srgb, var(--color-error) 10%, transparent);border:1px solid color-mix(in srgb, var(--color-error) 30%, transparent);border-radius:6px;margin-top:12px;padding:10px 14px;font-size:.9rem}.success{color:var(--color-success);background:color-mix(in srgb, var(--color-success) 10%, transparent);border:1px solid color-mix(in srgb, var(--color-success) 30%, transparent);border-radius:6px;margin-top:12px;padding:10px 14px;font-size:.9rem}
