:root{--canvas: #ffffff;--canvas-subtle: #f8fafc;--canvas-inset: #f1f5f9;--text-primary: #0f172a;--text-secondary: #475569;--text-tertiary: #94a3b8;--text-ghost: #94a3b8;--text-inverse: #ffffff;--accent: #3b82f6;--accent-hover: #2563eb;--accent-soft: #eff6ff;--accent-border: #bfdbfe;--surface-local: #3b82f6;--surface-remote: #f1f5f9;--surface-card: #ffffff;--surface-overlay: rgba(255, 255, 255, .92);--border: #e2e8f0;--border-subtle: #f1f5f9;--border-focus: #3b82f6;--shadow-xs: 0 1px 2px rgba(0, 0, 0, .05);--shadow-sm: 0 1px 3px rgba(0, 0, 0, .1), 0 1px 2px rgba(0, 0, 0, .06);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .07), 0 2px 4px -2px rgba(0, 0, 0, .05);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .08), 0 4px 6px -4px rgba(0, 0, 0, .04);--radius-sm: .375rem;--radius-md: .75rem;--radius-lg: 1rem;--radius-xl: 1.25rem;--radius-full: 9999px;--space-xs: .25rem;--space-sm: .5rem;--space-md: 1rem;--space-lg: 1.5rem;--space-xl: 2rem;--space-2xl: 3rem;--font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;--font-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, monospace;--chat-max-width: 768px;--header-height: 56px;--composer-min: 52px;--transition-fast: .15s cubic-bezier(.4, 0, .2, 1);--transition-base: .2s cubic-bezier(.4, 0, .2, 1);--transition-slow: .3s cubic-bezier(.4, 0, .2, 1)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%;width:100%}body{font-family:var(--font-sans);font-size:.9375rem;line-height:1.6;color:var(--text-primary);background:var(--canvas);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.glass-app{display:flex;flex-direction:column;height:100%;max-width:100%;overflow:hidden}.glass-header{height:var(--header-height);display:flex;align-items:center;justify-content:space-between;padding:0 var(--space-lg);border-bottom:1px solid var(--border);background:var(--surface-overlay);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);flex-shrink:0;z-index:10}.glass-header__title{font-size:.9375rem;font-weight:600;color:var(--text-primary);letter-spacing:-.01em}.glass-header__subtitle{font-size:.75rem;color:var(--text-tertiary);margin-left:var(--space-sm);font-weight:400}.glass-header__actions{display:flex;align-items:center;gap:var(--space-sm)}.status-dot{width:8px;height:8px;border-radius:var(--radius-full);flex-shrink:0}.status-dot--offline{background:#cbd5e1}.status-dot--booting{background:#f59e0b;animation:pulse-dot 1.5s infinite}.status-dot--ready{background:#22c55e}.status-dot--error{background:#ef4444}@keyframes pulse-dot{0%,to{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(.85)}}.icon-btn{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:var(--radius-md);border:none;background:transparent;color:var(--text-secondary);cursor:pointer;transition:all var(--transition-fast);font-size:1.125rem}.icon-btn:hover{background:var(--canvas-inset);color:var(--text-primary)}.icon-btn--active{background:var(--accent-soft);color:var(--accent)}.chat-feed{flex:1;overflow-y:auto;overflow-x:hidden;padding:var(--space-lg) var(--space-lg);display:flex;flex-direction:column;gap:var(--space-xs)}.chat-feed__inner{max-width:var(--chat-max-width);width:100%;margin:0 auto;display:flex;flex-direction:column;gap:var(--space-xs);flex:1;justify-content:flex-end}.msg{display:flex;gap:var(--space-sm);max-width:75%;animation:msg-in var(--transition-slow) ease-out}.msg--local{align-self:flex-end;flex-direction:row-reverse}.msg--remote{align-self:flex-start}.msg__bubble{padding:var(--space-sm) var(--space-md);border-radius:var(--radius-xl);font-size:.9375rem;line-height:1.5;word-break:break-word;position:relative}.msg--local .msg__bubble{background:var(--surface-local);color:var(--text-inverse);border-bottom-right-radius:var(--space-xs)}.msg--remote .msg__bubble{background:var(--surface-remote);color:var(--text-primary);border-bottom-left-radius:var(--space-xs)}.msg__time{font-size:.6875rem;color:var(--text-tertiary);margin-top:var(--space-xs);text-align:right}.msg--remote .msg__time{text-align:left}@keyframes msg-in{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.chat-empty{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-md);color:var(--text-tertiary);text-align:center;padding:var(--space-2xl)}.chat-empty__icon{font-size:2.5rem;opacity:.5}.chat-empty__title{font-size:1.125rem;font-weight:600;color:var(--text-secondary)}.chat-empty__subtitle{font-size:.875rem;max-width:320px;line-height:1.6}.composer{border-top:1px solid var(--border);padding:var(--space-md) var(--space-lg);background:var(--canvas);flex-shrink:0}.composer__inner{max-width:var(--chat-max-width);margin:0 auto;display:flex;align-items:flex-end;gap:var(--space-sm)}.composer__input-wrap{flex:1;position:relative;background:var(--canvas-subtle);border:1px solid var(--border);border-radius:var(--radius-lg);transition:all var(--transition-fast);overflow:hidden}.composer__input-wrap:focus-within{border-color:var(--border-focus);box-shadow:0 0 0 3px #3b82f61a;background:var(--canvas)}.composer__textarea{width:100%;min-height:var(--composer-min);max-height:160px;padding:.875rem 1rem;border:none;background:transparent;color:var(--text-primary);font-family:var(--font-sans);font-size:.9375rem;line-height:1.5;resize:none;outline:none}.composer__textarea::placeholder{color:var(--text-tertiary)}.ghost-overlay{position:absolute;inset:0;pointer-events:none;padding:.875rem 1rem;font-family:var(--font-sans);font-size:.9375rem;line-height:1.5;white-space:pre-wrap;word-wrap:break-word;overflow:hidden}.ghost-overlay__spacer{color:transparent;white-space:pre-wrap;word-wrap:break-word}.ghost-overlay__prediction{color:var(--text-ghost);opacity:0;transition:opacity var(--transition-base)}.ghost-overlay__prediction--visible{opacity:1}.send-btn{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:var(--radius-full);border:none;background:var(--accent);color:#fff;cursor:pointer;transition:all var(--transition-fast);flex-shrink:0;font-size:1.125rem}.send-btn:hover{background:var(--accent-hover);transform:scale(1.05)}.send-btn:active{transform:scale(.95)}.send-btn:disabled{opacity:.4;cursor:not-allowed;transform:none}.onboarding-bar{display:flex;align-items:center;justify-content:center;gap:var(--space-sm);padding:var(--space-sm) var(--space-md);font-size:.8125rem;color:var(--text-secondary);background:var(--accent-soft);border-bottom:1px solid var(--accent-border);animation:fade-in var(--transition-slow)}.onboarding-bar__dot{width:6px;height:6px;border-radius:var(--radius-full);background:var(--accent);animation:pulse-dot 1.5s infinite}@keyframes fade-in{0%{opacity:0}to{opacity:1}}.progress-ring{position:relative;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0}.progress-ring__track{stroke:var(--border)}.progress-ring__arc{stroke:var(--accent);transition:stroke-dashoffset var(--transition-base)}.progress-ring__text{position:absolute;font-size:.625rem;font-weight:600;color:var(--accent);font-variant-numeric:tabular-nums}.progress-ring--spin{animation:ring-spin 1.2s linear infinite}@keyframes ring-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.onboarding-bar__speed{font-size:.75rem;color:var(--text-tertiary);font-variant-numeric:tabular-nums;margin-left:auto}.dev-drawer{position:fixed;right:0;top:var(--header-height);bottom:0;width:320px;background:var(--canvas);border-left:1px solid var(--border);box-shadow:var(--shadow-lg);transform:translate(100%);transition:transform var(--transition-slow);z-index:20;overflow-y:auto;padding:var(--space-lg)}.dev-drawer--open{transform:translate(0)}.telemetry-panel{display:flex;flex-direction:column;gap:var(--space-lg)}.telemetry-panel__heading{font-size:.6875rem;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--text-tertiary);padding-bottom:var(--space-sm);border-bottom:1px solid var(--border)}.telemetry-row{display:flex;justify-content:space-between;align-items:baseline}.telemetry-row__label{font-size:.75rem;color:var(--text-tertiary);text-transform:uppercase;letter-spacing:.04em}.telemetry-row__value{font-size:1.25rem;font-weight:600;color:var(--text-primary);font-variant-numeric:tabular-nums}.telemetry-row__unit{font-size:.6875rem;color:var(--text-tertiary);margin-left:var(--space-xs);font-weight:400}.vram-bar{width:100%;height:6px;background:var(--canvas-inset);border-radius:var(--radius-full);overflow:hidden}.vram-bar__fill{height:100%;background:var(--accent);border-radius:var(--radius-full);transition:width .1s ease;width:0%}.avatar{width:32px;height:32px;border-radius:var(--radius-full);flex-shrink:0;overflow:hidden}.avatar--sm{width:28px;height:28px}.avatar--lg{width:40px;height:40px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}.chat-feed::-webkit-scrollbar{width:6px}.chat-feed::-webkit-scrollbar-track{background:transparent}.chat-feed::-webkit-scrollbar-thumb{background:var(--border);border-radius:var(--radius-full)}.chat-feed::-webkit-scrollbar-thumb:hover{background:var(--text-tertiary)}@media(max-width:640px){.glass-header{padding:0 var(--space-md)}.chat-feed{padding:var(--space-md)}.composer{padding:var(--space-sm) var(--space-md)}.msg{max-width:85%}.dev-drawer{width:100%}}html{overscroll-behavior-y:none;overflow:hidden;overscroll-behavior:none}body{overscroll-behavior-y:none;overflow:hidden}.chat-layout{display:flex;flex-direction:column;height:100dvh;height:100vh;max-width:100%;overflow:hidden;background:var(--canvas);padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px);padding-left:env(safe-area-inset-left,0px);padding-right:env(safe-area-inset-right,0px)}@supports (height: 100dvh){.chat-layout{height:100dvh}}.chat-header{display:flex;align-items:center;justify-content:space-between;min-height:var(--header-height);padding:0 var(--space-lg);border-bottom:1px solid var(--border);background:var(--surface-overlay);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);flex-shrink:0;z-index:10;gap:var(--space-sm)}.chat-header__left{display:flex;align-items:center;gap:var(--space-sm);min-width:0;flex:1}.chat-header__title{font-size:.9375rem;font-weight:600;color:var(--text-primary);letter-spacing:-.01em;white-space:nowrap}.chat-header__room-id{font-family:var(--font-mono);font-size:.6875rem;color:var(--text-tertiary);background:var(--canvas-inset);padding:.125rem .5rem;border-radius:var(--radius-full);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:120px;border:1px solid var(--border-subtle)}.chat-header__right{display:flex;align-items:center;gap:var(--space-sm);flex-shrink:0}.chat-header__invite-btn{display:inline-flex;align-items:center;gap:.375rem;min-height:44px;min-width:44px;padding:0 var(--space-md);border:1px solid var(--accent-border);border-radius:var(--radius-full);background:var(--accent-soft);color:var(--accent);font-family:var(--font-sans);font-size:.8125rem;font-weight:500;cursor:pointer;transition:all var(--transition-fast);touch-action:manipulation;-webkit-tap-highlight-color:transparent;user-select:none}.chat-header__invite-btn:hover{background:var(--accent);color:var(--text-inverse);border-color:var(--accent)}.chat-header__invite-btn:active{transform:scale(.97)}.chat-header__invite-btn--copied{background:#10b981;color:var(--text-inverse);border-color:#10b981}.chat-header__progress{display:flex;align-items:center;justify-content:center;min-width:44px;min-height:44px}.chat-thread{flex:1;overflow-y:auto;overflow-x:hidden;overscroll-behavior-y:contain;display:flex;flex-direction:column;justify-content:flex-end;gap:var(--space-xs);-webkit-overflow-scrolling:touch;max-width:var(--chat-max-width);width:100%;margin:0 auto;padding:var(--space-md)}.chat-thread__empty{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:var(--space-2xl) var(--space-lg);gap:var(--space-md);order:0}.chat-thread__empty-icon{font-size:2.75rem;line-height:1;opacity:.7}.chat-thread__empty-title{font-size:1.125rem;font-weight:600;color:var(--text-primary)}.chat-thread__empty-subtitle{font-size:.8125rem;color:var(--text-tertiary);max-width:280px;line-height:1.5}.chat-input-area{flex-shrink:0;border-top:1px solid var(--border);background:var(--surface-overlay);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);padding:var(--space-sm) var(--space-md);z-index:10}.chat-input-area__inner{max-width:var(--chat-max-width);margin:0 auto;width:100%}.chat-layout__onboarding{display:flex;align-items:center;gap:var(--space-sm);padding:var(--space-sm) var(--space-lg);background:var(--accent-soft);border-bottom:1px solid var(--accent-border);font-size:.8125rem;color:var(--accent);font-weight:500;flex-shrink:0;animation:fade-in var(--transition-slow)}.chat-layout__onboarding-speed{font-size:.75rem;color:var(--text-tertiary);font-variant-numeric:tabular-nums;margin-left:auto}.chat-layout button,.chat-layout [role=button]{min-height:44px;min-width:44px;touch-action:manipulation;-webkit-tap-highlight-color:transparent}.chat-header__icon-btn{display:inline-flex;align-items:center;justify-content:center;min-height:44px;min-width:44px;border:none;background:transparent;border-radius:var(--radius-md);color:var(--text-secondary);font-size:1.125rem;cursor:pointer;transition:all var(--transition-fast);touch-action:manipulation;-webkit-tap-highlight-color:transparent}.chat-header__icon-btn:hover{background:var(--canvas-inset);color:var(--text-primary)}.chat-header__icon-btn--active{background:var(--accent-soft);color:var(--accent)}.msg--streaming{animation:fade-in var(--transition-slow)}.msg__bubble--streaming{border-left:2px solid var(--accent);animation:ghost-pulse 1.2s ease-in-out infinite;min-height:1.25rem;min-width:3rem}.msg__bubble--streaming:empty:after{content:"▊";animation:cursor-blink .6s step-end infinite;color:var(--accent);opacity:.6}@keyframes ghost-pulse{0%,to{border-left-color:var(--accent)}50%{border-left-color:transparent}}@keyframes cursor-blink{0%,to{opacity:.6}50%{opacity:0}}.chat-thread::-webkit-scrollbar{width:4px}.chat-thread::-webkit-scrollbar-track{background:transparent}.chat-thread::-webkit-scrollbar-thumb{background:var(--border);border-radius:var(--radius-full)}.chat-thread::-webkit-scrollbar-thumb:hover{background:var(--text-tertiary)}@media(max-width:640px){.chat-header{padding:0 var(--space-md)}.chat-header__room-id{max-width:80px}.chat-header__invite-label{display:none}.chat-header__invite-btn{padding:0;justify-content:center}}@media(min-width:641px){.chat-thread{padding:var(--space-md) var(--space-lg)}.chat-input-area{padding:var(--space-sm) var(--space-lg)}}@media(prefers-reduced-motion:reduce){.chat-header__invite-btn{transition:none}.chat-layout__onboarding{animation:none}}