/* 『지구온난화의 원리』 · 1~11장 공통 (확장 플러그인)
   노트 규칙(book-reader.css · lesson-flow.css)을 따라요.
   - 종이: 점 모눈 크림 종이 위에 얹는 가벼운 블록. 굵은 색 띠·채운 배지 대신 점선 구분선과 얇은 테두리(모서리 3~7px)
   - 색: 분홍 탭(#f4dced/#be8fae/#624253), 손글씨 갈색 제목·번호(#8a5a3c/#a27852), 노란 형광펜(#f7e7a1),
         세이지 그린(#4c6840/#607650/#859c64), 크림(#fffdf5/#fbfaf0/#f4f4e7)
   - 정렬: 제목 들여쓰기(--heading-indent)에 맞춰요 */
:root{--nb-paper:#fffdf5;--nb-cream:#fbfaf0;--nb-cream-2:#f4f4e7;--nb-rule:#c6cbbd;--nb-line:#d3d4c4;--nb-lab-line:#c3cdb4;
 --nb-hand:#8a5a3c;--nb-num:#a27852;--nb-ink:#22302a;--nb-muted:#4d5b52;--nb-sage:#4c6840;--nb-sage-2:#607650;--nb-sage-3:#859c64;
 --nb-pink:#f4dced;--nb-pink-edge:#be8fae;--nb-pink-ink:#624253;--nb-marker:#f7e7a1}

/* ── 1. 과학 시뮬레이터(5~11장) · 기존 story-lab / thermal-lab 틀과 같은 모양 ─ */
.gh-lab{margin:24px 0 28px var(--heading-indent,0);border:1px solid var(--nb-lab-line);border-radius:7px;background:var(--nb-cream);box-shadow:0 4px 0 #e5e7d6;overflow:hidden;scroll-margin-top:110px}
.gh-lab-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 14px;background:#e9eee0;border-bottom:1px solid #d3dcc3}
.gh-lab-head span{display:block;font-size:11px;color:#899478;letter-spacing:.02em}
.gh-lab-head h3{margin:1px 0 0;font-size:14px;line-height:1.5;color:var(--nb-sage)}
.gh-expand{min-height:34px;padding:6px 10px;border:1px solid #becab0;border-radius:5px;background:var(--nb-paper);color:#526d45;font:500 12px var(--ad-font,inherit);white-space:nowrap;cursor:pointer}
.gh-expand[aria-expanded=true]{background:#dfe8cc;border-color:#839c68}
.gh-lab .lab-observation{margin:10px 14px;font-size:13px}
.gh-body{display:grid;grid-template-columns:minmax(0,1fr) 260px;border-top:1px solid #dce2d1;border-bottom:1px solid #dce2d1}
.gh-stage{display:flex;align-items:center;justify-content:center;min-width:0;background:#07101f;line-height:0}
.gh-stage canvas{display:block;width:100%;height:auto;max-height:440px;object-fit:contain}
.gh-side{display:flex;flex-direction:column;gap:2px;max-height:440px;overflow:auto;border-left:1px solid #dce2d1;background:var(--nb-paper)}
.gh-readouts{display:grid;grid-template-columns:1fr;gap:0;padding:8px 12px 2px}
.gh-readouts:empty{display:none}
.gh-readouts div{display:flex;align-items:baseline;justify-content:space-between;gap:8px;padding:7px 2px;border-bottom:1px dashed #dce2d1}
.gh-readouts span{font-size:12px;line-height:1.4;color:#7d896c}
.gh-readouts strong{font:600 15px/1.35 var(--ad-font,inherit);color:var(--nb-ink);font-variant-numeric:tabular-nums;text-align:right}
.gh-readouts .is-warm strong{color:#a5553a}.gh-readouts .is-cool strong{color:#3c6a8a}
.gh-controls{display:flex;flex-direction:column;gap:10px;padding:10px 12px 12px}
.gh-segment{display:flex;flex-wrap:wrap;align-items:center;gap:5px}
.gh-segment-label{flex-basis:100%;font-size:11px;color:#899478}
.gh-segment button,.gh-action{min-height:34px;padding:6px 9px;border:1px solid #becab0;border-radius:5px;background:var(--nb-paper);color:#526d45;font:500 12px/1.35 var(--ad-font,inherit);cursor:pointer}
.gh-segment button:hover,.gh-action:hover{background:#f1f4e8}
.gh-segment button[aria-pressed=true]{background:#dfe8cc;border-color:#839c68;color:#3f5a36;font-weight:650}
.gh-action.is-primary{background:var(--nb-pink);border-color:var(--nb-pink-edge);color:var(--nb-pink-ink);font-weight:650}
.gh-slider{display:grid;grid-template-columns:1fr auto;align-items:center;gap:0 8px;font-size:12px;color:#7d896c}
.gh-slider strong{font:600 13px var(--ad-font,inherit);color:var(--nb-ink);font-variant-numeric:tabular-nums}
.gh-slider input{grid-column:1/-1;width:100%;min-height:30px;accent-color:#819c5e;cursor:pointer}
.gh-model{padding:0 14px;color:#63765a}.gh-model summary{padding:8px 0;font-size:12.5px;cursor:pointer}
.gh-note{margin:0;padding:0 0 10px;font-size:13px;line-height:1.8;color:#63765a}
.gh-lab.is-expanded{position:fixed;inset:12px;z-index:1000;margin:0;overflow:auto;box-shadow:0 20px 60px #0007}
.gh-lab.is-expanded .gh-lab-head{position:sticky;top:0;z-index:2}
.gh-lab.is-expanded .gh-stage canvas,.gh-lab.is-expanded .gh-side{max-height:calc(100vh - 190px)}
body.gh-lab-open{overflow:hidden}
.gh-match{display:grid;grid-template-columns:1fr 1fr;gap:10px 18px;padding:12px 14px}
.gh-match-col{display:grid;gap:7px;align-content:start}.gh-match-col h4{margin:0 0 2px;font-size:12px;font-weight:600;color:#899478}
.gh-match button{min-height:42px;padding:8px 11px;text-align:left;border:1px solid #cccfc1;border-radius:4px;background:var(--nb-paper);font:500 13.5px/1.45 var(--ad-font,inherit);color:var(--nb-muted);cursor:pointer}
.gh-match button[aria-pressed=true]{border-color:var(--nb-pink-edge);background:var(--nb-pink);color:var(--nb-pink-ink)}
.gh-match button.is-done{border-color:#839c68;background:#dfe8cc;color:#3f5a36}
.gh-match button.is-wrong{animation:gh-shake .35s}
@keyframes gh-shake{25%{transform:translateX(-4px)}75%{transform:translateX(4px)}}

/* 크게 보기 → 원래 크기로 (모든 시뮬레이터 공통 떠 있는 단추) */
.tb-restore{position:fixed;left:50%;bottom:22px;z-index:100000;transform:translateX(-50%);display:inline-flex;align-items:center;gap:8px;min-height:46px;padding:8px 20px;border:1px solid var(--nb-pink-edge);border-radius:4px;background:var(--nb-pink);color:var(--nb-pink-ink);font:700 14px/1.4 var(--ad-font,inherit);box-shadow:0 6px 18px #31261d40;cursor:pointer}
.tb-restore:hover{background:#efd9e8}.tb-restore[hidden]{display:none}
/* 크게 본 동안에는 책 상단 도구막대가 시뮬레이터 머리(원래 크기 단추)를 가리지 않게 */
body:is(.gh-lab-open,.lab-expanded-open,.thermal-expanded-open,.orbit-expanded) .adbook-toolbar{visibility:hidden}

/* ── 1-1. 1~4장 시뮬레이터 높이 줄이기 ──────────────────────────────── */
details.compare-result{margin:0;padding:0 14px;border-top:1px dashed #cdd4ba;background:var(--nb-cream-2);border-radius:0;font-size:13.5px;color:#68795b}
details.compare-result>summary{padding:9px 0;font-size:12.5px;font-weight:600;color:#526d45;cursor:pointer}
details.compare-result[open]{padding-bottom:12px}
details.compare-result .compare-actions{margin:4px 0 10px}
.orbit-model-caption{font-size:12.5px!important;line-height:1.6!important;margin:6px 0!important}
details.tb-fold{margin:4px 14px 6px;font-size:12.5px;color:#63765a}details.tb-fold>summary{padding:6px 0;cursor:pointer}details.tb-fold>p{margin:0 0 8px!important}
.orbit-lab-heading{padding-top:8px!important;padding-bottom:8px!important}
.orbit-readouts{padding-top:4px!important;padding-bottom:4px!important}
.orbit-readouts>div{display:flex!important;flex-direction:row!important;align-items:baseline!important;justify-content:center;gap:8px!important;padding:6px 8px!important}
.orbit-readouts strong{font-size:17px}
.season-distance-strip{padding-top:2px!important;padding-bottom:2px!important}.season-distance-strip button{min-height:34px!important;padding:4px 10px!important}
.earth-landscape svg{max-height:340px!important;width:100%}
#exchange-lab .energy-ledger{padding:8px 12px}#exchange-lab .energy-ledger p{grid-column:1/-1;font-size:12px!important;margin:0}
#exchange-lab .energy-ledger div{flex-direction:row;align-items:baseline;justify-content:space-between;gap:6px}
#exchange-lab>.compare-actions{margin:6px 16px}#exchange-lab>.compare-actions button{min-height:36px;padding:5px 12px}
.energy-ledger{grid-template-columns:repeat(3,minmax(0,1fr));padding:10px 14px;gap:8px}.energy-ledger strong{font-size:19px}
.orbit-stage canvas,.landscape-lab-shell svg,.earth-wide-layout svg,.stellar-lab-layout svg,.heat-examples-layout svg,.em-wave-layout svg,.matter-zoom-layout svg,.warming-overview svg{max-height:400px}
.angle-lab{display:grid;grid-template-columns:minmax(0,1fr) 260px;grid-template-areas:"head head" "obs obs" "svg side" "note note"}
.angle-lab>header{grid-area:head}.angle-lab>.lab-observation{grid-area:obs}.angle-lab>svg{grid-area:svg;max-height:330px}
.angle-lab>.angle-readouts{grid-area:side;align-self:start;grid-template-columns:1fr;padding:12px}
.angle-lab>.angle-controls{grid-area:side;align-self:end;padding:0 12px 12px}
.angle-lab>.angle-note{grid-area:note;margin:8px 16px 0}
.angle-lab .angle-readouts strong{font-size:18px}.angle-lab .angle-controls label{flex-wrap:wrap}.angle-lab .compare-actions{gap:6px}.angle-lab .compare-actions button{min-height:34px;padding:6px 10px;font-size:12.5px}

.angle-lab,.balance-calc{border-color:var(--nb-lab-line)!important;background:var(--nb-cream)!important;box-shadow:0 4px 0 #e5e7d6!important;border-radius:7px!important}
.angle-lab>header,.balance-calc>header{background:#e9eee0;border-bottom:1px solid #d3dcc3;padding:10px 14px!important}
.angle-lab>header span,.balance-calc>header span{font-size:11px!important;color:#899478!important}
.angle-lab>header h4,.balance-calc>header h4{font-size:14px!important;color:var(--nb-sage)!important}
.angle-controls .compare-actions button,.balance-calc .compare-actions button{border-color:#becab0!important;border-radius:5px!important;background:var(--nb-paper)!important;color:#526d45!important;font-size:12.5px!important}
.angle-controls .compare-actions button[aria-pressed=true],.balance-calc .compare-actions button[aria-pressed=true]{background:#dfe8cc!important;border-color:#839c68!important;color:#3f5a36!important}
.balance-steps div{background:var(--nb-paper)!important;border:1px solid var(--nb-line);border-radius:3px!important}
.balance-steps .is-result{background:#eff1e3!important;border-color:#a7b78a}.balance-steps .is-result strong{color:#43603e!important}
.balance-steps b{color:var(--nb-num)!important}
.angle-readouts div{background:transparent!important;border-bottom:1px dashed #dce2d1;border-radius:0!important}

/* ── 2. 교재 요소 · 노트 규칙───────────────────────────────────────── */
.tb-kicker,.tb-goal h2,.tb-terms>p,.tb-summary>h2,.tb-think>h2{font:650 14px/1.6 var(--ad-font,inherit)!important;color:var(--nb-hand)!important;letter-spacing:0}
/* 이 장을 공부하면: 책 첫머리의 ‘이 장에서 발견할 것’과 같은 점선 블록 */
.tb-goal{margin:28px 0 28px var(--heading-indent,44px);padding:18px 0;border-block:1px dashed var(--nb-rule);background:transparent;color:var(--nb-ink)}
.tb-goal h2{margin:0 0 8px;padding:0}
.tb-goal ol{margin:0;padding-left:1.5em;font-size:15px;line-height:1.9;counter-reset:none}
.tb-goal li::marker{font:600 15px var(--ad-font,inherit);color:var(--nb-num)}
.tb-goal-try{margin:10px 0 0;font-size:14px;line-height:1.85;color:var(--nb-muted)}
.tb-goal-try b{margin-right:8px;font-weight:650;color:var(--nb-pink-ink);background:linear-gradient(transparent 62%,var(--nb-pink) 62% 92%,transparent 92%)}
/* 핵심 용어: 낱말 카드 */
.tb-terms{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:10px;margin:18px 0 26px var(--heading-indent,0)}
.tb-terms>p{grid-column:1/-1;margin:0}
.tb-term{position:relative;padding:12px 14px 10px;border:1px solid var(--nb-line);border-radius:3px;background:var(--nb-paper);font-size:13.5px;line-height:1.75;color:var(--nb-muted)}
.tb-term::before{content:'';position:absolute;top:-6px;left:14px;width:34px;height:11px;background:#e3edc9cc;transform:rotate(-3deg)}
.tb-term b{display:block;margin-bottom:2px;font-size:15px;font-weight:650;color:var(--nb-ink)}
.tb-term b small{margin-left:6px;font-size:11px;font-weight:500;color:#8c8f7f}
/* 상자들: 얇은 테두리 크림 종이 + 손글씨 갈색 꼬리표(색 띠·채운 배지 없음) */
.tb-box{position:relative;margin:24px 0 24px var(--heading-indent,0);padding:16px 20px 12px;border:1px solid var(--nb-line);border-radius:3px;background:var(--nb-paper);font-size:14.5px;line-height:1.9;color:var(--nb-muted)}
.tb-box>.tb-tag{position:absolute;top:-11px;left:16px;padding:0 8px;background:var(--tape,#f7e7a1);font:650 12px/1.8 var(--ad-font,inherit);color:var(--nb-hand);transform:rotate(-1.5deg)}
.tb-box>h4{margin:4px 0 6px;font-size:15.5px;line-height:1.6;color:var(--nb-ink)}
.tb-box p{margin:6px 0}.tb-box ul,.tb-box ol{margin:6px 0;padding-left:1.4em}.tb-box li::marker{color:var(--nb-num)}
.tb-plus{--tape:#f7e7a1}.tb-history{--tape:#f4dced}.tb-life{--tape:#dfeff0}.tb-caution{--tape:#f6dfcf}.tb-formula{--tape:#e3edc9}.tb-example{--tape:#e3edc9}
.tb-caution{background:linear-gradient(90deg,#fff8f0,var(--nb-paper) 40%)}
.tb-formula .tb-eq{display:block;margin:10px 0;padding:8px 10px;border-block:1px dashed var(--nb-rule);text-align:center;font:600 18px/1.7 'Times New Roman',var(--ad-font,serif);color:#3f5a36;overflow-x:auto}
.tb-formula dl{display:grid;grid-template-columns:auto 1fr;gap:0 12px;margin:6px 0 0;font-size:13.5px}.tb-formula dt{font-weight:650;color:var(--nb-sage)}.tb-formula dd{margin:0}
/* 탐구 정리: 실험 바로 아래의 연필 메모(기존 ‘오늘의 한 줄’과 같은 결) */
.tb-result{margin:-12px 0 26px var(--heading-indent,0);padding:12px 18px;border-left:3px solid #a7b78a;background:#eff1e3;font-size:14px;line-height:1.85;color:#43603e}
.tb-result>b:first-child{display:block;font-size:11px;font-weight:500;color:#7c8868}
/* 핵심 정리: 줄 노트 */
.tb-summary{margin:36px 0 18px var(--heading-indent,44px);padding:16px 0 4px;border-top:1px solid #bcc5b5}
.tb-summary>h2{margin:0 0 4px;padding:0}
.tb-summary ol{margin:0;padding:0 0 0 2.2em;font-size:15px;line-height:2.1;background:repeating-linear-gradient(transparent 0 calc(2.1em - 1px),#dbe5ea calc(2.1em - 1px) 2.1em)}
.tb-summary li{padding:0}.tb-summary li::marker{font:600 15px var(--ad-font,inherit);color:var(--nb-num)}
/* 생각해 볼 문제: 연필 메모 */
.tb-think{margin:20px 0 28px var(--heading-indent,44px)}
.tb-think>h2{display:inline;margin:0;background:linear-gradient(transparent 65%,var(--nb-marker) 65% 93%,transparent 93%)}
.tb-think ol{margin:10px 0 0;padding-left:1.5em;font-size:14.5px;line-height:1.9;color:var(--nb-ink)}.tb-think li{margin-bottom:6px}.tb-think li::marker{color:var(--nb-num);font-weight:600}
.tb-think details{margin:2px 0 6px;font-size:13.5px;color:var(--nb-muted)}.tb-think summary{cursor:pointer;color:var(--nb-pink-ink);font-size:13px}
.tb-think details[open]>p{margin:4px 0 0;padding:8px 12px;border:1px dashed var(--nb-rule);border-radius:3px;background:var(--nb-paper)}
.notebook-page em.tb-key{font-style:normal;font-weight:650;color:var(--nb-ink);background:linear-gradient(transparent 65%,var(--nb-marker) 65% 93%,transparent 93%)}
.gh-note .orbit-core{margin:20px 0 14px var(--heading-indent,0);padding:14px 18px;border-left:3px solid #a7b78a;background:#eff1e3;font-size:14.5px;line-height:1.85;color:#43603e}
.gh-note .orbit-core strong{display:block;margin-bottom:2px;font-size:11px;font-weight:500;color:#7c8868}.gh-note .orbit-core p{margin:0}

/* ── 3. 그림 · 카드 · 표 ─────────────────────────────────────────────── */
/* 그림 규칙(assets/illustrations/README.md): 낮고 넓은 약 2.6:1, 투명 배경, 그림 속 글자 없음 */
.art-slot{max-width:100%;margin:22px 0 26px var(--heading-indent,0)}
.art-slot-box{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;aspect-ratio:2.6/1;width:100%;padding:16px 24px;border:1px dashed var(--nb-rule);border-radius:3px;background:repeating-linear-gradient(45deg,#fffdf500 0 12px,#f1efe2 12px 13px);color:#8c8f7f;text-align:center}
.art-slot-tag{padding:0 8px;background:var(--nb-marker);font:650 12px/1.8 var(--ad-font,inherit);color:var(--nb-hand)}
.art-slot-box code{font-size:12px;color:#8c8f7f;word-break:break-all}
.art-slot-box p{max-width:620px;margin:0;font-size:12.5px;line-height:1.65;color:#9a9c8b}
.art-slot img{display:block;width:100%;height:auto}
.art-slot figcaption{margin-top:8px;font-size:13px;line-height:1.7;color:var(--nb-muted);text-align:center;word-break:keep-all}
.art-slot figcaption::before{content:'그림 ' attr(data-n) '  ';font-weight:650;color:var(--nb-hand)}
.art-pair{display:grid;grid-template-columns:1fr;gap:6px;margin-left:var(--heading-indent,0)}.art-pair .art-slot{margin:10px 0}
.gh-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px;margin:18px 0 26px var(--heading-indent,0)}
.gh-card{padding:12px 14px;border:1px solid var(--nb-line);border-top:3px solid var(--c,#a7b78a);border-radius:3px;background:var(--nb-paper);line-height:1.7}
.gh-card h4{margin:0 0 4px;font-size:15px;color:var(--nb-ink)}.gh-card h4 small{margin-left:6px;font-size:11.5px;font-weight:500;color:#8c8f7f}
.gh-card p{margin:3px 0;font-size:13px;color:var(--nb-muted)}.gh-card b{margin-right:4px;font-weight:600;color:var(--nb-hand)}
.gh-table{width:calc(100% - var(--heading-indent,0px));margin:16px 0 26px var(--heading-indent,0);border-collapse:collapse;font-size:14px;line-height:1.7;background:var(--nb-paper)}
.gh-table caption{caption-side:top;padding:0 0 6px;text-align:left;font:650 13px var(--ad-font,inherit);color:var(--nb-hand)}
.gh-table th,.gh-table td{padding:8px 10px;border-bottom:1px solid #dbe5ea;text-align:left;vertical-align:top}
.gh-table th{border-bottom:1px solid #bcc5b5;background:transparent;font-size:12.5px;font-weight:650;color:var(--nb-sage-2)}
.gh-chain{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:16px 0 24px var(--heading-indent,0)}
.gh-chain span{padding:6px 10px;border:1px solid var(--nb-line);border-radius:3px;background:var(--nb-paper);font-size:13.5px;line-height:1.5}.gh-chain b{margin-right:6px;color:var(--nb-num)}.gh-chain i{font-style:normal;color:#a3aa92}
/* 책 소개 페이지: 3부로 나눈 목차 */
.tb-parts{display:grid;gap:14px;margin:10px 0 24px 44px}
.tb-part{padding:4px 0 0;border-top:1px dashed var(--nb-rule)}
.tb-part h3{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 12px;margin:10px 0 2px;font:650 16px/1.6 var(--ad-font,inherit);color:var(--nb-hand)}
.tb-part h3 small{font-size:12.5px;font-weight:500;color:var(--nb-muted)}
.tb-part .adbook-chapters{margin:0}

/* ── 반응형 ─────────────────────────────────────────────────────────── */
@media(max-width:900px){.gh-body,.angle-lab{grid-template-columns:1fr}.angle-lab{grid-template-areas:"head" "obs" "svg" "side" "side2" "note"}.angle-lab>.angle-controls{grid-area:auto}.gh-side{border-left:0;border-top:1px solid #dce2d1;max-height:none}.gh-readouts{grid-template-columns:1fr 1fr;column-gap:14px}.gh-stage canvas{max-height:none}}
@media(max-width:767px){.tb-goal,.tb-summary,.tb-think,.tb-parts{margin-left:0}.tb-restore{bottom:14px;padding:8px 16px;font-size:13px}}
@media(max-width:700px){.gh-match{grid-template-columns:1fr}.gh-lab-head h3{font-size:13.5px}.gh-readouts{grid-template-columns:1fr}.tb-box{padding:16px 14px 10px}.tb-terms{grid-template-columns:1fr}.energy-ledger{grid-template-columns:1fr}.art-slot-box{aspect-ratio:auto;min-height:150px}}
@media(prefers-reduced-motion:reduce){.gh-match button.is-wrong{animation:none}}