:root{--ink:#143b38;--teal:#197c73;--orange:#b95b1c;--muted:#5c7370}
.lesson-layer{position:absolute;box-sizing:border-box;font-family:jpk-kaiti,serif;color:var(--ink);z-index:4}
.lesson-layer *{box-sizing:border-box}
.lesson-layer p{margin:0}.lesson-layer button,.lesson-layer input,.lesson-layer textarea{font:inherit}
.lesson-layer button{cursor:pointer;border:1px solid #87aaa2;color:var(--ink);background:#fff;border-radius:9px;padding:10px 16px;font-size:25px;line-height:1.25;text-align:left}
.lesson-layer button:hover{background:#eaf4ef}.lesson-layer button:focus-visible,.lesson-layer input:focus-visible,.lesson-layer textarea:focus-visible{outline:3px solid #d88639;outline-offset:3px}
.lesson-layer button[aria-pressed=true]{background:#dcefe8;border-color:#197c73;border-width:2px}
.lesson-layer .primary{background:#197c73;color:white}.lesson-layer .primary:hover{background:#12655e}
.immersive-layer{inset:0;padding:34px 46px 60px;background:#f6f8f2}
.immersive-heading{font-family:jpk-heiti,sans-serif;font-size:39px;line-height:1.2;margin:0 0 23px;letter-spacing:1px}
.eyebrow{font-family:jpk-yahei,sans-serif;font-size:20px;line-height:1.3;color:var(--teal);margin-bottom:10px!important}
.explore-grid{display:grid;grid-template-columns:570px 560px;gap:32px}
.visual-panel{height:482px;display:flex;flex-direction:column;gap:8px}
.geometry{height:355px;width:560px;background:#fff;border-radius:10px}
.geometry svg{width:100%;height:100%;display:block;overflow:visible}
.givens{font-size:25px;line-height:1.38;min-height:110px;padding:6px 8px}
.question-panel{display:flex;flex-direction:column;gap:13px;min-height:475px}
.prompt{font-size:30px;line-height:1.35;min-height:80px}
.choices{display:grid;gap:9px}.choices button{min-height:52px}
.feedback{font-size:25px;line-height:1.35;padding:14px 16px;border-left:4px solid var(--teal);background:#e7f0e9;min-height:127px;white-space:pre-line}
.feedback[data-status=consider]{border-color:#bc783b;background:#fff2df}
.action-row{display:flex;gap:12px;align-items:center}.action-row button{font-size:23px;padding:8px 14px}
.area-layout{display:grid;grid-template-columns:700px 420px;gap:48px}
.area-geometry{height:420px;width:680px;background:white;border-radius:12px}.area-geometry svg{height:100%;width:100%}
.area-explain{display:flex;flex-direction:column;gap:18px;font-size:29px;line-height:1.3}
.area-explain .swatch-line{padding:12px 0;border-bottom:1px solid #cbded4}
.area-range{margin-top:10px;display:flex;align-items:center;gap:18px;font-size:23px}
.area-range input{width:480px;accent-color:#197c73}
.formula{font-family:jpk-yahei,sans-serif;font-size:30px;line-height:1.6;color:#197c73}
.exit-grid{display:grid;grid-template-columns:600px 525px;gap:48px}
.exit-left{display:flex;flex-direction:column;gap:15px}.exit-left label{font-size:28px;line-height:1.4}
.exit-left textarea{resize:none;width:600px;height:144px;border:1px solid #91b8a8;background:#fff;border-radius:8px;padding:14px;font-size:26px;line-height:1.4}
.rubric{font-size:26px;line-height:1.45;padding:20px;background:#e7f0e9;min-height:190px;white-space:pre-line}
.exit-note{font-size:22px;color:#5c7370}
.chain-panel{position:fixed;inset:0;z-index:100;background:#f5f7f0;overflow:auto;padding:28px min(5vw,70px);color:#163a30;font-family:jpk-yahei,sans-serif}
.chain-panel[hidden]{display:none}.chain-panel header{display:flex;justify-content:space-between;align-items:center;gap:18px}.chain-panel h2{margin:0;font-size:28px}.chain-panel header button{padding:10px 18px;border:1px solid #528377;border-radius:8px;background:white;color:#163a30;font-size:16px;cursor:pointer}
.chain-intro{font-size:17px;line-height:1.7;max-width:900px;margin:16px 0 24px}
.chain-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.chain-item{display:block;text-align:left;padding:16px 20px;border:1px solid #c1d3c6;border-left:5px solid #197c73;border-radius:9px;background:#fff;color:#143b38;cursor:pointer;font:inherit}
.chain-item strong{display:block;font-size:19px;line-height:1.5}.chain-item span{display:block;font-size:15px;color:#59716a;line-height:1.6;margin-top:5px}
.chain-timing{font-size:16px;margin-top:22px;line-height:1.7}
.jpk-player[data-pure=true] .lesson-layer,.jpk-player[data-pure=true] .lesson-layer *{cursor:auto}.jpk-player[data-pure=true] .lesson-layer button{cursor:pointer}
@media(max-width:680px){.chain-list{grid-template-columns:1fr}.chain-panel h2{font-size:22px}.chain-panel{padding:18px}}