/* Eduvio Experience: a guided, lively learning studio. */
:root{--experience-ink:#12384d;--experience-teal:#086c70;--experience-mint:#def4ec;--experience-gold:#ffdb78;--experience-paper:#f7f9fa}
[hidden]{display:none!important}
.eduvio-main #screen-app{background:var(--experience-paper)}
.eduvio-main #screen-app .main{max-width:1440px;padding:24px 36px 80px}
.eduvio-main #screen-app .topbar{background:transparent;border:0;padding:6px 0 20px;margin:0;box-shadow:none;border-radius:0}
.eduvio-main #screen-app .topbar h1{font-size:1.35rem;letter-spacing:-.025em}
.eduvio-main #screen-app .topbar .sub{font-size:.82rem}
.experience-dashboard{--ex-text:#163c4e;--ex-muted:#526d79;color:var(--ex-text)}
.experience-hero{position:relative;display:grid;grid-template-columns:1.3fr .7fr;min-height:320px;overflow:hidden;border-radius:30px;background:linear-gradient(115deg,#daefe8,#d9f1ee 65%,#d0e9e8);padding:42px 48px;isolation:isolate}
.experience-hero-copy{position:relative;z-index:2;max-width:640px}
.experience-eyebrow{display:block;font-size:.69rem;font-weight:800;letter-spacing:.13em;text-transform:uppercase;color:#357167}
.experience-hero h2{font-size:clamp(2rem,3.5vw,3.25rem);line-height:1.12;letter-spacing:-.055em;margin:17px 0 16px;max-width:16ch;color:#143e46}
.experience-hero p{font-size:1rem;max-width:43ch;color:#42646c;margin:0 0 24px}
.experience-focus-row{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.experience-focus-row label{font-size:.8rem;font-weight:800;color:#365f65}
.experience-focus-row select{min-width:185px;max-width:100%;min-height:46px;border:1px solid #9ec7c0;border-radius:12px;background:#ffffffde;color:#193e4b;padding:8px 32px 8px 14px;font-weight:800}
.experience-hero-art{position:relative;min-height:240px;display:flex;justify-content:center;align-items:end;isolation:isolate}
.experience-hero-art>img{position:absolute;height:clamp(260px,25vw,350px);width:230px;object-fit:contain;bottom:-44px;z-index:2;filter:drop-shadow(0 16px 15px #16433918)}
.experience-orbit{position:absolute;width:285px;height:285px;border-radius:50%;border:1px solid #97c7bc80;left:50%;top:50%;transform:translate(-50%,-50%);z-index:-1}
.orbit-two{width:365px;height:365px;border-color:#b7d9d5}
.experience-hero-art::before{content:'';position:absolute;inset:35px 5px -65px;border-radius:45% 55% 0 0;background:#bce1d5;z-index:-2;transform:rotate(-12deg)}
.experience-float{position:absolute;display:grid;place-items:center;width:62px;height:62px;border-radius:20px;font-size:1.8rem;font-weight:800;z-index:3;box-shadow:0 10px 20px #19494212;animation:experience-float 6s ease-in-out infinite}
.float-math{left:4%;top:26px;background:#fff8e5;color:#a17c22;rotate:-12deg}
.float-text{right:1%;top:12px;background:#fff;color:#6960a8;rotate:10deg;animation-delay:-2s}
.float-star{right:3%;bottom:15px;background:#ffdb78;color:#92621e;rotate:-9deg;animation-delay:-4s}
@keyframes experience-float{50%{translate:0 -7px}}
.experience-tabs{display:flex;gap:6px;align-items:center;border-bottom:1px solid #dae5e9;margin:28px 0 24px;padding-bottom:12px}
.experience-tabs>button{border:0;background:transparent;color:#526b77;padding:12px 22px;min-height:46px;border-radius:12px;font-size:.92rem;font-weight:800;transition:background .2s,color .2s}
.experience-tabs>button:hover{background:#e9f1f1;color:#245d61}
.experience-tabs>button[aria-selected=true]{background:#123e48;color:#fff;box-shadow:0 5px 12px #164c5b16}
.experience-today-grid{display:grid;grid-template-columns:1.6fr 1fr;gap:22px}
.experience-next{position:relative;min-width:0;background:#fff;border:1px solid #e0e9ec;border-radius:25px;padding:28px 30px;box-shadow:0 12px 32px #153d4c06;overflow:hidden}
.experience-next::before{content:'';position:absolute;left:0;top:26px;bottom:26px;width:5px;background:var(--subject-accent);border-radius:0 8px 8px 0}
.experience-next-head{display:flex;gap:10px;justify-content:space-between;align-items:center;margin-bottom:28px;flex-wrap:wrap}
.experience-subject-pill{font-size:.73rem;font-weight:800;padding:6px 12px;border-radius:99px;color:var(--subject-accent);background:color-mix(in srgb,var(--subject-accent) 10%,#fff)}
.experience-next-label{font-size:.8rem;color:var(--ex-muted);display:block;margin-bottom:9px}
.experience-next h3{font-size:clamp(1.5rem,2.3vw,2rem);max-width:24ch;color:var(--ex-text);margin-bottom:12px}
.experience-next p{font-size:.87rem;color:var(--ex-muted);margin-bottom:24px;max-width:48ch}
.experience-next-actions{display:flex;gap:12px;flex-wrap:wrap}
.experience-next .btn-primary{background:#116a70;box-shadow:none;padding:13px 18px;min-height:49px;border:0}
.experience-next .btn-ghost{background:#fff;color:#1e4b5a;box-shadow:none;padding:13px 18px;border:1px solid #d7e5e9}
.experience-mini-progress{display:grid;grid-template-columns:1fr auto;gap:10px;margin-top:25px;padding-top:20px;border-top:1px solid #edf0f2;font-size:.76rem;color:#526d79}
.experience-mini-progress .experience-card-progress{grid-column:1/-1}
.experience-card-progress{display:block;background:#eef2f4;height:6px;border-radius:99px;overflow:hidden;min-width:0}
.experience-card-progress>span{display:block;height:100%;background:var(--subject-accent,#08787d);border-radius:99px;transition:width .4s ease}
.experience-sophie{position:relative;background:#ffedc0;border-radius:25px;padding:30px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;overflow:hidden}
.experience-sophie::after{content:'✦';position:absolute;right:-18px;bottom:-56px;font-size:12rem;color:#efb74455;pointer-events:none;rotate:12deg}
.experience-sophie .experience-eyebrow{color:#846b35}
.experience-sophie h3{font-size:1.75rem;color:#4b462f;margin:16px 0 12px;max-width:13ch}
.experience-sophie p{font-size:.92rem;color:#726245;max-width:29ch;margin-bottom:24px}
.experience-sophie .btn{position:relative;z-index:1;background:#fff7e3;border-color:#d6bd7d;color:#625126;min-height:46px}
.experience-shortcuts{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:22px}
.experience-shortcut{display:flex;align-items:flex-start;gap:20px;padding:24px 26px;border-radius:22px;border:1px solid #e0e5eb;transition:transform .2s,box-shadow .2s;text-align:left;text-decoration:none;color:#2c4861;min-width:0;cursor:pointer}
.experience-shortcut:hover{transform:translateY(-4px);box-shadow:0 12px 24px #22445412}
.experience-shortcut:disabled{opacity:.6;cursor:default}
.short-session{background:#eaf0ff;border-color:#dce5fa}
.short-cards{background:#f2edfa;border-color:#e7def5}
.shortcut-icon{display:grid;place-items:center;flex:none;width:48px;height:48px;border-radius:15px;font-size:1.5rem;background:#ffffffb3}
.experience-shortcut h3{font-size:1.05rem;margin:2px 0 9px;color:#28465e}
.experience-shortcut p{font-size:.8rem;color:#627388;line-height:1.5;margin-bottom:12px;max-width:34ch}
.experience-shortcut b{font-size:.8rem;font-weight:800;color:#294f7d}
.experience-learning-rhythm{padding:30px 0 12px}
.experience-learning-rhythm h3{font-size:1.1rem;margin:4px 0 22px}
.experience-learning-rhythm ol{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:26px;margin:0;padding:0}
.experience-learning-rhythm li{display:flex;align-items:flex-start;gap:13px;min-width:0}
.experience-learning-rhythm li>span{display:grid;place-items:center;flex:none;width:32px;height:32px;border-radius:50%;font-size:.8rem;font-weight:800;background:#e2eceb;color:#376b65}
.experience-learning-rhythm b{font-size:.88rem}
.experience-learning-rhythm p{font-size:.77rem;color:#5e747f;max-width:28ch;margin:6px 0 0}
.experience-panel-title{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:18px;margin-bottom:22px}
.experience-panel-title h3{font-size:1.4rem}
.experience-search{display:flex;align-items:center;gap:10px;border:1px solid #d5e3e8;background:#fff;border-radius:13px;padding:0 14px;min-width:250px;max-width:100%}
.experience-search input{background:transparent;border:0;padding:10px 0;min-width:0;width:100%;font-size:.87rem}
.experience-subject-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.experience-subject-card{display:flex;flex-direction:column;align-items:stretch;position:relative;min-height:230px;text-align:left;background:#fff;border:1px solid #dde8ec;border-radius:23px;padding:24px;overflow:hidden;transition:transform .2s,box-shadow .2s}
.experience-subject-card::before{content:'';position:absolute;inset:0 0 auto;height:4px;background:var(--subject-accent)}
.experience-subject-card:hover{transform:translateY(-5px);box-shadow:0 16px 32px #23445813;border-color:color-mix(in srgb,var(--subject-accent) 40%,#fff)}
.experience-subject-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}
.experience-subject-icon{display:grid;place-items:center;width:51px;height:51px;border-radius:17px;background:color-mix(in srgb,var(--subject-accent) 11%,#fff);font-size:1.5rem}
.experience-arrow{color:#8ba2ad;font-size:1.2rem}
.experience-subject-card>strong{font-size:1.16rem;font-weight:800;color:#233d51;margin-bottom:9px}
.experience-subject-topic{font-size:.8rem;color:#5c7280;line-height:1.45;margin-bottom:22px;min-height:34px}
.experience-subject-card .experience-card-progress{margin-top:auto}
.experience-subject-bottom{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;font-size:.65rem;color:#627985;margin-top:11px}
.experience-subject-bottom>span:last-child{color:var(--subject-accent);font-weight:800}
.experience-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.experience-stats article{background:#fff;border:1px solid #dbe6eb;border-radius:20px;padding:24px}
.experience-stats article>span{display:block;font-size:.8rem;color:#607482;margin-bottom:12px}
.experience-stats article>b{font-size:2.5rem;font-weight:800;display:block;letter-spacing:-.05em;color:#185e70;line-height:1.2}
.experience-stats small{font-size:.78rem;color:#607482;display:block;margin-top:7px}
.experience-progress-list{background:#fff;border:1px solid #dbe6eb;border-radius:22px;padding:28px;margin:22px 0}
.experience-progress-list h3{font-size:1.2rem;margin-bottom:23px}
.experience-progress-row{display:grid;grid-template-columns:140px minmax(30px,1fr) 50px;gap:20px;align-items:center;font-size:.85rem;padding:14px 0;border-bottom:1px solid #eef1f4}
.experience-progress-row:last-child{border-bottom:0}
.experience-progress-row>b{text-align:right;font-size:.8rem}
/* Auth: real clickable example instead of floating filler. */
#screen-auth{background:linear-gradient(125deg,#e5f4ed,#f2f7f5 65%,#fff2d9)!important;padding-top:52px;column-gap:72px;align-items:center}
#screen-auth .float-emoji{display:none}
#screen-auth .auth-hero{max-width:550px;text-align:left}
#screen-auth .auth-hero .tagline{max-width:20ch;margin:20px 0 28px;font-size:clamp(1.7rem,2.8vw,2.55rem);font-weight:800;color:#154549!important}
#screen-auth .auth-hero .logo-img-full{max-width:320px}
#screen-auth .auth-card{padding:35px;border-radius:28px;background:#fff;box-shadow:0 24px 55px #193e4312}
.auth-learning-preview{padding:25px;background:#ffffffb3;border:1px solid #d6e7e1;border-radius:23px;max-width:470px;box-shadow:0 15px 30px #22453e09}
.auth-example-head{display:flex;gap:13px;align-items:center;margin:18px 0}
.auth-example-avatar{width:56px;height:66px;border-radius:17px;background:#e5f2e9;display:grid;place-items:center;overflow:hidden}
.auth-example-avatar img{width:55px;height:66px;object-fit:contain}
.auth-example-head b{font-size:.8rem;color:#27584e}
.auth-example-head p{font-size:.73rem;margin-top:4px;color:#667c7b}
.auth-learning-preview h3{font-size:1.15rem;color:#1c474b;margin:12px 0 16px}
.auth-example-answers{display:grid;grid-template-columns:repeat(4,1fr);gap:9px}
.auth-example-answers button{background:#fff;border:1px solid #ccdfda;border-radius:12px;min-height:46px;font-weight:800;color:#3e6567;font-size:1rem;transition:background .18s,transform .18s}
.auth-example-answers button:hover{transform:translateY(-2px);background:#e9f4ed}
.auth-example-answers button.is-picked{background:#ffeac0;border-color:#d8b975;color:#79591d}
.auth-example-answers button.is-correct{background:#d8f0e2;border-color:#64a78d;color:#205844}
#auth-example-result{font-size:.76rem;color:#456b64;margin:14px 0 0;min-height:38px;line-height:1.5}
.auth-feature-row{display:flex;gap:10px;flex-wrap:wrap;border-top:1px solid #deebe5;padding-top:15px;margin-top:10px}
.auth-feature-row span{font-size:.64rem;color:#55746a;font-weight:700}
/* Make topics navigable, with the content taking priority over curriculum notes. */
.experience-curriculum summary{font-size:.83rem;font-weight:800;cursor:pointer;list-style-position:inside;color:#456c71}
.experience-curriculum>div{margin-top:16px}
.eduvio-main .experience-path-card{padding:28px;border-radius:24px}
.eduvio-main .topic-tile{font:inherit;text-align:left;background:var(--card);width:100%;min-height:145px;border:1px solid var(--border);padding:22px;border-radius:18px;box-shadow:none}
.eduvio-main .topic-tile:hover{border-color:#65a79d;background:#f0f8f4;transform:translateY(-3px)}
.eduvio-main .topic-tile.gold{background:#fff3d0;border-color:#e7cc83}
.eduvio-main .topic-tile .tile-icon{font-size:1.4rem;margin-bottom:12px}
.eduvio-main .topic-tile .tile-title{font-size:.94rem;font-weight:800;line-height:1.4}
.eduvio-main .topic-tile .tile-mastery{font-size:.85rem;margin-top:14px;color:#ac8429}
.eduvio-family .family-hero{background:linear-gradient(115deg,#dff2eb,#eaf6f3);border-radius:28px;padding:38px}
.eduvio-family .family-add{border-radius:25px;box-shadow:0 14px 32px #1b494509}
.eduvio-family .family-fields{gap:18px}
.eduvio-family .subject-choice:hover{transform:translateY(-2px)}
@media(max-width:1000px){.experience-hero{padding:32px;grid-template-columns:1.35fr .65fr}.experience-hero-art>img{width:185px;height:280px}.experience-hero-art .experience-float{width:50px;height:50px;font-size:1.4rem}.experience-today-grid{grid-template-columns:1.5fr 1fr}.experience-sophie{padding:25px}.experience-sophie h3{font-size:1.4rem}.experience-subject-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:750px){.eduvio-main #screen-app .main{padding:20px 18px 70px}.experience-hero{padding:27px;min-height:280px;grid-template-columns:1fr .5fr}.experience-hero h2{font-size:2rem}.experience-hero p{font-size:.87rem}.experience-hero-art>img{width:150px;height:240px;bottom:-27px}.experience-float.float-math{display:none}.experience-today-grid{grid-template-columns:1fr}.experience-sophie{min-height:210px}.experience-sophie h3{max-width:none;font-size:1.5rem}.experience-sophie p{max-width:45ch}.experience-shortcuts{gap:14px}.experience-shortcut{padding:21px 18px;gap:13px}.experience-learning-rhythm ol{gap:17px}.experience-focus-row{gap:8px}.experience-focus-row label{width:100%}.experience-hero-art .float-text{right:-16px;top:42px}.experience-tabs>button{padding:11px 17px}.experience-progress-row{grid-template-columns:115px minmax(30px,1fr) 45px;gap:12px}#screen-auth .auth-hero{max-width:520px;text-align:center}#screen-auth .auth-hero .tagline{margin:20px auto}#screen-auth .auth-learning-preview{margin:24px auto 0;text-align:left}}
@media(max-width:500px){.eduvio-main #screen-app .main{padding:16px 14px 65px}.experience-hero{padding:26px 23px;grid-template-columns:1fr;min-height:0;border-radius:24px}.experience-hero h2{font-size:2rem;max-width:16ch}.experience-hero-art{display:none}.experience-tabs{justify-content:space-between;gap:3px;margin:22px 0 18px}.experience-tabs>button{font-size:.78rem;padding:11px 13px}.experience-next{padding:25px 23px}.experience-next-head{margin-bottom:23px}.experience-next-actions{display:grid;grid-template-columns:1fr}.experience-shortcuts{grid-template-columns:1fr}.experience-learning-rhythm ol{grid-template-columns:1fr;gap:20px}.experience-learning-rhythm p{max-width:42ch}.experience-subject-grid{grid-template-columns:1fr}.experience-panel-title{align-items:stretch;flex-direction:column}.experience-search{min-width:0}.experience-stats{gap:9px}.experience-stats article{padding:17px 12px;border-radius:16px}.experience-stats article>b{font-size:1.9rem}.experience-stats article>span{font-size:.69rem;min-height:33px}.experience-progress-list{padding:22px 18px}.experience-progress-row{grid-template-columns:95px minmax(20px,1fr) 39px;gap:9px;font-size:.75rem}#screen-auth{padding:26px 16px}#screen-auth .auth-card{padding:27px 22px}.auth-learning-preview{padding:21px}.auth-feature-row span{font-size:.65rem}.experience-subject-bottom{font-size:.72rem}}
[data-theme="dark"] .experience-dashboard{--ex-text:#e2eef2;--ex-muted:#b5cbd0}
[data-theme="dark"] .eduvio-main #screen-app{background:#17212d}
[data-theme="dark"] .experience-hero{background:linear-gradient(115deg,#21453f,#254451);color:#f0f7f6}
[data-theme="dark"] .experience-hero :is(h2,p,label,.experience-eyebrow){color:#e6f4ef}
[data-theme="dark"] .experience-hero-art::before{background:#365f54}
[data-theme="dark"] .experience-next,[data-theme="dark"] .experience-subject-card,[data-theme="dark"] .experience-stats article,[data-theme="dark"] .experience-progress-list{background:#243343;border-color:#3e5568}
[data-theme="dark"] .experience-subject-card>strong,[data-theme="dark"] .experience-stats article>b{color:#d3efed}
[data-theme="dark"] .experience-subject-topic,[data-theme="dark"] .experience-subject-bottom,[data-theme="dark"] .experience-learning-rhythm p,[data-theme="dark"] .experience-stats article>span{color:#b3c7d3}
[data-theme="dark"] .experience-tabs>button{color:#c9d9e0}
[data-theme="dark"] .experience-tabs>button[aria-selected=true]{background:#427979;color:#fff}
[data-theme="dark"] .experience-card-progress{background:#3d5264}
[data-theme="dark"] .experience-search{background:#253949;border-color:#456174}
[data-theme="dark"] .experience-search input{color:#e6f1f7}
[data-theme="dark"] .experience-curriculum summary{color:#c9e7e5}
@media(prefers-reduced-motion:reduce){.experience-dashboard *,.auth-learning-preview *{animation:none!important;transition:none!important}}