/* Original plain JS/CSS implementation inspired by the UI patterns in
   Uiverse, Magic UI and React Bits. No third-party runtime or copied snippets. */
.learning-workbench{margin:28px 0 36px;color:#29483e}
.learning-workbench{scroll-margin-top:90px}.note-content .motion-lab h2{margin:10px 0;font-size:24px}.note-content .motion-lab p{margin:12px 0;font-size:13px}.note-content .motion-lab .learning-caption{font-size:10px}.note-content .motion-lab .motion-equation{font-size:15px}
.simulation-shortcuts{display:flex;flex-wrap:wrap;gap:10px 18px;margin:12px 0 25px;padding:15px;background:#edf0e3;border-radius:7px}.simulation-shortcuts button{font-size:11px;text-align:left;line-height:1.8}.concept-sim .sim-canvas{background:#fbfcf6;border:1px solid #ced7c3;border-radius:8px;overflow:hidden}.sim-canvas>svg{display:block;width:100%;height:auto}.sim-canvas text{fill:#536b5c;font-size:11px}.concept-sim .motion-time>label{display:flex;align-items:center;gap:10px;flex:1;flex-wrap:wrap;min-width:150px}.concept-sim .motion-time>label>input{width:100%;flex-basis:100%;min-height:28px}.sim-readings{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 10px;border-block:1px solid #c7d1ba;padding:18px 0}.sim-readings>div{min-width:0}.sim-readings span{display:block;font-size:10px;color:#5e7264;line-height:1.6}.sim-readings strong{display:block;font-size:16px;font-variant-numeric:tabular-nums;overflow-wrap:anywhere;color:#36594a;line-height:1.7}.sim-explanation{font-size:12px!important;line-height:1.9;min-height:45px;color:#3a658a}.sim-graph-pair{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:10px}.sim-graph-pair figure{margin:0;min-width:0}.sim-graph-pair figcaption{font-size:11px;font-weight:600;text-align:center}.sim-graph-pair svg{display:block;width:100%}.sim-graph-pair text{font-size:10px}.presentation-stage .concept-sim .motion-controls{line-height:1.6}.presentation-stage .concept-sim .learning-caption{font-size:10px}.concept-sim input:focus-visible{outline:2px solid #517db5;outline-offset:2px}
.note-content .sim-readings strong{background:none;padding:0}.sim-canvas>svg+svg{border-top:1px solid #ced7c3}
.simulation-reference{padding:16px 18px;border:1px solid #b9c6b2;border-radius:8px;background:#edf0e3}.simulation-reference a{color:#365f94;font-size:13px;line-height:1.8;text-decoration:underline;text-underline-offset:4px}
@media(max-width:650px){.sim-graph-pair{grid-template-columns:1fr}.sim-readings strong{font-size:14px}.simulation-shortcuts{gap:8px;padding:12px}.simulation-shortcuts button{font-size:10px}.sim-canvas text{font-size:12px}.concept-sim .motion-time>label{order:3;flex-basis:100%}}
.motion-lab{padding:28px;background:#f6f6ed;border:1px solid #b8c2af;border-radius:12px;box-shadow:4px 4px 0 #e2e5d4;overflow:hidden}
.learning-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}.learning-heading h2,.recall-section h2{font-size:24px;letter-spacing:-.8px;margin:10px 0}.learning-tag{border:1px solid #9eaf99;border-radius:20px;padding:7px 10px;font-size:10px;white-space:nowrap}
.learning-intro,.recall-section>p{font-size:13px;line-height:1.8;color:#586b60}.motion-controls{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin:24px 0}.motion-controls label{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;font-size:13px;font-weight:600}.motion-controls output{color:#365f94;font-variant-numeric:tabular-nums}.motion-controls input{width:100%;accent-color:#4b73ac;cursor:pointer;min-height:24px;margin:0}.motion-stage{background:#e8eddf;border:1px solid #c7d0bc;border-radius:8px;padding:20px 18px 10px}.motion-axis{display:flex;justify-content:space-between;font-size:10px;color:#53694f}.motion-track{position:relative;height:58px;border-bottom:2px solid #86977a;margin:0 0 8px}.motion-origin{position:absolute;left:50%;height:58px;border-left:1px dashed #8fa17f}.motion-cart{position:absolute;left:50%;bottom:3px;transform:translateX(-50%);width:34px;height:28px;text-align:center;background:#efd36b;border:1.5px solid #344f3c;border-radius:6px;box-shadow:2px 3px 0 #a6b38e;font-size:23px;line-height:22px}.motion-stage p{font-size:11px;margin:12px 0 0;min-height:20px}.motion-time{display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin:20px 0}.motion-time label{font-size:11px;min-width:86px}.motion-time output{font-variant-numeric:tabular-nums}.motion-time input{flex:1;min-width:90px;min-height:24px;accent-color:#4b73ac}.motion-time button{font-size:11px!important;min-height:36px}.motion-readings{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;border-block:1px solid #c9d1bd;padding:16px 0}.motion-readings>div{font-size:11px;color:#5d7162}.motion-readings strong{display:block;color:#29483e;font-size:19px;font-variant-numeric:tabular-nums;margin-top:6px}.motion-graphs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:22px}.motion-graphs figure{margin:0;min-width:0}.motion-graphs figcaption{font-size:11px;font-weight:700}.motion-graphs figcaption span{font-weight:400;color:#61725e}.motion-graphs svg{display:block;width:100%;margin-top:8px;background:#fcfcf7;border-radius:5px}.motion-graphs text{font-size:10px;fill:#586b60}.graph-axis{fill:none;stroke:#b7c3ae;stroke-width:1}.graph-time{stroke:#b0a471;stroke-dasharray:3 3}.motion-equation{font-size:15px;color:#365f94;font-weight:600}.learning-caption{font-size:10px;line-height:1.9;color:#596d5f;margin:12px 0 0}
.recall-section{margin-top:32px}.recall-cards{display:grid;gap:12px}.recall-card{border:1px solid #b9c6b2;border-radius:8px;background:#faf9f2;transition:box-shadow .18s,border-color .18s}.recall-card:hover{border-color:#6c8aa6;box-shadow:3px 3px 0 #e5e8d9}.recall-card summary{cursor:pointer;list-style:none;padding:18px 20px;display:grid;gap:9px}.recall-card summary::-webkit-details-marker{display:none}.recall-card summary>span{font-size:9px;color:#667f63;letter-spacing:1.2px}.recall-card strong{font-size:14px;font-weight:600;line-height:1.7}.recall-card small{font-size:10px;color:#456d99}.recall-card[open] small{font-size:0}.recall-card[open] small:after{content:'해설 접기 −';font-size:10px}.recall-card p{margin:0;padding:0 20px 20px;font-size:13px;line-height:1.9;color:#3f6351}.recall-card[open]{background:#eff2e5}.recall-card summary:focus-visible,.motion-lab button:focus-visible{outline:3px solid #527bb5;outline-offset:3px}
.goal-ring{position:relative;width:126px;margin:16px auto 12px;max-width:100%}.goal-ring svg{width:100%;display:block;transform:rotate(-90deg)}.goal-ring circle{fill:none;stroke-width:5}.ring-track{stroke:#e3e7d5}.ring-fill{stroke:#547cae;stroke-linecap:round;transition:stroke-dasharray .45s ease}.goal-ring>span{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:6px}.goal-ring strong{font-size:26px;color:#355c47;font-variant-numeric:tabular-nums}.goal-ring strong small{font-size:11px;margin-left:2px}.goal-ring em{font-size:8px;font-style:normal;color:#62745b}.task input[type=checkbox]{accent-color:#537b56;transition:transform .15s}.task input[type=checkbox]:checked{transform:scale(1.12)}.button{transition:transform .15s,box-shadow .15s}.button:active{transform:translateY(1px)}
.reading-progress{appearance:none;position:fixed;inset:0 0 auto;width:100%;height:4px;border:0;background:transparent;z-index:80;pointer-events:none}.reading-progress::-webkit-progress-bar{background:#e8e9dc}.reading-progress::-webkit-progress-value{background:#5079af}.reading-progress::-moz-progress-bar{background:#5079af}
.presentation-dialog{width:min(1100px,96vw);max-width:1100px;height:min(800px,94dvh);max-height:94dvh;padding:28px 36px;background:#faf9f0;color:#29483e;border:1px solid #647e68;border-radius:12px;overflow:hidden}.presentation-dialog[open]{display:flex;flex-direction:column}.presentation-top{display:flex;justify-content:space-between;align-items:center;gap:20px}.presentation-stage{flex:1;min-height:0;overflow-y:auto;padding:30px 5vw;overscroll-behavior:contain}.presentation-stage section{font-size:clamp(17px,2vw,24px);line-height:1.9;overflow-wrap:anywhere}.presentation-stage h2{font-size:clamp(28px,4vw,45px);line-height:1.4;color:#355d48;margin:18px 0 28px}.presentation-stage p,.presentation-stage li{margin-block:18px}.presentation-stage .math-block{font-size:24px}.presentation-controls{border-top:1px solid #c9d1bd;padding-top:18px;display:flex;justify-content:space-between;align-items:center;gap:12px}.slide-count{font-size:13px;font-variant-numeric:tabular-nums}.presentation-controls button:disabled{opacity:.4;cursor:default}.presentation-dialog>.learning-caption{text-align:center}.presentation-trigger{white-space:nowrap}
.goal-confetti{position:fixed;inset:0;pointer-events:none;overflow:hidden;z-index:100}.goal-confetti i{position:absolute;left:var(--x);top:-20px;width:8px;height:14px;animation:goal-fall 1.7s var(--delay) ease-in forwards}@keyframes goal-fall{from{transform:translateY(0) rotate(var(--turn));opacity:1}to{transform:translateY(100vh) rotate(650deg);opacity:0}}
@media(max-width:650px){.motion-lab{padding:18px 15px}.learning-heading{align-items:flex-start;flex-wrap:wrap}.learning-heading h2,.recall-section h2{font-size:20px}.motion-controls{gap:16px}.motion-graphs{grid-template-columns:1fr}.motion-graphs figure{display:grid;grid-template-columns:85px 1fr;align-items:center;gap:8px}.motion-graphs svg{max-height:135px}.motion-readings strong{font-size:15px}.motion-time{gap:8px}.motion-time input{order:3;flex-basis:100%}.motion-time #motion-reset{margin-left:auto}.recall-card summary{padding:16px}.recall-card strong{font-size:13px}.goal-ring{width:108px}.presentation-dialog{padding:20px 16px;width:96vw}.presentation-stage{padding:20px 5px}.presentation-stage .math-block{font-size:16px}.note-toolbar>div{flex-wrap:wrap}.learning-tag{font-size:9px}.motion-controls label{font-size:12px}}
@media(prefers-reduced-motion:reduce){.ring-fill,.button,.task input,.recall-card{transition:none}.goal-confetti{display:none}}