/* Public storefront; admin styles stay in styles.css. */
:root { --ink:#302c27; --muted:#6b655c; --line:#e4ded4; --white:#fffcf7; --jade:#365b4c; }
body { background:#eee9e0; }
[hidden] { display:none !important; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, summary:focus-visible { outline:3px solid #39755c; outline-offset:3px; }
button:disabled { opacity:.55; cursor:not-allowed; }
.app-shell { width:min(100%,1080px); background:var(--white); box-shadow:none; padding-bottom:110px; overflow:clip; }
.topbar { background:#fffcf7; border-bottom:1px solid var(--line); min-height:88px; padding:12px 32px; }
.brand-sub { color:#71685a; }
.bottom-nav { width:min(100%,1080px); background:#fffcf7; padding-bottom:env(safe-area-inset-bottom); height:calc(84px + env(safe-area-inset-bottom)); }
.view:not([data-view="home"]):not([data-view="detail"]) { max-width:680px; margin-inline:auto; }
.banner-hero { aspect-ratio:auto; height:340px; background:#f2e6ce; }
.banner-hero .banner-copy { left:48px; width:52%; }
.banner-hero .banner-copy p { font-size:16px; color:#68553d; margin-bottom:12px; }
.banner-hero .banner-copy h2 { font-size:42px; line-height:1.3; margin-bottom:24px; }
.banner-hero .banner-figure { width:53%; object-fit:cover; object-position:center 35%; }
.banner-hero .banner-button { min-height:44px; box-shadow:none; font-size:15px; }
.carousel-dots { bottom:18px; }
.carousel-dots button { min-width:28px; min-height:16px; background:#b2a18a; }
.carousel-dots button.is-active { background:#57452f; }
.eyebrow { color:#776248; font-size:12px; font-weight:700; letter-spacing:.07em; margin:0 0 12px; }
.first-visit { display:flex; justify-content:space-between; align-items:center; gap:24px; padding:32px; border-bottom:1px solid var(--line); }
.first-visit h1 { font-family:'Gowun Batang',serif; font-size:26px; margin:0 0 10px; }
.first-visit p:last-child { color:var(--muted); margin:0; font-size:15px; }
.first-actions { display:grid; gap:8px; min-width:255px; }
.first-actions button { padding:12px 16px; background:transparent; border:1px solid #c6b8a4; border-radius:4px; text-align:left; color:var(--ink); min-height:48px; }
.first-actions span { float:right; margin-left:12px; }
.catalog-heading { padding:36px 32px 0; }
.catalog-heading h2 { margin:0 0 8px; font-size:23px; }
.catalog-heading p { margin:0; font-size:15px; color:var(--muted); }
.price-status { margin:16px 32px; padding:12px; border:1px solid #d3c7b2; border-radius:4px; background:#f5eddd; font-size:14px; }
.filters { padding:20px 32px; justify-content:flex-start; gap:8px; }
.filters button { min-height:44px; padding:8px 16px; font-size:14px; }
.product-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:28px 22px; padding:0 32px 36px; border:0; }
.product-card,.product-card:nth-child(2n) { display:flex; flex-direction:column; border:1px solid var(--line); background:#fffdfa; border-radius:6px; overflow:hidden; }
.product-card.is-hidden { display:none; }
.product-image { aspect-ratio:4/3; flex:none; }
.product-image img { object-position:center 35%; }
.product-image::after { background:linear-gradient(transparent 60%,rgba(49,34,18,.35)); }
.product-image span { font-size:28px; }
.product-copy { flex:1; display:flex; flex-direction:column; padding:16px; }
.product-copy h2 { font-size:19px; line-height:1.4; margin:0 0 6px; }
.product-title { padding:0; min-height:44px; text-align:left; font-weight:700; background:none; border:0; color:var(--ink); }
.product-copy p { font-size:15px; line-height:1.65; min-height:0; margin:0 0 20px; }
.product-copy footer { flex-direction:column; align-items:stretch; margin-top:auto; gap:12px; }
.product-copy footer strong { color:#493c2c; font-size:18px; line-height:1.5; }
.product-copy footer button { box-shadow:none; border-radius:4px; min-height:44px; font-size:14px; }
.home-story { margin:0; border:0; border-top:1px solid var(--line); border-radius:0; padding:36px 32px; background:#f5f0e7; }
.home-story h2 { font-family:'Gowun Batang',serif; font-size:27px; }
.home-story p { font-size:15px; line-height:1.7; }
.reading-steps { display:grid; grid-template-columns:repeat(4,1fr); list-style:none; padding:0; gap:20px; margin:28px 0; }
.reading-steps li { border-top:1px solid #c7b9a5; padding-top:14px; }
.reading-steps b { display:block; color:#8d795c; margin-bottom:10px; }
.reading-steps span { font-size:15px; line-height:1.6; }
.text-link { background:none; border:0; border-bottom:1px solid #83745e; color:#5b4831; min-height:44px; padding:6px 0; }
.detail-breadcrumb { display:flex; justify-content:space-between; align-items:center; padding:18px 32px; border-bottom:1px solid var(--line); color:var(--muted); font-size:13px; }
.detail-breadcrumb button { background:none; border:0; color:var(--ink); min-height:44px; padding:0; }
.detail-overview { display:grid; grid-template-columns:1fr 1fr; gap:36px; padding:32px; align-items:center; }
.detail-character { width:100%; aspect-ratio:1; object-fit:cover; border-radius:6px; }
.detail-intro h1 { font-family:'Gowun Batang',serif; font-size:34px; margin:0 0 18px; line-height:1.35; }
.detail-intro p { font-size:15px; line-height:1.8; color:var(--muted); }
.detail-intro .eyebrow { font-size:12px; color:#776248; }
.detail-intro .detail-question { font-size:20px; font-weight:700; color:var(--ink); line-height:1.6; }
.detail-price { display:block; font-size:28px; margin:20px 0 12px; color:#513f2b; }
.detail-method { font-size:13px !important; }
.primary-action { background:#365b4c; box-shadow:none; min-height:48px; border-radius:5px; }
.secondary-action { min-height:44px; }
.sample-jump { display:block; padding:15px 0; font-size:14px; color:#5d4b34; text-underline-offset:4px; }
.detail-content { max-width:850px; margin:auto; padding:0 32px 40px; }
.detail-section { padding:36px 0; border-top:1px solid var(--line); scroll-margin-top:110px; }
.detail-section h2 { font-size:25px; font-family:'Gowun Batang',serif; margin:0 0 20px; line-height:1.5; }
.detail-section p { font-size:16px; line-height:1.8; }
.detail-topics { padding-left:24px; columns:2; column-gap:32px; }
.detail-topics li { padding:10px 8px; font-size:16px; line-height:1.5; break-inside:avoid; }
.sample-disclosure,.sample-input { color:var(--muted); font-size:14px !important; }
.sample-pages { display:grid; gap:20px; }
.sample-page { padding:30px; border:1px solid #ded5c6; background:#f8f3e9; border-radius:4px; }
.sample-page h3 { font-family:'Gowun Batang',serif; font-size:23px; line-height:1.6; margin:14px 0 20px; }
.sample-page p { color:#49433a; line-height:1.9; }
.delivery-info { margin:20px 0; }
.delivery-info div { display:grid; grid-template-columns:100px 1fr; gap:16px; padding:18px 0; border-bottom:1px solid var(--line); font-size:15px; line-height:1.7; }
.delivery-info dt { font-weight:700; }
.delivery-info dd { margin:0; color:var(--muted); }
.detail-section details { border-bottom:1px solid var(--line); padding:16px 0; }
.detail-section summary { cursor:pointer; min-height:44px; line-height:1.6; display:list-item; }
.fortune-first { padding:16px; background:#f5f0e7; line-height:1.8; font-size:16px; }
.hint-box,.recap-note { font-size:14px; line-height:1.7; }
.segmented button { min-height:44px; }
.site-footer { padding-inline:32px; }
@media (max-width:767px) {
 .topbar { padding:10px 16px; min-height:82px; }
 .banner-hero { height:225px; }
 .banner-hero .banner-copy { left:20px; width:59%; }
 .banner-hero .banner-copy h2 { font-size:27px; margin-bottom:16px; }
 .banner-hero .banner-copy p { font-size:12px; max-width:160px; }
 .banner-hero .banner-figure { width:60%; }
 .first-visit { display:block; padding:24px 18px; }
 .first-visit h1 { font-size:24px; }
 .first-actions { margin-top:20px; grid-template-columns:1fr 1fr; min-width:0; }
 .first-actions button { font-size:14px; line-height:1.5; padding:12px; }
 .first-actions span { display:none; }
 .catalog-heading { padding:28px 18px 0; }
 .catalog-heading h2 { font-size:21px; }
 .catalog-heading p { font-size:14px; line-height:1.6; }
 .filters { padding:16px 18px; flex-wrap:wrap; gap:6px; }
 .filters button { padding:8px 12px; }
 .product-grid { grid-template-columns:repeat(2,minmax(0,1fr)); padding:0 16px 28px; gap:16px 12px; }
 .product-image { aspect-ratio:1; }
 .product-image span { font-size:24px; }
 .product-copy { padding:12px; }
 .product-copy h2 { font-size:17px; }
 .product-copy p { font-size:15px; line-height:1.6; margin-bottom:16px; }
 .product-copy footer strong { font-size:16px; }
 .home-story { padding:28px 18px; }
 .home-story h2 { font-size:24px; }
 .reading-steps { grid-template-columns:1fr 1fr; }
 .detail-breadcrumb { padding:10px 18px; }
 .detail-overview { grid-template-columns:1fr; gap:24px; padding:18px; }
 .detail-character { max-height:340px; object-position:center 32%; }
 .detail-intro h1 { font-size:30px; }
 .detail-content { padding:0 18px 28px; }
 .detail-topics { columns:1; }
 .detail-section { padding:28px 0; }
 .sample-page { padding:20px; }
 .delivery-info div { grid-template-columns:80px 1fr; gap:12px; }
 .price-status { margin:16px 18px; }
}
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto !important; transition:none !important; } }
