/* Pokémon training camp: quiet question surfaces, playful navigation and task cards. */
:root{--ink:#26384d;--muted:#6c7b8b;--green:#285fa1;--paper:#f3f7fb;--line:#dbe4ed;--soft:#edf3fa;--serif:"Trebuchet MS","PingFang SC","Microsoft YaHei",sans-serif}
body{background-color:var(--paper);background-image:radial-gradient(#b6c9db45 .8px,transparent .8px);background-size:18px 18px}
.sidebar{background:#fff;border-right:2px solid #dbe4ed;padding-top:30px}.brand{gap:12px}.brand>div:last-child{min-width:0}.brand-name{font-size:22px;letter-spacing:0;line-height:1.2;color:#27548a}html[lang=en-AU] .brand-name{font-size:20px;max-width:165px}.brand small{margin-top:7px;letter-spacing:1px;font-size:8px}.brand-mark{position:relative;flex-shrink:0;width:40px;height:40px;border:3px solid #293b50;border-radius:50%;font-size:0!important;background:linear-gradient(#ef5a54 0 44%,#293b50 44% 55%,#fff 55%);box-shadow:0 3px 0 #25394e14}.brand-mark:after{content:"";position:absolute;width:12px;height:12px;border:3px solid #293b50;border-radius:50%;background:#fff}
.nav button{border:1px solid transparent;border-radius:12px;font-weight:600}.nav button.active{background:#fff2b5;color:#594819;border-color:#ebcf6b;box-shadow:0 3px 0 #dfbc5630}.nav button:hover{background:#fff8dc}.nav .icon{stroke-width:1.8}.side-note{background:#edf7f3;border-color:#cce2d7;border-radius:16px}.side-note p{font-size:16px;color:#3e6b55}.side-note .eyebrow{color:#3f805f}.avatar{background:#ffdf66;border:2px solid #efd064;color:#594819;font-weight:bold}.profile strong{color:var(--ink)}
.topbar{border-bottom:1px solid #d8e3ed}.page-heading h1{font-size:28px;letter-spacing:0;font-weight:800}.page-heading p{color:#6a7d91}.hero{border:2px solid #e5be47;background:#fff2b6;border-radius:24px;padding:30px 34px;grid-template-columns:minmax(0,1fr) 265px;box-shadow:0 7px 0 #d7ad3530;isolation:isolate}.hero:after{width:350px;height:350px;right:-50px;bottom:-65px;border-radius:50%;background:repeating-conic-gradient(from 0deg,#ffe17a 0deg 15deg,#fff0ae 15deg 30deg);opacity:.65;z-index:-1}.hero h2{color:#354768;font-weight:800;font-size:32px;line-height:1.4}.hero p{color:#756335}.hero .eyebrow{color:#92701f;letter-spacing:2px}.hero .primary{background:#d64543;box-shadow:0 4px 0 #a93235;border:1px solid #bb3335}.hero .primary:hover{background:#c83d3c}.hero-art{width:265px;height:320px;object-fit:contain;filter:drop-shadow(0 8px 0 #d3ab3520);animation:companion-bob 4s ease-in-out infinite}.primary{background:#2865a7;border-radius:10px;font-weight:700}.secondary{border-radius:10px}.summary-strip{border-bottom:1px solid #d8e3ed;padding-top:20px}.summary-strip b{font-family:var(--sans);font-weight:800}.dot{background:#e1534c}.section-head h2{font-weight:800}
.course{position:relative;overflow:hidden;border:1px solid #d7e1ec;border-top:5px solid var(--subject-color,#70a7ce);border-radius:18px;box-shadow:0 4px 0 #d8e3ec70;min-height:245px}.course.Maths{--subject-color:#e8b744}.course.Science{--subject-color:#6eae81}.course.English{--subject-color:#67a8cf}.course.Vocabulary{--subject-color:#e78f61}.course-top{margin-bottom:15px}.course h3,.course>p{position:relative;z-index:1;max-width:calc(100% - 88px)}.course .eyebrow{color:#718399;font-weight:800;position:relative;z-index:1}.course h3{font-weight:700;line-height:1.6}.course>p{line-height:1.8}.course-companion{position:absolute;right:10px;top:70px;width:89px;height:100px;object-fit:contain;pointer-events:none;transition:transform .25s}.course:hover{transform:translateY(-3px);box-shadow:0 7px 0 #d8e3ec80}.course:hover .course-companion{transform:translateY(-5px) rotate(5deg)}.course-bottom{position:relative;z-index:1;background:#fff}.subject-icon{border-radius:11px}.rail-card{border:1px solid #d7e1ec;border-radius:18px;box-shadow:0 4px 0 #d8e3ec70}.rail-note{position:relative;z-index:1;color:#3c658b;font-size:17px;font-weight:600}.rail-card .eyebrow{color:#6285a4}.ring{background:conic-gradient(#e55850 var(--progress),#edf1f6 0)}.ring strong{font-family:var(--sans);font-weight:800}.week span.today{background:#d94b45}.week span.present{background:#e4f0e4}.ring-note{color:#738296}
.panel,.question{border-color:#dbe4ed;border-radius:15px}.history-heading h2{font-family:var(--sans);font-size:18px;font-weight:800}.mini-stat{border-radius:16px;border-top:4px solid #e7c24a}.mini-stat:nth-child(2){border-top-color:#75b08a}.mini-stat:nth-child(3){border-top-color:#df8076}.mini-stat strong{font-family:var(--sans);font-weight:800}.dialog-head{border-top:5px solid #e3544d}.dialog-body{background:#f6f9fc}.question-title h3{font-weight:600}.q-number{background:#edf2fa;color:#41648d}.intro{background:#eef4fb}.score-banner{background:#2e557e}.score-banner p,.score-banner .score small{color:#e0eaf3}.answer-input{border-color:#cedae6;background:#fff}.answer-input:focus{outline-color:#78a4d2}.feedback{background:#f1f7ed}.login{border-top:6px solid #e3544d;box-shadow:0 8px 0 #dce5ef}.login h1{font-size:28px;font-weight:800}.tag{border-radius:6px}.footer{color:#8293a5}.practice-title .practice-subject{border-radius:6px}
@keyframes companion-bob{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-7px) rotate(2deg)}}
@media(min-width:901px) and (max-width:1150px){.hero{grid-template-columns:minmax(0,1fr) 180px}.hero-art{width:180px;height:286px}.course h3,.course>p{max-width:100%}.course-companion{width:55px;height:62px;top:12px;right:75px}.course .eyebrow{margin-top:10px}}
@media(max-width:900px){.hero{grid-template-columns:minmax(0,1fr) 200px}.hero-art{width:200px;height:286px}.course h3,.course>p{max-width:calc(100% - 75px)}.course-companion{width:80px}}
@media(max-width:650px){.sidebar{border-right:0;border-top:2px solid #dbe4ed}.nav button{border-radius:9px}.hero{display:block;padding:24px;min-height:245px}.hero h2,html[lang=en-AU] .hero h2{font-size:25px;max-width:100%}.hero p{max-width:100%;padding-right:95px}.hero .primary{max-width:calc(100% - 85px);padding:10px 12px}.hero-art,html[lang=en-AU] .hero-art{display:block;position:absolute;right:0;bottom:0;width:121px;height:144px;opacity:1}.hero:after{width:220px;height:220px;bottom:-95px}.cards{grid-template-columns:1fr}.course{min-height:210px}.course-companion{width:105px;height:115px;top:55px;right:16px}.course h3,.course>p{max-width:calc(100% - 105px)}.course-top{margin-bottom:10px}.course .eyebrow{font-size:10px}.page-heading h1{font-size:24px}.rail-note{font-size:15px}.rail-card{box-shadow:none}.brand-name{font-size:20px}}
@media(prefers-reduced-motion:reduce){.hero-art{animation:none}.course,.course-companion{transition:none}.course:hover,.course:hover .course-companion{transform:none}}

@media(max-width:650px){
 .sidebar{height:calc(80px + env(safe-area-inset-bottom,0px));padding:6px 10px calc(6px + env(safe-area-inset-bottom,0px))}
 .nav{height:66px;align-items:stretch;grid-template-columns:repeat(3,minmax(0,1fr))}
 .nav:has([data-nav="backlog"]){grid-template-columns:repeat(4,minmax(0,1fr))}
 .nav button{min-width:0;padding:6px 2px;gap:4px;justify-content:center;line-height:1.2}
 .nav button span{display:flex;align-items:center;justify-content:center;min-height:26px;max-width:100%;font-size:11px;line-height:13px;text-align:center}
 .nav .icon{width:20px;height:20px;flex-shrink:0}
 .main{padding-bottom:calc(100px + env(safe-area-inset-bottom,0px))}
}

/* Progress and monthly attendance are separate stacked cards. */
.workspace .rail{display:flex;flex-direction:column;gap:18px;align-self:start}
.workspace .rail-card{margin-bottom:0}
.month-heading{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px}
.month-heading>span{font-size:11px;color:var(--muted)}
.month-count{font-size:12px;color:var(--muted);margin:15px 0}
.month-count b{color:var(--ink);font-size:18px}
.month-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:5px 2px;text-align:center}
.calendar-weekday{font-size:10px;color:var(--muted);padding-bottom:6px}
.calendar-day{position:relative;min-width:0;min-height:28px;padding:4px 0;border:1px solid transparent;border-radius:8px;font-size:11px;color:var(--ink);background:#f3f6fa}
.calendar-day.checked{background:#e1f1e5;color:#34714d;font-weight:700;padding-bottom:10px}
.calendar-day small{position:absolute;font-size:8px;bottom:0;left:0;right:0;line-height:10px}
.calendar-day.current{border-color:#d94b45;box-shadow:0 0 0 1px #d94b45}
.calendar-day:disabled{opacity:.35;cursor:default}
.calendar-day:not(:disabled):hover{background:#fff0b4}
.calendar-day:focus-visible{outline:2px solid #2865a7;outline-offset:2px}

.score-banner .grading-status{margin-left:auto;text-align:right;flex-shrink:0}
.score-banner .grading-status h3{font-size:24px;font-weight:700;line-height:1.4}
@media(max-width:650px){.score-banner .grading-status h3{font-size:21px}}