:root{--color-bg: #121212;--color-surface: #1e1e1e;--color-primary: #bb86fc;--color-secondary: #03dac6;--color-text: #ffffff;--color-muted: #888;--border-radius: 12px;--padding: 1.5rem;--transition: all .3s ease;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;line-height:1.6;font-weight:400;background-color:var(--color-bg);color:var(--color-text)}body{margin:0;min-height:100vh;display:flex;place-items:center;background-color:var(--color-bg)}#root{display:flex;flex-direction:column;justify-content:center;align-items:center;padding:var(--padding);width:100%;max-width:600px;margin:auto;text-align:center}h1,h2,h3,h4{margin:.5em 0;color:var(--color-primary)}p{margin:.5em 0;color:var(--color-text)}a{color:var(--color-secondary);text-decoration:none;transition:var(--transition)}a:hover{text-decoration:underline;color:var(--color-primary)}button{background-color:var(--color-surface);color:var(--color-text);border:1px solid var(--color-muted);border-radius:var(--border-radius);padding:.6em 1.2em;margin:.3em;font-size:1em;cursor:pointer;transition:var(--transition)}button:hover{background-color:var(--color-primary);color:#000;border-color:var(--color-primary)}button:disabled{background-color:#333;color:#777;cursor:not-allowed}.spinner{border:3px solid var(--color-muted);border-top:3px solid var(--color-primary);border-radius:50%;width:1em;height:1em;animation:spin 1s linear infinite;display:inline-block}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media (prefers-color-scheme: light){:root{--color-bg: #ffffff;--color-surface: #f0f0f0;--color-primary: #4f46e5;--color-secondary: #0ea5e9;--color-text: #222;--color-muted: #ccc}}