:root{--ink:#202f29;--pine:#193d36;--paper:#fffdf8;--hair:#d9d1c0;--gold:#85633d;--serif:"Nanum Myeongjo","Batang","AppleMyungjo","Noto Serif CJK KR",serif}
body{font-family:"Assi Reading Sans",-apple-system,BlinkMacSystemFont,"Malgun Gothic",sans-serif;letter-spacing:-.012em}nav,main,footer{max-width:1060px}header{background:#faf7ef}nav{min-height:72px;gap:26px}nav a{font-size:15px}nav .brand{font-family:var(--serif);letter-spacing:-.045em;font-size:27px}nav .brand span{font-family:serif;border:1px solid #9d7851;color:#86613b;padding:1px 2px;line-height:1.1;letter-spacing:0}.skip{position:fixed;left:8px;top:-100px;z-index:3;background:white;padding:12px}.skip:focus{top:8px}
.hero{margin:24px 0 46px;background:var(--paper);color:var(--ink);border:1px solid var(--hair);border-radius:3px 26px 3px 3px;grid-template-columns:1.1fr 1fr}.hero img{max-height:520px;min-height:390px;object-position:50% 26%}.hero .intro{padding:clamp(23px,5vw,68px)}.hero h1{font-family:var(--serif);font-weight:600;line-height:1.28}.hero small{color:var(--gold)}.hero p{color:#3e5148;font-size:18px;max-width:26em}.hero .go,.go{background:#205548;color:white}.hero .go{margin-top:12px}.hero .quiet{color:var(--pine)}.go,.quiet{border-radius:6px}.grid{gap:16px}.card{color:var(--ink);border-radius:4px 15px 4px 4px}.card h3,.sheet h1,.sheet h2{font-family:var(--serif)}main>h2{margin-top:42px}.filters{margin:16px 0 22px}.card p{font-size:16px}.card strong,.edition strong{font-variant-numeric:tabular-nums}
.grid:has(>a.featured),.featured-grid,.recommended.grid{grid-template-columns:repeat(4,minmax(0,1fr))}.featured-grid .card,.grid .card.featured,.recommended .card{overflow:hidden;padding:0 16px 16px;border:1px solid var(--hair)}.featured-grid .card:before,.card.featured:before,.recommended .card:before{content:"";display:block;height:clamp(110px,13vw,155px);margin:0 -16px 14px;background:var(--cover) center/cover no-repeat}.card[href*="product/"]{--cover:url('art/almanac.webp')}.card[href$="/love"]{--cover:url('art/love.webp')}.card[href$="/reunion"]{--cover:url('art/reunion.webp')}.card[href$="/year"]{--cover:url('art/year.webp')}.sheet{padding:clamp(22px,5vw,48px);margin-top:18px}.sheet input,.sheet select{font-size:17px}.sheet button,.footnav a{min-height:44px}.footnav{display:flex;flex-wrap:wrap;column-gap:18px}.footnav a{display:inline-flex;align-items:center;font-size:14px}footer{padding-top:28px;padding-bottom:24px}footer strong{color:var(--pine);font:700 22px var(--serif)}footer p{margin:4px 0 8px}.letter-paper{border-radius:2px}.letter-paper p{letter-spacing:-.013em}
@media(hover:hover){.card:hover{border-color:#758b76;transform:translateY(-2px)}.card,.go{transition:transform .15s ease,border-color .15s}.go:hover{background:#163d34}}
@media(max-width:720px){.grid:has(>a.featured),.featured-grid,.recommended.grid{grid-template-columns:repeat(2,minmax(0,1fr))}.hero img{min-height:0}.hero{grid-template-columns:1fr;margin:15px 0 32px}.hero img{order:-1;max-height:none;height:clamp(240px,65vw,340px);object-position:50% 26%}.hero .intro{padding:21px}.hero .intro p{font-size:17px}.card.featured p,.featured-grid .card p{font-size:14px}.card.featured h3,.featured-grid .card h3{font-size:20px}nav{gap:13px;min-height:61px}nav a{font-size:14px}nav .brand{font-size:23px}.grid{gap:10px}}
@media(max-width:360px){nav{gap:8px}.featured-grid,.grid:has(>a.featured){grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important}.card:hover{transform:none}.card,.go{transition:none}}
@media print{.skip,header,footer{display:none}}
.recommended .grid{grid-template-columns:repeat(4,minmax(0,1fr))}
[data-edition="overview"]{--detail-cover:url('art/almanac.webp')}[data-edition="love"]{--detail-cover:url('art/love.webp')}[data-edition="reunion"]{--detail-cover:url('art/reunion.webp')}[data-edition="year"]{--detail-cover:url('art/year.webp')}
:is([data-edition="overview"],[data-edition="love"],[data-edition="reunion"],[data-edition="year"])[data-surface="product"] .sheet:before{content:"";display:block;height:clamp(144px,24vw,235px);margin-bottom:22px;background:var(--detail-cover) center center/cover no-repeat;border-radius:3px 18px 3px 3px}
@media(max-width:720px){.recommended .grid{grid-template-columns:repeat(2,minmax(0,1fr))}.recommended .card{padding:0 12px 13px}.recommended .card:before{margin:0 -12px 10px;height:115px}.recommended .card h3{font-size:20px}.recommended .card p{font-size:15px;margin-bottom:10px;line-height:1.55}}
@media(max-width:350px){.recommended .grid{grid-template-columns:1fr}}
.service-values{margin:38px 0;padding:26px 0;border-top:1px solid var(--hair);border-bottom:1px solid var(--hair)}.service-values h2{margin:0}.service-values p{max-width:44em;margin-bottom:0}.input-steps{display:flex;list-style:none;padding:0;gap:6px;counter-reset:step}.input-steps li{flex:1;font-size:14px;padding:7px 1px;color:#525e55;border-bottom:2px solid #d1d4c7;counter-increment:step}.input-steps li:before{content:counter(step) ' · '}.input-steps [aria-current]{font-weight:700;color:#193d36;border-color:#35634f}.catalog h2 small{font:500 15px "Assi Reading Sans",sans-serif}.sheet [hidden]{display:none!important}.sheet input[type=checkbox]{accent-color:#205548;width:19px;height:19px;vertical-align:middle}.sheet:has(#entry) label:has(input[type=checkbox]){min-height:44px;display:flex;align-items:center;gap:8px}.footnav a:hover{text-decoration:underline}
.letter-paper .birth-summary{color:#586256;font-size:14px;line-height:1.7;margin:-14px 0 22px}
/* Topic illustrations share the same crop across the catalog and the matching product. */
.card[href$="/life"]{--cover:url("art/life.webp")}.card[href$="/marriage"]{--cover:url("art/marriage.webp")}.card[href$="/money"]{--cover:url("art/money.webp")}.card[href$="/career"]{--cover:url("art/career.webp")}.card[href$="/health"]{--cover:url("art/health.webp")}.card[href$="/month"]{--cover:url("art/month.webp")}.card[href$="/contact"]{--cover:url("art/contact.webp")}.card[href$="/compatibility"]{--cover:url("art/compatibility.webp")}.card[href$="/dream"]{--cover:url("art/dream.webp")}.card[href$="/pet"]{--cover:url("art/pet.webp")}.card[href$="/luck"]{--cover:url("art/luck.webp")}.card[href$="/charm"]{--cover:url("art/charm.webp")}
.catalog .card{position:relative;padding-left:120px;min-height:156px}.catalog .card:before{content:"";position:absolute;left:16px;top:50%;transform:translateY(-50%);width:88px;height:108px;background:var(--cover) center/cover;border-radius:3px 10px 3px 3px}.catalog .card h3{margin:3px 0}.catalog .card p{margin:5px 0 8px;line-height:1.55}.catalog .card:hover:before{filter:brightness(1.02)}@media(max-width:390px){.catalog .card{padding:14px 10px 14px 102px}.catalog .card:before{left:12px;width:78px;height:102px}}
@media(min-width:721px){.hero{min-height:clamp(410px,40vw,510px)}.hero img{align-self:stretch;contain:size;height:100%;max-height:none;min-height:100%;width:100%}.hero .intro{padding:clamp(28px,4.2vw,48px)}.hero h1{font-size:clamp(36px,4.1vw,48px)}}
@media(prefers-reduced-motion:no-preference){[data-surface="home"] .hero{animation:ink-arrives .32s cubic-bezier(.18,.72,.23,1) both}@keyframes ink-arrives{from{opacity:.93;transform:translateY(3px)}to{opacity:1;transform:none}}}
::selection{color:#162a23;background:#d9e3ce}
.welcome{display:grid;grid-template-columns:1.05fr 1fr;align-items:center;background:#edf0e7;overflow:hidden;border-radius:3px 44px 3px 3px}.welcome-portrait img{display:block;width:100%;height:clamp(440px,46vw,620px);object-fit:cover;object-position:50% 32%}.welcome-copy{padding:clamp(25px,4vw,60px)}.welcome-copy h1{font:500 clamp(34px,4vw,55px)/1.25 var(--serif);color:#193d36;letter-spacing:-.065em;margin:0}.welcome-copy p{margin:20px 0 28px;color:#354d42;line-height:1.8}.welcome-copy small{display:block;margin-top:10px;font-size:14px}.theme-list{margin:1rem 0 2rem}.theme-row{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--hair);padding:16px 4px;text-decoration:none;font-weight:600;color:var(--pine)}.theme-row small{display:block;font-size:14px;font-weight:400}.selection-list article{display:grid;grid-template-columns:minmax(76px,22%) 1fr;gap:18px;border-top:1px solid var(--hair);padding:22px 0}.selection-list img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:3px}.selection-list h2{margin:0}.selection-list summary{cursor:pointer;padding:10px 0}.selection-list .quiet{margin-top:10px}body[data-surface=home] nav>a[href="#shelf"]{display:none}@media(max-width:700px){.welcome{grid-template-columns:1fr;border-radius:3px 29px 3px 3px}.welcome-portrait img{height:clamp(225px,35svh,360px);object-position:50% 28%}.welcome-copy{padding:24px 20px 28px}.welcome-copy h1{font-size:clamp(32px,8vw,43px)}.welcome-copy p{margin:12px 0 19px}.welcome-copy .go{width:100%}}
.contact-volume{display:grid;grid-template-columns:clamp(90px,27%,145px) 1fr;align-items:center;gap:22px;padding:0 0 23px;border-bottom:1px solid var(--hair)}.contact-volume img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:3px 16px 3px 3px}.contact-volume h1{margin:5px 0 8px;color:var(--pine)}.contact-volume strong{font-size:22px;font-variant-numeric:tabular-nums}.contact-topics{margin-top:0}.contact-topics .theme-row{padding:13px 2px}.contact-topics .theme-row:hover{color:var(--ink);background:#f0f1e7}[data-edition=contact] .base-reading{border-left:2px solid #99af9e;padding-left:18px;max-width:42em}[data-edition=contact] .base-reading p{font-size:17px;line-height:1.8}[data-edition=contact] .letter-paper p{max-width:38em;word-break:keep-all;overflow-wrap:anywhere}[data-surface=checkout] form textarea{min-height:88px;line-height:1.6}
/* Moonlit landing from the approved November portrait. The text and controls are live HTML. */
body[data-surface="home"]{background:#071a1e}
[data-surface="home"]>header{background:radial-gradient(ellipse at 62% 120%,#233735,transparent 42%),#091c20;border-bottom:1px solid #b49868}
[data-surface="home"]>header nav{max-width:650px;min-height:clamp(52px,7vh,72px);padding-inline:22px}
[data-surface="home"] nav .brand{color:#dfb77c;font-weight:500}
[data-surface="home"] nav .brand span{color:#e4c58c;border-color:#b99861}
#user-nav{display:inline-flex;align-items:center;min-height:44px}
[data-surface="home"] #user-nav{color:#f7eedb}
[data-surface="home"] main{max-width:650px;padding:0;margin:0 auto}
.moon-welcome{position:relative;isolation:isolate;overflow:hidden;background:#071b1f;color:#f3e6cb;text-align:center;container-type:inline-size}
.moon-portrait{width:100%;aspect-ratio:1024/630;background:url('art/moon-welcome.webp') center 10.38% / 100% auto no-repeat;mask-image:linear-gradient(#000 87%,transparent)}
.moon-message{position:relative;padding:0 6.5% clamp(44px,11cqw,74px);background:radial-gradient(ellipse at 50% 80%,#10303555,transparent 60%)}
.moon-welcome:after{content:"";position:absolute;pointer-events:none;z-index:-1;bottom:0;left:0;width:100%;aspect-ratio:1024/137;background:url('art/moon-welcome.webp') center bottom /100% auto no-repeat;mask-image:linear-gradient(transparent,#000 48%)}
.moon-signature{font:600 clamp(14px,3.5cqw,21px)/1.35 var(--serif);color:#dfb675}
.moon-signature span{display:flex;align-items:center;justify-content:center;gap:8px;font-size:.82em;margin:4px 0 12px}
.moon-signature span:before,.moon-signature span:after{content:"";height:1px;width:44px;background:linear-gradient(90deg,transparent,#ad8956)}
.moon-signature span:after{transform:rotate(180deg)}
.moon-message h1{color:#f8ead2;font:500 clamp(31px,7.4cqw,48px)/1.25 var(--serif);letter-spacing:-.055em;margin:0}
.moon-message p{color:#d6d6be;line-height:1.65;font-size:clamp(16px,3.85cqw,22px);margin:14px 0 22px}
.moon-action{display:flex;align-items:center;justify-content:center;gap:.55em;position:relative;isolation:isolate;min-height:52px;padding:12px 8px;color:#fff1cf;background:linear-gradient(110deg,#be955d,#fff0ba,#be955d);clip-path:polygon(10px 0,calc(100% - 10px) 0,100% 10px,100% calc(100% - 10px),calc(100% - 10px) 100%,10px 100%,0 calc(100% - 10px),0 10px);font:600 clamp(16px,4.2cqw,25px)/1.4 var(--serif)}
.moon-action:before{content:"";position:absolute;z-index:-1;inset:1.5px;clip-path:inherit;background:radial-gradient(ellipse at center top,#205345,#0a322e 74%)}
.moon-action:focus-visible:before,.moon-action:hover:before{background:#285744}
.moon-message small{display:block;margin-top:13px;color:#c5c9b0;font-size:clamp(13px,3.4cqw,17px)}
[data-surface="home"]>footer{background:#f7f4eb;color:#203e32}
.preparing{position:relative;display:flex;align-items:flex-end;justify-content:center;min-height:min(76vh,760px);margin:-1px -16px 0;background:linear-gradient(to bottom,transparent 22%,rgba(12,38,33,.25) 48%,#102f29 85%),url('assi.webp') center 24%/cover no-repeat;color:#fffaf0;text-align:center;overflow:hidden}.preparing-copy{position:relative;width:100%;padding:36px 24px 64px}.preparing h1{color:inherit;font-size:clamp(27px,6vw,36px);line-height:1.35;margin:0 0 18px}.preparing p{color:#f1eee2;font-size:17px;line-height:1.75;margin:0}.preparing-line{width:106px;height:3px;margin:35px auto 0;background:#ffffff45;overflow:hidden}.preparing-line span{display:block;width:42%;height:100%;background:#e6c78c;animation:prepare-sweep 1.3s ease-in-out infinite alternate}@keyframes prepare-sweep{from{transform:translateX(0)}to{transform:translateX(138%)}}@media(prefers-reduced-motion:reduce){.preparing-line span{width:100%;animation:none}}@media(min-width:700px){.preparing{margin:0 auto;max-width:700px;min-height:680px}}
