:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:#202621;background:#f5f3ee;font-synthesis:none;text-rendering:optimizeLegibility;line-height:1.5;font-weight:400;--ink: #202621;--muted: #667067;--surface: #fffdf8;--line: #deded6;--sage: #315e4b;--sage-light: #e2ece5;--warm: #b95741;--shadow: 0 24px 70px rgba(47, 51, 45, .09)}*{box-sizing:border-box}html{min-width:320px;min-height:100%;background:#f5f3ee;-webkit-text-size-adjust:100%}body{min-width:320px;min-height:100vh;min-height:100dvh;margin:0;overflow-x:hidden}button,a{font:inherit}button:focus-visible,a:focus-visible{outline:3px solid rgba(49,94,75,.32);outline-offset:3px}.app-shell{min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;background:radial-gradient(circle at 12% 10%,rgba(215,227,216,.75),transparent 30rem),radial-gradient(circle at 90% 55%,rgba(232,220,200,.55),transparent 28rem),#f5f3ee}.site-header{width:min(1180px,calc(100% - 40px));margin:0 auto;padding:max(24px,env(safe-area-inset-top)) 0 24px;display:flex;align-items:center;justify-content:space-between}.brand{color:var(--ink);display:inline-flex;align-items:center;gap:10px;font-family:inherit;font-size:1rem;font-weight:700;letter-spacing:-.02em;text-decoration:none}.brand-mark{display:grid;width:34px;height:34px;place-items:center;border-radius:11px;color:#fff;background:var(--sage)}.privacy-note{display:flex;align-items:center;gap:8px;color:var(--sage);font-size:.84rem;font-weight:600}.privacy-note span{font-size:.62rem}.page-content{width:min(1040px,calc(100% - 40px));flex:1;margin:42px auto 50px}.intro{max-width:690px;margin-bottom:38px}.eyebrow{margin:0 0 9px;color:var(--sage);font-size:.75rem;font-weight:700;letter-spacing:.13em;text-transform:uppercase}.intro h1{margin:0;max-width:650px;font-family:inherit;font-size:clamp(2.35rem,6vw,4.4rem);line-height:1.03;letter-spacing:-.055em}.intro>p:last-child{max-width:590px;margin:20px 0 0;color:var(--muted);font-size:clamp(1rem,2vw,1.12rem)}.permission-card,.join-card,.media-card{border:1px solid rgba(214,214,205,.9);border-radius:28px;background:#fffdf8eb;box-shadow:var(--shadow);overflow:hidden}.join-card{padding:clamp(24px,5vw,48px);display:grid;grid-template-columns:minmax(220px,.8fr) minmax(300px,1.2fr);gap:clamp(28px,6vw,72px)}.join-heading h2{margin:0;font-size:clamp(1.65rem,3vw,2.35rem);letter-spacing:-.04em}.join-heading>p:last-child{margin:14px 0 0;color:var(--muted)}.join-form{display:grid;gap:18px}.join-form label{display:grid;gap:7px;color:var(--ink);font-weight:700}.join-form input{width:100%;min-height:50px;padding:0 15px;border:1px solid var(--line);border-radius:13px;color:var(--ink);background:#faf9f5;font:inherit;font-weight:500;outline:none;transition:border-color .15s ease,box-shadow .15s ease}.join-form input:focus{border-color:var(--sage);box-shadow:0 0 0 3px #315e4b1f}.join-form small{color:var(--muted);font-size:.76rem;font-weight:400}.join-form .primary-button{justify-self:start}.join-error{grid-column:auto}.preflight-stack{display:grid;gap:12px}.selected-room{padding:13px 17px;display:flex;align-items:center;gap:10px;border:1px solid var(--line);border-radius:14px;background:#fffdf8c2;color:var(--muted);font-size:.86rem}.selected-room strong{color:var(--ink)}.selected-room button{margin-left:auto;padding:4px 8px;border:0;color:var(--sage);background:transparent;cursor:pointer;font-weight:700}.permission-card{min-height:310px;padding:clamp(24px,5vw,48px);display:grid;grid-template-columns:120px 1fr auto;align-items:center;gap:34px}.permission-visual{width:112px;height:112px;display:grid;place-items:center;border-radius:35px;background:var(--sage-light);transform:rotate(-4deg)}.lens{width:42px;height:42px;border:10px solid var(--sage);border-radius:50%;box-shadow:24px 0 0 -12px var(--sage)}.permission-card h2{margin:0;font-family:inherit;font-size:clamp(1.5rem,3vw,2.05rem);letter-spacing:-.035em}.permission-copy{max-width:470px;margin:12px 0 0;color:var(--muted);overflow-wrap:anywhere}.primary-button,.control-button{border:0;cursor:pointer;transition:transform .15s ease,background-color .15s ease,opacity .15s ease}.primary-button{min-height:50px;padding:0 22px;display:inline-flex;align-items:center;justify-content:center;gap:10px;white-space:nowrap;border-radius:15px;color:#fff;background:var(--sage);font-weight:700}.primary-button:hover:not(:disabled),.control-button:hover:not(:disabled){transform:translateY(-1px)}.primary-button:hover:not(:disabled){background:#274f3e}button:disabled{cursor:not-allowed;opacity:.48}.spinner{width:17px;height:17px;border:2px solid rgba(255,255,255,.4);border-top-color:#fff;border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.error-message{grid-column:2 / -1;padding:14px 16px;display:flex;flex-direction:column;gap:2px;border:1px solid #e7c2b8;border-radius:13px;color:#753c2f;background:#fff1ed;font-size:.9rem}.media-card{padding:14px}.call-stage{position:relative;aspect-ratio:16 / 9;overflow:hidden;border-radius:19px;background:radial-gradient(circle at 50% 35%,rgba(64,82,72,.62),transparent 38%),#141a17;isolation:isolate}.remote-video{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .18s ease}.remote-video.is-visible{opacity:1}.remote-placeholder{position:absolute;inset:0;display:grid;place-content:center;place-items:center;gap:9px;padding:24px;color:#dfe9e2;text-align:center}.remote-placeholder svg{width:54px;height:54px;margin-bottom:4px;fill:none;stroke:#91a398;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.5}.remote-placeholder strong{font-size:clamp(1rem,2vw,1.28rem)}.remote-placeholder span{color:#9eaea4;font-size:.82rem}.local-preview{position:absolute;top:16px;right:16px;width:clamp(138px,21vw,220px);aspect-ratio:4 / 3;overflow:hidden;border:1px solid rgba(255,255,255,.32);border-radius:15px;background:#26312b;box-shadow:0 12px 35px #00000052;cursor:grab;touch-action:pan-y;-webkit-user-select:none;user-select:none;z-index:5;transition:transform .22s ease,opacity .18s ease}.local-preview:active{cursor:grabbing}.local-preview.is-hidden{opacity:0;pointer-events:none;transform:translate(calc(100% + 24px))}.local-preview video{display:block;width:100%;height:100%;object-fit:cover;transform:scaleX(-1)}.local-label{position:absolute;bottom:8px;left:8px;padding:3px 7px;border:1px solid rgba(255,255,255,.2);border-radius:7px;color:#fff;background:#141916a3;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);font-size:.72rem;font-weight:600;z-index:3}.local-camera-off{position:absolute;inset:0;display:grid;place-items:center;padding:12px;color:#d8e0da;background:#26312b;text-align:center;font-size:.74rem;font-weight:600}.swipe-hint{position:absolute;top:0;right:0;width:24px;height:100%;padding:0;border:0;color:#ffffffbd;background:linear-gradient(90deg,transparent,rgba(10,13,11,.38));cursor:pointer;font-size:1.25rem;font-weight:300}.local-preview-restore{position:absolute;top:50%;right:0;width:28px;height:64px;border:1px solid rgba(255,255,255,.22);border-right:0;border-radius:12px 0 0 12px;color:#fff;background:#141916bd;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);cursor:pointer;font-size:1.5rem;opacity:0;pointer-events:none;z-index:6;transform:translateY(-50%);transition:opacity .16s ease}.local-preview-restore.is-visible{opacity:1;pointer-events:auto}.fullscreen-button{position:absolute;top:14px;left:14px;min-height:38px;padding:7px 11px;display:inline-flex;align-items:center;justify-content:center;gap:7px;border:1px solid rgba(255,255,255,.24);border-radius:10px;color:#fff;background:#141916ad;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);cursor:pointer;font-size:.8rem;font-weight:600;z-index:7;transition:background-color .15s ease,transform .15s ease}.fullscreen-button:hover{background:#141916e0;transform:translateY(-1px)}.call-stage:fullscreen,.call-stage:-webkit-full-screen,.call-stage.is-fullscreen{width:100vw;height:100vh;height:100dvh;aspect-ratio:auto;border-radius:0;background:#090c0a}.call-stage.is-fullscreen{position:fixed;inset:0;z-index:2000}.call-stage:fullscreen .remote-video,.call-stage:-webkit-full-screen .remote-video,.call-stage.is-fullscreen .remote-video{object-fit:cover}.call-stage:fullscreen .local-preview,.call-stage:-webkit-full-screen .local-preview,.call-stage.is-fullscreen .local-preview{top:max(16px,env(safe-area-inset-top));right:max(16px,env(safe-area-inset-right))}.call-stage:fullscreen .fullscreen-button,.call-stage:-webkit-full-screen .fullscreen-button,.call-stage.is-fullscreen .fullscreen-button{top:max(16px,env(safe-area-inset-top));left:max(16px,env(safe-area-inset-left))}.fullscreen-controls{position:absolute;bottom:max(20px,calc(env(safe-area-inset-bottom) + 12px));left:50%;display:none;align-items:center;justify-content:center;gap:clamp(14px,4vw,24px);padding:10px;border:1px solid rgba(255,255,255,.14);border-radius:999px;background:#0d110fa8;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);z-index:8;transform:translate(-50%)}.call-stage:fullscreen .fullscreen-controls,.call-stage:-webkit-full-screen .fullscreen-controls,.call-stage.is-fullscreen .fullscreen-controls{display:flex}.call-icon-button{width:clamp(50px,7vw,58px);height:clamp(50px,7vw,58px);display:inline-grid;place-items:center;flex:0 0 auto;border:1px solid rgba(255,255,255,.18);border-radius:50%;color:#fff;background:#ffffff24;cursor:pointer;transition:background-color .15s ease,transform .15s ease}.call-icon-button:hover:not(:disabled){background:#ffffff3d;transform:translateY(-1px)}.call-icon-button[aria-pressed=true]{background:#b95741c7}.call-icon-button svg{width:26px;height:26px;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8}.call-icon-button .icon-slash{stroke-width:2.2}.hang-up-icon-button{border-color:#c86550;background:var(--warm)}.hang-up-icon-button:hover:not(:disabled){background:#a64a37}.media-details{padding:20px 8px 8px}.status-row{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:18px}.state-badge{min-width:160px;padding:10px 13px;display:flex;align-items:center;gap:9px;border:1px solid var(--line);border-radius:12px;color:var(--muted);background:#faf9f5;font-size:.86rem}.state-badge strong{margin-left:auto;color:var(--ink)}.state-dot{width:8px;height:8px;border-radius:50%;background:#a0a29d}.state-dot.active{background:#3f8b67;box-shadow:0 0 0 4px #3f8b671f}.controls{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.control-button{min-height:48px;padding:10px 13px;display:flex;align-items:center;justify-content:center;gap:8px;border:1px solid var(--line);border-radius:13px;color:var(--ink);background:#f1f1eb;font-weight:600}.control-button:hover:not(:disabled){background:#e9ebe4}.stop-button{color:#fff;border-color:var(--warm);background:var(--warm)}.stop-button:hover:not(:disabled){background:#a64a37}.inline-warning{margin:0 0 14px;padding:11px 13px;border-radius:10px;color:#714436;background:#f9ebe6;font-size:.86rem}.device-hint{margin:14px 0 0;color:#7d837c;text-align:center;font-size:.78rem}.room-panel{margin-top:18px;padding:18px;border:1px solid var(--line);border-radius:16px;background:#faf9f5}.room-panel-ready{border-color:#b8d4c1;background:#f0f7f2}.room-panel-error,.room-panel-full,.room-panel-expired{border-color:#e7c2b8;background:#fff5f1}.room-panel-heading,.room-actions{display:flex;align-items:center;gap:12px}.room-panel-heading{justify-content:space-between}.room-panel-heading>div{display:grid;gap:2px}.room-label{color:var(--muted);font-size:.73rem}.room-status-chip{padding:6px 10px;border-radius:999px;color:var(--sage);background:var(--sage-light);font-size:.76rem;font-weight:700}.room-panel>p{margin:13px 0 0;color:var(--muted);font-size:.9rem}.room-panel .ttl-note{color:#865743;font-size:.78rem}.room-actions{margin-top:16px}.room-actions .primary-button,.room-actions .control-button{min-height:44px}footer{min-height:64px;padding:18px max(20px,env(safe-area-inset-right)) max(18px,env(safe-area-inset-bottom)) max(20px,env(safe-area-inset-left));display:flex;align-items:center;justify-content:center;gap:11px;color:#7d837c;font-size:.78rem}@media(max-width:760px){.site-header,.page-content{width:min(100% - 28px,980px)}.site-header{padding-top:max(18px,env(safe-area-inset-top))}.page-content{margin:26px auto 34px}.intro{margin-bottom:28px}.permission-card{grid-template-columns:74px 1fr;gap:20px}.join-card{grid-template-columns:1fr}.permission-visual{width:72px;height:72px;border-radius:23px}.lens{width:29px;height:29px;border-width:7px;box-shadow:17px 0 0 -9px var(--sage)}.primary-button,.error-message{grid-column:1 / -1}.controls{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:470px){.privacy-note{font-size:0;gap:0}.privacy-note span{font-size:.62rem}.intro h1{font-size:clamp(2rem,11vw,2.45rem);line-height:1.08}.permission-card{padding:24px 20px;grid-template-columns:1fr;gap:18px;text-align:center}.join-card{padding:24px 20px}.join-form .primary-button{width:100%}.room-panel-heading,.room-actions{align-items:stretch;flex-direction:column}.room-status-chip{align-self:flex-start}.room-actions button{width:100%}.permission-visual{width:68px;height:68px;margin:0 auto}.permission-copy{margin-right:auto;margin-left:auto}.primary-button,.error-message{width:100%}.media-card{padding:8px;border-radius:21px}.call-stage{aspect-ratio:4 / 3;border-radius:15px}.fullscreen-button{top:10px;left:10px}.local-preview{top:10px;right:10px;width:clamp(98px,30vw,128px);border-radius:12px}.call-stage:fullscreen .local-preview,.call-stage:-webkit-full-screen .local-preview,.call-stage.is-fullscreen .local-preview{top:max(10px,env(safe-area-inset-top));right:max(10px,env(safe-area-inset-right))}.call-stage:fullscreen .fullscreen-button,.call-stage:-webkit-full-screen .fullscreen-button,.call-stage.is-fullscreen .fullscreen-button{top:max(10px,env(safe-area-inset-top));left:max(10px,env(safe-area-inset-left))}.fullscreen-controls{width:max-content;max-width:calc(100% - 24px);gap:14px;padding:8px}.call-icon-button{width:52px;height:52px}.media-details{padding:16px 4px 4px}.state-badge{flex:1;min-width:140px}.controls{grid-template-columns:repeat(2,minmax(0,1fr))}.stop-button{grid-column:1 / -1}footer{flex-wrap:wrap}}@media(max-width:350px){.site-header,.page-content{width:calc(100% - 20px)}.brand{font-size:.92rem}.intro h1{font-size:1.9rem}.controls{grid-template-columns:1fr}.stop-button{grid-column:auto}}@media(orientation:landscape)and (max-height:560px){.site-header{padding-top:12px;padding-bottom:12px}.page-content{margin-top:12px}.intro{margin-bottom:18px}.intro h1{font-size:clamp(2rem,6vw,3.2rem)}.intro>p:last-child{margin-top:10px}.call-stage:fullscreen .local-preview,.call-stage:-webkit-full-screen .local-preview,.call-stage.is-fullscreen .local-preview{width:118px}.fullscreen-controls{bottom:max(8px,env(safe-area-inset-bottom));padding:6px}.call-icon-button{width:46px;height:46px}.call-icon-button svg{width:23px;height:23px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}.connection-status{position:absolute;top:calc(64px + env(safe-area-inset-top));left:16px;z-index:3;background:#102222cc;color:#fff;padding:8px 12px;border-radius:20px;font-size:13px}.play-remote{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:4}