.landing{min-height:100%;background:var(--color-bg)}.landing-lang{position:absolute;top:1rem;right:1.5rem;z-index:2}.landing-hero{text-align:center;padding:4rem 2rem 5rem;position:relative;overflow:hidden}.landing-hero:before{content:"";position:absolute;top:-50%;left:50%;transform:translate(-50%);width:800px;height:800px;background:radial-gradient(circle,var(--color-primary-glow) 0%,transparent 60%);pointer-events:none}.landing-hero h1{font-size:2.75rem;font-weight:700;margin-bottom:.75rem;letter-spacing:-.02em;position:relative}.landing-hero h1 span{color:var(--color-primary)}.landing-hero p{color:var(--color-text-muted);font-size:1.1rem;max-width:480px;margin:0 auto;position:relative}.landing-features{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;max-width:900px;margin:2rem auto 3rem;padding:0 2rem}.landing-feature{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:1.75rem 1.5rem;text-align:center;transition:border-color var(--transition),transform var(--transition)}.landing-feature:hover{border-color:var(--color-primary);transform:translateY(-2px)}.landing-feature .icon{width:40px;height:40px;color:var(--color-primary);margin-bottom:1rem}.landing-feature h3{font-size:1rem;font-weight:600;margin-bottom:.4rem}.landing-feature p{font-size:.85rem;color:var(--color-text-muted);line-height:1.5}.landing-actions{max-width:480px;margin:0 auto;padding:0 2rem 3rem}.landing-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-xl);padding:2rem;box-shadow:var(--shadow-md)}.landing-card h2{font-size:1.15rem;font-weight:600;margin-bottom:.25rem}.landing-card>p{font-size:.85rem;color:var(--color-text-muted);margin-bottom:1.5rem}.landing-create{margin-bottom:1.25rem}.landing-create .row{display:flex;gap:.5rem;align-items:center}.landing-create .row .btn{flex:1}.landing-create select{background:var(--color-bg);color:var(--color-text);border:1px solid var(--color-border);border-radius:var(--radius);padding:.7rem .75rem;font-size:.9rem;font:inherit;cursor:pointer;min-width:80px}.landing-create select:focus{outline:none;border-color:var(--color-primary)}.landing-divider{display:flex;align-items:center;gap:1rem;margin:1.25rem 0;color:var(--color-text-muted);font-size:.8rem}.landing-divider:before,.landing-divider:after{content:"";flex:1;border-top:1px solid var(--color-border)}.landing-join{display:flex;gap:.5rem}.landing-join input{flex:1;background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius);padding:.7rem .75rem;font-size:.9rem;color:var(--color-text)}.landing-join input::placeholder{color:var(--color-text-muted);opacity:.6}.landing-join .btn{flex-shrink:0}.landing-error{color:var(--color-danger);font-size:.8rem;margin-top:.5rem}.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.7rem 1.25rem;border-radius:var(--radius);font-weight:500;font-size:.9rem;transition:all var(--transition-fast);white-space:nowrap}.btn-primary{background:var(--color-primary);color:#fff;box-shadow:0 0 0 0 var(--color-primary-glow)}.btn-primary:hover{background:var(--color-primary-hover);box-shadow:0 0 0 4px var(--color-primary-glow)}.btn-secondary{background:var(--color-surface-hover);color:var(--color-text);border:1px solid var(--color-border)}.btn-secondary:hover{background:var(--color-border);border-color:var(--color-text-muted)}.btn:disabled{opacity:.5;cursor:not-allowed}.landing-footer{text-align:center;padding:2rem;color:var(--color-text-muted);font-size:.78rem}*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}:root{--color-bg: #0a0a0f;--color-surface: #131318;--color-surface-hover: #1e1e28;--color-surface-raised: #1a1a24;--color-border: #222230;--color-primary: #6366f1;--color-primary-hover: #5558e6;--color-primary-glow: rgba(99, 102, 241, .15);--color-text: #e8e8ed;--color-text-muted: #8888a0;--color-danger: #ef4444;--color-success: #22c55e;--color-warning: #f59e0b;--radius: 8px;--radius-lg: 12px;--radius-xl: 16px;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .3);--shadow-md: 0 4px 12px rgba(0, 0, 0, .4);--shadow-lg: 0 8px 24px rgba(0, 0, 0, .5);--shadow-glow: 0 0 20px var(--color-primary-glow);--transition-fast: .15s ease;--transition: .2s ease}html,body,#root{height:100%}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,sans-serif;background:var(--color-bg);color:var(--color-text);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;line-height:1.5}button{cursor:pointer;font:inherit;border:none;transition:all var(--transition-fast)}button:active{transform:scale(.97)}input{font:inherit;color:inherit;transition:border-color var(--transition-fast)}input:focus{outline:none;border-color:var(--color-primary)}a{color:var(--color-primary);text-decoration:none}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes slideInRight{0%{transform:translate(100%)}to{transform:translate(0)}}@keyframes speakPulse{0%,to{box-shadow:inset 0 0 8px 2px #6366f14d}50%{box-shadow:inset 0 0 22px 6px #6366f1b3}}.speaking{animation:speakPulse .8s ease-in-out infinite}.floating-backdrop{position:absolute;top:0;right:0;bottom:0;left:0;background:#0006;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);z-index:15;animation:fadeIn .2s ease}.floating-panel{position:absolute;top:0;right:0;bottom:0;width:340px;background:var(--color-surface);z-index:20;animation:slideInRight .25s ease;box-shadow:var(--shadow-lg);display:flex;flex-direction:column}@media(max-width:768px){.home-card{padding:1.5rem;margin:1rem}.home-join{flex-direction:column}.video-grid{grid-template-columns:1fr!important;padding:.5rem;gap:.5rem}.video-tile{border-radius:var(--radius)}.landing-hero h1{font-size:2rem!important}.landing-features{grid-template-columns:1fr!important}.floating-panel{width:100%!important;max-width:340px}}@media(max-width:480px){.video-grid{grid-template-columns:1fr!important;padding:.25rem;gap:.35rem}.floating-panel{width:100%!important}}@media(max-height:600px){.video-grid{padding:.35rem!important;gap:.35rem!important}}@media(max-height:400px),(max-width:360px){.video-grid{padding:.2rem!important;gap:.2rem!important}}