:root{color:#1d2622;background:#f7f5ef;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh}button,input{font:inherit}button{align-items:center;border:0;border-radius:8px;cursor:pointer;display:inline-flex;gap:10px;justify-content:center;min-height:48px;padding:0 18px}button:disabled{cursor:not-allowed;opacity:.45}.app-shell{display:grid;grid-template-columns:minmax(0,1fr) 380px;min-height:100vh}.viewer{display:flex;flex-direction:column;min-width:0}.topbar{align-items:center;border-bottom:1px solid #d9ded3;display:flex;justify-content:space-between;min-height:76px;padding:0 28px}.topbar-actions{align-items:center;display:flex;gap:12px}.brand{align-items:center;display:inline-flex;gap:12px;font-size:20px;font-weight:850}.brand svg{color:#116a4a}.status{align-items:center;border-radius:999px;display:inline-flex;font-size:14px;font-weight:800;gap:8px;padding:9px 13px}.status-idle,.status-connecting,.status-waiting{background:#fff1d8;color:#9a5a00}.status-connected{background:#e4f3ea;color:#116a4a}.status-error{background:#fde7e4;color:#b3261e}.fullscreen-toggle{background:#eef1ea;color:#1d2622;min-height:42px;min-width:42px;padding:0}.stage{align-items:center;display:flex;flex:1;justify-content:center;padding:34px}.phone-frame{background:#101411;border-radius:42px;box-shadow:0 34px 80px #1d262238;max-height:min(760px,calc(100vh - 150px));padding:14px;position:relative;transition:width .18s ease,aspect-ratio .18s ease,border-radius .18s ease}.phone-frame-landscape{border-radius:34px}.phone-frame-landscape .phone-notch{width:146px}.phone-frame-landscape .screen-surface{padding:20px}.viewer:fullscreen{background:#0f1411}.viewer:fullscreen .topbar{border-bottom-color:#ffffff1a}.viewer:fullscreen .brand,.viewer:fullscreen .status-connected,.viewer:fullscreen .status-idle,.viewer:fullscreen .status-connecting,.viewer:fullscreen .status-waiting,.viewer:fullscreen .status-error{box-shadow:0 0 0 1px #ffffff0d inset}.viewer:fullscreen .stage{padding:20px 24px 24px}.viewer:fullscreen .phone-frame{max-height:calc(100vh - 120px)}.phone-notch{background:#101411;border-radius:0 0 18px 18px;height:26px;left:50%;position:absolute;top:14px;transform:translate(-50%);width:112px;z-index:1}.screen-surface{align-items:center;background:linear-gradient(160deg,#fffffff2,#e4f3eaeb),#fff;border-radius:30px;color:#66736c;display:flex;flex-direction:column;gap:16px;height:100%;justify-content:center;overflow:hidden;padding:32px;text-align:center;position:relative}.stream-placeholder{align-items:center;display:flex;flex-direction:column;gap:16px}.stream-placeholder svg{color:#116a4a}.stream-placeholder p{font-size:18px;font-weight:750;line-height:1.45;margin:0;max-width:270px}.stream-video{background:#111612;height:100%;top:0;right:0;bottom:0;left:0;object-fit:contain;opacity:0;position:absolute;width:100%}.stream-video-rotated{height:auto;inset:auto;max-height:none;max-width:none;transform-origin:center center;width:auto}.stream-video.visible{opacity:1}.screen-audio{height:0;opacity:0;pointer-events:none;position:absolute;width:0}.control-panel{background:#fff;border-left:1px solid #d9ded3;display:flex;flex-direction:column;gap:24px;padding:28px}.join-form{display:flex;flex-direction:column;gap:12px}.join-form label{color:#66736c;font-size:13px;font-weight:850;text-transform:uppercase}.join-form input{border:1px solid #cfd7cd;border-radius:8px;color:#1d2622;min-height:50px;outline:none;padding:0 14px}.join-form input:focus{border-color:#116a4a;box-shadow:0 0 0 3px #116a4a26}#code{font-size:32px;font-weight:900;letter-spacing:0;text-align:center}.button-row{display:grid;gap:10px;grid-template-columns:1fr;padding-top:8px}.button-row button[type=submit]{background:#116a4a;color:#fff;font-weight:850}.button-row .secondary{background:#eef1ea;color:#1d2622;font-weight:800}.peer-list{border:1px solid #d9ded3;border-radius:8px;display:grid;gap:0;overflow:hidden}.peer{align-items:center;display:flex;gap:12px;min-height:54px;padding:0 16px}.peer+.peer{border-top:1px solid #d9ded3}.peer-dot{background:#c7cec4;border-radius:50%;height:11px;width:11px}.peer-dot.active{background:#116a4a}.capture-panel,.voice-panel{border:1px solid #d9ded3;border-radius:8px;display:grid;gap:14px;padding:16px}.capture-panel-header,.voice-panel-header{align-items:flex-start;display:flex;gap:12px;justify-content:space-between}.capture-panel-title,.voice-panel-title{align-items:flex-start;display:flex;gap:10px}.capture-panel-title svg,.voice-panel-title svg{color:#116a4a;flex:0 0 auto;margin-top:2px}.capture-panel-title div,.voice-panel-title div{display:grid;gap:4px}.capture-panel-title strong,.voice-panel-title strong{font-size:15px;line-height:1.2}.capture-panel-title span,.voice-panel-title span{color:#66736c;font-size:13px;font-weight:700}.capture-badge,.voice-badge{border-radius:999px;font-size:12px;font-weight:850;line-height:1;padding:8px 10px;white-space:nowrap}.capture-badge{background:#e4f3ea;color:#116a4a}.capture-options{display:grid;gap:10px;grid-template-columns:repeat(3,minmax(0,1fr))}.capture-option{background:#eef1ea;color:#1d2622;font-weight:800;min-height:44px;padding:0 12px}.capture-option-active{background:#116a4a;color:#fff}.voice-badge-idle{background:#eef1ea;color:#526058}.voice-badge-ready{background:#e4f3ea;color:#116a4a}.voice-badge-muted{background:#fff1d8;color:#9a5a00}.voice-badge-blocked{background:#fde7e4;color:#b3261e}.capture-detail,.capture-copy,.voice-copy{color:#526058;font-size:14px;font-weight:650;line-height:1.5;margin:0}.capture-detail{font-size:13px;font-weight:700}.voice-toggle{width:100%}.trust-note{align-items:flex-start;background:#fff1d8;border-radius:8px;color:#614000;display:flex;font-size:14px;font-weight:750;gap:10px;line-height:1.45;padding:14px}.trust-note svg{flex:0 0 auto}@media(max-width:860px){.app-shell{grid-template-columns:1fr}.control-panel{border-left:0;border-top:1px solid #d9ded3}.topbar{align-items:flex-start;flex-direction:column;gap:14px;padding:20px}.stage{padding:22px}.phone-frame{max-height:620px;width:min(340px,88vw)}}