*{margin:0;padding:0;box-sizing:border-box}:root{--bg-primary: #0d0d0d;--bg-secondary: #1a1a1a;--text-primary: #ffffff;--text-secondary: #888888;--accent: #7c3aed}html,body,#root{height:100%;width:100%}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:var(--bg-primary);color:var(--text-primary)}.app{display:flex;flex-direction:column;height:100%;width:100%}.embed-container{flex:1;display:flex;flex-direction:column;width:100%;height:100%;position:relative}.embed-container__frame{flex:1;width:100%;height:100%;border:none;background:var(--bg-secondary)}.embed-container__loading{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:1rem}.embed-container__loading-spinner{width:40px;height:40px;border:3px solid var(--bg-secondary);border-top-color:var(--accent);border-radius:50%;animation:spin 1s linear infinite}.embed-container__loading-text{color:var(--text-secondary);font-size:.875rem}@keyframes spin{to{transform:rotate(360deg)}}.error-page{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;gap:1.5rem;padding:2rem}.error-page__icon{font-size:4rem;opacity:.5}.error-page__title{font-size:1.5rem;font-weight:600}.error-page__message{color:var(--text-secondary);text-align:center;max-width:400px;line-height:1.6}.landing-page{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;gap:3rem;padding:2rem;text-align:center}.landing-page__header{display:flex;flex-direction:column;align-items:center;gap:1rem}.landing-page__logo{font-size:4rem;font-weight:700;background:linear-gradient(135deg,var(--accent),#a855f7);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.landing-page__tagline{font-size:1.25rem;color:var(--text-secondary);max-width:500px;line-height:1.6}.landing-page__features{display:grid;grid-template-columns:repeat(2,1fr);gap:1.5rem;max-width:600px;width:100%}@media(max-width:480px){.landing-page__features{grid-template-columns:1fr}}.landing-page__feature{background:var(--bg-secondary);border-radius:12px;padding:1.5rem;display:flex;flex-direction:column;align-items:center;gap:.5rem}.landing-page__feature h3{font-size:1rem;font-weight:600}.landing-page__feature p{font-size:.875rem;color:var(--text-secondary);line-height:1.4}.landing-page__feature-icon{width:32px;height:32px;color:var(--accent)}.landing-page__footer{color:var(--text-secondary);font-size:.875rem}.landing-page__footer a{color:var(--accent);text-decoration:none}.landing-page__footer a:hover{text-decoration:underline}.help-page{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;gap:2rem;padding:2rem}.help-page__logo{font-size:3rem;font-weight:700;background:linear-gradient(135deg,var(--accent),#a855f7);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.help-page__subtitle{color:var(--text-secondary);text-align:center;max-width:500px;line-height:1.6}.help-page__examples{display:flex;flex-direction:column;gap:.75rem;margin-top:1rem}.help-page__example{display:flex;align-items:center;gap:1rem;padding:.75rem 1.25rem;background:var(--bg-secondary);border-radius:8px;font-family:monospace;font-size:.875rem;color:var(--text-secondary)}.help-page__example code{color:var(--text-primary)}.help-page__example strong{color:var(--accent)}.help-page__example-label{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;font-size:.75rem;font-weight:500;text-transform:uppercase;letter-spacing:.05em;color:var(--text-secondary);min-width:70px}