/* 연 살아있는 수학교과서 — 공용 스타일 엔진 (단원 공통). 캐논(초3 곱셈)에서 추출. */
:root{--hanji:#F8F2EA;--hanji-dk:#EDE4D6;--hanji-lt:#FDF9F4;--ink:#1D1D1B;--ink-soft:#4A4540;
  --gold:#B8955A;--gold-pale:#F1E6D0;--sea:#3A6E7E;--sea-pale:#E1ECEF;--reed:#7A9E8A;--dawn:#C9402B;
  --radius:14px;--shadow:0 6px 26px rgba(29,29,27,.10);--myeong:'Nanum Myeongjo',serif;--serif:'Noto Sans KR',sans-serif;--play:'Playfair Display',serif;--rs:1;}
*{box-sizing:border-box;margin:0;padding:0;}
body{font-family:var(--serif);background:var(--hanji);color:var(--ink);line-height:1.85;font-size:calc(18px * var(--rs,1));-webkit-font-smoothing:antialiased;}
body.rs-2{--rs:1.14;}body.rs-3{--rs:1.28;}
body.font-myeong{--serif:'Nanum Myeongjo',serif;}
.wrap{max-width:860px;margin:0 auto;padding:0 18px;}
.bar{position:sticky;top:0;z-index:60;display:flex;gap:6px;align-items:center;justify-content:center;background:var(--ink);color:#fff;font-size:12.5px;padding:7px 12px;flex-wrap:wrap;font-family:var(--myeong);}
.bar a,.bar .cur,.bar .sep{color:#fff;text-decoration:none;}.bar a{opacity:.8;}.bar a:hover{opacity:1;}.bar .sep{opacity:.4;}.bar .cur{background:var(--gold);color:#1d1d1b;border-radius:999px;padding:2px 10px;font-weight:700;}
.hero{text-align:center;padding:34px 0 8px;}
.hero .grade{display:inline-block;background:var(--gold);color:#1d1d1b;font-family:var(--myeong);font-weight:700;font-size:12px;border-radius:999px;padding:3px 12px;}
.hero .eye{font-family:var(--play);font-style:italic;color:var(--gold);letter-spacing:.1em;font-size:13px;margin-top:8px;}
.hero h1{font-family:var(--myeong);font-weight:800;font-size:clamp(24px,5vw,38px);margin-top:4px;}
.goal{background:var(--hanji-lt);border:1px solid var(--hanji-dk);border-left:5px solid var(--reed);border-radius:12px;padding:13px 17px;font-size:calc(15.5px*var(--rs,1));color:var(--ink-soft);margin:16px 0;}
.goal b{color:var(--ink);}
.howto{background:#fff;border:1px solid var(--hanji-dk);border-radius:12px;padding:12px 16px;font-size:13.5px;color:var(--ink-soft);margin:12px 0 4px;line-height:1.7;}
.howto b{color:var(--ink);}
.howto .chip{display:inline-flex;align-items:center;gap:4px;border-radius:999px;padding:1px 9px;font-family:var(--myeong);font-weight:700;font-size:11.5px;margin:0 1px;}
.howto .chip.why{color:var(--sea);background:var(--sea-pale);}.howto .chip.alt{color:#5e8470;background:#eef4f0;}
.howto .chip.miss{color:var(--dawn);background:#fdeceA;}.howto .chip.more{color:#8a6d35;background:var(--gold-pale);}
h2{font-family:var(--myeong);font-size:21px;font-weight:800;margin:30px 0 12px;display:flex;align-items:center;gap:9px;}
h2 .ic{width:26px;height:26px;border-radius:7px;background:var(--gold-pale);display:inline-flex;align-items:center;justify-content:center;color:var(--gold);flex-shrink:0;}
h2 .ic svg{width:16px;height:16px;}
.story{background:var(--sea-pale);border-radius:12px;padding:17px 19px;font-size:calc(16.5px*var(--rs,1));margin:10px 0;}
.story b{color:var(--sea);}
.story .keep{display:block;margin-top:8px;font-family:var(--myeong);font-weight:700;color:var(--ink);font-size:calc(16.5px*var(--rs,1));}
figure{margin:14px 0;text-align:center;}
figure img{width:100%;max-width:520px;border-radius:12px;border:1px solid var(--hanji-dk);box-shadow:var(--shadow);}
figcaption{font-size:12px;color:var(--ink-soft);margin-top:6px;}
.memo{background:#fff;border:1px solid var(--hanji-dk);border-radius:12px;padding:14px 16px 10px;margin:14px 0;text-align:center;}
.memo .tag{display:inline-block;font-family:var(--myeong);font-weight:700;font-size:11.5px;color:#8a6d35;background:var(--gold-pale);border-radius:999px;padding:2px 11px;margin-bottom:8px;}
.memo svg{width:100%;height:auto;max-width:400px;}
.memo .hook{font-family:var(--myeong);font-size:14.5px;color:var(--ink);margin-top:8px;line-height:1.65;}
.memo .hook b{color:var(--dawn);}
.views{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:12px 0;}
@media(max-width:620px){.views{grid-template-columns:1fr;}}
.view{background:var(--hanji-lt);border:1px solid var(--hanji-dk);border-radius:12px;padding:14px 16px;}
.view h3{font-family:var(--myeong);font-size:15px;margin-bottom:6px;color:var(--ink);}
.view h3 .n{color:var(--gold);font-family:var(--play);font-style:italic;margin-right:5px;}
.view p{font-size:calc(14.5px*var(--rs,1));color:var(--ink-soft);}
.diagram{background:#fff;border:1px solid var(--hanji-dk);border-radius:12px;padding:16px;text-align:center;margin:8px 0;}
.kkb{background:linear-gradient(135deg,#2f5d62,#427a71);color:#fff;border-radius:14px;padding:16px 18px;margin:16px 0;}
.kkb .lbl{font-family:var(--myeong);font-weight:700;font-size:13px;background:rgba(255,255,255,.2);border-radius:999px;padding:2px 12px;display:inline-block;margin-bottom:8px;}
.kkb b{color:#ffe9c7;}
.kkb .eq{font-size:18px;font-family:var(--myeong);margin-top:6px;}
.ex{background:var(--hanji-lt);border:1px solid var(--hanji-dk);border-radius:12px;padding:14px 16px;margin:10px 0;}
.ex .q{font-family:var(--myeong);font-weight:700;font-size:calc(17.5px*var(--rs,1));}
.ex .s{font-size:calc(15px*var(--rs,1));color:var(--ink-soft);margin-top:6px;}
.ex .a{font-weight:700;color:var(--dawn);}
/* ── 확장 설명 단추 (참고서 깊이) ── */
.xpand{margin:12px 0;}
.xrow{display:flex;flex-wrap:wrap;gap:7px;}
.xt{display:inline-flex;align-items:center;gap:6px;font-family:var(--myeong);font-weight:700;font-size:12.5px;border:1px solid;background:#fff;border-radius:999px;padding:6px 13px 6px 11px;cursor:pointer;line-height:1;}
.xt svg{width:14px;height:14px;flex-shrink:0;}
.xt.why{color:var(--sea);border-color:#bcd3d9;}.xt.alt{color:#5e8470;border-color:#cfe0d5;}
.xt.miss{color:var(--dawn);border-color:#f0c9c3;}.xt.more{color:#8a6d35;border-color:#e7d6b0;}
.xt.on{color:#fff;}
.xt.why.on{background:var(--sea);border-color:var(--sea);}.xt.alt.on{background:var(--reed);border-color:var(--reed);}
.xt.miss.on{background:var(--dawn);border-color:var(--dawn);}.xt.more.on{background:var(--gold);border-color:var(--gold);color:#1d1d1b;}
.xc{display:none;margin-top:9px;border-radius:12px;padding:14px 17px;font-size:calc(14.5px*var(--rs,1));line-height:1.75;border:1px solid;border-left-width:5px;}
.xc.show{display:block;animation:xfade .28s ease;}
@keyframes xfade{from{opacity:0;transform:translateY(-4px);}to{opacity:1;transform:none;}}
.xc.why{background:var(--sea-pale);border-color:#cfe0e5;border-left-color:var(--sea);}
.xc.alt{background:#eef4f0;border-color:#d6e6db;border-left-color:var(--reed);}
.xc.miss{background:#fdece9;border-color:#f0c9c3;border-left-color:var(--dawn);}
.xc.more{background:var(--gold-pale);border-color:#e7d6b0;border-left-color:var(--gold);}
.xc h4{font-family:var(--myeong);font-size:14px;margin-bottom:5px;}
.xc.why h4{color:var(--sea);}.xc.alt h4{color:#5e8470;}.xc.miss h4{color:var(--dawn);}.xc.more h4{color:#8a6d35;}
.xc b{color:var(--ink);}.xc.why b{color:#2c5663;}.xc.miss b{color:var(--dawn);}
.xc ul{margin:4px 0 0 2px;padding-left:16px;}.xc li{margin:3px 0;}
.xc .eqn{font-family:var(--myeong);background:#fff;border:1px solid rgba(0,0,0,.06);border-radius:7px;padding:1px 7px;display:inline-block;}
/* ── 코드 애니메이션 플레이어 ── */
.player{background:var(--hanji-lt);border:1px solid var(--hanji-dk);border-radius:16px;box-shadow:var(--shadow);padding:16px;max-width:600px;margin:10px auto;}
.player .pstage{background:#fff;border:1px solid var(--hanji-dk);border-radius:12px;padding:6px;}
.player svg{width:100%;height:auto;display:block;}
.transi{transition:opacity .45s ease;}
.player .cap{min-height:46px;display:flex;align-items:center;justify-content:center;text-align:center;font-family:var(--myeong);font-size:15px;margin-top:10px;padding:9px 12px;background:#fff;border:1px solid var(--hanji-dk);border-radius:10px;}
.player .cap b{color:var(--dawn);}
.player .ctrl{display:flex;gap:8px;justify-content:center;margin-top:11px;flex-wrap:wrap;}
.player .ctrl button{font-family:var(--myeong);font-weight:700;font-size:13.5px;border:0;border-radius:999px;padding:9px 18px;cursor:pointer;}
.player .b-play{background:var(--ink);color:#fff;}.player .b-play:hover{background:var(--gold);color:#1d1d1b;}
.player .b-step{background:#fff;color:var(--ink);border:1px solid var(--hanji-dk) !important;}
.player .prog{display:flex;gap:5px;justify-content:center;margin-top:10px;}
.player .prog i{width:8px;height:8px;border-radius:50%;background:var(--hanji-dk);transition:background .3s;}
.player .prog i.on{background:var(--gold);}
.freecap{font-size:12px;color:var(--ink-soft);text-align:center;margin:4px auto 0;max-width:600px;line-height:1.6;}
.freecap b{color:var(--sea);}
/* 연습문제 */
.tabs{display:flex;gap:8px;margin:14px 0 10px;flex-wrap:wrap;}
.tabs button{font-family:var(--myeong);font-weight:700;font-size:14px;border:1px solid var(--hanji-dk);background:#fff;color:var(--ink-soft);border-radius:999px;padding:8px 18px;cursor:pointer;}
.tabs button.on{color:#fff;}
.tabs button[data-t="basic"].on{background:var(--reed);border-color:var(--reed);}
.tabs button[data-t="high"].on{background:var(--gold);border-color:var(--gold);color:#1d1d1b;}
.tabs button[data-t="top"].on{background:var(--dawn);border-color:var(--dawn);}
.tier-desc{font-size:13.5px;color:var(--ink-soft);margin-bottom:8px;}
.prob{background:var(--hanji-lt);border:1px solid var(--hanji-dk);border-radius:10px;padding:16px 18px;margin:14px 0;}
.prob .qline{display:flex;align-items:baseline;gap:8px;font-size:calc(17px*var(--rs,1));line-height:1.6;}
.prob .pn{font-family:var(--play);font-style:italic;color:var(--gold);font-size:14px;flex-shrink:0;}
.prob .pq{flex:1;}
.prob .sol{display:none;margin-top:12px;padding-top:10px;border-top:1px dashed var(--hanji-dk);font-size:13.5px;color:var(--ink-soft);}
.prob.show .sol{display:block;}
.prob .sol .ans{font-weight:700;color:var(--dawn);}
.prob .tg{display:inline-block;margin-top:14px;background:#DBC8A4;color:#1d1d1b;border:1px solid #cdb88f;border-radius:8px;padding:8px 16px;font-size:12.5px;font-weight:700;font-family:var(--myeong);cursor:pointer;}
.prob .tg:hover{background:var(--gold);color:#1d1d1b;border-color:var(--gold);}
.allbtn{margin:6px 0 2px;background:#fff;border:1px solid var(--hanji-dk);border-radius:8px;padding:7px 14px;font-size:12.5px;font-family:var(--myeong);cursor:pointer;color:var(--ink-soft);}
.tip{background:#fff5f4;border:1px solid #f0c9c3;border-left:4px solid var(--dawn);border-radius:10px;padding:13px 16px;font-size:13.5px;color:var(--ink-soft);margin:16px 0;line-height:1.7;}
.tip b{color:var(--dawn);}
/* ── 단원 마무리 · 자기 이해도 평가 + 눈 감고 떠올리기 ── */
.selfcheck{background:linear-gradient(135deg,#eef4f0,#f6efe2);border:1px solid var(--hanji-dk);border-radius:16px;padding:20px 18px;margin:22px 0;text-align:center;}
.selfcheck h3{font-family:var(--myeong);font-size:18px;color:var(--ink);margin-bottom:6px;}
.selfcheck p.lead{font-size:14.5px;color:var(--ink-soft);margin-bottom:14px;line-height:1.75;}
.selfcheck p.lead b{color:var(--reed);}
.sc-start{font-family:var(--myeong);font-weight:700;font-size:15px;background:var(--reed);color:#fff;border:0;border-radius:999px;padding:12px 24px;cursor:pointer;}
.sc-start:hover{background:#6a8e7a;}
.sc-form{display:none;margin-top:16px;text-align:left;background:#fff;border:1px solid var(--hanji-dk);border-radius:14px;padding:16px;}
.sc-form.show{display:block;}
.sc-q{font-family:var(--myeong);font-weight:700;font-size:15px;margin:12px 0 6px;}
.sc-q:first-child{margin-top:0;}
.sc-rate{display:flex;gap:8px;flex-wrap:wrap;}
.sc-rate button{flex:1;min-width:92px;font-family:var(--myeong);font-size:13.5px;border:1px solid var(--hanji-dk);background:var(--hanji-lt);color:var(--ink);border-radius:10px;padding:10px;cursor:pointer;}
.sc-rate button.on{background:var(--reed);color:#fff;border-color:var(--reed);}
.sc-tags button.on{background:var(--dawn);border-color:var(--dawn);}
.sc-memo{width:100%;box-sizing:border-box;border:1px solid var(--hanji-dk);border-radius:10px;padding:10px;font-family:var(--serif);font-size:13.5px;margin-top:4px;resize:vertical;min-height:54px;}
.sc-submit{margin-top:14px;width:100%;font-family:var(--myeong);font-weight:700;font-size:14.5px;background:var(--gold);color:#1d1d1b;border:0;border-radius:999px;padding:12px 24px;cursor:pointer;}
.sc-submit:hover{background:#a9854a;}
.sc-summary{display:none;margin-top:16px;text-align:left;background:#fff;border:1px solid var(--hanji-dk);border-left:5px solid var(--reed);border-radius:14px;padding:16px;}
.sc-summary.show{display:block;}
.sc-summary h4{font-family:var(--myeong);font-size:15px;margin-bottom:8px;}
.sc-summary .row{font-size:13.5px;color:var(--ink-soft);margin:4px 0;}
.sc-summary .row b{color:var(--ink);}
.sc-sent{font-size:12px;color:var(--reed);margin-top:10px;line-height:1.6;}
.recall{position:fixed;inset:0;z-index:120;background:rgba(29,29,27,.80);display:none;align-items:center;justify-content:center;padding:22px;}
.recall.show{display:flex;}
.recall .card{background:var(--hanji-lt);border-radius:20px;padding:30px 24px;max-width:380px;width:100%;text-align:center;box-shadow:0 18px 50px rgba(0,0,0,.42);}
.recall .eyeic{margin-bottom:4px;}
.recall .eyeic svg{width:46px;height:46px;}
.recall h4{font-family:var(--myeong);font-size:21px;color:var(--ink);margin:6px 0;}
.recall p{font-size:14px;color:var(--ink-soft);line-height:1.75;}
.recall p b{color:var(--reed);}
.recall .ring{width:96px;height:96px;margin:16px auto 6px;}
.recall .ring svg{width:96px;height:96px;}
.recall .prog{transition:stroke-dashoffset 7s linear;}
.recall .go{margin-top:12px;font-family:var(--myeong);font-weight:700;font-size:14px;background:var(--gold);color:#1d1d1b;border:0;border-radius:999px;padding:11px 22px;cursor:pointer;opacity:.4;pointer-events:none;transition:opacity .5s;}
.recall .go.ready{opacity:1;pointer-events:auto;}
/* ── 복습노트 · 생각의 지도 ── */
.mindmap{background:#fff;border:1px solid var(--hanji-dk);border-radius:16px;padding:18px;margin:22px 0;}
.mindmap h3{font-family:var(--myeong);font-size:18px;margin-bottom:4px;}
.mindmap h3 .ic{color:var(--gold);}
.mm-lead{font-size:13.5px;color:var(--ink-soft);margin-bottom:12px;}
.mm-stage{overflow-x:auto;-webkit-overflow-scrolling:touch;}
.mm-stage svg{width:100%;min-width:520px;height:auto;display:block;}
.mm-legend{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;font-size:12px;color:var(--ink-soft);margin:8px 0 10px;}
.mm-legend span{display:inline-flex;align-items:center;gap:5px;}
.mm-legend i{width:11px;height:11px;border-radius:50%;display:inline-block;border:1px solid rgba(0,0,0,.12);}
.mm-todo{font-size:14px;background:var(--hanji-lt);border:1px solid var(--hanji-dk);border-radius:12px;padding:12px 14px;margin:8px 0;text-align:center;line-height:1.6;}
.mm-todo b{color:var(--dawn);}
.mm-review{background:var(--hanji-lt);border:1px solid var(--hanji-dk);border-radius:12px;padding:13px 15px;margin-top:8px;}
.mm-q{font-family:var(--myeong);font-weight:700;font-size:14px;margin-bottom:9px;}
.mm-method{font-weight:400;font-size:12px;color:var(--ink-soft);cursor:help;border-bottom:1px dotted var(--ink-soft);}
.mm-rounds{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:11px;}
.mm-rounds label{font-size:13px;border:1px solid var(--hanji-dk);border-radius:999px;padding:7px 13px;cursor:pointer;background:#fff;display:inline-flex;align-items:center;gap:6px;}
.mm-start{font-family:var(--myeong);font-weight:700;font-size:14px;background:var(--reed);color:#fff;border:0;border-radius:999px;padding:10px 20px;cursor:pointer;}
.mm-start:hover{background:#6a8e7a;}
footer{margin-top:28px;background:var(--hanji-dk);padding:18px;text-align:center;font-size:12px;color:var(--ink-soft);line-height:1.8;border-radius:14px 14px 0 0;}
footer a{color:var(--ink);}footer b{color:var(--ink);}
.print-fab{position:fixed;right:18px;bottom:18px;z-index:80;width:54px;height:54px;border-radius:50%;background:var(--ink);color:#fff;border:0;cursor:pointer;box-shadow:0 6px 20px rgba(0,0,0,.28);font-size:22px;}
.print-fab:hover{background:var(--gold);color:#1d1d1b;}
.print-pop{position:fixed;right:18px;bottom:82px;z-index:81;background:#fff;border:1px solid var(--hanji-dk);border-radius:14px;box-shadow:0 10px 34px rgba(0,0,0,.22);padding:10px;width:250px;display:none;font-family:var(--myeong);}
.print-pop.show{display:block;}
.print-pop b{display:block;font-size:13px;padding:4px 6px 8px;}
.print-pop button{display:flex;flex-direction:column;align-items:flex-start;width:100%;text-align:left;background:var(--hanji-lt);border:1px solid var(--hanji-dk);border-radius:10px;padding:10px 12px;margin-top:6px;cursor:pointer;font-family:inherit;}
.print-pop button strong{font-size:13.5px;}.print-pop button small{font-size:11px;color:var(--ink-soft);margin-top:2px;}
.read-fab{position:fixed;left:18px;bottom:18px;z-index:80;width:50px;height:50px;border-radius:50%;background:#fff;color:var(--ink);border:1px solid var(--hanji-dk);cursor:pointer;box-shadow:0 6px 20px rgba(0,0,0,.2);font-family:var(--myeong);font-weight:800;font-size:19px;}
.read-fab:hover{background:var(--gold-pale);}
.read-pop{position:fixed;left:18px;bottom:78px;z-index:81;background:#fff;border:1px solid var(--hanji-dk);border-radius:14px;box-shadow:0 10px 34px rgba(0,0,0,.22);padding:12px;width:236px;display:none;}
.read-pop.show{display:block;}
.read-pop b{display:block;font-size:13px;font-family:var(--myeong);padding:2px 2px 6px;}
.read-pop .lbl{font-size:11.5px;color:var(--ink-soft);margin:7px 0 4px;}
.read-pop .grp{display:flex;gap:6px;}
.read-pop .grp button{flex:1;font-family:var(--myeong);font-size:13px;border:1px solid var(--hanji-dk);background:var(--hanji-lt);color:var(--ink);border-radius:9px;padding:8px 4px;cursor:pointer;}
.read-pop .grp button.on{background:var(--reed);color:#fff;border-color:var(--reed);}
/* ── 공유·설치 ── */
.barshare{position:absolute;right:10px;top:50%;transform:translateY(-50%);background:rgba(255,255,255,.18);color:#fff;border:0;border-radius:999px;padding:4px 11px;font-size:11.5px;font-family:var(--myeong);cursor:pointer;}
.barshare:hover{background:rgba(255,255,255,.3);}
.keep-card{position:fixed;left:0;right:0;bottom:0;z-index:100;background:#fff;border-top:3px solid var(--gold);box-shadow:0 -8px 30px rgba(0,0,0,.16);padding:13px 16px;display:none;}
.keep-card.show{display:block;animation:kcUp .4s ease;}
@keyframes kcUp{from{transform:translateY(100%);}to{transform:none;}}
.keep-card .kc-in{max-width:680px;margin:0 auto;display:flex;align-items:center;gap:12px;flex-wrap:wrap;}
.keep-card .kc-txt{flex:1;min-width:170px;font-size:13.5px;color:var(--ink-soft);line-height:1.5;}
.keep-card .kc-txt b{color:var(--ink);font-family:var(--myeong);}
.keep-card .kc-btn{display:flex;gap:7px;flex-wrap:wrap;align-items:center;}
.keep-card button{font-family:var(--myeong);font-weight:700;font-size:13px;border-radius:999px;padding:9px 15px;cursor:pointer;border:1px solid var(--hanji-dk);background:var(--hanji-lt);color:var(--ink);}
.keep-card .kc-go{background:var(--gold);border-color:var(--gold);color:#1d1d1b;}
.keep-card .kc-share{background:var(--sea);border-color:var(--sea);color:#fff;}
.keep-card .kc-x{background:transparent;border:0;color:var(--ink-soft);font-size:12px;padding:9px 8px;}
.share-modal{position:fixed;inset:0;z-index:130;background:rgba(29,29,27,.72);display:none;align-items:center;justify-content:center;padding:22px;}
.share-modal.show{display:flex;}
.share-modal .card{background:var(--hanji-lt);border-radius:20px;padding:24px 22px;max-width:340px;width:100%;text-align:center;box-shadow:0 18px 50px rgba(0,0,0,.4);}
.share-modal h4{font-family:var(--myeong);font-size:19px;margin-bottom:4px;}
.share-modal .sm-sub{font-size:13px;color:var(--ink-soft);margin-bottom:12px;}
.share-modal .qr{width:188px;height:188px;margin:0 auto 12px;border:1px solid var(--hanji-dk);border-radius:12px;background:#fff;padding:8px;box-sizing:border-box;}
.share-modal .qr img{width:100%;height:100%;display:block;}
.share-modal .lnk{font-size:12px;color:var(--ink-soft);word-break:break-all;background:#fff;border:1px solid var(--hanji-dk);border-radius:8px;padding:8px;margin-bottom:10px;}
.share-modal .row{display:flex;gap:8px;margin-top:4px;}
.share-modal .row button{flex:1;font-family:var(--myeong);font-weight:700;font-size:13.5px;border-radius:10px;padding:11px;cursor:pointer;border:0;}
.share-modal .b-copy{background:var(--ink);color:#fff;}
.share-modal .b-install{background:var(--gold);color:#1d1d1b;}
.share-modal .b-close{background:#fff;color:var(--ink);border:1px solid var(--hanji-dk) !important;}
.share-modal .note{font-size:11.5px;color:var(--ink-soft);margin-top:10px;line-height:1.55;}
@media print{
  .bar,.print-fab,.print-pop,.read-fab,.read-pop,.no-print,.prob .tg,.allbtn,.player .ctrl,.player .prog{display:none !important;}
  body:not(.print-save){-webkit-print-color-adjust:exact;print-color-adjust:exact;}
  .xt{display:none !important;}                       /* 확장 단추 숨김 */
  .xc{display:block !important;}                       /* 확장 설명: 모두 펼침 */
  .prob .sol{display:block !important;}                /* 정답지: 풀이 펼침 */
  #r_hund,#r_tens,#r_ones,#carry2{opacity:1 !important;} /* 애니메이션: 결과 보이게 */
  .tier-pane{display:block !important;}                /* 모든 난이도 인쇄 */
  .tier-pane::before{content:attr(data-label);font-family:var(--myeong);font-weight:800;display:block;margin:10px 0 4px;}
  body.print-save{filter:grayscale(1);font-size:10.5px;}
  body.print-save *{background:transparent !important;box-shadow:none !important;color:#111 !important;}
  .recall{display:none !important;}                   /* 떠올리기 오버레이 인쇄 제외 */
  .sc-form,.sc-summary{display:block !important;}      /* 자기평가: 인쇄 시 펼쳐 보이기 */
  section,.ex,.prob,.diagram,figure,.memo,.player,.xc,.selfcheck,.sc-summary,.view{break-inside:avoid;}
  body.print-save main.wrap{column-count:2;column-gap:8mm;}   /* 종이 절약: 2단 */
  body.print-save .player,body.print-save .kkb{display:none;} /* 절약 모드: 음성플레이어·강조박스 생략 */
  @page{margin:10mm;}
}
/* ── 추가 학습장치 7종 (왜배울까·출발점검·직접해보기·내말로설명·한장핵심·용어사전·틀려도괜찮아/어른한줄) ── */
.why-learn{background:linear-gradient(135deg,#fbf3e3,#f7efe1);border:1px solid var(--hanji-dk);border-left:5px solid var(--gold);border-radius:12px;padding:15px 18px;margin:14px 0;}
.why-learn h3{font-family:var(--myeong);font-size:16.5px;color:var(--ink);margin-bottom:6px;display:flex;align-items:center;gap:8px;}
.why-learn h3 .ic{width:24px;height:24px;border-radius:7px;background:var(--gold-pale);color:var(--gold);display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;}
.why-learn h3 .ic svg{width:15px;height:15px;}
.why-learn p{font-size:calc(15px*var(--rs,1));color:var(--ink-soft);line-height:1.78;}
.why-learn b{color:#8a6d35;}
.why-learn .wl-fig{margin:13px 0 2px;text-align:center;}
.why-learn .wl-fig img{width:100%;max-width:580px;border-radius:12px;border:1px solid var(--hanji-dk);box-shadow:var(--shadow);}
.why-learn .wl-fig figcaption{font-size:11.5px;color:var(--ink-soft);margin-top:6px;line-height:1.5;}
.startcheck{background:#fff;border:1px solid var(--hanji-dk);border-left:5px solid var(--sea);border-radius:12px;padding:15px 18px;margin:16px 0;}
.startcheck h3{font-family:var(--myeong);font-size:16px;color:var(--sea);margin-bottom:4px;display:flex;align-items:center;gap:7px;}
.startcheck h3 svg{width:17px;height:17px;}
.startcheck .lead{font-size:13.5px;color:var(--ink-soft);margin-bottom:10px;}
.startcheck .sq{font-size:calc(15px*var(--rs,1));margin:5px 0;}
.startcheck .toggle{margin-top:8px;background:#DBC8A4;color:#1d1d1b;border:1px solid #cdb88f;border-radius:8px;padding:7px 14px;font-size:12.5px;font-weight:700;font-family:var(--myeong);cursor:pointer;}
.startcheck .ans{display:none;margin-top:8px;font-size:13.5px;color:var(--ink-soft);background:var(--hanji-lt);border-radius:8px;padding:9px 12px;line-height:1.6;}
.startcheck.show .ans{display:block;}
.startcheck .back{font-family:var(--myeong);font-weight:700;color:var(--sea);}
.interactive{background:linear-gradient(135deg,#eef4f0,#f6efe2);border:1px solid var(--hanji-dk);border-radius:14px;padding:16px 18px;margin:16px 0;text-align:center;}
.interactive h3{font-family:var(--myeong);font-size:16.5px;margin-bottom:10px;display:flex;align-items:center;justify-content:center;gap:7px;}
.interactive h3 svg{width:17px;height:17px;color:var(--reed);}
.interactive .ctrls{display:flex;gap:16px;justify-content:center;flex-wrap:wrap;margin-bottom:10px;}
.interactive .stp{display:inline-flex;align-items:center;gap:6px;font-family:var(--myeong);font-size:14px;}
.interactive .stp button{width:30px;height:30px;border-radius:50%;border:1px solid var(--hanji-dk);background:#fff;font-size:18px;cursor:pointer;line-height:1;color:var(--ink);}
.interactive .stp .val{min-width:22px;font-weight:700;font-size:18px;color:var(--sea);}
.interactive .canvas{background:#fff;border:1px solid var(--hanji-dk);border-radius:12px;padding:10px;min-height:60px;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;}
.interactive .grp{display:inline-flex;flex-wrap:wrap;gap:4px;justify-content:center;align-content:center;border:1.5px dashed var(--reed);border-radius:10px;padding:6px;margin:4px;max-width:120px;}
.interactive .dot{width:13px;height:13px;border-radius:50%;background:var(--gold);}
.interactive .eq{margin-top:10px;font-family:var(--myeong);font-size:19px;font-weight:700;}
.interactive .eq b{color:var(--dawn);}
.feynman{background:var(--sea-pale);border:1px solid #cfe0e5;border-radius:12px;padding:15px 18px;margin:16px 0;}
.feynman h3{font-family:var(--myeong);font-size:16px;color:var(--sea);margin-bottom:4px;display:flex;align-items:center;gap:7px;}
.feynman h3 svg{width:17px;height:17px;}
.feynman p.lead{font-size:13.5px;color:var(--ink-soft);margin-bottom:8px;}
.feynman textarea{width:100%;box-sizing:border-box;border:1px solid var(--hanji-dk);border-radius:10px;padding:10px;font-family:var(--serif);font-size:14px;min-height:56px;resize:vertical;}
.feynman .row{display:flex;gap:8px;margin-top:8px;flex-wrap:wrap;}
.feynman button{font-family:var(--myeong);font-weight:700;font-size:13px;border-radius:999px;padding:8px 16px;cursor:pointer;border:1px solid var(--hanji-dk);background:#fff;}
.feynman .save{background:var(--sea);color:#fff;border-color:var(--sea);}
.feynman .model{display:none;margin-top:8px;font-size:13.5px;color:var(--ink-soft);background:#fff;border-radius:8px;padding:9px 12px;line-height:1.6;}
.feynman .model.show{display:block;}
.summary-card{background:#fff;border:2px solid var(--gold);border-radius:14px;padding:16px 18px;margin:16px 0;}
.summary-card h3{font-family:var(--myeong);font-size:17px;color:#8a6d35;margin-bottom:6px;display:flex;align-items:center;gap:7px;}
.summary-card h3 svg{width:17px;height:17px;}
.summary-card ul{list-style:none;}
.summary-card li{font-size:calc(14.5px*var(--rs,1));padding:7px 0;border-bottom:1px dotted var(--hanji-dk);display:flex;gap:9px;line-height:1.55;}
.summary-card li:last-child{border-bottom:0;}
.summary-card li .n{color:var(--gold);font-family:var(--play);font-style:italic;flex-shrink:0;}
.summary-card li b{color:var(--ink);}
.glossary{background:var(--hanji-lt);border:1px solid var(--hanji-dk);border-radius:12px;padding:14px 18px;margin:16px 0;}
.glossary h3{font-family:var(--myeong);font-size:16px;margin-bottom:8px;display:flex;align-items:center;gap:7px;}
.glossary h3 svg{width:17px;height:17px;color:var(--gold);}
.glossary dl{display:grid;grid-template-columns:auto 1fr;gap:7px 14px;font-size:13.8px;}
.glossary dt{font-family:var(--myeong);font-weight:700;color:var(--sea);}
.glossary dd{color:var(--ink-soft);}
.okfail{background:#fff5f4;border:1px solid #f0c9c3;border-left:5px solid var(--dawn);border-radius:12px;padding:13px 16px;margin:16px 0;font-size:14px;color:var(--ink-soft);line-height:1.7;}
.okfail b{color:var(--dawn);}
.adultnote{background:var(--hanji-dk);border-radius:12px;padding:12px 16px;margin:16px 0;font-size:13px;color:var(--ink-soft);line-height:1.65;}
.adultnote b{color:var(--ink);font-family:var(--myeong);}
@media print{
  .startcheck .ans,.feynman .model{display:block !important;}
  .startcheck .toggle,.interactive .ctrls,.feynman .row{display:none !important;}
  .why-learn,.startcheck,.interactive,.feynman,.summary-card,.glossary,.okfail,.adultnote{break-inside:avoid;}
  body.print-save .interactive{display:none;}
}
/* ── 용어 호버/탭 설명 (자동 점선 + 팝업) ── */
.term{border-bottom:1px dotted var(--sea);cursor:help;}
.term:hover{color:var(--sea);}
.term:focus{outline:2px solid var(--sea-pale);outline-offset:2px;border-radius:3px;}
#termPop{position:fixed;z-index:140;max-width:290px;background:#fff;border:1px solid var(--hanji-dk);border-left:4px solid var(--sea);border-radius:10px;box-shadow:0 12px 34px rgba(0,0,0,.20);padding:11px 14px;font-family:var(--serif);font-size:13px;line-height:1.62;color:var(--ink-soft);display:none;}
#termPop.show{display:block;animation:xfade .18s ease;}
#termPop b{color:var(--sea);font-family:var(--myeong);display:block;margin-bottom:3px;font-size:14px;}
#termPop .hint{display:block;margin-top:6px;font-size:11px;color:var(--reed);}
/* 용어 클릭 → 우측 슬라이드 상세 패널 */
#termOverlay{position:fixed;inset:0;background:rgba(29,29,27,.32);opacity:0;pointer-events:none;transition:opacity .3s;z-index:150;}
#termOverlay.show{opacity:1;pointer-events:auto;}
#termPanel{position:fixed;top:0;right:0;height:100%;width:min(360px,86vw);background:var(--hanji-lt);border-left:1px solid var(--hanji-dk);box-shadow:-12px 0 44px rgba(0,0,0,.22);transform:translateX(100%);transition:transform .32s ease;z-index:151;padding:26px 22px;overflow-y:auto;}
#termPanel.show{transform:none;}
#termPanel .tp-label{font-family:var(--play,serif);font-style:italic;color:var(--gold);font-size:13px;}
#termPanel h4{font-family:var(--myeong);font-size:23px;margin:4px 0 12px;color:var(--ink);border-bottom:2px solid var(--gold);padding-bottom:10px;}
#termPanel .tp-body{font-family:var(--serif);font-size:15px;line-height:1.85;color:var(--ink-soft);}
#termPanel .tp-close{position:absolute;top:14px;right:14px;width:34px;height:34px;border-radius:50%;border:1px solid var(--hanji-dk);background:#fff;font-size:15px;cursor:pointer;color:var(--ink-soft);}
#termPanel .tp-close:hover{background:var(--gold-pale,#F1E6D0);}
@media print{ .term{border-bottom:0;} #termPop,#termPanel,#termOverlay{display:none !important;} }
/* ── 손글씨 풀이 패드(유료) + 프리미엄 한도 토스트 ── */
.hw-pad-btn{display:inline-flex;align-items:center;gap:5px;font-family:var(--myeong);font-weight:700;font-size:13px;border:1px solid var(--reed);background:#fff;color:#5e8470;border-radius:999px;padding:7px 13px;cursor:pointer;margin:8px 8px 0 0;}
.hw-pad-btn svg{width:14px;height:14px;}
.hw-pad-btn:hover{background:var(--reed);color:#fff;}
.hw-thumb{margin-top:10px;}
.hw-thumb img{max-width:240px;width:100%;border:1px solid var(--hanji-dk);border-radius:8px;display:block;}
.hw-thumb .cap{font-size:11.5px;color:var(--ink-soft);margin-top:3px;}
#hwOverlay{position:fixed;inset:0;z-index:200;background:#fff;display:none;flex-direction:column;}
#hwOverlay.show{display:flex;}
#hwOverlay .hw-bar{display:flex;align-items:center;gap:8px;padding:10px 14px;background:var(--hanji-lt);border-bottom:1px solid var(--hanji-dk);flex-wrap:wrap;}
#hwOverlay .hw-q{font-family:var(--myeong);font-weight:700;font-size:15px;flex:1;min-width:110px;}
#hwOverlay .hw-tools{display:flex;gap:6px;align-items:center;flex-wrap:wrap;}
#hwOverlay .hw-tools button{font-family:var(--myeong);font-size:13px;border:1px solid var(--hanji-dk);background:#fff;color:var(--ink);border-radius:8px;padding:7px 12px;cursor:pointer;}
#hwOverlay .hw-tools button.on{background:var(--sea);color:#fff;border-color:var(--sea);}
#hwOverlay .hw-pr{font-size:12.5px;color:var(--ink-soft);display:inline-flex;gap:4px;align-items:center;cursor:pointer;}
#hwOverlay .hw-done{font-family:var(--myeong);font-weight:700;font-size:14px;background:var(--reed);color:#fff;border:0;border-radius:999px;padding:9px 22px;cursor:pointer;}
#hwCanvas{flex:1;min-height:0;touch-action:none;background:#fff;display:block;width:100%;}
.premium-toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%,20px);background:var(--ink);color:#fff;font-family:var(--serif);font-size:13.5px;line-height:1.5;border-radius:12px;padding:12px 18px;max-width:88vw;text-align:center;z-index:210;opacity:0;transition:opacity .35s,transform .35s;box-shadow:0 10px 30px rgba(0,0,0,.3);}
.premium-toast.show{opacity:1;transform:translate(-50%,0);}
