:root{--font-family:system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-mono:ui-monospace, "SFMono-Regular", "SF Mono", Menlo, Monaco, Consolas, monospace;--color-bg:#0b0d10;--color-bg-top:#0b0d10;--color-surface:#121417;--color-surface-muted:#1a1d22;--color-surface-hover:#23272e;--color-text:#e2e8f0;--color-text-muted:#94a3b8;--color-accent:#60a5fa;--color-accent-strong:#93c5fd;--color-accent-soft:#60a5fa38;--color-border:#2b3038;--color-border-strong:#3a414d;--color-on-accent:#fff;--color-success:#57c68a;--color-danger:#f87171;--color-danger-soft:#f871711f;--focus-ring:0 0 0 2px #60a5fa57;--shadow-overlay:0 20px 40px #02061773;--shadow-floating:0 14px 32px #02061738;--app-max-width:56rem;--sidebar-width:13rem;--stage-gap:1.25rem;--header-height:3.75rem;--radius:.875rem;--radius-pill:999px;--radius-bubble:1.15rem;--space-xs:.25rem;--space-s:.5rem;--space-m:.75rem;--space-l:1rem;--space-xl:1.5rem;--transition:.2s ease;color-scheme:dark}body.light-mode{--color-bg:#fff;--color-bg-top:#fff;--color-surface:#fff;--color-surface-muted:#f5f6f8;--color-surface-hover:#eef3fa;--color-text:#1e293b;--color-text-muted:#64748b;--color-accent:#1665d8;--color-accent-strong:#0f54b8;--color-accent-soft:#1665d824;--color-border:#d6dce7;--color-border-strong:#bfccdc;--color-success:#1f8b57;--color-danger:#b42318;--color-danger-soft:#b423181a;--focus-ring:0 0 0 2px #1665d838;--shadow-overlay:0 14px 34px #0f172a24;--shadow-floating:0 10px 26px #0f172a14;color-scheme:light}*{box-sizing:border-box;font-family:var(--font-family);margin:0;padding:0;font-weight:400}[hidden]{display:none!important}body{background:var(--color-bg);color:var(--color-text);height:100dvh;line-height:1.5;overflow:hidden}button,input,textarea{color:inherit;font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.5}button:focus-visible,input:focus-visible,textarea:focus-visible{box-shadow:var(--focus-ring);outline:none}.icon-sprite{width:0;height:0;position:absolute;overflow:hidden}.icon{width:1.1rem;height:1.1rem;color:inherit;fill:none;stroke:currentColor;stroke-width:1.8px;flex-shrink:0;display:block}.noscript-message{padding:var(--space-xl);background:var(--color-bg);z-index:20;place-items:center;display:grid;position:fixed;inset:0}.app-container{min-height:100dvh;width:min(100%, var(--app-max-width));padding:var(--space-l);margin:0 auto;display:block;position:relative}.sidebar{width:var(--sidebar-width);min-width:var(--sidebar-width);gap:var(--space-m);height:calc(100vh - (var(--space-l) * 2));height:calc(100dvh - (var(--space-l) * 2));left:var(--space-l);top:var(--space-l);z-index:4;background:0 0;border-right:0;flex-direction:column;display:flex;position:absolute}.brand-row{align-items:center;gap:var(--space-m);min-height:2.5rem;padding:0 var(--space-s);border-bottom:0;display:flex}.brand-mark{border-radius:var(--radius);width:2rem;height:2rem;display:block}.brand-name{font-size:.98rem;font-weight:600;line-height:1.2}.room-subtitle{color:var(--color-text-muted);font-size:.78rem}.primary-action,.btn,.send-button,.icon-button{border:1px solid var(--color-border);background:var(--color-surface-muted);border-radius:var(--radius-pill);transition:background var(--transition), border-color var(--transition), color var(--transition)}.primary-action,.btn{justify-content:center;align-items:center;gap:var(--space-s);min-height:2.5rem;padding:0 var(--space-m);font-weight:500;display:inline-flex}.primary-action{background:var(--color-accent);border-color:var(--color-accent);width:100%;color:var(--color-on-accent);box-shadow:var(--shadow-floating)}.btn{background:var(--color-accent);border-color:var(--color-accent);color:var(--color-on-accent)}.primary-action:hover,.btn:hover{background:var(--color-accent-strong);border-color:var(--color-accent-strong)}.icon-button{border-radius:50%;place-items:center;width:2.25rem;height:2.25rem;display:inline-grid}.icon-button:hover,.room-row:hover{background:var(--color-surface-hover);border-color:var(--color-border-strong)}.icon-button.danger{color:var(--color-danger)}.icon-button.danger:hover{background:var(--color-danger-soft);border-color:var(--color-danger)}.mobile-menu-toggle,.mobile-menu-close,.mobile-theme-button,.mobile-menu-actions{display:none}.menu-action{align-items:center;gap:var(--space-s);border:1px solid var(--color-border);border-radius:var(--radius-pill);background:var(--color-surface-muted);min-height:2.5rem;color:var(--color-text);padding:0 var(--space-m);justify-content:flex-start;display:inline-flex}.menu-action.danger{color:var(--color-danger)}.menu-action:disabled{opacity:.45}.rooms-list{gap:var(--space-s);flex-direction:column;flex:1;padding:0;display:flex;overflow:auto}.room-row{border:1px solid var(--color-border);width:100%;color:var(--color-text);padding:var(--space-s);text-align:left;background:#121417c7;border-radius:1rem;min-height:3.25rem;display:block;box-shadow:0 8px 22px #02061729}.room-row.active{background:#60a5fa38;border-color:#60a5fa3d}body.light-mode .room-row{box-shadow:none;background:#fff}body.light-mode .room-row.active{background:#eaf2ff;border-color:#bfdbfe}body.light-mode .primary-action{box-shadow:none}.room-row-title{text-overflow:ellipsis;white-space:nowrap;font-size:.9rem;font-weight:500;line-height:1.25;overflow:hidden}.room-row-meta{color:var(--color-text-muted);font-size:.76rem;line-height:1.25}.icon-sun,body.light-mode .icon-moon{display:none}body.light-mode .icon-sun{display:block}.main-content{min-width:0;height:calc(100vh - (var(--space-l) * 2));height:calc(100dvh - (var(--space-l) * 2));margin-left:calc(var(--sidebar-width) + var(--stage-gap));background:0 0;flex-direction:column;display:flex}.room-header{min-height:var(--header-height);justify-content:space-between;align-items:center;gap:var(--space-l);padding:0 0 var(--space-s);background:0 0;border-bottom:0;display:flex}.room-heading{min-width:0}.room-title{text-overflow:ellipsis;white-space:nowrap;font-size:1rem;font-weight:600;line-height:1.25;overflow:hidden}.room-actions{align-items:center;gap:var(--space-s);display:flex}body.is-empty #copy-invite-btn,body.is-empty #safety-code-btn,body.is-empty #burn-room-btn,body.is-joining #copy-invite-btn,body.is-joining #safety-code-btn,body.is-joining #burn-room-btn,body.is-empty #mobile-copy-invite-btn,body.is-empty #mobile-safety-code-btn,body.is-empty #mobile-burn-room-btn,body.is-joining #mobile-copy-invite-btn,body.is-joining #mobile-safety-code-btn,body.is-joining #mobile-burn-room-btn,body.is-empty .mobile-menu-actions,body.is-joining .mobile-menu-actions{display:none}body.is-empty .room-heading{visibility:hidden}.empty-state{justify-content:center;align-items:center;gap:var(--space-m);min-height:0;padding:var(--space-xl);text-align:center;flex-direction:column;flex:1;display:flex}.empty-state h1{font-size:1.35rem;font-weight:600;line-height:1.25}.empty-create-room{width:auto;min-width:10.5rem;box-shadow:none;display:none}.join-panel{padding:var(--space-xl);text-align:center;flex:1;place-items:center;display:grid}.join-panel h1{margin-bottom:var(--space-xs);font-size:1.35rem;font-weight:600;line-height:1.25}.join-icon{width:3rem;height:3rem;color:var(--color-accent-strong);background:var(--color-accent-soft);margin:0 auto var(--space-m);border-radius:1.15rem;place-items:center;display:grid}.join-icon .icon{width:1.5rem;height:1.5rem}.join-box{gap:var(--space-m);text-align:left;width:min(100%,22rem);display:grid}.join-box h1{text-align:center}.join-box label{color:var(--color-text-muted);font-size:.82rem}.join-name-row{gap:var(--space-s);grid-template-columns:1fr 2.25rem;display:grid}input,textarea{border:1px solid var(--color-border);background:var(--color-surface-muted);width:100%;color:var(--color-text);border-radius:1.25rem}input{min-height:2.25rem;padding:0 var(--space-m)}.chat-panel{flex-direction:column;flex:1;min-height:0;display:flex}.room-meta{align-items:center;gap:var(--space-s);padding:0 0 var(--space-m);border-bottom:0;display:flex;overflow-x:auto}.meta-pill{align-items:center;gap:var(--space-xs);min-height:1.75rem;padding:0 var(--space-s);border:1px solid var(--color-border);border-radius:var(--radius-pill);background:var(--color-surface-muted);color:var(--color-text-muted);white-space:nowrap;font-size:.78rem;display:inline-flex}.messages{min-height:0;padding:var(--space-s) 0 var(--space-l);gap:var(--space-m);flex-direction:column;flex:1;display:flex;overflow:auto}.message-row{display:flex}.message-row.own{justify-content:flex-end}.message-bubble{border:1px solid var(--color-border);background:var(--color-surface);border-radius:var(--radius-bubble) var(--radius-bubble) var(--radius-bubble) .35rem;max-width:min(42rem,78%);padding:var(--space-s) var(--space-m);box-shadow:0 .4rem 1rem #0206171f}.message-row.own .message-bubble{background:var(--color-accent);border-color:var(--color-accent);color:var(--color-on-accent);border-radius:var(--radius-bubble) var(--radius-bubble) .35rem var(--radius-bubble)}.message-bubble.failed{border-color:var(--color-danger);color:var(--color-danger)}.message-author{color:var(--color-text-muted);margin-bottom:.1rem;font-size:.74rem}.message-row.own .message-author{display:none}.message-text{white-space:pre-wrap;overflow-wrap:anywhere;font-size:.95rem}.message-time{margin-top:var(--space-xs);color:var(--color-text-muted);text-align:right;font-size:.7rem}.message-row.own .message-time{color:#ffffffb8}.composer{gap:var(--space-s);padding:var(--space-m) 0 calc(var(--space-m) + env(safe-area-inset-bottom));background:0 0;border-top:0;grid-template-columns:1fr 2.75rem;display:grid}textarea{resize:none;min-height:2.75rem;max-height:8rem;padding:.65rem var(--space-m);border-radius:1.35rem;line-height:1.35}.send-button{background:var(--color-accent);border-color:var(--color-accent);width:2.75rem;height:2.75rem;color:var(--color-on-accent);border-radius:50%;place-items:center;display:grid}.send-button:hover{background:var(--color-accent-strong);border-color:var(--color-accent-strong)}.toast{max-width:min(32rem,100vw - 2rem);min-height:2.25rem;padding:var(--space-s) var(--space-m);border:1px solid var(--color-border);background:var(--color-surface);color:var(--color-text);border-radius:var(--radius-pill);box-shadow:var(--shadow-overlay);opacity:0;pointer-events:none;transition:transform var(--transition), opacity var(--transition);z-index:30;justify-content:center;align-items:center;display:flex;position:fixed;bottom:1rem;left:50%;transform:translate(-50%,calc(100% + 2rem))}.toast.visible{opacity:1;transform:translate(-50%)}.toast.error{color:var(--color-danger);border-color:var(--color-danger)}@media (width<=760px){body.mobile-menu-open{overflow:hidden}.app-container{width:min(100%,28rem);padding:var(--space-s);display:block}.sidebar{gap:var(--space-m);width:100%;min-width:0;height:100dvh;max-height:none;padding:var(--space-l);background:var(--color-bg);opacity:0;pointer-events:none;transition:opacity var(--transition), transform var(--transition);z-index:20;border:0;position:fixed;inset:0;transform:translateY(-.5rem)}body.mobile-menu-open .sidebar{opacity:1;pointer-events:auto;transform:none}.brand-row{gap:var(--space-s);min-height:2.25rem;padding:0 var(--space-xs)}.mobile-theme-button,.mobile-menu-close{display:inline-grid}.mobile-theme-button{margin-left:auto}.mobile-menu-close{margin-left:0}.mobile-menu-toggle{display:inline-grid}.mobile-menu-actions{gap:var(--space-s);padding-top:var(--space-s);display:grid}.brand-mark{width:1.6rem;height:1.6rem}.brand-name{font-size:.95rem}.primary-action{width:100%;min-width:0;min-height:2.2rem;box-shadow:none;align-self:stretch;font-size:.95rem}.rooms-list{gap:var(--space-s);flex-direction:column;padding:0;display:flex;overflow:auto}.room-row{width:100%;min-width:0;min-height:2.75rem;padding:.45rem .55rem}.room-row-title{font-size:.84rem}.room-row-meta{font-size:.7rem}.main-content{height:calc(100vh - (var(--space-s) * 2));height:calc(100dvh - (var(--space-s) * 2));min-height:0;margin-left:0}.room-header{min-height:2.75rem;padding:var(--space-xs) 0 var(--space-s);gap:var(--space-s);grid-template-columns:2.1rem minmax(0,1fr);display:grid}.room-title{font-size:.98rem}.room-subtitle{font-size:.72rem}.room-actions{display:none}body.is-empty .room-heading{visibility:visible}.empty-state{padding:var(--space-l) var(--space-m)}.empty-create-room{align-self:center;width:min(100%,13.5rem);display:inline-flex}.icon-button{width:2.1rem;height:2.1rem}.room-meta{gap:var(--space-xs);padding-bottom:var(--space-s)}.meta-pill{min-height:1.55rem;padding:0 .55rem;font-size:.72rem}.message-bubble{max-width:76%;padding:.45rem .7rem}.message-text{font-size:.9rem}.message-time{font-size:.66rem}.messages{padding:var(--space-s) 0 var(--space-m);gap:var(--space-s)}.composer{padding:var(--space-s) 0 calc(var(--space-s) + env(safe-area-inset-bottom));grid-template-columns:1fr 2.5rem}textarea{min-height:2.5rem;padding:.55rem var(--space-m)}.send-button{width:2.5rem;height:2.5rem}}