:root { --paper:#f3ebdd; --paper-deep:#e7ddcb; --ink:#1e1b18; --charcoal:#4a443e; --muted:#82786d; --cinnabar:#a33a2b; --cinnabar-dark:#812d22; --pine:#5d6657; --clay:#d6c7af; --white-wash:#fbf8f1; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:"Noto Serif KR","KoPub Batang","Batang",serif; }
button,input { font:inherit; }
button,a { -webkit-tap-highlight-color:transparent; }
button:focus-visible,a:focus-visible,input:focus-visible { outline:3px solid rgba(163,58,43,.35); outline-offset:3px; }
main { min-height:100vh; overflow:hidden; background:radial-gradient(circle at 18% 8%,rgba(255,255,255,.8),transparent 31%),linear-gradient(rgba(92,76,58,.035) 1px,transparent 1px); background-size:auto,100% 6px; }
.site-header { height:74px; padding:0 max(32px,calc((100vw - 1360px)/2)); display:grid; grid-template-columns:1fr auto 1fr; align-items:center; border-bottom:1px solid rgba(30,27,24,.15); background:rgba(243,235,221,.92); backdrop-filter:blur(12px); position:relative; z-index:10; }
.series-mark { color:var(--ink); text-decoration:none; font-size:17px; font-weight:700; letter-spacing:-.02em; display:flex; align-items:center; gap:12px; }
.series-mark span { width:2px; height:24px; background:var(--cinnabar); }
nav { display:flex; height:100%; gap:46px; }
nav a { color:var(--charcoal); text-decoration:none; display:grid; place-items:center; position:relative; font-family:"Noto Sans KR",sans-serif; font-size:15px; }
nav a::after { content:""; position:absolute; left:0; right:0; bottom:0; height:2px; transform:scaleX(0); background:var(--cinnabar); transition:.16s; }
nav a:hover,nav a.active { color:var(--cinnabar); } nav a.active::after,nav a:hover::after { transform:scaleX(1); }
nav a.sibling-tab { display:flex; align-items:center; margin-left:12px; padding-left:24px; border-left:1px solid rgba(30,27,24,.15); gap:8px; }
nav a.sibling-tab i { width:7px; height:7px; border-radius:50%; flex:0 0 auto; background:linear-gradient(135deg,#3e7856,#3f86ac); }
.menu-button { width:43px;height:43px;border:1px solid rgba(30,27,24,.45);border-radius:50%;background:transparent;justify-self:end;display:grid;align-content:center;gap:4px;padding:12px;text-decoration:none;cursor:pointer; }
.menu-button i { height:1px;background:var(--ink);display:block; }
.hero { max-width:1440px; min-height:840px; margin:auto; position:relative; padding:0 40px 60px; display:grid; grid-template-columns:5fr 7fr; }
.hero-copy { padding:92px 24px 210px 50px; position:relative; z-index:2; animation:rise .5s ease both; }
.eyebrow { color:var(--charcoal); font-size:16px; letter-spacing:.04em; margin:0 0 18px; }
.eyebrow::after { content:""; display:block; width:28px; height:2px; margin-top:15px; background:var(--cinnabar); }
h1 { margin:0; display:flex; align-items:baseline; gap:22px; line-height:1; letter-spacing:-.06em; }
h1 span { font-size:clamp(76px,7vw,104px); font-weight:700; } h1 em { font-size:52px; font-style:normal; color:#6f675f; font-weight:400; letter-spacing:.04em; }
.hero-description { max-width:470px; font-size:19px; line-height:1.95; color:var(--charcoal); margin:34px 0 32px; word-break:keep-all; }
.primary-button { min-width:270px; height:66px; padding:0 30px; border:0; border-radius:3px; background:var(--cinnabar); color:var(--white-wash); font-size:19px; cursor:pointer; box-shadow:0 10px 28px rgba(92,32,23,.18); transition:.18s; }
.primary-button:hover { transform:translateY(-2px); background:var(--cinnabar-dark); box-shadow:0 15px 34px rgba(92,32,23,.24); }.primary-button span{margin-left:20px;}
.hero-facts { margin-top:40px; display:flex; gap:32px; }
.hero-facts div { display:grid; gap:3px; padding-right:25px; border-right:1px solid var(--clay); }.hero-facts div:last-child{border:0}.hero-facts strong{font-size:25px;color:var(--cinnabar)}.hero-facts span{font-size:11px;color:var(--muted);font-family:"Noto Sans KR",sans-serif;}
.hero-visual { position:absolute; top:22px; right:0; width:62%; height:650px; background:linear-gradient(90deg,var(--paper) 0%,transparent 15%),url('/images/hero-seolwon.webp') center/cover no-repeat; clip-path:polygon(8% 0,100% 0,100% 97%,85% 100%,64% 97%,42% 100%,20% 96%,0 100%,3% 73%,0 51%,4% 27%,2% 8%); animation:inkReveal .72s ease both; }
.hero-visual::after { content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(243,235,221,.72) 0%,transparent 24%),linear-gradient(0deg,rgba(30,27,24,.14),transparent 35%);pointer-events:none; }
.ink-wash { position:absolute;inset:auto 0 0 0;height:80px;background:linear-gradient(0deg,var(--paper),transparent);z-index:1; }
.daily-card { position:absolute;z-index:2;left:6%;bottom:30px;width:390px;text-align:left;padding:20px 24px;background:rgba(251,248,241,.95);border:1px solid var(--clay);box-shadow:0 10px 30px rgba(41,31,22,.14);cursor:pointer;display:grid;gap:8px;color:var(--ink);transition:.18s; }
.daily-card:hover { transform:translateY(-5px); }.daily-card span{font-size:13px;color:var(--muted)}.daily-card span b{color:var(--cinnabar);font-size:15px}.daily-card strong{font-size:22px}.daily-card small{font-family:"Noto Sans KR",sans-serif;color:var(--muted)}
.discovery { position:absolute;z-index:4;left:50%;transform:translateX(-50%);bottom:58px;width:min(920px,calc(100% - 80px)); }
.search-box { height:64px;display:flex;align-items:center;background:rgba(251,248,241,.95);border:1px solid #b7aa98;border-radius:12px;box-shadow:0 6px 26px rgba(41,31,22,.07);padding:0 22px; }
.search-box>span { width:22px;height:22px;border:2px solid var(--charcoal);border-radius:50%;position:relative;margin-right:22px;flex:0 0 auto}.search-box>span::after{content:"";position:absolute;width:9px;height:2px;background:var(--charcoal);right:-7px;bottom:-3px;transform:rotate(45deg)}
.search-box input { flex:1;border:0;background:transparent;outline:0;font-size:17px;color:var(--ink); }.search-box input::placeholder{color:#91877c}.search-box button{border:0;background:transparent;font-size:23px;color:var(--muted);cursor:pointer}
.theme-row { display:flex;justify-content:center;gap:11px;margin-top:18px;overflow:auto;padding:3px;scrollbar-width:none; }.theme-row button{min-width:84px;border:1px solid var(--clay);border-radius:999px;background:rgba(243,235,221,.88);padding:9px 17px;color:var(--charcoal);cursor:pointer;transition:.15s;white-space:nowrap}.theme-row button:hover{background:var(--paper-deep)}.theme-row button.selected{background:var(--ink);color:var(--white-wash);border-color:var(--ink)}
.stories-section { max-width:1320px;margin:0 auto;padding:110px 44px 120px;border-top:1px solid rgba(30,27,24,.12); }
.section-heading { display:flex;justify-content:space-between;align-items:end;gap:50px;margin-bottom:45px; }.section-heading>div>p{margin:0 0 10px;color:var(--cinnabar);font-family:"Noto Sans KR",sans-serif;font-size:13px;letter-spacing:.12em}.section-heading h2{margin:0;font-size:42px;letter-spacing:-.04em}.result-copy{max-width:440px;color:var(--muted);line-height:1.75;font-size:14px;word-break:keep-all}
.story-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:22px}.story-card{min-height:310px;background:var(--white-wash);border:1px solid var(--clay);display:grid;grid-template-columns:42% 58%;box-shadow:0 8px 24px rgba(41,31,22,.06);overflow:hidden}.story-card.expanded{grid-column:1/-1;grid-template-columns:1fr}.story-image{position:relative;background:linear-gradient(145deg,#bcb29f,#676458);overflow:hidden;min-height:310px}.story-image>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:saturate(.92);transition:transform .45s}.story-image::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,17,13,.03),rgba(20,17,13,.3));transition:.5s}.story-card:hover .story-image>img{transform:scale(1.035)}.story-image span{position:absolute;z-index:1;left:14px;top:14px;max-width:calc(100% - 28px);background:rgba(251,248,241,.9);padding:5px 8px;font-size:10px;color:var(--muted)}.story-image b{position:absolute;z-index:1;right:12px;bottom:10px;color:white;font-size:30px;text-shadow:0 2px 9px #000}.story-image em{position:absolute;z-index:1;left:50%;top:50%;transform:translate(-50%,-50%);color:rgba(251,248,241,.8);font-size:13px;font-style:normal;letter-spacing:.12em;white-space:nowrap}
.story-body{padding:28px;display:flex;flex-direction:column;min-width:0}.story-meta{display:flex;justify-content:space-between;align-items:center;gap:15px}.story-meta span{color:var(--cinnabar);font-family:"Noto Sans KR",sans-serif;font-size:12px}.story-meta small{color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.story-body h3{font-size:25px;margin:20px 0 12px;letter-spacing:-.03em}.story-body>p{color:var(--charcoal);line-height:1.75;margin:0 0 20px;word-break:keep-all}.story-body>button{margin-top:auto;align-self:start;background:none;border:0;padding:0 0 4px;border-bottom:1px solid var(--clay);cursor:pointer;color:var(--ink)}.story-body>button span{margin-left:10px;color:var(--cinnabar)}.story-detail{border-top:1px solid var(--clay);margin-top:24px;padding-top:12px}.story-detail section{padding:18px 0;border-bottom:1px solid rgba(214,199,175,.65)}.story-detail section:last-child{border-bottom:0}.story-detail h4{margin:0 0 10px;color:var(--cinnabar);font-size:14px}.story-detail p{margin:6px 0;color:var(--charcoal);font-size:15px;line-height:1.9;word-break:keep-all;white-space:pre-wrap}.story-detail .author-note{border-left:3px solid var(--cinnabar);padding-left:18px}.story-detail-image{width:calc(100% + 56px);margin:28px -28px 42px;background:#201d18;border-block:1px solid var(--clay)}.story-detail-image img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:contain}.story-detail-placeholder{width:calc(100% + 56px);min-height:360px;margin:28px -28px 42px;display:grid;place-content:center;text-align:center;background:linear-gradient(145deg,#d7ccba,#918b7c);color:var(--white-wash)}.story-detail-placeholder span{font-size:58px;opacity:.55}.story-detail-placeholder p{color:inherit}.keyword-list{display:flex;flex-wrap:wrap;gap:8px}.keyword-list button{border:1px solid var(--clay);border-radius:999px;background:var(--paper);color:var(--charcoal);padding:6px 11px;cursor:pointer}.keyword-list button:hover{border-color:var(--cinnabar);color:var(--cinnabar)}.empty-state{grid-column:1/-1;padding:60px;text-align:center;border:1px dashed var(--clay);color:var(--muted)}.load-more{display:flex;align-items:center;gap:16px;margin:38px auto 0;padding:14px 28px;border:1px solid var(--ink);background:transparent;color:var(--ink);cursor:pointer}.load-more:hover{background:var(--ink);color:var(--paper)}.load-more span{font-size:12px;color:var(--muted)}
.permalink{display:inline-block;margin-top:22px;color:var(--cinnabar);text-decoration:none;border-bottom:1px solid rgba(163,58,43,.35);padding-bottom:4px}.permalink:hover{border-color:var(--cinnabar)}
.detail-loading{padding:22px 0;color:var(--muted);font-size:14px}
.about-section { max-width:1230px;margin:0 auto 110px;padding:75px;display:grid;grid-template-columns:120px 1fr 1fr;gap:55px;align-items:center;background:var(--paper-deep);border-top:1px solid var(--clay);border-bottom:1px solid var(--clay); }.seal{border:2px solid var(--cinnabar);color:var(--cinnabar);width:88px;height:88px;display:grid;place-items:center;font-size:26px;writing-mode:vertical-rl;margin:0}.about-section h2{font-size:34px;line-height:1.45;margin:0}.about-section>p:last-child{color:var(--charcoal);line-height:2;margin:0;word-break:keep-all}
footer { min-height:130px;padding:35px max(30px,calc((100vw - 1230px)/2));display:flex;align-items:center;gap:22px;background:var(--ink);color:var(--paper-deep)}footer span{font-weight:700}footer p{color:#a89d8e}footer a{margin-left:auto;color:var(--paper-deep);text-decoration:none}
.story-page{overflow:visible}.detail-header{position:sticky;top:0}.back-link{justify-self:end;color:var(--cinnabar);text-decoration:none;font-size:14px}.reading-article{max-width:900px;margin:0 auto;padding:92px 40px 70px}.reading-title{text-align:center;margin-bottom:54px}.reading-title>p:first-child{color:var(--cinnabar);font-family:"Noto Sans KR",sans-serif;font-size:13px;letter-spacing:.1em}.reading-title>p:first-child b{margin-left:10px}.reading-title h1{display:block;font-size:clamp(44px,6vw,72px);line-height:1.25;letter-spacing:-.055em;margin:25px 0}.reading-source{color:var(--muted);font-size:15px}.reading-figure{margin:0 0 65px}.reading-figure img{display:block;width:100%;aspect-ratio:3/2;object-fit:cover;border:1px solid var(--clay);box-shadow:0 16px 45px rgba(41,31,22,.13)}.reading-figure figcaption{padding:22px 26px;background:var(--paper-deep);color:var(--charcoal);line-height:1.8;border-bottom:1px solid var(--clay)}.reading-placeholder{height:390px;margin-bottom:65px;display:grid;place-content:center;text-align:center;background:linear-gradient(145deg,#d7ccba,#918b7c);color:var(--white-wash)}.reading-placeholder span{font-size:60px;opacity:.55}.reading-placeholder p{letter-spacing:.08em}.reading-article>section{margin:0 0 52px}.reading-article h2{font-size:18px;color:var(--cinnabar);margin:0 0 20px;padding-bottom:12px;border-bottom:1px solid var(--clay)}.reading-article section>p{font-size:18px;line-height:2.05;color:var(--charcoal);word-break:keep-all}.reading-note,.reading-message{padding:28px 32px;background:var(--paper-deep);border-left:3px solid var(--cinnabar)}.reading-note h2,.reading-message h2{border:0;padding:0}.reading-body p{margin:0 0 13px;white-space:pre-wrap}.reading-keywords{display:flex;flex-wrap:wrap;gap:9px}.reading-keywords a{padding:8px 14px;border:1px solid var(--clay);border-radius:999px;color:var(--charcoal);text-decoration:none;background:var(--white-wash)}.reading-keywords a:hover{border-color:var(--cinnabar);color:var(--cinnabar)}.people-classics{font-size:17px!important;color:var(--ink)!important}.related-section{max-width:1120px;margin:20px auto 75px;padding:58px;background:var(--paper-deep);border-block:1px solid var(--clay)}.related-section>p{margin:0;color:var(--cinnabar);font-size:13px}.related-section>h2{font-size:34px;margin:10px 0 32px}.related-section>div{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.related-section a{display:flex;flex-direction:column;gap:8px;padding:22px;background:var(--white-wash);border:1px solid var(--clay);color:var(--ink);text-decoration:none}.related-section a:hover{border-color:var(--cinnabar)}.related-section small{color:var(--muted)}.related-section strong{font-size:19px}.related-section span{color:var(--charcoal);font-size:13px;line-height:1.6}.story-pagination{max-width:900px;margin:0 auto 90px;display:grid;grid-template-columns:1fr 1fr;gap:30px}.story-pagination a{display:flex;flex-direction:column;gap:9px;color:var(--ink);text-decoration:none;border-top:1px solid var(--clay);padding-top:18px}.story-pagination a:last-child{text-align:right}.story-pagination small{color:var(--cinnabar)}
@keyframes rise{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}@keyframes inkReveal{from{opacity:0;clip-path:polygon(45% 0,45% 0,45% 100%,45% 100%)}to{opacity:1}}
@media(max-width:1020px){.site-header{grid-template-columns:1fr auto}.site-header nav{display:none}.hero{display:block;min-height:auto;padding:0 28px 220px}.hero-copy{padding:65px 20px 40px}.hero-visual{position:relative;width:100%;height:560px;top:auto}.discovery{bottom:55px}.story-grid{grid-template-columns:1fr}.about-section{grid-template-columns:100px 1fr}.about-section>p:last-child{grid-column:2}.hero-facts{margin-bottom:0}}
@media(max-width:680px){.site-header{height:64px;padding:0 20px}.series-mark{font-size:14px}.hero{padding:0 16px 235px}.hero-copy{padding:45px 4px 34px}.eyebrow{font-size:14px}h1{gap:12px}h1 span{font-size:62px}h1 em{font-size:34px}.hero-description{font-size:16px;line-height:1.85;margin:24px 0}.primary-button{width:100%}.hero-facts{gap:14px}.hero-facts div{padding-right:12px}.hero-facts strong{font-size:21px}.hero-facts span{font-size:9px}.hero-visual{height:400px;clip-path:none;background-position:62% center}.daily-card{width:calc(100% - 28px);left:14px;bottom:14px}.discovery{width:calc(100% - 32px);bottom:48px}.search-box{height:58px}.theme-row{justify-content:flex-start}.stories-section{padding:80px 18px}.section-heading{display:block}.section-heading h2{font-size:34px}.result-copy{margin-top:20px}.story-card,.story-card.expanded{grid-template-columns:1fr;}.story-image{min-height:230px}.about-section{margin:0 18px 80px;padding:35px 24px;display:block}.seal{margin-bottom:35px}.about-section h2{font-size:28px}.about-section>p:last-child{margin-top:28px}footer{padding:32px 20px;flex-wrap:wrap}footer a{width:100%;margin:0}.story-body{padding:24px}.story-detail-image,.story-detail-placeholder{width:calc(100% + 48px);margin-left:-24px;margin-right:-24px}.story-detail-placeholder{min-height:240px}}
@media(max-width:680px){.reading-article{padding:58px 20px 48px}.reading-title{margin-bottom:38px}.reading-title h1{font-size:42px}.reading-figure{margin-bottom:45px}.reading-figure figcaption{padding:18px}.reading-placeholder{height:270px}.reading-note,.reading-message{padding:22px}.reading-article section>p{font-size:16px;line-height:1.95}.related-section{margin:0 18px 55px;padding:35px 20px}.related-section>div{grid-template-columns:1fr}.story-pagination{margin:0 20px 65px;gap:18px}.story-pagination strong{font-size:14px}.back-link{font-size:12px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation:none!important;transition:none!important}}
.reading-body blockquote{margin:18px 0;padding:18px 22px;border-left:3px solid var(--cinnabar);background:rgba(231,221,203,.55);color:var(--charcoal);font-size:18px;line-height:1.95}.reading-body hr{border:0;border-top:1px solid var(--clay);margin:38px 0}.reading-body h3{margin:30px 0 16px;font-size:22px}.reading-body .body-space{height:8px}.reading-body .body-bullet{position:relative;padding-left:18px}.reading-body .body-bullet::before{content:"·";position:absolute;left:2px;color:var(--cinnabar)}

/* 다중 주제 탐색과 관련도순 검색 결과 */
.discovery{z-index:6}.theme-row{flex-wrap:wrap;overflow:visible;align-content:flex-start;padding-right:5px}.theme-row button{display:inline-flex;align-items:center;gap:5px;white-space:nowrap}.theme-row button small{font-family:"Noto Sans KR",sans-serif;font-size:10px;opacity:.62}.theme-row button.selected small{opacity:.8}
.search-results{margin-top:10px;background:rgba(251,248,241,.98);border:1px solid var(--clay);box-shadow:0 18px 48px rgba(41,31,22,.16);max-height:430px;overflow:auto}.search-results[hidden]{display:none}.search-results-head{position:sticky;top:0;z-index:2;display:flex;justify-content:space-between;gap:20px;padding:15px 18px;background:var(--paper-deep);border-bottom:1px solid var(--clay)}.search-results-head strong{color:var(--cinnabar)}.search-results-head span{font-family:"Noto Sans KR",sans-serif;color:var(--muted);font-size:11px}.search-results ol{list-style:none;padding:0;margin:0}.search-results li+li{border-top:1px solid rgba(214,199,175,.7)}.search-result{width:100%;display:grid;grid-template-columns:54px 1fr;gap:14px;text-align:left;border:0;background:transparent;padding:14px 18px;cursor:pointer}.search-result:hover,.search-result:focus-visible{background:#fff}.search-result>b{color:var(--cinnabar);font-size:14px;padding-top:3px}.search-result>span{display:grid;gap:4px}.search-result strong{font-size:16px}.search-result small{color:var(--charcoal);line-height:1.55}.search-result em{font-style:normal;color:var(--muted);font-family:"Noto Sans KR",sans-serif;font-size:10px}.search-no-result{margin:0;padding:28px;text-align:center;color:var(--muted)}
.card-topics{display:flex;gap:4px;flex-wrap:wrap;min-width:0}.topic-chip{display:inline-flex!important;align-items:center;border:1px solid rgba(163,58,43,.26)!important;border-radius:999px!important;background:rgba(163,58,43,.06)!important;color:var(--cinnabar)!important;padding:3px 7px!important;font:10px/1.3 "Noto Sans KR",sans-serif!important}.story-meta{align-items:flex-start}.story-meta small{padding-top:4px}.topic-links a{border-color:rgba(163,58,43,.4);background:rgba(163,58,43,.07);color:var(--cinnabar)}
@media(max-width:680px){.theme-row{max-height:260px;overflow:auto}.search-results{max-height:360px}.search-results-head{display:block}.search-results-head span{display:block;margin-top:4px}.search-result{grid-template-columns:42px 1fr;padding:13px 12px}.search-result small{font-size:12px}.card-topics .topic-chip:nth-child(n+4){display:none!important}}