:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:#e5e7eb;background:#090d18;font-synthesis:none}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh}button,input{font:inherit}button{cursor:pointer}body:before{position:fixed;inset:0;content:"";pointer-events:none;background:radial-gradient(circle at 18% 15%,rgba(37,99,235,.17),transparent 32rem),radial-gradient(circle at 80% 75%,rgba(14,165,233,.1),transparent 30rem)}.app-shell{position:relative;display:grid;place-content:center;min-height:100vh;padding:32px 18px}.card{width:min(760px,calc(100vw - 36px));padding:34px;border:1px solid rgba(148,163,184,.15);border-radius:24px;background:#111827db;box-shadow:0 28px 80px #00000061;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}.brand{display:flex;align-items:center;gap:15px;margin-bottom:32px}.brand-icon{display:grid;place-items:center;width:48px;height:48px;border-radius:15px;color:#fff;background:linear-gradient(145deg,#3b82f6,#1d4ed8);box-shadow:0 10px 26px #2563eb4d}.brand h1{margin:0 0 3px;font-size:clamp(1.55rem,4vw,2rem);letter-spacing:-.04em}.brand p{margin:0;color:#94a3b8;font-size:.94rem}.mode-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.mode-card{display:flex;flex-direction:column;align-items:flex-start;min-height:178px;padding:24px;border:1px solid #293449;border-radius:18px;color:#e5e7eb;text-align:left;background:#151d2d;transition:transform .18s ease,border-color .18s ease,background .18s ease}.mode-card:hover{transform:translateY(-2px);border-color:#4b6389;background:#182235}.mode-card-primary{border-color:#3b82f6a6;background:linear-gradient(145deg,#172b4c,#15233b)}.mode-icon{margin-bottom:30px;color:#60a5fa;font-size:1.75rem;line-height:1}.mode-card strong{margin-bottom:7px;font-size:1.06rem}.mode-card small{color:#94a3b8;line-height:1.45}.workspace{display:grid;gap:18px}.key-panel{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:18px 20px;border:1px solid #293449;border-radius:16px;background:#121a29}.eyebrow{display:block;margin-bottom:5px;color:#94a3b8;font-size:.75rem;text-transform:uppercase;letter-spacing:.08em}.room-key{color:#60a5fa;font-size:1.7rem;letter-spacing:.28em}.button{padding:11px 17px;border:1px solid transparent;border-radius:11px;color:#fff;white-space:nowrap}.button-primary{background:#2563eb}.button-primary:hover{background:#1d4ed8}.button-quiet{border-color:#334155;background:#1e293b}.button-quiet:hover{background:#29364a}.join-form{display:grid;gap:9px}.join-form label{color:#cbd5e1;font-size:.86rem;font-weight:600}.join-row{display:flex;gap:10px}.join-row input{min-width:0;flex:1;padding:13px 16px;border:1px solid #334155;border-radius:11px;outline:none;color:#f8fafc;background:#0f172a;font-size:1.1rem;letter-spacing:.22em}.join-row input:focus{border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f629}.status{display:flex;align-items:center;gap:9px;color:#94a3b8;font-size:.88rem}.status-dot{width:8px;height:8px;flex:0 0 auto;border-radius:50%;background:#f59e0b;box-shadow:0 0 0 4px #f59e0b1a}.status-online .status-dot{background:#22c55e;box-shadow:0 0 0 4px #22c55e1a}.recording-panel{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 16px;border:1px solid #293449;border-radius:14px;background:#121a29}.recording-panel strong,.recording-panel small{display:block}.recording-panel small{margin-top:5px;color:#94a3b8;line-height:1.4}.recording-dot{display:inline-block;width:9px;height:9px;margin-right:8px;border-radius:50%;background:#64748b}.recording-live{color:#fca5a5}.recording-live .recording-dot{background:#ef4444;box-shadow:0 0 0 5px #ef44441f;animation:pulse 1.4s infinite}.button-danger{background:#b91c1c}.button-danger:hover{background:#991b1b}.download-button{display:block;padding:12px 16px;border:1px solid rgba(34,197,94,.45);border-radius:12px;color:#bbf7d0;text-align:center;text-decoration:none;background:#1665342e}.download-button:hover{border-color:#22c55e;background:#16653447}@keyframes pulse{50%{opacity:.45}}video{width:100%;min-height:260px;max-height:520px;border-radius:16px;background:#030712;object-fit:contain}.back-button{margin-top:22px;padding:8px 0;border:0;color:#94a3b8;background:transparent}.back-button:hover{color:#e5e7eb}.privacy-note{margin:18px 0 0;color:#64748b;text-align:center;font-size:.78rem}@media(max-width:600px){.app-shell{padding:16px 12px}.card{width:calc(100vw - 24px);padding:22px;border-radius:20px}.mode-grid{grid-template-columns:1fr}.mode-card{min-height:145px}.mode-icon{margin-bottom:22px}.join-row{flex-direction:column}.join-row .button{width:100%}.key-panel,.recording-panel{align-items:flex-start;flex-direction:column}.recording-panel .button{width:100%}video{min-height:210px}}