/* Eduvio visual system, 27 September 2026. Decorative rules do not affect billing or learning state. */
.eduvio-main{
  --ev-display:'Manrope','Nunito',system-ui,sans-serif;
  --ev-stroke:color-mix(in srgb,var(--primary) 14%,var(--border));
  --ev-soft:color-mix(in srgb,var(--primary-light) 44%,var(--card));
  --ev-hover:color-mix(in srgb,var(--primary) 8%,var(--card));
  --ev-glow:color-mix(in srgb,var(--primary) 17%,transparent);
  --ev-elevation:0 3px 9px rgba(24,24,64,.035),0 18px 46px rgba(24,24,64,.07);
  background:radial-gradient(ellipse 850px 560px at 91% 245px,var(--ev-glow),transparent 75%),radial-gradient(ellipse 760px 550px at 0 820px,color-mix(in srgb,var(--info) 8%,transparent),transparent 75%),var(--bg);
  font-size:16px;line-height:1.55;
}
.eduvio-main :is(h1,h2,h3,.eduvio-vocab-card>strong,.price-big,.eduvio-plan-price strong){font-family:var(--ev-display);letter-spacing:-.034em}
.eduvio-main h1{font-size:clamp(1.75rem,3vw,2.35rem);line-height:1.17}
.eduvio-main h2{font-size:clamp(1.28rem,2vw,1.6rem);line-height:1.28}
.eduvio-main h3{font-size:1.09rem;line-height:1.32}
.eduvio-main .sub{line-height:1.55}
.eduvio-main .main{width:min(100%,1280px);padding:clamp(20px,2.8vw,38px) clamp(16px,3vw,42px) 78px}
.eduvio-main .topnav{min-height:72px;gap:20px;padding:12px clamp(16px,2.8vw,42px);border-bottom:1px solid var(--ev-stroke);box-shadow:0 8px 30px rgba(27,26,76,.075)}
.eduvio-main .topnav .logo{display:flex;align-items:center}
.eduvio-main .topnav .logo img{height:auto;max-width:144px}
.eduvio-main .topnav-links{gap:6px}
.eduvio-main .topnav-links .nav-item{min-height:42px;border-radius:13px;padding:10px 13px;font-size:.91rem;line-height:1.24}
.eduvio-main .topnav-links .nav-item.active{background:var(--primary-light);color:var(--primary-dark);box-shadow:inset 0 0 0 1px var(--ev-stroke)}
.eduvio-main .topnav-links .nav-item:hover{background:var(--ev-hover);color:var(--primary-dark)}
.eduvio-main .topnav-right{gap:8px}
.eduvio-main .topnav-right #eduvio-language{min-height:40px;border:1px solid var(--ev-stroke)!important;border-radius:12px!important;padding:8px 12px!important;background:var(--card)!important;color:var(--ink)!important;box-shadow:0 3px 12px rgba(24,24,64,.06)}
.eduvio-main .topbar{position:relative;isolation:isolate;overflow:hidden;gap:20px;min-height:135px;padding:clamp(22px,3.2vw,37px);margin-bottom:30px;background:linear-gradient(112deg,var(--card) 10%,var(--ev-soft) 100%);border:1px solid var(--ev-stroke);box-shadow:var(--ev-elevation)}
.eduvio-main .topbar:after{content:'';position:absolute;z-index:-1;pointer-events:none;right:-115px;top:-130px;width:350px;height:350px;border-radius:50%;border:50px solid var(--ev-glow)}
.eduvio-main .topbar .sub{max-width:62ch;font-size:.95rem;margin-top:7px}
.eduvio-main .stat-chips{gap:8px;max-width:100%}
.eduvio-main .chip{min-height:39px;border-radius:12px;padding:8px 12px;font-size:.88rem;box-shadow:0 4px 13px rgba(30,28,85,.055);background:var(--card);white-space:nowrap}
.eduvio-main .chip .lbl{font-size:.74rem;white-space:normal}
.eduvio-main .card{border:1px solid var(--ev-stroke);border-radius:23px;box-shadow:var(--ev-elevation);padding:clamp(18px,2.3vw,30px)}
.eduvio-main .grid{gap:clamp(14px,2vw,22px)}
.eduvio-main .grid-3{grid-template-columns:repeat(auto-fill,minmax(min(100%,250px),1fr))}
.eduvio-main .fach-card{border:1px solid var(--ev-stroke);padding:24px;min-height:226px;box-shadow:var(--ev-elevation);background:linear-gradient(160deg,var(--card),var(--ev-soft));transform-style:flat;will-change:auto}
.eduvio-main .fach-card:before{content:'';position:absolute;left:0;top:0;bottom:0;width:5px;background:var(--fc,var(--primary));opacity:.9}
.eduvio-main .fach-card .icon-badge{width:64px;height:64px;border-radius:20px;background:color-mix(in srgb,var(--fc,var(--primary)) 88%,var(--card));transform:none;box-shadow:0 10px 22px color-mix(in srgb,var(--fc,var(--primary)) 24%,transparent)}
.eduvio-main .fach-card:hover .icon-badge{transform:translateY(-2px) rotate(3deg)}
.eduvio-main .fach-card .emoji{font-size:2.22rem;transform:none}
.eduvio-main .fach-card h3{font-size:1.19rem;margin:9px 0 6px;transform:none}
.eduvio-main .fach-card .progressbar{height:9px;margin-top:15px;background:color-mix(in srgb,var(--fc,var(--primary)) 13%,var(--border));transform:none}
.eduvio-main .fach-card .progressbar>div{background:var(--fc,var(--primary))}
.eduvio-main .eduvio-goal-card{position:relative;overflow:hidden;border:0;background:linear-gradient(115deg,var(--primary-dark),var(--primary) 68%,color-mix(in srgb,var(--primary) 76%,var(--info)));color:#fff;box-shadow:0 22px 44px color-mix(in srgb,var(--primary) 26%,transparent)}
.eduvio-main .eduvio-goal-card:after{content:'✦';position:absolute;right:100px;top:-65px;font-size:270px;line-height:1;color:rgba(255,255,255,.065);pointer-events:none}
.eduvio-main .eduvio-goal-card h2,.eduvio-main .eduvio-goal-card p{color:#fff;position:relative;z-index:1}
.eduvio-main .eduvio-goal-card p{font-size:1.01rem;line-height:1.6}
.eduvio-main .ach-row{gap:10px}
.eduvio-main .ach{border-radius:18px;border:1px solid var(--ev-stroke);background:var(--card);box-shadow:0 8px 18px rgba(23,23,74,.05)}
.eduvio-main .topic-tile{background:linear-gradient(165deg,var(--card),var(--ev-soft));border:1px solid var(--ev-stroke);min-height:158px;padding:19px 12px;box-shadow:0 5px 18px rgba(27,25,72,.05)}
.eduvio-main .topic-tile .tile-icon{width:61px;height:61px;background:var(--primary-light)}
.eduvio-main .topic-tile .tile-title{font-size:.95rem;line-height:1.35}
.eduvio-main .kb-heading{border-color:var(--ev-stroke);color:var(--ink);font-size:1.15rem;margin:10px 0 14px}
.eduvio-main :is(.btn,.quiz-opt,.blitz-opts button){font-size:.96rem;line-height:1.35}
.eduvio-main .btn{min-height:43px;padding:11px 20px;border-radius:13px}
.eduvio-main .btn-sm{min-height:38px;padding:8px 13px;font-size:.86rem}
.eduvio-main .btn-primary{background:linear-gradient(125deg,var(--primary),var(--primary-dark));color:#fff;box-shadow:0 8px 20px color-mix(in srgb,var(--primary) 22%,transparent)}
.eduvio-main .btn-ghost{background:var(--card);border:1px solid var(--ev-stroke);color:var(--primary-dark);box-shadow:0 3px 12px rgba(30,28,85,.055)}
.eduvio-main .btn-accent{color:#2a2443;background:linear-gradient(135deg,#ffe28e,var(--accent));box-shadow:0 8px 20px color-mix(in srgb,var(--accent) 22%,transparent)}
.eduvio-main :is(.quiz-opt,.eduvio-ws-options label){border-radius:13px;min-height:48px;display:flex;align-items:center}
.eduvio-main .quiz-opt:hover{background:var(--ev-hover);transform:translateX(2px)}
.eduvio-main .badge{font-size:.76rem;padding:5px 11px}
.eduvio-main .note{border:1px solid var(--ev-stroke);border-left:4px solid var(--primary);border-radius:14px;padding:14px 16px;line-height:1.55}
.eduvio-main :is(.eduvio-plan,.plan){box-shadow:var(--ev-elevation);border-color:var(--ev-stroke);border-radius:23px}
.eduvio-main .eduvio-plan{padding:28px;background:linear-gradient(155deg,var(--card),var(--ev-soft))}
.eduvio-main .eduvio-plan.featured{border-color:var(--primary);box-shadow:0 18px 42px color-mix(in srgb,var(--primary) 16%,transparent)}
.eduvio-main .eduvio-plan h3{font-size:1.24rem}
.eduvio-main .eduvio-plan-price{font-family:var(--ev-display);letter-spacing:-.04em}
.eduvio-main .eduvio-plan .btn{margin-top:auto}
.eduvio-main .eduvio-pricing-hero{box-shadow:0 23px 50px color-mix(in srgb,var(--primary) 25%,transparent);border:1px solid color-mix(in srgb,var(--primary) 20%,transparent)}
.eduvio-main .eduvio-tool-overlay{backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.eduvio-main .eduvio-tool-panel{border:1px solid var(--ev-stroke);box-shadow:0 28px 75px rgba(16,15,45,.28)}
.eduvio-main .eduvio-ws-head{background:linear-gradient(115deg,var(--primary-light),var(--ev-soft));border:1px solid var(--ev-stroke)}
.eduvio-main .eduvio-ws-question{box-shadow:0 6px 20px rgba(26,24,77,.045);border-color:var(--ev-stroke)}
.eduvio-main .eduvio-ws-options label{border-color:var(--ev-stroke);padding:10px 14px}
.eduvio-main .eduvio-ws-options label:hover{background:var(--ev-hover)}
.eduvio-main .eduvio-vocab-main{background:linear-gradient(145deg,var(--card),var(--ev-soft) 95%)}
.eduvio-main .eduvio-vocab-overview button{background:var(--card);color:var(--ink);border:1px solid var(--ev-stroke);border-radius:16px;box-shadow:0 8px 22px rgba(26,24,77,.05)}
.eduvio-main .eduvio-vocab-overview button:hover{transform:translateY(-2px);box-shadow:var(--ev-elevation)}
.eduvio-main .eduvio-vocab-card{background:linear-gradient(125deg,var(--primary-dark),var(--primary) 65%,color-mix(in srgb,var(--primary) 65%,var(--info)))}
.eduvio-main .eduvio-vocab-meter{background:var(--card);color:var(--ink);border-color:var(--ev-stroke)}
.eduvio-main .eduvio-vocab-mode{background:var(--primary-light)}
.eduvio-main .eduvio-vocab-mode button.on{background:var(--card);color:var(--primary-dark)}
.eduvio-main .eduvio-vocab-unit-list button{border-radius:11px}
.eduvio-main .eduvio-footer{background:linear-gradient(135deg,#19173d,#262161);border-top:4px solid var(--primary);line-height:1.7}
.eduvio-main .eduvio-footer a{transition:opacity .15s,color .15s}
.eduvio-main .eduvio-footer a:hover{opacity:1;color:#fff;text-decoration:underline}
.eduvio-main :is(.btn,.fach-card,.topic-tile,.eduvio-plan,.quiz-opt,.eduvio-ws-options label,.eduvio-vocab-overview button):focus-visible{outline:3px solid var(--primary);outline-offset:3px}
.eduvio-main :is(.btn,button):disabled{cursor:not-allowed;opacity:.63;transform:none!important}
/* Admin, parent account and reset pages share typography and form rhythm. */
.eduvio-family,.eduvio-admin,.eduvio-reset{font-family:'Nunito','Segoe UI',system-ui,sans-serif}
.eduvio-family :is(h1,h2,h3),.eduvio-admin :is(h1,h2,h3),.eduvio-reset :is(h1,h2,h3){font-family:'Manrope','Nunito',system-ui,sans-serif}
.eduvio-family .card,.eduvio-admin .panel,.eduvio-reset main{box-shadow:0 4px 12px #201b5c09,0 22px 55px #201b5c10;border-color:#e6e2f6}
.eduvio-family .card h2,.eduvio-admin .panel h2{font-size:clamp(1.28rem,2vw,1.55rem)}
.eduvio-family :is(input,select){min-height:44px;border-radius:11px}
.eduvio-family #plans>*{border:1px solid #dad5f3;border-radius:18px;box-shadow:0 10px 25px #2d285416;background:linear-gradient(145deg,#fff,#faf9ff)}
.eduvio-admin nav{position:sticky;top:0;z-index:10}
.eduvio-admin nav button.on{box-shadow:0 5px 16px #352b8623}
/* Preserve text contrast in the user-selected dark theme. */
[data-theme="dark"] .eduvio-main{--ev-elevation:0 8px 32px rgba(0,0,0,.27)}
[data-theme="dark"] .eduvio-main .topnav-links .nav-item.active,[data-theme="dark"] .eduvio-main .btn-ghost{color:#e0ddff}
[data-theme="dark"] .eduvio-main .note{color:var(--ink)}
[data-theme="dark"] .eduvio-main .btn-primary{background:linear-gradient(125deg,color-mix(in srgb,var(--primary) 72%,#15142b),color-mix(in srgb,var(--primary-dark) 80%,#15142b))}
[data-theme="dark"] .eduvio-main :is(.eduvio-plan-tag,.badge:not(.orange):not(.green)){color:#e0ddff}
[data-theme="dark"] .eduvio-main .eduvio-ws-head,[data-theme="dark"] .eduvio-main .eduvio-ws-question,[data-theme="dark"] .eduvio-main .eduvio-ws-bottom,[data-theme="dark"] .eduvio-main .eduvio-vocab-meter,[data-theme="dark"] .eduvio-main .eduvio-vocab-overview button{color:var(--ink);background:var(--card)}
[data-theme="dark"] .eduvio-main .eduvio-ws-options label{color:var(--ink);background:var(--card)}
[data-theme="dark"] .eduvio-main .eduvio-ws-options label:has(input:checked){background:var(--primary-light)}
[data-theme="dark"] .eduvio-main .eduvio-ws-options label.eduvio-ws-right{color:#164b38;background:#e3f8ef}
[data-theme="dark"] .eduvio-main .eduvio-ws-options label.eduvio-ws-wrong{color:#78452a;background:#fff0e9}
[data-theme="dark"] .eduvio-main .eduvio-vocab-mode button.on{color:var(--ink)}
[data-theme="dark"] .eduvio-main .eduvio-vocab-main{background:linear-gradient(145deg,var(--card),var(--bg))}
[data-theme="dark"] .eduvio-main .eduvio-vocab-feedback.correct{color:#164b38}
[data-theme="dark"] .eduvio-main .eduvio-vocab-feedback.incorrect{color:#78452a}
[data-theme="dark"] .eduvio-main .eduvio-vocab-revealed{color:var(--ink);background:var(--primary-light)}
@media(max-width:900px){.eduvio-main .topnav{gap:8px}.eduvio-main .topbar{align-items:flex-start}.eduvio-main .eduvio-plan-grid{gap:14px}}
@media(max-width:720px){
 .eduvio-main .main{padding:18px 15px 76px}
 .eduvio-main .topnav{min-height:60px;padding:9px 12px;gap:7px}
 .eduvio-main .topnav .logo img{max-width:105px}
 .eduvio-main .topnav-links{gap:1px;min-width:0}
 .eduvio-main .topnav-links .nav-item{min-height:38px;padding:7px 9px;font-size:.83rem}
 .eduvio-main .topnav-right{gap:4px}
 .eduvio-main .topnav-right #eduvio-language{font-size:.77rem!important;max-width:110px;padding:6px!important;min-height:36px}
 .eduvio-main .topbar{min-height:0;padding:21px 18px;border-radius:20px;gap:18px;margin-bottom:22px}
 .eduvio-main .topbar:after{right:-220px}
 .eduvio-main .stat-chips{overflow-x:auto;flex-wrap:nowrap;width:100%;padding:1px 0 5px;scrollbar-width:thin}
 .eduvio-main .chip{flex:0 0 auto;font-size:.8rem;padding:7px 10px}
 .eduvio-main .grid-3{grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}
 .eduvio-main .fach-card{min-height:205px;padding:16px;border-radius:18px}
 .eduvio-main .fach-card .icon-badge{width:54px;height:54px;border-radius:16px}
 .eduvio-main .fach-card .emoji{font-size:1.9rem}
 .eduvio-main .fach-card h3{font-size:1.04rem}
 .eduvio-main .eduvio-goal-card:after{right:-90px}
 .eduvio-main .eduvio-plan{padding:22px}
 .eduvio-main .eduvio-ws-actions>div{width:100%}
 .eduvio-main .eduvio-ws-actions .btn{flex:1 1 auto}
 .eduvio-main .eduvio-footer{padding:36px 20px}
}
@media(max-width:380px){.eduvio-main .grid-3{grid-template-columns:1fr}.eduvio-main .topnav .logo img{max-width:82px}.eduvio-main .topnav-right #eduvio-language{max-width:89px}.eduvio-main .topnav-links .nav-item{padding:7px}}
@media(prefers-reduced-motion:reduce){.eduvio-main :is(.fach-card,.btn,.eduvio-plan,.quiz-opt,.eduvio-vocab-overview button){transition:none!important;animation:none!important;transform:none!important}}
@media print{.eduvio-main .eduvio-tool-overlay{backdrop-filter:none}.eduvio-main .eduvio-ws-head:after{display:none}}
/* Worksheet topic: a full row, with the selected title repeated without clipping. */
.eduvio-main .eduvio-ws-config{grid-template-columns:minmax(0,1fr) auto;column-gap:16px;row-gap:18px;align-items:end}
.eduvio-main .eduvio-ws-config label{min-width:0}
.eduvio-main .eduvio-ws-topic-field{grid-column:1/-1}
.eduvio-main .eduvio-ws-topic-field select{display:block;width:100%;min-width:0;max-width:100%;box-sizing:border-box;overflow:hidden;text-overflow:ellipsis;color:var(--ink);background:var(--card);border:1px solid var(--ev-stroke)}
.eduvio-main .eduvio-ws-topic-preview{display:block;margin-top:5px;white-space:normal;overflow-wrap:anywhere;color:var(--ink);font-size:.92rem;font-weight:650;line-height:1.5}
.eduvio-main .eduvio-ws-count-field{width:min(100%,220px)}
.eduvio-main .eduvio-ws-count-field select{width:100%;min-width:0}
.eduvio-main .eduvio-ws-config #eduvio-ws-create{width:auto;min-width:230px;white-space:normal}
.eduvio-main #eduvio-ws-status{min-height:1.5em;line-height:1.5}
.eduvio-main #eduvio-ws-status.is-loading:before{content:'';display:inline-block;width:14px;height:14px;margin-right:9px;vertical-align:-2px;border-radius:50%;border:2px solid var(--ev-stroke);border-top-color:var(--primary);animation:eduvio-ws-spin .85s linear infinite}
@keyframes eduvio-ws-spin{to{transform:rotate(360deg)}}
[data-theme="dark"] .eduvio-main .eduvio-ws-topic-preview{color:var(--ink)}
@media(max-width:720px){.eduvio-main .eduvio-ws-config{grid-template-columns:minmax(0,1fr)}.eduvio-main .eduvio-ws-topic-field{grid-column:auto}.eduvio-main .eduvio-ws-count-field{width:100%}.eduvio-main .eduvio-ws-config #eduvio-ws-create{width:100%;min-width:0}}
@media(prefers-reduced-motion:reduce){.eduvio-main #eduvio-ws-status.is-loading:before{animation:none}}
/* Existing students may enable family access without creating a new login. */
.eduvio-family #family-upgrade{max-width:690px;padding:clamp(24px,4vw,42px);background:linear-gradient(135deg,#fff 55%,#efedff);border:1px solid #d9d2fa}
.eduvio-family #family-upgrade h2{font-size:clamp(1.35rem,2.4vw,1.8rem);margin:0 0 12px}
.eduvio-family #family-upgrade p{max-width:58ch;line-height:1.6}
.eduvio-family #upgrade-button{display:inline-flex;align-items:center;justify-content:center;min-height:46px;margin:18px 0 12px;padding:11px 20px;background:linear-gradient(125deg,#5146dc,#3831a9);color:#fff}
.eduvio-family #upgrade-note{font-size:.88rem;color:#514c72}
@media(max-width:500px){.eduvio-family #upgrade-button{width:100%}}