:root{font-family:Arial,Helvetica,sans-serif;color:#203645;background:#f8f5ef;font-synthesis:none}*{box-sizing:border-box}body{margin:0}main{max-width:1000px;margin:auto;padding:30px 24px}header{display:flex;align-items:center;justify-content:space-between;gap:12px}header img{object-fit:contain;object-position:left}.badge{border:1px solid #c8704c;border-radius:20px;padding:7px 12px;font-size:13px;white-space:nowrap}h1{font-size:clamp(27px,4vw,42px);line-height:1.12;margin:25px 0 12px}.intro{font-size:18px;line-height:1.5;max-width:780px}form{display:flex;align-items:end;gap:12px;flex-wrap:wrap;background:#fff;border:1px solid #d4dce0;padding:18px;border-radius:12px}label{display:flex;flex-direction:column;gap:7px;font-weight:bold;flex:1;min-width:135px}input,select,button{font:inherit;font-size:16px;min-height:44px;border:1px solid #73818a;border-radius:6px;padding:10px 12px;background:white;color:#203645}input,select{width:100%}button{cursor:pointer}button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #c8704c;outline-offset:2px}#export{background:#203645;color:#fff;font-weight:bold}#export:disabled{background:#8c989f;cursor:default}.small,footer{font-size:14px;line-height:1.5}#error{background:#fff1e8;padding:12px;border:1px solid #a45d3c;border-radius:6px}#status{line-height:1.5}nav{display:flex;gap:8px;flex-wrap:wrap;margin:18px 0}nav button{font-size:14px;flex:1}nav button[aria-pressed=true]{background:#eee1d6;border-color:#c8704c;font-weight:bold}.preview-shell{padding:18px;border:1px solid #d4dce0;border-radius:12px;background:#e8e8e4}#preview{max-width:780px;margin:auto;background:white;box-shadow:0 2px 8px #0002}#preview svg{display:block;width:100%;height:auto}#preview[data-invalid=true]{min-height:180px;background:#f1f1ef;padding:24px;box-shadow:none}footer{margin:24px 0 0;color:#596b76}@media(max-width:480px){main{padding:18px 12px}header img{width:160px;height:36px}.badge{font-size:11px;padding:6px 8px}.intro{font-size:16px}form{padding:12px;gap:10px}label{min-width:115px}form button{flex:1;min-width:125px}nav{gap:7px}nav button{flex-basis:100%;min-height:44px}.preview-shell{padding:5px}#preview[data-invalid=true]{padding:18px}}

/* R13: enlarged action text stays within the chosen paper controls. */
#controls button { min-width: 0; overflow-wrap: anywhere; white-space: normal; }
header { flex-wrap: wrap; }
header a { overflow-wrap: anywhere; }
a:focus-visible { outline: 3px solid #245f87; outline-offset: 3px; }
@media (prefers-reduced-motion: reduce) { *,*::before,*::after { scroll-behavior: auto!important; animation: none!important; transition: none!important; } }

/* R14: current semantic worksheet follows ordinary document reading order. */
#readable { margin: 22px 0; padding: 20px; background: #fff; border: 1px solid #d4dce0; border-radius: 12px; line-height: 1.65; overflow-wrap: anywhere; }
#readable h2 { margin-top: 0; }
#readable h3 { line-height: 1.3; }
#readable ol { padding-left: 1.6em; }
#readable li { margin: 0 0 1em; }
#readable .question-line { font-weight: bold; }
#readable .question-id { display: block; font-size: .9em; color: #596b76; }
#readable details { border-top: 1px solid #d4dce0; padding-top: 14px; }
#readable summary { cursor: pointer; font-weight: bold; min-height: 44px; padding: 8px 0; }
#readable summary:focus-visible { outline: 3px solid #245f87; outline-offset: 3px; }
#export-text:disabled { cursor: default; color: #596b76; }
@media(max-width:480px) { #readable { padding: 14px; } }


/* R18: existing local brand fonts and HTML-only identity; native SVG/PDF untouched.
   Optional fonts never block first-use text and need no preload or new service. */
@font-face{font-family:"Jost";src:url("../brand/fonts/jost-variable.woff2") format("woff2");font-style:normal;font-weight:100 900;font-display:optional}
@font-face{font-family:"Inter";src:url("../brand/fonts/inter-variable.woff2") format("woff2");font-style:normal;font-weight:100 900;font-display:optional}
:root{--ink:#203645;--muted:#52636f;--paper:#fbf8f3;--surface:#fff;--line:#d9dedc;--line-strong:#6d808b;--accent:#25495e;--focus:#245f87;--soft-blue:#e8eef5;--soft-gold:#fbf0dc;--font-display:"Jost","Century Gothic","Avenir Next",sans-serif;--font-ui:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif;font-family:var(--font-ui);color:var(--ink);background:var(--paper);color-scheme:light}
body{background:var(--paper);color:var(--ink);font:16px/1.6 var(--font-ui)}
h1,h2,h3{font-family:var(--font-display);font-weight:500;line-height:1.2;letter-spacing:-.025em}
h1{font-size:clamp(30px,4vw,46px)}h2{font-size:clamp(24px,3vw,32px)}h3{font-size:23px}
a{color:var(--accent);text-underline-offset:.2em}a:hover{color:var(--ink);text-decoration-thickness:2px}
.return-nav{display:flex;flex-wrap:wrap;gap:10px 16px;margin:0}.return-nav a{display:inline-flex;align-items:center;min-height:44px;font-weight:600;font-size:14px}
header{padding-bottom:18px;border-bottom:1px solid var(--line)}
form{border-color:var(--line);border-radius:16px;background:var(--surface)}
input,select,button{border-color:var(--line-strong);border-radius:8px;color:var(--ink);line-height:1.4}
button{font-weight:600}button:hover:not(:disabled){background:var(--soft-blue);border-color:var(--accent)}
button:focus-visible,input:focus-visible,select:focus-visible,a:focus-visible{outline:3px solid var(--focus);outline-offset:4px}
#export{background:var(--accent);border-color:var(--accent)}#export:hover:not(:disabled){background:var(--ink);color:#fff}
#export:disabled{background:#8c989f;cursor:default}#export-text:disabled{color:var(--muted)}
#pages button[aria-pressed=true]{background:var(--soft-gold);border-color:var(--accent);color:var(--ink)}
#addition-routine,#readable{margin:22px 0;padding:20px;border:1px solid var(--line);border-radius:16px;background:var(--surface);line-height:1.65;overflow-wrap:anywhere}
#addition-routine h2,#readable h2{margin-top:0}#addition-routine li{margin-bottom:.8em}
#readable .question-id,footer{color:var(--muted)}#readable details{border-color:var(--line)}
.preview-shell{background:#f3efe8;border-color:var(--line);border-radius:16px}
@media(max-width:480px){#addition-routine,#readable{padding:14px}.return-nav{gap:8px 14px}header{gap:8px}}

/* R18 narrow actions: keep complete download words in one useful full row. */
@media(max-width:480px){#controls button{flex-basis:100%}}

/* C12: a focused practice choice remains readable with enlarged text. */
#controls label[for="profile"]{flex-basis:210px}
#profile-help{max-width:80ch}


/* C13: local checking follows the worksheet's current scene facts. */
#checking{margin:22px 0;padding:20px;border:1px solid var(--line);border-radius:16px;background:var(--surface);overflow-wrap:anywhere}
#checking h2{margin-top:0}#check-form{display:block;padding:16px}#check-form>label{margin-bottom:12px}#check-form>button{margin:6px 8px 8px 0}#check-form label{min-width:0}#check-form select{max-width:100%;width:100%}.check-context{font-size:14px}
#check-form fieldset{margin:18px 0;padding:14px;border:1px solid var(--line-strong);border-radius:8px;min-width:0}#check-form legend{font-weight:600;padding:0 5px}.check-step-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-bottom:12px}
#check-feedback{margin-top:16px;padding:16px;background:var(--soft-blue);border:1px solid var(--line-strong);border-radius:8px}#check-feedback h3{margin-top:0}#check-feedback:focus{outline:3px solid var(--focus);outline-offset:4px}#check-feedback[data-result="invalid"]{background:var(--soft-gold)}
@media(max-width:480px){#checking{padding:14px}#check-form{padding:12px}.check-step-grid{grid-template-columns:1fr}#check-form button{width:100%;margin:6px 0;white-space:normal;overflow-wrap:anywhere}#check-feedback{padding:12px}}

/* C14: explicit local practice transfer. */
#practice-transfer{margin:22px 0;padding:20px;border:1px solid var(--line);border-radius:16px;background:var(--surface);overflow-wrap:anywhere}#practice-transfer h2{margin-top:0}#practice-transfer textarea{box-sizing:border-box;width:100%;max-width:100%;padding:12px;border:1px solid var(--line-strong);border-radius:8px;background:var(--surface);color:var(--ink);font:inherit;resize:vertical}#practice-transfer textarea:focus-visible{outline:3px solid var(--focus);outline-offset:4px}.practice-actions{display:flex;flex-wrap:wrap;gap:12px;margin:14px 0}#practice-import-review{padding:16px;background:var(--soft-gold);border:1px solid var(--line-strong);border-radius:8px}#practice-import-review:focus{outline:3px solid var(--focus);outline-offset:4px}
@media(max-width:480px){#practice-transfer{padding:14px}.practice-actions button{width:100%;white-space:normal}#practice-import-review{padding:12px}}