@import url('/static/style.css');
.student-ui{--ink:#243c3b;--muted:#596c69;--green:#286b59;--green-light:#edf5ef;--line:#dce5df;--paper:#fff;--radius:16px;--space:24px;background:#f6f7f2;color:var(--ink);font:16px/1.65 system-ui,-apple-system,"Segoe UI","Microsoft YaHei",sans-serif;margin:0;padding:0}
.student-ui *{box-sizing:border-box;min-width:0}.student-ui [hidden]{display:none!important}.student-ui h1{font-size:30px;line-height:1.3;letter-spacing:.02em;margin:8px 0 10px}.student-ui h2{font-size:21px;line-height:1.5;margin:8px 0 16px}.student-ui h3{font-size:18px}.student-ui p{margin:8px 0 16px}.student-ui .hint{font-size:16px;color:var(--muted)}
.student-ui a{color:var(--green);text-decoration:none}.student-ui a:not(.brand){display:inline-flex;align-items:center;min-height:44px;padding:4px 8px}.student-ui button,.student-ui .button{min-height:46px;height:auto;padding:9px 20px;border:1px solid transparent;border-radius:10px;background:var(--green);color:#fff;font:600 16px/1.5 inherit;font-family:inherit;font-size:16px;box-shadow:none;cursor:pointer;transition:background .15s}.student-ui button:hover{background:#205744;transform:none}.student-ui button:disabled{cursor:default;background:#d7e1dc;color:#52655f;opacity:1}.student-ui .secondary,.student-ui .chips button{background:#fff;color:var(--green);border:1px solid #c8d8ce}.student-ui .secondary:hover,.student-ui .chips button:hover{background:var(--green-light)}.student-ui :focus-visible{outline:3px solid #d48b25;outline-offset:3px}.student-ui label{display:block;font-size:17px;font-weight:600;margin:12px 0}.student-ui input,.student-ui textarea,.student-ui select{display:block;width:100%;min-height:46px;background:#fff;color:var(--ink);border:1px solid #a7bcb2;border-radius:10px;padding:10px 12px;margin-top:8px;font:400 17px/1.6 inherit;font-family:inherit;font-size:17px;box-shadow:none}.student-ui textarea{resize:vertical;min-height:112px}.student-ui input[type=checkbox]{display:inline-block;width:24px;min-height:24px;margin:0 10px 0 0;vertical-align:middle}.student-ui input[type=file]{font-size:16px}.student-ui .code-input{font-size:24px;letter-spacing:.24em;height:52px;text-align:left}.student-ui .student-top{height:76px;max-width:1168px;margin:auto;padding:12px 28px;display:flex;align-items:center;gap:24px;border-bottom:0}.student-ui .brand{font-size:23px;font-weight:800;letter-spacing:.08em;display:flex;align-items:center;gap:18px;min-height:44px;margin-right:auto;color:var(--green)}.student-ui .brand span{font-size:16px;font-weight:500;letter-spacing:0;color:var(--muted)}.student-ui #identity{font-size:16px;color:var(--muted)}
.student-ui .student-sticky{position:sticky;top:0;z-index:15;background:rgba(246,247,242,.98);border-bottom:1px solid var(--line)}.student-ui .student-progress{display:flex;align-items:center;gap:20px;max-width:1112px;margin:auto;padding:14px 4px}.student-ui [data-student-steps]{padding:0;margin:0;display:grid;grid-template-columns:repeat(5,1fr);gap:14px;list-style:none;flex:1}.student-ui [data-student-steps] li{font-size:16px;color:#657871;border-bottom:3px solid #dce5df;padding:5px 0 9px;white-space:nowrap}.student-ui [data-student-steps] li[data-state=current]{color:var(--green);font-weight:750;border-color:var(--green)}.student-ui [data-student-steps] li[data-state=done]{color:var(--green);border-color:#98bbaa}.student-ui [data-step-count]{font-size:15px;color:var(--muted);white-space:nowrap}
.student-ui .student-shell{max-width:1120px;width:100%;margin:0 auto;padding:26px 4px 110px}.student-ui .section-heading{margin:0 0 22px;padding:0;border:0;display:block}.student-ui .eyebrow{color:var(--green);font-size:15px;font-weight:700;letter-spacing:.09em;margin:0}.student-ui .panel{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:24px;margin:0 0 20px;box-shadow:0 2px 8px #213b2903}.student-ui .expression-panel{max-width:790px}.student-ui .accent-panel{background:var(--green-light)}.student-ui .tag{display:inline-flex;background:var(--green-light);border-radius:6px;padding:3px 10px;font-size:15px;font-weight:600;color:var(--green)}.student-ui .two-columns,.student-ui .edit-layout,.student-ui .final-layout{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:start}.student-ui .edit-layout{grid-template-columns:minmax(0,.94fr) minmax(0,1.06fr)}.student-ui .art-panel{padding:16px;background:#eaf0e8;border-radius:16px;border:1px solid var(--line);text-align:center}.student-ui .artwork{width:100%;max-height:360px;object-fit:contain;display:block;aspect-ratio:4/3;border-radius:10px;background:#eaf0e8}.student-ui .task-layout{display:grid;grid-template-columns:1.4fr .7fr;gap:32px}.student-ui .task-brief{padding:32px}.student-ui .task-brief h2{font-size:24px;margin:22px 0}.student-ui .task-side{align-self:center;text-align:center;color:var(--muted)}.student-ui .task-side img{width:220px;height:190px;object-fit:contain}.student-ui .task-notes{display:flex;flex-wrap:wrap;gap:10px;margin-top:32px}.student-ui .task-notes span{background:var(--green-light);padding:8px 12px;border-radius:8px;font-size:16px}.student-ui .student-bottom{position:fixed;bottom:0;left:0;right:0;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:16px;background:#fffffff7;border-top:1px solid var(--line);padding:14px max(28px,calc((100vw - 1112px)/2));padding-bottom:max(14px,env(safe-area-inset-bottom));min-height:76px}.student-ui .student-bottom>span{font-size:16px;color:var(--muted)}.student-ui .student-bottom>button:last-child{margin-left:auto;min-width:180px}.student-ui .chips{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0}.student-ui .chips button{min-height:44px;padding:8px 14px;font-weight:500;font-size:16px}.student-ui .actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}.student-ui details{margin:16px 0}.student-ui summary{min-height:44px;padding:8px 0;cursor:pointer;font-size:16px;font-weight:600;color:var(--green)}.student-ui dialog{border:1px solid var(--line);border-radius:20px;max-width:580px;width:calc(100% - 32px);max-height:85dvh;padding:24px;color:var(--ink);overflow:auto}.student-ui dialog::backdrop{background:#20382c75}.student-ui .status{font-size:16px;background:#ecf4ef;color:var(--green);border:1px solid #bdd5c5;border-radius:10px;padding:12px 16px;margin-bottom:20px;overflow-wrap:anywhere}.student-ui .status[data-error=true]{background:#fff3e6;color:#86521b;border-color:#e6caa4}.student-ui footer{display:flex;justify-content:space-between;color:var(--muted);font-size:14px;border:0;margin-top:24px;padding:0}.student-ui .student-voice{margin:10px 0 16px}.student-ui .student-voice>p{display:inline;margin-left:12px;color:var(--muted);font-size:15px;font-weight:400}.student-ui .student-voice[data-state=recording]>.voice-record{color:#9d372d;background:#fff1ee;border-color:#da978f;min-width:168px}.student-ui .student-voice[data-state=error]>p{color:#86521b}.student-ui .student-voice>div{background:#f2f6f0;border-radius:10px;padding:12px;margin-top:12px}.student-ui .student-voice>div>button{margin:4px 8px 4px 0}.student-ui .student-voice>div label{font-size:16px}.student-ui .student-voice>div textarea{min-height:80px}.student-ui .student-entry-choices{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:24px 0;max-width:820px}.student-ui .student-entry-choices>a{padding:20px;border:1px solid var(--line);border-radius:16px;display:flex;flex-direction:column;align-items:start;gap:8px;background:#fff;color:var(--ink)}.student-ui .student-entry-choices>a[aria-current]{background:var(--green-light);border:2px solid var(--green);padding:19px}.student-ui .student-entry-choices strong{font-size:19px}.student-ui .student-entry-choices span{font-size:16px;color:var(--muted)}.student-ui .entry-form-layout{display:grid;grid-template-columns:minmax(0,560px) 1fr;gap:40px;max-width:960px}.student-ui .entry-note{align-self:start;padding:20px 8px;color:var(--muted)}.student-ui .entry-note strong{font-size:19px;color:var(--ink)}.student-ui .entry-note img{width:180px;height:130px;object-fit:contain;display:block;margin-bottom:20px}.student-ui .login-panel{max-width:none;margin:0}.student-ui .entry-heading{margin:0 0 16px}.student-ui .entry-heading h1{font-size:30px}.student-ui .candidates{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-bottom:22px}.student-ui .candidate{background:white;border:2px solid var(--line);border-radius:16px;padding:12px;display:flex;flex-direction:column;gap:10px;color:var(--ink);text-align:left;box-shadow:none}.student-ui .candidate:hover{background:var(--green-light)}.student-ui .candidate.selected,.student-ui .candidate[aria-checked=true]{border-color:var(--green);background:var(--green-light)}.student-ui .candidate img{width:100%;height:220px;object-fit:contain;border-radius:10px}.student-ui .candidate h3{font-size:18px;margin:0}.student-ui .candidate p{font-size:16px;margin:0}.student-ui .candidate button{width:100%}.student-ui #project-list{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}.student-ui .creation-timeline{display:flex;gap:16px;overflow-x:auto;padding:8px 0}.student-ui .creation-timeline article{min-width:180px;max-width:250px}.student-ui .creation-timeline img{width:180px;height:140px;object-fit:contain;border-radius:10px;background:var(--green-light)}.student-ui .creation-timeline p{font-size:16px}.student-ui .reflection-card{max-width:790px}.student-ui .reflection-count{font-size:16px;color:var(--green);font-weight:700}.student-ui #work-draft-form{margin:0}.student-ui .reflection-tabs{display:flex;gap:8px;margin:16px 0}.student-ui .reflection-tabs button{min-width:44px;padding:8px 12px}.student-ui .reflection-tabs [aria-current]{background:var(--green);color:white}.student-ui .saved-process{border-left:3px solid #98bbaa;padding-left:16px}.student-ui #learning-help{margin-top:24px}.student-ui .student-voice button{min-height:44px}.student-ui .learning-header{display:none}
@media(max-width:1180px){.student-ui .student-shell{padding-left:28px;padding-right:28px}.student-ui .student-progress{padding-left:28px;padding-right:28px}}
@media(max-width:650px){.student-ui h1,.student-ui .entry-heading h1{font-size:25px}.student-ui h2{font-size:20px}.student-ui .student-top{height:64px;padding:10px 16px;gap:8px}.student-ui .brand{font-size:21px}.student-ui .brand span,.student-ui #identity{display:none}.student-ui .student-top>a:last-child{font-size:15px}.student-ui .student-shell{padding:20px 16px 112px}.student-ui .student-progress{padding:10px 16px;gap:8px;display:block}.student-ui [data-student-steps]{gap:6px}.student-ui [data-student-steps] li{font-size:13px;text-align:center;padding:6px 0;white-space:normal;word-break:keep-all}.student-ui [data-step-count]{display:none}.student-ui .section-heading{margin-bottom:18px}.student-ui .panel{padding:18px;border-radius:14px;margin-bottom:16px}.student-ui .two-columns,.student-ui .edit-layout,.student-ui .final-layout,.student-ui .task-layout,.student-ui .entry-form-layout{grid-template-columns:1fr;gap:16px}.student-ui .task-side,.student-ui .entry-note{display:none}.student-ui .task-brief h2{font-size:22px;margin:20px 0}.student-ui .student-bottom{padding:12px 16px;min-height:72px;gap:8px;padding-bottom:max(12px,env(safe-area-inset-bottom))}.student-ui .student-bottom>span{display:none}.student-ui .student-bottom>button:last-child{min-width:0}.student-ui .student-bottom button,.student-ui .student-bottom .button{font-size:16px;padding:10px 14px;max-width:72%}.student-ui .artwork{max-height:240px;aspect-ratio:4/3}.student-ui .art-panel{padding:10px}.student-ui .art-panel p{margin:6px 0}.student-ui .student-entry-choices{gap:10px;margin:18px 0}.student-ui .student-entry-choices>a,.student-ui .student-entry-choices>a[aria-current]{padding:12px;gap:5px}.student-ui .student-entry-choices strong{font-size:17px}.student-ui .student-entry-choices span{font-size:15px}.student-ui .student-voice>p{display:block;margin:8px 0 0}.student-ui .candidates{grid-template-columns:1fr;gap:12px}.student-ui .candidate img{height:210px}.student-ui #project-list{grid-template-columns:1fr}.student-ui .task-notes{margin-top:22px}.student-ui dialog{padding:18px}.student-ui footer{font-size:14px}.student-ui .reflection-tabs{gap:6px}.student-ui .chips{gap:8px}.student-ui #child-guidance{margin-top:18px}.student-ui .student-voice>div>button{padding:9px 12px}}
@media(prefers-reduced-motion:reduce){.student-ui *{scroll-behavior:auto!important;transition:none!important}}
.student-ui .candidate[data-selected=true]{border-color:var(--green);background:var(--green-light)}.student-ui .candidate label{width:100%;margin:0;cursor:pointer}.student-ui .candidate input[type=radio]{display:inline-block;width:24px;height:24px;min-height:24px;vertical-align:middle;margin:8px}.student-ui .candidate-caption{font-size:17px}.student-ui .candidate-mark{display:none}.student-ui .slot-placeholder{min-height:230px;display:grid;place-items:center;color:var(--muted)}

@media(max-width:650px){.student-ui .edit-layout .artwork{max-height:180px}.student-ui .edit-layout .art-panel{padding:8px}}

.student-ui .refinement-layout{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:20px;align-items:start}.student-ui .refinement-trigger{display:flex;flex-direction:column;align-items:center;gap:8px;padding-top:76px}.student-ui #original-text{border:2px solid #86aa99;background:#fff;min-height:160px}.student-ui #refined-display{white-space:pre-wrap;overflow-wrap:anywhere}.student-ui .refinement-trigger .hint{font-size:14px}@media(max-width:760px){.student-ui .refinement-layout{grid-template-columns:1fr;gap:12px}.student-ui .refinement-trigger{padding:0 0 12px;align-items:flex-start}.student-ui .refinement-trigger .hint{display:none}}

/* Lesson context and navigation remain readable on small screens. */
.student-ui #lesson-context{display:block;width:fit-content;max-width:100%;white-space:normal;overflow-wrap:anywhere;margin:0 auto 20px}.student-ui #lesson-media-note{margin:0 auto 18px}.student-ui #lesson-edit-examples button{text-align:left;white-space:normal;overflow-wrap:anywhere}.student-ui .student-bottom{flex-wrap:wrap}.student-ui #lesson-hints{padding-left:1.5em}.student-ui #lesson-hints li{margin:.35em 0}
@media(max-width:650px){.student-ui .student-bottom{gap:6px}.student-ui .student-bottom .button{font-size:14px;max-width:100%}.student-ui .student-bottom>button:last-child{min-width:0}.student-ui .student-bottom a{flex-basis:100%;min-height:38px;padding:6px 10px}.student-ui .student-shell{padding-bottom:190px}}

/* A submitted work can still return to its explanation and permitted edits. */
body.student-ui #class-submit[data-submitted=true] #back-explanation{display:inline-flex;position:static}body.student-ui .exhibit-actions #back-explanation{position:static}body.student-ui .exhibit-actions{flex-wrap:wrap;justify-content:flex-end;gap:10px}

.student-ui .edit-action-note{flex:1 1 100%;order:-1;margin:0;padding:10px 14px;border-radius:12px;background:#fff3c4;color:#7a2410;font:800 20px/1.4 "Microsoft YaHei",system-ui,sans-serif}
.student-ui .edit-action-note[hidden]{display:none}
.student-ui .apply-edit-wrap{margin-left:auto;min-width:180px;display:flex}
.student-ui .apply-edit-wrap #apply-edit{width:100%}
.student-ui .poem-card{white-space:pre-wrap;margin:0;padding:16px 18px;border-radius:16px;background:#fffdf6;color:#17365d;font:600 18px/1.7 "Microsoft YaHei",system-ui,sans-serif}

.student-ui .student-voice[data-state=error]{align-items:stretch}
.student-ui .student-voice[data-state=error] .voice-state-title{font-size:20px;font-weight:800;color:#912f25}
.student-ui .student-voice[data-state=error] > p{display:block!important;grid-column:1/-1;width:100%;box-sizing:border-box;margin:8px 0 0!important;padding:12px 14px;border:2px solid #e0aa21;border-radius:12px;background:#fff4c8;color:#8a2b22;font:800 22px/1.45 "Microsoft YaHei",system-ui,sans-serif}
