@font-face{font-family:Space Grotesk;font-style:normal;font-weight:400 700;font-display:swap;src:url(/fonts/SpaceGrotesk-Variable.woff2) format("woff2")}:root{--bg: #050308;--bg-void: #020106;--surface: #0d0a18;--surface-hover: #151027;--line: #211a37;--line-strong: #322a52;--fg: #f2eefc;--muted: #948dbd;--muted-2: #5d5580;--violet-50: #f2d6ff;--violet-300: #b586ff;--violet-400: #9659f8;--violet-500: #7238f5;--violet-600: #5d25d4;--violet-700: #401590;--violet-900: #1f0a4a;--beam-gradient: linear-gradient(115deg, var(--violet-400), var(--violet-500) 55%, var(--violet-600));--beam-gradient-soft: linear-gradient(90deg, var(--violet-50), var(--violet-400) 30%, transparent 85%);--error: #ff5470;--radius-sm: 8px;--radius-md: 12px;--radius-lg: 20px;--ease-out-expo: cubic-bezier(.16, 1, .3, 1);--ease-spring: cubic-bezier(.34, 1.56, .64, 1);--font-display: "Space Grotesk", "Segoe UI", system-ui, sans-serif;--font-body: -apple-system, "Segoe UI", system-ui, sans-serif;--font-mono: ui-monospace, "Cascadia Code", "SF Mono", Consolas, monospace}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}}@keyframes reveal{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes beam-pulse-ring{0%{box-shadow:0 0 #9659f88c}70%{box-shadow:0 0 0 9px #9659f800}to{box-shadow:0 0 #9659f800}}@keyframes land-in{0%{opacity:0;transform:translateY(-14px) scale(.94)}55%{opacity:1;transform:translateY(2px) scale(1.015)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes landed-flash{0%{box-shadow:inset 0 0 0 1px var(--violet-50),0 0 22px -4px var(--violet-400);border-color:var(--violet-300)}to{box-shadow:inset 0 0 0 1px transparent,0 0 0 0 transparent;border-color:var(--line)}}@keyframes sweep{0%{transform:translate(-160%) skew(-14deg)}to{transform:translate(260%) skew(-14deg)}}@keyframes photon-travel{0%{left:-4%;opacity:0}12%{opacity:1}88%{opacity:1}to{left:104%;opacity:0}}@keyframes scanline{0%{transform:translateY(-100%);opacity:0}12%{opacity:1}88%{opacity:1}to{transform:translateY(100%);opacity:0}}@keyframes wave-breathe{0%,to{transform:scaleY(1)}50%{transform:scaleY(.92)}}*{box-sizing:border-box}body{position:relative;font-family:var(--font-body);max-width:440px;margin:0 auto;padding:16px 18px 20px;background:var(--bg);color:var(--fg);overflow-x:hidden;isolation:isolate}@media (max-width: 400px){body{padding:12px 14px 16px}}body:before{content:"";position:fixed;inset:-10% -30% auto auto;width:640px;height:640px;background:url(/beam-logo.jpg) center / cover no-repeat;opacity:.16;mask-image:radial-gradient(circle at 70% 30%,black 0%,transparent 68%);-webkit-mask-image:radial-gradient(circle at 70% 30%,black 0%,transparent 68%);pointer-events:none;z-index:-2}body:after{content:"";position:fixed;top:0;right:0;bottom:0;left:0;background-image:radial-gradient(circle at 1px 1px,rgba(242,238,252,.05) 1px,transparent 0);background-size:26px 26px;pointer-events:none;z-index:-1}.app-header{display:flex;align-items:center;justify-content:space-between;margin:0 0 4px}.brand{display:flex;align-items:center;gap:8px}.brand-mark{width:26px;height:26px;border-radius:7px;display:block;filter:drop-shadow(0 0 10px rgba(114,56,245,.55))}h1{font-family:var(--font-display);font-size:16px;font-weight:700;letter-spacing:.01em;margin:0}.header-actions{display:flex;align-items:center;gap:10px}.tagline{font-size:12.5px;color:var(--muted);margin:0 0 30px;line-height:1.5}#install-btn{display:none;width:auto;margin:0;padding:6px 11px;font-size:11px}.signal{display:inline-flex;align-items:center;color:var(--muted-2)}.signal-bars .bar{stroke:currentColor;transition:stroke .25s ease,opacity .25s ease}.signal.connected{color:var(--violet-400)}.signal.connecting .bar-2,.signal.connecting .bar-3{opacity:.3}.signal.connecting .bar-1{animation:signal-blink 1s ease-in-out infinite}.signal.disconnected{color:var(--error)}.signal.disconnected .bar-2,.signal.disconnected .bar-3{opacity:.25}@keyframes signal-blink{0%,to{opacity:1}50%{opacity:.35}}section{margin-bottom:16px}.section-title{font-family:var(--font-mono);font-size:10.5px;color:var(--muted);text-transform:uppercase;letter-spacing:.1em;margin:0 0 10px}label{display:block;font-size:12.5px;color:var(--muted);margin-top:10px}label:first-of-type{margin-top:0}input,select{font-family:var(--font-body);font-size:14px;padding:8px 0;width:100%;box-sizing:border-box;margin-top:5px;background:transparent;border:none;border-bottom:1px solid var(--line);color:var(--fg);transition:border-color .2s ease}input:focus,select:focus{outline:none;border-bottom-color:var(--violet-400)}input::placeholder{color:var(--muted-2)}select option{background:var(--surface);color:var(--fg)}button{font-family:var(--font-body);font-size:13px;padding:9px 12px;width:100%;background:transparent;color:var(--fg);border:1px solid var(--line);border-radius:var(--radius-sm);margin-top:10px;cursor:pointer;font-weight:600;transition:border-color .18s ease,color .18s ease,background .18s ease,transform .12s ease}button:hover{border-color:var(--line-strong);color:var(--fg);background:var(--surface-hover)}button:active{transform:scale(.98)}button:disabled{opacity:.45;cursor:default;transform:none}button:focus-visible{outline:2px solid var(--violet-400);outline-offset:2px}button.primary{position:relative;overflow:hidden;background:var(--beam-gradient);border-color:transparent;color:#fff;box-shadow:0 6px 20px -8px #7238f5a6}button.primary:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(120deg,transparent 30%,rgba(255,255,255,.5) 50%,transparent 70%);transform:translate(-160%) skew(-14deg);pointer-events:none}button.primary:hover:after{animation:sweep .9s var(--ease-out-expo)}button.primary:hover{border-color:transparent;background:var(--beam-gradient)}button.primary.sending{pointer-events:none}button.primary.sending:after{animation:sweep 1.1s var(--ease-out-expo) infinite}button.link{border:none;width:auto;padding:7px 2px;margin:8px -2px 0;color:var(--muted);font-size:12px;border-radius:4px}button.link:hover{color:var(--fg);background:none}.divider{display:flex;align-items:center;color:var(--muted-2);font-size:11px;margin:14px 0;gap:10px}.divider:before,.divider:after{content:"";flex:1;height:1px;background:var(--line)}#status{min-height:18px;color:var(--muted);font-size:12px;text-align:center;margin-top:12px;transition:color .2s ease}#status.success{color:var(--violet-300)}#status.error{color:var(--error)}#session-banner{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}#session-timer{font-family:var(--font-mono);font-size:11.5px;letter-spacing:.04em;color:var(--violet-300)}#repair-link{font-size:11px;color:var(--muted);cursor:pointer}#repair-link:hover{color:var(--fg)}.waiting-text{font-size:12px;color:var(--muted);text-align:center;margin:4px 0 0}#ended-section{text-align:center}.ended-text{font-size:12.5px;color:var(--muted);line-height:1.5;margin:0 0 4px}#version-footer{text-align:center;font-family:var(--font-mono);font-size:10px;color:var(--muted-2);margin-top:14px;letter-spacing:.04em}.scan-frame{position:relative;width:168px;height:168px;margin:0 auto;padding:8px;border-radius:var(--radius-md)}@media (max-width: 400px){.scan-frame{width:148px;height:148px}}.scan-frame .corner{position:absolute;width:18px;height:18px;border-color:var(--line-strong);transition:border-color .3s var(--ease-out-expo)}.scan-frame .corner.tl{top:0;left:0;border-top:2px solid;border-left:2px solid;border-radius:8px 0 0}.scan-frame .corner.tr{top:0;right:0;border-top:2px solid;border-right:2px solid;border-radius:0 8px 0 0}.scan-frame .corner.bl{bottom:0;left:0;border-bottom:2px solid;border-left:2px solid;border-radius:0 0 0 8px}.scan-frame .corner.br{bottom:0;right:0;border-bottom:2px solid;border-right:2px solid;border-radius:0 0 8px}.scan-frame.active .corner{border-color:var(--violet-500)}.scan-frame.locked .corner{border-color:var(--violet-300)}.scan-frame .scanline{position:absolute;left:8px;right:8px;height:2px;background:linear-gradient(90deg,transparent,var(--violet-400),transparent);animation:scanline 2.4s ease-in-out infinite;opacity:.85;pointer-events:none}.scan-frame.locked .scanline{display:none}.scan-frame img.qr{position:relative;z-index:1;width:100%;height:100%;border-radius:10px;opacity:0;transition:opacity .35s ease}.scan-frame img.qr.loaded{opacity:1}.scan-frame video{position:relative;z-index:1;width:100%;height:100%;object-fit:cover;border-radius:10px;background:#000}#invite-section{text-align:center}#invite-code{font-family:var(--font-mono);font-size:24px;font-weight:600;letter-spacing:.14em;margin:10px 0 2px;padding-left:.14em;color:var(--fg)}#received-list{display:flex;flex-direction:column;gap:10px}#received-empty{color:var(--muted);font-size:12px}.item-row{position:relative;border:1px solid var(--line);border-radius:var(--radius-sm);padding:11px 13px;font-size:13px;background:var(--surface)}.item-row.land-in{animation:land-in .5s var(--ease-spring) both,landed-flash 1.1s ease-out .15s both}.item-row .meta{font-size:11px;color:var(--muted);margin-top:6px;font-family:var(--font-mono)}.item-row a{color:var(--violet-300);word-break:break-all;text-decoration:none}.item-row a:hover{text-decoration:underline}.item-row img{max-width:100%;display:block;margin-top:8px;border-radius:6px;border:1px solid var(--line)}.item-content-row{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}.item-content-row a,.item-content-row span{flex:1;min-width:0}.icon-btn{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:26px;height:26px;padding:0;border:1px solid var(--line);border-radius:var(--radius-sm);background:transparent;color:var(--muted);cursor:pointer;transition:border-color .18s ease,color .18s ease,background .18s ease}.icon-btn svg{width:14px;height:14px}.icon-btn:hover{border-color:var(--line-strong);color:var(--fg);background:var(--surface-hover)}.icon-btn.copied{border-color:var(--violet-400);color:var(--violet-300)}.item-row .download-btn{margin-top:8px}#tab-nav{position:relative;display:flex;gap:4px;margin-bottom:16px;border-bottom:1px solid var(--line)}.tab-btn{flex:1;width:auto;margin:0;padding:9px 4px;background:none;border:none;border-radius:0;color:var(--muted);font-size:12px;font-weight:600}.tab-btn:hover{color:var(--fg);background:none}.tab-btn.active{color:var(--fg)}.tab-indicator{position:absolute;bottom:-1px;height:2px;background:var(--beam-gradient);border-radius:2px;transition:left .32s var(--ease-out-expo),width .32s var(--ease-out-expo);box-shadow:0 0 10px -1px var(--violet-500)}.start-links{display:flex;justify-content:center;gap:8px;margin:10px 0 0}.start-links-sep{color:var(--line);font-size:11px}.toggle-link{background:none;border:none;color:var(--muted);font-size:11px;cursor:pointer;padding:0;text-decoration:underline;width:auto}.toggle-link:hover{background:none;color:var(--fg)}.connect-btn{width:100%;padding:14px 0;font-size:15px;font-weight:700;font-family:var(--font-display);letter-spacing:.01em}.text-toggle-box{display:block;width:100%;margin:4px 0 8px;padding:10px;background:var(--surface);border:1px dashed var(--line-strong);border-radius:var(--radius-sm);color:var(--muted);font-size:13px;font-weight:600;text-align:center;cursor:pointer;transition:border-color .2s ease,color .2s ease,background .2s ease}.text-toggle-box:hover{border-color:var(--violet-500);color:var(--fg);background:var(--surface-hover)}.pair-success-overlay{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;background:#050308e0;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);opacity:0;pointer-events:none;z-index:50;transition:opacity .25s ease}.pair-success-overlay.visible{opacity:1}.pair-success-overlay p{font-family:var(--font-display);font-size:20px;font-weight:700;color:var(--fg);margin:0}.pair-success-badge{width:76px;height:76px;border-radius:50%;background:var(--beam-gradient);display:flex;align-items:center;justify-content:center;color:#fff;box-shadow:0 0 #7238f58c;transform:scale(.4);opacity:0}.pair-success-overlay.visible .pair-success-badge{animation:pair-badge-pop .5s var(--ease-spring) forwards,pair-badge-ring 1s ease-out .1s}.pair-success-badge svg{width:34px;height:34px}@keyframes pair-badge-pop{0%{transform:scale(.4);opacity:0}60%{transform:scale(1.12);opacity:1}to{transform:scale(1);opacity:1}}@keyframes pair-badge-ring{0%{box-shadow:0 0 #7238f58c}to{box-shadow:0 0 0 22px #7238f500}}.hint-text{font-size:12px;color:var(--muted);text-align:center;margin:0 0 10px;line-height:1.5}.drop-zone{position:relative;border:2px dashed var(--line);border-radius:var(--radius-md);padding:18px 14px;text-align:center;cursor:pointer;margin-bottom:8px;transition:border-color .2s ease,background .2s ease}.drop-zone:hover,.drop-zone.drag-active{border-color:var(--violet-500);background:#7238f50f}.drop-zone:focus-visible{outline:2px solid var(--violet-400);outline-offset:2px}#drop-zone-empty{display:flex;flex-direction:column;align-items:center;gap:8px}#drop-zone-empty svg{width:28px;height:28px;color:var(--muted)}#drop-zone-empty p{font-size:12.5px;color:var(--muted);margin:0;line-height:1.5;max-width:220px}#drop-zone-preview img{max-width:100%;max-height:220px;border-radius:var(--radius-sm);display:block;margin:0 auto 8px}