/* App layer: practice arena, chapter completion, ratings, narration, and persistent theme atmosphere. */
main{position:relative;isolation:isolate}
main>*{position:relative;z-index:1}
main::before,main::after{content:"";position:fixed;pointer-events:none;z-index:0}
.theme-anime main::before{inset:50px 0 0 20rem;background:linear-gradient(90deg,var(--paper) 0%,transparent 30%),url("assets/themes/anime-hero.webp") 85% center/cover no-repeat;opacity:.075;filter:saturate(.8);animation:ambient-breathe 18s ease-in-out infinite}
.theme-anime main::after{inset:50px 0 0 20rem;background:radial-gradient(circle,color-mix(in srgb,var(--accent) 35%,transparent) 1px,transparent 1.5px);background-size:18px 18px;opacity:.16;mask-image:linear-gradient(100deg,transparent 25%,#000 90%)}
.theme-animals main::before{inset:50px 0 0 20rem;background:url("assets/themes/animals-hero.webp") 88% center/cover no-repeat;opacity:.085;filter:saturate(.65);mask-image:linear-gradient(90deg,transparent 5%,#000 62%);animation:ambient-breathe 22s ease-in-out infinite reverse}
.theme-animals main::after{right:3vw;bottom:4vh;width:13rem;height:13rem;border:2px solid color-mix(in srgb,var(--accent) 24%,transparent);border-radius:100% 0 100% 0;transform:rotate(-18deg);opacity:.38}
.theme-glass main::before{inset:5rem 3rem auto auto;width:34rem;height:34rem;border:1px solid rgba(255,255,255,.5);border-radius:45% 55% 62% 38%/48% 35% 65% 52%;background:linear-gradient(145deg,rgba(255,255,255,.32),rgba(109,151,233,.05));box-shadow:inset 0 1px 1px rgba(255,255,255,.65),0 35px 90px rgba(52,85,140,.14);backdrop-filter:blur(16px);animation:ambient-float 16s ease-in-out infinite}
.theme-glass main::after{left:24rem;bottom:8vh;width:16rem;height:16rem;border:1px solid rgba(255,255,255,.55);border-radius:50%;background:rgba(255,255,255,.09);backdrop-filter:blur(16px);animation:ambient-float 12s ease-in-out infinite reverse}
.theme-levelup main::before{inset:50px 0 0 20rem;background:linear-gradient(90deg,var(--paper),transparent 35%),url("assets/themes/level-up-hero.webp") 88% center/cover no-repeat;opacity:.11;filter:saturate(.85);animation:ambient-breathe 16s ease-in-out infinite}
.theme-levelup main::after{inset:50px 0 0 20rem;background:linear-gradient(rgba(109,91,230,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(109,91,230,.07) 1px,transparent 1px);background-size:42px 42px;mask-image:linear-gradient(90deg,transparent,#000);opacity:.7}
.theme-anime .chapter,.theme-animals .chapter,.theme-glass .chapter,.theme-levelup .chapter{margin:2.5rem auto;border:1px solid var(--line);scroll-margin-top:4.5rem}
.chapter h3[id]{scroll-margin-top:4.5rem}
.theme-anime .chapter{background:color-mix(in srgb,var(--paper) 94%,transparent);box-shadow:10px 10px 0 color-mix(in srgb,var(--line) 45%,transparent),0 28px 70px color-mix(in srgb,var(--ink) 9%,transparent)}
.theme-animals .chapter{border-radius:2rem .75rem 2rem .75rem;background:color-mix(in srgb,var(--paper) 91%,transparent);box-shadow:0 26px 70px rgba(50,70,46,.11);backdrop-filter:blur(10px)}
.theme-glass .chapter{border-color:rgba(255,255,255,.5);border-radius:2rem;background:color-mix(in srgb,var(--panel) 64%,transparent);box-shadow:inset 0 1px 0 rgba(255,255,255,.55),0 30px 80px rgba(30,63,108,.12);backdrop-filter:blur(26px) saturate(130%)}
.theme-levelup .chapter{border-color:#303a65;background:color-mix(in srgb,var(--paper) 91%,transparent);box-shadow:0 30px 90px rgba(0,0,0,.28),inset 0 0 60px rgba(79,58,183,.035);backdrop-filter:blur(9px)}
.theme-animals .study-button,.theme-animals .quiz-question button{color:#fff}.theme-animals .study-button[aria-pressed="true"]{color:#fff}

.practice-open{overflow:hidden}
.practice-open-button{border-color:var(--accent)!important;background:var(--accent)!important;color:var(--paper)!important;font-weight:800!important}
.practice-shell[hidden]{display:none}.practice-shell{position:fixed;inset:0;z-index:120;display:grid;grid-template-columns:minmax(0,1fr) minmax(20rem,58rem);grid-template-rows:minmax(0,1fr)}
.practice-backdrop{grid-column:1/-1;grid-row:1;background:rgba(3,5,12,.68);backdrop-filter:blur(5px)}
.practice-panel{grid-column:2;grid-row:1;position:relative;height:100%;min-height:0;max-height:100vh;max-height:100dvh;box-sizing:border-box;overflow:auto;padding:clamp(1.2rem,3vw,2.5rem);background:var(--paper);color:var(--ink);box-shadow:-30px 0 90px rgba(0,0,0,.3);font-family:var(--sans)}
.practice-head{display:flex;align-items:start;justify-content:space-between;gap:1rem;padding-bottom:1rem;border-bottom:1px solid var(--line)}
.practice-head h2{margin:.2rem 0;font-size:clamp(2rem,4vw,3.4rem)}.practice-close{border:1px solid var(--line);border-radius:999px;background:var(--panel);color:var(--ink);padding:.55rem .8rem;cursor:pointer}
.honor-rule{margin:1.2rem 0;padding:1rem 1.1rem;border-left:5px solid var(--warn);background:color-mix(in srgb,var(--accent-soft) 62%,var(--panel));font-weight:700}.honor-rule span{display:block;margin-bottom:.25rem;color:var(--warn);font-size:11px;letter-spacing:.13em;text-transform:uppercase}
.practice-toolbar{display:grid;grid-template-columns:minmax(12rem,1fr) auto;gap:.7rem;align-items:end;margin:1rem 0}.practice-toolbar label{font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase}.practice-toolbar select{display:block;width:100%;margin-top:.3rem;padding:.7rem;border:1px solid var(--line);background:var(--panel);color:var(--ink)}
.practice-stats{display:flex;gap:.5rem;flex-wrap:wrap;margin:.8rem 0}.practice-stats span{padding:.35rem .55rem;border:1px solid var(--line);background:var(--panel);font-size:12px;font-weight:700}
.practice-card{margin-top:1rem;padding:clamp(1rem,3vw,1.7rem);border:1px solid var(--line);background:var(--panel);box-shadow:0 16px 45px color-mix(in srgb,var(--ink) 8%,transparent)}
.practice-card fieldset{margin:0;padding:0;border:0;min-inline-size:0}
.practice-card .question-meta{display:flex;justify-content:space-between;gap:1rem;color:var(--accent);font-size:11px;font-weight:900;letter-spacing:.1em;text-transform:uppercase}.practice-card h3{margin:1rem 0;font-size:1.35rem}.practice-option{display:block;margin:.55rem 0;padding:.8rem;border:1px solid var(--line);background:var(--paper);cursor:pointer}.practice-option:has(input:checked){border-color:var(--accent);background:var(--accent-soft)}.practice-option input{margin-right:.55rem}
.confidence-field{margin:1rem 0 0!important;padding:1rem!important;border:1px dashed var(--line)!important}.confidence-field legend{padding:0 .35rem;font-size:12px;font-weight:850}.confidence-options{display:flex;gap:.45rem;flex-wrap:wrap}.confidence-options label{padding:.45rem .65rem;border:1px solid var(--line);border-radius:999px;background:var(--paper);cursor:pointer;font-size:12px;font-weight:750}.confidence-options label:has(input:checked){border-color:var(--accent);background:var(--accent-soft)}
.reason-label{display:block;margin-top:1rem;font-size:12px;font-weight:800}.practice-reason{display:block;width:100%;min-height:6rem;margin-top:.35rem;padding:.75rem;border:1px solid var(--line);background:var(--paper);color:var(--ink);font:15px/1.5 var(--sans);resize:vertical}.reason-count{display:block;margin-top:.25rem;color:var(--muted);font-size:11px}
.practice-actions{display:flex;justify-content:space-between;gap:.7rem;margin-top:1rem}.practice-actions button,.practice-start{border:1px solid var(--accent);background:var(--accent);color:var(--paper);padding:.65rem .85rem;font-weight:800;cursor:pointer}.practice-actions button:disabled{opacity:.42;cursor:not-allowed}.practice-answer{margin-top:1rem;padding:1rem;border-left:4px solid var(--accent);background:var(--accent-soft)}.practice-answer.correct{border-color:#31876d}.practice-answer.retry{border-color:var(--warn)}.practice-answer strong{display:block;margin-bottom:.35rem}.practice-answer a{display:inline-block;margin-top:.7rem;font-weight:800}.practice-progress{height:.35rem;margin-top:1rem;background:var(--line)}.practice-progress i{display:block;height:100%;background:linear-gradient(90deg,var(--accent),#7c70ef)}
.practice-summary h4{margin:1.3rem 0 .4rem}.summary-meter{height:.7rem;margin:1rem 0;background:var(--line);border-radius:999px;overflow:hidden}.summary-meter i{display:block;height:100%;background:linear-gradient(90deg,var(--accent),#31876d)}.practice-review-list{columns:2;gap:2rem}.practice-review-list li{break-inside:avoid;margin:.4rem 0}

.chapter-finish{margin-top:3.2rem;padding:1.4rem;border:1px solid var(--line);background:linear-gradient(145deg,var(--panel),color-mix(in srgb,var(--accent-soft) 48%,var(--panel)));font-family:var(--sans);box-shadow:0 18px 45px color-mix(in srgb,var(--ink) 8%,transparent)}
.chapter-finish .finish-kicker{margin:0;color:var(--accent);font-size:11px;font-weight:900;letter-spacing:.14em;text-transform:uppercase}.chapter-finish h3{margin:.4rem 0 .7rem}.finish-actions{display:flex;gap:.6rem;flex-wrap:wrap;margin:.9rem 0}.finish-actions button,.finish-actions a{border:1px solid var(--accent);background:var(--accent);color:var(--paper);padding:.6rem .8rem;text-decoration:none;font-weight:800;cursor:pointer}.finish-actions .secondary{background:transparent;color:var(--accent)}
.chapter-rating{margin-top:1rem;padding-top:1rem;border-top:1px solid var(--line)}.chapter-rating p{margin:.1rem 0 .5rem;font-size:13px;font-weight:800}.rating-buttons{display:flex;gap:.35rem}.rating-buttons button{width:2.3rem;height:2.3rem;border:1px solid var(--line);border-radius:50%;background:var(--paper);color:var(--muted);cursor:pointer;font-weight:800}.rating-buttons button.selected{border-color:var(--accent);background:var(--accent);color:var(--paper)}.rating-status{min-height:1.4em;margin:.45rem 0 0;color:var(--muted);font-size:12px}.finale-card{border-color:var(--accent);background:radial-gradient(circle at 85%,color-mix(in srgb,var(--accent) 18%,transparent),transparent 45%),var(--panel)}.finale-card h3{font-size:clamp(1.8rem,4vw,3rem)}
.narration-controls{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;margin-top:.6rem}.narration-controls button{border:1px solid var(--line);border-radius:999px;background:var(--panel);color:var(--ink);padding:.45rem .7rem;cursor:pointer;font:700 12px/1.2 var(--sans)}.narration-controls button[data-speaking="true"]{border-color:var(--accent);background:var(--accent);color:var(--paper)}.narration-controls span{color:var(--muted);font:11px/1.3 var(--sans)}
.theme-anime .chapter-finish{border:2px solid var(--line);box-shadow:6px 6px 0 var(--accent)}.theme-animals .chapter-finish{border-radius:1.4rem .5rem 1.4rem .5rem}.theme-glass .chapter-finish{border-radius:1.4rem;background:color-mix(in srgb,var(--panel) 76%,transparent);backdrop-filter:blur(18px)}.theme-levelup .chapter-finish{clip-path:polygon(0 0,calc(100% - 1rem) 0,100% 1rem,100% 100%,1rem 100%,0 calc(100% - 1rem));border-color:#4e5b93;background:linear-gradient(145deg,#111730,#1d1743)}.theme-levelup .chapter-finish .finish-kicker{color:#8fcaff}

.learning-open{overflow:hidden}.learning-open-button{display:block!important;width:100%;margin:.55rem 0 1rem;padding:.65rem;border:1px solid var(--accent);border-radius:.45rem;background:var(--accent-soft);color:var(--ink);font-weight:850;cursor:pointer}
.learning-shell[hidden]{display:none}.learning-shell{position:fixed;inset:0;z-index:121;display:grid;grid-template-columns:minmax(22rem,64rem) minmax(0,1fr);grid-template-rows:minmax(0,1fr)}.learning-backdrop{grid-column:1/-1;grid-row:1;background:rgba(3,5,12,.7);backdrop-filter:blur(5px)}.learning-panel{grid-column:1;grid-row:1;position:relative;height:100%;min-height:0;max-height:100dvh;overflow:auto;box-sizing:border-box;padding:clamp(1.2rem,3vw,2.5rem);background:var(--paper);color:var(--ink);box-shadow:30px 0 90px rgba(0,0,0,.3);font-family:var(--sans)}
.learning-head{display:flex;align-items:start;justify-content:space-between;gap:1rem;padding-bottom:1rem;border-bottom:1px solid var(--line)}.learning-head h2{margin:.2rem 0;font-size:clamp(2rem,4vw,3.5rem)}.learning-close,.learning-section-head button,.learning-actions button,.import-label{border:1px solid var(--line);border-radius:999px;background:var(--panel);color:var(--ink);padding:.6rem .8rem;font-weight:800;cursor:pointer}.evidence-warning{margin:1.2rem 0;padding:1rem;border-left:4px solid var(--warn);background:color-mix(in srgb,var(--accent-soft) 52%,var(--panel));font-size:.9rem}
.learning-stats{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:.65rem;margin:1rem 0}.learning-stats article{padding:.9rem;border:1px solid var(--line);background:var(--panel)}.learning-stats strong{display:block;font-size:clamp(1.8rem,4vw,2.7rem);line-height:1}.learning-stats small{font-size:.9rem;color:var(--muted)}.learning-stats span{display:block;margin-top:.4rem;color:var(--muted);font-size:11px;font-weight:750}
.learning-resume,.learning-route,.learning-portability,.learning-panel>section{margin:1.2rem 0;padding:1.1rem;border:1px solid var(--line);background:var(--panel)}.learning-resume:empty,.learning-route:empty{display:none}.learning-resume{display:flex;align-items:center;justify-content:space-between;gap:1rem}.learning-resume h3,.learning-route h3,.learning-portability h3,.learning-section-head h3{margin:.2rem 0}.learning-resume p,.learning-route p,.learning-portability p{margin:.25rem 0;color:var(--muted);font-size:.9rem}.learning-primary{padding:.65rem .8rem;border-radius:999px;background:var(--accent);color:var(--paper);text-decoration:none;font-weight:850;white-space:nowrap}.route-links{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:.8rem}.route-links a{padding:.35rem .5rem;border:1px solid var(--line);background:var(--paper);font-size:11px;font-weight:850;text-decoration:none}.learning-section-head{display:flex;justify-content:space-between;gap:1rem}.learning-section-head .eyebrow{margin:0}.learning-empty{color:var(--muted)}#learningBookmarks article{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.7rem 0;border-top:1px solid var(--line)}#learningBookmarks strong,#learningBookmarks span{display:block}#learningBookmarks span{color:var(--muted);font-size:11px}#learningBookmarks a{font-weight:850}
.learning-actions{display:flex;gap:.55rem;flex-wrap:wrap;margin-top:.8rem}.import-label{position:relative;overflow:hidden}.import-label input{position:absolute;inset:0;opacity:0;cursor:pointer}.import-status{min-height:1.4em;color:var(--muted);font-size:12px}
.chapter-learning-tools{display:grid;grid-template-columns:auto minmax(14rem,1fr);gap:.7rem;align-items:start;margin:1rem 0;padding:1rem 0;border-top:1px solid var(--line)}.bookmark-button{border:1px solid var(--line);border-radius:999px;background:var(--paper);color:var(--ink);padding:.55rem .75rem;font-weight:800;cursor:pointer}.bookmark-button[aria-pressed="true"]{border-color:var(--accent);background:var(--accent-soft)}.chapter-note{margin:0;padding:.65rem .8rem}.chapter-note summary{font-size:13px}.chapter-note label{display:block;margin:.6rem 0 .25rem;font-size:12px;font-weight:800}.chapter-note textarea{width:100%;min-height:7rem;padding:.65rem;border:1px solid var(--line);background:var(--paper);color:var(--ink);font:14px/1.5 var(--sans);resize:vertical}.note-status{display:block;min-height:1.2em;margin-top:.2rem;color:var(--muted);font-size:11px}
.learning-explainer{margin:.25rem 0 1rem;color:var(--muted);font-size:.9rem}.mastery-map{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.55rem}.mastery-item{position:relative;display:grid;grid-template-columns:auto 1fr;gap:.1rem .55rem;padding:.75rem;border:1px solid var(--line);background:var(--paper);text-decoration:none}.mastery-item>span{grid-row:1/4;color:var(--accent);font-size:11px;font-weight:900}.mastery-item strong{font-size:13px;line-height:1.25}.mastery-item small{color:var(--muted);font-size:10px}.mastery-item em{justify-self:start;margin-top:.25rem;padding:.15rem .35rem;border-radius:999px;background:var(--panel);color:var(--muted);font-size:9px;font-style:normal;font-weight:900;letter-spacing:.05em;text-transform:uppercase}.mastery-item.needs-review{border-color:color-mix(in srgb,var(--warn) 58%,var(--line))}.mastery-item.needs-review em{background:color-mix(in srgb,var(--warn) 12%,var(--panel));color:var(--warn)}.mastery-item.strong{border-color:color-mix(in srgb,#31876d 58%,var(--line))}.mastery-item.strong em{color:#31876d}.study-protocol ol{margin:.8rem 0 0;padding-left:1.25rem}.study-protocol li{margin:.55rem 0;font-size:.92rem}
@keyframes ambient-breathe{50%{opacity:.13;transform:scale(1.025)}}@keyframes ambient-float{50%{transform:translateY(-24px) rotate(7deg)}}

@media(max-width:880px){main::before,main::after{inset:49px 0 0!important}.theme-anime .chapter,.theme-animals .chapter,.theme-glass .chapter,.theme-levelup .chapter{margin:1rem 0;border-left:0;border-right:0;border-radius:0}.practice-shell,.learning-shell{grid-template-columns:1fr}.practice-panel,.learning-panel{grid-column:1;padding:1rem}.practice-toolbar{grid-template-columns:1fr}.practice-open-button{font-size:0}.practice-open-button::before{content:"Q&A";font-size:11px}.chapter-finish{padding:1rem}.learning-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.mastery-map{grid-template-columns:1fr}.practice-review-list{columns:1}.chapter-learning-tools{grid-template-columns:1fr}}
@media(max-width:360px){.topbar{gap:.2rem;padding:.42rem .3rem}.topbar #menuButton,.topbar #themeButton{padding:.36rem .45rem;font-size:11px}.practice-open-button{padding:.36rem .42rem!important}.edition-switcher a{width:1.5rem;height:1.5rem}.practice-card{padding:.85rem}.practice-actions{flex-direction:column}.practice-actions button{width:100%}}
@media(prefers-reduced-motion:reduce){main::before,main::after{animation:none!important}.practice-panel{scroll-behavior:auto}}
@media print{main::before,main::after,.practice-shell,.practice-open-button,.learning-shell,.learning-open-button,.chapter-finish,.narration-controls{display:none!important}.theme-anime .chapter,.theme-animals .chapter,.theme-glass .chapter,.theme-levelup .chapter{margin:0;border:0;border-radius:0;background:#fff;box-shadow:none;backdrop-filter:none}}
