:root{color:#242947;background:#f6f7fc;--green:#5555cf;--muted:#6b7089}
body{background:radial-gradient(ellipse at 100% 0,#eaeafd 0,transparent 42%),#f6f7fc}
header{max-width:1200px;padding:23px 32px;border-bottom:1px solid #e0e2f0;gap:20px}
.brand{display:flex;align-items:center;gap:12px;color:#292d50;flex-shrink:0}
.brand img{box-shadow:0 5px 12px #5555cf20;border-radius:15px}
.brand .wordmark{display:block;margin:0;font:800 24px Manrope,sans-serif;letter-spacing:-.8px}
.wordmark small{display:block;font:700 8px 'DM Sans',sans-serif;letter-spacing:2px;margin-top:5px;color:#73768d}
nav{gap:8px}nav button{font-size:13px;border-radius:100px;padding:12px 18px}nav #home{background:#e9e9fa;color:#4c4cb7}nav #account{border:1px solid #d9dcee;background:white}
main{margin-top:32px}.hero{background:#eaeafa;border:1px solid #dfdff4;border-radius:28px;padding:44px 46px;grid-template-columns:1.35fr 1fr;min-height:330px;position:relative}
.eyebrow{font-size:10px;letter-spacing:1.8px;color:#5858ae}h1{font-size:54px;line-height:1.13;letter-spacing:-2.5px;color:#272b4e}.hero-highlight{color:#5555cf}.hero .muted{font-size:15px;max-width:390px;color:#626681}.hero .row{gap:8px;margin-top:24px}.hero .tiny{border:1px solid #d4d4ee;border-radius:100px;padding:6px 10px;background:#f7f7ff99;font-size:10px;color:#565a7b}
.art{min-height:240px}.sun{width:216px;height:216px;right:16px;top:16px;background:#ffcc7c}.book{background:#fff;box-shadow:8px 9px 0 #c8c8ed;border:1px solid #d8d8ef;border-radius:14px 25px 25px 14px;padding:25px;transform:rotate(-8deg);width:235px;min-height:240px;color:#34345f;font:800 23px Manrope;display:flex;flex-direction:column;gap:17px}.book img{border-radius:18px}.book small{font:700 8px 'DM Sans';letter-spacing:1.1px;color:#777794}.spark{color:#6666d6;left:0;top:4px;font-size:46px}.art-sticker{position:absolute;right:-10px;bottom:-9px;border:1px solid #f1dcae;background:#fff4d5;border-radius:12px;padding:15px 20px;transform:rotate(6deg);font-size:12px;color:#7b5828;box-shadow:0 8px 18px #6c5b6a0c}.art-sticker strong{font-size:17px}
.stats{gap:0;background:white;border:1px solid #e1e4f0;border-radius:18px;padding:22px 0;margin:22px 0}.stat{flex:1;padding:0 30px}.stat+.stat{border-left:1px solid #e7e8f2}.stat strong{color:#393d6e;font-size:27px}.stat span{display:block;margin-top:5px}
.settings{background:#fff;padding:24px;border:1px solid #e1e4f0;border-radius:18px;gap:22px;align-items:center;margin-bottom:18px}.settings-heading{flex:1;min-width:160px}.settings-heading strong{display:block;font:800 17px Manrope;margin-top:8px}.settings label{flex:1;min-width:135px;color:#626782;font-size:11px}.settings input,.settings select{width:100%;margin:9px 0 0;padding:12px;background:#f9faff;border-color:#dfe2ef;color:#333958}.section-title{margin:36px 0 20px}.section-title h2{font-size:25px;letter-spacing:-.7px;color:#292f53}.section-title .eyebrow{margin-bottom:8px}
.grid{gap:20px}.card{border:1px solid #e1e4f0;border-radius:20px;padding:25px;box-shadow:0 4px 10px #36376703;position:relative}.card:hover{box-shadow:0 12px 25px #3637670c;border-color:#b9b9e8}.card:nth-child(3n+1){border-top:4px solid #b6b5ed}.card:nth-child(3n+2){border-top:4px solid #f3c780}.card:nth-child(3n){border-top:4px solid #99c9bb}.icon{width:49px;height:49px;font:800 23px Manrope;color:#464b73}.card h3{color:#303658;letter-spacing:-.4px;margin-top:18px}.card p{min-height:22px}.card button{background:#f3f3fe;border-color:#e5e5f8;color:#5151b8;text-align:left;display:flex;justify-content:space-between}.card button:hover{background:#5555cf;color:white;border-color:#5555cf}.track{background:#eceef7}.track span{background:#7776dc}.card .track{margin-top:24px}.card .tiny{font-size:11px}
button{color:#464b73;border-color:#dcdfed}button:hover{background:#f0f0fd;border-color:#8888d9}.primary{color:white;background:#5555cf;border-color:#5555cf}.primary:hover{background:#4343b1;color:white}.question{border-color:#e1e4f0;box-shadow:0 6px 25px #393d6e04}.question h2{color:#292f53}.side{background:#ececfa}.letter{background:#ededfb;color:#5a5ac0}.selected{background:#eeeefe}.feedback{background:#eff7f1}.numbers .answered{background:#d7d7f6}.numbers .current{outline-color:#5555cf}.result-head{background:#eaeafa}.review{border-color:#e1e4f0}.score{color:#5555cf}dialog{color:#292f53;border-color:#e1e4f0}dialog::backdrop{background:#24294770}footer{border-top:1px solid #e0e2f0;padding-top:22px}
@media(max-width:900px){.hero{padding:32px;grid-template-columns:1.25fr 1fr}h1{font-size:44px}.book{width:200px;font-size:21px}.art-sticker{right:-12px}.hero .tiny{font-size:9px}.settings-heading{flex-basis:100%}}
@media(max-width:760px){header{padding:18px}.brand .wordmark{font-size:20px}.brand img{width:40px;height:40px}.wordmark small{font-size:6px;letter-spacing:1.4px}nav button{padding:9px 11px;font-size:11px}.hero{grid-template-columns:1fr;padding:30px;min-height:0}.hero h1{font-size:43px}.stat{padding:0 18px}.stat strong{font-size:23px}.stat span{font-size:10px}.settings{padding:20px;gap:16px}.settings-heading{min-width:0}.section-title h2{font-size:22px}.section-title button{font-size:11px;padding:10px}.card{padding:22px}.hero .tiny{font-size:10px}}
@media(max-width:450px){header{flex-wrap:wrap;gap:16px}nav{width:100%;gap:10px}nav button{flex:1;font-size:12px}.hero{padding:25px}.hero h1{font-size:38px}.hero .muted{font-size:14px}.hero .row{gap:6px}.stats{padding:18px 0}.stat{padding:0 12px}.stat strong{font-size:22px}.settings label{flex-basis:100%}.section-title{align-items:center}.section-title h2{font-size:20px}.section-title .eyebrow{font-size:8px}.quiz-bottom{flex-wrap:wrap}.quiz-bottom button{flex:1;white-space:nowrap}footer{font-size:10px}.question h2{font-size:20px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}.card:hover{transform:none}}
