.app-shell{display:grid;min-height:100vh;grid-template-columns:240px minmax(0,1fr)}.skip-link{position:fixed;z-index:100;top:var(--space-3);left:var(--space-3);padding:var(--space-2) var(--space-3);border-radius:var(--radius-sm);color:var(--color-accent-ink);background:var(--color-accent);transform:translateY(-160%)}.skip-link:focus-visible{transform:translateY(0)}.app-sidebar{position:sticky;top:0;display:grid;height:100vh;grid-template-rows:auto 1fr auto;gap:var(--space-8);padding:var(--space-6) var(--space-4);border-right:1px solid var(--color-border);background:#111416eb;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}.app-logo,.account-row{display:flex;align-items:center;gap:var(--space-3)}.app-logo__mark,.account-row__avatar{display:grid;flex:0 0 auto;place-items:center;border-radius:var(--radius-md)}.app-logo__mark{width:38px;height:38px;color:var(--color-accent-ink);background:var(--color-accent)}.app-logo strong,.app-logo small{display:block}.app-logo strong{letter-spacing:-.02em}.app-logo small{color:var(--color-text-subtle);font-size:12px}.app-nav{display:grid;align-content:start;gap:var(--space-1)}.app-nav--mobile{display:none}.app-nav__link{display:flex;min-height:42px;align-items:center;gap:var(--space-3);padding:0 var(--space-3);border-radius:var(--radius-md);color:var(--color-text-muted);font-size:14px;font-weight:620;text-decoration:none;transition:color var(--motion-fast) ease,background var(--motion-fast) ease}button.app-nav__link{width:100%;border:0;background:transparent;font-family:inherit;cursor:pointer}.mobile-more__link{display:flex;align-items:center;gap:var(--space-2);color:inherit;text-decoration:none}.mobile-more__link.is-active{color:var(--color-accent)}.app-nav__link:hover{color:var(--color-text);background:var(--color-surface)}.app-nav__link.is-active{color:var(--color-text);background:var(--color-surface-raised);box-shadow:inset 3px 0 var(--color-accent)}.app-sidebar__footer{display:grid;gap:var(--space-2)}.app-sidebar__device-name{overflow:hidden;color:var(--color-text-muted);font-weight:650;text-overflow:ellipsis;white-space:nowrap}.app-sidebar__signout-error .inline-notice{padding:var(--space-3);font-size:12px}.account-row{margin-top:var(--space-2);padding-top:var(--space-4);border-top:1px solid var(--color-border)}.account-row__avatar{width:32px;height:32px;background:var(--color-surface-raised);font-weight:750}.account-row__name{min-width:0;flex:1;overflow:hidden;font-size:13px;text-overflow:ellipsis}.app-content{min-width:0;padding:clamp(24px,4vw,48px)}.page-heading{max-width:760px}.page-heading h1{margin:3px 0 8px;font-size:clamp(30px,4vw,46px);line-height:1.05;letter-spacing:-.045em}.page-heading>p:last-child{margin:0;color:var(--color-text-muted);font-size:16px}.page-eyebrow{margin:0;color:var(--color-accent);font-size:11px;font-weight:760;letter-spacing:.11em}.route-pending{display:grid;min-height:100vh;place-items:center;color:var(--color-text-muted)}.control-unavailable-page{display:grid;min-height:100vh;padding:clamp(24px,6vw,72px);place-items:center;background:radial-gradient(circle at 50% 20%,rgb(255 107 61 / 10%),transparent 35%),var(--color-canvas)}.control-unavailable-card{display:grid;width:min(100%,620px);gap:var(--space-5);padding:clamp(28px,5vw,52px);border:1px solid var(--color-border);border-radius:var(--radius-xl);background:var(--color-surface);box-shadow:var(--shadow-panel)}.control-unavailable-card h1{margin:-4px 0 0;font-size:clamp(32px,6vw,52px);line-height:1;letter-spacing:-.045em}.control-unavailable-icon{display:grid;width:48px;height:48px;border:1px solid rgb(255 107 61 / 35%);border-radius:14px;place-items:center;color:var(--color-accent);background:#ff6b3d14}.control-unavailable-copy{margin:0;color:var(--color-text-muted)}.control-unavailable-actions{display:flex;align-items:center;gap:var(--space-4);flex-wrap:wrap}.control-unavailable-actions span{font-size:12px}@media(max-width:760px){.app-shell{grid-template-columns:1fr}.app-sidebar{position:fixed;z-index:40;inset:auto 0 0;display:block;width:auto;height:auto;padding:8px max(8px,env(safe-area-inset-right)) calc(8px + env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left));border-top:1px solid var(--color-border);border-right:0}.app-logo,.app-sidebar__footer,.app-nav--desktop{display:none}.app-nav--mobile{display:grid;grid-template-columns:repeat(5,1fr);gap:2px}.app-nav__link{min-height:48px;flex-direction:column;gap:2px;justify-content:center;padding:0 2px;font-size:10px}.app-nav__link.is-active{box-shadow:inset 0 2px var(--color-accent)}.app-content{padding:24px 18px 84px}.menu-content .mobile-more__link{min-height:44px}}:root{color-scheme:dark;--color-canvas: #101214;--color-canvas-raised: #15181b;--color-surface: #1b1f23;--color-surface-raised: #23282d;--color-surface-hover: #2b3137;--color-border: #343a40;--color-border-strong: #4b535b;--color-text: #f4f5f6;--color-text-muted: #aeb5bc;--color-text-subtle: #828b94;--color-accent: #ff6b3d;--color-accent-hover: #ff825c;--color-accent-soft: rgb(255 107 61 / 14%);--color-accent-ink: #1a0b06;--color-focus-ring: #8fd8ff;--color-success: #59d49a;--color-success-soft: rgb(89 212 154 / 14%);--color-warning: #f6c65b;--color-warning-soft: rgb(246 198 91 / 14%);--color-danger: #ff7979;--color-info: #74b7ff;--shadow-panel: 0 14px 40px rgb(0 0 0 / 28%);--shadow-sm: 0 8px 24px rgb(0 0 0 / 18%);--shadow-dialog: 0 24px 80px rgb(0 0 0 / 55%);--radius-sm: 6px;--radius-md: 10px;--radius-lg: 16px;--radius-pill: 999px;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 20px;--space-6: 24px;--space-8: 32px;--space-10: 40px;--space-12: 48px;--layout-mobile-nav-clearance: 76px;--motion-fast: .15s;--motion-standard: .22s;--font-sans: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-mono: "SFMono-Regular", Consolas, "Liberation Mono", monospace}*{box-sizing:border-box}html{min-width:320px;min-height:100%;background:var(--color-canvas)}body{min-height:100vh;margin:0;background:radial-gradient(circle at 74% -10%,rgb(255 107 61 / 8%),transparent 34rem),var(--color-canvas);color:var(--color-text);font-family:var(--font-sans);font-size:15px;line-height:1.5;text-rendering:optimizeLegibility}button,input,select,textarea{font:inherit}button,a{-webkit-tap-highlight-color:transparent}:focus-visible{outline:3px solid color-mix(in srgb,var(--color-accent) 78%,white);outline-offset:3px}::selection{background:#ff6b3d59}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.button{display:inline-flex;min-height:40px;align-items:center;justify-content:center;gap:var(--space-2);padding:0 var(--space-4);border:1px solid transparent;border-radius:var(--radius-md);font-weight:680;letter-spacing:-.01em;text-decoration:none;cursor:pointer;transition:background var(--motion-fast) ease,border-color var(--motion-fast) ease,color var(--motion-fast) ease,transform var(--motion-fast) ease}.button:active:not(:disabled){transform:translateY(1px)}.button:disabled{cursor:not-allowed;opacity:.5}.button--primary{color:var(--color-accent-ink);background:var(--color-accent)}.button--primary:hover:not(:disabled){background:var(--color-accent-hover)}.button--secondary{color:var(--color-text);background:var(--color-surface-raised);border-color:var(--color-border)}.button--secondary:hover:not(:disabled),.button--ghost:hover:not(:disabled){background:var(--color-surface-hover);border-color:var(--color-border-strong)}.button--ghost{color:var(--color-text-muted);background:transparent}.button--danger{color:#250505;background:var(--color-danger)}.button--compact{min-height:34px;padding-inline:var(--space-3);font-size:13px}.icon-button{width:40px;padding:0}.status-badge{display:inline-flex;min-height:26px;align-items:center;gap:7px;padding:3px 10px;border:1px solid var(--status-border, var(--color-border));border-radius:var(--radius-pill);color:var(--status-color, var(--color-text-muted));background:var(--status-bg, var(--color-surface));font-size:12px;font-weight:720;letter-spacing:.01em}.status-badge:before{width:7px;height:7px;border-radius:50%;background:currentColor;content:""}.connection-status{display:inline-grid;min-width:0;gap:3px;justify-items:start}.connection-status>small{color:var(--color-text-subtle);font-size:10px}.status-badge--ready,.status-badge--live{--status-color: var(--color-success);--status-border: rgb(89 212 154 / 30%);--status-bg: rgb(89 212 154 / 8%)}.status-badge--preparing,.status-badge--warning{--status-color: var(--color-warning);--status-border: rgb(246 198 91 / 30%);--status-bg: rgb(246 198 91 / 8%)}.status-badge--failed,.status-badge--offline{--status-color: var(--color-danger);--status-border: rgb(255 121 121 / 30%);--status-bg: rgb(255 121 121 / 8%)}.status-badge--info{--status-color: var(--color-info);--status-border: rgb(116 183 255 / 30%);--status-bg: rgb(116 183 255 / 8%)}.progress{display:grid;gap:var(--space-2)}.progress__meta{display:flex;justify-content:space-between;color:var(--color-text-muted);font-size:13px}.progress__value{color:var(--color-text);font-family:var(--font-mono);font-variant-numeric:tabular-nums}.progress__track{height:7px;overflow:hidden;border-radius:var(--radius-pill);background:var(--color-surface-raised)}.progress__fill{height:100%;border-radius:inherit;background:var(--color-accent);transition:width var(--motion-standard) ease}.stage{position:relative;display:grid;width:100%;aspect-ratio:16 / 9;place-items:center;overflow:hidden;border:1px solid var(--color-border);border-radius:var(--radius-lg);background:linear-gradient(135deg,rgb(255 255 255 / 3%),transparent 34%),#08090a;box-shadow:var(--shadow-panel)}.stage:after{position:absolute;inset:0;border:1px solid rgb(255 255 255 / 4%);border-radius:inherit;pointer-events:none;content:""}.inline-notice{display:grid;grid-template-columns:auto 1fr;gap:var(--space-3);padding:var(--space-4);border:1px solid var(--notice-border, var(--color-border));border-radius:var(--radius-md);background:var(--notice-bg, var(--color-surface))}.inline-notice--danger{--notice-border: rgb(255 121 121 / 35%);--notice-bg: rgb(255 121 121 / 7%)}.inline-notice--warning{--notice-border: rgb(246 198 91 / 35%);--notice-bg: rgb(246 198 91 / 7%)}.inline-notice__title{margin:0;font-weight:720}.inline-notice__body{margin:2px 0 0;color:var(--color-text-muted)}.field{display:grid;gap:var(--space-2)}.field__label{font-size:13px;font-weight:680}.field__hint,.field__error{margin:0;font-size:12px}.field__hint{color:var(--color-text-subtle)}.field__error{color:var(--color-danger)}.field input,.field select,.field textarea{width:100%;min-height:42px;padding:9px 12px;border:1px solid var(--color-border);border-radius:var(--radius-md);color:var(--color-text);background:var(--color-canvas-raised);transition:border-color var(--motion-fast) ease}.field input:focus,.field input:focus-visible,.field select:focus,.field select:focus-visible,.field textarea:focus,.field textarea:focus-visible{outline:none;border-color:var(--color-accent)}.field select{appearance:none;padding-right:42px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2398a2ad' stroke-width='2.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;background-size:16px}.admin-header,.section-heading{display:flex;align-items:center;justify-content:space-between;gap:var(--space-5)}.admin-header h1,.section-heading h2{margin:4px 0 0;letter-spacing:-.04em}.admin-header h1{font-size:clamp(30px,4vw,43px)}.admin-header p:not(.page-eyebrow),.section-heading>span{margin-bottom:0;color:var(--color-text-subtle)}.editor-form,.danger-dialog{display:grid;gap:var(--space-4)}.skeleton{border-radius:var(--radius-sm);background:linear-gradient(100deg,var(--color-surface) 25%,var(--color-surface-raised) 42%,var(--color-surface) 60%);background-size:300% 100%;animation:skeleton-shimmer 1.5s infinite}.empty-state{display:grid;max-width:480px;justify-items:center;gap:var(--space-3);padding:var(--space-10);margin:auto;color:var(--color-text-muted);text-align:center}.empty-state h1,.empty-state h2,.empty-state p{margin:0}.empty-state h1,.empty-state h2{color:var(--color-text);font-size:18px}.dialog-overlay{position:fixed;z-index:50;inset:0;background:#050708b8;-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px);animation:fade-in var(--motion-fast) ease}.dialog-content{position:fixed;z-index:51;top:50%;left:50%;width:min(520px,calc(100vw - 32px));max-height:calc(100vh - 32px);padding:var(--space-6);overflow:auto;border:1px solid var(--color-border-strong);border-radius:var(--radius-lg);background:var(--color-surface);box-shadow:var(--shadow-dialog);transform:translate(-50%,-50%);animation:dialog-in var(--motion-standard) ease}.dialog-title{padding-right:40px;margin:0;font-size:20px;letter-spacing:-.02em}.dialog-close{position:absolute;top:12px;right:12px;display:grid;width:44px;height:44px;padding:0;place-items:center;border:0;border-radius:var(--radius-md);color:var(--color-text-muted);background:transparent;cursor:pointer}.dialog-close:hover{color:var(--color-text);background:var(--color-surface-hover)}.dialog-close:focus-visible{outline:2px solid var(--color-focus);outline-offset:2px}.dialog-description{margin:var(--space-2) 0 var(--space-5);color:var(--color-text-muted)}.menu-content,.tooltip-content{z-index:60;border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface-raised);box-shadow:var(--shadow-panel)}.menu-content{min-width:190px;padding:var(--space-2)}.menu-item{display:flex;min-height:36px;align-items:center;padding:0 var(--space-3);border-radius:var(--radius-sm);cursor:default;outline:none}.menu-item[data-highlighted]{background:var(--color-surface-hover)}.tooltip-content{padding:6px 9px;color:var(--color-text);font-size:12px}@keyframes skeleton-shimmer{0%{background-position:100% 0}to{background-position:0 0}}@keyframes fade-in{0%{opacity:0}}@keyframes dialog-in{0%{opacity:0;transform:translate(-50%,-48%) scale(.98)}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}@media(max-width:850px){.admin-header{align-items:start;flex-direction:column}}@media(max-width:1023px){.button,.button--compact{min-height:44px}.icon-button{width:44px;min-width:44px}.field input,.field select,.field textarea{min-height:44px}}
