:root{--studio-shadow:0 4px 20px rgba(22,42,70,.055)}
body{background:#f4f6fa}.hero{background:radial-gradient(ellipse at 83% 35%,#355377 0%,transparent 55%),linear-gradient(115deg,#102d50,#193a63);border:0;border-radius:18px;box-shadow:0 12px 35px #122c4917;grid-template-columns:1.2fr 1fr;min-height:320px;padding:30px 38px;overflow:hidden}.hero .eyebrow{color:#f4bc7d;font-size:11px;letter-spacing:1.5px}.hero h1{color:#fff;font-size:38px;line-height:1.25;letter-spacing:-1px}.hero em{color:#ffce9d}.hero p{color:#dce5f0;font-size:16px;max-width:470px;line-height:1.9}.hero #daily{font-size:15px;min-height:50px;padding:12px 22px;background:linear-gradient(115deg,#e97b33,#f8a13e);border:1px solid #ffb66a;color:#172e49;font-weight:800;box-shadow:0 5px 18px #e8943938;transition:transform .2s,box-shadow .2s}.hero #daily:hover{transform:translateY(-2px);box-shadow:0 8px 27px #f3aa565c}.art{height:295px;max-width:none;width:100%;opacity:1;position:relative;right:auto;bottom:auto;min-width:0;overflow:visible}.art img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 10px 14px #071b3a30);animation:studio-float 7s ease-in-out infinite}.art span{display:none}
.studio-brand-icon{display:flex;justify-content:center;align-items:center;width:44px;height:44px;border-radius:13px;background:linear-gradient(140deg,#0a416e,#24365f);color:#ffbf70;box-shadow:0 5px 12px #0b3d6d1a;flex-shrink:0}.studio-brand-icon svg{width:29px;height:29px}.brand b{font-size:10px;letter-spacing:2px}.edition{display:inline-flex;background:#152e4c;color:#e9eff7;border:1px solid #34506e;border-radius:30px;letter-spacing:.8px;font-size:10px;padding:8px 13px}.studio-controls{display:flex!important;align-items:center;gap:13px;width:auto!important}.original-language-control{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip-path:inset(50%);padding:0!important;margin:0!important;opacity:0;pointer-events:none}.language-pill{display:flex;gap:3px;background:#f0f3f9;border:1px solid #d9e1ec;border-radius:30px;padding:4px}.language-pill button{border:0;min-height:38px;min-width:51px;border-radius:24px;padding:5px 12px;font-size:14px;color:#415b77;background:transparent;font-weight:700}.language-pill button.active{background:#154b7a;color:white;box-shadow:0 3px 8px #174a791a}.studio-controls #stopAudio.studio-audio{width:70px;height:46px;min-height:46px;font-size:0;border:1px solid #d9e1ec;background:#f5f7fb;display:flex;align-items:center;justify-content:center;gap:7px;padding:10px;border-radius:30px;flex-basis:auto}.studio-controls #stopAudio:after{display:none}.studio-audio>svg{width:22px;height:22px;color:#255783;flex-shrink:0}.sound-bars{display:flex;align-items:center;gap:2px;height:19px}.sound-bars i{width:3px;height:5px;background:#8a9eb1;border-radius:3px}.speaking .sound-bars i{background:#cc762e;animation:sound-bar .8s ease-in-out infinite}.speaking .sound-bars i:nth-child(2){animation-delay:.2s}.speaking .sound-bars i:nth-child(3){animation-delay:.4s}.studio-audio.speaking{box-shadow:0 0 0 4px #f7d6b24d}.studio-controls #audioStatus{position:absolute;top:78px;right:30px;font-size:11px;background:white;border-radius:6px;z-index:3;max-width:330px}.studio-controls #audioStatus:empty{display:none}
.stat,.focuscard,.card,.session-filters,.mobile-appbar{border:1px solid #e2e8f0!important;box-shadow:var(--studio-shadow);border-radius:15px}.stat{padding:20px 22px}.stat:after{display:none}.metric-icon{display:block;width:25px;height:25px;color:#7994b0;margin-bottom:10px}.stat b{font-size:30px}.stat span{font-size:13px;line-height:1.6;margin-top:6px}.stat.accuracy-highlight{background:linear-gradient(120deg,#123c67,#285280);color:#fff!important;border:1px solid #204c78!important;position:relative;padding-right:80px}.accuracy-highlight b,.accuracy-highlight span{color:#fff!important}.accuracy-highlight .metric-icon{color:#b9d5ee}.metric-ring{position:absolute;right:17px;top:24px;width:61px;height:61px}.accuracy-highlight span{color:#d8e7f4!important}
.focusgrid{gap:15px}.focuscard,.focuscard.selected{position:relative;text-align:left;padding:23px 22px!important;min-height:182px!important;transition:transform .2s,box-shadow .2s,border-color .2s;overflow:hidden}.focuscard:hover{transform:translateY(-4px);box-shadow:0 10px 26px #162d4e12;background:#fff;border-color:#b5c8dc!important}.focuscard.selected{background:#fff!important;border-color:var(--subject-accent)!important;box-shadow:inset 3px 0 var(--subject-accent),0 5px 20px #203d6010}.focuscard:after{color:var(--subject-accent);top:20px;right:20px;font-size:16px}.focuscard b{padding-right:56px;font-size:18px}.focuscard>span:not(.subject-emblem):not(.subject-progress){font-size:14px;color:#49627b}.subject-emblem{position:absolute;right:17px;top:48px;width:58px;height:58px;display:flex!important;align-items:center;justify-content:center;border-radius:17px;background:var(--subject-soft);color:var(--subject-accent);transform:rotate(-6deg)}.subject-emblem svg{width:36px;height:36px;opacity:.9}.subject-availability{padding-right:60px;margin-top:8px;font-size:12px!important;color:#536b84!important;line-height:1.6}.subject-progress-label{display:flex!important;justify-content:space-between;gap:10px;margin:20px 0 8px!important;font-size:12px!important;color:#536b84!important}.subject-progress-label strong{font-size:12px;color:var(--subject-accent);font-weight:700}.subject-progress{display:block!important;width:100%;height:5px;border-radius:4px;background:var(--subject-soft);overflow:hidden}.subject-progress i{display:block;height:100%;background:var(--subject-accent);border-radius:4px;transition:width .4s}.focuscard .subject-emblem:after{content:'';position:absolute;border:1px solid currentColor;opacity:.08;inset:-24px;border-radius:50%}
.sidebar button{padding:12px 14px;gap:12px;transition:background .2s,color .2s,box-shadow .2s}.sidebar button svg{width:20px;height:20px;stroke-width:1.7;display:block;flex-shrink:0}.sidebar button.active{background:linear-gradient(90deg,#e3edfa,#eff4fc);box-shadow:inset 3px 0 #ef963f,0 3px 13px #173c7110;color:#103f6d}.sidebar button:hover svg{color:#c37a32}.sidebar .nav-caption{margin-bottom:16px}.local-save-status{display:inline-flex;align-items:center;gap:7px;color:#346349;font-size:12px;flex-shrink:0}.local-save-status i{width:7px;height:7px;display:inline-block;background:#47a36d;border-radius:50%;box-shadow:0 0 0 4px #47a36d12}footer{flex-wrap:wrap;align-items:center}.mobile-appbar{box-shadow:none}
@keyframes studio-float{0%,100%{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-6px) rotate(1deg)}}@keyframes sound-bar{0%,100%{height:5px}50%{height:17px}}
@media(min-width:1450px){.hero{grid-template-columns:1.25fr 1fr;padding:30px 38px}.hero h1{font-size:40px}.art{height:295px}.focuscard,.focuscard.selected{min-height:180px!important}}
@media(max-width:1150px){.edition{display:none}.hero{padding:27px;grid-template-columns:1.2fr 1fr}.hero h1{font-size:31px}.art{height:260px}.focuscard b{font-size:17px}.stat{padding:18px}.stat.accuracy-highlight{padding-right:64px}.metric-ring{right:10px;width:51px;height:51px}}
@media(max-width:800px){header{align-items:center;justify-content:space-between;flex-wrap:nowrap;padding-top:max(16px,env(safe-area-inset-top))}.brand{gap:9px}.brand>span:last-child{font-size:17px}.brand b{font-size:9px}.studio-brand-icon{width:39px;height:39px}.studio-controls{flex-basis:auto!important;margin-left:auto;gap:7px}.language-pill button{font-size:13px;min-width:42px;padding:4px 8px}.studio-controls #stopAudio.studio-audio{width:48px;height:44px;min-height:44px;padding:8px}.sound-bars{display:none}.studio-controls #audioStatus{top:75px;right:16px;max-width:280px}.hero{padding:26px;grid-template-columns:1.2fr 1fr;min-height:275px;gap:5px}.hero h1{font-size:29px}.hero p{font-size:15px}.hero .eyebrow{font-size:10px;max-width:none}.hero #daily{font-size:14px;padding:10px 15px;min-height:48px}.art{position:relative;opacity:1;width:100%;height:220px;right:auto;bottom:auto}.stat{padding:18px}.stat span{font-size:12px}.metric-icon{width:22px;height:22px;margin-bottom:9px}.stat b{font-size:27px}.stat.accuracy-highlight{padding-right:62px}.metric-ring{top:28px;width:50px;height:50px;right:10px}.focuscard b{font-size:17px;padding-right:48px}.focuscard,.focuscard.selected{padding:20px!important}.subject-emblem{width:50px;height:50px;right:15px;top:48px}.subject-emblem svg{width:31px;height:31px}.subject-availability{font-size:12px!important}.subject-progress-label{font-size:12px!important}.subject-progress-label strong{font-size:12px}.local-save-status{font-size:11px}}
@media(max-width:540px){header{flex-wrap:wrap;gap:12px}.studio-controls{margin:0;flex-basis:auto!important}.hero{grid-template-columns:1fr;min-height:0;padding:25px}.hero h1{font-size:31px}.hero p{max-width:100%;font-size:16px}.art{height:225px;max-width:340px;justify-self:center;margin-top:0}.hero>div:first-child{z-index:1}.hero #daily{width:100%;font-size:15px}.hero .eyebrow{font-size:10px}.focusgrid{grid-template-columns:1fr 1fr}.focuscard,.focuscard.selected{min-height:207px!important;padding:18px 15px!important}.focuscard b{font-size:16px;padding-right:0;position:relative;z-index:1}.focuscard:after{display:none}.focuscard>span:not(.subject-emblem):not(.subject-progress){font-size:13px}.subject-emblem{top:15px;right:12px;width:44px;height:44px;opacity:.15;transform:rotate(-7deg)}.subject-emblem svg{width:33px;height:33px}.subject-availability{padding-right:0;margin-top:10px}.subject-progress-label{margin-top:16px!important}.stat.accuracy-highlight{padding-right:18px}.metric-ring{width:39px;height:39px;top:16px;right:13px}.stat b{font-size:26px}.stat span{font-size:12px}.metric-icon{width:21px;height:21px}.stats{gap:10px}.studio-controls #stopAudio.studio-audio{width:45px}.language-pill button{min-width:43px}.studio-brand-icon{width:36px;height:39px}.brand>span:last-child{font-size:16px}.brand b{font-size:8px;letter-spacing:1.5px}}
@media(max-width:370px){.focusgrid{grid-template-columns:1fr}.focuscard,.focuscard.selected{min-height:170px!important}.subject-emblem{opacity:1;top:35px;right:18px}.focuscard b{padding-right:60px}.subject-availability{padding-right:60px}.studio-controls{margin-left:auto}.hero h1{font-size:28px}}
@media(prefers-reduced-motion:reduce){.art img,.speaking .sound-bars i{animation:none}.focuscard,.hero #daily{transition:none}.focuscard:hover,.hero #daily:hover{transform:none}}