:root{
  --bg:#f0efea;
  --ink:#000000;
  --accent:#1f5a21;
  --muted:#6e746d;
  --card:#fffdf8;
  --line:rgba(0,0,0,.12);
  --soft:#e6e1d7;
  --shadow:0 18px 50px rgba(31,42,30,.08);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:"Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  letter-spacing:.02em;
  transition:background .8s ease,color .8s ease;
}
body.dark{
  --bg:#090b09;
  --ink:#f0efea;
  --accent:#d7e8c5;
  --muted:#a1a79d;
  --card:#111611;
  --line:rgba(240,239,234,.18);
  --soft:#151c15;
  --shadow:0 18px 60px rgba(0,0,0,.48);
}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.wrapper{width:min(1120px,calc(100% - 40px));margin:auto}
.site-header{
  position:sticky;top:0;z-index:20;
  backdrop-filter:blur(16px);
  background:color-mix(in srgb,var(--bg) 86%,transparent);
  border-bottom:1px solid var(--line);
}
.header-inner{display:flex;align-items:center;gap:24px;min-height:76px}
.logo{font-family:Georgia,serif;font-size:24px;letter-spacing:.08em;font-weight:500;white-space:nowrap}
.nav{display:flex;gap:18px;margin-left:auto;font-size:13px;letter-spacing:.12em}
.nav a{opacity:.72}.nav a:hover,.nav a.active{opacity:1;color:var(--accent)}
.search-form{display:flex;align-items:center;gap:6px;margin-left:10px}
.search-form input{width:138px;border:1px solid var(--line);background:var(--card);border-radius:999px;padding:10px 13px;color:var(--ink);font-size:12px;outline:none}
.search-form button{border:1px solid var(--line);background:var(--accent);color:#fff;border-radius:999px;padding:10px 14px;font-size:12px;cursor:pointer}
body.dark .search-form button{color:#090b09}
.mobile-nav-note{display:none}
main{min-height:72vh}
.hero{padding:74px 0 56px}.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:54px;align-items:center}
.eyebrow{font-family:Georgia,serif;font-size:13px;color:var(--accent);letter-spacing:.18em;text-transform:uppercase;margin:0 0 18px}.hero h1{font-family:Georgia,"Yu Mincho",serif;font-size:clamp(38px,7vw,76px);line-height:1.04;margin:0 0 22px;font-weight:500;letter-spacing:.03em}.lead{font-size:16px;line-height:2.05;color:var(--muted);margin:0 0 28px}.button-row{display:flex;gap:12px;flex-wrap:wrap}.btn{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;padding:13px 22px;border:1px solid var(--accent);background:var(--accent);color:#fff;font-size:13px;letter-spacing:.08em}.btn.ghost{background:transparent;color:var(--accent)}body.dark .btn{color:#090b09}.hero-card{position:relative;padding:20px;border:1px solid var(--line);background:var(--card);box-shadow:var(--shadow)}.hero-card:before{content:"";position:absolute;inset:10px;border:1px solid var(--line);pointer-events:none}.features{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:22px 0 0}.feature{border:1px solid var(--line);background:var(--card);padding:14px;border-radius:18px;font-size:13px;color:var(--muted)}.feature b{display:block;color:var(--ink);font-size:15px;margin-bottom:4px}.section{padding:62px 0}.section-title{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:26px}.section-title h2{font-family:Georgia,"Yu Mincho",serif;font-weight:500;font-size:34px;margin:0}.section-title p{margin:0;color:var(--muted);line-height:1.8}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.card{position:relative;background:var(--card);border:1px solid var(--line);box-shadow:var(--shadow);border-radius:26px;overflow:hidden;transition:transform .25s ease,border-color .25s ease}.card:hover{transform:translateY(-3px);border-color:color-mix(in srgb,var(--accent) 42%,var(--line))}.card-body{padding:22px}.card h3{font-family:Georgia,"Yu Mincho",serif;font-weight:500;font-size:24px;margin:0 0 10px}.price{color:var(--accent);font-size:14px;margin-top:14px}.muted{color:var(--muted)}.two-col{display:grid;grid-template-columns:1fr 1fr;gap:24px}.panel{background:var(--card);border:1px solid var(--line);border-radius:30px;padding:26px;box-shadow:var(--shadow)}.panel h3{font-family:Georgia,"Yu Mincho",serif;font-size:27px;font-weight:500;margin:16px 0 12px}.panel p,.copy p{line-height:2;color:var(--muted)}.news{list-style:none;padding:0;margin:0}.news li{border-bottom:1px solid var(--line);padding:14px 0;color:var(--muted)}.news time{color:var(--accent);margin-right:16px;font-family:Georgia,serif}.sub-hero{padding:58px 0 34px;border-bottom:1px solid var(--line)}.sub-hero h1{font-family:Georgia,"Yu Mincho",serif;font-weight:500;font-size:52px;margin:0 0 16px}.sub-hero p{max-width:720px;line-height:2;color:var(--muted)}.order-intro{background:var(--card);border:1px solid var(--line);border-radius:28px;padding:24px;margin-bottom:24px;display:flex;justify-content:space-between;gap:20px;align-items:center}.order-intro h2{font-family:Georgia,"Yu Mincho",serif;font-weight:500;margin:0 0 10px}.order-intro p{margin:0;color:var(--muted);line-height:1.8}.search-result-banner{display:none;margin:24px 0;padding:16px 18px;background:var(--card);border:1px solid var(--line);border-radius:18px;color:var(--muted)}.search-result-banner.is-show{display:block}.order-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:14px}.order-card{background:var(--card);border:1px solid var(--line);border-radius:24px;overflow:hidden;box-shadow:var(--shadow);position:relative}.order-card a{display:block}.bottle-wrap,.person-wrap{aspect-ratio:1/1.05;background:linear-gradient(135deg,color-mix(in srgb,var(--soft) 78%,#fff),var(--card));position:relative;display:flex;align-items:center;justify-content:center;padding:14px;overflow:hidden}.person-wrap{display:none}.order-card .person-wrap img{filter:grayscale(1);opacity:.92}.order-card .birth{display:none;color:var(--accent);font-family:Georgia,serif;font-size:13px;margin-top:8px}.order-card .card-body{padding:16px}.order-card h3{font-size:17px;margin:0 0 6px}.order-card p{font-size:12px;line-height:1.7;margin:0;color:var(--muted)}.order-card.is-unknown .order-card.is-unknown .order-grid.memory-mode .order-card .order-grid:not(.memory-mode) .order-grid.dark-mode .bottle-wrap{display:none}.order-grid.dark-mode .person-wrap{display:flex}.order-grid.dark-mode .birth{display:block}.order-grid.dark-mode .order-card h3:after{content:" / preserved";font-family:Georgia,serif;font-size:10px;color:var(--muted)}.hidden-word{letter-spacing:.18em}.detail-layout{display:grid;grid-template-columns:.82fr 1.18fr;gap:34px;align-items:start}.product-photo{background:var(--card);border:1px solid var(--line);border-radius:30px;padding:24px;box-shadow:var(--shadow);position:sticky;top:104px}.detail-copy{background:var(--card);border:1px solid var(--line);border-radius:30px;padding:32px;box-shadow:var(--shadow)}.detail-copy h1{font-family:Georgia,"Yu Mincho",serif;font-weight:500;font-size:42px;margin:0 0 12px}.meta{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin:22px 0}.meta div{border:1px solid var(--line);border-radius:16px;padding:12px;color:var(--muted);font-size:13px}.note-list{margin:24px 0}.note-row{border-bottom:1px solid var(--line);padding:16px 0}.note-row button{all:unset;cursor:pointer;width:100%;display:flex;justify-content:space-between;align-items:center;font-family:Georgia,"Yu Mincho",serif;font-size:22px}.note-row button span{font-family:inherit;color:var(--accent)}.secret-note{display:none;background:color-mix(in srgb,var(--soft) 75%,var(--card));border:1px dashed var(--line);border-radius:18px;padding:18px;margin:12px 0 0;line-height:2;color:var(--muted);font-size:14px}.secret-note.is-show{display:block}.voice-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}.voice-card{background:var(--card);border:1px solid var(--line);border-radius:24px;padding:24px;box-shadow:var(--shadow)}.voice-card p{line-height:2;color:var(--muted)}.voice-card h3{margin:0 0 8px;font-size:18px}.form{background:var(--card);border:1px solid var(--line);border-radius:30px;padding:30px;box-shadow:var(--shadow);max-width:760px}.field{margin-bottom:18px}.field label{display:block;font-size:13px;color:var(--muted);margin-bottom:8px}.field input,.field select,.field textarea{width:100%;border:1px solid var(--line);background:var(--bg);color:var(--ink);border-radius:14px;padding:13px;font:inherit;outline:none}.field textarea{min-height:160px}.form-message{display:none;margin-top:18px;padding:14px;border-radius:14px;background:var(--soft);color:var(--muted)}.form-message.is-show{display:block}.notfound{padding:96px 0;text-align:center}.notfound h1{font-family:Georgia,serif;font-size:90px;font-weight:500;margin:0}.notfound p{line-height:2;color:var(--muted)}.tiny-hint{margin-top:42px;opacity:.48;font-family:Georgia,serif;line-height:2}.diary{max-width:820px;margin:auto}.diary-entry{background:var(--card);border:1px solid var(--line);border-radius:26px;padding:26px;margin:18px 0;box-shadow:var(--shadow)}.diary-entry time{font-family:Georgia,serif;color:var(--accent)}.diary-entry p{line-height:2.05;color:var(--muted)}.share-box{margin:52px auto 30px;padding:28px;border:1px solid var(--line);border-radius:28px;background:var(--card);text-align:center;max-width:760px}.share-box p{color:var(--muted);line-height:1.8}.site-footer{margin-top:70px;border-top:1px solid var(--line);padding:28px 0;color:var(--muted);font-size:12px}.footer-inner{display:flex;justify-content:space-between;gap:18px;align-items:center}.fiction{max-width:720px;line-height:1.8}.reset-link{all:unset;cursor:pointer;opacity:.5}.reset-link:hover{opacity:1;color:var(--accent)}.glitch{animation:glitch 2.4s ease-in-out 1}@keyframes glitch{0%{filter:none}20%{filter:invert(1)}22%{filter:none}44%{letter-spacing:.18em}46%{letter-spacing:.02em}70%{filter:contrast(2)}72%{filter:none}}
@media (max-width:900px){.header-inner{flex-wrap:wrap;padding:14px 0}.nav{order:3;width:100%;justify-content:space-between;margin-left:0}.search-form{margin-left:auto}.hero-grid,.two-col,.detail-layout{grid-template-columns:1fr}.cards{grid-template-columns:1fr}.features{grid-template-columns:repeat(2,1fr)}.order-grid{grid-template-columns:repeat(2,1fr)}.voice-grid{grid-template-columns:1fr}.product-photo{position:static}.footer-inner{display:block}.section-title{display:block}.section-title p{margin-top:8px}}
@media (max-width:560px){.wrapper{width:min(100% - 28px,1120px)}.logo{font-size:20px}.nav{font-size:11px;gap:8px;overflow-x:auto}.search-form{width:100%}.search-form input{flex:1;width:auto}.hero{padding-top:48px}.hero h1{font-size:42px}.sub-hero h1{font-size:40px}.order-grid{grid-template-columns:1fr}.features{grid-template-columns:1fr}.meta{grid-template-columns:1fr}}


/* revision v3 */
.quiz-box{background:var(--card);border:1px solid var(--line);border-radius:30px;padding:26px;box-shadow:var(--shadow)}
.quiz-box h3{font-family:Georgia,"Yu Mincho",serif;font-size:27px;font-weight:500;margin:8px 0 12px}
.quiz-box p{line-height:2;color:var(--muted)}
.quiz-question{border-top:1px solid var(--line);padding-top:16px;margin-top:16px}
.quiz-question b{font-size:13px;color:var(--accent);letter-spacing:.12em;text-transform:uppercase}
.quiz-options{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.quiz-options button,.inline-keyword{border:1px solid var(--line);background:var(--soft);color:var(--ink);border-radius:999px;padding:9px 14px;cursor:pointer;font:inherit;font-size:13px}
.quiz-options button.is-selected{border-color:var(--accent);color:var(--accent);background:transparent}
.inline-keyword{margin:0 4px;border-color:var(--accent);color:var(--accent);background:transparent}
.quiz-result{display:none;margin-top:18px;padding:16px;border:1px dashed var(--accent);border-radius:18px;line-height:1.9;color:var(--muted);background:color-mix(in srgb,var(--soft) 70%,var(--card))}
.quiz-result.is-show{display:block}
body:not(.memory) [data-after-memory]{display:none!important}
.order-grid:not(.dark-mode) .person-wrap{display:none!important}
.order-grid.dark-mode .bottle-wrap{display:none!important}
.order-grid.dark-mode .person-wrap{display:flex!important}
.order-grid:not(.dark-mode) .birth{display:none!important}
.gate-note{margin-top:16px;color:var(--muted);font-size:13px;line-height:1.8;border-top:1px solid var(--line);padding-top:14px}
@media(max-width:780px){.quiz-options{display:grid;grid-template-columns:1fr 1fr}.quiz-options button{width:100%}}


/* revision v4 */
body.dark .btn{background:var(--accent);border-color:var(--accent);color:#090b09!important}
body.dark .btn.ghost{background:transparent;color:var(--accent)!important;border-color:var(--accent)}
body.dark .search-form button{color:#090b09!important}
body.dark .quiz-options button,
body.dark .inline-keyword{color:var(--ink);background:var(--soft)}
body.dark .quiz-options button.is-selected,
body.dark .inline-keyword{color:var(--accent);background:transparent;border-color:var(--accent)}
.personal-section{margin-top:24px;padding-top:22px;border-top:1px solid var(--line)}
.personal-section h2{font-family:Georgia,"Yu Mincho",serif;font-weight:500;font-size:27px;margin:0 0 12px}
.counseling-log{display:grid;gap:12px;margin-top:16px}
.counseling-log div{border:1px solid var(--line);background:color-mix(in srgb,var(--soft) 45%,var(--card));border-radius:18px;padding:14px;line-height:1.85;color:var(--muted)}
.base-note-visible{background:color-mix(in srgb,var(--soft) 70%,var(--card));border:1px dashed var(--accent);border-radius:18px;padding:18px;line-height:2;color:var(--muted);margin-top:12px}
body.dark .card .btn, body.dark .panel .btn, body.dark .share-box .btn{color:#090b09!important}


/* generated image integration */
.hero-card{padding:0;overflow:hidden;border-radius:30px;}
.hero-card:before{display:none;}
.hero-card img{width:100%;height:100%;min-height:420px;object-fit:cover;}
.card > img{width:100%;aspect-ratio:4 / 3;object-fit:cover;background:var(--soft);}
.panel > img{width:100%;aspect-ratio:4 / 3;object-fit:cover;border-radius:20px;background:var(--soft);}
.product-photo{overflow:hidden;}
.product-photo img{width:100%;max-height:660px;object-fit:cover;border-radius:22px;background:var(--soft);}
.bottle-wrap,.person-wrap{padding:0;background:var(--soft);}
.bottle-wrap img,.person-wrap img{width:100%;height:100%;object-fit:cover;}
.order-card .person-wrap img{filter:grayscale(1);opacity:.92;}
.diary-entry img{width:100%;max-height:520px;object-fit:cover;border-radius:20px;margin-bottom:18px;background:var(--soft);}
@media (max-width:900px){.hero-card img{min-height:320px;}}


/* refresh hero and custom collection visuals */
.hero.hero-cover{position:relative;padding:0;min-height:620px;display:flex;align-items:center;background:url('images/hero-bottles.webp') center/cover no-repeat;color:#fff;overflow:hidden}
.hero.hero-cover:before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.58) 0%,rgba(0,0,0,.40) 38%,rgba(0,0,0,.18) 100%)}
.hero.hero-cover .wrapper{position:relative;z-index:1;width:min(1180px,calc(100% - 40px));}
.hero.hero-cover .hero-copy{max-width:620px;padding:92px 0 88px}
.hero.hero-cover .eyebrow,.hero.hero-cover .lead,.hero.hero-cover .feature span,.hero.hero-cover .feature b{color:#f2efe8}
.hero.hero-cover h1{color:#fff;text-shadow:0 10px 30px rgba(0,0,0,.25)}
.hero.hero-cover .lead{max-width:620px}
.hero.hero-cover .features{max-width:640px}
.hero.hero-cover .feature{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.18);backdrop-filter:blur(6px)}
.hero.hero-cover .btn.ghost{background:rgba(255,255,255,.08);color:#fff;border-color:rgba(255,255,255,.38)}
.hero.hero-cover .btn{box-shadow:0 10px 24px rgba(0,0,0,.18)}
body.dark .hero.hero-cover:before{background:linear-gradient(90deg,rgba(0,0,0,.72) 0%,rgba(0,0,0,.60) 45%,rgba(0,0,0,.34) 100%)}
body.dark .hero.hero-cover .feature{background:rgba(10,12,10,.38);border-color:rgba(240,239,234,.18)}
body.dark .hero.hero-cover .btn.ghost{background:rgba(10,12,10,.28);color:var(--ink);border-color:rgba(240,239,234,.25)}
@media (max-width:900px){.hero.hero-cover{min-height:540px}.hero.hero-cover .hero-copy{padding:72px 0 64px}}
@media (max-width:560px){.hero.hero-cover{min-height:520px}.hero.hero-cover .hero-copy{padding:52px 0 50px}}


/* voice update */
.voice-card h3{color:var(--ink)}

/* initials / age-prefecture formatting */
.entry-name{
  display:inline-block;
  font-size:1em;
  font-weight:600;
}
.entry-meta{
  display:inline-block;
  margin-left:.25em;
  font-size:.72em;
  font-weight:400;
  letter-spacing:.04em;
  color:var(--muted);
  vertical-align:baseline;
}
.order-card .entry-meta{
  display:block;
  margin-left:0;
  margin-top:2px;
  line-height:1.45;
}
.order-grid.dark-mode .order-card h3:after{
  content:none!important;
}
.order-grid.dark-mode .order-card .entry-name:after{
  content:" / preserved";
  font-family:Georgia,serif;
  font-size:10px;
  color:var(--muted);
  font-weight:400;
  margin-left:.3em;
}
.voice-card h3{
  line-height:1.45;
}


/* mobile readability adjustments */
@media (max-width: 560px){
  .hero.hero-cover .features,
  .features{
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
  }

  .feature{
    min-height: 78px;
    padding: 14px 13px !important;
  }

  .feature b{
    font-size: 15px !important;
    line-height: 1.2 !important;
  }

  .feature span{
    font-size: 12px !important;
    line-height: 1.55 !important;
  }

  .button-row{
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 10px !important;
  }

  .button-row .btn,
  .button-row .btn.ghost{
    display: block !important;
    width: auto !important;
    min-width: 170px !important;
    text-align: center !important;
  }

  .hero.hero-cover .button-row{
    align-items: flex-start !important;
  }

  .detail-copy h1{
    font-size: 31px !important;
    line-height: 1.35 !important;
    word-break: keep-all;
    overflow-wrap: anywhere;
  }

  .detail-copy h2,
  .personal-section h2,
  .note-row button{
    font-size: 22px !important;
    line-height: 1.45 !important;
  }

  .seasonal-memory h2,
  .seasonal-memory h3,
  [class*="season"] h2,
  [class*="season"] h3{
    font-size: 22px !important;
    line-height: 1.45 !important;
  }

  .detail-copy .lead{
    font-size: 16px !important;
    line-height: 1.8 !important;
  }

  .detail-copy p,
  .detail-copy li,
  .panel p,
  .voice-card p{
    font-size: 14px !important;
    line-height: 1.9 !important;
  }

  .order-intro{
    display: block !important;
  }

  .order-intro .btn{
    margin-top: 16px !important;
    writing-mode: horizontal-tb !important;
    border-radius: 999px !important;
  }

  .order-intro h2{
    font-size: 25px !important;
    line-height: 1.35 !important;
  }

  .order-intro p{
    font-size: 14px !important;
    line-height: 1.85 !important;
  }
}


/* tighter shared spacing */
.section{padding:44px 0}
.section-title{margin-bottom:20px}
.two-col{gap:18px}
.panel{padding:22px}
.sub-hero{padding:46px 0 24px}
.order-intro{padding:20px;margin-bottom:18px}
.search-result-banner{margin:18px 0}
.detail-layout{gap:24px}
.product-photo{padding:20px}
.detail-copy{padding:26px}
.note-list{margin:18px 0}
.note-row{padding:12px 0}
.voice-grid{gap:14px}
.voice-card{padding:20px}
.form{padding:24px}
.diary-entry{padding:22px;margin:14px 0}
.share-box{margin:36px auto 22px;padding:22px}
.site-footer{margin-top:44px;padding:22px 0}
.personal-section{margin-top:18px;padding-top:18px}
.counseling-log{margin-top:12px}
.base-note-visible{margin-top:10px}
.cards{gap:16px}
.card-body{padding:18px}
.order-card .card-body{padding:14px}

@media (max-width:900px){
  .section{padding:34px 0}
  .sub-hero{padding:34px 0 18px}
  .panel{padding:20px}
  .detail-copy{padding:22px}
  .product-photo{padding:18px}
  .site-footer{margin-top:34px;padding:18px 0}
}

@media (max-width:560px){
  .section{padding:24px 0}
  .section-title{margin-bottom:16px}
  .sub-hero{padding:22px 0 14px}
  .panel{padding:18px;border-radius:24px}
  .panel h3{margin:10px 0 8px}
  .panel p,.copy p{line-height:1.85}
  .cards{gap:12px}
  .card-body{padding:16px}
  .order-intro{padding:16px;margin-bottom:14px;border-radius:24px}
  .search-result-banner{margin:14px 0;padding:14px}
  .detail-layout{gap:16px}
  .product-photo{padding:14px;border-radius:24px}
  .detail-copy{padding:18px;border-radius:24px}
  .meta{margin:16px 0}
  .note-list{margin:14px 0}
  .note-row{padding:10px 0}
  .personal-section{margin-top:14px;padding-top:14px}
  .counseling-log{gap:10px;margin-top:10px}
  .counseling-log div{padding:12px}
  .base-note-visible{padding:14px;margin-top:8px}
  .voice-grid{gap:12px}
  .voice-card{padding:16px;border-radius:20px}
  .form{padding:18px;border-radius:24px}
  .field{margin-bottom:14px}
  .notfound{padding:58px 0}
  .diary-entry{padding:18px;margin:12px 0;border-radius:22px}
  .share-box{margin:24px auto 18px;padding:18px;border-radius:24px}
  .site-footer{margin-top:24px;padding:16px 0}
  .fiction{line-height:1.7}
}