@import url('https://fonts.googleapis.com/css2?family=Playwrite+MX:wght@100..400&display=swap');

:root{--ink:#10233d;--muted:#68788c;--paper:#eef3f8;--grade:#2474e8;--soft:#dcecff;font-family:"Playwrite MX",cursive}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--paper);color:var(--ink)}
html{font-size:clamp(22px,1.22vw,48px)}body.grade-4{--grade:#e7681f;--soft:#ffe5d3}body.grade-5{--grade:#2474e8;--soft:#dcecff}
.board{width:100vw;height:100vh;overflow:hidden;padding:0 1.15rem;display:grid;grid-template-rows:4.35rem auto 1fr 3.25rem;background:linear-gradient(125deg,#fbfdff,#edf3f9 55%,#f9fbfe)}
.topbar{grid-row:1;display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;border-bottom:1px solid #cbd7e4;gap:1rem}.identity{display:flex;align-items:center;gap:.75rem;min-width:0}.identity small,.section-title span,.question-block small,.action-block small,.mini-card small,.culture-column small,.materials-checklist small,.control-header>div>small{display:block;color:#718096;font-size:.56rem;font-weight:400;letter-spacing:.06em}.identity strong{display:block;font-size:.94rem;margin-top:.1rem}.grade-pill{background:var(--grade);color:#fff;padding:.5rem .72rem;border-radius:.45rem;font-size:.8rem;font-weight:400}.clock{text-align:center;justify-self:center}.clock strong,.clock span{display:block}.clock strong{font-size:.88rem;white-space:nowrap}.clock span{font-size:.88rem;font-weight:400;color:var(--grade);margin-top:.08rem}.top-spacer{min-width:0}
.notice{grid-row:2;margin:.35rem 0 0;background:#fff1b5;color:#6b4b00;text-align:center;padding:.3rem .6rem;border-radius:.38rem;font-size:.72rem;font-weight:400}.content-grid{grid-row:3;min-height:0;display:grid;grid-template-columns:minmax(0,2.45fr) minmax(14rem,1fr);gap:.72rem;padding:.72rem 0}.mission-card{min-height:0;background:#fff;border:1px solid #d8e2ed;border-radius:.9rem;padding:.82rem .95rem;display:flex;flex-direction:column;box-shadow:0 .7rem 2rem #18304d10}.section-title{display:flex;align-items:center;gap:.5rem}.section-title i{height:1px;background:#d7e0ea;flex:1}.mission-card h1{margin:.22rem 0 .05rem;color:var(--grade);font-size:1.72rem;line-height:1.05;letter-spacing:-.025em;max-width:96%}.chapter{font-size:.72rem;font-weight:400;color:#58697d;margin:.08rem 0 .38rem}.question-block{background:var(--soft);border-left:.28rem solid var(--grade);padding:.5rem .68rem;border-radius:0 .55rem .55rem 0}.question-block strong{display:block;font-size:1.16rem;line-height:1.22;margin-top:.14rem}.action-block{display:grid;grid-template-columns:2.6rem minmax(0,1fr);align-items:start;gap:.68rem;padding:.58rem 0}.action-block>b{display:grid;place-items:center;background:var(--grade);color:#fff;border-radius:50%;width:2.5rem;height:2.5rem;font-size:.94rem;font-weight:400}.action-content>strong{display:block;font-size:1rem;line-height:1.24;margin-top:.12rem}.materials-checklist{margin-top:.58rem;padding-top:.48rem;border-top:2px solid #d7e1ec}.materials-checklist small{font-size:.7rem;color:var(--grade)}.checklist{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.32rem .7rem;margin-top:.32rem}.checklist-item{display:flex;align-items:center;gap:.34rem;min-width:0;font-size:.72rem}.checklist-item span{color:var(--grade);font-family:Arial,Helvetica,sans-serif;font-size:1rem;line-height:1}.checklist-item b{font-weight:400;overflow-wrap:anywhere}.mini-card{border:1px solid #d7e1ec;background:#f7f9fc;border-radius:.55rem;padding:.5rem .65rem;min-height:2.8rem}.evidence{margin-top:auto}.evidence strong{display:block;color:var(--grade);font-size:.82rem;margin-top:.28rem;font-weight:400}
.culture-column{min-height:0;display:grid;grid-template-rows:auto minmax(0,1fr) auto;gap:.5rem}.language-card,.art-card,.music-card{background:#fff;border:1px solid #d8e2ed;border-radius:.72rem;overflow:hidden;box-shadow:0 .45rem 1.4rem #18304d0d}.language-card{border-top:.24rem solid var(--grade);padding:.5rem .65rem}.language-card strong{display:block;font-size:.82rem;line-height:1.22;margin-top:.18rem;font-weight:400}.art-card{display:grid;grid-template-rows:minmax(0,1fr) auto}.painting-frame{min-height:0;display:grid;place-items:center;background:#edf1f6;padding:.3rem}.painting{display:block;width:100%;height:100%;min-height:5.5rem;object-fit:contain;object-position:center}.art-card>div:last-child{padding:.48rem .62rem}.art-card strong,.art-card span,.music-card strong,.music-card span{display:block}.art-card strong{font-size:.78rem;margin-top:.14rem;font-weight:400}.art-card span{font-size:.58rem;color:var(--muted);margin-top:.08rem}.art-card .image-credit{font-size:.4rem;opacity:.8}.music-card{min-height:4.5rem;background:#12233c;color:#fff;padding:.45rem;display:grid;grid-template-columns:3.4rem minmax(0,1fr) auto auto;gap:.5rem;align-items:center}.music-media{position:relative;width:3.4rem;height:3.4rem;overflow:hidden;border-radius:.48rem}.note{position:absolute;inset:0;z-index:2;display:grid;place-items:center;background:linear-gradient(145deg,var(--grade),#a8caff);font-size:1.3rem}.music-media iframe{position:absolute;inset:0;z-index:1;display:block;width:100%;height:100%;border:0;opacity:.01;pointer-events:none}.music-card small{color:#9fb2cc}.music-card strong{font-size:.68rem;margin:.1rem 0;font-weight:400}.music-card span{font-size:.52rem;color:#bfcee0}.playing{width:.38rem;height:.38rem;border-radius:50%;background:#2fbd76;box-shadow:0 0 0 .14rem #2fbd7630}.start-music{border:1px solid #ffffff40;border-radius:.45rem;background:#ffffff14;color:#fff;padding:.38rem .48rem;font-family:inherit;font-size:.46rem;font-weight:400;white-space:nowrap}
.board footer{grid-row:4;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;border-top:1px solid #cad6e4;color:#718096;gap:1rem}.footer-status{display:flex;align-items:center;gap:.8rem;font-size:.42rem;font-weight:400;letter-spacing:.06em}.footer-status i{display:inline-block;width:.34rem;height:.34rem;border-radius:50%;background:#2fbd76}.attendance{justify-self:end;background:#fff;border:1px solid #d8e2ed;border-radius:.55rem;padding:.38rem .7rem;display:flex;gap:.5rem;align-items:center;box-shadow:0 .25rem .8rem #18304d12}.attendance>i{width:.5rem;height:.5rem;border-radius:50%;background:#2fbd76;box-shadow:0 0 0 .16rem #d9f5e8}.attendance strong,.attendance small{display:block}.attendance strong{font-size:.72rem;font-weight:400}.attendance small{font-size:.44rem;color:var(--muted)}
.mission-card,.culture-column,.mini-card,.topbar>*{min-width:0}.question-block strong,.action-content>strong,.evidence strong{overflow-wrap:anywhere}.schedule-summary{display:block;color:var(--grade);font-size:.64rem;font-weight:400;margin-top:.12rem;letter-spacing:.02em}.connection-list .cached{color:#8a5a00}.button-row button:disabled{cursor:not-allowed;opacity:.55}

.control-body{font-family:Arial,Helvetica,sans-serif;font-size:16px;background:#eef3f8}.control-shell{max-width:1280px;margin:auto;padding:28px}.control-header{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:20px}.control-header h1{font-size:34px;margin:5px 0}.control-header p{margin:0;color:var(--muted)}.control-header a{background:#142c49;color:#fff;text-decoration:none;padding:12px 17px;border-radius:11px;font-weight:800}.control-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.panel{background:#fff;border:1px solid #d7e1ec;border-radius:16px;padding:20px;box-shadow:0 12px 34px #18304d0b}.panel h2{margin:0 0 14px}.panel label{display:block;font-size:13px;font-weight:800;color:#52647a;margin:10px 0}.panel input,.panel textarea{display:block;width:100%;margin-top:5px;border:1px solid #cbd7e3;border-radius:9px;padding:10px;color:var(--ink);background:#fff}.panel textarea{min-height:68px;resize:vertical}.button-row{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin:12px 0}.button-row button,.savebar button{border:1px solid #cbd7e3;background:#f6f8fb;border-radius:9px;padding:10px;font-weight:800;color:#52647a;cursor:pointer}.button-row button.active{background:#2474e8;color:#fff;border-color:#2474e8}.toggle-line{display:flex!important;justify-content:space-between;align-items:center;background:#f6f8fb;padding:12px;border-radius:10px}.toggle-line small{display:block;font-weight:400;margin-top:3px}.toggle-line input{width:22px;height:22px;margin:0}.switch-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px}.switch-grid label{margin:0;display:flex;justify-content:space-between;border:1px solid #d7e1ec;border-radius:9px;padding:9px}.switch-grid input{width:18px;margin:0}.hint{color:var(--muted);font-size:13px;line-height:1.4}.connection-list{display:grid;gap:8px}.connection-list b{display:flex;justify-content:space-between;padding:10px;background:#f6f8fb;border-radius:9px;font-size:13px}.connection-list span{font-size:11px;color:#9a6500}.connection-list .connected{color:#137548}.savebar{position:sticky;bottom:14px;margin-top:16px;background:#142c49;color:#fff;border-radius:13px;padding:12px 15px;display:flex;justify-content:space-between;align-items:center;box-shadow:0 12px 30px #142c4950}.savebar button{background:#2fbd76;color:#fff;border-color:#2fbd76;padding:11px 22px}.savebar .error{color:#ffb4ae}@media(max-width:800px){.control-grid{grid-template-columns:1fr}.control-header{align-items:flex-start}.control-header a{white-space:nowrap}.switch-grid{grid-template-columns:1fr}}