/* BacaRia Art Edition — interface layer only. Original assessment engine retained. */
@import url('https://fonts.googleapis.com/css2?family=Baloo+2:wght@500;600;700;800&family=Nunito:wght@400;500;600;700;800;900&display=swap');
:root{--ink:#342052;--muted:#645879;--navy:#46308e;--blue:#225ee9;--yellow:#ffd336;--orange:#ff792d;--mint:#0ba98b;--bg:#f6faff;--panel:white;--line:#e3d8f5;--shadow:0 16px 38px rgba(76,34,128,.12);--purple:#712ed3;--pink:#f63bb4;--sky:#4dcaff;--green:#1bbf77;--font-scale:1;color:var(--ink);font-family:'Nunito',system-ui,sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-width:300px;background:linear-gradient(#ecfaff 0,#f9f3ff 48%,#fff9e9 100%);color:var(--ink);min-height:100vh;background-attachment:fixed;font-family:'Nunito',sans-serif}body:before{content:"";pointer-events:none;position:fixed;inset:0;background:radial-gradient(ellipse at 5% 20%,rgba(64,210,255,.12),transparent 45%),radial-gradient(ellipse at 95% 70%,rgba(255,148,46,.12),transparent 45%);z-index:-1}button,input,textarea,select{font:inherit}button{cursor:pointer}a{color:var(--blue)}button:disabled{cursor:not-allowed;opacity:.6}button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline:4px solid #ffbb00;outline-offset:3px}button:active{transform:translateY(2px) scale(.99)}
.shell{display:flex;flex-direction:column;min-height:100vh}.side{position:sticky;top:0;z-index:30;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:8px clamp(14px,2.7vw,52px);background:rgba(255,254,250,.94);border-bottom:3px solid #ffe0a3;box-shadow:0 7px 25px rgba(70,32,112,.09);backdrop-filter:blur(14px)}.brand{display:flex;align-items:center;gap:8px;min-width:182px}.brand img{width:140px;height:58px;object-fit:contain;object-position:center}.brand-sub{display:block;color:#765bbb;font-weight:1000;font-size:9px;letter-spacing:1px}.navs{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.navbtn{display:inline-flex;gap:8px;align-items:center;justify-content:center;padding:11px 14px;border-radius:16px;border:2px solid transparent;background:transparent;color:#5b4681;font-weight:1000;font-size:13px;white-space:nowrap;transition:.2s}.navbtn svg{width:18px;height:18px;flex-shrink:0;stroke:currentColor;stroke-width:2.4;fill:none;stroke-linecap:round;stroke-linejoin:round}.navbtn:hover{background:#fff0ce;border-color:#ffe1a0;transform:translateY(-2px)}.navbtn.active{background:linear-gradient(180deg,#ffd65f,#ffac35);border-color:#ffcf71;color:#702b37;box-shadow:0 5px 0 #d88d24}.header-utilities{display:flex;align-items:center;gap:8px}.header-utilities .btn{padding:9px 11px}.header-school{font-weight:900;font-size:12px;color:#573b97;max-width:230px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.school-mark{width:35px;height:35px;border-radius:50%;object-fit:cover;border:2px solid #fff;box-shadow:0 2px 10px #b49ace55}.mobile-brand{display:none}.main{width:min(100%,1680px);margin:0 auto;padding:22px clamp(16px,2.4vw,48px) 70px;flex:1}.app-content{animation:page-enter .4s cubic-bezier(.16,.8,.3,1) both}@keyframes page-enter{from{opacity:.3;transform:translateY(15px)}to{opacity:1;transform:none}}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;border:2px solid transparent;border-radius:19px;padding:12px 19px;font-weight:1000;line-height:1.2;transition:transform .2s,filter .2s,box-shadow .2s;white-space:normal;text-align:center}.btn:hover{filter:brightness(1.035);transform:translateY(-3px)}.btn-primary{background:linear-gradient(#30bfff,#1678e6);color:#fff;border-color:#83ddff;box-shadow:0 6px 0 #075bab,0 9px 19px rgba(8,81,169,.2)}.btn-dark{background:linear-gradient(#8a3eee,#6022bb);color:white;border-color:#a980ff;box-shadow:0 6px 0 #3e157d}.btn-accent{background:linear-gradient(#ffe759,#ffaf24);color:#532165;border-color:#fff4b7;box-shadow:0 6px 0 #d67818}.btn-soft{background:linear-gradient(#e0d2ff,#c9e5ff);color:#4a21a0;border-color:#fff;box-shadow:0 5px 0 #9b86df}.btn-outline{background:#fff;color:#532c8b;border-color:#d7c5ee;box-shadow:0 5px 0 #cab3e2}.btn-danger{background:#fff0e9;color:#b64c31;border-color:#ffd4bb}.btn-small{padding:9px 13px;border-radius:13px;font-size:12px}.btn-success{background:linear-gradient(#8dfb5d,#28ca4b);color:#125126;border-color:#d6ffa6;box-shadow:0 6px 0 #15903e}.btn:disabled{box-shadow:none}.hidden{display:none!important}
.panel{background:white;border:2px solid #efdefb;border-radius:29px;padding:clamp(18px,2vw,28px);box-shadow:var(--shadow)}.section-title{display:flex;justify-content:space-between;align-items:center;gap:15px;margin:30px 0 16px}.section-title h2,.page-head h1{font-family:'Baloo 2','Trebuchet MS',system-ui,sans-serif,'Nunito',system-ui;font-weight:800;line-height:1.1;color:#5420a0;letter-spacing:-.7px}.section-title h2{font-size:clamp(25px,2.6vw,37px);margin:0}.section-title p{margin:5px 0 0;font-size:13px;color:var(--muted)}.small-marker{background:#702cbd;color:#fff;border-radius:22px;padding:8px 14px;font-size:12px;font-weight:1000}.overline{font-weight:1000;letter-spacing:1.4px;font-size:11px;color:#7952b3}.row{display:flex;gap:11px;flex-wrap:wrap;align-items:center}.two-col{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:18px}.formgrid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.field label{display:block;margin-bottom:7px;color:#543f79;font-weight:1000;font-size:13px}.input,.select,.textarea{width:100%;border:2px solid #dcd0ed;background:#fff;border-radius:15px;padding:13px 14px;color:#2d2258;outline:none;font-weight:800}.input:focus,.select:focus,.textarea:focus{border-color:#784cde;box-shadow:0 0 0 4px rgba(161,127,241,.2)}.textarea{min-height:110px;resize:vertical;line-height:1.5;font-weight:700}.hint{font-size:12px;line-height:1.6;color:#6c6281}.callout{padding:15px;background:#fff4c7;border:1px solid #ffe39d;border-radius:17px;font-size:12px;line-height:1.6;color:#80500a}.callout.teal{background:#e0fff8;border-color:#abf4e2;color:#176e66}.alert{padding:14px 16px;border-radius:17px;line-height:1.6;font-size:13px}.alert.info{background:#e8f7ff;color:#24658d;border:1px solid #bce7ff}.mt12{margin-top:12px}.mt20{margin-top:20px}.mb12{margin-bottom:12px}.mb20{margin-bottom:20px}.footer-note{margin-top:20px;padding:14px 18px;border:1px solid #e4d9fa;background:rgba(255,255,255,.85);color:#716482;line-height:1.6;font-size:12px;border-radius:15px}.tag{display:inline-flex;align-items:center;border-radius:100px;padding:10px 14px;background:#fff1b8;color:#855304;font-weight:1000;font-size:12px;border:2px solid #ffe089}
/* Hero: image-driven illustration, real interactive controls */
.landing-hero{min-height:400px;border:5px solid #fff;position:relative;isolation:isolate;overflow:hidden;border-radius:37px;background:linear-gradient(115deg,#3ba5fc,#a064ef 56%,#fb8ebd);box-shadow:0 20px 0 #eac4fa,0 26px 55px rgba(101,42,154,.18)}.landing-hero:before{content:"";position:absolute;inset:0;z-index:-2;background:url('assets/scenery.webp') center 30%/cover;filter:blur(5px) saturate(1.12);transform:scale(1.035)}.landing-hero:after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(95deg,rgba(38,21,105,.94) 0%,rgba(62,32,144,.89) 40%,rgba(84,35,161,.2) 72%,rgba(66,76,157,.1) 100%)}.landing-inner{min-height:400px;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);align-items:center;gap:10px;padding:35px clamp(20px,3vw,49px)}.hero-copy{position:relative;z-index:2;color:white;max-width:710px}.hero-kicker{display:inline-block;border-radius:999px;background:#fff0ab;color:#6d2b94;font-weight:1000;padding:9px 15px;letter-spacing:1px;font-size:12px;box-shadow:0 5px 0 #d79b36}.hero-copy h1{font-family:'Baloo 2','Trebuchet MS',system-ui,sans-serif,system-ui;font-size:clamp(36px,4.9vw,74px);line-height:.98;margin:24px 0 12px;color:#fff;text-shadow:0 5px 0 #4a1d86,0 8px 18px rgba(18,9,78,.2);letter-spacing:-1.7px}.hero-copy h1 em{color:#ffe269;font-style:normal}.hero-copy p{font-size:clamp(14px,1.1vw,18px);line-height:1.55;color:#fffcf4;max-width:595px;font-weight:800}.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:18px}.hero-actions .btn{font-size:16px;padding:15px 21px}.hero-art{display:block;width:min(100%,575px);height:auto;max-height:356px;object-fit:contain;object-position:center;justify-self:end;position:relative;z-index:1;border:4px solid rgba(255,255,255,.48);border-radius:30px;box-shadow:0 22px 35px rgba(30,9,84,.3);transform:rotate(1.6deg);animation:hero-reveal .75s .2s both}@keyframes hero-reveal{from{transform:translate(24px,20px) rotate(4deg) scale(.96);opacity:0}to{transform:translate(0,0) rotate(1.6deg) scale(1);opacity:1}}.hero-feature-bar{display:flex;gap:12px;flex-wrap:wrap;margin-top:23px}.hero-feature{background:rgba(255,255,255,.94);color:#5b25a4;border-radius:15px;padding:10px 13px;font-weight:1000;font-size:12px;box-shadow:0 7px 0 rgba(62,26,136,.25)}.hero-feature b{color:#108976}
/* Hand-illustrated menu art cards — each is a functional button */
.gallery-title{margin-top:46px}.menu-gallery{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:13px}.art-menu{display:block;position:relative;overflow:hidden;min-width:0;padding:0;border:4px solid #fff;background:white;border-radius:26px;box-shadow:0 7px 0 #bd9af3,0 17px 30px #4d318b20;transition:transform .18s,box-shadow .18s}.art-menu img{display:block;width:100%;aspect-ratio:1.19;object-fit:cover;object-position:center;transform:scale(1.025);transition:transform .35s}.art-menu:hover{transform:translateY(-8px) rotate(-1deg);box-shadow:0 10px 0 #b987f3,0 23px 34px #4d318b38}.art-menu:hover img{transform:scale(1.09)}.art-menu:focus-visible{outline-offset:5px}.menu-small-label{position:absolute;right:9px;top:9px;background:rgba(255,255,255,.92);border:1px solid #fff;border-radius:30px;box-shadow:0 5px 12px rgba(38,4,74,.15);font-size:10px;font-weight:1000;color:#6f2eb5;padding:5px 8px}
/* student setup + levels */
.home-setup{scroll-margin-top:110px;display:grid;grid-template-columns:1.12fr .88fr;gap:20px}.setup-paper{background:linear-gradient(125deg,#fffaf2,#fff 70%);border:3px solid #f8d38e}.setup-title{font-family:'Baloo 2','Trebuchet MS',system-ui,sans-serif;font-size:28px;color:#722fbe;font-weight:800;margin:0 0 15px}.setup-paper .btn-primary{font-size:17px}.selected-stage{background:#f4ebff;border:2px dashed #d8bdf8;border-radius:19px;margin-top:16px;padding:17px}.selected-stage strong{font-size:23px;color:#5f2ba6}.selected-stage small{display:block;color:#6f6090;margin-top:4px}.stats-card{background:linear-gradient(180deg,#fff,#f4fdff);border:3px solid #cdf1ff}.stats-top{display:flex;gap:15px;align-items:center}.stats-top img{width:100px;height:105px;object-fit:cover;object-position:center 35%;border:4px solid #fff;border-radius:20px;box-shadow:0 9px 17px #5c80a832}.home-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:16px}.mini-stat{background:#fff5dc;border:2px solid #ffe4a8;border-radius:18px;padding:13px;text-align:center}.mini-stat:nth-child(2){background:#e6fff6;border-color:#aef4dc}.mini-stat:nth-child(3){background:#f1e8ff;border-color:#ddc4ff}.mini-stat b{font-family:'Baloo 2','Trebuchet MS',system-ui,sans-serif;display:block;font-size:32px;line-height:1;color:#6520ad}.mini-stat span{font-size:11px;color:#624c8a;font-weight:900}.level-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:13px}.level-card{text-align:center;background:white;min-width:0;border:3px solid #eedbfb;border-radius:23px;padding:12px 9px 15px;box-shadow:0 7px 0 #dbbcf5,0 13px 24px #592a9120;transition:transform .18s,box-shadow .18s;position:relative}.level-card:hover{transform:translateY(-6px)}.level-card.chosen{border-color:#ffb636;background:#fff8df;box-shadow:0 7px 0 #e7a01a,0 16px 20px #ffa82155}.level-card img{height:79px;width:100%;object-fit:contain}.level-card strong{display:block;font-family:'Baloo 2','Trebuchet MS',system-ui,sans-serif,system-ui;font-size:17px;line-height:1.08;color:#57249a;margin:8px 0 5px}.level-card small{display:block;color:#675976;font-size:10px;line-height:1.3;font-weight:800}.level-card .check{display:inline-block;margin-top:7px;padding:5px 9px;border-radius:999px;background:#22bc76;color:white;font-size:11px;font-weight:1000}
/* Reading environment */
.reading-wrap{max-width:1600px;margin:auto}.reading-top{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:9px;margin-bottom:17px}.reading-banner{background:linear-gradient(100deg,#4e2aaf,#a02fda 70%,#fa71ae);padding:16px 22px;border-radius:24px;border:3px solid #fff;box-shadow:0 7px 0 #cf9cfa;text-align:center;color:white;position:relative;overflow:hidden}.reading-banner:before{content:"";inset:0;position:absolute;background:url('assets/reading-scene.webp') center 22%/cover;opacity:.2}.reading-banner h1{position:relative;font-family:'Baloo 2','Trebuchet MS',system-ui,sans-serif;font-size:clamp(27px,3vw,43px);margin:0;line-height:1.1;text-shadow:0 3px 0 #542798}.reading-banner p{position:relative;margin:3px 0 0;font-size:13px;font-weight:900}.reading-layout{display:grid;grid-template-columns:clamp(165px,17vw,245px) minmax(0,1fr) clamp(165px,17vw,245px);gap:15px;align-items:stretch;margin-top:19px}.side-illustration{min-width:0;background:#fff;border:3px solid #fff;border-radius:29px;box-shadow:0 8px 0 #c6a4ee,0 15px 28px #60439f2b;overflow:hidden;align-self:start}.side-illustration img{display:block;width:100%;height:clamp(188px,25vw,300px);object-fit:cover;object-position:center 35%}.side-illustration .bubble{padding:14px;color:#642daa;font-weight:1000;text-align:center;line-height:1.3;background:#fff8d4;font-size:14px}.side-illustration .speaker-caption{background:#6327b7;color:white;font-size:14px;font-weight:1000;padding:9px;text-align:center}.coach-art{animation:coach-bob 5.5s ease-in-out infinite}.coach-art img{height:260px;object-fit:cover}@keyframes coach-bob{0%,100%{transform:rotate(0)}31%{transform:rotate(-2deg)}56%{transform:rotate(1deg)}}.reading-board{background:#fff;border:4px solid #ffd26f;box-shadow:0 10px 0 #dcaa44,0 21px 40px #5e33832b;border-radius:32px;overflow:hidden}.reading-board .ribbon{height:13px;background:repeating-linear-gradient(90deg,#ffca4f 0 60px,#f858af 60px 120px,#7b50e6 120px 180px,#42c3f7 180px 240px,#67c971 240px 300px)}.reading-content{padding:clamp(17px,2.5vw,37px)}.reading-title{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}.reading-title h2{margin:5px 0 0;font-family:'Baloo 2','Trebuchet MS',system-ui,sans-serif;font-size:clamp(24px,2.7vw,38px);color:#6c23b3;line-height:1.2}.reading-label{padding:8px 12px;background:#e7fce3;color:#188f4e;border:2px solid #aff0c0;border-radius:999px;font-size:11px;font-weight:1000}.story{font-family:'Nunito',sans-serif;font-weight:900;line-height:1.56;font-size:calc(clamp(27px,3.1vw,53px) * var(--font-scale));white-space:pre-wrap;overflow-wrap:anywhere;color:#2c214b;min-height:125px;margin:16px 0 22px;background:linear-gradient(#fffdf4,#fff9ee);border:2px solid #fde8b5;border-radius:24px;padding:clamp(18px,2vw,28px);box-shadow:inset 0 0 0 6px #fffefa}.story .word{padding:0 2px;border-radius:6px;transition:background-color .2s}.story .ok{background:#d1f9de;color:#0a7a53}.story .wrong{background:#ffe0d2;color:#b9362f}.story .current{box-shadow:inset 0 -6px #ffd263}.reading-feedback{display:grid;grid-template-columns:1fr 1fr 1.45fr;gap:11px}.meter{background:#f0e9ff;border:2px solid #ded0ff;padding:12px;border-radius:18px}.meter small{font-weight:1000;font-size:10px;color:#714bae;letter-spacing:.8px}.meter b{display:block;color:#4f249b;font-family:'Baloo 2','Trebuchet MS',system-ui,sans-serif;font-size:29px;line-height:1.2;margin-top:6px}.listen{display:flex;align-items:center;gap:10px}.bars{display:flex;align-items:center;gap:3px;height:24px}.bars i{display:block;height:6px;width:5px;border-radius:8px;background:#12a9d7}.listening .bars i{animation:wave .53s infinite alternate ease-in-out}.bars i:nth-child(2){animation-delay:.12s}.bars i:nth-child(3){animation-delay:.2s}.bars i:nth-child(4){animation-delay:.31s}.bars i:nth-child(5){animation-delay:.38s}@keyframes wave{to{height:24px}}.mic-signal{height:12px;background:#e7e4f7;border-radius:999px;overflow:hidden;margin:7px 0 5px}.mic-signal span{display:block;width:0;height:100%;background:linear-gradient(90deg,#25b46d,#ffe23a,#f43aa1);border-radius:999px;transition:width .15s}.live-transcript{background:#edfaff;border:2px solid #ccecff;padding:14px 17px;border-radius:15px;font-size:13px;line-height:1.6;color:#4b6379;margin-top:13px;min-height:45px}.diagnostic{background:#f6edff;border:1px dashed #cbb3ea;border-radius:14px;padding:11px 14px;font-size:12px;color:#6b5686;line-height:1.5;margin-top:10px}.reading-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:25px}.reading-actions .btn{font-size:18px;padding:15px 26px}.status-line{font-size:13px;line-height:1.6;text-align:center;margin:20px auto;background:rgba(255,255,255,.85);padding:14px;border-radius:17px;color:#6d5d82;max-width:1000px}
/* Results */
.page-head{margin:0 0 23px}.page-head .crumb{color:#7a51c3;font-size:11px;font-weight:1000;letter-spacing:1.5px}.page-head h1{font-size:clamp(29px,3.2vw,47px);margin:8px 0}.page-head p{margin:0;color:#756685;line-height:1.6;font-size:14px}.result-hero{display:grid;grid-template-columns:minmax(0,1fr) 285px;gap:25px;padding:23px 27px;position:relative;background:linear-gradient(115deg,#5630be,#9946e1 68%,#ff8bba);color:white;border:4px solid white;box-shadow:0 9px 0 #c99cff,0 22px 38px #55228935;border-radius:30px;overflow:hidden;margin-bottom:20px}.result-hero:before{content:"";position:absolute;inset:0;background:url('assets/scenery.webp') center 30%/cover;opacity:.13}.result-hero>*{position:relative}.result-hero h1{font-family:'Baloo 2','Trebuchet MS',system-ui,sans-serif;font-size:clamp(30px,3.1vw,48px);line-height:1;margin:10px 0;color:#fff;text-shadow:0 3px 0 #542199}.result-hero p{color:#fff7ce;font-weight:800;line-height:1.6;margin:0}.result-hero img{width:100%;height:175px;object-fit:cover;object-position:center 30%;border-radius:22px;border:3px solid #fff;box-shadow:0 7px 17px #45237c66}.result-score{background:linear-gradient(135deg,#552ac9,#8034e3 60%,#b654f6);color:white;border-radius:27px;border:4px solid #fff;padding:28px;display:grid;grid-template-columns:auto 1fr;gap:22px;align-items:center;box-shadow:0 8px 0 #aa8bde,0 15px 29px #5b368d30}.score-ring{height:162px;width:162px;display:grid;place-items:center;position:relative;border-radius:50%;background:conic-gradient(#ffdd4a var(--degree,0deg),#ffffff45 0);box-shadow:0 8px 20px #4f168677}.score-ring:before{content:"";position:absolute;inset:12px;border-radius:50%;background:#491fab}.score-ring span{position:relative;z-index:1;text-align:center;font-family:'Baloo 2','Trebuchet MS',system-ui,sans-serif;font-size:54px;line-height:1.05;font-weight:800;color:#fff}.score-ring small{display:block;font:900 10px 'Nunito';letter-spacing:.7px;color:#ffe7b9}.result-score h2{font-family:'Baloo 2','Trebuchet MS',system-ui,sans-serif;font-size:33px;margin:5px 0}.result-score p{color:#efe9ff;line-height:1.6;margin:0}.automatic-score{padding:15px 17px;border-radius:17px;background:#e3ffe8;border:2px solid #a2f2ad;color:#246b34;margin:16px 0;font-size:13px;line-height:1.5}.automatic-score p{margin:5px 0 0}.speech-unsupported{padding:16px;border-radius:17px;background:#fff0e6;border:2px solid #ffcaaf;color:#864535;margin:16px 0;line-height:1.5}.metric-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px}.metric-card{background:#fff;border:2px solid #eadffa;border-radius:21px;padding:17px;box-shadow:0 6px 0 #e3d3f6}.metric-card small{font-size:10px;letter-spacing:1px;color:#7b53ae;font-weight:1000}.metric-card b{display:block;font-family:'Baloo 2','Trebuchet MS',system-ui,sans-serif;font-size:31px;line-height:1.1;color:#5f27ad;margin:7px 0}.metric-card span{font-size:11px;line-height:1.4;color:#806b94}.result-row{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:17px}.result-row .panel h3{font-family:'Baloo 2','Trebuchet MS',system-ui,sans-serif;font-size:23px;line-height:1.2;color:#6227ac}.teacher-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.answer-options{display:grid;gap:8px}.answer-item{display:flex;align-items:center;gap:8px;background:#f8f4ff;border:1px solid #dfd0f2;border-radius:13px;padding:10px 13px;font-weight:700;font-size:13px}
/* Teacher reports and bank */
.report-hero,.bank-hero{display:flex;gap:20px;align-items:center;justify-content:space-between;padding:24px 28px;border:4px solid #fff;box-shadow:0 8px 0 #86bbf7,0 20px 32px #4e47953b;border-radius:29px;background:linear-gradient(120deg,#1382ee,#5643db 52%,#aa57e6);color:white;margin-bottom:22px;overflow:hidden}.report-hero h1,.bank-hero h1{font-family:'Baloo 2','Trebuchet MS',system-ui,sans-serif;font-size:clamp(31px,3.5vw,50px);line-height:1.05;margin:5px 0 9px;color:white;text-shadow:0 3px #4432ad}.report-hero p,.bank-hero p{max-width:660px;color:#fffbed;font-weight:800;margin:0;line-height:1.55}.report-hero img,.bank-hero img{height:145px;width:175px;object-fit:cover;object-position:center 22%;border:3px solid white;border-radius:23px;box-shadow:0 9px 17px #4224a95e}.record-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:8px}.table-wrap{max-width:100%;overflow:auto}.data-table{width:100%;border-collapse:separate;border-spacing:0 8px;min-width:930px}.data-table th{font-size:11px;color:#6f43a9;padding:9px 10px;text-align:left;background:#f1e9fc;font-weight:1000}.data-table td{padding:13px 10px;background:#faf7ff;font-size:12px;font-weight:800;color:#49365e}.data-table tr:nth-child(odd) td{background:#fffaf0}.data-table tbody tr:hover td{background:#e9fcff}.data-table th:first-child,.data-table td:first-child{border-radius:12px 0 0 12px}.data-table th:last-child,.data-table td:last-child{border-radius:0 12px 12px 0}.pill{background:#dff9e6;border:1px solid #b9f5c7;border-radius:50px;color:#167a4e;padding:6px 10px;font-weight:1000;font-size:11px}.pill.warn{background:#fff3c4;color:#905d07;border-color:#ffe097}.pill.low{background:#ffe2d8;color:#9c342b;border-color:#ffcbb9}.empty{background:#fff9ed;border:2px dashed #f5d5a2;text-align:center;padding:27px;border-radius:21px}.empty h3{color:#5b279a}.bank-item{background:#fff;border:2px solid #ebdaf9;border-radius:20px;overflow:hidden;margin-bottom:13px;box-shadow:0 5px 0 #e1d4f3}.bank-item summary{padding:17px 20px;display:flex;align-items:center;justify-content:space-between;gap:15px;background:#f8f1ff;font-weight:1000;color:#5c25ab;cursor:pointer;list-style:none}.bank-item summary::-webkit-details-marker{display:none}.bank-item[open] summary{background:#ffe7a6}.bank-body{padding:20px;display:grid;gap:12px}.info-columns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:17px}.info-box{border:2px solid #e9d8f7;border-radius:22px;background:white;padding:18px 22px;box-shadow:0 6px 0 #e6d7f6;font-size:13px;line-height:1.7;color:#5b506c}.info-box h3{margin-top:0;color:#642ba8;font-family:'Baloo 2','Trebuchet MS',system-ui,sans-serif;font-size:21px}.info-box ul,.info-box ol{padding-left:18px}.simple-chart{display:flex;align-items:flex-end;justify-content:space-between;gap:8px;min-height:190px;border-bottom:2px solid #e6d8f3;padding:20px 8px 0}.simple-chart .col{display:flex;align-items:center;justify-content:flex-end;flex-direction:column;flex:1;min-width:35px;height:170px;gap:4px}.simple-chart .bar{width:min(100%,48px);border-radius:12px 12px 3px 3px;background:linear-gradient(180deg,#ffb84e,#ff668e);min-height:4px;box-shadow:0 3px 8px #b47bbc33}.simple-chart .col:nth-child(2) .bar{background:linear-gradient(180deg,#f885e8,#993dd7)}.simple-chart .col:nth-child(3) .bar{background:linear-gradient(180deg,#3bc3f7,#1978dc)}.simple-chart .col:nth-child(4) .bar{background:linear-gradient(180deg,#7ceb6e,#17a85b)}.simple-chart .col:nth-child(5) .bar{background:linear-gradient(180deg,#ffe561,#ef9b21)}.simple-chart .col:nth-child(6) .bar{background:linear-gradient(180deg,#b494ff,#5d49d0)}.simple-chart strong{color:#672fb5;font-size:13px}.simple-chart label{font-size:10px;color:#685a80;font-weight:1000;text-align:center}
/* Settings and UI controls */
.settings-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:18px}.settings-item{display:flex;justify-content:space-between;align-items:center;gap:18px;border:1px solid #e8dbf4;border-radius:17px;padding:14px 16px;margin-top:11px;background:#fcfaff}.settings-item label{font-size:14px;font-weight:1000;color:#553582}.settings-item small{display:block;color:#857a97;font-size:12px;font-weight:800;line-height:1.5}.settings-item input[type=checkbox]{appearance:none;width:48px;height:27px;background:#cfbfdc;border-radius:20px;position:relative;cursor:pointer;flex-shrink:0;transition:background .2s}.settings-item input[type=checkbox]:before{content:"";position:absolute;top:4px;left:4px;width:19px;height:19px;border-radius:50%;background:white;box-shadow:0 1px 3px #33204b66;transition:transform .2s}.settings-item input:checked[type=checkbox]{background:#23b873}.settings-item input:checked[type=checkbox]:before{transform:translateX(21px)}.settings-logo-preview{border:2px dashed #d6b9f0;background:#fff;border-radius:16px;padding:15px;text-align:center;margin-top:12px}.settings-logo-preview img{max-height:100px;max-width:150px;object-fit:contain}.settings-help{font-size:12px;line-height:1.65;color:#6d6280}
.toast{position:fixed;right:25px;bottom:25px;max-width:min(440px,calc(100vw - 36px));padding:16px 21px;background:#4e2389;color:#fff;border-radius:18px;box-shadow:0 16px 38px #3f187b55;transform:translateY(80px);opacity:0;pointer-events:none;z-index:100;transition:transform .3s,opacity .3s;font-size:13px;font-weight:900}.toast.show{transform:none;opacity:1}
/* Accessibility options */
body.reduced-motion *,body.reduced-motion *:before,body.reduced-motion *:after{scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important}body.reading-large{--font-scale:1.2}body.reading-xl{--font-scale:1.35}body.focus-mode .reading-layout{grid-template-columns:minmax(0,1fr)}body.focus-mode .side-illustration{display:none}body.focus-mode .reading-banner{background:#4f2ead}
@media(max-width:1300px){.header-school{display:none}.side{flex-wrap:wrap}.brand{min-width:0}.navs{flex:1;justify-content:center}.menu-gallery{grid-template-columns:repeat(5,minmax(0,1fr))}.level-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.reading-layout{grid-template-columns:175px minmax(0,1fr)}.reading-layout>.side-illustration:last-child{display:none}}
@media(max-width:970px){.side{gap:4px;flex-wrap:wrap;justify-content:center}.brand{flex:1}.navs{order:3;width:100%;justify-content:center;flex-wrap:nowrap;overflow-x:auto;padding:4px 0 8px}.navbtn{padding:9px 12px;font-size:12px}.header-utilities{order:2}.landing-inner{grid-template-columns:1fr;padding:26px}.landing-hero:after{background:linear-gradient(100deg,rgba(41,13,118,.91),rgba(89,46,152,.77))}.hero-art{justify-self:center;max-height:260px;width:min(90%,460px)}.landing-hero{min-height:0}.menu-gallery{grid-template-columns:repeat(3,minmax(0,1fr))}.home-setup{grid-template-columns:1fr}.reading-layout{grid-template-columns:1fr}.side-illustration{display:none}.result-row,.settings-grid,.two-col{grid-template-columns:1fr}.info-columns{grid-template-columns:1fr}}
@media(max-width:630px){.main{padding:13px 11px 38px}.side{padding:4px 9px}.brand img{width:110px;height:48px}.navbtn{min-width:70px;gap:4px;flex-direction:column;border-radius:12px;font-size:10px;padding:8px 9px}.navbtn svg{width:17px;height:17px}.header-utilities .btn{font-size:12px}.landing-inner{padding:22px 17px}.landing-hero{border-radius:25px}.hero-copy h1{font-size:42px;margin:17px 0 8px}.hero-copy p{font-size:14px}.hero-kicker{font-size:10px}.hero-feature-bar{gap:6px}.hero-feature{font-size:10px;padding:7px}.hero-art{max-height:200px}.menu-gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}.art-menu{border-radius:18px}.menu-small-label{display:none}.section-title{align-items:flex-start;flex-direction:column;margin:24px 0 12px}.section-title h2{font-size:26px}.formgrid,.metric-grid,.reading-feedback,.teacher-grid{grid-template-columns:1fr}.level-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.level-card strong{font-size:16px}.home-stats{grid-template-columns:repeat(3,1fr)}.mini-stat{padding:8px 5px}.mini-stat b{font-size:26px}.mini-stat span{font-size:10px}.panel{padding:18px}.reading-banner{padding:14px 9px}.reading-content{padding:15px}.story{font-size:calc(25px * var(--font-scale));line-height:1.62;padding:14px;min-height:100px}.reading-actions .btn{width:100%}.result-score{grid-template-columns:1fr;text-align:center}.score-ring{margin:0 auto}.result-hero{grid-template-columns:1fr}.result-hero img{height:100px;width:100%;object-position:center 25%}.result-score h2{font-size:26px}.report-hero,.bank-hero{padding:18px}.report-hero img,.bank-hero img{display:none}}
@media (prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}
/* Cross-browser layout and text legibility refinements */
.side{flex-direction:row!important}.brand{padding:0!important}.navs{flex-direction:row}.brand-sub{letter-spacing:.4px}
.story{font-size:clamp(27px,3.1vw,53px)!important}
body.reading-large .story{font-size:clamp(33px,3.8vw,64px)!important}
body.reading-xl .story{font-size:clamp(38px,4.4vw,75px)!important}
.navbtn{width:auto!important;flex:0 0 auto;text-align:center}
.navs{flex-wrap:nowrap!important;width:auto;min-width:0}
.side{min-height:76px}
@media(max-width:1050px){.side{flex-wrap:wrap;justify-content:center}.navs{order:3;width:100%;overflow:auto;justify-content:center}.brand{flex:1}.header-utilities{order:2}}
@media(max-width:630px){
.side{display:grid!important;grid-template-columns:minmax(0,1fr) auto;align-items:center;min-height:0;gap:4px 8px;padding:7px 10px}
.brand{grid-column:1;min-width:0}.header-utilities{grid-column:2;order:unset}.header-school{display:none}.navs{grid-column:1/-1;order:unset!important;justify-content:flex-start!important;flex:initial!important;width:100%!important;max-width:100%;overflow-x:auto;white-space:nowrap;scrollbar-width:thin;padding:3px 0 8px}
.navbtn{flex:0 0 auto!important;width:auto!important;min-width:74px!important;white-space:nowrap;font-size:11px}
.hero-art{animation:none!important;opacity:1!important;transform:none!important;width:100%;max-height:190px}
.landing-inner{gap:0}
}
@media(max-width:630px){.hero-art{bottom:auto!important;right:auto!important;top:auto!important;align-self:center;margin:8px auto 0!important;object-fit:contain!important}}