*,:before,:after{box-sizing:border-box;margin:0;padding:0}:root{--bg:#0a0a0a;--surface:#1a1a1a;--border:#2a2a2a;--text:#fff;--text-muted:#888;--accent:#fff;-webkit-font-smoothing:antialiased;font-family:system-ui,-apple-system,sans-serif}body{background:var(--bg);color:var(--text);min-height:100dvh}#root{width:100%;min-height:100dvh}.screen{width:100%;min-height:100dvh;position:relative;overflow:hidden}.screen.center{flex-direction:column;justify-content:center;align-items:center;gap:16px;padding:32px;display:flex}.logo{letter-spacing:-2px;color:var(--text);font-size:48px;font-weight:700}.subtitle{color:var(--text-muted);margin-bottom:8px;font-size:16px}.error-msg{color:#ff6b6b;text-align:center;max-width:280px;font-size:14px}.built-by{color:var(--text-muted);text-underline-offset:3px;font-size:13px;text-decoration:underline;transition:color .15s;position:absolute;bottom:32px}.built-by:hover{color:var(--text)}.btn-primary{color:#000;cursor:pointer;background:#fff;border:none;border-radius:100px;padding:16px 40px;font-size:17px;font-weight:600;transition:opacity .15s}.btn-primary:disabled{opacity:.5;cursor:not-allowed}.btn-primary:hover:not(:disabled){opacity:.85}.shoot-screen{background:#000;flex-direction:column;display:flex}.top-bar{z-index:10;padding:16px 20px;padding-top:calc(16px + env(safe-area-inset-top));background:linear-gradient(#0009,#0000);justify-content:space-between;align-items:center;display:flex;position:absolute;top:0;left:0;right:0}.viewers-badge{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:#fff;background:#ffffff26;border:1px solid #fff3;border-radius:100px;padding:6px 14px;font-size:13px}.btn-copy{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:#fff;cursor:pointer;background:#ffffff26;border:1px solid #fff3;border-radius:100px;padding:6px 16px;font-size:13px;font-weight:500;transition:background .15s}.btn-copy:hover{background:#ffffff40}.btn-end{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:#ff6b6b;cursor:pointer;background:#ff3c3c40;border:1px solid #ff3c3c66;border-radius:100px;padding:6px 16px;font-size:13px;font-weight:500;transition:background .15s}.btn-end:hover{background:#ff3c3c66}.camera-feed{object-fit:cover;width:100%;height:100dvh}.bottom-bar{z-index:10;padding:32px;padding-bottom:calc(32px + env(safe-area-inset-bottom));background:linear-gradient(#0000,#0009);justify-content:center;display:flex;position:absolute;bottom:0;left:0;right:0}.btn-capture{cursor:pointer;background:#fff;border:4px solid #fff6;border-radius:50%;width:72px;height:72px;transition:transform .1s,opacity .1s;box-shadow:0 0 0 3px #ffffff4d}.btn-capture:active{transform:scale(.92)}.btn-capture:disabled{opacity:.4;cursor:not-allowed}.flash-overlay{z-index:20;pointer-events:none;background:#fff;animation:.15s ease-out forwards flash;position:absolute;inset:0}@keyframes flash{0%{opacity:1}to{opacity:0}}.view-screen{background:#000;justify-content:center;align-items:center;display:flex}.photo-view{object-fit:contain;width:100%;height:100dvh}.waiting{color:var(--text-muted);flex-direction:column;align-items:center;gap:16px;display:flex}.pulse-dot{background:#fff;border-radius:50%;width:12px;height:12px;animation:1.5s ease-in-out infinite pulse}@keyframes pulse{0%,to{opacity:.3;transform:scale(1)}50%{opacity:1;transform:scale(1.3)}}
