/* Open paper scrolls keep all decoration outside the writing area. */
.scroll-collection{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:23px 18px;margin:22px 0}.scroll-item{border:0;background:transparent;padding:0;text-align:center;min-width:0;animation:cardEnter .35s both}.paper-scroll{height:145px;position:relative;margin:5px 8px 9px;background:#fffcf1;border-top:1px solid #e2d3b5;border-bottom:1px solid #dbc8a5;border-radius:3px;box-shadow:0 5px 9px #8b6b3520}.scroll-rod{position:absolute;top:-4px;bottom:-4px;width:15px;border:1px solid #ceb78d;border-radius:50% / 9px;background:linear-gradient(90deg,#d6bd91,#fff7e1 45%,#ead8b5 75%,#bb9e6c);z-index:2;box-shadow:1px 1px 3px #826b3e20}.scroll-rod:before,.scroll-rod:after{content:'';position:absolute;left:4px;width:5px;height:7px;border-radius:2px;background:#775b3d}.scroll-rod:before{top:-6px}.scroll-rod:after{bottom:-6px}.rod-left{left:-7px}.rod-right{right:-7px;transform:scaleX(-1)}.scroll-writing{position:absolute;inset:15px 17px;display:flex;flex-direction:column;justify-content:center;align-items:center;color:#263e31;gap:13px}.scroll-writing strong{font:36px var(--reading-font);font-weight:400;line-height:1.4;overflow-wrap:anywhere;letter-spacing:1px;max-width:100%}.scroll-writing small{font-size:15px;color:#4f5b48;font-weight:700}.long-scroll .scroll-writing strong{font-size:25px;letter-spacing:0}.scroll-caption{display:block;font-size:11px;color:#7f7965;line-height:1.6;word-break:keep-all;margin:11px 6px 0}.scroll-item:hover .paper-scroll{box-shadow:0 7px 14px #8b6b3530;transform:translateY(-2px);transition:.2s}.scroll-store{position:relative;width:210px;height:120px;flex-shrink:0}.scroll-crate{position:absolute;bottom:0;left:0;right:0;height:49px;background:linear-gradient(20deg,#9d7345,#b58b56);border:3px solid #805b38;border-top-width:9px;transform:skewY(-2deg);box-shadow:0 4px 0 #d2b992;border-radius:3px}.stored-scroll{position:absolute;bottom:calc(var(--roll)*14px + 22px);left:8px;width:177px;height:26px;background:linear-gradient(#f2dec0,#fff9ea 40%,#e8d1a8);border:1px solid #c0a178;border-radius:6px;transform:rotate(-6deg);box-shadow:0 2px 3px #71532e25}.stored-scroll:nth-child(2n){left:19px;transform:rotate(3deg)}.stored-scroll>i{position:absolute;left:46px;top:-1px;bottom:-1px;width:8px;background:#b37b4d;box-shadow:61px 0 #b37b4d}.stored-scroll>b{position:absolute;right:-8px;top:-2px;width:24px;height:29px;border:3px solid #dac6a4;border-radius:50%;background:repeating-radial-gradient(ellipse,#fcf6e7 0,#fcf6e7 3px,#b9a483 4px,#b9a483 5px)}.stored-scroll>span{display:block;font-size:9px;position:absolute;left:62px;top:5px;color:#79644b;font-weight:400}.stored-scroll.scroll-empty{opacity:.25}.scroll-detail-heading{display:block;font-family:var(--reading-font);font-size:46px;font-weight:400;color:#293f32;text-align:center;margin:10px 0 22px;line-height:1.4;overflow-wrap:anywhere}.opened-scroll-modal{background:#fffcf2;border-left:9px solid #ddc7a2;border-right:9px solid #ddc7a2;border-top:1px solid #c1a477;border-bottom:1px solid #c1a477;border-radius:8px;padding:26px 25px;color:#304333;box-shadow:0 12px 35px #334b3b33}.opened-scroll-modal h2{font-size:24px}.opened-scroll-modal h2 .detail-hanja{display:none}.opened-scroll-modal p{font-size:15px;line-height:1.85;color:#53604f}.opened-scroll-modal .origin-story{background:#f7f1df;border-color:#e4d4b5}.growth-hero-button{border:0;cursor:pointer;padding:0;min-height:0;color:inherit;overflow:visible;align-self:stretch}.growth-hero-button:focus-visible{outline:3px solid #9b8255;outline-offset:-6px}.teacher-art>svg{pointer-events:none}.status-growth{display:flex;align-items:center;gap:8px;background:#f9f4e5;border:1px solid #d8caaa;border-radius:12px;padding:11px 13px;text-align:left}.status-growth strong{font-size:16px}.status-growth>span{margin-left:auto;font-size:11px;color:#7d8062;white-space:nowrap}.growth-page{max-width:740px;padding:28px}.growth-page>h2{font-size:24px;margin:24px 0 20px;word-break:keep-all}.growth-current{border:1px solid #d3c3a2;border-radius:20px;background:linear-gradient(#eff0dc,#fbf6e7);text-align:center;padding:18px 22px 23px}.growth-current>div:first-child{width:190px;margin:auto}.growth-current svg{display:block;width:100%;animation:lionBreathe 4s ease-in-out infinite}.growth-current h3{font-size:24px;margin:5px 0 6px}.growth-current p{margin:0 0 16px;font-size:16px}.growth-meter{height:9px;border-radius:10px;background:#dedfc9;overflow:hidden;margin:0 auto 10px;max-width:390px}.growth-meter>i{display:block;background:#749369;height:100%;border-radius:10px}.growth-current>span{font-size:13px;color:#6d785f}.growth-steps{display:flex;flex-direction:column;gap:12px;margin-top:24px}.growth-step{display:flex;align-items:center;gap:20px;border:1px solid #d3c3a4;border-radius:17px;padding:13px 20px;background:#f7efdd}.growth-step.current{border:2px solid #6f8b5f;padding:12px 19px;background:#e6ecd7;box-shadow:0 3px 0 #bec9a54d}.growth-mini{width:100px;flex-shrink:0}.growth-mini svg{width:100%;display:block}.growth-step h3{font-size:21px;margin:0 0 8px;white-space:nowrap}.growth-step p{font-size:13px;margin:0}.growth-step>span{margin-left:auto;font-size:12px;white-space:nowrap;color:#8d8b77}.growth-step.not-yet .growth-mini{opacity:.5;filter:saturate(.65)}.growth-foot{font-size:12px;text-align:center;margin:22px 0 5px;word-break:keep-all}.growth-unlocked{border:1px solid #bda165;background:#f8edc9;padding:12px;border-radius:10px;display:flex;flex-direction:column;align-items:center;gap:5px;width:100%;margin:13px 0 0;color:#67532b}.growth-unlocked strong{font-size:13px}.growth-unlocked span{font-size:10px}.seodang-status{display:grid;grid-template-columns:1fr auto auto}.seodang-status .status-growth{grid-column:1/-1}.seodang-status>span{font-size:12px;white-space:nowrap}.growth-step svg text,.growth-current svg text{font-family:var(--reading-font)}
@media(max-width:650px){.scroll-collection{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 12px;margin:21px 0}.paper-scroll{height:130px;margin:6px 7px 10px}.scroll-writing{inset:15px 13px;gap:11px}.scroll-writing strong{font-size:30px;letter-spacing:0}.scroll-writing small{font-size:13px;line-height:1.5;word-break:keep-all}.long-scroll .scroll-writing strong{font-size:23px}.scroll-caption{font-size:9px;margin:10px 5px 0}.scroll-rod{width:12px}.rod-left{left:-6px}.rod-right{right:-6px}.scroll-rod:before,.scroll-rod:after{left:3px;width:4px}.scroll-store{width:188px;height:112px}.stored-scroll{width:158px;left:4px;height:24px;bottom:calc(var(--roll)*13px + 22px)}.stored-scroll:nth-child(2n){left:15px}.stored-scroll>i{left:39px;width:7px;box-shadow:56px 0 #b37b4d}.stored-scroll>b{width:22px;height:27px}.stored-scroll>span{left:54px;font-size:8px}.opened-scroll-modal{padding:22px 19px;border-left-width:7px;border-right-width:7px}.opened-scroll-modal p{font-size:14px}.scroll-detail-heading{font-size:40px;margin:8px 0 20px}.growth-hero-button{display:flex;min-height:252px}.seodang-status{gap:10px;padding:16px 1px}.seodang-status>span{font-size:10px}.status-growth{padding:11px 12px;gap:7px}.status-growth strong{font-size:16px}.status-growth>span{font-size:10px}.growth-page{padding:20px 16px}.growth-page>h2{font-size:21px;margin:20px 0 16px}.growth-current{padding:12px 16px 19px;border-radius:17px}.growth-current>div:first-child{width:155px}.growth-current h3{font-size:23px;margin:3px 0 5px}.growth-current p{font-size:14px;margin-bottom:14px}.growth-current>span{font-size:12px}.growth-steps{margin-top:20px;gap:10px}.growth-step{padding:12px 10px;gap:10px;border-radius:15px}.growth-step.current{padding:11px 9px}.growth-mini{width:80px}.growth-step h3{font-size:18px;margin-bottom:7px}.growth-step p{font-size:11px}.growth-step>span{font-size:10px}.growth-foot{font-size:10px;line-height:1.7}.growth-unlocked{margin-top:12px;padding:10px}.growth-unlocked strong{font-size:12px}}
@media(max-width:350px){.scroll-writing strong{font-size:27px}.long-scroll .scroll-writing strong{font-size:20px}.scroll-writing small{font-size:12px}.scroll-collection{gap:22px 10px}.growth-mini{width:65px}.growth-step{gap:8px}.growth-step h3{font-size:16px}.growth-step>span{font-size:9px}.status-growth strong{font-size:14px}}
@media(prefers-reduced-motion:reduce){.growth-current svg{animation:none!important}}