.hs-intro-lead{display:grid;grid-template-columns:1fr 1fr;gap:48px;margin-bottom:56px;align-items:start}.hs-intro-lead>p{font-family:var(--font-display);font-size:var(--type-card);font-weight:700;line-height:1.5}.hs-intro-lead>span{font-size:var(--type-body);line-height:1.8;color:var(--color-text-secondary)}
.hs-principles{background:white;border-radius:14px;padding:8px 40px}.hs-principles article{display:grid;grid-template-columns:60px minmax(0,1fr);gap:24px;padding:40px 0}.hs-principles article+article{border-top:1px solid var(--color-border)}.hs-number{font-family:var(--font-display);font-size:32px;font-weight:700;color:var(--color-editorial-accent)}.hs-principles h3{font-family:var(--font-display);font-size:var(--type-card);font-weight:700;line-height:1.5;margin-bottom:18px}.hs-principles p{font-size:var(--type-body);line-height:1.8}.hs-concept-flow{display:grid;grid-template-columns:1fr 1fr auto 1.4fr;align-items:stretch;gap:14px;margin:28px 0}.hs-concept-flow>div{border:1px solid var(--color-border-strong);border-radius:8px;padding:18px}.hs-concept-flow>span{align-self:center;color:var(--color-editorial-accent)}.hs-principles small{font-size:var(--type-note);line-height:1.6;color:var(--color-text-secondary)}.hs-concept-flow small{color:var(--color-editorial-accent);font-weight:600;display:block;margin-bottom:10px}.hs-study-flow{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;padding:0;list-style:none;margin:28px 0}.hs-study-flow li{background:var(--color-editorial-soft);padding:20px;border-radius:8px;display:flex;flex-direction:column;gap:8px}.hs-study-flow strong{color:var(--color-editorial-accent)}.hs-methods{padding-left:22px;line-height:1.9;margin:24px 0}.hs-book-flow{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:28px}.hs-book-flow>div{padding:22px;background:var(--color-editorial-soft);border-radius:8px}.hs-book-flow strong{color:var(--color-editorial-accent)}.hs-book-flow p{margin:10px 0}.hanwansu .ps-review-heading{font-family:var(--font-display);font-weight:700}
@media(max-width:760px){.hs-intro-lead{grid-template-columns:1fr;gap:20px;margin-bottom:32px}.hs-principles{padding:0 22px}.hs-principles article{grid-template-columns:1fr;gap:12px;padding:30px 0}.hs-number{font-size:26px}.hs-concept-flow{grid-template-columns:1fr;gap:12px}.hs-concept-flow>span{justify-self:center;transform:rotate(90deg)}.hs-study-flow,.hs-book-flow{grid-template-columns:1fr;gap:12px}.hs-principles h3{margin-bottom:14px}.hs-study-flow li{padding:16px}.hs-book-flow>div{padding:18px}}
.hanwansu #guide{--color-editorial-soft:#f3eef9;--color-editorial-accent:#714d9c}.ps-summary-status{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}

.hs-hero-recommended{margin:20px 0 28px;font-size:var(--type-body);line-height:1.65}.hs-hero-recommended strong{font-weight:600}.hs-hero-recommended ul{margin:8px 0 0;padding-left:20px}.hanwansu .series-stage.hs-stage-books{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:26px 14px;width:100%;max-width:460px;height:auto;min-height:0;align-items:center;justify-self:center;padding:18px 0}.hanwansu .series-stage.hs-stage-books img{position:relative;inset:auto;width:100%;height:auto;max-height:none;object-fit:contain;margin:0;transform:none;animation:hs-cover-float var(--cover-duration) ease-in-out var(--cover-delay) infinite;z-index:auto}.hanwansu .series-hero-copy h2{word-break:keep-all}@keyframes hs-cover-float{0%,100%{transform:translateY(4px)}50%{transform:translateY(-5px)}}@media(max-width:760px){.hanwansu .series-stage.hs-stage-books{max-width:330px;gap:22px 12px;margin:20px auto 0}.hs-hero-recommended{margin:18px 0 24px}}@media(prefers-reduced-motion:reduce){.hanwansu .series-stage.hs-stage-books img{animation:none}}

.hs-principles article{align-items:baseline}.hs-number{line-height:1.5}@media(max-width:760px){.hs-principles article{grid-template-columns:38px minmax(0,1fr);gap:16px 12px}.hs-principles article>div{display:contents}.hs-principles article>div>:not(h3){grid-column:1 / -1}.hs-principles h3{margin-bottom:0}}
/* 소개 PDF의 세 원칙: 색·강조·도식과 실제 문구를 보존한다. */
.hs-principles{--hs-pdf:#5565af}.hs-principles h3 em{font-style:normal;color:var(--hs-pdf)}.hs-number{color:var(--hs-pdf)}.hs-number>span{color:#bfc0c1}.hs-principles fieldset{position:relative;min-width:0;margin:0;padding:12px 16px 16px;border:1px solid var(--hs-pdf);border-radius:8px}.hs-principles legend{font-size:var(--type-note);line-height:1.4;padding:1px 10px;border-radius:12px;background:var(--hs-pdf);color:#fff}.hs-principles fieldset p{font-size:var(--type-note);line-height:1.65}.hs-principles .hs-volume{position:absolute;right:8px;top:-12px;padding:0 5px;background:#fff;color:var(--hs-pdf);font-size:var(--type-note)}.hs-concept-flow{grid-template-columns:1fr 1fr 34px 1.3fr;gap:16px;margin:24px 0;align-items:stretch}.hs-concept-flow .hs-indirect{border-color:#bfc0c1}.hs-indirect legend{background:#fff;color:#666;border:1px solid #bfc0c1}.hs-flow-arrow{display:flex;flex-direction:column;justify-content:center;align-items:center;color:var(--hs-pdf)}.hs-flow-arrow small{margin:0;color:inherit}.hs-flow-arrow>span{font-size:26px;line-height:1}.hs-study-flow{display:grid;grid-template-columns:1fr 26px 1.2fr 26px 1fr;gap:10px;align-items:center;margin:24px 0}.hs-study-flow>div{display:flex;flex-direction:column;gap:6px;background:#f2f1f9;border-radius:8px;padding:16px}.hs-study-flow strong{color:var(--hs-pdf)}.hs-study-flow>span{color:#8f9bcc;text-align:center;font-size:24px}.hs-method-diagram{display:grid;grid-template-columns:1fr 3fr 1fr;gap:16px;margin:24px 0}.hs-method-diagram .hs-method-side{border-color:#bfc0c1}.hs-method-side legend{border:1px solid #bfc0c1;background:#fff;color:#666}.hs-method-side i{display:block;height:1px;background:#d5d8e8;margin:8px 0}.hs-method-side i:nth-child(2){width:80%}.hs-method-side i:nth-child(3){width:90%}.hs-method-side i:nth-child(4){width:70%}.hs-method-side i:nth-child(5){width:45%}.hs-method-center ul{margin:0;padding-left:18px;font-size:var(--type-note);line-height:1.8}.hs-method-center li::marker{color:var(--hs-pdf)}
.hs-principles.js-reveal article{opacity:0;transform:translateY(14px);transition:opacity .7s ease,transform .7s ease}.hs-principles.js-reveal article.is-visible{opacity:1;transform:none}.hs-principles article.is-visible .hs-study-flow>div,.hs-principles article.is-visible .hs-concept-flow>fieldset,.hs-principles article.is-visible .hs-method-diagram>fieldset{animation:hs-diagram-float 6s ease-in-out infinite}.hs-principles fieldset:nth-child(2),.hs-study-flow>div:nth-child(3){animation-delay:-2s!important}.hs-principles fieldset:last-child,.hs-study-flow>div:last-child{animation-delay:-4s!important}@keyframes hs-diagram-float{0%,100%{transform:translateY(1px)}50%{transform:translateY(-1px)}}
@media(max-width:760px){.hs-concept-flow{grid-template-columns:minmax(0,1fr) 24px minmax(0,1fr);gap:12px}.hs-concept-flow .hs-indirect{grid-column:1/-1}.hs-concept-flow>span{transform:none}.hs-principles fieldset{padding:10px}.hs-principles legend{padding:1px 5px;font-size:12px}.hs-principles .hs-volume{position:static;display:block;padding:0;margin-bottom:6px;font-size:12px}.hs-study-flow{grid-template-columns:1fr;gap:6px}.hs-study-flow>span{transform:rotate(90deg);line-height:1}.hs-method-diagram{grid-template-columns:32px minmax(0,1fr) 32px;gap:8px}.hs-method-diagram .hs-method-side{padding:7px 4px}.hs-method-side legend{padding:0;font-size:11px}.hs-method-center ul{padding-left:14px}.hanwansu .ps-review-summary header{grid-template-columns:auto minmax(0,1fr) auto auto;align-items:center}.hanwansu .ps-review-summary h3{line-height:1.4}}
@media(prefers-reduced-motion:reduce){.hs-principles.js-reveal article{opacity:1;transform:none;transition:none}.hs-principles article.is-visible .hs-study-flow>div,.hs-principles article.is-visible .hs-concept-flow>fieldset,.hs-principles article.is-visible .hs-method-diagram>fieldset{animation:none}}
.hs-concept-flow>.hs-flow-arrow{color:var(--hs-pdf)}
/* 한완수 히어로: 제목·소개·추천·구매 위계를 분리한다. */
.hanwansu .series-hero-panel{gap:42px;padding:64px 5%}.hanwansu .series-hero-copy h2{font-size:clamp(48px,5vw,68px);line-height:1.13;letter-spacing:-.035em}.hanwansu .series-hero-copy .series-intro{font-size:18px;line-height:1.75;margin:26px 0 0;max-width:460px}.hs-hero-recommended{background:rgba(255,255,255,.82);border:1px solid rgba(85,101,175,.12);border-radius:14px;padding:20px 22px;margin:24px 0;max-width:460px;text-align:left}.hs-hero-recommended strong{font-size:15px}.hs-hero-recommended ul{list-style:none;padding:0;margin-top:10px}.hs-hero-recommended li{display:flex;gap:8px;font-size:15px;line-height:1.7}.hs-hero-recommended li+li{margin-top:4px}.hs-hero-recommended li::before{content:'·';flex:none}.hanwansu .series-hero-copy>.button{min-width:144px}
.hanwansu .series-stage.hs-stage-books{gap:46px 0;padding:30px 22px;max-width:460px;overflow:visible}.hanwansu .series-stage.hs-stage-books img{width:118%;max-width:none;justify-self:center;--tilt:0deg;--lift:0px;transform:translateY(var(--lift)) rotate(var(--tilt));animation:hs-cover-fan var(--cover-duration) ease-in-out var(--cover-delay) infinite;filter:drop-shadow(0 10px 10px #26304b20)}.hanwansu .hs-stage-books img:nth-child(3n+1){--tilt:-10deg;--lift:8px;z-index:1}.hanwansu .hs-stage-books img:nth-child(3n+2){--tilt:-1deg;--lift:-14px;z-index:3}.hanwansu .hs-stage-books img:nth-child(3n){--tilt:9deg;--lift:4px;z-index:2}.hanwansu .hs-stage-books img:nth-child(4){--tilt:-8deg;--lift:4px}.hanwansu .hs-stage-books img:nth-child(5){--tilt:2deg;--lift:-10px}.hanwansu .hs-stage-books img:nth-child(6){--tilt:11deg;--lift:10px}@keyframes hs-cover-fan{0%,100%{transform:translateY(calc(var(--lift) + 5px)) rotate(calc(var(--tilt) - 1.4deg))}50%{transform:translateY(calc(var(--lift) - 8px)) rotate(calc(var(--tilt) + 1.4deg))}}
@media(max-width:800px){.hanwansu .series-hero-panel{padding:30px 22px;gap:28px}.hanwansu .series-stage.hs-stage-books{order:-1;max-width:300px;gap:32px 0;padding:24px 16px;margin:8px auto 12px}.hanwansu .series-hero-copy{text-align:left}.hanwansu .series-hero-copy h2{font-size:48px;line-height:1.14;text-align:left;width:fit-content;margin-inline:auto}.hanwansu .series-hero-copy .series-intro{font-size:16px;line-height:1.75;margin-top:22px}.hs-hero-recommended{padding:18px;margin:22px 0}.hanwansu .series-hero-copy>.button{width:100%}}
@media(prefers-reduced-motion:reduce){.hanwansu .series-stage.hs-stage-books img{animation:none;transform:translateY(var(--lift)) rotate(var(--tilt))}}

@media(min-width:801px){.hanwansu .series-hero-panel{grid-template-columns:.92fr 1.08fr;gap:24px;padding:60px 4%}.hanwansu .series-stage.hs-stage-books{max-width:560px;padding:30px 18px}.hanwansu .series-hero-copy .series-intro,.hs-hero-recommended{max-width:none}}

/* 제목 위계는 유지하고 설명·추천 대상의 읽기 크기를 한 단계 높인다. */
.hanwansu .series-hero-copy .series-intro{font-size:20px}
.hs-hero-recommended strong,.hs-hero-recommended li{font-size:17px}
@media(max-width:800px){.hanwansu .series-hero-copy .series-intro{font-size:18px}.hs-hero-recommended strong,.hs-hero-recommended li{font-size:16px}}

@media(max-width:760px){.hs-method-diagram{grid-template-columns:minmax(0,1fr);gap:12px}.hs-method-diagram .hs-method-side{padding:4px 12px 8px}.hs-method-side legend{padding:1px 5px;font-size:12px}.hs-method-side i{margin:6px 0}.hs-method-side i:nth-of-type(n+3){display:none}}

.hanwansu .series-hero-copy .hs-hero-bookname{font-family:var(--font-body);font-size:21px;font-weight:600;line-height:1.5;margin:0 0 14px;color:var(--color-text-secondary)}
@media(max-width:800px){.hanwansu .series-hero-copy .hs-hero-bookname{font-size:19px;text-align:center;margin-bottom:12px}}

.hs-concept-flow fieldset p{word-break:keep-all;overflow-wrap:normal}.hs-concept-flow .hs-keep-phrase{white-space:nowrap}

/* 세 가지 시선 내부: 선명한 본문 위에 절제된 유리 표면과 연결 흐름. */
.hs-intro{background:radial-gradient(ellipse at 10% 20%,rgba(172,185,233,.18),transparent 48%),radial-gradient(ellipse at 90% 70%,rgba(199,184,229,.18),transparent 45%),#f5f5f9}
.hs-intro .hs-principles{background:rgba(255,255,255,.68);box-shadow:inset 0 0 0 1px rgba(255,255,255,.9),0 12px 38px rgba(64,71,112,.045)}
.hs-intro .hs-principles fieldset,.hs-intro .hs-study-flow>div{background:linear-gradient(145deg,rgba(255,255,255,.94),rgba(239,242,253,.66));border:1px solid rgba(122,137,190,.28);box-shadow:inset 0 1px 0 rgba(255,255,255,.95),0 5px 15px rgba(61,75,124,.055);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.hs-intro .hs-study-flow>div{border-radius:8px}
.hs-intro .hs-principles legend{background:linear-gradient(135deg,#7583be,#5565af);box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 2px 5px rgba(62,75,126,.1)}
.hs-intro .hs-indirect legend,.hs-intro .hs-method-side legend{background:rgba(255,255,255,.88);color:#626978;border-color:rgba(138,148,176,.28);box-shadow:inset 0 1px 0 #fff}
.hs-intro .hs-volume{background:transparent}
.hs-intro .hs-arrow-slot{display:flex;align-items:center;justify-content:center;line-height:0}
.hs-intro .hs-arrow-svg{display:block;width:100%;min-width:24px;max-width:40px;height:24px;overflow:visible}
.hs-intro .hs-arrow-flow{stroke-dasharray:6 40;animation:hs-arrow-stream 3.8s linear infinite}
.hs-intro .hs-flow-arrow small{font-size:12px;line-height:1.5;letter-spacing:.02em;margin-bottom:2px}
@keyframes hs-arrow-stream{from{stroke-dashoffset:46;opacity:0}20%,75%{opacity:.8}to{stroke-dashoffset:0;opacity:0}}
@media(max-width:760px){.hs-intro .hs-study-flow>.hs-arrow-slot{justify-self:center;width:28px;height:28px}.hs-intro .hs-principles fieldset,.hs-intro .hs-study-flow>div{backdrop-filter:none;-webkit-backdrop-filter:none;background:linear-gradient(145deg,rgba(255,255,255,.96),rgba(239,242,253,.85))}}
@media(prefers-reduced-motion:reduce){.hs-intro .hs-arrow-flow{animation:none;display:none}}

.hs-intro{background:radial-gradient(ellipse at 12% 22%,rgba(141,174,241,.156),transparent 48%),radial-gradient(ellipse at 88% 72%,rgba(169,146,227,.143),transparent 46%),#f5f6fb}
.hs-intro .hs-principles{background:rgba(255,255,255,.28);box-shadow:inset 0 1px 0 rgba(255,255,255,.95),inset 0 0 0 1px rgba(255,255,255,.5),0 18px 50px rgba(58,74,128,.07)}
.hs-intro .hs-concept-flow,.hs-intro .hs-study-flow,.hs-intro .hs-method-diagram{background:radial-gradient(ellipse at 22% 55%,rgba(137,179,246,.23),transparent 55%),radial-gradient(ellipse at 83% 30%,rgba(174,145,232,.19),transparent 52%);border-radius:12px}
.hs-intro .hs-principles fieldset,.hs-intro .hs-study-flow>div{border:1px solid transparent;background:linear-gradient(140deg,rgba(255,255,255,.42),rgba(255,255,255,.08) 48%,rgba(255,255,255,.22)) padding-box,linear-gradient(155deg,rgba(255,255,255,.9),rgba(255,255,255,.16) 52%,rgba(155,173,216,.24)) border-box;backdrop-filter:blur(9px) saturate(145%);-webkit-backdrop-filter:blur(9px) saturate(145%);box-shadow:inset 0 1px 0 rgba(255,255,255,.95),inset 0 -1px 0 rgba(255,255,255,.22),0 10px 26px rgba(62,82,139,.09)}
.hs-intro .hs-principles .hs-indirect,.hs-intro .hs-principles .hs-method-side{border-color:transparent}
@media(max-width:760px){.hs-intro .hs-principles fieldset,.hs-intro .hs-study-flow>div{backdrop-filter:blur(4px) saturate(135%);-webkit-backdrop-filter:blur(4px) saturate(135%)}}

/* Independent masked rim keeps the transparent center and crisp text intact. */
.hs-intro .hs-principles fieldset,.hs-intro .hs-study-flow>div{position:relative;background:rgba(255,255,255,.2);backdrop-filter:blur(16px) saturate(149%);-webkit-backdrop-filter:blur(16px) saturate(149%);box-shadow:inset 0 1.5px 0 rgba(255,255,255,.85),inset 0 -1px 0 rgba(255,255,255,.25),inset 0 0 12px rgba(255,255,255,.2),0 12px 30px rgba(62,82,139,.09)}
.hs-intro .hs-principles fieldset::before,.hs-intro .hs-study-flow>div::before{content:"";position:absolute;inset:-1px;border-radius:inherit;padding:1.25px;background:linear-gradient(145deg,rgba(255,255,255,.95) 0%,rgba(255,255,255,.88) 20%,rgba(255,255,255,.1) 53%,rgba(255,255,255,.55) 100%);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}
@media(max-width:760px){.hs-intro .hs-principles fieldset,.hs-intro .hs-study-flow>div{backdrop-filter:blur(5px) saturate(139%);-webkit-backdrop-filter:blur(5px) saturate(139%)}}

/* 기존 색 번짐은 유지하고, 행 경계 바깥으로 부드럽게 확산시킨다. */
.hs-intro .hs-concept-flow,.hs-intro .hs-study-flow,.hs-intro .hs-method-diagram{position:relative;isolation:isolate;background:none}
.hs-intro .hs-concept-flow::before,.hs-intro .hs-study-flow::before,.hs-intro .hs-method-diagram::before{content:"";position:absolute;inset:-18px -16px;z-index:-1;border-radius:40px;background:radial-gradient(ellipse at 22% 55%,rgba(137,179,246,.182),transparent 65%),radial-gradient(ellipse at 83% 30%,rgba(174,145,232,.156),transparent 62%);filter:blur(16px);pointer-events:none}
.hs-intro .hs-principles fieldset,.hs-intro .hs-study-flow>div{background:rgba(255,255,255,.17)}
.hs-intro .hs-principles legend{position:absolute;top:0;left:16px;transform:translateY(-50%);width:max-content;max-width:calc(100% - 32px);margin:0;z-index:1}
.hs-intro .hs-principles fieldset{padding-top:20px}
.hs-intro .hs-principles .hs-volume{top:5px}
@media(max-width:760px){.hs-intro .hs-principles legend{left:10px;max-width:calc(100% - 20px)}.hs-intro .hs-principles fieldset{padding-top:18px}.hs-intro .hs-method-diagram .hs-method-side{padding-top:12px}.hs-intro .hs-concept-flow::before,.hs-intro .hs-study-flow::before,.hs-intro .hs-method-diagram::before{inset:-12px -8px;filter:blur(12px)}}

.hs-intro .hs-arrow-slot{width:26px;flex:none}
.hs-intro .hs-arrow-svg{width:26px;min-width:26px;height:24px}
.hs-intro .hs-arrow-line{vector-effect:non-scaling-stroke;stroke-width:1.25px}
.hs-intro .hs-arrow-flow{vector-effect:non-scaling-stroke;stroke-width:1px}

/* 실제 휴대폰의 좁은 폭과 태블릿 중간 폭에서 도식 라벨·본문 공간 확보. */
@media(max-width:380px){.hs-intro .hs-concept-flow{grid-template-columns:minmax(0,1fr) 20px minmax(0,1fr);gap:8px}}
@media(min-width:761px) and (max-width:1024px){.hs-intro .hs-concept-flow{grid-template-columns:minmax(0,1fr) 26px minmax(0,1fr);gap:20px 12px}.hs-intro .hs-concept-flow .hs-indirect{grid-column:1/-1}.hs-intro .hs-principles .hs-volume{position:static;display:block;margin:0 0 6px;padding:0}}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.hs-intro .hs-principles fieldset,.hs-intro .hs-study-flow>div{background:rgba(249,250,255,.88)}}
@supports not ((mask-composite:exclude) or (-webkit-mask-composite:xor)){.hs-intro .hs-principles fieldset::before,.hs-intro .hs-study-flow>div::before{display:none}.hs-intro .hs-principles fieldset,.hs-intro .hs-study-flow>div{border-color:rgba(180,190,220,.65)}}