/* Warm editorial workbook: a teal spine, paper surface, deliberate Thai type. */
:root {color-scheme:light;--paper:#f5f1e8;--sheet:#fffdf8;--ink:#253c37;--muted:#58685f;--teal:#185c54;--light-teal:#e4eee8;--line:#d7d8ca;--red:#983e30;--sand:#eee6d4;--body:'Leelawadee UI','Tahoma',sans-serif;--display:'Georgia','Leelawadee UI','Tahoma',serif;}
* {box-sizing:border-box;}
body {margin:0;background:var(--paper);color:var(--ink);font-family:var(--body);font-size:17px;line-height:1.85;}
a {color:var(--teal);text-underline-offset:4px;overflow-wrap:anywhere;}
button,input,select,textarea {font:inherit;color:inherit;}
button {background:transparent;border:1px solid var(--line);border-radius:4px;padding:9px 15px;min-height:44px;cursor:pointer;line-height:1.5;text-align:left;}
button:hover {background:var(--light-teal);border-color:var(--teal);}
button:disabled {cursor:not-allowed;opacity:.56;background:transparent;border-color:var(--line);}
button.primary {background:var(--teal);color:white;border-color:var(--teal);}
button.primary:hover {background:#124c45;}
button.primary:disabled {background:#58685f;}
:focus-visible {outline:3px solid #ac5924;outline-offset:4px;}
p {margin:0 0 1.1em;}
h1,h2,h3 {line-height:1.5;text-wrap:pretty;font-weight:600;}
h1 {font-family:var(--display);font-size:clamp(29px,3vw,45px);letter-spacing:-.025em;white-space:pre-line;margin:17px 0 15px;}
h2 {font-size:25px;margin:0 0 18px;}
h3 {font-size:19px;margin:18px 0 12px;}
ul,ol {padding-left:25px;}
li {margin-bottom:8px;}
small {font-size:13px;line-height:1.7;}
.skip {position:absolute;top:0;left:0;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;}
.skip:focus {position:fixed;top:8px;left:20px;width:auto;height:auto;clip-path:none;overflow:visible;background:var(--sheet);padding:12px;z-index:10;white-space:normal;}
.masthead {display:flex;justify-content:space-between;align-items:center;gap:30px;padding:22px max(26px,calc((100vw - 1400px)/2));border-bottom:1px solid var(--line);background:var(--sheet);}
.brand {display:flex;gap:14px;align-items:center;color:var(--ink);text-decoration:none;font-size:22px;font-weight:600;line-height:1.5;}
.brand small {display:block;color:var(--muted);font-weight:400;}
.brand-mark {display:grid;place-items:center;min-width:46px;height:51px;background:var(--teal);color:white;border-radius:2px 10px 10px 2px;font-size:29px;font-family:var(--display);}
#top-nav {display:flex;gap:6px;flex-wrap:wrap;}
#top-nav button {border-color:transparent;font-size:15px;}
#top-nav button[aria-current='page'] {border-bottom:2px solid var(--teal);border-radius:0;color:var(--teal);font-weight:600;}
.workspace {display:grid;grid-template-columns:290px minmax(0,1fr);max-width:1400px;margin:0 auto;align-items:start;}
#sidebar {padding:38px 26px 30px;position:sticky;top:0;}
.edition,.kicker {font-size:12px;text-transform:uppercase;letter-spacing:.07em;color:var(--teal);font-weight:600;}
#sidebar h2 {font-family:var(--display);font-size:28px;white-space:pre-line;margin:22px 0 15px;}
#sidebar>p {font-size:14px;color:var(--muted);}
#sidebar details>summary {font-size:15px;font-weight:600;padding:12px 0;border-bottom:1px solid var(--line);cursor:pointer;}
.lesson-list {list-style:none;padding:0;margin:16px 0;}
.lesson-list li {margin:0;}
.lesson-list button {display:flex;align-items:baseline;width:100%;gap:14px;border:none;padding:14px 8px;border-bottom:1px solid var(--line);font-size:15px;}
.lesson-index {color:var(--teal);font-family:Georgia,serif;}
.lesson-list small {display:block;color:var(--muted);margin-top:7px;font-size:12px;}
.lesson-list button[aria-current='page'] {background:var(--light-teal);}
.progress-block {font-size:14px;padding-top:20px;}
progress {appearance:none;display:block;width:100%;height:6px;margin:16px 0;background:var(--line);border:0;border-radius:0;}
progress::-webkit-progress-bar {background:var(--line);}
progress::-webkit-progress-value {background:var(--teal);}
progress::-moz-progress-bar {background:var(--teal);}
.sidebar-note {font-size:13px;color:var(--muted);padding-top:18px;border-top:1px solid var(--line);}
#main {background:var(--sheet);min-height:90vh;padding:46px clamp(24px,5vw,82px) 65px;border-left:1px solid var(--line);border-right:1px solid var(--line);outline-offset:-4px;min-width:0;}
.lesson-heading {padding-bottom:30px;border-bottom:1px solid var(--line);margin-bottom:36px;}
.lesson-heading>p {font-size:18px;color:var(--muted);}
.objective {margin-top:25px;font-size:15px;background:var(--sand);padding:18px 22px;}
.objective strong {color:var(--teal);font-size:13px;}
.objective p {margin:6px 0 0;}
.reading {margin-bottom:36px;}
.reading p {text-wrap:pretty;}
.lab {background:#edf2e9;border:1px solid #c7d5c8;padding:28px;margin:44px 0;}
.lab h2 {margin-top:12px;}
.lab label {display:block;font-weight:600;font-size:15px;margin-bottom:8px;}
.input-row {display:flex;gap:10px;align-items:stretch;}
.input-row input {flex:1;min-width:0;}
input[type='text'],textarea,select {background:var(--sheet);border:1px solid #9baea2;border-radius:3px;padding:11px 13px;width:100%;min-height:46px;line-height:1.7;}
textarea {resize:vertical;}
select {margin-bottom:16px;}
.quick-actions,.actions {display:flex;gap:10px;flex-wrap:wrap;margin:16px 0;}
.quick-actions button {font-size:14px;background:var(--sheet);}
[aria-pressed='true'] {background:var(--teal);color:white;border-color:var(--teal);}
.experiment-history {padding-left:24px;max-height:310px;overflow:auto;font-size:15px;}
.experiment-history li {padding:10px 0;border-bottom:1px solid #cad6c9;}
.experiment-history p {margin:4px 0;}
.note {font-size:14px;color:var(--muted);line-height:1.9;}
#bot-output,#context-feedback,#prompt-feedback {font-weight:600;font-size:15px;}
.field {margin:22px 0;}
.field label {display:block;margin-bottom:10px;font-size:15px;font-weight:600;}
pre,.learner-text {white-space:pre-wrap;overflow-wrap:anywhere;font-family:var(--body);font-size:15px;}
pre:empty {display:none;}
pre {padding:18px;border:1px solid var(--line);background:var(--sheet);}
.table-wrap {overflow:auto;margin:17px 0;}
table {width:100%;border-collapse:collapse;font-size:14px;background:var(--sheet);}
th,td {padding:10px 12px;text-align:left;border-bottom:1px solid var(--line);}
th {color:var(--teal);}
.quiz {padding:12px 0 34px;margin-bottom:36px;border-bottom:1px solid var(--line);}
.quiz h2,.journal h2 {margin-top:12px;}
fieldset {padding:0;border:0;margin:26px 0;min-width:0;}
legend {font-weight:600;margin-bottom:12px;}
.quiz-option {display:flex;gap:13px;align-items:center;background:var(--paper);padding:12px 16px;margin:9px 0;min-height:50px;cursor:pointer;border:1px solid transparent;border-radius:3px;font-size:15px;}
.quiz-option:has(input:checked) {background:var(--light-teal);border-color:var(--teal);}
input[type='radio'] {accent-color:var(--teal);width:18px;height:18px;flex:none;}
#quiz-feedback {margin-top:22px;}
.correct {color:var(--teal);}
.incorrect {color:var(--red);}
.journal {margin:36px 0;}
.proof-section,.references,.transfer {border-top:1px solid var(--line);padding-top:30px;margin-top:38px;}
.references {font-size:14px;}
.references h2 {font-size:20px;}
.roadmap section {display:grid;grid-template-columns:56px minmax(0,1fr);gap:15px;padding:28px 0;border-bottom:1px solid var(--line);}
.stage-number {font-size:26px;color:var(--teal);font-family:Georgia,serif;line-height:1.8;}
.roadmap h2 {margin:8px 0 15px;}
.roadmap ul {font-size:16px;}
.notebook-summary details {padding:16px 0;border-bottom:1px solid var(--line);}
summary {cursor:pointer;min-height:44px;}
footer {display:flex;justify-content:space-between;align-items:start;gap:26px;max-width:1400px;margin:0 auto;padding:25px 26px;font-size:12px;color:var(--muted);}
footer p {max-width:440px;}
#save-status {color:var(--teal);font-weight:600;}
#transfer-message {padding-top:15px;}
#transfer-message button {margin:0 10px 10px 0;}
@media(max-width:1000px) {
  .masthead {flex-wrap:wrap;gap:16px;}
  .workspace {grid-template-columns:240px minmax(0,1fr);}
  #sidebar {padding:30px 18px;}
  #main {padding:36px 28px 50px;}
}
@media(max-width:700px) {
  body {font-size:16px;line-height:1.9;}
  .masthead {padding:18px;gap:18px;}
  .brand {font-size:21px;}
  .brand small {font-size:11px;}
  #top-nav {width:100%;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:2px;}
  #top-nav button {font-size:12px;padding:8px 4px;min-height:48px;text-align:center;}
  .workspace {display:block;}
  #sidebar {position:static;padding:23px 18px 20px;}
  #sidebar h2,#sidebar>p,.sidebar-note {display:none;}
  #sidebar .edition {font-size:10px;margin-bottom:8px;}
  #sidebar details>summary {font-size:14px;}
  .lesson-list {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 10px;}
  .lesson-list button {font-size:13px;padding:10px 6px;height:100%;gap:8px;align-items:start;}
  .lesson-list small {font-size:10px;}
  .progress-block {padding-top:10px;font-size:12px;}
  .progress-block .note {display:none;}
  progress {margin:9px 0 0;}
  #main {padding:28px 20px 42px;border-left:0;border-right:0;border-top:1px solid var(--line);}
  .lesson-heading {padding-bottom:25px;margin-bottom:28px;}
  h1 {font-size:31px;}
  h2 {font-size:23px;}
  .lesson-heading>p {font-size:16px;}
  .kicker {font-size:11px;}
  .lab {padding:20px 16px;margin:30px 0;}
  .input-row {flex-direction:column;}
  .input-row button {text-align:center;}
  .quiz-option {padding:12px;font-size:14px;}
  .roadmap section {grid-template-columns:35px minmax(0,1fr);gap:12px;}
  th,td {padding:9px 7px;font-size:12px;}
  footer {display:block;padding:20px;}
  footer p {margin:15px 0 0;}
}
@media(prefers-reduced-motion:reduce) {* {scroll-behavior:auto!important;}}
@media print {
  .masthead,#sidebar,footer,.actions,.quick-actions,.transfer {display:none;}
  .workspace {display:block;}
  #main {padding:0;border:0;}
  body {font-size:12pt;background:white;}
  .lab,section {break-inside:avoid;}
}