:root{--bg-base: #0a0a0b;--bg-base-2: #0d0e10;--surface: #16171a;--surface-2: #1a1c20;--surface-raised: #1f2024;--hairline: rgba(255,255,255,.06);--hairline-strong:rgba(255,255,255,.1);--text-primary: #F5F6F7;--text-muted: #8fa6b8;--text-faint: rgba(255,255,255,.45);--plum: #f06cc9;--plum-light: #f7b6dd;--plum-lilac: #d6b8f0;--plum-bloom: rgba(230,200,255,.16);--plum-tint-bg: #241019;--live: #34c759;--live-bright: #7ff0a3;--live-bg: #062b12;--live-tint: rgba(127,240,163,.18);--danger: #ff6b5e;--danger-tint-06: rgba(255,107,94,.06);--danger-tint-12: rgba(255,107,94,.12);--danger-tint-16: rgba(255,107,94,.16);--danger-tint-25: rgba(255,107,94,.25);--warning: #e8b84b;--warning-bg: #3a2f10;--id-plum: #f06cc9;--id-blue: #6e8bff;--id-green: #7ff0a3;--id-amber: #e8b84b;--id-lilac: #d6b8f0;--id-slate: #8fa6b8;--font-display: "Manrope", -apple-system, system-ui, sans-serif;--font-ui: "Albert Sans", -apple-system, system-ui, sans-serif;--font-mono: "JetBrains Mono", ui-monospace, monospace;--text-hero: 28px;--text-body: 14px;--text-label: 13.5px;--text-caption: 12.5px;--text-micro: 12px;--weight-btn: 700;--radius-pill: 999px;--radius-card: 16px;--radius-tile: 12px;--radius-chip: 8px;--control-size: 44px;--control-size-compact: 32px;--menubar-max-height: 24px;--motion-fast: .12s;--motion-base: .18s;--ease-standard: cubic-bezier(.2, 0, 0, 1);--spring: cubic-bezier(.34, 1.56, .64, 1)}@media(prefers-reduced-motion:reduce){:root{--motion-fast: 0ms;--motion-base: 0ms}}@font-face{font-family:Manrope;src:url(/assets/manrope-variable-C46ZzDBF.woff2) format("woff2-variations"),url(/assets/manrope-variable-C46ZzDBF.woff2) format("woff2");font-weight:200 800;font-style:normal;font-display:swap}@font-face{font-family:Albert Sans;src:url(/assets/albert-sans-variable-BifFJOWk.woff2) format("woff2-variations"),url(/assets/albert-sans-variable-BifFJOWk.woff2) format("woff2");font-weight:100 900;font-style:normal;font-display:swap}@font-face{font-family:JetBrains Mono;src:url(/assets/jetbrains-mono-variable-Db4Uuiha.woff2) format("woff2-variations"),url(/assets/jetbrains-mono-variable-Db4Uuiha.woff2) format("woff2");font-weight:100 800;font-style:normal;font-display:swap}@font-face{font-family:Fredoka;src:url(/assets/fredoka-latin-600-normal-C4zohCW5.woff2) format("woff2");font-weight:600;font-style:normal;font-display:swap}*{box-sizing:border-box}html,body{height:100%}body{margin:0;background:var(--bg-base);color:var(--text-primary);font:400 var(--text-body) / 1.45 var(--font-ui);-webkit-font-smoothing:antialiased}.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}.hidden{display:none!important}.join-screen{min-height:100%;display:flex;align-items:center;justify-content:center;padding:32px 16px;background:var(--bg-base)}.join-card{width:min(380px,calc(100vw - 32px));max-width:100%;min-height:min(580px,calc(100vh - 64px));max-height:calc(100vh - 32px);overflow:auto;overscroll-behavior:contain;background:var(--menu-shell);border:1px solid rgba(255,255,255,.08);border-radius:20px;box-shadow:0 40px 90px -30px #0009;display:flex;flex-direction:column}.home-topbar{flex-shrink:0;height:52px;padding:6px 16px;display:flex;align-items:center;gap:10px}.brand-cluster{display:inline-flex;align-items:center;gap:10px;min-width:0;flex-shrink:0}.petal-logo{display:block;color:var(--text-primary);flex-shrink:0}.wordmark{display:inline-block;margin:0;font-family:"Fredoka",var(--font-display);font-size:16px;font-weight:600;line-height:1;letter-spacing:0;color:var(--text-primary);-webkit-font-smoothing:antialiased}.profile-editor{margin-left:auto;display:grid;grid-template-columns:24px minmax(0,96px);grid-template-rows:17px 13px;align-items:center;column-gap:8px;row-gap:2px;min-width:0;height:36px;padding:0 6px 0 0;border-radius:var(--radius-pill);cursor:text;transition:background-color var(--motion-fast) var(--ease-standard),box-shadow var(--motion-fast) var(--ease-standard)}.profile-editor:hover,.profile-editor:focus-within{background:#ffffff0e}.profile-editor:focus-within{box-shadow:0 0 0 1px #ffffff1f}.profile-avatar{position:relative;grid-row:1 / span 2;display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:var(--radius-pill);color:var(--id-green);font:600 10px var(--font-ui);background:linear-gradient(160deg,var(--surface-2),var(--bg-base-2));flex-shrink:0}.profile-avatar:before{content:"";position:absolute;top:-2px;right:-2px;bottom:-2px;left:-2px;border-radius:var(--radius-pill);border:1.5px solid currentColor;pointer-events:none}.profile-avatar span{line-height:1}.profile-avatar.is-empty span{display:none}.profile-avatar.is-empty:after{content:"";width:13px;height:13px;border-radius:var(--radius-pill);background:radial-gradient(circle at 50% 27%,currentColor 0 20%,transparent 21%),radial-gradient(ellipse at 50% 88%,currentColor 0 40%,transparent 41%);opacity:.64}.hero-quiet{position:relative;height:122px;padding:20px 22px;display:flex;flex-direction:column;justify-content:center;overflow:hidden;flex-shrink:0;background:linear-gradient(165deg,#16181b,#0b0c0e 80%)}.quiet-bloom{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;background:radial-gradient(58% 80% at 82% 24%,rgba(52,199,89,.1),transparent 70%)}.quiet-eyebrow,.quiet-title{position:relative}.quiet-eyebrow{display:inline-flex;align-items:center;gap:6px;font:500 10.5px var(--font-mono);letter-spacing:.06em;color:#fff6;margin-bottom:8px}.quiet-ring{width:7px;height:7px;border-radius:var(--radius-pill);border:1.5px solid rgba(255,255,255,.4);box-sizing:border-box;flex-shrink:0}.quiet-title{margin:0;max-width:280px;font:600 22px var(--font-ui);line-height:1.16;color:var(--text-primary);letter-spacing:0;text-wrap:balance}.home-body{flex:1;min-height:0;padding:16px 16px 0;display:flex;flex-direction:column}.join-sub{margin:0 0 10px;font-size:var(--text-caption);color:var(--text-faint)}.field{display:flex;flex-direction:column;gap:6px}.field-label{font:600 var(--text-micro) var(--font-ui);color:var(--text-faint);text-transform:none}input[type=text]{width:100%;height:44px;padding:0 12px;font:500 14px var(--font-ui);color:var(--text-primary);background:#ffffff0a;border:1px solid rgba(255,255,255,.09);border-radius:13px;outline:none;transition:border-color var(--motion-fast) var(--ease-standard)}.profile-name-field{min-width:0}.profile-editor input[type=text]{height:17px;padding:0;border:0;border-radius:0;background:transparent;font:600 12px var(--font-ui);color:#ffffffc7}.profile-editor input[type=text]:focus-visible{border-color:transparent}.profile-color-picker{display:grid;grid-template-columns:repeat(6,12px);gap:3px;min-width:0}.color-swatch{width:12px;height:12px;padding:0;border:1px solid rgba(255,255,255,.24);border-radius:999px;background:var(--swatch-color);cursor:pointer;transition:border-color var(--motion-fast) var(--ease-standard),box-shadow var(--motion-fast) var(--ease-standard),transform var(--motion-fast) var(--ease-standard)}.color-swatch:hover,.color-swatch:focus-visible{border-color:#ffffffb8}.color-swatch.selected{border-color:#ffffffe0;box-shadow:0 0 0 2px #ffffff29}.profile-onboarding{display:grid;gap:12px;margin-bottom:14px;padding:12px;border:1px solid rgba(255,255,255,.12);border-radius:12px;background:#ffffff0e}.profile-onboarding h2{margin:0 0 4px;font:700 14px var(--font-ui);color:var(--text-primary)}.profile-onboarding p{margin:0;font:500 12px var(--font-ui);color:#ffffffa8}.profile-onboarding-actions{display:flex;justify-content:flex-end;gap:8px}.meeting-field input[type=text]{font-size:14px}input[type=text]::placeholder{color:#ffffff59}input[type=text]:focus-visible{border-color:#ffffff47}input[type=text]:disabled{opacity:.5}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:44px;padding:0 12px;border-radius:13px;border:none;font:600 12px var(--font-ui);cursor:pointer;transition:background-color var(--motion-fast) var(--ease-standard),color var(--motion-fast) var(--ease-standard),opacity var(--motion-fast) var(--ease-standard),transform var(--motion-fast) var(--ease-standard)}.btn.primary{background:var(--live);border:0;color:#06280f;box-shadow:0 6px 22px -6px #34c75999}.btn.primary:hover:not(:disabled){opacity:.92}.btn.ghost{background:transparent;color:#ffffffbf}.btn.ghost:hover:not(:disabled){color:var(--text-primary)}.btn:disabled{opacity:.45;cursor:default}.btn:active:not(:disabled){transform:scale(var(--press-scale, .96))}.btn:focus-visible,.control-button:focus-visible,.layout-mode-button:focus-visible,.recent-room__star:focus-visible,.recent-room__copy:focus-visible,.recent-room__button:focus-visible{outline:2px solid var(--id-blue);outline-offset:2px}.error{margin:0 0 8px;font-size:12px;color:var(--danger);text-wrap:pretty}.join-hint{margin:0 0 8px;font-size:12px;color:var(--text-faint);text-wrap:pretty}.meeting-actions{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:center;margin-bottom:14px}.join-submit{min-width:0;white-space:nowrap}.room-code-button{padding-inline:12px;white-space:nowrap}.desktop-prototype-link{align-self:flex-start;margin:0 0 12px;color:#ffffffb8;font:600 var(--text-micro) var(--font-ui);text-decoration:none;border-bottom:1px solid transparent;transition:color var(--motion-fast) var(--ease-standard),border-color var(--motion-fast) var(--ease-standard)}.desktop-prototype-link:hover{color:var(--text-primary);border-color:var(--hairline-strong)}.recent-rooms{flex:1;min-height:0;display:flex;flex-direction:column;gap:0;margin-top:0;padding-top:0;border-top:0;overflow:auto}.recent-rooms__header{margin:4px 0 8px;font:500 10px var(--font-mono);letter-spacing:.1em;color:#ffffff57}.recent-room{display:grid;grid-template-columns:minmax(0,1fr) 40px 40px;align-items:center;gap:4px;border-radius:var(--radius-tile);transition:background-color var(--motion-fast) var(--ease-standard),transform var(--motion-fast) var(--ease-standard)}.recent-room:hover,.recent-room:focus-within{background:#ffffff0d}.recent-room:active{transform:scale(var(--press-scale, .96))}.recent-room__star,.recent-room__copy,.recent-room__button{border:0;font-family:var(--font-ui);cursor:pointer}.recent-room__star,.recent-room__copy{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;padding:0;border-radius:var(--radius-pill);color:#ffffff6b;background:transparent;opacity:0;transition:opacity var(--motion-fast) var(--ease-standard),color var(--motion-fast) var(--ease-standard),transform var(--motion-fast) var(--ease-standard)}.recent-room:hover .recent-room__star,.recent-room:focus-within .recent-room__star,.recent-room__star.is-favorite{opacity:1}.recent-room:hover .recent-room__copy,.recent-room:focus-within .recent-room__copy,.recent-room__copy.copied{opacity:1}.recent-room__star:hover{color:var(--id-lilac)}.recent-room__copy:hover,.recent-room__copy.copied{color:var(--live-bright)}.recent-room__copy.copied{font:700 10px var(--font-display)}.recent-room__star.is-favorite{color:var(--id-lilac)}.recent-room__star.is-favorite svg{fill:currentColor}.recent-room__button{min-width:0;min-height:40px;padding:9px 4px;border-radius:inherit;background:transparent;color:var(--text-primary);text-align:left;display:grid;grid-template-columns:minmax(0,1fr);gap:2px;align-items:center;transition:color var(--motion-fast) var(--ease-standard)}.recent-room__button:hover{color:#ffffffeb}.recent-room__code{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:700 14px var(--font-display);color:#fffc}.recent-room__meta{color:#ffffff4d;font:500 10.5px var(--font-mono);white-space:nowrap;font-variant-numeric:tabular-nums}.web-status-bar{flex-shrink:0;min-height:32px;margin-top:auto;padding:9px 16px 10px;text-align:center;color:#fff6;font:500 11px var(--font-mono);font-variant-numeric:tabular-nums}@media(max-width:420px){.join-screen{align-items:stretch;padding:0}.join-card{width:100%;min-height:100vh;max-height:none;border-radius:0;border-inline:0}.profile-editor{grid-template-columns:24px minmax(0,88px)}}.meeting{height:100%;display:flex;flex-direction:column;min-height:0;background:var(--bg-base-2)}.topbar{flex-shrink:0;display:flex;align-items:center;gap:12px;height:50px;padding:0 22px;border-bottom:1px solid var(--hairline);background:#ffffff04}.live-dot{width:7px;height:7px;border-radius:var(--radius-pill);background:var(--live);flex-shrink:0}.room-title{display:inline-flex;align-items:center;gap:6px;min-width:0}.room-name{font:600 14.5px var(--font-ui);color:#ffffffeb;min-width:0;max-width:min(42vw,320px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.room-name.renaming{display:inline-flex;min-width:min(180px,42vw);max-width:min(280px,54vw)}.room-name-input{width:100%;min-width:0;height:28px;padding:0 8px;border:none;border-radius:var(--radius-chip);outline:1px solid rgba(255,255,255,.18);background:#ffffff14;color:var(--text-primary);font:600 14.5px var(--font-ui);box-sizing:border-box}.room-title-actions{display:inline-flex;align-items:center;gap:4px;width:52px;flex-shrink:0;opacity:0;pointer-events:none;transition:opacity var(--motion-fast) var(--ease-standard)}.topbar:hover .room-title-actions,.room-title:focus-within .room-title-actions{opacity:1;pointer-events:auto}.topbar:hover .elapsed,.room-title:focus-within .elapsed{opacity:1}.room-name.renaming+.room-title-actions{opacity:0;pointer-events:none}.room-title-action{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border:none;border-radius:var(--radius-chip);background:transparent;color:#ffffff9e;cursor:pointer;flex-shrink:0;transition:background-color var(--motion-fast) var(--ease-standard),color var(--motion-fast) var(--ease-standard),scale var(--motion-fast) var(--ease-standard)}.room-title-action:hover,.room-title-action:focus-visible{background:#ffffff14;color:var(--text-primary)}.room-title-action:focus-visible{outline:1px solid rgba(255,255,255,.42);outline-offset:2px}.room-title-action:active{scale:var(--press-scale, .96)}.elapsed{font:500 12.5px var(--font-mono);font-variant-numeric:tabular-nums;flex-shrink:0;opacity:0;color:#ffffff80;transition:opacity var(--motion-fast) var(--ease-standard)}.topbar-right{margin-left:auto;display:flex;align-items:center;gap:10px}.conn-chip{font:500 11px var(--font-mono);padding:4px 10px;border-radius:var(--radius-pill);background:#ffffff0f;color:var(--text-faint)}.conn-chip.state-connected{color:var(--live-bright);background:var(--live-tint)}.conn-chip.state-connecting{color:var(--warning);background:#e8b84b1f}.conn-chip.state-error{color:var(--danger);background:var(--danger-tint-12)}.count-chip{display:flex;align-items:center;gap:6px;padding:5px 10px;border-radius:var(--radius-chip);background:#ffffff0f;color:#ffffffb3}.count{font:600 12px var(--font-mono)}.layout-picker{display:inline-flex;align-items:center;gap:2px;padding:2px;border-radius:var(--radius-pill);border:1px solid var(--hairline);background:#ffffff09}.layout-mode-button{display:inline-flex;align-items:center;justify-content:center;width:28px;height:24px;padding:0;border:0;border-radius:var(--radius-pill);background:transparent;color:var(--text-faint);cursor:pointer;transition:background var(--motion-fast) var(--ease-standard),color var(--motion-fast) var(--ease-standard)}.layout-mode-button:hover{color:#ffffffd6}.layout-mode-button.is-active{background:#ffffff17;color:var(--text-primary)}.tiles{--tile-min: 220px;--tile-row-min: 140px;--tile-gap: 16px;--tile-pad: 20px;flex:1;min-height:0;padding:var(--tile-pad);display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,var(--tile-min)),1fr));grid-auto-rows:minmax(var(--tile-row-min),1fr);gap:var(--tile-gap);overflow:auto;align-content:start}.tiles.layout-spotlight{grid-template-columns:minmax(0,1fr) minmax(176px,260px);grid-auto-rows:minmax(var(--spotlight-row-min, 118px),1fr)}.tile{position:relative;min-width:0;min-height:var(--tile-row-min);border-radius:var(--radius-tile);overflow:hidden;background:var(--surface);border:1px solid var(--hairline);display:flex;align-items:center;justify-content:center;transition:border-color var(--motion-fast) var(--ease-standard),box-shadow var(--motion-fast) var(--ease-standard),transform var(--motion-fast) var(--ease-standard)}.tile.is-pinnable{cursor:pointer}.tile.is-spotlight{grid-column:1;grid-row:1 / span 4;min-height:0}.tile.is-speaking{border-color:color-mix(in srgb,var(--live-bright) 46%,var(--hairline));box-shadow:0 0 0 1px color-mix(in srgb,var(--live-bright) 22%,transparent),0 0 18px color-mix(in srgb,var(--live-bright) 16%,transparent)}.tile video,.tile canvas.full-range-canvas{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:contain;background:#000}.tile video.full-range-source-video{opacity:0}.tile canvas.full-range-canvas{pointer-events:none}.tile.stream-paused video,.tile.stream-paused canvas.full-range-canvas{filter:saturate(.75) brightness(.62)}.pause-overlay{position:absolute;right:12px;bottom:12px;z-index:4;display:inline-flex;align-items:center;gap:7px;max-width:calc(100% - 24px);padding:6px 9px;border-radius:var(--radius-pill);background:#080a0cb8;color:#ffffffd6;font:700 11px var(--font-ui);line-height:1;white-space:nowrap;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:inset 0 0 0 1px #ffffff17}.pause-bars{display:inline-flex;gap:2px;align-items:center;flex:0 0 auto}.pause-bars i{display:block;width:3px;height:9px;border-radius:3px;background:currentColor}.tiles.layout-spotlight .tile:not(.is-spotlight){min-height:var(--spotlight-row-min, 118px)}.tiles.layout-spotlight .tile:not(.is-spotlight) .initials{font-size:20px}.telepointer-layer{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:2}.remote-draw-layer{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;overflow:visible;pointer-events:none;z-index:2}.remote-draw-stroke{fill:none;stroke:var(--draw-color, var(--live-bright));stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke;filter:drop-shadow(0 1px 2px rgba(0,0,0,.52))}.remote-telepointer{--pointer-color: var(--live-bright);position:absolute;left:0;top:0;display:flex;align-items:flex-start;gap:6px;opacity:1;transition-property:opacity,filter;transition-duration:.18s;transition-timing-function:cubic-bezier(.2,0,0,1);will-change:transform,opacity}.remote-telepointer.is-stale{opacity:.42}.remote-telepointer.is-hidden{opacity:0}.remote-telepointer.is-controlling{filter:drop-shadow(0 0 7px color-mix(in srgb,var(--pointer-color) 64%,transparent))}.remote-telepointer__arrow{width:22px;height:22px;overflow:visible}.remote-telepointer__arrow-fill{stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}.remote-telepointer__arrow-fill{fill:var(--pointer-color);stroke:none}.remote-telepointer__label{max-width:180px;margin-top:2px;padding:5px 9px 4px;border-radius:var(--radius-pill);background:var(--pointer-color);background:linear-gradient(180deg,color-mix(in srgb,var(--pointer-color) 92%,#f5f6f7),var(--pointer-color));color:#0a0a0ce0;color:color-mix(in srgb,var(--pointer-color) 16%,#0c0c0e);font:700 11px/1 var(--font-ui);letter-spacing:.01em;text-transform:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.remote-telepointer__typing{display:none;align-items:center;gap:2px;height:14px;margin-top:2px;padding:0 5px;border-radius:var(--radius-pill);background:#08080ab8;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--pointer-color) 36%,transparent),0 2px 8px #00000040}.remote-telepointer.is-typing .remote-telepointer__typing{display:inline-flex}.remote-telepointer__typing span{width:3px;height:3px;border-radius:var(--radius-pill);background:var(--pointer-color);animation:remote-typing-dot .78s cubic-bezier(.2,0,0,1) infinite}.remote-telepointer__typing span:nth-child(2){animation-delay:.11s}.remote-telepointer__typing span:nth-child(3){animation-delay:.22s}.remote-telepointer__ripple{position:absolute;left:3px;top:3px;width:14px;height:14px;border-radius:var(--radius-pill);background:var(--pointer-color);opacity:.55;animation:remote-pointer-ripple .48s cubic-bezier(.2,0,0,1) forwards}.remote-telepointer__handshake{position:absolute;width:58px;height:58px;transform:translate(-50%,-50%);border-radius:var(--radius-pill);background:color-mix(in srgb,var(--id-lilac) 24%,transparent);box-shadow:0 0 0 1px color-mix(in srgb,var(--id-lilac) 68%,transparent),0 0 28px color-mix(in srgb,var(--id-lilac) 55%,transparent);animation:remote-handshake-burst .92s cubic-bezier(.2,0,0,1) forwards}.remote-telepointer__handshake span{position:absolute;top:16px;right:16px;bottom:16px;left:16px;border-radius:var(--radius-pill);background:var(--id-lilac);opacity:.75}.remote-telepointer__handshake span:nth-child(1){transform:translate(-9px) rotate(-18deg)}.remote-telepointer__handshake span:nth-child(2){transform:translate(9px) rotate(18deg)}@keyframes remote-pointer-ripple{0%{transform:scale(.4);opacity:.55}to{transform:scale(3.2);opacity:0}}@keyframes remote-typing-dot{0%,80%,to{transform:translateY(0);opacity:.48}35%{transform:translateY(-2px);opacity:1}}@keyframes remote-handshake-burst{0%{transform:translate(-50%,-50%) scale(.54);opacity:0}25%{opacity:1}to{transform:translate(-50%,-50%) scale(1.35);opacity:0}}@media(prefers-reduced-motion:reduce){.remote-telepointer__ripple,.remote-telepointer__typing span,.remote-telepointer__handshake{animation:none}.remote-telepointer__ripple{opacity:0}}.tile .initials{position:absolute;left:50%;top:50%;z-index:1;display:inline-flex;align-items:center;justify-content:center;max-width:calc(100% - 32px);min-width:2.4em;min-height:2.4em;transform:translate(-50%,-50%);font:700 26px var(--font-display);line-height:1;color:var(--text-faint);letter-spacing:.5px;-webkit-user-select:none;user-select:none;white-space:nowrap}.tile.camera-off .name-chip{display:none}.tile .name-chip{position:absolute;left:10px;bottom:10px;z-index:3;display:flex;align-items:center;gap:6px;max-width:calc(100% - 20px);padding:4px 10px;border-radius:var(--radius-pill);background:#0a0a0bb8;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);font:600 var(--text-micro) var(--font-ui);color:#ffffffe6;white-space:nowrap;overflow:hidden}.tile .name-chip-label{min-width:0;overflow:hidden;text-overflow:clip}.tile .name-chip .tag{font:600 10px var(--font-mono);color:var(--text-faint)}.tile.share-tile .name-chip .tag{color:var(--live-bright)}.remote-window-header{position:absolute;top:0;left:0;right:0;z-index:5;display:flex;align-items:center;justify-content:space-between;gap:16px;height:44px;min-height:44px;max-height:44px;min-width:0;padding:0 14px 0 16px;box-sizing:border-box;overflow:hidden;background:var(--identity-header-bg, linear-gradient(180deg, #161618, #060607 65%, #0c0c0e));border-bottom:1px solid color-mix(in srgb,var(--identity-header-ink, #ffffff) 22%,transparent);box-shadow:inset 0 1px color-mix(in srgb,var(--identity-header-ink, #ffffff) 18%,transparent);color:var(--identity-header-ink, rgba(255, 255, 255, .95));-webkit-user-select:none;user-select:none;transition-property:opacity;transition-duration:var(--motion-base);transition-timing-function:var(--ease-standard)}.remote-window-header.idle{height:4px;min-height:4px;max-height:4px;padding:0;border-bottom:0}.remote-window-header.idle>*{opacity:0;pointer-events:none;transform:translateY(-100%)}.remote-window-header__left,.remote-window-header__right,.remote-window-header__traffic-lights,.remote-window-header__title-cluster{display:flex;align-items:center}.remote-window-header__left{flex:1 1 auto;min-width:0;gap:14px}.remote-window-header__right{flex:0 0 auto;gap:8px;min-width:0}.remote-window-header__traffic-lights{flex:0 0 auto;gap:8px}.remote-window-header__traffic-dot{width:12px;height:12px;flex:0 0 12px;padding:0;border:0;border-radius:99px;box-shadow:inset 0 0 0 .5px #00000040;cursor:pointer;transition-property:opacity,filter,scale;transition-duration:var(--motion-fast);transition-timing-function:var(--ease-standard)}.remote-window-header__traffic-close{background:#ff5f57}.remote-window-header__traffic-hide{background:#febc2e}.remote-window-header__traffic-fit{background:#28c840}.remote-window-header__traffic-dot:disabled{cursor:not-allowed;opacity:.56;filter:saturate(.35)}.remote-window-header__traffic-dot:active:not(:disabled){scale:.96}.remote-window-header__traffic-dot:focus-visible{outline:1px solid color-mix(in srgb,var(--identity-header-ink, #ffffff) 86%,transparent);outline-offset:2px}.remote-window-header__title-cluster{min-width:0;gap:9px}.remote-window-header__title{display:block;min-width:0;font-family:var(--font-ui);font-size:14px;font-weight:600;line-height:1;color:var(--identity-header-ink, rgba(255, 255, 255, .95));overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.remote-window-header__owner-label{color:color-mix(in srgb,var(--identity-header-ink, #ffffff) 62%,transparent);font-weight:500}.remote-window-header__status-chip{flex:0 1 auto;height:24px;display:inline-flex;align-items:center;min-width:0;max-width:150px;padding:0 9px;border-radius:7px;background:color-mix(in srgb,var(--identity-header-ink, #ffffff) 9%,transparent);border:1px solid color-mix(in srgb,var(--identity-header-ink, #ffffff) 16%,transparent);color:color-mix(in srgb,var(--identity-header-ink, #ffffff) 78%,transparent);font-family:var(--font-ui);font-size:var(--text-micro);font-weight:600;line-height:1;letter-spacing:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.remote-window-header__status-chip[hidden],.remote-window-header__open-url.is-hidden{display:none}.remote-window-header__status-chip.warning{color:#e8b84b;background:#e8b84b1c;border-color:#e8b84b3d}.remote-window-header__status-chip.paused{color:color-mix(in srgb,var(--identity-header-ink, #ffffff) 72%,transparent)}.remote-window-header__header-btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;height:30px;padding:0 12px;border-radius:8px;border:1px solid transparent;background:transparent;color:color-mix(in srgb,var(--identity-header-ink, #ffffff) 82%,transparent);cursor:pointer;flex-shrink:0;-webkit-user-select:none;user-select:none;font-family:var(--font-ui);font-size:var(--text-caption);font-weight:600;line-height:1;transition-property:background-color,border-color,box-shadow,color,transform;transition-duration:var(--motion-fast);transition-timing-function:var(--ease-standard)}.remote-window-header__header-btn:hover{background:color-mix(in srgb,var(--identity-header-ink, #ffffff) 12%,transparent);border-color:color-mix(in srgb,var(--identity-header-ink, #ffffff) 18%,transparent);color:var(--identity-header-ink, rgba(255, 255, 255, .96))}.remote-window-header__header-btn:active{background:color-mix(in srgb,var(--identity-header-ink, #ffffff) 18%,transparent);box-shadow:inset 0 1px 2px #00000059;transform:translateY(.5px)}.remote-window-header__mode-switcher{position:relative;display:flex;align-items:center;height:30px;padding:3px;border-radius:9px;background:color-mix(in srgb,var(--identity-header-ink, #ffffff) 8%,transparent);border:1px solid color-mix(in srgb,var(--identity-header-ink, #ffffff) 14%,transparent);margin-left:2px;flex-shrink:0;box-sizing:border-box}.remote-window-header__active-indicator{position:absolute;top:3px;left:3px;width:86px;height:24px;border-radius:6px;background:color-mix(in srgb,var(--identity-header-ink, #ffffff) 16%,transparent);border:1px solid color-mix(in srgb,var(--identity-header-ink, #ffffff) 18%,transparent);box-shadow:0 1px 2px #00000059,inset 0 1px #ffffff12;box-sizing:border-box;transform:translate(calc(var(--active-mode-index) * 86px));transition-property:transform;transition-duration:.24s;transition-timing-function:cubic-bezier(.4,0,.2,1)}.remote-window-header__segment{position:relative;z-index:1;display:inline-flex;align-items:center;justify-content:center;gap:6px;width:86px;height:24px;padding:0;border:none;border-radius:6px;background:transparent;color:color-mix(in srgb,var(--identity-header-ink, #ffffff) 58%,transparent);font-family:var(--font-ui);font-size:var(--text-micro);font-weight:600;line-height:1;cursor:pointer;-webkit-user-select:none;user-select:none;transition-property:color,scale;transition-duration:.16s;transition-timing-function:var(--ease-standard)}.remote-window-header__segment:hover:not(:disabled){color:color-mix(in srgb,var(--identity-header-ink, #ffffff) 82%,transparent)}.remote-window-header__segment.is-active{color:var(--identity-header-ink, rgba(255, 255, 255, .98))}.remote-window-header__segment.requesting{color:var(--identity-header-ink, rgba(255, 255, 255, .98));cursor:wait}.remote-window-header__segment:disabled,.remote-window-header__header-btn:disabled{color:color-mix(in srgb,var(--identity-header-ink, #ffffff) 38%,transparent);cursor:not-allowed}.remote-window-header__segment.is-active:disabled{color:color-mix(in srgb,var(--identity-header-ink, #ffffff) 92%,transparent)}.remote-window-header__segment:focus-visible,.remote-window-header__header-btn:focus-visible{outline:1px solid color-mix(in srgb,var(--identity-header-ink, #ffffff) 86%,transparent);outline-offset:1px}.remote-window-header__segment:active{scale:.96}.remote-window-header__icon{display:inline-flex;align-items:center;justify-content:center;flex:0 0 15px;width:15px;height:15px}.remote-window-header__icon svg{display:block;transform:translateY(.25px);flex-shrink:0}.remote-window-header__button-label{white-space:nowrap}.tile.has-remote-window-header{container-type:inline-size}.tile.has-remote-window-header .name-chip,.tile.has-remote-window-header .remote-control-button{display:none}.tile.has-remote-window-header video,.tile.has-remote-window-header canvas.full-range-canvas{top:44px;height:calc(100% - 44px)}@container (max-width: 720px){.remote-window-header__status-chip{display:none}}@container (max-width: 640px){.remote-window-header__debug{display:none}}@container (max-width: 560px){.remote-window-header__open-url{display:none}}@container (max-width: 470px){.remote-window-header__mode-switcher{display:none}}@container (max-width: 300px){.remote-window-header__owner-label{display:none}.remote-window-header{gap:10px;padding-right:10px;padding-left:12px}}@media(max-width:720px){.remote-window-header__status-chip{display:none}}@media(max-width:640px){.remote-window-header__debug{display:none}}@media(max-width:560px){.remote-window-header__open-url{display:none}}@media(max-width:470px){.remote-window-header__mode-switcher{display:none}}@media(max-width:300px){.remote-window-header__owner-label{display:none}.remote-window-header{gap:10px;padding-right:10px;padding-left:12px}}@media(prefers-reduced-motion:reduce){.remote-window-header,.remote-window-header__header-btn,.remote-window-header__segment,.remote-window-header__active-indicator,.remote-window-header__traffic-dot{transition:none}.remote-window-header__header-btn:active,.remote-window-header__segment:active,.remote-window-header__traffic-dot:active:not(:disabled){transform:none;scale:1}}.remote-window-stats{position:absolute;left:10px;bottom:10px;z-index:4;display:grid;gap:4px;max-width:calc(100% - 20px);padding:8px 9px;border-radius:8px;background:#0d0e10e0;color:#ffffffd1;box-shadow:inset 0 0 0 1px #2a2c30,0 10px 28px #00000057;font:700 10px/1.2 var(--font-mono);font-variant-numeric:tabular-nums;overflow-wrap:anywhere}.remote-window-stats__row{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:baseline;column-gap:10px;row-gap:2px}.remote-window-stats__row.is-prominent{padding-bottom:3px;margin-bottom:2px;color:#7ff0a3;box-shadow:0 1px #7ff0a32e}.remote-window-stats__label{color:#ffffff75}.remote-window-stats__value{justify-self:end;min-width:0;color:inherit}.remote-window-stats__message{color:#ffffffb8}.remote-window-stats__spark{width:100%;height:22px;margin:1px 0 2px}.remote-window-stats__spark path{fill:none;stroke:#ffffff94;stroke-width:1.5;stroke-linejoin:round;stroke-linecap:round}.tile.share-tile.remote-control-active{border-color:color-mix(in srgb,var(--live-bright) 52%,var(--hairline));box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--live-bright) 24%,transparent),0 0 0 1px #0000001f}.tile.share-tile.remote-control-active video,.tile.share-tile.remote-control-active canvas.full-range-canvas{cursor:crosshair}.tiles.draw-mode-active .share-tile{cursor:var(--draw-cursor, crosshair);touch-action:none}.tiles.draw-mode-active .share-tile video,.tiles.draw-mode-active .share-tile canvas.full-range-canvas{cursor:var(--draw-cursor, crosshair)}.remote-control-button{position:absolute;right:10px;top:10px;z-index:3;height:26px;padding:0 10px;border-radius:var(--radius-pill);border:1px solid var(--hairline-strong);background:#0a0a0bc2;color:#ffffffd6;font:700 10px var(--font-ui);cursor:pointer;transition:background var(--motion-fast) var(--ease-standard),border-color var(--motion-fast) var(--ease-standard),color var(--motion-fast) var(--ease-standard)}.remote-control-button:hover{background:#121214e0;color:#fffffff5}.remote-control-button.is-active{border-color:color-mix(in srgb,var(--live-bright) 46%,transparent);background:var(--live-tint);color:var(--live-bright)}.remote-control-button:focus-visible{outline:2px solid var(--id-blue);outline-offset:2px}.tile .audio-dot{width:6px;height:6px;border-radius:var(--radius-pill);background:var(--live-bright);flex-shrink:0}.tile .audio-dot.hidden{display:none}.controlbar{flex-shrink:0;display:flex;align-items:center;gap:16px;padding:14px 24px;border-top:1px solid var(--hairline);background:var(--bg-base);flex-wrap:wrap}.controls-left{display:flex;align-items:center;gap:16px;flex-wrap:wrap}.control-cell{display:flex;flex-direction:column;align-items:center;gap:7px;width:64px}.control-cell.share-control-cell{width:auto;min-width:188px}.control-label{font:500 10px var(--font-ui);color:var(--text-faint);white-space:nowrap}.control-label.on{font-weight:600;color:#ffffffeb}.leave-cell{margin-left:auto}.leave-label{font-weight:500}.control-button{position:relative;display:inline-flex;align-items:center;justify-content:center;width:var(--control-size);height:var(--control-size);border-radius:var(--radius-pill);border:none;padding:0;background:#ffffff12;color:#ffffffe0;cursor:pointer;transition:background var(--motion-fast) var(--ease-standard),color var(--motion-fast) var(--ease-standard),opacity var(--motion-fast) var(--ease-standard);flex-shrink:0;overflow:hidden}.share-mode-switcher{position:relative;display:inline-flex;align-items:center;height:30px;padding:3px;border:1px solid rgba(255,255,255,.08);border-radius:9px;background:#ffffff0b;color:#ffffff8c;cursor:pointer;box-sizing:border-box;flex-shrink:0;font-family:var(--font-ui);transition-property:border-color,background-color,color,opacity,scale;transition-duration:var(--motion-fast);transition-timing-function:var(--ease-standard)}.share-active-indicator{position:absolute;top:3px;left:3px;width:86px;height:24px;border-radius:6px;background:#ffffff1c;border:1px solid rgba(255,255,255,.1);box-shadow:0 1px 2px #00000059,inset 0 1px #ffffff12;box-sizing:border-box;opacity:0;transform:translate(0);transition-property:opacity,transform;transition-duration:.24s;transition-timing-function:cubic-bezier(.4,0,.2,1)}.share-mode-segment{position:relative;z-index:1;width:86px;height:24px;display:inline-flex;align-items:center;justify-content:center;gap:6px;border-radius:6px;color:#ffffff8c;font:600 12px/1 var(--font-ui);letter-spacing:0;white-space:nowrap;transition-property:color;transition-duration:.16s;transition-timing-function:var(--ease-standard)}.share-identity-dot{width:8px;height:8px;flex:0 0 8px;border-radius:var(--radius-pill);background:#ffffff5c;box-shadow:0 0 0 1px #ffffff1f}.share-mode-switcher:hover:not(:disabled){border-color:#ffffff26;background:#ffffff12}.share-mode-switcher:hover:not(:disabled) .share-mode-segment{color:#ffffffd1}.share-mode-switcher:active:not(:disabled){scale:.96}.share-mode-switcher.live{color:#fffffffa}.share-mode-switcher.live .share-active-indicator{opacity:1}.share-mode-switcher.live .share-mode-segment.sharing{color:#fffffffa}.share-mode-switcher.live .share-identity-dot{background:var(--control-live-bg, var(--live-bright));box-shadow:0 0 0 1px #ffffff2e,0 0 8px color-mix(in srgb,var(--control-live-bg, var(--live-bright)) 38%,transparent)}.share-mode-switcher:disabled{opacity:.48;cursor:not-allowed}.share-mode-switcher:focus-visible{outline:1px solid rgba(255,255,255,.86);outline-offset:2px}.control-button:hover:not(:disabled){opacity:.88}.control-button:active:not(:disabled){opacity:.8}.control-button:disabled{background:#ffffff09;color:#ffffff40;cursor:default}.control-button.draw-active{background:#ffffff26;color:var(--text-primary);box-shadow:inset 0 0 0 1px #ffffff24}.control-button.live{background:var(--control-live-bg, var(--live-tint));color:var(--control-live-fg, var(--live-bright))}.control-button.danger{background:var(--danger-tint-16);color:var(--danger)}#ctl-leave,.control-button.leave-subtle{background:#ffffff12;color:#ffffffe0}#ctl-leave svg,.control-button.leave-subtle svg{opacity:.72}.control-button .slash{stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset var(--motion-base) var(--ease-standard)}.control-button.slashed .slash{stroke-dashoffset:0}.network-panel{flex-shrink:0;border-top:1px solid var(--hairline);background:#ffffff05;max-height:32vh;overflow-y:auto}.network-panel summary{padding:8px 24px;font:700 var(--text-micro) var(--font-mono);color:var(--text-faint);cursor:pointer;-webkit-user-select:none;user-select:none}.network-diagnostics-rows{display:grid;gap:1px;padding:0 24px 14px}.network-empty{margin:0;color:var(--text-faint);font:600 var(--text-micro) var(--font-ui)}.network-row{min-width:0;display:grid;gap:8px;padding:10px 0;border-top:1px solid var(--hairline)}.network-row:first-child{border-top:0}.network-row-head,.network-band-main,.network-metrics{min-width:0;display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 10px}.network-row-head strong{color:#ffffffe6;font:800 12px var(--font-ui)}.network-row-head span,.network-band-main span{color:var(--text-faint);font:600 10.5px var(--font-ui);overflow-wrap:anywhere}.network-band{display:grid;gap:6px;min-width:0;padding:8px 9px;border-radius:var(--radius-chip);background:#ffffff09;box-shadow:var(--shadow-inset-hairline)}.network-band-main strong{color:#ffffffd1;font:800 11px var(--font-ui)}.network-row.state-live .network-band-main strong{color:var(--live-bright)}.network-row.state-idle .network-band-main strong,.network-row.state-occluded .network-band-main strong{color:var(--warning)}.network-row.state-wedged .network-band-main strong{color:var(--danger)}.network-metrics{font:600 10px var(--font-ui);color:var(--text-faint)}.network-metrics span{overflow-wrap:anywhere}.network-metrics b{color:#ffffffc7;font:700 10px var(--font-mono);font-variant-numeric:tabular-nums}.toast{position:fixed;left:50%;bottom:92px;transform:translate(-50%);max-width:min(360px,calc(100vw - 48px));padding:9px 16px;border-radius:var(--radius-pill);background:var(--surface-raised);border:1px solid var(--hairline-strong);color:#ffffffe6;font:600 var(--text-caption) / 1.35 var(--font-ui);overflow-wrap:anywhere;text-wrap:pretty;white-space:pre-line;box-shadow:0 8px 24px #00000073;z-index:50}.dev-panel{flex-shrink:0;border-top:1px solid var(--hairline);background:var(--bg-base);max-height:45vh;overflow-y:auto}.dev-panel summary{padding:8px 24px;font:600 var(--text-micro) var(--font-mono);color:var(--text-faint);cursor:pointer;-webkit-user-select:none;user-select:none}.dev-body{padding:4px 24px 20px;display:flex;flex-direction:column;gap:18px}.dev-section h3{margin:0 0 8px;font:600 var(--text-caption) var(--font-ui);color:var(--text-muted)}.hint{margin:0 0 10px;font-size:var(--text-micro);color:var(--text-faint)}code{font-family:var(--font-mono);font-size:var(--text-micro);color:var(--text-muted);background:var(--surface);border-radius:4px;padding:1px 5px}.row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:6px}.dev-key{font:500 var(--text-micro) var(--font-mono);color:var(--text-faint);min-width:96px}.checkbox-row{display:flex;align-items:center;gap:8px;font-size:var(--text-caption);color:var(--text-muted)}.state{font-family:var(--font-mono);font-size:var(--text-micro);padding:3px 10px;border-radius:var(--radius-pill);background:#ffffff0f;color:var(--text-faint)}.state-on{background:var(--live-tint);color:var(--live-bright)}.state-error{background:var(--danger-tint-12);color:var(--danger)}canvas#test-canvas{display:block;margin-top:12px;width:100%;max-width:420px;height:auto;border:1px solid var(--hairline-strong);border-radius:var(--radius-chip);background:#000}.session-log{font-family:var(--font-mono);font-size:var(--text-micro);max-height:200px;overflow-y:auto;border:1px solid var(--hairline);border-radius:var(--radius-chip);padding:8px 10px;background:var(--surface);color:var(--text-muted)}.session-log .log-line{padding:3px 0;border-bottom:1px solid var(--hairline);display:flex;gap:8px}.session-log .log-line:last-child{border-bottom:none}.session-log .log-time{color:var(--text-faint);flex-shrink:0}.session-log .log-kind-error{color:var(--danger)}.session-log .log-kind-warn{color:var(--warning)}.session-log .log-kind-ok{color:var(--live-bright)}@media(max-width:1024px){.tiles{--tile-min: 190px;--tile-row-min: 132px;--tile-gap: 14px;--tile-pad: 16px;--spotlight-row-min: 112px}.tile .initials{font-size:24px}}@media(max-width:760px){.join-actions{grid-template-columns:1fr}.topbar{padding-inline:14px}.tiles{--tile-min: 170px;--tile-row-min: 128px;--tile-gap: 12px;--tile-pad: 14px;--spotlight-row-min: 128px}.layout-picker{order:-1}.tiles.layout-spotlight{grid-template-columns:minmax(0,1fr);grid-auto-rows:minmax(var(--spotlight-row-min),1fr)}.tile.is-spotlight{grid-column:auto;grid-row:auto;min-height:240px}.tile .initials{font-size:23px}.tile .name-chip{left:8px;bottom:8px;max-width:calc(100% - 16px)}}@media(max-width:560px){.topbar{height:auto;min-height:50px;flex-wrap:wrap;row-gap:7px;padding-block:8px}.room-title{flex:1 1 150px}.topbar-right{margin-left:0;gap:6px}.tiles{--tile-min: 0px;--tile-row-min: 176px;--tile-gap: 10px;--tile-pad: 12px;grid-template-columns:minmax(0,1fr)}.tiles.layout-spotlight{grid-template-columns:minmax(0,1fr);grid-auto-rows:minmax(var(--tile-row-min),1fr)}.tile.is-spotlight{min-height:220px}.controlbar{justify-content:center;gap:12px;padding:12px}.controls-left{justify-content:center;gap:12px}.control-cell{width:58px}.control-cell.share-control-cell{width:auto;min-width:188px}.leave-cell{margin-left:0}}@media(max-width:420px){.topbar{column-gap:8px;padding-inline:10px}.elapsed{font-size:11px}.conn-chip,.count-chip{padding-inline:8px}.tiles{--tile-row-min: 152px;--tile-gap: 9px;--tile-pad: 10px}.tile .initials{font-size:22px}.tile .name-chip{gap:5px;padding:4px 8px}}