/* 상상의 날개 · 뒷이야기 공방 — 화면 nx-, 인쇄 pr-nx- */
.nx-hd{margin-bottom:2px}
.nx-lede{color:var(--muted)} .nx-lede b{color:var(--ink)}
.nx-art{width:100%;height:auto}
.nx .art{margin:12px 0}
.nx .nx-hero{max-width:820px;margin-inline:auto}
.nx-goal{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:16px 0;padding:14px 18px;border:2px solid var(--seal);border-radius:14px;background:var(--seal-soft);font-size:1.08em}
.nx-n{flex:none;display:inline-grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--ink);color:var(--paper);font-family:var(--mono);font-size:.85em;font-weight:600}
.nx-noc{border-color:var(--seal) !important;background:var(--seal-soft) !important;color:var(--seal) !important;animation:shake .38s}

/* 1쪽 소원 조약돌 */
.nx-stage{position:relative}
.nx-pebblebtn{position:absolute;left:51.5%;top:76%;transform:translate(-50%,0);border:0;border-radius:999px;padding:9px 18px;font-family:var(--cute);font-size:1.05em;color:#fff;
  background:linear-gradient(180deg,#F0574A,#B5261F);box-shadow:0 8px 22px -6px rgba(181,38,31,.7),inset 0 1px 0 rgba(255,255,255,.4);cursor:pointer;animation:nxbob 1.8s ease-in-out infinite}
@keyframes nxbob{50%{transform:translate(-50%,-5px)}}
@media (max-width:520px){ .nx-pebblebtn{top:auto;bottom:8px;padding:6px 13px;font-size:.9em} }
.nx-wishcard{display:flex;align-items:center;gap:14px;margin:14px 0;padding:14px 18px;border-radius:16px;background:linear-gradient(135deg,#FFF6EE,#FDE3DC);border:1px solid #F1C2B6;box-shadow:var(--shadow);color:#2B2523}
.nx-wishcard svg{width:58px;height:58px;flex:none;overflow:visible}
.nx-wishtx{font-family:var(--hand,"Nanum Pen Script");font-size:1.9em;line-height:1.2;margin:0}
.nx-bigpeb svg{width:170px;margin:0 auto}
.nx-dlg{width:min(640px,calc(100vw - 20px));max-height:calc(100vh - 30px);padding:0;border:0;border-radius:22px;background:var(--surface);color:var(--ink);box-shadow:0 30px 80px rgba(0,0,0,.35)}
.nx-dlg[open]{animation:nxpop .35s cubic-bezier(.2,1.4,.4,1)}
@keyframes nxpop{from{transform:scale(.85);opacity:0}}
.nx-dlg::backdrop{background:rgba(24,22,20,.6);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}
.nx-dlgin{padding:22px 22px 18px}
.nx-dh{font-family:var(--serif);text-align:center;margin:6px 0 10px}
.nx-ex{background:var(--sunken);border-radius:14px;padding:12px 16px;margin:10px 0}
.nx-ex h4{margin:0 0 6px;display:flex;gap:8px;align-items:center;font-family:var(--serif)}
.nx-ex p{margin:0;line-height:1.8;font-size:1.02em}

/* 읽기 시계 */
.nx .nx-readfig{max-width:560px;margin-inline:auto}
.nx-todo{display:flex;flex-wrap:wrap;gap:8px 14px;align-items:center;padding:12px 16px;border-radius:12px;background:var(--sky-soft);margin:10px 0}
.nx-todo b{color:var(--sky)}
.nx-timer{display:flex;align-items:center;gap:22px;flex-wrap:wrap;padding:16px 20px;border-radius:18px;background:var(--surface);border:1px solid var(--rule);box-shadow:var(--shadow);margin:14px 0}
.nx-ring{--t:1;width:132px;height:132px;border-radius:50%;display:grid;place-items:center;flex:none;
  background:radial-gradient(closest-side,var(--surface) 78%,transparent 80%),conic-gradient(var(--seal) calc(var(--t) * 360deg),var(--sunken) 0)}
.nx-ring span{font-family:var(--mono);font-size:2em;font-weight:600}
.nx-timer.over .nx-ring span{color:var(--leaf)}
.nx-timer.run .nx-ring{animation:nxbeat 1s ease-in-out infinite}
@keyframes nxbeat{50%{transform:scale(1.02)}}
.nx-tside{flex:1;min-width:220px}
.nx-tmin{display:flex;align-items:center;gap:8px;margin-top:10px} .nx-tmin .btn{min-width:40px;padding:0}
.nx-readok{display:flex;align-items:center;gap:10px;padding:12px 16px;border:1.5px dashed var(--rule);border-radius:14px;cursor:pointer}
.nx-readok input{width:24px;height:24px;accent-color:var(--leaf)}
.nx-qs{margin-top:18px}
.nx-q{padding:12px 16px;border:1px solid var(--rule);border-radius:14px;background:var(--surface);margin:10px 0}
.nx-q.ok{border-color:#B9D3B2;background:linear-gradient(180deg,var(--leaf-soft),var(--surface) 70%)}
.nx-qq{font-weight:600;margin:0 0 6px;line-height:1.6}
.nx-okm{color:var(--leaf)}

/* 268쪽 대화 */
.nx-pair{margin:14px 0 18px;padding:12px;border-radius:18px;background:var(--sunken)}
.nx-bub{display:flex;gap:10px;align-items:flex-end;margin:8px 0}
.nx-bub.r{flex-direction:row-reverse}
.nx-bub p{margin:0;padding:10px 14px;border-radius:16px;background:var(--surface);box-shadow:var(--shadow);max-width:34em;line-height:1.6}
.nx-bub.l p{border-bottom-left-radius:4px} .nx-bub.r p{border-bottom-right-radius:4px;background:#EAF3FF;color:#1F2A36}
.nx-av{width:46px;height:46px;flex:none;border-radius:50%;overflow:hidden;border:2px solid #fff;box-shadow:0 3px 10px rgba(0,0,0,.18)}
.nx-av svg{display:block;width:100%;height:100%}
.nx-whoh .nx-av{width:64px;height:64px}
.nx-slot{margin:10px auto 6px;max-width:420px;text-align:center;padding:12px;border-radius:12px;background:#fff;border:2px dashed var(--faint);font-size:1.1em;color:#2B2523}
.nx-slot.on{border:2px solid var(--leaf);background:var(--leaf-soft);color:var(--leaf);animation:bounce .45s cubic-bezier(.2,1.6,.4,1)}
.nx-blank{font-family:var(--cute);font-size:1.4em;color:var(--faint)}
.nx-mchips{justify-content:center}
.nx-three{padding:16px 20px;border-radius:16px;background:var(--surface);border:2px solid var(--ink);box-shadow:var(--shadow)}
.nx-three ol{list-style:none;padding:0;margin:0;display:grid;gap:10px}
.nx-three li{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-weight:700;font-size:1.08em}
.nx-three small{flex-basis:100%;padding-left:38px;font-weight:400}

/* 269쪽 표 */
.nx-table{border:1px solid var(--rule);border-radius:14px;overflow:hidden;background:var(--surface)}
.nx-th,.nx-tr{display:grid;grid-template-columns:1fr 1fr;gap:0}
.nx-th span{padding:8px 14px;background:var(--sunken);font-weight:700;font-size:.92em}
.nx-tr>div{padding:12px 14px;border-top:1px solid var(--rule)}
.nx-act{display:flex;flex-direction:column;gap:6px;align-items:flex-start;line-height:1.6}
.nx-tr.ok .nx-trait b{color:var(--leaf)}
.nx-trait{border-left:1px solid var(--rule)}
@media (max-width:640px){ .nx-th{display:none} .nx-tr{grid-template-columns:1fr} .nx-trait{border-left:0} }

/* 흐름 */
.nx-flow{list-style:none;padding:0;margin:12px 0;display:grid;gap:0}
.nx-fl{display:flex;gap:12px;align-items:center;padding:12px 14px;border-radius:14px;background:var(--surface);border:1px solid var(--rule);line-height:1.55;position:relative;margin-bottom:22px}
.nx-fl:not(:last-child)::after{content:"↓";position:absolute;left:24px;bottom:-22px;font-weight:700;color:var(--faint)}
.nx-fl.given{background:var(--sunken)} .nx-fl.given .pill{margin-left:auto}
.nx-fl.empty{border-style:dashed;color:var(--faint)}
.nx-deck{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:10px}
.nx-card{text-align:left;padding:14px 16px;border-radius:14px;border:1.5px solid var(--rule);background:linear-gradient(180deg,#FFFDF7,#F6F0E2);color:#2B2523;font-size:1em;line-height:1.55;cursor:pointer;box-shadow:0 2px 0 #E2D9C6;transition:transform .15s}
.nx-card:hover{transform:translateY(-2px)} .nx-card.no{border-color:var(--seal);animation:shake .38s}

/* 사슬 */
.nx-say{font-family:var(--hand,"Nanum Pen Script");font-size:1.35em}
.nx-chain{display:grid;gap:4px;margin:12px 0}
.nx-link{display:grid;gap:4px}
.nx-cause,.nx-res{border-radius:14px;padding:10px 14px;position:relative}
.nx-cause{background:#FFF4E5;border:1px solid #F0D2A4;color:#4A3A22}
.nx-cause.given{background:#FBE9D0}
.nx-cause p{margin:4px 0 0;line-height:1.55;min-height:1.5em}
.nx-cause .pill{position:absolute;right:10px;top:8px}
.nx-res{background:var(--surface);border:1.5px solid var(--rule)}
.nx-res.ok{border-color:#9CC690;background:linear-gradient(180deg,var(--leaf-soft),var(--surface) 60%)}
.nx-lab{display:inline-block;font-family:var(--cute);font-size:.9em;border-radius:999px;padding:1px 12px;color:#fff}
.nx-lab.c{background:#C98A2E} .nx-lab.r{background:var(--leaf)}
.nx-arrow{text-align:center;font-family:var(--cute);color:var(--muted)}
/* 사슬을 가볍게 — 앞 결과를 옮겨 온 원인은 얇은 이음표로, 결과 칸만 카드로 */
.nx-chain{gap:0;counter-reset:lk}
.nx-link{gap:0;position:relative}
.nx-cause:not(.given){display:flex;align-items:baseline;gap:8px;background:transparent;border:0;border-left:3px solid #E3B76A;border-radius:0 10px 10px 0;padding:4px 12px;margin:2px 0 0 18px;color:var(--muted);font-size:.93em}
.nx-cause:not(.given) p{margin:0;min-height:0}
.nx-cause:not(.given) .nx-lab{flex:none;font-size:.78em;padding:0 9px;background:#E3B76A}
.nx-cause.given{box-shadow:0 6px 18px -10px rgba(150,100,30,.5)}
.nx-arrow{font-size:.85em;line-height:1;padding:3px 0;width:max-content;margin:0 auto;opacity:.8}
.nx-res{border:0;box-shadow:0 1px 0 var(--rule),0 8px 22px -14px rgba(0,0,0,.35);border-left:4px solid var(--rule);margin-bottom:10px}
.nx-res.ok{border-left-color:var(--leaf);background:linear-gradient(90deg,var(--leaf-soft),var(--surface) 45%)}
.nx-res .nx-ta{border-style:solid;background:var(--paper)}
.nx-ideas{gap:6px}
.nx-ideas .chip{min-height:32px;padding:4px 11px;font-size:.84em;background:var(--sunken);border-color:transparent}
.nx-res.ok .nx-ideas{opacity:.62} .nx-res.ok .nx-ideas:hover,.nx-res.ok .nx-ideas:focus-within{opacity:1}
.nx-ta{width:100%;margin:6px 0;border:1.5px solid var(--rule);border-radius:10px;padding:10px 12px;background:var(--surface);font-size:1.04em;line-height:1.55;resize:vertical}
.nx-ta:focus{border-color:var(--sky);outline:none}
.nx-ideas .chip{text-align:left;border-radius:12px;line-height:1.4}
.nx-check{margin-top:20px;padding:14px 18px;border-radius:16px;background:var(--surface);border:1px solid var(--rule)}
.nx-check h3{margin-top:0}
.nx-ck{padding:8px 0;border-top:1px dashed var(--rule)} .nx-ck p{margin:0 0 4px;font-weight:600}

/* 쓰기 */
.nx-recap{padding:12px 16px;border-radius:14px;background:var(--sunken)}
.nx-recap h3{margin:0 0 6px}
.nx-recap ol{margin:0;padding-left:1.4em;line-height:1.7} .nx-recap li.c{color:#8A6420}
.nx-tips{display:flex;gap:12px;flex-wrap:wrap;margin:12px 0}
.nx-tipb{flex:1;min-width:220px;margin:0;padding:10px 14px;border-radius:14px;background:#FFF8D8;border:1px solid #EAD08A;color:#4A3A12;position:relative}
.nx-share ul{margin:6px 0 0;padding-left:1.2em}
#nxw{font-family:var(--sans)}

/* 장면 상상하기 */
.nx-dots{margin:0 0 6px;justify-content:center}
.nx-dot{width:14px;height:14px;border-radius:50%;border:0;background:var(--rule);cursor:pointer;padding:0}
.nx-dot.d{background:var(--leaf)} .nx-dot.c{outline:2.5px solid var(--seal);outline-offset:2px}
.nx-scene .art{max-width:620px;margin-inline:auto}
.nx-cap{text-align:center;font-weight:700;font-size:1.1em}

/* 낱말·성격 */
.nx-word,.nx-whoc{padding:12px 16px;border:1px solid var(--rule);border-radius:14px;background:var(--surface);margin:10px 0}
.nx-word.ok,.nx-whoc.ok{border-color:#B9D3B2}
.nx-mean{font-weight:700;font-size:1.08em;margin:0 0 6px}
.nx-who{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:12px}
.nx-whoh{display:flex;align-items:center;gap:10px;margin-bottom:6px;font-size:1.15em}

/* 이야기책 */
.nx-steps{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px;margin:12px 0}
.nx-step{margin:0;padding:10px;border-radius:14px;background:var(--surface);border:1px solid var(--rule);position:relative}
.nx-step .nx-n{position:absolute;left:8px;top:8px}
.nx-fold{width:100%;height:auto;border-radius:10px}
.nx-step figcaption{font-size:.92em;margin-top:6px;line-height:1.5}
.nx-mini{display:grid;grid-template-columns:1fr 1fr;width:180px;aspect-ratio:190/260;border:1.5px solid var(--ink);background:#fff;position:relative}
.nx-mini span{display:grid;place-items:center;font-family:var(--cute);font-size:.85em;color:#555;border:1px dashed #999}
.nx-mini span.g{background:radial-gradient(circle,#c6c6c6 1.4px,transparent 1.8px) 0 0/7px 7px,#ececec}
.nx-mini::after{content:"";position:absolute;left:50%;top:50%;height:50%;border-left:2.5px solid #E4574B}

/* 움직임 — html.calm 이면 모두 멈추고 기본 자리가 끝 장면 */
.nx-a-glow{animation:nxglow 2.2s ease-in-out infinite;transform-box:fill-box;transform-origin:center}
@keyframes nxglow{50%{opacity:.45;transform:scale(.85)}}
.nx-a-rain{animation:nxrain .55s linear infinite} .nx-a-rain2{animation:nxrain 1.1s linear infinite}
@keyframes nxrain{from{transform:translate(var(--rx),var(--ry))}}
.nx-a-rip{animation:nxrip 1.6s ease-out infinite;transform-box:fill-box;transform-origin:center} @keyframes nxrip{from{transform:scale(.2);opacity:.9}to{transform:scale(1.6);opacity:0}}
.nx-a-halo{animation:nxhalo 3.2s ease-in-out infinite;transform-box:fill-box;transform-origin:center} @keyframes nxhalo{50%{transform:scale(.88);opacity:.7}}
.nx-a-beam{animation:nxbeam 5s ease-in-out infinite} @keyframes nxbeam{0%,100%{opacity:.25}45%,60%{opacity:1}}
.nx-a-wind{animation:nxwind 2.2s ease-in-out infinite} @keyframes nxwind{from{transform:translateX(-30px);opacity:0}40%{opacity:1}}
.nx-a-flow{animation:nxflow 2.4s linear infinite} @keyframes nxflow{from{transform:translateX(-30px)}}
.nx-a-pencil{animation:nxpen 1.6s ease-in-out infinite} @keyframes nxpen{50%{transform:translate(326px,150px) rotate(-30deg)}}
.nx-a-tw{animation:nxtw 2.4s ease-in-out infinite} @keyframes nxtw{50%{opacity:.25}}
.nx-a-tongs{animation:nxtongs 5s ease-in-out infinite} @keyframes nxtongs{0%,100%{transform:translateY(-190px)}45%,60%{transform:none}}
.nx-a-drip{animation:nxdrip 1.6s ease-in infinite} @keyframes nxdrip{to{transform:translateY(22px);opacity:0}}
.nx-a-cloud{animation:nxcloud 6s ease-in-out infinite alternate} @keyframes nxcloud{from{transform:translateX(-40px)}}
.nx-a-sway{animation:nxsway 1.4s ease-in-out infinite alternate;transform-origin:50% 0} @keyframes nxsway{from{transform:skewX(-4deg)}}
.nx-a-lace{animation:nxsway 1s ease-in-out infinite alternate}
.nx-a-wag{animation:nxwag .35s ease-in-out infinite alternate;transform-box:fill-box;transform-origin:0 100%} @keyframes nxwag{from{transform:rotate(-18deg)}}
.nx-a-sniff{animation:nxsniff 1.8s ease-in-out infinite} @keyframes nxsniff{50%{transform:translateX(-12px)}}
.nx-a-pulse{animation:nxfloat 2.4s ease-in-out infinite} @keyframes nxfloat{50%{transform:translateY(-3px)}}
.nx-a-blink{animation:nxblink 4.2s infinite;transform-box:fill-box;transform-origin:center} @keyframes nxblink{0%,93%,100%{transform:none}96%{transform:scaleY(.12)}}
.nx-a-ear{animation:nxear 3.6s ease-in-out infinite;transform-box:fill-box;transform-origin:30% 100%} @keyframes nxear{0%,80%,100%{transform:none}86%{transform:rotate(-9deg)}92%{transform:rotate(4deg)}}
.nx-a-tail{animation:nxtail 2.2s ease-in-out infinite alternate;transform-box:fill-box;transform-origin:0 100%} @keyframes nxtail{from{transform:rotate(-10deg)}}
/* 쪽에 들어올 때(#scr.enter) 한 번만 — 다시 그릴 때는 움직이지 않는다 */
.scr.enter .nx .art{animation:nxartin .6s cubic-bezier(.2,.8,.3,1) both} @keyframes nxartin{from{opacity:0;transform:translateY(10px) scale(.985)}}
.scr.enter .nx-a-grow{stroke-dasharray:900;animation:nxgrow 2.6s ease-out .3s both} @keyframes nxgrow{from{stroke-dashoffset:900}}
.scr.enter .nx-a-pop{animation:nxpopin .55s cubic-bezier(.2,1.5,.4,1) both;transform-box:fill-box;transform-origin:50% 100%} @keyframes nxpopin{from{transform:scale(0)}}

/* ---------- 인쇄: 세 면 이야기책(붙임 9) ---------- */
#printroot .pr-nx-book{padding:0}
#printroot .pr-nx-hd{display:flex;justify-content:space-between;align-items:flex-end;gap:6mm;height:9mm;font-size:9.5pt;color:#6E6A63;border-bottom:.3mm solid #2B2523;padding-bottom:1mm}
#printroot .pr-nx-hd b{color:#2B2523;font-family:"Jua",sans-serif;font-weight:400;font-size:12pt}
#printroot .pr-nx-nm span{display:inline-block;min-width:32mm;border-bottom:.3mm solid #2B2523;color:#2B2523;font-size:11pt;text-align:center}
#printroot .pr-nx-grid{position:relative;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;height:251mm;margin-top:2mm;border:.3mm solid #2B2523}
#printroot .pr-nx-face{position:relative;display:flex;flex-direction:column;padding:5mm 6mm 5mm;border:.35mm dashed #8A847C;overflow:hidden}
#printroot .pr-nx-num{position:absolute;left:3mm;top:3mm;width:6mm;height:6mm;border-radius:50%;background:#2B2523;color:#fff;font-size:8.5pt;display:grid;place-items:center}
#printroot .pr-nx-lab{position:absolute;right:4mm;top:3mm;font-size:8pt;color:#9A958C}
#printroot .pr-nx-title{text-align:center;font-size:17pt;margin:3mm 0 2mm}
#printroot .pr-nx-pic{flex:none;height:46mm;margin:4mm 0 3mm;border:.3mm solid #CFC8BC;border-radius:3mm;color:#C9C2B6;font-size:9pt;display:grid;place-items:center}
#printroot .pr-nx-f0 .pr-nx-pic{height:38mm;margin-top:0}
#printroot .pr-nx-tx{flex:1;font-family:"Nanum Pen Script","Gowun Dodum",cursive;font-size:17pt;line-height:1.45;overflow:hidden;
  background-image:linear-gradient(transparent calc(100% - .25mm),#D9D2C6 0);background-size:100% 1.45em}
#printroot .pr-nx-lines{flex:1;display:flex;flex-direction:column;justify-content:space-between}
#printroot .pr-nx-wl{height:8.5mm;border-bottom:.3mm solid #B5AEA3}
#printroot .pr-nx-glue{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2mm;border:.35mm dashed #8A847C;
  background:radial-gradient(circle,#C6C6C6 .55mm,transparent .65mm) 0 0/3mm 3mm,#ECECEC;color:#555;font-size:12pt}
#printroot .pr-nx-glue small{font-size:8.5pt;color:#777}
#printroot .pr-nx-cut{position:absolute;left:50%;top:50%;height:50%;border-left:.7mm solid #E4574B;transform:translateX(-.35mm)}
#printroot .pr-nx-cut span{position:absolute;left:1.5mm;bottom:3mm;white-space:nowrap;font-size:8.5pt;color:#E4574B;background:#fff;padding:0 1mm}
#printroot .pr-nx-how{margin:1.5mm 0 0;font-size:8pt;color:#6E6A63;line-height:1.35}