@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;600&family=Noto+Serif+JP:wght@400;500&display=swap');
:root{--ink:#54443d;--teal:#35636a;--wine:#98463f;--paper:#faf8f3}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:30px}body{margin:0;color:var(--ink);background:var(--paper);font:16px/2.1 'Noto Sans JP',sans-serif}a{color:inherit}header{max-width:1240px;margin:auto;padding:28px 48px;display:flex;justify-content:space-between;align-items:center;gap:20px}.brand{font-family:Georgia,serif;font-size:30px;letter-spacing:.06em;text-decoration:none;color:var(--teal)}.brand span{display:block;font:12px/1.7 'Noto Sans JP',sans-serif;letter-spacing:.08em;color:var(--ink)}.nav{font-size:14px;text-underline-offset:7px}.hero{max-width:1240px;margin:auto;display:grid;grid-template-columns:1.15fr 1fr;align-items:center;padding:32px 48px 70px;gap:55px;background:radial-gradient(ellipse at 20% 15%,#e4f0ef99,transparent 65%)}.eyebrow{font-size:12px;letter-spacing:.17em;color:var(--teal);margin:0 0 25px}.intro{font-family:'Noto Serif JP',serif;font-size:20px;line-height:2.1}h1{font-family:'Noto Serif JP',serif;font-weight:400;color:var(--wine);font-size:clamp(42px,5.4vw,70px);letter-spacing:.06em;line-height:1.6;margin:20px 0 0}.subtitle{color:var(--teal);letter-spacing:.13em;margin:5px 0 35px}.date{border-top:1px solid #b9c9c7;padding-top:24px;display:flex;align-items:center;gap:22px;margin-bottom:30px}.date strong{font:30px Georgia,serif}.date span{font-size:14px;line-height:1.8}.button{background:var(--teal);color:white;display:flex;align-items:center;justify-content:space-between;gap:20px;text-decoration:none;padding:17px 25px;min-height:56px;max-width:430px;font-size:16px;line-height:1.8;transition:background .2s}.button:hover{background:#244e55}.button:focus-visible,a:focus-visible{outline:3px solid var(--wine);outline-offset:5px}.poster img{display:block;width:100%;height:auto;box-shadow:0 20px 50px #543e3019}.reading{max-width:740px;margin:auto;padding:95px 30px}.reading p{margin:0 0 28px}.reading .eyebrow{margin-bottom:22px}h2{font-family:'Noto Serif JP',serif;font-weight:400;font-size:30px;line-height:1.9;letter-spacing:.04em;margin:0 0 38px;color:var(--teal)}.opening{padding-top:60px}blockquote{margin:35px 0;padding:10px 0 10px 25px;border-left:2px solid #b78472;color:#79534b}.feelings{font-family:'Noto Serif JP',serif;font-size:23px;color:var(--wine);line-height:2.2}.wash{background:#eaf1ef}.choices{margin:35px 0;border-top:1px solid #d9d1c7}.choices p{padding:24px 0;margin:0;border-bottom:1px solid #d9d1c7}aside{background:#f0e9df;margin:55px 0;padding:32px}h3{font-weight:500;color:var(--wine);font-size:20px;margin:0 0 20px}ul{padding-left:1.2em;margin:0}li{margin:15px 0;padding-left:5px}li::marker{color:var(--wine)}.closing{font-family:'Noto Serif JP',serif;font-size:23px;color:var(--teal);padding-top:15px}.details{background:#e6eeeb;padding:80px 40px}.detail-inner{max-width:1060px;margin:auto;display:grid;grid-template-columns:1fr 1.2fr;gap:70px}.details h2{font-size:28px}.details dl{margin:0 0 30px}.details dl>div{display:grid;grid-template-columns:80px 1fr;border-bottom:1px solid #bcccca;padding:19px 0}.details dt{color:var(--teal)}dd{margin:0}dd span{font-size:14px}.note{font-size:13px;line-height:1.9;margin-top:18px}footer{text-align:center;padding:50px 25px 30px}footer p{font-size:14px}footer>a:not(.brand){font-size:14px;text-underline-offset:5px}small{display:block;font-size:12px;margin-top:30px;color:#766e67}@media(max-width:760px){header{padding:20px 24px}.brand{font-size:26px}.brand span{font-size:10px}.nav{font-size:12px}.hero{grid-template-columns:1fr;padding:22px 24px 45px;gap:35px}.hero-copy{padding-top:10px}.intro{font-size:18px}h1{font-size:clamp(40px,10vw,65px)}.eyebrow{font-size:11px}.date{gap:20px}.date strong{font-size:28px}.poster{max-width:460px;margin:auto;width:100%}.reading{padding:60px 25px}h2{font-size:25px}.feelings,.closing{font-size:20px}aside{padding:26px 22px}.details{padding:55px 25px}.detail-inner{grid-template-columns:1fr;gap:18px}.details h2{font-size:25px}.details dl>div{grid-template-columns:64px 1fr}.button{max-width:none}.reading p{overflow-wrap:anywhere}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
.story-image{margin:38px auto 0;width:100%;overflow:hidden;border-radius:6px}.story-image img{display:block;width:100%;height:auto}.heart-image{max-width:420px}.voyager-image{max-width:480px}@media(max-width:760px){.story-image{margin-top:28px}.heart-image{max-width:300px}.voyager-image{max-width:390px}}@media(max-width:380px){header{gap:12px;padding-inline:20px}.brand span{max-width:145px}.nav{max-width:112px}.date{flex-wrap:wrap;gap:12px}.reading h2,.details h2{font-size:23px;letter-spacing:0}.feelings{font-size:18px}.button{padding-inline:18px}}
.feelings{display:grid;grid-template-columns:repeat(2,max-content);gap:0 1em}.feelings span{white-space:nowrap}@media(max-width:380px){.feelings{font-size:17px;gap:0 .6em}}
@media(max-width:380px){.feelings{grid-template-columns:1fr;font-size:18px;row-gap:4px}}
.intro{color:#352720}
@media(max-width:760px){
  header{flex-wrap:wrap;row-gap:12px}
  .brand span{font-size:13px;max-width:none}
  .nav{font-size:14px;max-width:none}
  .eyebrow{font-size:14px;letter-spacing:.12em;line-height:1.9}
  .date{flex-wrap:wrap;gap:12px 20px}
  .date span,dd span,.note{font-size:15px}
}