:root{font-family:Outfit,Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:dark;color:rgba(255,255,255,.87);background-color:#0a0a0c;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0;display:flex;place-content:center;min-width:320px;min-height:100vh;overflow:hidden}#root{width:100%;height:100%}.app-container{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100vh;width:100vw;position:relative;background:radial-gradient(circle at top right,#1a1a2e,#0a0a0c)}.glass-panel{background:rgba(255,255,255,.05);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.1);border-radius:24px;box-shadow:0 8px 32px 0 rgba(0,0,0,.37)}.video-container{position:relative;width:100%;max-width:800px;aspect-ratio:4/3;overflow:hidden;border-radius:24px;box-shadow:0 20px 50px rgba(0,0,0,.5)}video{width:100%;height:100%;object-fit:cover;transform:scaleX(-1)}canvas{position:absolute;top:0;left:0;width:100%;height:100%;z-index:10}.controls{position:absolute;bottom:40px;display:flex;gap:16px;padding:16px;z-index:20;max-width:100vw;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}.controls::-webkit-scrollbar{display:none}.cap-btn{width:60px;height:60px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:.3s cubic-bezier(.4,0,.2,1);background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.1);border-radius:16px;overflow:hidden;flex-shrink:0}.cap-btn:hover{transform:translateY(-5px) scale(1.05);background:rgba(255,255,255,.2);border-color:rgba(255,255,255,.3)}.cap-btn.active{background:rgba(255,255,255,.3);border-color:#646cff;box-shadow:0 0 15px rgba(100,108,255,.5)}.cap-btn img{width:80%;height:80%;object-fit:contain}.header{position:absolute;top:40px;text-align:center;z-index:20}.header h1{margin:0;font-size:2rem;font-weight:700;letter-spacing:-1px;background:linear-gradient(135deg,#fff 0,#aaa 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.header p{margin:8px 0 0;font-size:.9rem;color:rgba(255,255,255,.5)}.status-badge{position:absolute;top:24px;right:24px;padding:8px 16px;border-radius:100px;font-size:.8rem;font-weight:600;display:flex;align-items:center;gap:8px;z-index:20}.status-badge.connected{background:rgba(34,197,94,.1);color:#4ade80;border:1px solid rgba(34,197,94,.2)}.status-badge.disconnected{background:rgba(239,68,68,.1);color:#f87171;border:1px solid rgba(239,68,68,.2)}.pulse{width:8px;height:8px;border-radius:50%;background:currentColor;animation:2s infinite pulse}@keyframes pulse{0%,100%{transform:scale(.95);opacity:.5}50%{transform:scale(1.1);opacity:1}}@media (max-width:768px){body{overflow-y:auto}.app-container{justify-content:flex-start;height:auto;min-height:100vh;padding-bottom:20px}.header{position:relative;top:0;margin-top:20px;margin-bottom:15px}.status-badge{position:relative;top:0;right:0;align-self:center;margin-bottom:20px}.video-container{width:95%}.controls{position:relative;bottom:auto;margin-top:20px;justify-content:flex-start;padding:16px 20px}.capture-btn{flex-shrink:0}}