#main, #modal-body { --doc-accent:#71b9b0; --doc-soft:#e8f5f3; --doc-ink:#1f2933; }
#main .source-block {max-width:1000px;margin:0 auto;}
#main .source-block p, #modal-body p {line-height:1.7;}
#main .start-wrap {display:flex;justify-content:center;margin:32px 0;}
#main .question-list {margin:24px 0;}
#main .answer-block {padding:18px 0 26px;}
#main .answer-block label.question {display:block;white-space:pre-line;margin-bottom:12px;}
#main .source-images {display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:24px;margin:24px 0;}
#main .source-images img {display:block;max-width:100%;height:210px;object-fit:contain;}
#main .table-scroll {max-width:100%;overflow:auto;margin:24px 0;}
#main table caption {text-align:left;font-weight:600;padding:10px 0;}
#main table th {background:#e1f0ed;color:#203c4d;}
#main table input {width:100%;min-width:90px;max-width:100%;padding:8px;border:1px solid #9db9b5;border-radius:3px;background:#fff;}
#main .lock-note {font-size:14px;color:#54636e;}
#main .draw-grid {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin:20px 0 32px;}
#main .draw-cell {min-width:0;}
#main .draw-cell strong {display:block;margin:0 0 8px;}
#main .draw-canvas {display:block;width:100%;height:auto;aspect-ratio:5/3;border:1px solid #9abeb8;background:white;touch-action:none;}
#main .draw-actions {display:flex;justify-content:flex-end;margin-top:8px;}
#main .completion-panel {margin:24px 0;text-align:center;}
#modal-body img {max-width:100%;height:auto;}
#main .evidence-card {margin:28px 0;border-top:3px solid #71b9b0;background:#f3f8f7;padding:20px;}
#main .evidence-body {display:grid;grid-template-columns:minmax(0,1fr) minmax(180px,1fr);gap:24px;align-items:center;}
#main .evidence-body figure {margin:0;text-align:center;}
#main .evidence-body img {max-width:100%;max-height:300px;object-fit:contain;}
#main .evidence-body dt {font-weight:700;}
#main .evidence-body dd {margin:0 0 20px;}
#main .process-diagram {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:24px 0;}
#main .process-diagram input, #main .classification input {width:100%;min-height:44px;border:1px solid #93b3ad;padding:8px;}
#main .process-diagram label {display:block;}
#main .diagram-arrow {display:block;text-align:center;font-size:24px;}
#main .classification, #modal-body .classification {background:#f0f6f3;padding:20px;margin:20px 0;border-left:4px solid #4e9b72;}
#main .scheme-branches {display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:16px;}
#main .scheme-branches input {margin:8px 0;}
#main .feedback-figure {display:block;max-width:100%;max-height:350px;object-fit:contain;margin:12px auto;}
#modal-body .source-figure {margin:20px 0;text-align:center;}
#modal-body .source-figure img {max-height:420px;object-fit:contain;}
#modal-body .source-figure figcaption {font-size:15px;margin-top:8px;}
@media(max-width:700px){#main .process-diagram,#main .evidence-body{grid-template-columns:1fr;}#main .process-diagram section{max-width:100%;}}
#main .chemical, #modal-body .chemical {white-space:nowrap;font-variant-numeric:lining-nums;}
#main .chemical sub, #main .chemical sup, #modal-body .chemical sub, #modal-body .chemical sup {font-size:.75em;line-height:0;position:relative;vertical-align:baseline;}
#main .chemical sub, #modal-body .chemical sub {bottom:-.28em;}
#main .chemical sup, #modal-body .chemical sup {top:-.5em;}
#main .context-examples {display:grid;gap:20px;margin:24px 0;}
#main .context-example {display:grid;grid-template-columns:160px minmax(0,1fr);align-items:center;gap:24px;padding:22px;background:#f1f7f5;}
#main .context-example:nth-child(even) {background:#faf8eb;}
#main .context-example img {width:100%;max-height:180px;object-fit:contain;}
#main .context-example p {margin:0;}
#main .model-source {margin:20px auto;max-width:700px;text-align:center;}
#main .model-source img {max-width:100%;max-height:280px;object-fit:contain;}
#main .model-result {margin:0;display:flex;flex-direction:column;align-items:center;justify-content:center;border:1px solid #9abeb8;}
#main .model-result figcaption {padding:8px;font-weight:600;align-self:stretch;}
#main .model-result img {width:auto;max-width:90%;height:220px;object-fit:contain;}
@media(max-width:600px){#main .context-example{grid-template-columns:1fr;}#main .context-example img{max-width:220px;margin:auto;}}
@media(max-width:700px){#main .draw-grid{grid-template-columns:1fr;}#main .source-images{grid-template-columns:1fr;}}
.drawing-editor{min-width:0;background:#fff;border:1px solid #bfd8d4;border-radius:12px;padding:10px}
.drawing-toolbar{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:8px}
.drawing-toolbar button,.drawing-toolbar select{font:inherit;font-size:.85rem;min-height:40px;padding:6px 10px;border:1px solid #87b9b1;border-radius:8px;background:#f0f7f5;color:#193f48;max-width:100%}
.drawing-toolbar button[aria-pressed=true]{background:#285f68;color:white}
.drawing-toolbar button:disabled{opacity:.45}
.drawing-help{font-size:.85rem;line-height:1.5;margin:8px 0}
.drawing-editor canvas{display:block;width:100%;height:auto;aspect-ratio:5/3}
.drawing-editor canvas:focus-visible{outline:3px solid #285f98;outline-offset:3px}
.drawing-expanded{position:fixed;inset:12px;z-index:1000;overflow:auto;box-shadow:0 0 0 100vmax #0008}
.drawing-expanded canvas{max-width:1000px;margin:auto}
#storage-error{position:sticky;top:0;z-index:1100;background:#fff3d5;color:#663b00;padding:12px;border:2px solid #b77820}