:root{--navy:#163c54;--gold:#b89b54;--ink:#253c48;--muted:#667c87;--line:#dce3e4;--paper:#fff;--bg:#f4f6f4}*{box-sizing:border-box}body{margin:0;font:15px/1.6 system-ui,'Noto Sans CJK TC','Microsoft JhengHei',sans-serif;background:var(--bg);color:var(--ink)}button,input,textarea,select{font:inherit}button{border:0;background:var(--navy);color:#fff;padding:10px 19px;border-radius:8px;cursor:pointer;font-weight:600}button:hover{filter:brightness(1.12)}button:disabled{opacity:.45;cursor:default}button.quiet{color:var(--navy);background:transparent;border:1px solid var(--line)}button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid #c4ad69;outline-offset:3px}.hidden{display:none!important}header{height:82px;display:flex;align-items:center;padding:0 38px;background:#fff;border-bottom:1px solid var(--line);gap:42px}.brand{font-size:32px;letter-spacing:2px;font-weight:750;color:var(--navy);text-decoration:none;display:flex;align-items:center;gap:20px}.brand span{font-size:12px;letter-spacing:1px;line-height:1.5;border-left:1px solid var(--line);padding-left:20px}.version{font-size:10px;letter-spacing:2px;color:#8a7544}.version span{font-size:15px;letter-spacing:1px;color:var(--ink);margin-left:14px}#signout{margin-left:auto;font-size:13px}#welcome{max-width:1100px;margin:0 auto;padding:90px 40px 100px;background:radial-gradient(ellipse at 90% 30%,#e5ece7 0,transparent 55%)}.eyebrow{font-size:11px;letter-spacing:2px;color:#8a7544;font-weight:700}#welcome h1{font-size:54px;line-height:1.35;font-weight:650;letter-spacing:2px;margin:22px 0}#welcome p{font-size:17px;color:var(--muted);margin-bottom:32px}#welcome .small{font-size:12px;margin-top:22px}nav{display:flex;align-items:center;gap:10px;padding:15px 30px;border-bottom:1px solid var(--line);background:#fff}nav button{background:transparent;color:var(--muted);font-size:14px}nav button.active{background:#edf2ef;color:var(--navy)}.context{margin-left:auto;color:var(--muted);font-size:12px}.context b{color:var(--navy);font-weight:500;margin:0 12px}#workspace{display:grid;grid-template-columns:345px minmax(0,1fr);max-width:1560px;margin:0 auto}aside{padding:32px 25px;border-right:1px solid var(--line);background:#fbfcfa;min-height:calc(100vh - 155px)}aside h1{font-size:25px;margin:8px 0}.muted{color:var(--muted)}aside>.muted{margin:0 0 25px}.curriculum{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:18px 0;margin-bottom:20px;font-size:13px}.curriculum p{margin:8px 0;color:var(--muted)}.curriculum span{font-size:10px;color:var(--muted)}.small{font-size:11px;color:var(--muted)}#messages{max-height:260px;overflow:auto;margin-bottom:22px}.bubble{background:#edf1ed;border-radius:0 12px 12px 12px;font-size:13px;padding:13px 15px;margin:10px 0}.bubble.user{background:#e3ebee;border-radius:12px 0 12px 12px}textarea,input,select{border:1px solid var(--line);border-radius:7px;padding:10px 12px;width:100%;background:#fff;color:var(--ink)}textarea{resize:vertical;line-height:1.7}#send{margin-top:12px;width:100%;display:flex;justify-content:space-between}#target-box{margin-bottom:10px}#target-box label{font-size:12px}article{padding:0 32px 35px;min-width:0}.preview-toolbar{height:71px;display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:11px;color:var(--muted)}.preview-toolbar button{padding:6px 11px;font-size:12px}#empty{background:white;min-height:570px;text-align:center;padding:100px 25px;box-shadow:0 3px 16px #203b4a07;border:1px solid #e3e8e5}#empty h2{font-size:22px;font-weight:500}#empty p{font-size:13px;color:var(--muted)}.empty-icon{font-family:serif;color:var(--gold);font-size:42px;border:1px solid #ddd6bf;width:82px;height:82px;padding:4px;margin:0 auto 30px}.sample-lines{margin:50px auto;width:60%}.sample-lines i{display:block;height:1px;background:#edf0ee;margin:22px 0}#paper{max-width:850px;margin:auto;background:#fff;padding:40px 46px;box-shadow:0 3px 16px #203b4a09;border:1px solid #e0e5e1}.paper-brand{font-size:12px;color:var(--navy);letter-spacing:1px}.paper-brand span{font-size:9px;margin-left:10px;color:var(--muted)}.title{font-size:27px;font-weight:650;border:0;padding:14px 0 5px;border-radius:0}.paper-meta{font-size:11px;margin:10px 0 20px}#instructions{border:0;padding:0;font-size:13px}.draft-note{font-size:10px;color:var(--muted);border-bottom:1px solid var(--line);padding-bottom:16px}.question{margin:25px 0;break-inside:avoid}.question label{display:block;color:var(--navy);font-size:13px;font-weight:650;margin-bottom:8px}.question textarea{border:1px solid transparent;background:#fcfdfb;font-size:15px;min-height:65px}.question textarea:hover{border-color:var(--line)}.writing-line{height:30px;border-bottom:1px solid #d9dfdc}details{margin-top:35px;border-top:1px solid var(--line);padding-top:15px}summary{cursor:pointer;font-size:13px;color:var(--navy)}.answer-item label{display:block;font-size:12px;margin-top:16px}.answer-item textarea{font-size:13px}#exports{display:flex;align-items:center;flex-wrap:wrap;gap:9px;max-width:850px;margin:22px auto;font-size:12px}#exports span:not(:first-child){margin-left:15px}#exports button{padding:7px 14px;font-size:12px}#library{max-width:1100px;margin:40px auto;padding:0 30px}.section-head{display:flex;justify-content:space-between;align-items:center}.section-head input{width:260px}#library-items{display:grid;grid-template-columns:repeat(auto-fit,minmax(270px,1fr));gap:20px}.library-card{background:white;padding:24px;border:1px solid var(--line);border-radius:10px}.library-card h2{font-size:18px;margin:0 0 10px}.library-card p{font-size:12px;color:var(--muted)}.library-card button{font-size:12px}#notice{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:var(--navy);color:#fff;max-width:90vw;padding:13px 23px;border-radius:9px;z-index:20;font-size:13px}#busy{position:fixed;inset:0;background:#f8faf8df;display:flex;align-items:center;justify-content:center;gap:18px;z-index:30}.spinner{width:24px;height:24px;border:2px solid #c4d0ce;border-top-color:var(--navy);border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}dialog{border:1px solid var(--line);border-radius:12px;max-width:480px;padding:30px;box-shadow:0 10px 50px #163c5420}dialog::backdrop{background:#132e4655}dialog h2{margin-top:0}dialog label{display:flex;gap:10px;align-items:start;font-size:14px}dialog input{width:auto;margin-top:8px}dialog>div{display:flex;justify-content:end;gap:12px;margin-top:25px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media(max-width:1000px){#workspace{grid-template-columns:300px 1fr}article{padding:0 18px}#paper{padding:28px}header{padding:0 22px}.context{font-size:10px}}@media(max-width:760px){header{height:70px;gap:20px;padding:0 16px}.brand{font-size:26px;gap:10px}.brand span{padding-left:10px;font-size:10px}.version{display:none}nav{padding:10px;flex-wrap:wrap}.context{width:100%;margin-left:15px}#workspace{display:block}aside{min-height:0;border-right:0;border-bottom:1px solid var(--line);padding:24px}#messages{max-height:150px}.curriculum{display:none}article{padding:0 12px 20px}.preview-toolbar{flex-wrap:wrap;height:auto;min-height:70px;padding:12px 0}#paper{padding:24px 20px}.title{font-size:23px}#welcome{padding:60px 25px}#welcome h1{font-size:38px}#welcome p{font-size:15px}.section-head{display:block}.section-head input{width:100%;margin-bottom:20px}#empty{min-height:400px;padding-top:60px}}

.lesson-art{width:100%;height:auto;display:block;margin:18px 0 25px}

.art-controls{display:flex;flex-wrap:wrap;align-items:center;gap:12px;font-size:10px;color:var(--muted);margin-top:-15px;margin-bottom:20px}.art-controls label{cursor:pointer;color:var(--navy);font-weight:600}.art-controls input{width:180px;font-size:10px;padding:3px}.art-controls button{font-size:10px;padding:4px 9px}

.question .space-control{font-size:10px;font-weight:400;color:var(--muted);display:flex;align-items:center;gap:8px;margin:5px 0}.space-control select{width:auto;max-width:180px;font-size:10px;padding:2px 8px}

#context-picker{border:1px solid var(--line);border-radius:10px;padding:12px;margin:20px 0 8px;min-width:0}#context-picker legend{font-size:13px;font-weight:650;padding:0 5px}#context-picker legend span{display:block;font-size:10px;font-weight:400}#context-picker label{display:block;font-size:11px;margin:7px 0 3px}#context-picker select,#context-picker input{font-size:12px;padding:7px;min-width:0}#context-picker select:disabled,#context-picker input:disabled{opacity:1;background:#f0f3f1;color:#536975}.lesson-range{display:grid;grid-template-columns:1fr 1fr;gap:8px}.curriculum summary{font-size:12px}.curriculum p{white-space:pre-line;font-size:12px;max-height:180px;overflow:auto}.curriculum span{font-size:10px}#context-note{margin:8px 0;font-size:10px}@media(max-width:760px){.curriculum{display:block}#context-picker{margin-top:12px}}

@font-face{font-family:Iansui;src:url('/static/fonts/Iansui-Regular.ttf') format('truetype');font-display:swap}.question textarea{font-family:Iansui,'Noto Sans CJK TC',serif;font-size:20px;line-height:1.8}.language-tools{border-block:1px solid var(--line);padding:12px 0;margin:18px 0;display:flex;flex-wrap:wrap;gap:8px;align-items:center}.language-tools span{font-size:11px;color:var(--muted)}.language-tools span:last-child{flex-basis:100%}#language-result{white-space:pre-wrap;font:12px/1.7 sans-serif;max-height:250px;overflow:auto}#language-details summary{font-size:12px}

.zhuyin-tools{background:#f4f7f3;padding:14px;border-radius:10px;margin:18px 0}.zhuyin-tools>label{font-weight:650;font-size:14px}.zhuyin-tools input{width:auto;margin-right:6px}.zhuyin-tools button{font-size:11px;margin:6px}.zhuyin-tools>span{display:block;font-size:12px;color:var(--muted)}.zhuyin-tools .small{font-size:10px;margin:8px 0 0}.zhuyin-preview img{display:block;width:100%;height:auto}.text-editor>summary{display:none}.text-editor.annotated>summary{display:list-item;cursor:pointer;font-size:11px;color:var(--muted);margin:6px 0}.practice-grid{height:36px!important;border:1px solid #b7bfc3!important;background-image:repeating-linear-gradient(to right,transparent 0,transparent 35px,#b7bfc3 35px,#b7bfc3 36px),repeating-linear-gradient(to right,transparent 0,transparent 17px,#dde1e4 17px,#dde1e4 18px,transparent 18px,transparent 36px),linear-gradient(to bottom,transparent 49%,#dde1e4 49%,#dde1e4 51%,transparent 51%);margin:0!important}.art-controls select{font-size:11px;width:220px;padding:4px}#art-select{display:block}.question>select{font-size:11px;padding:3px;width:100px;margin-bottom:5px}

.practice-grid{height:auto!important;aspect-ratio:912/67;background:url('/static/writing-grid.png') center/100% 100% no-repeat;border:0!important}

#reading-review fieldset{border:1px solid #d7dfd8;background:#fff;padding:10px;margin:12px 0;border-radius:6px}#reading-review legend{font-size:12px;padding:0 4px}#reading-review fieldset label{display:inline-flex;align-items:center;margin:5px 12px 5px 0;gap:6px;cursor:pointer}#reading-review img{height:62px;object-fit:contain}#reading-review p{font-size:12px}

.illustration-tools{margin:16px 0;padding:14px;border:1px solid #dbe2e8;border-radius:10px;background:#f7f9fb}.art-gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(165px,1fr));gap:12px;margin:12px 0}.art-card{background:white;border:1px solid #dbe2e8;border-radius:8px;padding:12px;font-size:13px}.art-card img{display:block;width:100%;height:135px;object-fit:contain;margin-bottom:8px}.art-card p{font-size:12px;line-height:1.6}.illustration-tools textarea{width:100%;margin:8px 0}.grayscale{filter:grayscale(1)}.lesson-art{max-height:320px;object-fit:contain}#share-dialog label{display:block;margin:15px 0}

.question-art{display:block;max-width:100%;height:230px;object-fit:contain;margin:12px auto}#zy-fields{display:flex;gap:10px;flex-wrap:wrap;margin:12px 0}#zy-fields label{font-size:13px}#zhuyin-scope{margin:12px 0}#zy-characters{max-width:100%}

#paper:has(#art-grayscale:checked) .question-art{filter:grayscale(1)}

/* KMCS visual identity: existing controls and learning layout retained. */
:root{--navy:#142d47;--gold:#b68b49;--ink:#25394b;--muted:#5e7182;--line:#dce2e8;--bg:#f4f1eb}
body{background:var(--bg);color:var(--ink)}
body>header{height:100px;padding:0 36px;background:var(--navy);border-bottom:3px solid var(--gold);gap:34px;color:white;box-shadow:0 3px 16px #142d4712}
.brand{gap:15px;letter-spacing:0;color:#fff;flex-shrink:0}.school-crest{width:64px;height:64px;object-fit:contain;border-radius:50%;background:#fff;padding:2px}
.brand .school-name{border:0;padding:0;color:#fff;font-size:23px;font-weight:650;letter-spacing:3px;line-height:1.4}.school-name small{display:block;color:#e0c99f;letter-spacing:1.4px;font-size:9px;font-weight:500;margin-top:4px}
.version{border-left:1px solid #ffffff30;padding-left:28px;color:#e0c99f;letter-spacing:2px;font-size:10px}.version span{display:block;margin:3px 0 0;color:white;font-size:19px;letter-spacing:3px;font-weight:500}
#signout{color:#fff;border-color:#ffffff45;background:#ffffff08;padding:7px 16px}button{border-radius:8px;transition:background .15s,box-shadow .15s}button:hover:not(:disabled){filter:none;background:#244867;box-shadow:0 3px 10px #142d471a}button.quiet:hover:not(:disabled){background:#edf2f6;color:var(--navy)}button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid #b68b49;outline-offset:3px}input,select,textarea{border-color:#cbd5de}input:disabled,select:disabled{cursor:default}
#welcome{max-width:1180px;display:grid;grid-template-columns:1.25fr 1fr;gap:72px;padding:70px 40px 80px;background:none;align-items:center}.welcome-copy>.eyebrow{font-size:11px;color:#7d5b26;letter-spacing:2.8px}.welcome-kicker{font-size:15px!important;font-weight:600;color:var(--navy)!important;margin:16px 0 0!important}#welcome h1{font-family:Iansui,'Noto Serif CJK TC',serif;font-size:46px;font-weight:400;line-height:1.5;letter-spacing:1px;margin:18px 0 20px}#welcome p{font-size:16px;line-height:1.9}#welcome .small{font-size:11px}#signin{padding:14px 22px;border-bottom:3px solid var(--gold);box-shadow:0 5px 18px #142d471a}
#welcome .welcome-panel{min-height:0;padding:30px 32px;margin:0;border:1px solid #ded6c7;border-top:4px solid var(--gold);background:#fffdf9;box-shadow:0 14px 40px #142d470d;border-radius:3px 3px 16px 16px;position:relative} .welcome-panel>img{display:block;margin:auto}.welcome-panel .welcome-school{text-align:center;font-size:12px!important;letter-spacing:2px;margin:12px 0 20px!important;color:#795c30!important}.welcome-panel h2{font-family:Iansui,serif;font-size:28px;font-weight:400;line-height:1.6;text-align:center;margin:0 0 24px}.welcome-panel ol{list-style:none;padding:0;margin:0}.welcome-panel li{display:flex;gap:16px;align-items:flex-start;padding:15px 0;border-top:1px solid #e9e3d9}.welcome-panel li>span{font-family:Georgia,serif;font-size:20px;color:#9a7135;line-height:1.4}.welcome-panel strong{font-size:14px;font-weight:600}.welcome-panel li p{font-size:12px!important;margin:3px 0 0!important;line-height:1.7!important}
#studio>nav{padding:12px max(24px,calc((100vw - 1460px)/2 + 24px));gap:8px;min-height:68px;box-shadow:0 2px 4px #142d4703}nav button{color:#546779;border-radius:7px;padding:9px 18px;font-weight:550}nav button.active{background:var(--navy);color:#fff;box-shadow:inset 0 -3px var(--gold)}nav button:hover:not(:disabled){color:white}.context{background:#f5f3ee;padding:6px 11px;border-radius:6px;color:#526475;font-size:11px}
#workspace{grid-template-columns:340px minmax(0,1fr);max-width:1460px;padding:24px;gap:26px;align-items:start}#workspace>aside{min-height:0;background:#fff;padding:26px 22px;border:1px solid var(--line);border-top:3px solid var(--gold);border-radius:10px;box-shadow:0 5px 20px #142d4705}aside h1{font-family:Iansui,serif;font-size:28px;font-weight:400;margin:9px 0 7px}aside>.muted{font-size:13px;margin-bottom:20px}.eyebrow{color:#7c5b29;letter-spacing:1.8px}#context-picker{background:#f7f8fa;border:1px solid #dce3eb;border-radius:8px;padding:12px 13px;margin:18px 0 8px}#context-picker legend{color:#243e58;font-size:12px}#context-picker select:disabled,#context-picker input:disabled{background:#edf1f5;color:#506476}#context-picker label{color:#4f6376}.curriculum{margin-top:15px;margin-bottom:16px;padding:12px 0}.bubble{background:#f6f3ec;border-left:3px solid #c7a66d;border-radius:0 8px 8px 0;line-height:1.85}.bubble.user{background:#edf2f7;border-left:3px solid #54748e;border-radius:0 8px 8px 0}#messages{max-height:290px;margin-bottom:16px}#prompt{background:#fffefa;border:1px solid #b6c5d2;font-size:14px;min-height:115px}#input-hint{line-height:1.7;color:#637383}#send{padding:12px 16px;border-bottom:3px solid var(--gold)}
#workspace>article{padding:0 0 25px}.preview-heading{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:0 2px 8px}.preview-heading>.eyebrow{font-size:10px}.preview-heading>span:last-child{font-size:11px;color:var(--muted)}.preview-toolbar{min-height:54px;height:auto;padding:10px 0 14px;gap:12px}.preview-toolbar>div:last-child{display:flex;gap:7px}.preview-toolbar button{background:#ffffffa6;border-color:#cbd4de}.preview-toolbar #share{color:var(--navy);border-color:#bba374;background:#f8f3e8}
#paper{border:1px solid #d9dfe5;border-top:4px solid var(--gold);border-radius:3px;padding:30px 38px;box-shadow:0 8px 30px #142d470a}.paper-brand{display:flex;align-items:center;gap:11px;letter-spacing:1.1px;font-weight:600}.paper-brand>img{object-fit:contain;width:38px;height:38px;flex-shrink:0}.paper-brand span{display:block;margin:2px 0 0;font-size:9px;letter-spacing:.4px;font-weight:400}.title{font-size:26px;color:var(--navy);padding:19px 0 7px;background:transparent;border-bottom:1px solid transparent}.title:focus{border-bottom-color:var(--gold)}.paper-meta{line-height:1.8;color:#4d6175}.draft-note{color:#657588;border-color:#e4e8ed;padding-bottom:14px}.question{margin:28px 0}.question>label{font-size:13px;color:#23425f;border-left:3px solid var(--gold);padding-left:9px;margin-bottom:12px}.question textarea{background:#fbfcfd;border:1px solid transparent;border-radius:5px}.question textarea:focus,.question textarea:hover{border-color:#c9d5df;background:white}.writing-line{border-color:#c7d1da}.art-controls{background:#f6f8fa;border:1px solid #e0e6ed;border-radius:7px;padding:12px;margin:16px 0;gap:10px}.art-controls label{font-size:11px}.illustration-tools{background:#faf9f6;border-color:#e1dacd;border-radius:7px}.zhuyin-tools{background:#f1f5f9;border:1px solid #d7e1eb;border-left:3px solid #52728f;border-radius:7px}.zhuyin-tools>label{color:#203f5b}.language-tools{border-color:#e0e6eb}.text-editor{border:0;margin:0;padding:0}.question .space-control{padding:3px 0;font-size:11px}.question>select{width:110px}#answers{border-color:#e0e5ea}.art-card{border-color:#dfd8cb}.art-card strong{color:var(--navy)}
#exports{background:white;border:1px solid #d7dfe6;border-left:3px solid var(--gold);border-radius:7px;padding:14px 16px;margin:18px auto;gap:10px}#exports span{font-size:11px;color:#4a6176}#exports button{min-width:55px}.library-card{border-radius:8px;border-top:3px solid #c3a16b;box-shadow:0 4px 18px #142d4706}.library-card h2{color:var(--navy);font-size:18px}.section-head h1{font-family:Iansui,serif;font-weight:400;font-size:30px}#empty{border:1px solid #d9e0e6;border-top:4px solid var(--gold);border-radius:3px;box-shadow:0 8px 30px #142d4708;background:#fffdfa}.empty-icon{background:#f6f0e4;border-color:#d3bd93;border-radius:50%;font-family:Iansui,serif;line-height:1.65}.sample-lines i{background:#e8e3da}#busy{background:#f5f3eef0}#notice{box-shadow:0 4px 18px #142d472b}
@media(max-width:1100px){body>header{padding:0 24px;gap:24px}#workspace{grid-template-columns:300px minmax(0,1fr);padding:20px;gap:20px}#paper{padding:25px}.preview-heading>span:last-child{display:none}#welcome{gap:36px;padding:52px 30px}#welcome h1{font-size:37px}}
@media(max-width:760px){body>header{height:88px;padding:0 16px;gap:10px}.school-crest{width:51px;height:51px}.brand{gap:10px}.brand .school-name{font-size:19px;letter-spacing:2px}.school-name small{font-size:7px;letter-spacing:.8px}.version{display:none}#signout{padding:6px 10px;font-size:12px}#studio>nav{padding:10px 12px;gap:5px}nav button{padding:9px 12px;font-size:13px}.context{width:100%;margin:5px 0 0;font-size:11px}#workspace{display:block;padding:16px}#workspace>aside{padding:22px;margin-bottom:22px}#workspace>article{padding:0}.preview-toolbar{padding:10px 0;flex-wrap:wrap}.preview-heading{padding-bottom:0}#paper{padding:23px 20px}.title{font-size:23px}#exports{gap:8px;padding:12px}#exports span:not(:first-child){margin-left:4px}#welcome{display:block;padding:38px 24px 45px}#welcome h1{font-size:36px}#welcome .welcome-panel{margin-top:38px;padding:26px}#welcome p{font-size:15px}#library{margin:28px auto;padding:0 18px}.section-head input{width:100%}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}