@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@400;500;600;700;800;900&display=swap');
:root{--paper:#faf8f2;--ink:#38281e;--muted:#8a7d70;--line:#ded8cd;--orange:#db7040;--cream:#efe9dc}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:80px}body{margin:0;background:var(--paper);color:var(--ink);font-family:'Noto Sans KR',sans-serif;word-break:keep-all}a{color:inherit;text-decoration:none}button,input{font:inherit}a,button{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible,input:focus-visible{outline:3px solid var(--orange);outline-offset:5px}button{cursor:pointer}.wrap{width:min(1120px,calc(100% - 64px));margin:auto}.preview-note{height:31px;background:var(--ink);color:#f6ebdc;text-align:center;font-size:10px;letter-spacing:1.8px;display:flex;gap:15px;align-items:center;justify-content:center}.preview-note span{letter-spacing:0;color:#d5c5b5}.preview-note a{letter-spacing:0;border-bottom:1px solid #9b8775}.header{height:108px;display:flex;justify-content:space-between;align-items:center}.brand{display:flex;align-items:center;gap:9px;font-weight:900;font-size:27px;letter-spacing:-1.2px}.brand img{width:51px;height:51px;object-fit:contain}.brand-accent{color:#a66438}.brand small{display:block;font-size:10px;letter-spacing:2.7px;font-weight:500;margin-top:2px}.subscribe-link{font-size:13px;border:1px solid var(--ink);border-radius:7px;padding:12px 17px;font-weight:700}.subscribe-link span{margin-left:18px}.nav{border-top:1px solid var(--line);border-bottom:1px solid var(--ink)}.nav-inner{display:flex;gap:36px;align-items:center;height:54px;font-size:14px;font-weight:700}.nav a{height:100%;display:flex;align-items:center;position:relative}.nav .active:not(.bite-button):after{content:'';position:absolute;height:3px;background:var(--orange);bottom:-1px;left:0;right:0}.nav .search-link{margin-left:auto;gap:14px}.search-link span{font-size:25px}.intro{display:flex;justify-content:space-between;align-items:center;padding:42px 0 32px;min-height:270px}.eyebrow,.small-label{font-size:10px;font-weight:800;letter-spacing:1.7px;color:var(--orange)}.intro h1{font-size:43px;line-height:1.32;letter-spacing:-2px;margin:12px 0}.orange{color:var(--orange)}.intro-copy{font-size:14px;color:#786958;margin:14px 0 0}.intro-art{position:relative;width:265px;height:205px;margin-right:35px}.intro-art img{position:absolute;width:280px;height:280px;object-fit:contain;right:-25px;top:-33px;transform:rotate(5deg)}.stamp{position:absolute;z-index:1;left:-28px;top:12px;border:1px solid #b89062;border-radius:50%;width:83px;height:83px;display:flex;flex-direction:column;justify-content:center;align-items:center;font-size:10px;letter-spacing:1px;color:#96693e;transform:rotate(-15deg)}.stamp b{font-size:17px}.section-heading{display:flex;align-items:flex-end;justify-content:space-between;border-bottom:2px solid var(--ink);padding-bottom:17px;margin-bottom:24px}.section-heading h2{font-size:24px;letter-spacing:-1px;margin:0}.small-label{display:block;margin-bottom:7px}.section-heading>a,.section-heading>span{font-size:12px;color:#786958}.section-heading>a span{margin-left:10px}.featured{display:grid;grid-template-columns:1.3fr 1fr;gap:30px}.lead img{width:100%;height:292px;object-fit:cover;border-radius:9px;background:var(--cream)}.category{font-size:11px;display:inline-block;color:#a25c31;font-weight:800;margin:13px 0 8px}.lead h3{font-size:25px;line-height:1.45;letter-spacing:-1px;margin:0 0 10px}.lead p{font-size:13px;line-height:1.8;color:#796e61;margin:0 0 13px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.date{font-size:10px;color:var(--muted)}.side-list{display:flex;flex-direction:column}.side-card{display:grid;grid-template-columns:1fr 132px;gap:20px;padding:18px 0;border-bottom:1px solid var(--line);flex:1;align-items:center}.side-card:first-child{padding-top:0}.side-card:last-child{border-bottom:0}.side-card img{width:132px;height:105px;object-fit:cover;border-radius:7px;background:var(--cream)}.side-card .category{margin-top:0}.side-card h3{font-size:16px;line-height:1.5;margin:0 0 10px;letter-spacing:-.5px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.latest{margin-top:64px}.filters{display:flex;gap:8px;margin-bottom:25px}.filters button{border:1px solid var(--line);background:transparent;border-radius:30px;padding:8px 18px;color:#7a6d60;font-size:12px}.filters .selected{background:var(--ink);color:white;border-color:var(--ink)}.news-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:34px 24px}.card img{width:100%;aspect-ratio:1.65;object-fit:cover;border-radius:8px;background:var(--cream)}.card h3{font-size:18px;line-height:1.55;letter-spacing:-.6px;margin:0 0 12px}.card p{font-size:12px;line-height:1.8;color:#796e61;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin:0 0 12px}.lead:hover h3,.side-card:hover h3,.card:hover h3{text-decoration:underline;text-decoration-color:#b69a7e;text-underline-offset:4px}.pick{margin-top:65px;padding:36px 45px;background:#f2e3cc;border:1px solid #d8c4a6;border-radius:12px;display:flex;align-items:center;justify-content:space-between;overflow:hidden}.pick h2{font-size:28px;margin:8px 0 14px;letter-spacing:-1px}.pick p{font-size:17px;font-weight:600;max-width:620px;line-height:1.7;margin-bottom:25px}.dark-button{display:inline-flex;background:var(--ink);color:#fff8ed;border-radius:6px;padding:13px 20px;font-size:12px;font-weight:600;gap:35px}.pick-art{position:relative;width:220px;min-width:220px;height:190px}.pick-art img{width:250px;position:absolute;top:-26px;left:-10px}.bubble{position:absolute;z-index:1;background:var(--paper);border:1px solid var(--ink);border-radius:10px;padding:8px 12px;font-size:12px;font-weight:700}.yes{left:-5px;top:20px;transform:rotate(-9deg)}.no{right:-10px;bottom:35px;transform:rotate(9deg)}.archive{margin-top:55px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:25px 0;display:flex;align-items:center;justify-content:space-between;gap:25px}.archive h2{margin:0;font-size:21px}.archive form{display:flex;align-items:center;gap:12px}.archive label{font-size:12px;color:var(--muted)}.archive input{border:1px solid var(--line);border-radius:5px;background:transparent;padding:10px;font-size:12px;color:var(--ink)}.archive button{border:0;background:var(--cream);padding:12px;border-radius:5px;font-size:12px}.archive>a{font-size:12px;text-decoration:underline;text-underline-offset:5px}.subscribe{position:relative;padding:54px 30px;text-align:center;overflow:hidden}.subscribe h2{font-size:29px;letter-spacing:-1px;margin:12px 0}.subscribe p{font-size:13px;color:#796e61;margin:0 0 22px}.subscribe-doodle{position:absolute;right:75px;top:65px;font-size:85px;color:#d6bea0;transform:rotate(15deg);z-index:-1}footer{border-top:1px solid var(--ink);padding:32px 0 40px;display:flex;justify-content:space-between;align-items:center}footer strong{font-size:21px;letter-spacing:-.8px}footer p{font-size:11px;color:var(--muted);margin-top:10px}.footer-right{text-align:right;font-size:11px}.footer-right a{margin-left:22px}.footer-right small{display:block;margin-top:18px;color:var(--muted)}.loading{padding:35px 0;color:var(--muted);grid-column:1/-1;font-size:14px}
/* Long source URLs must not enlarge the news grid's columns. */
.featured > *, .news-grid > *, .side-card > div { min-width:0; }
.lead, .side-card, .card { overflow-wrap:anywhere; }

@media(min-width:1400px){.intro{padding-top:48px;padding-bottom:40px}}
@media(max-width:800px){.wrap{width:calc(100% - 36px)}.header{height:90px}.brand{font-size:23px}.brand img{width:42px;height:42px}.brand small{font-size:8px;letter-spacing:2px}.subscribe-link{font-size:11px;padding:10px}.subscribe-link span{margin-left:5px}.nav-inner{gap:24px;font-size:12px}.intro h1{font-size:35px}.intro-art{width:190px;margin-right:0}.intro-art img{width:240px;height:240px;right:-20px;top:0}.stamp{left:-10px;width:65px;height:65px;font-size:8px}.featured{grid-template-columns:1fr;gap:22px}.lead img{height:auto;aspect-ratio:1.9}.side-card{grid-template-columns:1fr 120px}.side-card img{width:120px;height:85px}.news-grid{grid-template-columns:repeat(2,1fr)}.archive{flex-wrap:wrap}.archive form{margin-left:auto}.archive>a{margin-left:auto}.pick{padding:28px}.pick-art{min-width:170px;width:170px}.pick-art img{width:210px}.no{right:-18px}.subscribe-doodle{right:0}}
@media(max-width:480px){.preview-note{font-size:8px;gap:10px}.preview-note span{font-size:9px}.nav-inner{gap:0;justify-content:space-between}.nav .search-link{margin-left:0;gap:5px}.intro{padding:28px 0;min-height:220px;position:relative}.intro h1{font-size:31px;position:relative;z-index:1;letter-spacing:-1.5px}.eyebrow{font-size:8px;letter-spacing:1px}.intro-copy{font-size:11px;max-width:240px;line-height:1.8;position:relative;z-index:1}.intro-art{position:absolute;right:-15px;top:40px;width:140px;height:160px;opacity:.95}.intro-art img{width:185px;height:185px;right:-17px;top:-5px}.stamp{display:none}.section-heading{padding-bottom:13px;margin-bottom:18px}.section-heading h2{font-size:21px}.section-heading>span{font-size:10px}.small-label{font-size:8px}.lead h3{font-size:22px}.latest{margin-top:40px}.filters{gap:6px}.filters button{padding:8px 14px;font-size:11px}.news-grid{gap:27px 15px}.card h3{font-size:15px}.card p{display:none}.card .category{font-size:10px}.pick{margin-top:40px;position:relative;padding:26px 22px}.pick>div:first-child{position:relative;z-index:2}.pick h2{font-size:23px}.pick p{max-width:230px;font-size:15px;margin-bottom:20px}.pick-art{position:absolute;right:-40px;bottom:-14px;opacity:.6}.bubble{display:none}.archive{margin-top:32px;gap:20px}.archive form{width:100%;margin:0;gap:8px}.archive input{flex:1;min-width:0}.archive>a{margin-left:0}.subscribe{padding:40px 0}.subscribe h2{font-size:23px}.subscribe p{font-size:12px}.subscribe-doodle{display:none}footer{align-items:flex-start;gap:20px}footer strong{font-size:17px}footer p{max-width:210px;font-size:10px;line-height:1.8}.footer-right{min-width:95px}.footer-right a{display:block;margin:0 0 10px}.footer-right small{font-size:9px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
@media(max-width:480px){.intro{overflow:hidden}.intro-art{right:0}.intro-art img{right:0;width:160px;height:160px}.brand{font-size:21px}.featured>*{min-width:0}.news-grid>*{min-width:0}}

/* 원본 이미지의 투명 여백은 표시 영역에서만 잘라냅니다. */
.header .brand { display: block; flex: 0 1 auto; }
.header .brand img { display: block; width: 280px; max-width: 100%; height: auto; }
.character-frame { display: block; position: relative; width: 160px; aspect-ratio: 499 / 628; overflow: hidden; }
.intro-art .character-frame { position: absolute; right: 10px; top: 0; transform: rotate(4deg); }
.pick-art .character-frame { position: absolute; width: 150px; right: 20px; top: 0; }
.character-frame img { position: absolute; width: 207.02%; height: auto; max-width: none; left: -49.7%; top: -32.64%; right: auto; transform: none; }
@media(max-width:800px) {
 .header .brand img { width: 240px; }
 .intro-art .character-frame { width: 145px; right: 0; top: 12px; }
 .pick-art .character-frame { width: 140px; right: 5px; }
}
@media(max-width:480px) {
 .header { gap: 12px; }
 .header .brand img { width: 210px; }
 .subscribe-link { flex-shrink: 0; padding: 9px; font-size: 10px; }
 .intro-art { width: 85px; top: 58px; right: 0; }
 .intro-art .character-frame { width: 78px; top: 0; right: 0; }
 .intro h1 { max-width: calc(100% - 85px); font-size: 28px; }
 .intro-copy { max-width: calc(100% - 85px); }
 .pick-art { right: -15px; bottom: 0; }
}

.home-subscribe-form { display:flex; gap:8px; justify-content:center; max-width:510px; margin:0 auto; }
.home-subscribe-form input { flex:1; min-width:0; border:1px solid var(--line); border-radius:6px; background:#fffdf8; padding:13px 15px; font-size:13px; }
.home-subscribe-form button { border:0; white-space:nowrap; cursor:pointer; }
.home-subscribe-form button:disabled { opacity:.6; cursor:wait; }
.subscribe #subscribeStatus { margin:16px 0 0; min-height:20px; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
#installAppBtn { border:1px solid var(--line); background:transparent; border-radius:6px; padding:10px 16px; margin-top:12px; }
@media(max-width:480px) { .home-subscribe-form{flex-direction:column}.home-subscribe-form button{justify-content:center}.footer-right a{margin-bottom:12px} }

/* Quiet movement and warm glass surfaces for the homepage. */
.icon { width:18px; height:18px; flex:none; vertical-align:middle; }
.subscribe-link,.section-heading>a,.archive>a,.archive button,.dark-button { display:inline-flex; align-items:center; gap:10px; }
.icon-arrow { transition:transform .22s ease; }
a:hover>.icon-arrow,button:hover>.icon-arrow,a:focus-visible>.icon-arrow,button:focus-visible>.icon-arrow { transform:translateX(3px); }
.subscribe-link,.filters button,.dark-button,.archive button { transition:background .22s ease,box-shadow .22s ease,transform .22s ease; }
.subscribe-link { border-color:#cbbba9; background:#fffcf680; }
.subscribe-link:hover { background:#fffaf0; box-shadow:0 4px 14px #38281e0a; }
.dark-button:hover { background:#513a2a; }
.filters button:hover:not(.selected) { background:var(--cream); }
.nav { background:#faf8f2eb; }
.intro { position:relative; isolation:isolate; }
.intro::before { content:''; position:absolute; z-index:-1; pointer-events:none; inset:0; background:radial-gradient(ellipse at 82% 48%,#edc99e40,transparent 48%); }
.stamp { background:#fffaf085; box-shadow:inset 0 1px 0 #ffffffb3,0 6px 24px #67452108; }
.typewriter { display:inline-grid; position:relative; white-space:nowrap; }
.typing-reserve,.typing-text { grid-area:1/1; }
.typing-reserve { visibility:hidden; }
.typing-text { justify-self:start; }
.typing-text.is-typing::after { content:''; display:inline-block; width:2px; height:.8em; margin-left:4px; background:var(--orange); animation:cursor-blink .7s steps(1) infinite; }
.subscribe { margin:36px 0; border:1px solid #e5dbce; border-radius:18px; background:radial-gradient(ellipse at 90% 10%,#edc99e50,transparent 55%),linear-gradient(125deg,#ffffffb3,#f6ecdd99); box-shadow:inset 0 1px 0 #fff,0 10px 32px #38281e04; isolation:isolate; }
.subscribe-doodle { opacity:.55; }
@supports ((backdrop-filter:blur(12px)) or (-webkit-backdrop-filter:blur(12px))) {
 .nav,.stamp,.subscribe { -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px); }
 .nav { background:#faf8f2b8; }
}
@keyframes cursor-blink { 50% { opacity:0; } }
@keyframes soft-arrival { from { opacity:0; transform:translateY(10px); } to { opacity:1; transform:translateY(0); } }
@keyframes coffee-float { 0%,100% { transform:translateY(0) rotate(4deg); } 50% { transform:translateY(-5px) rotate(3deg); } }
@media(prefers-reduced-motion:no-preference) {
 .intro>div:first-child { animation:soft-arrival .65s ease both; }
 .intro-art .character-frame { animation:coffee-float 4s ease-in-out 2; }
 .card { animation:soft-arrival .45s ease both; }
 .card:nth-child(2) { animation-delay:.04s; }
 .card:nth-child(3) { animation-delay:.08s; }
 .card:nth-child(n+4) { animation-delay:.12s; }
 .card img,.lead img { transition:transform .3s ease,box-shadow .3s ease; }
}
@media(hover:hover) and (prefers-reduced-motion:no-preference) {
 .card:hover img,.lead:hover img { transform:translateY(-3px); box-shadow:0 8px 20px #38281e12; }
}
@media(max-width:480px) {
 .subscribe { padding:32px 18px; margin:28px 0; }
 .subscribe h2 { font-size:22px; }
 .subscribe-link { gap:6px; }
 .icon { width:16px; height:16px; }
}
@media(prefers-reduced-motion:reduce) {
 .icon-arrow,.subscribe-link,.filters button,.dark-button,.archive button { transition:none; }
 a:hover>.icon-arrow,button:hover>.icon-arrow,a:focus-visible>.icon-arrow,button:focus-visible>.icon-arrow { transform:none; }
 .typing-text.is-typing::after { display:none; }
}

/* Archive search belongs to the news list. */
.news-heading-actions { display:flex; align-items:center; gap:22px; font-size:12px; }
.news-heading-actions a,.archive-toggle { display:inline-flex; align-items:center; gap:8px; }
.archive-toggle { padding:8px 0; border:0; background:transparent; color:var(--ink); font-size:13px; font-weight:600; }
.archive-toggle:hover,.archive-toggle[aria-expanded="true"] { color:#a25c31; }
.archive-panel { margin:-8px 0 24px; padding:20px; border:1px solid var(--line); border-radius:8px; background:#efe9dc66; }
.archive-panel[hidden],.archive-status[hidden],.archive-pagination[hidden] { display:none; }
.archive-panel form { display:flex; align-items:flex-end; gap:12px; }
.archive-query { flex:1; min-width:0; }
.archive-panel label { display:block; margin-bottom:8px; font-size:12px; font-weight:600; }
.archive-panel label span { color:var(--muted); font-weight:400; }
.archive-panel input { width:100%; min-width:0; min-height:44px; border:1px solid #cbbba9; border-radius:5px; padding:10px 12px; background:var(--paper); color:var(--ink); font-size:14px; }
.archive-date { width:180px; }
.archive-submit,.archive-reset,.archive-pagination button { min-height:44px; border:1px solid var(--line); border-radius:5px; padding:10px 18px; background:transparent; color:var(--ink); font-size:13px; }
.archive-submit { background:var(--ink); border-color:var(--ink); color:var(--paper); }
.archive-reset:hover,.archive-pagination button:hover:not(:disabled) { background:var(--cream); }
.archive-status { margin:0 0 20px; font-size:13px; color:#786958; }
.archive-pagination { display:flex; align-items:center; justify-content:center; gap:18px; margin-top:28px; font-size:12px; }
.archive-pagination button:disabled { opacity:.4; cursor:default; }
@media(max-width:600px) {
 .latest .section-heading { align-items:flex-start; flex-direction:column; gap:10px; }
 .news-heading-actions { width:100%; justify-content:space-between; gap:12px; }
 .archive-panel { padding:16px; }
 .archive-panel form { flex-wrap:wrap; gap:12px 8px; }
 .archive-query { flex-basis:100%; }
 .archive-date { flex:1; width:auto; min-width:0; }
 .archive-submit,.archive-reset { padding:10px 12px; }
}

/* A single closing surface lets the daily quote belong to the footer. */
.home-footer{display:block;background:#604b3c;color:#f7eddf;border:0;padding:34px 0 26px;margin-top:32px}
.home-footer .footer-identity{display:flex;flex-direction:column;gap:8px}
.home-footer .footer-meta{display:flex;flex-direction:column;align-items:flex-end;gap:12px}
.home-footer .footer-brand{font-size:20px;font-weight:800;letter-spacing:-.7px}
.home-footer .footer-brand span{color:#dfaa7b}
.home-footer .footer-note{font-size:13px;color:#e0d1c2}
.home-footer .footer-quote-area{padding:24px 0 48px;text-align:center}
.home-footer .footer-quote-label{display:block;font-size:13px;font-weight:600;letter-spacing:.4px;color:#f0cbaa}
.home-footer .footer-quote{max-width:30em;margin:16px auto 0;font-size:clamp(22px,2.6vw,30px);line-height:1.6;font-weight:500;letter-spacing:-.8px;color:#fff3e3;word-break:keep-all;overflow-wrap:break-word;text-wrap:balance}
.home-footer .footer-bottom{display:flex;justify-content:space-between;align-items:center;gap:24px;border-top:1px solid #8c7664;padding-top:22px}
.home-footer .footer-links{display:flex;flex-wrap:wrap;gap:8px 24px}
.home-footer .footer-links a{display:inline-flex;align-items:center;min-height:40px;font-size:13px;color:#e5d5c4}
.home-footer small{font-size:12px;color:#e0d1c2;white-space:nowrap}
.home-footer a:focus-visible{outline-color:#f0cbaa}
@media(hover:hover){.home-footer a:hover{color:#fff3e3;text-decoration:underline;text-underline-offset:4px}}
@media(max-width:600px){
 .home-footer{padding:28px 0 90px;margin-top:24px}
 .home-footer .wrap{width:calc(100% - 40px)}
 .home-footer .footer-meta{align-items:flex-start;gap:12px}
 .home-footer .footer-brand{font-size:19px}
 .home-footer .footer-note{font-size:12px}
 .home-footer .footer-quote-area{text-align:left;padding:8px 0 34px}
 .home-footer .footer-quote{margin:12px 0 0;font-size:23px;text-wrap:pretty}
 .home-footer .footer-bottom{align-items:flex-start;flex-direction:column;gap:16px;padding-top:18px}
 .home-footer .footer-links{gap:4px 20px}
 .home-footer .footer-links a{font-size:13px;min-height:40px}
}

.subscribe #subscribeStatus:empty { display:none; }
