/* HypeDap gaming theme: shared by Razor screens and the React dashboard. */
:root{--arena:#0b1020;--surface:#131d30;--surface-2:#202c44;--border:#2b3955;--ink:#eef2ff;--sub:#a5b1ca;--accent:#a78bfa;--accent-ink:#11172c;--bg:#0b1020;--panel:#131d30;--line:#2b3955;--text:#eef2ff;--muted:#a5b1ca;--mint:#a78bfa;--paper:#0b1020;color-scheme:dark}
body{background:radial-gradient(ellipse at 85% 0,#6d399024,transparent 52%),#0b1020!important;color:#eef2ff;font-family:'Segoe UI',Arial,sans-serif}
body .app-shell{background:transparent!important}body .content{background:radial-gradient(ellipse at 90% 0,#7c41a51c,transparent 55%)!important}
body .sidebar{background:linear-gradient(180deg,#0c1425,#0c1425)!important;border-right:1px solid #2b3955!important}
body .brand,body .mobile-brand,body .auth-brand,body .arcade-brand{font-weight:850;letter-spacing:-.7px}
body .sidebar .brand i,body .mobile-brand i,body .auth-brand span,body .arcade-brand b{background:linear-gradient(145deg,#d0b1ff,#9a64ee)!important;color:#1c0d30!important;border-radius:9px!important;box-shadow:0 0 24px #a78bfa24!important}
body .sidebar nav button{border-radius:8px!important;min-height:46px}body .sidebar nav button.active{background:linear-gradient(90deg,#623d874d,#24162e)!important;color:#f0e4ff!important;box-shadow:inset 3px 0 #c498ff,0 0 20px #a78bfa08!important}
body .workspace,body .eyebrow,body .auth-eyebrow,body .arcade-kicker{font-family:Consolas,'Courier New',monospace!important;letter-spacing:1.7px!important;color:#81cfff!important;font-size:10px}
body .content h1,body .content h2,body .content h3,body .auth-card h2,body .setup-shell h1,body .setup-shell h2{font-family:'Segoe UI',Arial,sans-serif!important;font-weight:800;letter-spacing:-.8px!important}
body .content header h1{font-size:clamp(25px,3vw,35px)!important}
body .content .panel,body .content .insight-card,body .content .plan-card,body .content .alert-preview-card,body .setup-card,body .auth-card,body .arcade-panel,body .arcade-goal,body .arcade-community{background:linear-gradient(145deg,#152139,#111a2c)!important;border:1px solid #2b3955!important;border-radius:14px!important;box-shadow:0 12px 32px #00000020,inset 0 1px #ffffff04!important}
body .earnings-spotlight{background:radial-gradient(ellipse at 65% 50%,#653c8d30,transparent 65%),linear-gradient(120deg,#1c2b48,#111a2c)!important;border:1px solid #40577d!important;border-radius:16px!important;box-shadow:0 10px 45px #5f348a14!important}
body .spotlight-copy strong{font-variant-numeric:tabular-nums;font-weight:850}body .spotlight-orbit{opacity:.85}body .orbit-center{border-color:#9470b7!important;box-shadow:0 0 40px #a779f328!important}
body .content .primary,body .content .create-goal,body .content .test-alert,body .auth-submit,body .save-button,body .arcade-send,body .walkthrough-dialog .primary{background:linear-gradient(115deg,#c3a0ff,#a16bf1)!important;color:#190b2d!important;border:1px solid #ccacff!important;border-radius:8px!important;clip-path:none!important;box-shadow:0 3px 0 #5f378d,0 7px 22px #a573ed17!important;font-weight:800!important;min-height:46px}
body .content .ghost,body .content .secondary,body .content .outline-action,body .walkthrough-dialog .ghost,body .file-button{background:#1d2a43!important;border:1px solid #3c5073!important;color:#eadcff!important;border-radius:8px!important;min-height:42px;padding:11px 16px;font-size:12px!important;clip-path:none!important}
body .content header .ghost:first-letter{font-size:inherit!important}
body .content input:not([type=checkbox]):not([type=hidden]):not([type=range]),body .content textarea,body .auth-card input:not([type=checkbox]):not([type=hidden]),body .setup-card input:not([type=file]):not([type=checkbox]):not([type=hidden]),body .setup-card textarea,body .arcade-field input,body .arcade-field textarea{background:#0c1425!important;border:1px solid #354462!important;color:#eef2ff!important;border-radius:8px!important}
body input::placeholder,body textarea::placeholder{color:#8f9eb8!important;opacity:1}body input:focus,body textarea:focus{border-color:#ba8dff!important}
body .goal-progress,body .progress,body .setup-checklist progress{accent-color:#b78cff}body .goal-progress i,body .chart-column i{background:linear-gradient(180deg,#c8a9ff,#8f5ad7)!important;box-shadow:0 0 18px #a174ef1a!important}
body .period-pill,body .status-chip,body .billing-status,body .overlay-status{background:#202d49!important;border:1px solid #3c5073!important;color:#d9baff!important;border-radius:8px!important}
body .creator-account-card{background:#131d30;border-top:1px solid #2b3955;padding-top:14px}body .creator-account-avatar,body .supporter-avatar{border:1px solid #50658d;border-radius:10px!important;background:#293653!important}
body .setup-checklist li button{background:#131d30;border-color:#354462}body .setup-checklist li button.done{background:#24324e;border-color:#9c70c3}
body .mobile-topbar,body .mobile-nav{background:#0c1425f5!important;border-color:#2b3955!important;backdrop-filter:blur(12px)}body .mobile-nav button.active{color:#d0acff!important;background:#293353!important}
body .goal-modal,body .billing-modal,body .walkthrough-dialog{background:linear-gradient(145deg,#1b2942,#111a2c)!important;border:1px solid #4b5982!important;border-radius:16px!important;box-shadow:0 24px 100px #0009!important}
body .walkthrough-dialog::backdrop{background:#060b17db;backdrop-filter:blur(8px)}body .goal-modal-backdrop,body .billing-modal-backdrop{background:#060b17db;backdrop-filter:blur(8px)}
body .walkthrough-dialog h2{font-family:'Segoe UI',Arial,sans-serif;font-weight:800;letter-spacing:-1px}body .walkthrough-symbol{background:#293653;border:1px solid #4b5982;border-radius:12px;color:#cfacff}
body .auth-preview,body .arcade-note{background:#17263d!important;border-color:#354462!important}body .auth-tabs{background:#0c1425!important;border:1px solid #2b3955}body .auth-tabs .selected{background:#293353!important;color:#edddff!important}
body .auth-description,body .auth-intro,body .setup-shell header>p:not(.eyebrow),body .arcade-bio{color:#a5b1ca!important}
body .cover-picker{background-color:#182947!important}body .cover-picker:before{background:linear-gradient(135deg,#18294799,#3b4b7022)!important}body .avatar-preview,body .arcade-avatar{border-color:#bb8bf6!important;box-shadow:0 0 0 5px #8c58be17!important}
body .arcade-profile h1{font-family:'Segoe UI',Arial,sans-serif;font-weight:850;letter-spacing:-2px;font-size:clamp(38px,4.5vw,64px);line-height:1.07}body .arcade-profile h1 em{color:#bf95ff}body .arcade-presets button{border-radius:8px;border-color:#354462;color:#e8d5ff;background:#17263d}body .arcade-presets button[aria-pressed=true]{background:#303d61;border-color:#bc8ef5}
body .arcade-value output{color:#efddff;text-shadow:0 0 28px #a068e526;font-variant-numeric:tabular-nums}body .arcade-socials a{background:#17263d;border:1px solid #354462;border-radius:8px}
body :focus-visible{outline:2px solid #8cdbff!important;outline-offset:4px}body button:disabled{opacity:.5;cursor:not-allowed;transform:none!important}body a,body button{-webkit-tap-highlight-color:#a78bfa25}
.screen-enter{min-width:0}.screen-enter>section{width:100%}
/* Animate transforms/opacity, not layout. Entrances finish; nothing flashes or loops. */
@media(prefers-reduced-motion:no-preference){
 .screen-enter{animation:hype-screen .32s cubic-bezier(.2,.7,.2,1) both}
 body .auth-card,body .setup-shell,body .arcade-grid{animation:hype-screen .45s cubic-bezier(.2,.7,.2,1) both}
 body .walkthrough-dialog[open],body .goal-modal,body .billing-modal{animation:hype-dialog .24s cubic-bezier(.2,.8,.2,1) both}
 body button,body a.button,body .auth-tabs a,body .arcade-socials a{transition:transform .18s ease,background-color .18s ease,border-color .18s ease,box-shadow .18s ease,color .18s ease}
 body .insight-card,body .plan-card,body .setup-checklist li button{transition:border-color .22s ease,box-shadow .22s ease}
 body .goal-progress i{transition:width .6s cubic-bezier(.2,.7,.2,1)}
 @media(hover:hover){body button:not(:disabled):hover,body a.button:hover{transform:translateY(-2px)}body .insight-card:hover,body .plan-card:hover{border-color:#657bb0!important;box-shadow:0 12px 30px #7b45a014!important}}
 body button:not(:disabled):active,body a.button:active{transform:translateY(0) scale(.985)}
}
@keyframes hype-screen{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:translateY(0)}}
@keyframes hype-dialog{from{opacity:0;transform:translateY(8px) scale(.985)}to{opacity:1;transform:translateY(0) scale(1)}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto!important}body *,body *:before,body *:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
@media(max-width:800px){body .content>header{align-items:flex-start;gap:18px}body .walkthrough-header-actions{gap:8px;justify-content:flex-start}body .walkthrough-header-actions .ghost{padding:10px 12px!important;font-size:12px!important}body .arcade-profile h1{font-size:42px}}
@media(max-width:480px){body .auth-card,body .content .panel,body .setup-card{border-radius:12px!important}body .auth-card h2{font-size:25px}body .content header h1{font-size:26px!important}body .arcade-tagline{font-size:8px;letter-spacing:1px}}

/* Gaming Studio: one visual language across the public site and workspace. */
:root{--studio-blue:#81cfff;--studio-violet:#a78bfa;--studio-border:#2b3955;--studio-font:'Segoe UI',Arial,sans-serif}
body{background:radial-gradient(ellipse at 85% 0,#20204480,transparent 52%),#0b1020!important}
body .sidebar{background:#0c1425!important}
body .sidebar nav button.active{background:#242c4d!important;color:#d4c8ff!important;box-shadow:inset 3px 0 #a78bfa!important}
body .sidebar .brand i,body .mobile-brand i,body .auth-brand span,body .arcade-brand b{background:#263552!important;color:#81cfff!important;box-shadow:none!important}
body .content{background:radial-gradient(ellipse at 90% 0,#20204450,transparent 55%)!important}
body .content .panel,body .content .stat,body .content .insight-card,body .content .plan-card,body .content .alert-preview-card,body .setup-card,body .auth-card,body .arcade-panel,body .arcade-goal,body .arcade-community{background:#131d30!important;border-color:#2b3955!important;border-radius:10px!important;box-shadow:none!important}
body .content .primary,body .content .create-goal,body .content .test-alert,body .content .plan-primary,body .auth-submit,body .save-button,body .arcade-send,body .walkthrough-dialog .primary,body .shell .btn-tip{background:linear-gradient(110deg,#a78bfa,#8996ff)!important;color:#11172c!important;border:1px solid #b6afff!important;border-radius:7px!important;box-shadow:0 3px 15px #8c70ed18!important;font-weight:650!important}
body .content .ghost,body .content .secondary,body .content .outline-action,body .walkthrough-dialog .ghost,body .file-button{background:#1d2a43!important;border-color:#354462!important;color:#dbe4f8!important}
body .content h1,body .content h2,body .content h3,body .auth-card h2,body .setup-shell h1{font-family:var(--studio-font)!important;font-weight:650;letter-spacing:-.8px!important}
body .workspace,body .eyebrow,body .auth-eyebrow,body .arcade-kicker{font-family:var(--studio-font)!important;color:#81cfff!important;letter-spacing:1.5px!important}
body .earnings-spotlight,body .alerts-hero,body .billing-hero{background:radial-gradient(ellipse at 80% 30%,#52499c30,transparent 65%),linear-gradient(120deg,#192843,#111a2c)!important;border-color:#3b4b70!important;border-radius:12px!important}
body .orbit-center{background:#222c48!important;color:#a7baff!important;border-color:#4b5982!important;box-shadow:0 0 30px #6587df16!important}
body .goal-progress i,body .progress span,body .chart-column i{background:linear-gradient(110deg,#9270ee,#68c8f7)!important;box-shadow:none!important}
body .overlay-preview,body .auth-preview{background:repeating-linear-gradient(0deg,transparent 0,transparent 31px,#87aafa08 32px),linear-gradient(145deg,#192843,#15172e)!important;border-color:#3b4b70!important;border-radius:10px!important}
body .auth-preview{transform:none!important}body .auth-preview h2,body .auth-preview strong{color:#eef2ff}
body .setup-alert-status>p,body .speech-controls,body .setup-checklist{background:#131d30;border-color:#2b3955}
body .setup-alert-status span,body .speech-description,body .setup-checklist p{color:#a5b1ca}
body .content .code,body .content .input-prefix{background:#0c1425!important;border-color:#354462!important}
body .content .code code{color:#c2cced!important}body .content .code button{background:#293353!important;color:#e0d9ff!important}
body .auth-card,body .setup-card{border-top:2px solid #9079ce!important}
body .content .public-card,body .billing-modal,body .goal-modal,body .walkthrough-dialog{background:#131d30!important;border-color:#405272!important;border-radius:12px!important}
body .content .public-cover,body .content .public-page-cover{background:linear-gradient(130deg,#283c67,#17263d)}
body .arcade-cover{background-color:#17263d}body .arcade-tagline{color:#afc1e2}
/* Public marketing pages share tokens, but keep their own content layout. */
body.marketing-page,body.waitlist-page{--bg:#0b1020;--surface:#131d30;--text:#eef2ff;--muted:#a5b1ca;--accent:#a78bfa;--line:#2b3955}
body.marketing-page .shell,body.waitlist-page .site-header{width:min(1180px,calc(100% - 64px))}
body.marketing-page .brand,body.waitlist-page .brand{font-family:var(--studio-font)!important;font-weight:750;letter-spacing:-.8px!important}
body.marketing-page .brand>span:first-child,body.waitlist-page .brand>span:first-child{color:#81cfff;text-shadow:0 0 20px #67d7ff25}
body.marketing-page .brand .beta{background:#17263c;border-color:#294560;color:#a3dfff}
body.marketing-page .hero{background:transparent!important;gap:54px;padding-block:64px 58px}
body.marketing-page .hero h1{font-size:clamp(42px,4.5vw,62px);font-weight:650;line-height:1.12;letter-spacing:-2.3px}
body.marketing-page .intro{font-size:16px;line-height:1.75}
body.marketing-page .button,body.waitlist-page .button{background:linear-gradient(110deg,#a78bfa,#8996ff);color:#11172c;border:1px solid #b6afff;border-radius:7px;min-height:48px;padding:12px 19px;box-shadow:0 3px 15px #8c70ed18;font-weight:650}
body.marketing-page .product-preview{background:#131d30;border-color:#3b4b70;border-radius:12px;transform:none;box-shadow:0 20px 45px #00000030}
body.marketing-page .preview-top{color:#a2c6e7;font-size:10px;letter-spacing:.5px}
body.marketing-page .preview-stage{background:repeating-linear-gradient(0deg,transparent 0,transparent 31px,#87aafa08 32px),repeating-linear-gradient(90deg,transparent 0,transparent 31px,#87aafa08 32px),linear-gradient(145deg,#192843,#15172e)}
body.marketing-page .stage-orbit{border-color:#6599ed24;box-shadow:0 0 0 28px #6599ed08,0 0 0 56px #6599ed06}
body.marketing-page .stage-title{font-size:36px;font-weight:600;letter-spacing:-1.3px}body.marketing-page .stage-title em{color:#b8a3f5}
body.marketing-page .stage-label,body.marketing-page .preview-bottom{color:#b3bfdb;font-size:10px;letter-spacing:.7px}
body.marketing-page .alert-example{background:#141c32;color:#eef2ff;border:1px solid #4b5282;border-left:3px solid #77d4ff;border-radius:7px}
body.marketing-page .alert-symbol{background:#302c50;color:#b99cff;border-radius:8px}body.marketing-page .alert-example div>span{color:#afbbd7;font-size:11px}
body.marketing-page .sound-wave i{background:#9e8ae2}body.marketing-page .avatar{background:#293653;border-color:#50658d;color:#d4c8ff}
body.marketing-page .goal-track{background:#28344d}body.marketing-page .goal-track>span{background:linear-gradient(90deg,#9270ee,#68c8f7)}
body.marketing-page .feature-card{background:#111b2d;border-color:#25334e;border-radius:10px}body.marketing-page .feature-icon{color:#81cfff}
body.marketing-page .availability{background:#152138;border-color:#2a415e}body.marketing-page .join{background:radial-gradient(ellipse at 50% 130%,#373e7980,transparent 70%),#131d30;border-color:#354462}
body.marketing-page .section-heading h2{font-weight:650}body.marketing-page .hero-note{color:#a5b1ca}
body.marketing-page .product-preview figcaption{font-size:11px;color:#a5b1ca}
/* A compact, centered waitlist rather than an oversized split-screen poster. */
body.waitlist-page .waitlist-shell{display:flex;flex-direction:column;width:min(520px,calc(100% - 40px));margin:42px auto 60px;gap:26px;align-items:stretch}
body.waitlist-page .waitlist-copy{text-align:center}body.waitlist-page .waitlist-copy h1{font-size:clamp(30px,4vw,38px);font-weight:650;line-height:1.15;letter-spacing:-1.2px;margin:14px 0 18px}
body.waitlist-page .waitlist-copy h1 br{display:none}body.waitlist-page .waitlist-copy>p:not(.eyebrow){font-size:14px;line-height:1.75}
body.waitlist-page .waitlist-copy .beta-note{border:0;background:none;padding:0;margin:16px 0 8px;font-size:12px!important}
body.waitlist-page .waitlist-card{background:#131d30;border:1px solid #2b3955;border-top:2px solid #9079ce;border-radius:12px;padding:28px;box-shadow:0 18px 45px #00000020}
body.waitlist-page .waitlist-card h2{font-size:24px;font-weight:650;letter-spacing:-.6px}
body.waitlist-page .waitlist-card input:not([type=checkbox]):not([type=hidden]){background:#0c1425;border-color:#354462;color:#eef2ff;font-size:16px}
body.waitlist-page .waitlist-confirmation{background:#131d30;border:1px solid #2b3955;border-top:2px solid #9079ce;border-radius:12px;padding:32px;max-width:560px;margin:60px auto;text-align:center}
body.waitlist-page .waitlist-confirmation h1{font-size:clamp(30px,4vw,40px);letter-spacing:-1.2px;font-weight:650}
@media(hover:hover){body.marketing-page .button:hover,body.waitlist-page .button:hover{box-shadow:0 0 24px #8c70ed35;transform:translateY(-2px)}}
@media(max-width:800px){body.marketing-page .hero{gap:36px;padding-block:40px}body.marketing-page .product-preview{max-width:540px}body.marketing-page .hero h1{font-size:clamp(42px,8vw,58px)}}
@media(max-width:480px){body.marketing-page .shell,body.waitlist-page .site-header{width:calc(100% - 36px)}body.marketing-page .hero h1{font-size:42px;letter-spacing:-1.8px}body.marketing-page .preview-top{font-size:9px}body.marketing-page .stage-title{font-size:32px}body.marketing-page .stage-label,body.marketing-page .preview-bottom{font-size:9px}body.waitlist-page .waitlist-card{padding:23px}body.waitlist-page .waitlist-confirmation{width:calc(100% - 36px);padding:26px;margin-block:35px}}
/* The legacy fixed-sidebar offset must not also apply to the flex layout. */
@media(min-width:681px){body .app-shell{display:flex!important}body .app-shell>.sidebar{position:sticky!important;top:0;inset-inline-start:auto;flex:0 0 220px;width:220px;height:100vh}body .app-shell>main.content{margin-left:0!important;width:calc(100% - 220px)!important;min-width:0;max-width:none;flex:1;padding:32px clamp(24px,3vw,48px)}body .sidebar nav button{font-size:13px!important;text-align:left}body .sidebar .brand{font-size:22px!important;text-align:left}body .sidebar .workspace{font-size:10px!important}}
body .setup-checklist progress{appearance:none;border:0;background:#28344d;height:6px;border-radius:4px;overflow:hidden}
body .setup-checklist progress::-webkit-progress-bar{background:#28344d}body .setup-checklist progress::-webkit-progress-value{background:linear-gradient(90deg,#9270ee,#68c8f7)}body .setup-checklist progress::-moz-progress-bar{background:#a78bfa}
@media(max-width:680px){body .content>header .walkthrough-header-actions{display:flex!important;flex-wrap:wrap;gap:8px;width:100%}body .content>header .walkthrough-header-actions .ghost{display:inline-flex!important;align-items:center;justify-content:center;font-size:12px!important;min-height:44px;min-width:0!important;padding:10px 12px!important}body .content>header .walkthrough-header-actions .ghost:after{content:none!important}body .content>header .walkthrough-header-actions form{width:auto!important;flex:0 0 auto}}
