*{box-sizing:border-box}body,html{margin:0;padding:0;overflow-x:hidden;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}h1,h2,h3,h4,h5,h6{text-wrap:balance}p{text-wrap:pretty}.btn,[role=button],button{transition:all .15s ease-out;cursor:pointer}[role=button]:hover:not(:disabled),button:hover:not(:disabled){filter:brightness(1.08)}[role=button]:active:not(:disabled),button:active:not(:disabled){transform:scale(.98)}button:disabled{cursor:not-allowed;opacity:.6}[tabindex]:focus-visible,a:focus-visible,button:focus-visible,input:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(111,168,220,.4)}a{transition:opacity .15s ease-out}a:hover{opacity:.85}.shadow-card{box-shadow:0 1px 2px rgba(0,0,0,.03),0 4px 8px rgba(0,0,0,.04),0 8px 16px rgba(0,0,0,.03)}.shadow-elevated{box-shadow:0 2px 4px rgba(0,0,0,.04),0 8px 16px rgba(0,0,0,.08),0 16px 32px rgba(0,0,0,.06)}.border-soft{box-shadow:0 0 0 1px rgba(0,0,0,.08)}@keyframes pulse{0%,to{opacity:1}50%{opacity:.4}}.pulse{animation:pulse 1.5s ease-in-out infinite}@keyframes fadeIn{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}.fade-in{animation:fadeIn .2s ease-out}@keyframes dots{0%,20%{content:"."}40%{content:".."}60%,to{content:"..."}}.loading-dots:after{content:"";animation:dots 1.2s step-end infinite}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.skeleton{background:linear-gradient(90deg,#e8e8e8 25%,#f0f0f0 50%,#e8e8e8 75%);background-size:200% 100%;animation:shimmer 1.5s ease-in-out infinite}@keyframes connected-pulse{0%,to{box-shadow:0 0 0 0 rgba(76,175,80,.4)}50%{box-shadow:0 0 0 6px rgba(76,175,80,0)}}.connected-indicator{animation:connected-pulse 2s ease-in-out infinite}.gate-overlay{backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}.gate-modal{box-shadow:0 4px 8px rgba(0,0,0,.08),0 16px 32px rgba(0,0,0,.12),0 32px 64px rgba(0,0,0,.08)}.card{background:#fff;border-radius:12px;box-shadow:0 1px 2px rgba(0,0,0,.03),0 4px 8px rgba(0,0,0,.04),0 8px 16px rgba(0,0,0,.03);transition:box-shadow .15s ease-out}.card:hover{box-shadow:0 2px 4px rgba(0,0,0,.04),0 8px 16px rgba(0,0,0,.06),0 12px 24px rgba(0,0,0,.04)}.video-frame-modern{background:linear-gradient(145deg,#0a0a0a,#1a1a1a);border-radius:4px;overflow:hidden}.btn-primary{background:linear-gradient(180deg,#52c95a,#4caf50);box-shadow:0 1px 2px rgba(0,0,0,.1),0 2px 4px rgba(76,175,80,.2),inset 0 1px 0 rgba(255,255,255,.15)}.btn-primary:hover:not(:disabled){background:linear-gradient(180deg,#5dd465,#52c95a);filter:none}.btn-secondary{background:linear-gradient(180deg,#4ba3f5,#2196f3);box-shadow:0 1px 2px rgba(0,0,0,.1),0 2px 4px rgba(33,150,243,.2),inset 0 1px 0 rgba(255,255,255,.15)}.btn-secondary:hover:not(:disabled){background:linear-gradient(180deg,#64b5f6,#4ba3f5);filter:none}.btn-danger{background:linear-gradient(180deg,#f55a5a,#f44336);box-shadow:0 1px 2px rgba(0,0,0,.1),0 2px 4px rgba(244,67,54,.2),inset 0 1px 0 rgba(255,255,255,.15)}.btn-danger:hover:not(:disabled){background:linear-gradient(180deg,#ff6b6b,#f55a5a);filter:none}.code-block{background:linear-gradient(180deg,#1e1e1e,#252525);border-radius:8px;border:1px solid rgba(255,255,255,.06)}.code-block code{color:#4ec9b0;font-family:SF Mono,Fira Code,Monaco,monospace;font-size:13px}.status-connected{color:#4caf50;font-weight:600}.status-searching{color:#ff9800;font-weight:500}.status-idle{color:#9e9e9e}.chat-container{background:#fff;border-radius:8px;box-shadow:0 0 0 1px rgba(0,0,0,.08);overflow:hidden}.chat-message{transition:background .15s ease-out}.chat-message:hover{background:rgba(0,0,0,.02)}.msg-you{color:#1976d2;font-weight:600}.msg-stranger{color:#d32f2f;font-weight:600}.msg-system{color:#757575;font-style:italic}.msg-timestamp{color:#9e9e9e;font-size:11px;font-feature-settings:"tnum";font-variant-numeric:tabular-nums}.header-modern{background:linear-gradient(180deg,#7bb8e8,#6fa8dc);box-shadow:0 2px 8px rgba(0,0,0,.1)}.logo-text{text-shadow:1px 1px 0 rgba(0,0,0,.15),2px 2px 4px rgba(0,0,0,.1)}.live-btn{background:linear-gradient(180deg,#f04a6a,#e94560);box-shadow:0 1px 2px rgba(0,0,0,.15),0 0 12px rgba(233,69,96,.3);transition:all .15s ease-out}.live-btn:hover{box-shadow:0 2px 4px rgba(0,0,0,.2),0 0 16px rgba(233,69,96,.4)}.footer-modern{background:linear-gradient(180deg,#d8d8d8,#d0d0d0)}.stats-number{font-feature-settings:"tnum";font-variant-numeric:tabular-nums;font-weight:700;background:linear-gradient(180deg,#6fa8dc,#5a8fc4);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}@media (max-width:768px){.header{flex-direction:column!important;gap:8px!important;padding:10px 12px!important;text-align:center}.header-right{margin-left:0!important;width:100%;justify-content:center!important;flex-wrap:wrap;gap:8px!important}.logo{font-size:24px!important}.tagline{font-size:13px!important}.stats-bar{flex-direction:column!important;gap:15px!important;padding:15px 12px!important}.stat-divider{display:none!important}.hero-title,.stat-number{font-size:24px!important}.hero-title{line-height:1.2!important}.hero-subtitle{font-size:14px!important}.landing{padding:20px 12px!important}.code-box{flex-direction:column!important;gap:8px!important;align-items:stretch!important;padding:10px!important}.code-text{font-size:11px!important;word-break:break-all!important;overflow-x:auto!important;white-space:nowrap!important}.copy-btn{margin-left:0!important;width:100%!important}.steps{grid-template-columns:1fr!important;gap:10px!important}.video-section{flex-direction:column!important;gap:8px!important}.video-frame{aspect-ratio:16/9!important;min-height:100px!important}.lobster-emoji{font-size:36px!important}.chat-log{height:200px!important;font-size:13px!important;padding:10px!important}.controls{flex-direction:row!important;flex-wrap:wrap!important;gap:8px!important;padding:0 5px!important}.next-btn,.start-btn,.stop-btn{flex:1 1!important;min-width:100px!important;padding:12px 15px!important;font-size:14px!important}.method-card{padding:12px!important}.method-header{align-items:flex-start!important;gap:6px!important}.method-header,.return-bar{flex-direction:column!important}.return-bar{gap:10px!important;text-align:center;padding:10px!important}.return-btn{width:100%!important}.footer{padding:12px 8px!important;font-size:10px!important;line-height:1.4!important}.live-main,.main,[style*="maxWidth: '800px'"]{padding:10px!important}.live-main{flex-direction:column!important;gap:10px!important}.live-sidebar{width:100%!important;max-height:180px!important;overflow-y:auto!important;border-right:none!important;border-bottom:1px solid #999!important}.live-chat-area{min-height:350px!important}.session-card{padding:8px 10px!important}.session-agents{flex-wrap:wrap!important;gap:4px!important}}@media (max-width:400px){.hero-title,.logo,.stat-number{font-size:20px!important}.code-text,.method-badge{font-size:10px!important}.chat-log{height:180px!important;font-size:12px!important}.video-frame{min-height:80px!important}.lobster-emoji{font-size:28px!important}}@media (prefers-reduced-motion:reduce){*,:after,:before{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}