*{margin:0;padding:0;box-sizing:border-box}:root{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;line-height:1.5;font-weight:400;--bg-dark: #000000;--bg-secondary: #121212;--text-primary: #ffffff;--text-secondary: #a8a8a8;--accent: #e4405f;--accent-hover: #d13450;--border: #262626;--error: #ed4956;--success: #4CAF50}body{margin:0;background:var(--bg-dark);color:var(--text-primary);min-height:100vh;display:flex;align-items:center;justify-content:center;padding:1rem}#app{width:100%;max-width:600px;margin:0 auto}.container{padding:2rem;text-align:center}.header{margin-bottom:3rem}.header h1{font-size:2.5rem;font-weight:700;margin-bottom:.5rem;letter-spacing:-.02em}.header p{color:var(--text-secondary);font-size:1rem}.input-section{background:var(--bg-secondary);border:1px solid var(--border);border-radius:16px;padding:2rem;margin-bottom:2rem}.input-wrapper{position:relative;margin-bottom:1.5rem}#url-input{width:100%;padding:1rem 1.25rem;font-size:1rem;background:var(--bg-dark);border:2px solid var(--border);border-radius:12px;color:var(--text-primary);outline:none;transition:border-color .2s;font-family:inherit}#url-input:focus{border-color:var(--accent)}#url-input::placeholder{color:var(--text-secondary)}#preview-btn{width:100%;padding:1rem 2rem;font-size:1rem;font-weight:600;background:var(--accent);border:none;border-radius:12px;color:var(--text-primary);cursor:pointer;transition:all .2s;font-family:inherit}#preview-btn:hover:not(:disabled){background:var(--accent-hover);transform:translateY(-1px)}#preview-btn:disabled{opacity:.5;cursor:not-allowed}.spinner{display:inline-block;width:16px;height:16px;border:2px solid rgba(255,255,255,.3);border-radius:50%;border-top-color:var(--text-primary);animation:spin .8s linear infinite;margin-right:.5rem;vertical-align:middle}@keyframes spin{to{transform:rotate(360deg)}}.message{padding:1rem;border-radius:12px;margin-bottom:1.5rem;font-size:.9rem;display:none}.message.show{display:block}.message.error{background:#ed49561a;border:1px solid var(--error);color:var(--error)}.message.success{background:#4caf501a;border:1px solid var(--success);color:var(--success)}#video-container{background:var(--bg-secondary);border:1px solid var(--border);border-radius:16px;padding:1rem;display:none;overflow:hidden}#video-container.show{display:block}#video-player{width:100%;border-radius:8px;background:#000;max-height:70vh}.embed-container{width:100%;max-width:540px;margin:0 auto;border-radius:8px;overflow:hidden}.embed-container iframe{width:100%;border:none;border-radius:8px}@media(max-width:768px){.container{padding:1rem}.header h1{font-size:2rem}.input-section{padding:1.5rem}#url-input{font-size:.95rem}}