:root{--touch: 44px;--move: .2s;--backdrop: color-mix(in srgb, var(--home-ink) 60%, transparent);--sand-tint: color-mix(in srgb, var(--home-sand) 12%, transparent);--danger-tint: color-mix(in srgb, var(--home-danger) 10%, transparent);--danger-line: color-mix(in srgb, var(--home-danger) 24%, transparent)}@media(prefers-reduced-motion:reduce){:root{--move: 1ms}}html,body,#root{height:var(--screen-height, 100%)}html{-webkit-text-size-adjust:100%}body{min-width:320px;color:var(--home-text);-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;overscroll-behavior-y:contain}input{-webkit-user-select:text;user-select:text}body,button,input{font:inherit}button{color:inherit;cursor:pointer;touch-action:manipulation}button:disabled,input:disabled{cursor:not-allowed;opacity:.55}h1,h2,p{margin-top:0}h1{margin-bottom:14px;font-size:clamp(28px,5vw,46px);letter-spacing:0}p{color:var(--home-text-muted);line-height:1.65}:focus-visible{outline:2px solid var(--home-brick);outline-offset:2px}input{width:100%;min-height:44px;border:1px solid var(--home-frame);border-radius:14px;padding:0 12px;color:var(--home-text);background:var(--home-surface-raised);font-size:16px}input::placeholder{color:var(--home-mortar)}input:focus{outline:none;border-color:var(--home-brick);box-shadow:0 0 0 3px var(--home-brick-tint)}.icon{flex:none;width:21px;height:21px}.card{display:grid;gap:16px;border:1px solid var(--home-frame);border-radius:var(--radius-card);padding:20px;background:var(--home-surface)}.btn-primary{position:relative;overflow:hidden;width:100%;height:52px;border:0;border-radius:var(--radius-control);padding:0 20px;color:var(--home-text-on-brick);background:linear-gradient(180deg,var(--home-brick-light) 0%,var(--home-brick) 45%,var(--home-brick-deep) 100%);box-shadow:inset 0 1px #ffffff59,inset 0 -1px #0000002e,0 8px 24px color-mix(in srgb,var(--home-brick-deep) 35%,transparent);font:600 16px/1 var(--font)}.btn-primary:after{position:absolute;top:0;right:0;bottom:50%;left:0;border-radius:inherit;background:linear-gradient(180deg,#ffffff38,#fff0);content:"";pointer-events:none}.btn-primary:active:not(:disabled){background:linear-gradient(180deg,var(--home-brick) 0%,var(--home-brick-deep) 100%);transform:translateY(1px)}.btn-secondary{height:52px;border:1px solid var(--home-frame-strong);border-radius:var(--radius-control);padding:0 20px;color:var(--home-text);background:transparent;font:600 16px/1 var(--font)}.link-button{min-height:var(--touch);border:0;padding:0 8px;color:var(--home-brick);background:transparent;font-size:14px;font-weight:600}.btn-danger{color:var(--home-danger)}.chrome-button{display:grid;width:var(--touch);height:var(--touch);border:1px solid var(--home-frame);border-radius:var(--radius-pill);padding:0;place-items:center;color:var(--home-mortar);background:var(--home-surface-raised)}.field-label{display:block;margin-bottom:8px;color:var(--home-text-muted);font-size:11px;font-weight:600;letter-spacing:1.2px;text-transform:uppercase}.form-message{display:flex;gap:8px;align-items:flex-start;margin:0;color:var(--home-danger);font-size:13px;line-height:1.45}.form-message .icon{width:18px;height:18px}.badge{margin-left:8px;border-radius:var(--radius-pill);padding:2px 8px;color:var(--home-sand);background:var(--sand-tint);font-size:12px;font-style:normal;font-weight:600}.shell{position:relative;height:100%;overflow:hidden}.shell-page{height:100%;overflow-y:auto}.menu-button{position:absolute;z-index:10;top:max(12px,env(safe-area-inset-top));left:max(12px,env(safe-area-inset-left))}.account-panel-shell{position:fixed;z-index:40;top:0;right:0;bottom:0;left:0;pointer-events:none;visibility:hidden;transition:visibility 0s linear var(--move)}.account-panel-shell-open{pointer-events:auto;visibility:visible;transition-delay:0s}.account-panel-backdrop{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;border:0;opacity:0;background:var(--backdrop);transition:opacity var(--move) ease}.account-panel-shell-open .account-panel-backdrop{opacity:1}.account-panel{position:absolute;inset:max(16px,calc(env(safe-area-inset-top) + 8px)) auto max(16px,calc(env(safe-area-inset-bottom) + 8px)) 0;display:flex;width:min(320px,75vw);flex-direction:column;gap:7px;border:1px solid var(--home-frame);border-left:0;border-radius:0 24px 24px 0;padding:18px;padding-left:max(18px,env(safe-area-inset-left));background:var(--home-surface);transform:translate(calc(-100% - 20px));transition:transform var(--move) ease}.account-panel-shell-open .account-panel{transform:translate(0)}.account-panel-header{display:flex;gap:12px;align-items:center;justify-content:space-between;margin-bottom:23px}.account-panel-header .chrome-button{flex:0 0 var(--touch)}.account-panel-brand{display:flex;min-width:0;gap:8px;align-items:center}.nav-button{position:relative;display:flex;min-height:50px;gap:12px;align-items:center;border:0;border-radius:15px;padding:0 14px;color:var(--home-text-muted);background:transparent;text-align:left}.nav-button-active{color:var(--home-brick);background:var(--home-brick-tint)}.nav-button-active:before{position:absolute;inset:9px auto 9px 0;width:3px;border-radius:4px;background:var(--home-brick);content:""}.build-info{margin:auto 0 10px;color:var(--home-mortar);font-size:12px;text-align:center}.account-menu-action{display:flex;min-height:48px;flex:none;gap:10px;align-items:center;border:1px solid var(--danger-line);border-radius:14px;padding:0 14px;color:var(--home-danger);background:var(--danger-tint)}.app-shell{position:relative;display:flex;min-height:100vh;height:100dvh;flex-direction:column;overflow-y:auto;overscroll-behavior:contain;padding-top:calc(var(--logo-bottom) + var(--tagline-height) + 32px);padding-bottom:calc(20px + env(safe-area-inset-bottom));background-color:var(--home-ink)}.auth-card-zone{display:flex;width:min(520px,100%);position:relative;z-index:1;flex:0 0 auto;align-items:flex-start;margin:auto auto 0;padding:0 16px}.auth-card{width:100%;border:1px solid var(--home-frame);border-radius:var(--radius-sheet);padding:28px 24px;background:var(--home-surface)}.auth-card-headline{margin-bottom:8px;font-size:22px;line-height:1.25}.auth-card-subtitle{margin-bottom:22px;font-size:14px;line-height:1.5}.auth-form{display:grid;gap:14px}.auth-form .btn-primary{margin-top:6px}.auth-form .link-button{justify-self:center}.code-input{font-size:24px;letter-spacing:.2em}@media(max-height:700px){.app-shell{padding-top:calc(var(--logo-bottom) + 12px);padding-bottom:calc(16px + env(safe-area-inset-bottom))}.auth-card{padding:20px}.auth-card-subtitle{margin-bottom:14px}.auth-form{gap:10px}.auth-form .btn-primary{height:48px}}@media(min-width:744px)and (min-height:501px){.app-shell{align-items:center;padding-right:40px;padding-left:40px}.auth-card-zone{width:100%;max-width:480px;margin:0;padding:0}}@media(min-width:744px)and (min-height:900px){.app-shell{padding-top:calc(var(--logo-bottom) + var(--tagline-height) + 52px)}}@media(max-width:743px),(max-height:1050px){.app-shell.is-tall{padding-top:calc(env(safe-area-inset-top) + 16px)}.app-shell.is-tall .brand-tagline{display:none}.app-shell.is-tall .auth-card-zone{margin-top:auto;margin-bottom:0}}.screen{display:grid;align-content:start;gap:18px;width:min(620px,100%);margin:0 auto;padding:calc(env(safe-area-inset-top) + 70px) 20px calc(env(safe-area-inset-bottom) + 24px)}.screen h1{margin:0}.row-list{display:grid;margin:0;padding:0;list-style:none}.row-list li{display:flex;min-height:50px;gap:12px;align-items:center;justify-content:space-between}.row-list li+li{border-top:1px solid var(--home-frame)}.row-value{color:var(--home-text-muted);font-size:14px}.pairing{display:grid;gap:8px;text-align:center}.pairing p{margin:0}.pairing-code{color:var(--home-text);font-size:38px;font-weight:700;letter-spacing:.08em}.wall{position:relative;isolation:isolate;height:100%;overflow:hidden;background:var(--atmosphere),var(--home-ink)}.wall-stage{position:absolute;top:calc(env(safe-area-inset-top) + 62px);right:max(8px,env(safe-area-inset-right));bottom:max(8px,calc(env(safe-area-inset-bottom) - 20px));left:max(8px,env(safe-area-inset-left))}.wall[data-island=left] .wall-stage{right:8px}.wall[data-island=right] .wall-stage{left:8px}.wall-empty{display:grid;gap:4px;height:100%;align-content:center;text-align:center}.wall-empty p{margin:0}.wall-bar{position:absolute;z-index:1060;top:max(12px,env(safe-area-inset-top));right:max(12px,env(safe-area-inset-right));left:max(12px,env(safe-area-inset-left));display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:8px;align-items:center;min-height:var(--touch)}.wall-bar-start{display:flex;min-width:0;gap:8px;align-items:center;padding-left:56px}.wall-bar-centre{display:flex;justify-content:center}.setup-buttons{display:flex;flex-wrap:nowrap;gap:6px;align-items:center}.setup-button{display:grid;width:38px;height:38px;flex:none;border:1px solid var(--home-frame);border-radius:var(--radius-pill);padding:0;place-items:center;color:var(--home-text-muted);background:var(--home-surface-raised);font-size:15px;font-weight:600;-webkit-touch-callout:none;touch-action:manipulation}.setup-button.is-current{border-color:var(--home-brick);color:var(--home-brick);background:var(--home-brick-tint)}.add-camera-button,.still-on-chip{display:flex;min-height:38px;flex:none;gap:4px;align-items:center;border:1px solid var(--home-frame);border-radius:var(--radius-pill);padding:0 14px;color:var(--home-text-muted);background:var(--home-surface-raised);font-size:14px;font-weight:600}.add-camera-button .icon{width:18px;height:18px}.still-on-chip{border-color:var(--home-sand);color:var(--home-sand)}.wall-menu,.more-popover{display:grid;border:1px solid var(--home-frame-strong);border-radius:var(--radius-control);padding:6px;background:var(--home-surface-raised)}.wall-menu{position:absolute;top:calc(100% + 8px);left:56px;min-width:200px}.wall-menu button,.more-popover button{display:flex;min-height:var(--touch);gap:10px;align-items:center;border:0;border-radius:12px;padding:0 12px;background:transparent;font-size:15px;text-align:left;white-space:nowrap}.wall-menu button{color:var(--home-text)}.wall-menu button.btn-danger{color:var(--home-danger)}.more-popover button{color:var(--home-text)}.frame{position:absolute;display:flex;flex-direction:column;border:1px solid var(--home-frame);border-radius:var(--radius-card);padding:8px;background:var(--home-surface);touch-action:none;transition:left .28s ease,top .28s ease,width .28s ease,height .28s ease,opacity .25s ease,transform .2s ease}.frame.is-dragging{transition:none;border-color:var(--home-brick)}.wall.is-arranging .frame{border-color:var(--home-brick);cursor:grab}.wall.is-arranging .frame-picture{opacity:.82}.frame.is-held{box-shadow:0 18px 40px color-mix(in srgb,var(--home-ink) 70%,transparent);transform:scale(1.02)}.frame-corner{pointer-events:none}.wall.is-arranging .frame-corner{width:44px;height:44px;pointer-events:auto}.wall.is-arranging .frame-corner:after{width:20px;height:20px;border-width:3px;border-color:var(--home-brick);opacity:1}.done-button{min-height:var(--touch);border:0;border-radius:var(--radius-pill);padding:0 22px;color:var(--home-text-on-brick);background:var(--home-brick);font-weight:700}.frame.is-full{top:0;right:0;bottom:0;left:0;z-index:800}.frame.is-behind{visibility:hidden}.frame-corner{position:absolute;width:34px;height:34px;touch-action:none}.frame-corner:after{position:absolute;width:14px;height:14px;border:2px solid var(--home-mortar);content:"";opacity:.55}.frame-corner.is-nw{top:-8px;left:-8px;cursor:nwse-resize}.frame-corner.is-ne{top:-8px;right:-8px;cursor:nesw-resize}.frame-corner.is-sw{bottom:-8px;left:-8px;cursor:nesw-resize}.frame-corner.is-se{right:-8px;bottom:-8px;cursor:nwse-resize}.frame-corner.is-nw:after{top:8px;left:8px;border-right:0;border-bottom:0;border-top-left-radius:11px}.frame-corner.is-ne:after{top:8px;right:8px;border-bottom:0;border-left:0;border-top-right-radius:11px}.frame-corner.is-sw:after{bottom:8px;left:8px;border-top:0;border-right:0;border-bottom-left-radius:11px}.frame-corner.is-se:after{right:8px;bottom:8px;border-top:0;border-left:0;border-bottom-right-radius:11px}.frame-picture{position:relative;overflow:hidden;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none;flex:1 1 auto;min-height:0;border-radius:13px;background:var(--home-ink);touch-action:none}.frame-video{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:contain;opacity:0;pointer-events:none}.frame-video.is-filled{object-fit:cover}.frame-video.is-live{opacity:1}.frame-status{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;gap:8px;align-items:center;justify-content:center;padding:0 16px;color:var(--home-mortar);text-align:center}.frame-status p{margin:0;color:var(--home-text-muted);font-size:14px;line-height:1.4}.frame-spinner{width:24px;height:24px;border:2px solid var(--spinner-track);border-top-color:var(--home-brick);border-radius:var(--radius-pill);animation:spin .9s linear infinite}.frame-bar{display:flex;gap:8px;align-items:center;justify-content:space-between;flex:none;padding:8px 2px 0 6px}.frame-tools{display:flex;flex:none;gap:6px;align-items:center}.frame-sound{position:relative}.more-popover{position:absolute;z-index:3;right:-2px;bottom:calc(100% + 10px)}.more-popover.is-below{top:calc(100% + 10px);bottom:auto}.hold-button{-webkit-touch-callout:none;touch-action:none}.hold-button.is-held{border-color:var(--home-brick);color:var(--home-text-on-brick);background:var(--home-brick)}.frame-talking,.frame-toast{position:absolute;top:10px;left:50%;display:flex;max-width:calc(100% - 20px);gap:6px;align-items:center;margin:0;border-radius:var(--radius-pill);padding:5px 12px;color:var(--home-text-on-brick);background:var(--home-brick);font-size:13px;font-weight:600;line-height:1.3;transform:translate(-50%)}.frame-toast{color:var(--home-danger);background:var(--home-surface)}.frame-talking .icon,.frame-toast .icon{width:16px;height:16px}.frame-name{margin:0;overflow:hidden;color:var(--home-text);font-size:15px;font-weight:600;text-overflow:ellipsis;white-space:nowrap}.wall-notice{position:absolute;z-index:1060;right:72px;bottom:max(16px,env(safe-area-inset-bottom));left:72px;margin:0;color:var(--home-warn);font-size:14px;font-weight:600;line-height:1.4;text-align:center;pointer-events:none}@media(max-width:560px){.wall-bar{gap:6px}.setup-buttons{min-width:0;gap:4px;overflow-x:auto;scrollbar-width:none}.setup-button{width:34px;height:34px}.add-camera-button{min-height:34px;padding:0 9px}.add-camera-label{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}}.turn-ring,.hold-slider{position:fixed;z-index:1100;border:1px solid var(--home-frame);background:var(--home-surface-raised);box-shadow:0 8px 24px color-mix(in srgb,var(--home-ink) 45%,transparent);opacity:0;pointer-events:none;transform:translate(-50%,-50%) scale(.82);transition:opacity .16s ease,transform .16s ease}.turn-ring.is-open,.hold-slider.is-open{opacity:1;transform:translate(-50%,-50%) scale(1)}.turn-ring{width:164px;height:164px;border-radius:50%}.turn-arrow{position:absolute;display:grid;width:20px;height:20px;place-items:center;color:var(--home-text-muted);transition:color .12s ease}.turn-arrow .icon{width:14px;height:14px}.turn-arrow.is-active{color:var(--home-brick)}.turn-arrow.is-up{top:6px;left:calc(50% - 10px)}.turn-arrow.is-right{top:calc(50% - 10px);right:6px}.turn-arrow.is-down{bottom:6px;left:calc(50% - 10px)}.turn-arrow.is-left{top:calc(50% - 10px);left:6px}.turn-knob{position:absolute;top:calc(50% - 22px);left:calc(50% - 22px);width:44px;height:44px;border-radius:50%;background:var(--home-brick)}.hold-slider{width:46px;height:170px;overflow:hidden;border-radius:var(--radius-pill)}.hold-slider-fill{position:absolute;right:0;bottom:0;left:0;background:var(--home-brick);transition:height .08s linear}.wall-dim{position:absolute;z-index:1050;top:0;right:0;bottom:0;left:0;background:var(--home-dim);pointer-events:none;transition:opacity .12s linear}.wall-bar-end{display:flex;gap:8px;justify-self:end}.play-all-button{border-color:var(--home-brick);color:var(--home-text-on-brick);background:var(--home-brick)}.play-all-button .icon{fill:currentColor}@keyframes appear{0%{opacity:0;transform:translateY(4px)}}.wall-menu,.more-popover,.frame-toast{animation:appear .2s ease;transition:opacity .35s ease}.wall-menu.is-fading,.more-popover.is-fading,.frame-toast.is-fading{opacity:0}.turn-ring,.hold-slider{transition:opacity .35s ease,transform .2s ease}.turn-ring.is-touchable,.hold-slider.is-touchable{pointer-events:auto;touch-action:none}.frame-clock{position:absolute;top:8px;left:8px;display:flex;gap:6px;align-items:center;margin:0;border-radius:var(--radius-pill);padding:3px 9px;color:var(--home-text);background:color-mix(in srgb,var(--home-ink) 72%,transparent);font-size:12px;font-variant-numeric:tabular-nums;font-weight:600;pointer-events:none}.frame-clock.is-stalled{color:var(--home-warn)}.frame-clock .icon{width:14px;height:14px}.live-dot{width:7px;height:7px;border-radius:50%;background:var(--home-brick)}.frame-toast.is-note{color:var(--home-text)}.mini-spinner{width:11px;height:11px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:spin .9s linear infinite}
