@import url('/design-tokens.css');
@import url('/brand.css?v=1');
/* Shared website controls, navigation, forms and account panels. */
*{box-sizing:border-box}[hidden]{display:none!important}
html{scroll-behavior:smooth;scroll-padding-top:90px}
body{margin:0;min-height:100vh;display:flex;flex-direction:column;color:var(--ink);background:var(--bg);font:15px/1.65 var(--font-body)}
a{color:var(--accent);text-underline-offset:4px}a:hover{color:var(--accent-hover)}
button,input,select,textarea{font:inherit}button,.button{cursor:pointer;border:1px solid var(--line);background:var(--surface);color:var(--ink);padding:10px 18px;border-radius:2px;text-decoration:none;display:inline-flex;justify-content:center;align-items:center;gap:8px;font-weight:600;min-height:44px;transition:background .14s,border-color .14s,color .14s}
button:hover,.button:hover{border-color:var(--border-light);background:var(--bg-panel-hover);color:var(--ink)}button:disabled{opacity:.55;cursor:not-allowed}
button[type=submit],.play-button,.primary,.signup-button{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}button[type=submit]:hover,.play-button:hover,.primary:hover,.signup-button:hover{background:var(--accent-hover);border-color:var(--accent-hover);color:var(--accent-ink)}
:focus-visible{outline:1px solid var(--accent);outline-offset:4px}input[type=checkbox]{accent-color:var(--accent)}
h1,h2,h3{font-family:var(--font-heading);line-height:1.08;letter-spacing:.01em;text-transform:uppercase}h1{font-size:48px}h2{font-size:32px}h3{font-size:24px}p{color:var(--muted)}
.eyebrow,.legal-page-label,.creator-tool-kicker{font:12px/1.5 var(--font-heading);text-transform:uppercase;letter-spacing:.16em;color:var(--muted)}
.topbar{height:72px;flex:none;display:flex;align-items:center;gap:36px;padding:0 max(var(--page-gutter),calc((100vw - var(--content-width))/2));border-bottom:1px solid var(--line);background:var(--bg-header);position:sticky;top:0;z-index:90}
.logo{font:700 30px/.9 var(--font-heading);color:var(--ink);text-decoration:none;letter-spacing:-.02em;white-space:nowrap}.logo span{color:var(--accent)}
.site-nav{display:flex;gap:28px;align-items:stretch;align-self:stretch}.site-nav a{display:flex;align-items:center;font:14px var(--font-heading);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);text-decoration:none;border-bottom:2px solid transparent}.site-nav a:hover,.site-nav a[aria-current]{color:var(--ink);border-bottom-color:var(--accent)}
#accountArea,.account-links{display:flex;gap:18px;align-items:center;font:14px var(--font-heading);letter-spacing:.06em}#accountArea{margin-left:auto}#accountArea a{white-space:nowrap;color:var(--ink);text-decoration:none}#accountArea .signup-button{color:var(--accent);background:transparent;border:1px solid var(--accent-dark);text-transform:uppercase;font-weight:400}#accountArea .signup-button:hover{background:var(--accent);color:var(--bg)}
.account-name,.header-logout{min-height:40px;padding:7px 10px;border:0;background:transparent;color:var(--text-main);font:14px var(--font-heading);letter-spacing:.05em;white-space:nowrap}.account-name{cursor:pointer}.account-name:hover{color:var(--accent)}.header-logout{border:1px solid var(--line);color:var(--text-main);text-transform:uppercase}.header-logout:hover{border-color:var(--accent);background:var(--bg-panel-hover)}
.menu-toggle{display:none}.skip-link{position:fixed;top:-80px;left:18px;z-index:200;background:var(--bg);padding:12px}.skip-link:focus{top:12px}
.home-page{width:min(var(--content-width),calc(100% - var(--page-gutter)*2));margin-inline:auto}
.info-section{border-top:1px solid var(--line);padding:44px 0;display:grid;grid-template-columns:1fr 1fr;gap:40px}.info-section h1,.info-section h2{margin:8px 0}.info-section p{margin:8px 0}
.feature-card{padding:24px;border:1px solid var(--line);background:var(--surface)}.hero-actions{display:flex;gap:12px;flex-wrap:wrap}
@media(max-width:767px){.info-section{grid-template-columns:1fr;gap:16px;padding:30px 0}}
.creator-tool-card { display:grid; grid-template-columns:50px minmax(0,1fr) 220px; align-items:center; gap:24px; padding:25px; border:1px solid var(--line); background:var(--surface); margin:14px 0; }.creator-tool-card h2 { font-size:26px; margin:8px 0; }.creator-tool-card p { margin:0; font-size:14px; }.creator-tool-icon { display:grid; grid-template-columns:1fr 1fr; gap:4px; }.creator-tool-icon span { height:20px; border:1px solid var(--accent); }.creator-tool-actions { display:grid; gap:8px; width:100%; max-width:220px; min-width:0; }.creator-tool-actions button { width:100%; }.creator-tool-actions small { color:var(--muted); text-align:center; overflow-wrap:anywhere; }.creator-tool-badge { color:var(--amber); margin-left:12px; }
.start-container { width:min(500px,calc(100% - 40px)); margin:65px auto 90px; padding:32px; border:1px solid var(--line); background:var(--surface); box-shadow:var(--shadow); }.start-container h1 { font-size:36px; margin-top:10px; }.start-container h2 { font-size:24px; }.start-container p { font-size:14px; }
form { display:grid; gap:14px; } input:not([type=checkbox]):not([type=range]),textarea,select { width:100%; padding:13px; border:1px solid var(--line); border-radius:2px; background:var(--bg); color:var(--ink); min-width:0; } input::placeholder { color:var(--muted); } label { color:var(--ink); font-size:14px; }
.field-label { display:block; margin:4px 0 -8px; } hr { border:0; border-top:1px solid var(--line); margin:30px 0; }
.password-field { position:relative; width:100%; }.password-field input { padding-right:54px!important; }.password-toggle { position:absolute; right:5px; top:50%; transform:translateY(-50%); min-height:38px; width:38px; padding:9px; background:transparent; border:0; }.password-toggle svg { width:20px; height:20px; fill:currentColor; }
#message,#guestMessage,#resendMessage,.profile-message { min-height:24px; font-size:14px; } .error { color:var(--danger); }.success { color:var(--accent); }
.verification-box { display:none; padding:12px 0; }.verification-box.visible { display:block; }.verification-icon { font-size:32px; color:var(--accent); } #verificationCode { letter-spacing:.2em; text-transform:uppercase; font:22px Consolas,monospace; }
.legal-page { width:min(800px,calc(100% - 48px)); margin:60px auto 90px; }.legal-page h1 { font-size:48px; }.legal-placeholder { border:1px solid var(--line); padding:26px; background:var(--surface); }.legal-placeholder h2 { font-size:26px; }.legal-warning { color:var(--amber); }
.legal-footer { margin-top:auto; padding:30px max(24px,calc((100vw - 1500px)/2)); border-top:1px solid var(--line); background:var(--bg); }.legal-footer-inner { display:flex; align-items:center; justify-content:space-between; gap:24px; font-size:12px; }.legal-links { display:flex; flex-wrap:wrap; gap:20px; }.legal-links a,.legal-links button { color:var(--muted); }.legal-links button { font-size:12px; padding:0; border:0; background:none; min-height:24px; }
.studio-access-dialog { position:fixed; inset:0; background:#000b; display:grid; place-items:center; z-index:100; padding:24px; }.studio-access-dialog-card { position:relative; max-width:450px; border:1px solid var(--line); padding:30px; background:var(--surface); }.studio-dialog-close { position:absolute; right:12px; top:10px; }.studio-dialog-actions { display:flex; gap:14px; }

.legal-footer{background:var(--bg-dark);min-height:110px;display:flex;align-items:center}.legal-footer-inner{width:100%}.legal-links a{text-decoration:none}.legal-links a:hover,.legal-links button:hover{color:var(--ink)}
.start-container{border-top:2px solid var(--accent);box-shadow:none}.start-container h1{letter-spacing:.03em}.success{color:var(--success)}
@media(max-width:1050px){.topbar{gap:24px}.site-nav{gap:18px}.site-nav a{font-size:13px}}
@media(max-width:767px){.topbar{height:64px;gap:10px}.logo{font-size:26px}.account-links{gap:12px}#accountArea{font-size:12px;gap:6px}.account-name,.header-logout{font-size:12px;padding-inline:7px}.account-name{max-width:90px;overflow:hidden;text-overflow:ellipsis}#accountArea .signup-button{padding:8px 10px;min-height:40px}.menu-toggle{display:inline-flex;min-width:40px;padding:8px}.site-nav{display:none;position:absolute;top:63px;left:0;right:0;padding:12px 18px;background:var(--bg-dark);border-bottom:1px solid var(--line);flex-direction:column;gap:0}.site-nav.is-open{display:flex}.site-nav a{min-height:44px;padding:8px 0}.creator-tool-card{grid-template-columns:35px minmax(0,1fr);gap:16px;padding:18px}.creator-tool-actions{grid-column:2}.legal-footer-inner{align-items:start;flex-direction:column}.legal-footer{padding:28px 18px}.legal-links{gap:14px}.start-container{padding:24px;margin-top:35px}.legal-page h1{font-size:38px}}
@media(max-width:380px){.logo{font-size:23px}.topbar{gap:8px}.account-links{gap:8px}#accountArea .signup-button{font-size:11px;padding:8px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important;animation:none!important}}
