:root{font-family:system-ui,sans-serif;color:#f3f6ff;background:#090a16;color-scheme:dark}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 82% 24%,#312263 0,transparent 43%),#090a16}main{max-width:80rem;margin:auto;padding:1.5rem clamp(1rem,5vw,4rem)}header,footer{display:flex;justify-content:space-between;align-items:center;padding:1rem 0}a{color:inherit;text-decoration:none}.brand{font-size:1.5rem;font-weight:800;letter-spacing:-.05em}.brand span,footer span,.badge span,.preview-label span{color:#b9f884;margin-left:.25rem}nav{display:flex;gap:.25rem;border:1px solid #ffffff26;border-radius:999px;padding:.25rem}nav a{padding:.5rem .75rem;border-radius:999px;font-size:.875rem}nav a[aria-current]{background:#ffffff20}.hero{display:grid;grid-template-columns:1.15fr 1fr;align-items:center;gap:3rem;padding:clamp(3rem,9vw,8rem) 0 4rem}.badge{color:#d9caff;font-size:.875rem;font-weight:650}.badge span{margin:0 .25rem 0 0}h1{font-size:4.5rem;line-height:.98;letter-spacing:-.075em;margin:1rem 0;text-wrap:balance}.intro{max-width:34rem;color:#c5c3d8;font-size:1.125rem;line-height:1.65;margin:1.5rem 0}.fields{display:flex;gap:.5rem;flex-wrap:wrap}.fields input{flex:1;min-width:12rem;background:#ffffff0b;color:#fff;border:1px solid #ffffff36;border-radius:.75rem;padding:.75rem 1rem;font:inherit}button{font:inherit;min-height:48px;border:1px solid transparent;border-radius:.75rem;padding:.75rem 1rem;cursor:pointer;transition:transform .2s,background .2s}button:hover{transform:translateY(-2px)}button:disabled{cursor:default;opacity:.7;transform:none}.fields button{background:#c7ff9d;color:#142609;font-weight:750}.fields button:hover{background:#dbffbe}form small{display:block;margin-top:.75rem;color:#aaa7c4}.status{min-height:1.5rem;color:#d9ffbe}.stage{position:relative;padding:1rem;isolation:isolate}.stage:before{content:"";position:absolute;z-index:-1;inset:-7%;background:repeating-radial-gradient(ellipse,#9a82ff33 0 1px,transparent 2px 24px);mask-image:radial-gradient(ellipse,#000,transparent 72%);animation:pulse 6s ease-in-out infinite alternate}.preview{padding:2rem;background:linear-gradient(145deg,#29234b,#141426);border:1px solid #cab9ff55;border-radius:1.5rem;box-shadow:0 24px 72px #06051499;min-height:21rem}.preview-label{display:flex;align-items:center;gap:.5rem;font-size:.75rem;letter-spacing:.12em;font-weight:700;color:#e0d6ff}.preview-label i{margin-left:auto;font-style:normal}.track{height:3px;background:#ffffff20;margin:1rem 0 1.5rem}.track i{display:block;width:50%;height:100%;background:#c7ff9d;transition:width .35s}.track .complete{width:100%}.question{animation:enter .38s ease both}.question h2{font-size:1.875rem;line-height:1.12;letter-spacing:-.045em}.question button{display:flex;width:100%;gap:.75rem;align-items:center;text-align:left;background:#ffffff0c;border-color:#ffffff24;color:#fff;margin-top:.5rem}.question button:hover{background:#fff2}.question b{color:#c4afff;font-size:.75rem}.question button span{margin-left:auto;color:#c7ff9d}.benefits{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;border-block:1px solid #ffffff26;padding:2rem 0}.benefits b{color:#c7ff9d;font-size:.875rem}.benefits h2{font-size:1.25rem}.benefits p{color:#c5c3d8;line-height:1.6}:focus-visible{outline:2px solid #c7ff9d;outline-offset:4px}@keyframes enter{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}@keyframes pulse{to{opacity:.4;transform:scale(.93)}}@media(max-width:58rem){.hero{grid-template-columns:1fr;gap:1rem}h1{font-size:3.75rem}.stage{padding:0}}@media(max-width:36rem){h1{font-size:3rem}.benefits{grid-template-columns:1fr}.preview{padding:1.25rem}.fields button{width:100%}}@media(prefers-reduced-motion:reduce){*,*:before{animation:none!important;transition:none!important;transform:none!important}}.workspace{margin-block:2rem}.workspace fieldset{display:grid;gap:1rem;border:1px solid #ffffff26;border-radius:.75rem;padding:1rem;margin-block:1rem;min-width:0}.workspace label{display:grid;gap:.4rem;min-width:0}.workspace input,.workspace select{width:100%;min-width:0;font:inherit;color:inherit;background:#18182e;border:1px solid #ffffff36;border-radius:.5rem;padding:.75rem}.workspace button{width:fit-content;color:#f3f6ff;background:#29234b;border-color:#cab9ff55;margin:.25rem}.workspace ul{list-style:none;padding:0}.editor-option{display:grid;grid-template-columns:2fr minmax(5rem,1fr) 2fr auto;align-items:end;gap:.75rem}@media(max-width:42rem){.editor-option{grid-template-columns:1fr}}#quiz form{display:grid;gap:.75rem;margin-block:1rem}#quiz input[type=email]{width:100%;background:#18182e;color:inherit;border:1px solid #ffffff36;border-radius:.75rem;padding:.75rem 1rem;font:inherit}#quiz input[type=checkbox]{accent-color:#c7ff9d}main{overflow-x:clip}
