@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@300;400;500;600&family=Manrope:wght@300;400;500&family=Shippori+Mincho:wght@400;500;600&display=swap');
:root{--bg:#f5f4ef;--paper:#fbfaf7;--ink:#171816;--muted:#777871;--line:rgba(20,20,20,.12);--accent:#7d9da8;--shadow:0 28px 90px rgba(64,86,94,.12)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);font-family:'Manrope',sans-serif;background:radial-gradient(circle at 12% 7%,#fff,transparent 28%),radial-gradient(circle at 90% 12%,rgba(185,210,220,.24),transparent 30%),linear-gradient(#f9f8f4,#f1f3f1);overflow-x:hidden}body.night{background:radial-gradient(circle at 85% 8%,rgba(116,143,159,.18),transparent 28%),linear-gradient(#eef1f1,#e8ecec)}button,input,textarea,select{font:inherit}button{cursor:pointer}.page{display:none}.page.active{display:block}
.splash{position:fixed;inset:0;z-index:9999;display:grid;place-items:center;background:#f7f5ef;animation:splashOut 2.9s forwards}.splash-inner{text-align:center;animation:splashMark 2.55s both}.splash-logo{font:500 clamp(58px,10vw,96px)/1 'Shippori Mincho';letter-spacing:.22em;text-indent:.22em}.splash-roman{margin-top:15px;font:400 11px 'Cormorant Garamond';letter-spacing:.62em;color:#777}.splash-tagline{margin-top:34px;font:400 14px 'Shippori Mincho';letter-spacing:.12em;color:#686a66}@keyframes splashMark{0%{opacity:0;transform:translateY(10px)}18%,72%{opacity:1;transform:none}100%{opacity:0;transform:translateY(-5px)}}@keyframes splashOut{0%,78%{opacity:1;visibility:visible}100%{opacity:0;visibility:hidden}}
.notice{position:fixed;inset:0;z-index:500;display:grid;place-items:center;background:rgba(245,244,239,.96);opacity:0;visibility:hidden;transition:.3s}.notice.show{opacity:1;visibility:visible}.notice div{text-align:center}.notice strong{font:500 38px 'Shippori Mincho'}.notice p{font:400 16px/2 'Shippori Mincho';color:#666}
.topbar{position:fixed;top:0;left:0;right:0;z-index:100;display:flex;justify-content:space-between;align-items:center;padding:22px 5vw;background:linear-gradient(rgba(247,245,239,.92),transparent);backdrop-filter:blur(4px)}.brand{border:0;background:none;display:flex;align-items:center;gap:12px}.brand b{font:500 17px 'Shippori Mincho';letter-spacing:.25em}.brand span:last-child{font:400 10px 'Shippori Mincho';color:var(--accent)}.brand-mark{width:16px;height:16px;border:1px solid rgba(22,22,22,.45);position:relative}.brand-mark:after{content:"";position:absolute;width:6px;height:6px;right:-3px;bottom:-3px;background:var(--accent)}nav{display:flex;gap:20px}nav button{border:0;background:none;font-size:9px;letter-spacing:.18em}.editorial-link{color:var(--accent);position:relative}.editorial-link:before{content:"";position:absolute;left:-9px;top:50%;width:4px;height:4px;border-radius:50%;background:var(--accent)}
.hero{min-height:100svh;display:grid;grid-template-columns:1.1fr .9fr;align-items:center;padding:110px 7vw 70px;position:relative;overflow:hidden}.hero:after{content:"31";position:absolute;right:-1vw;bottom:-10vh;font:300 min(42vw,570px)/.8 'Cormorant Garamond';color:rgba(125,157,168,.1)}.kicker{display:flex;gap:14px;align-items:center;margin-bottom:34px;font-size:9px;letter-spacing:.34em;color:var(--accent)}.kicker:before{content:"";width:58px;height:1px;background:var(--accent)}.hero h1{margin:0;font:500 clamp(86px,15vw,210px)/.78 'Shippori Mincho';letter-spacing:.17em}.roman{margin-top:24px;font:400 18px 'Cormorant Garamond';letter-spacing:.92em;color:#555}.hero-text{margin:100px 0 0 8%;font:500 clamp(22px,2.3vw,37px)/2 'Shippori Mincho';letter-spacing:.08em}.hero-note{margin:38px 0 0 8%;font-size:9px;letter-spacing:.18em;color:#7f8583}.hero-side{min-height:620px;display:flex;align-items:center;justify-content:center;position:relative;z-index:2}.glass{width:min(390px,80%);aspect-ratio:3/4;position:relative;border:1px solid rgba(255,255,255,.94);background:linear-gradient(150deg,rgba(255,255,255,.78),rgba(221,230,228,.44));box-shadow:var(--shadow);transform:rotate(2.5deg)}.glass:before{content:"";position:absolute;inset:22px;border:1px solid var(--line)}.vertical-poem{position:absolute;inset:44px;writing-mode:vertical-rl;font:500 21px/2.35 'Shippori Mincho';letter-spacing:.12em}.index{position:absolute;left:-36px;bottom:30px;font:400 72px 'Cormorant Garamond';color:var(--accent)}
.reveal{opacity:0;transform:translateY(26px);transition:.8s}.reveal.visible{opacity:1;transform:none}.museum-intro,.today-gallery,.counter-section,.statement,.home-theme,.bookmarks,.archive{max-width:1320px;margin:auto;padding:140px 7vw}.museum-intro-inner{display:grid;grid-template-columns:.7fr 1.3fr;gap:8vw;padding:90px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.museum-label,.section-head span,.counter-section span,.statement>span,.home-theme span,.bookmarks span{font-size:9px;letter-spacing:.3em;color:var(--accent)}.museum-copy{font:500 clamp(34px,4vw,58px)/1.82 'Shippori Mincho'}.museum-copy span{color:var(--accent)}
.section-head{display:flex;justify-content:space-between;align-items:end;padding-bottom:22px;border-bottom:1px solid var(--line)}.section-head h2{margin:12px 0 0;font:500 clamp(40px,5vw,68px) 'Shippori Mincho';letter-spacing:.08em}.section-head small{color:#777}.today-stage{min-height:620px;display:grid;grid-template-columns:90px 1fr 180px;gap:38px;align-items:center}.no{font:400 42px 'Cormorant Garamond';color:var(--accent)}.today-stage p{white-space:pre-line;font:500 clamp(34px,4.7vw,66px)/1.86 'Shippori Mincho';letter-spacing:.085em}.plaque{display:flex;flex-direction:column;gap:14px;font-size:9px;letter-spacing:.19em;color:#777}.text-button{border:0;border-bottom:1px solid #222;background:none;padding:10px 0;font:400 11px 'Shippori Mincho';letter-spacing:.16em}.today-gallery>.text-button{display:block;margin-left:auto}
.counter-section{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.counter-section strong{display:block;margin-top:8px;font:500 30px 'Shippori Mincho'}.counter{font:300 92px 'Cormorant Garamond';color:var(--accent)}.counter small{font-size:18px;color:#777;margin-left:8px}.statement{display:grid;grid-template-columns:.7fr 1.3fr;gap:8vw}.statement p{margin:0;display:flex;flex-direction:column;font:500 clamp(32px,3.75vw,54px)/1.78 'Shippori Mincho'}.statement i{font-style:normal}.statement em{font-style:normal;color:var(--accent)}
.home-theme{display:grid;grid-template-columns:.7fr .8fr 1fr;gap:50px;align-items:end;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.home-theme h2{font:500 28px 'Shippori Mincho'}.home-theme>strong{font:500 clamp(46px,6vw,78px) 'Shippori Mincho'}.home-theme p{font:400 14px/2 'Shippori Mincho';color:#666}
.bookmark-list{display:none}.bookmark-list.open{display:block}.bookmark-item,.poem-row{display:grid;grid-template-columns:84px 1fr 210px;gap:40px;padding:70px 0;border-bottom:1px solid var(--line)}.bookmark-item p,.poem-row p{margin:0;white-space:pre-line;font:500 clamp(24px,3vw,41px)/1.95 'Shippori Mincho';letter-spacing:.08em}.poem-meta{display:flex;flex-direction:column;gap:15px;font-size:9px;letter-spacing:.18em;color:#777}.poem-meta button{border:0;background:none;text-align:left;padding:0}.empty{text-align:center;padding:100px 0}.empty strong{font:500 30px 'Shippori Mincho'}.empty p{font:400 14px/2 'Shippori Mincho';color:#777}
.write-layout{max-width:1050px;margin:auto;min-height:100svh;padding:150px 6vw 100px;display:grid;grid-template-columns:.8fr 1.2fr;gap:70px}.write-layout h2{font:500 56px 'Shippori Mincho';white-space:nowrap}.write-layout p{font:400 13px/2 'Shippori Mincho';color:#777}.write-theme{padding:24px 0;display:flex;gap:18px;align-items:baseline;border-top:1px solid var(--line)}.write-theme span,.write-theme small{font-size:10px;color:#777}.write-theme strong{font:500 28px 'Shippori Mincho'}form{background:rgba(255,255,255,.54);padding:38px 42px;box-shadow:var(--shadow)}label{display:block;padding:22px 0;border-bottom:1px solid var(--line);font:400 10px 'Shippori Mincho';letter-spacing:.18em;color:#777}textarea,input,select{width:100%;margin-top:12px;border:0;background:none;outline:0;font:500 19px 'Shippori Mincho';color:var(--ink)}textarea{min-height:250px;resize:vertical;line-height:38px;background:repeating-linear-gradient(transparent 0,transparent 37px,rgba(125,157,168,.12) 38px)}.primary-button{margin-top:30px;border:1px solid #111;background:none;padding:16px 28px;font:500 12px 'Shippori Mincho'}
.detail-layout{min-height:100svh;padding:140px 8vw 80px;display:grid;grid-template-columns:120px 1fr 220px;gap:40px;align-items:center}.detail-poem{white-space:pre-line;font:500 clamp(32px,5vw,68px)/1.75 'Shippori Mincho';letter-spacing:.09em}.detail-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}.detail-actions button,.journey-actions button{border:1px solid var(--line);background:none;padding:12px 16px}.detail-layout aside{font-size:10px;line-height:2.2;letter-spacing:.18em;color:#666}.author-page,.editorial-page{max-width:1120px;margin:auto;padding:150px 6vw 130px}.author-page h1,.editorial-page h1{font:500 clamp(48px,8vw,92px) 'Shippori Mincho'}.eyebrow{font-size:10px;color:var(--accent);letter-spacing:.18em}.editorial-letter{max-width:820px;padding:100px 0}.editorial-letter>span,.editorial-grid section>span{font-size:9px;letter-spacing:.3em;color:var(--accent)}.editorial-letter h2{font:500 clamp(30px,4.2vw,54px)/1.65 'Shippori Mincho'}.editorial-letter p{font:400 17px/2.25 'Shippori Mincho';white-space:pre-line}.editorial-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px}.editorial-grid section{min-height:420px;padding:44px;background:rgba(255,255,255,.52);box-shadow:var(--shadow);display:flex;flex-direction:column}.editorial-grid h3{font:500 22px 'Shippori Mincho'}.editorial-grid strong{font:500 60px 'Shippori Mincho';margin:30px 0}.editorial-grid p{font:500 28px/1.9 'Shippori Mincho';white-space:pre-line}.editorial-closing{margin:120px auto 0;text-align:center;font:500 30px/2 'Shippori Mincho';white-space:pre-line}
.immersive-room{min-height:100svh;display:grid;place-items:center;padding:120px 8vw 70px;position:relative;background:radial-gradient(circle at 50% 45%,rgba(212,225,222,.62),rgba(247,245,239,.78) 48%,#f5f4ef 82%)}.close-room{position:absolute;top:100px;right:6vw;border:0;background:none}.immersive-room>div{text-align:center;width:min(920px,100%)}.immersive-room>div>span{font-size:9px;letter-spacing:.34em;color:var(--accent)}.immersive-room p{white-space:pre-line;font:500 clamp(34px,5vw,66px)/1.9 'Shippori Mincho'}.immersive-room small{font-size:10px;letter-spacing:.18em;color:#777}.round-button{display:block;margin:55px auto 0;width:145px;height:145px;border-radius:50%;border:1px solid #789;background:rgba(255,255,255,.25);font:400 11px/1.7 'Shippori Mincho'}.journey-path{margin:35px 0;color:var(--accent);letter-spacing:.2em}.journey-actions{display:flex;justify-content:center;gap:15px;margin-top:50px}
.mobile-cta{display:none}footer{display:flex;justify-content:space-between;padding:34px 6vw;border-top:1px solid var(--line);font-size:8px;letter-spacing:.2em;color:#777}
@media(max-width:820px){nav{gap:12px}nav button:nth-child(3),nav button:nth-child(5){display:none}.hero{grid-template-columns:1fr;padding:110px 24px 70px}.hero h1{font-size:76px}.hero-text,.hero-note{margin-left:0}.hero-side{min-height:450px}.museum-intro,.today-gallery,.counter-section,.statement,.home-theme,.bookmarks,.archive{padding:100px 24px}.museum-intro-inner,.statement,.home-theme,.write-layout,.editorial-grid{grid-template-columns:1fr}.today-stage{grid-template-columns:42px 1fr;min-height:500px}.plaque{grid-column:2}.counter{font-size:68px}.bookmark-item,.poem-row{grid-template-columns:42px 1fr;gap:16px}.poem-meta{grid-column:2}.write-layout{padding-top:120px}.write-layout h2{font-size:38px}.detail-layout{grid-template-columns:1fr;padding:120px 24px}.detail-layout>.no{display:none}.immersive-room{padding:120px 24px}.mobile-cta{display:block;position:fixed;right:18px;bottom:18px;z-index:120;border:1px solid var(--line);background:rgba(247,245,239,.92);padding:14px 18px;box-shadow:var(--shadow);font:500 12px 'Shippori Mincho'}footer{flex-direction:column;gap:10px}}


/* ===== Mobile Reading Refinement ===== */
@media(max-width:820px){
  body{
    overflow-wrap:normal;
    word-break:normal;
  }

  .topbar{
    padding:18px 20px;
  }

  .brand{
    gap:10px;
  }

  .brand b{
    font-size:16px;
  }

  nav{
    gap:14px;
  }

  nav button{
    font-size:9px;
    letter-spacing:.12em;
  }

  /* Hero */
  .hero{
    padding:104px 24px 64px;
  }

  .hero h1{
    font-size:72px;
    letter-spacing:.14em;
  }

  .roman{
    font-size:15px;
    letter-spacing:.65em;
  }

  .hero-text{
    margin-top:72px;
    font-size:25px;
    line-height:1.95;
    letter-spacing:.04em;
    text-wrap:balance;
  }

  .hero-side{
    min-height:410px;
  }

  .glass{
    width:260px;
  }

  /* Section rhythm */
  .museum-intro,
  .today-gallery,
  .counter-section,
  .statement,
  .home-theme,
  .bookmarks,
  .archive{
    padding:84px 24px;
  }

  .museum-intro-inner{
    padding:68px 0;
  }

  .museum-copy{
    font-size:31px;
    line-height:1.85;
    letter-spacing:.035em;
  }

  /* Today's poem */
  .today-gallery .section-head{
    align-items:end;
  }

  .today-gallery .section-head h2{
    font-size:48px;
    line-height:1.25;
    letter-spacing:.04em;
  }

  .today-stage{
    min-height:560px;
    grid-template-columns:30px minmax(0,1fr);
    gap:14px;
    padding:44px 0 30px;
    align-items:start;
  }

  .today-stage .no{
    font-family:'Cormorant Garamond',serif;
    font-size:34px;
    line-height:1;
    letter-spacing:0;
    font-variant-numeric:lining-nums tabular-nums;
    writing-mode:horizontal-tb;
    text-orientation:mixed;
    margin-top:10px;
    white-space:nowrap;
  }

  .today-stage p{
    grid-column:2;
    margin:0;
    max-width:100%;
    white-space:pre-line;
    word-break:keep-all;
    overflow-wrap:normal;
    line-break:strict;
    font-size:clamp(30px,8.2vw,39px);
    line-height:1.9;
    letter-spacing:.035em;
  }

  .plaque{
    grid-column:2;
    margin-top:24px;
    gap:10px;
    font-size:9px;
    line-height:1.8;
  }

  .today-gallery>.text-button{
    margin-top:8px;
  }

  /* Counter */
  .counter-section{
    padding-top:70px;
    padding-bottom:70px;
  }

  .counter-section strong{
    font-size:25px;
  }

  .counter{
    font-size:58px;
  }

  /* About statement */
  .statement{
    gap:42px;
  }

  .statement p{
    width:100%;
    max-width:100%;
    font-size:clamp(29px,7.6vw,37px);
    line-height:1.8;
    letter-spacing:.025em;
  }

  .statement i{
    display:block;
    width:100%;
  }

  .statement i:nth-child(2){
    white-space:nowrap;
    font-size:clamp(27px,7.2vw,35px);
  }

  .statement i:nth-child(3){
    white-space:nowrap;
  }

  /* Theme section */
  .home-theme{
    gap:24px;
  }

  .home-theme h2{
    font-size:36px;
    margin-bottom:4px;
  }

  .home-theme>strong{
    font-size:54px;
    line-height:1.3;
  }

  .home-theme p{
    font-size:14px;
    line-height:2;
  }

  /* Archive rows */
  .bookmark-item,
  .poem-row{
    grid-template-columns:28px minmax(0,1fr);
    gap:14px;
    padding:54px 0;
  }

  .bookmark-item .no,
  .poem-row .no{
    font-family:'Cormorant Garamond',serif;
    font-size:27px;
    line-height:1;
    letter-spacing:0;
    font-variant-numeric:lining-nums tabular-nums;
    white-space:nowrap;
  }

  .bookmark-item p,
  .poem-row p{
    grid-column:2;
    font-size:clamp(25px,6.7vw,33px);
    line-height:1.9;
    letter-spacing:.025em;
    white-space:pre-line;
    word-break:keep-all;
    overflow-wrap:normal;
    line-break:strict;
  }

  .poem-meta{
    grid-column:2;
    margin-top:10px;
    line-height:1.8;
  }

  /* Write page */
  .write-layout{
    padding:116px 22px 120px;
    gap:38px;
  }

  .write-layout h2{
    font-size:38px;
  }

  .write-theme{
    align-items:flex-start;
    flex-wrap:wrap;
  }

  .write-theme strong{
    font-size:27px;
  }

  form{
    padding:26px 22px;
  }

  /* Detail */
  .detail-layout{
    padding:118px 24px 100px;
  }

  .detail-poem{
    font-size:clamp(30px,8vw,40px);
    line-height:1.9;
    letter-spacing:.035em;
    word-break:keep-all;
    overflow-wrap:normal;
    line-break:strict;
  }

  .detail-actions{
    gap:10px;
  }

  .detail-actions button{
    padding:11px 13px;
    font-size:11px;
  }

  /* Editorial */
  .editorial-page{
    padding:122px 24px 100px;
  }

  .editorial-page h1{
    font-size:48px;
    line-height:1.45;
  }

  .editorial-letter h2{
    font-size:34px;
    line-height:1.75;
    text-wrap:balance;
  }

  .editorial-letter p{
    font-size:16px;
    line-height:2.2;
  }

  .editorial-grid section{
    min-height:auto;
    padding:34px 28px;
  }

  .editorial-grid strong{
    font-size:50px;
  }

  .editorial-grid p{
    font-size:27px;
    line-height:1.9;
    word-break:keep-all;
    overflow-wrap:normal;
  }

  /* Immersive pages */
  .immersive-room p{
    font-size:clamp(30px,8vw,42px);
    line-height:1.9;
    word-break:keep-all;
    overflow-wrap:normal;
    line-break:strict;
  }

  /* CTA */
  .mobile-cta{
    right:16px;
    bottom:calc(16px + env(safe-area-inset-bottom));
    padding:13px 17px;
  }

  footer{
    padding-bottom:90px;
  }
}

@media(max-width:390px){
  .today-gallery .section-head h2{
    font-size:43px;
  }

  .today-stage{
    grid-template-columns:26px minmax(0,1fr);
    gap:11px;
  }

  .today-stage p{
    font-size:29px;
    line-height:1.88;
  }

  .statement p{
    font-size:28px;
  }

  .statement i:nth-child(2){
    font-size:26px;
    letter-spacing:0;
  }

  .home-theme h2{
    font-size:34px;
  }

  .home-theme>strong{
    font-size:50px;
  }
}

.keep-together{white-space:nowrap}

.statement-copy{margin:0;font:500 clamp(32px,3.75vw,54px)/1.78 'Shippori Mincho';}.statement-copy .keep-together{white-space:nowrap;} .statement-copy em{font-style:normal;color:var(--accent);} .statement-copy br{display:block;content:'';margin:.45em 0;}


/* ===== Complete Edition ===== */
.discover,
.ranking{
  max-width:1320px;
  margin:auto;
  padding:120px 7vw;
}
.discover-tools{
  display:grid;
  grid-template-columns:1fr 1.4fr;
  gap:36px;
  align-items:end;
  padding:38px 0 46px;
}
.search-box{
  display:block;
  border-bottom:1px solid var(--line);
  padding-bottom:12px;
}
.search-box span{
  display:block;
  font-size:9px;
  letter-spacing:.3em;
  color:var(--accent);
  margin-bottom:12px;
}
.search-box input{
  width:100%;
  border:0;
  outline:0;
  background:transparent;
  font:500 28px 'Shippori Mincho',serif;
  color:var(--ink);
}
.search-box input::placeholder{
  color:#aaa;
}
.tag-filter{
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  gap:10px;
}
.tag-filter button{
  border:1px solid var(--line);
  background:rgba(255,255,255,.35);
  padding:10px 14px;
  font:400 10px 'Shippori Mincho',serif;
  letter-spacing:.12em;
  transition:.25s;
}
.tag-filter button.active,
.tag-filter button:hover{
  background:#171816;
  color:#fff;
}
.search-results{
  border-top:1px solid var(--line);
}
.search-empty{
  padding:70px 0;
  text-align:center;
  font:400 14px/2 'Shippori Mincho',serif;
  color:#777;
}
.ranking-item{
  display:grid;
  grid-template-columns:80px 1fr 180px;
  gap:34px;
  padding:58px 0;
  border-bottom:1px solid var(--line);
  cursor:pointer;
}
.ranking-rank{
  font:400 42px 'Cormorant Garamond',serif;
  color:var(--accent);
}
.ranking-item p{
  margin:0;
  white-space:pre-line;
  font:500 clamp(25px,3vw,40px)/1.95 'Shippori Mincho',serif;
  letter-spacing:.06em;
}
.ranking-meta{
  display:flex;
  flex-direction:column;
  gap:12px;
  font-size:9px;
  letter-spacing:.16em;
  color:#777;
}
.daily-badge{
  display:inline-flex;
  align-items:center;
  gap:8px;
}
.daily-badge::before{
  content:"";
  width:5px;
  height:5px;
  border-radius:50%;
  background:var(--accent);
}
.poem-row,
.ranking-item,
.bookmark-item{
  transition:background .25s,padding-left .25s;
}
.poem-row:hover,
.ranking-item:hover,
.bookmark-item:hover{
  background:linear-gradient(90deg,rgba(255,255,255,.5),transparent);
  padding-left:18px;
}
@media(max-width:820px){
  .discover,
  .ranking{
    padding:90px 24px;
  }
  .discover-tools{
    grid-template-columns:1fr;
    gap:26px;
  }
  .tag-filter{
    justify-content:flex-start;
  }
  .search-box input{
    font-size:24px;
  }
  .ranking-item{
    grid-template-columns:34px 1fr;
    gap:14px;
    padding:46px 0;
  }
  .ranking-meta{
    grid-column:2;
  }
}

/* Robust mobile tag selection */
.tag-filter button{touch-action:manipulation;-webkit-tap-highlight-color:transparent;position:relative;z-index:2}
.tag-filter button.active,.tag-filter button[aria-pressed="true"]{background:#171816!important;color:#fff!important;border-color:#171816!important}


/* ===== Ver.2.1: atmosphere, editorial selection, post ritual ===== */
.season-atmosphere{
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:1;
  overflow:hidden;
}
.season-atmosphere::before,
.season-atmosphere::after{
  content:"";
  position:absolute;
  opacity:.26;
  filter:blur(.2px);
}
body.season-spring .season-atmosphere::before{
  width:8px;height:8px;border-radius:70% 0 70% 0;
  background:#d8b8bc;
  left:14%;top:-20px;
  box-shadow:22vw 7vh #e2c7ca,48vw -2vh #d9bfc2,76vw 10vh #ead6d7;
  animation:petalFall 13s linear infinite;
}
body.season-spring .season-atmosphere::after{
  width:6px;height:6px;border-radius:70% 0 70% 0;
  background:#dfc3c6;
  left:35%;top:-40px;
  box-shadow:28vw 4vh #ead5d6,52vw 12vh #d8babc;
  animation:petalFall 17s linear infinite 2s;
}
body.season-summer .season-atmosphere::before{
  width:160px;height:160px;border-radius:50%;
  background:radial-gradient(circle,rgba(255,255,255,.8),rgba(195,220,226,.18) 45%,transparent 72%);
  right:-30px;top:12%;
  animation:summerBreath 8s ease-in-out infinite;
}
body.season-summer .season-atmosphere::after{
  width:2px;height:2px;border-radius:50%;background:#fff;
  left:18%;top:20%;
  box-shadow:16vw 8vh rgba(255,255,255,.8),35vw -3vh rgba(255,255,255,.55),62vw 13vh rgba(255,255,255,.7),75vw 4vh rgba(255,255,255,.5);
  animation:summerLight 6s ease-in-out infinite;
}
body.season-autumn .season-atmosphere::before{
  width:10px;height:6px;border-radius:70% 10% 70% 10%;
  background:#a98f73;left:10%;top:-30px;
  box-shadow:22vw 8vh #b8a086,49vw 2vh #9f8972,74vw 12vh #c0aa91;
  animation:leafFall 16s linear infinite;
}
body.season-autumn .season-atmosphere::after{
  width:8px;height:5px;border-radius:70% 10% 70% 10%;
  background:#baa086;left:32%;top:-50px;
  box-shadow:31vw 5vh #9f8871,54vw 14vh #c2ae98;
  animation:leafFall 20s linear infinite 3s;
}
body.season-winter .season-atmosphere::before{
  width:4px;height:4px;border-radius:50%;background:#fff;
  left:10%;top:-20px;
  box-shadow:16vw 9vh rgba(255,255,255,.95),34vw 2vh rgba(255,255,255,.8),52vw 12vh rgba(255,255,255,.9),75vw 5vh rgba(255,255,255,.75);
  animation:snowFall 15s linear infinite;
}
body.season-winter .season-atmosphere::after{
  width:3px;height:3px;border-radius:50%;background:#fff;
  left:26%;top:-40px;
  box-shadow:22vw 7vh rgba(255,255,255,.8),46vw 1vh rgba(255,255,255,.9),67vw 14vh rgba(255,255,255,.75);
  animation:snowFall 19s linear infinite 2s;
}
@keyframes petalFall{to{transform:translate(12vw,110vh) rotate(520deg)}}
@keyframes leafFall{to{transform:translate(18vw,110vh) rotate(620deg)}}
@keyframes snowFall{to{transform:translate(5vw,110vh)}}
@keyframes summerBreath{50%{transform:scale(1.18);opacity:.4}}
@keyframes summerLight{50%{opacity:.7;transform:translateY(18px)}}

body.night{
  color:#192126;
  background:
    radial-gradient(circle at 80% 8%,rgba(115,148,165,.23),transparent 28%),
    radial-gradient(circle at 16% 30%,rgba(255,255,255,.34),transparent 28%),
    linear-gradient(180deg,#e7edef 0%,#dfe7e9 100%);
}
body.night .topbar{
  background:linear-gradient(180deg,rgba(229,236,238,.92),rgba(229,236,238,0));
}
body.night .glass{
  background:linear-gradient(150deg,rgba(250,252,252,.68),rgba(173,198,208,.30));
  box-shadow:0 40px 120px rgba(44,70,82,.16);
}
body.night .season-atmosphere{
  opacity:.72;
}
body.night::after{
  content:"";
  position:fixed;
  width:3px;height:3px;border-radius:50%;
  background:rgba(255,255,255,.92);
  top:19%;left:-10px;
  z-index:0;pointer-events:none;
  box-shadow:18vw 5vh rgba(255,255,255,.7),39vw -4vh rgba(255,255,255,.8),67vw 8vh rgba(255,255,255,.6),84vw -1vh rgba(255,255,255,.75);
  animation:nightDrift 16s linear infinite;
}
@keyframes nightDrift{to{transform:translateX(110vw)}}

.home-selection{
  max-width:1320px;
  margin:auto;
  padding:130px 7vw 150px;
}
.home-selection-stage{
  min-height:520px;
  display:grid;
  grid-template-columns:90px minmax(0,1fr) 180px;
  gap:38px;
  align-items:center;
  cursor:pointer;
  position:relative;
  border-bottom:1px solid var(--line);
}
.home-selection-stage::before{
  content:"";
  position:absolute;inset:58px 0;
  background:radial-gradient(circle at 48% 48%,rgba(255,255,255,.88),rgba(255,255,255,.22) 48%,transparent 75%);
  z-index:-1;
}
.selection-mark{
  font:500 48px 'Shippori Mincho',serif;
  color:var(--accent);
  opacity:.8;
}
.home-selection-stage p{
  margin:0;white-space:pre-line;
  font:500 clamp(32px,4.5vw,62px)/1.88 'Shippori Mincho',serif;
  letter-spacing:.08em;
}
.home-selection>.text-button{
  display:block;margin:28px 0 0 auto;
}

.post-ritual{
  position:fixed;inset:0;z-index:12000;
  display:grid;place-items:center;
  padding:24px;
  background:rgba(244,244,238,.97);
  opacity:0;visibility:hidden;
  transition:opacity .5s ease,visibility .5s ease;
}
.post-ritual.show{opacity:1;visibility:visible}
.post-ritual-inner{text-align:center;max-width:720px}
.post-ritual-inner>span{
  display:block;margin-bottom:38px;
  font-size:9px;letter-spacing:.32em;color:var(--accent);
}
.post-ritual-inner strong{
  display:block;
  font:500 clamp(34px,5vw,62px)/1.75 'Shippori Mincho',serif;
  letter-spacing:.06em;
}
.post-ritual-inner p{
  margin:46px 0 0;
  font:400 16px/2 'Shippori Mincho',serif;
  color:#666;
}

@media(max-width:820px){
  .home-selection{padding:90px 24px 110px}
  .home-selection-stage{
    min-height:480px;
    grid-template-columns:32px minmax(0,1fr);
    gap:13px;
    align-items:start;
    padding:50px 0 30px;
  }
  .selection-mark{
    font-size:29px;
    line-height:1;
    margin-top:8px;
  }
  .home-selection-stage p{
    font-size:clamp(29px,7.8vw,40px);
    line-height:1.88;
    word-break:keep-all;
    overflow-wrap:normal;
  }
  .home-selection-stage .plaque{
    grid-column:2;
    margin-top:22px;
  }
}


/* ===== Verified book-opening layer ===== */
.book-opening{
  position:fixed;
  inset:0;
  z-index:2147483000;
  display:grid;
  place-items:center;
  overflow:hidden;
  background:radial-gradient(circle at 50% 38%,#ffffff 0,#f7f4ec 38%,#e8ebe7 100%);
  perspective:1800px;
  animation:verifiedSceneOut 5.6s cubic-bezier(.4,0,.2,1) forwards;
  pointer-events:none;
}
.book-stage{width:min(820px,90vw);height:min(520px,64vw);min-height:320px;position:relative;transform-style:preserve-3d}
.book-shadow{position:absolute;left:8%;right:8%;bottom:-22px;height:54px;border-radius:50%;background:rgba(37,48,49,.18);filter:blur(24px);animation:shadowOpen 5s ease forwards}
.book{position:absolute;inset:0;transform-style:preserve-3d}
.book-half{position:absolute;top:0;width:50%;height:100%;transform-style:preserve-3d}
.book-left{left:0;transform-origin:right center;animation:verifiedLeftOpen 4.6s cubic-bezier(.2,.75,.2,1) forwards}
.book-right{right:0;transform-origin:left center;animation:verifiedRightOpen 4.6s cubic-bezier(.2,.75,.2,1) forwards}
.book-cover-face,.book-page-face{position:absolute;inset:0;backface-visibility:hidden;border:1px solid rgba(35,45,46,.16)}
.book-cover-face{z-index:3;background:linear-gradient(145deg,#4b5c5f,#26373b 74%);box-shadow:inset 0 0 0 2px rgba(255,255,255,.05)}
.book-left .book-cover-face{border-radius:12px 0 0 12px}
.book-right .book-cover-face{border-radius:0 12px 12px 0}
.book-page-face{z-index:2;background:radial-gradient(circle at 50% 38%,#fffefa,#f0eadc 92%)}
.book-page-left{border-radius:8px 0 0 8px;box-shadow:inset -22px 0 32px rgba(67,61,50,.10)}
.book-page-right{border-radius:0 8px 8px 0;box-shadow:inset 22px 0 32px rgba(67,61,50,.10)}
.book-center-copy{position:absolute;inset:0;z-index:10;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;opacity:0;transform:translateY(12px);animation:verifiedCopy 5.05s ease forwards}
.book-logo{font:500 clamp(58px,8vw,104px)/1 'Shippori Mincho',serif;letter-spacing:.22em;text-indent:.22em;color:#171816}
.book-roman{margin-top:16px;font:400 11px 'Cormorant Garamond',serif;letter-spacing:.66em;color:#6d7471}
.book-tagline{margin-top:38px;font:400 clamp(16px,2.1vw,23px)/1.9 'Shippori Mincho',serif;letter-spacing:.09em;color:#59615e}
@keyframes verifiedLeftOpen{0%,18%{transform:rotateY(0)}68%,100%{transform:rotateY(-172deg)}}
@keyframes verifiedRightOpen{0%,18%{transform:rotateY(0)}68%,100%{transform:rotateY(172deg)}}
@keyframes verifiedCopy{0%,40%{opacity:0;transform:translateY(12px)}58%,88%{opacity:1;transform:none}100%{opacity:0;transform:translateY(-5px)}}
@keyframes verifiedSceneOut{0%,88%{opacity:1;visibility:visible}100%{opacity:0;visibility:hidden}}
@keyframes shadowOpen{0%,18%{transform:scaleX(.65);opacity:.12}68%,100%{transform:scaleX(1);opacity:.22}}
@media(max-width:820px){.book-stage{width:92vw;height:64vw;min-height:300px}.book-logo{font-size:55px}.book-tagline{margin-top:28px;font-size:16px}}
@media(prefers-reduced-motion:reduce){.book-opening{animation-duration:2.8s}.book-left{animation-duration:2.2s}.book-right{animation-duration:2.2s}.book-center-copy{animation-duration:2.5s}}


/* ===== Ver.3.2: Washi + Ink Opening ===== */
.washi-opening{
  position:fixed;
  inset:0;
  z-index:16000;
  display:grid;
  place-items:center;
  overflow:hidden;
  background:
    radial-gradient(circle at 50% 44%,rgba(255,255,255,.96),transparent 30%),
    linear-gradient(180deg,#f6f2e8,#ecece5);
  animation:washiSceneOut 4.8s cubic-bezier(.4,0,.2,1) forwards;
  pointer-events:none;
}

.washi-sheet{
  position:absolute;
  inset:0;
  background:
    repeating-linear-gradient(
      8deg,
      rgba(80,75,60,.018) 0,
      rgba(80,75,60,.018) 1px,
      transparent 1px,
      transparent 8px
    ),
    repeating-linear-gradient(
      94deg,
      rgba(80,75,60,.012) 0,
      rgba(80,75,60,.012) 1px,
      transparent 1px,
      transparent 13px
    ),
    radial-gradient(circle at 22% 18%,rgba(255,255,255,.82),transparent 28%),
    linear-gradient(180deg,#f8f5ec,#f1efe7);
  transform:scale(1.04);
  animation:washiPullBack 4.8s cubic-bezier(.4,0,.2,1) forwards;
}

.washi-sheet::before,
.washi-sheet::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
}
.washi-sheet::before{
  opacity:.34;
  background-image:
    radial-gradient(circle at 10% 12%,rgba(74,68,53,.12) 0 1px,transparent 1.5px),
    radial-gradient(circle at 34% 48%,rgba(74,68,53,.09) 0 1px,transparent 1.5px),
    radial-gradient(circle at 72% 18%,rgba(74,68,53,.08) 0 1px,transparent 1.5px),
    radial-gradient(circle at 88% 72%,rgba(74,68,53,.1) 0 1px,transparent 1.5px);
  background-size:120px 110px,150px 140px,170px 160px,130px 145px;
}
.washi-sheet::after{
  background:
    linear-gradient(90deg,rgba(255,255,255,.28),transparent 18%,transparent 82%,rgba(50,55,52,.035)),
    radial-gradient(circle at 50% 50%,transparent 55%,rgba(50,55,52,.05));
}

.washi-fiber{
  position:absolute;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(90,80,62,.12),transparent);
  transform-origin:left center;
  opacity:.45;
}
.fiber-one{
  width:48vw;
  left:6vw;
  top:28%;
  transform:rotate(6deg);
}
.fiber-two{
  width:44vw;
  right:4vw;
  bottom:26%;
  transform:rotate(-8deg);
}

.ink-bloom{
  position:absolute;
  border-radius:50%;
  filter:blur(10px);
  transform:scale(.08);
  opacity:0;
  mix-blend-mode:multiply;
}
.ink-bloom-one{
  width:260px;
  height:260px;
  left:50%;
  top:43%;
  margin:-130px 0 0 -130px;
  background:
    radial-gradient(circle at 48% 50%,rgba(15,18,17,.33),rgba(18,21,20,.15) 36%,rgba(18,21,20,.04) 64%,transparent 75%);
  animation:inkBloomOne 3.7s ease-out .45s forwards;
}
.ink-bloom-two{
  width:180px;
  height:180px;
  left:55%;
  top:49%;
  margin:-90px 0 0 -90px;
  background:
    radial-gradient(circle at 50% 50%,rgba(21,25,23,.18),rgba(21,25,23,.05) 52%,transparent 74%);
  animation:inkBloomTwo 3.5s ease-out .8s forwards;
}

.washi-title{
  position:absolute;
  inset:0;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  z-index:5;
}

.washi-logo{
  font:500 clamp(62px,9vw,108px)/1 'Shippori Mincho',serif;
  letter-spacing:.23em;
  text-indent:.23em;
  color:#171a18;
  opacity:0;
  filter:blur(6px);
  transform:scale(.98);
  animation:inkTitleReveal 4.1s cubic-bezier(.4,0,.2,1) forwards;
}

.washi-roman{
  margin-top:16px;
  font:400 11px 'Cormorant Garamond',serif;
  letter-spacing:.66em;
  color:#6b706d;
  opacity:0;
  animation:subtleReveal 3.9s ease 1.1s forwards;
}

.washi-tagline{
  margin-top:36px;
  font:400 clamp(16px,2vw,22px)/1.95 'Shippori Mincho',serif;
  letter-spacing:.09em;
  color:#575e5a;
  opacity:0;
  transform:translateY(6px);
  animation:subtleReveal 3.4s ease 1.55s forwards;
}

.ink-drop{
  width:7px;
  height:7px;
  margin-top:34px;
  border-radius:50%;
  background:#242826;
  opacity:0;
  transform:scale(.2);
  box-shadow:0 0 0 0 rgba(36,40,38,.15);
  animation:inkDrop 2.2s ease 2.25s forwards;
}

@keyframes inkBloomOne{
  0%{opacity:0;transform:scale(.08)}
  28%{opacity:.2}
  72%{opacity:.55;transform:scale(1.02)}
  100%{opacity:.18;transform:scale(1.18)}
}
@keyframes inkBloomTwo{
  0%{opacity:0;transform:scale(.08)}
  45%{opacity:.3}
  100%{opacity:.12;transform:scale(1.22)}
}
@keyframes inkTitleReveal{
  0%,18%{opacity:0;filter:blur(9px);transform:scale(.975)}
  48%,78%{opacity:1;filter:blur(0);transform:none}
  100%{opacity:0;filter:blur(1px);transform:translateY(-4px)}
}
@keyframes subtleReveal{
  0%,18%{opacity:0;transform:translateY(8px)}
  44%,80%{opacity:1;transform:none}
  100%{opacity:0;transform:translateY(-4px)}
}
@keyframes inkDrop{
  0%,20%{opacity:0;transform:scale(.2);box-shadow:0 0 0 0 rgba(36,40,38,.15)}
  48%,72%{opacity:1;transform:scale(1);box-shadow:0 0 0 12px rgba(36,40,38,0)}
  100%{opacity:0;transform:scale(.85)}
}
@keyframes washiPullBack{
  0%,80%{transform:scale(1.04);filter:brightness(1)}
  100%{transform:scale(.985);filter:brightness(1.04)}
}
@keyframes washiSceneOut{
  0%,84%{opacity:1;visibility:visible}
  100%{opacity:0;visibility:hidden}
}

@media(max-width:820px){
  .washi-logo{
    font-size:58px;
  }
  .washi-tagline{
    margin-top:30px;
    font-size:16px;
  }
  .ink-bloom-one{
    width:210px;height:210px;
    margin:-105px 0 0 -105px;
  }
  .ink-bloom-two{
    width:145px;height:145px;
    margin:-72px 0 0 -72px;
  }
}


/* =========================================================
   YOH AKU 4.0 — Brand refinement
   Visual-only layer. Existing functions and IDs are preserved.
   ========================================================= */

:root{
  --paper-warm:#f6f2e8;
  --paper-light:#fcfbf7;
  --ink-soft:#303633;
  --blue-grey:#79939a;
  --hairline:rgba(28,34,32,.105);
  --museum-shadow:0 34px 100px rgba(55,72,75,.085);
}

body{
  background:
    radial-gradient(circle at 16% 9%,rgba(255,255,255,.94),transparent 27%),
    radial-gradient(circle at 86% 18%,rgba(204,222,223,.24),transparent 31%),
    repeating-linear-gradient(7deg,rgba(92,82,64,.012) 0 1px,transparent 1px 11px),
    linear-gradient(180deg,#faf9f4 0%,#f1f3ef 100%);
}

body::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:-2;
  pointer-events:none;
  opacity:.45;
  background:
    radial-gradient(circle at 12% 18%,rgba(52,62,58,.055) 0 1px,transparent 1.5px),
    radial-gradient(circle at 74% 28%,rgba(52,62,58,.035) 0 1px,transparent 1.5px);
  background-size:170px 145px,210px 190px;
}

/* Header / identity */
.topbar{
  padding:24px 5vw 28px;
  border-bottom:1px solid transparent;
  transition:border-color .35s,background .35s,box-shadow .35s;
}
.topbar.scrolled{
  background:rgba(247,246,240,.82);
  border-color:var(--hairline);
  box-shadow:0 10px 40px rgba(50,65,68,.045);
  backdrop-filter:blur(18px);
}
.brand-mark{
  width:19px;
  height:19px;
  border-color:rgba(24,28,27,.52);
}
.brand-mark::before{
  content:"";
  position:absolute;
  left:4px;
  top:4px;
  width:8px;
  height:1px;
  background:rgba(24,28,27,.42);
  transform:rotate(-42deg);
  transform-origin:left center;
}
.brand-mark::after{
  width:7px;
  height:7px;
  background:var(--blue-grey);
  box-shadow:0 0 0 4px rgba(121,147,154,.08);
}
.brand b{font-weight:600;letter-spacing:.29em}
nav button{
  position:relative;
  padding:7px 0;
  transition:color .25s;
}
nav button::after{
  content:"";
  position:absolute;
  left:50%;
  bottom:0;
  width:0;
  height:1px;
  background:var(--ink);
  transform:translateX(-50%);
  transition:width .25s ease;
}
nav button:hover::after{width:100%}

/* Hero as an editorial cover */
.hero{
  padding-top:136px;
  min-height:104svh;
}
.hero-copy{
  position:relative;
  z-index:2;
}
.hero-edition{
  position:absolute;
  left:0;
  top:54px;
  font:400 8px 'Manrope',sans-serif;
  letter-spacing:.23em;
  color:#939993;
}
.hero h1{
  text-shadow:0 1px 0 rgba(255,255,255,.7);
}
.hero-text{
  max-width:720px;
  text-wrap:balance;
}
.hero-note{
  display:inline-flex;
  align-items:center;
  gap:14px;
}
.hero-note::before{
  content:"";
  width:42px;
  height:1px;
  background:var(--blue-grey);
}
.glass{
  border-radius:2px;
  box-shadow:
    0 46px 130px rgba(58,78,82,.13),
    inset 0 0 0 1px rgba(255,255,255,.42);
  transition:transform .6s cubic-bezier(.2,.8,.2,1);
}
.glass::after{
  content:"TODAY / 31";
  position:absolute;
  right:-24px;
  top:34px;
  writing-mode:vertical-rl;
  font:400 8px 'Manrope',sans-serif;
  letter-spacing:.28em;
  color:var(--blue-grey);
}
.glass:hover{
  transform:rotate(1.2deg) translateY(-7px);
}

/* Editorial pacing */
.museum-intro,
.today-gallery,
.counter-section,
.statement,
.home-theme,
.bookmarks,
.discover,
.ranking,
.archive{
  position:relative;
}
.museum-intro::before,
.today-gallery::before,
.archive::before{
  content:"";
  position:absolute;
  left:7vw;
  top:72px;
  width:22px;
  height:1px;
  background:var(--blue-grey);
}
.museum-copy{
  text-wrap:balance;
}
.today-stage{
  padding:34px 0;
}
.today-stage::after{
  content:"";
  position:absolute;
  left:6%;
  right:6%;
  bottom:25%;
  height:40%;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.38),transparent);
  filter:blur(26px);
  z-index:-2;
}
.today-stage p,
.poem-row p,
.ranking-item p{
  text-wrap:pretty;
}

/* Poem rows become unframed paper exhibits */
.poem-row,
.ranking-item,
.bookmark-item{
  position:relative;
  padding-right:22px;
}
.poem-row::after,
.ranking-item::after,
.bookmark-item::after{
  content:"";
  position:absolute;
  inset:14px 0;
  z-index:-1;
  opacity:0;
  background:
    linear-gradient(100deg,rgba(255,255,255,.65),rgba(255,255,255,.2)),
    repeating-linear-gradient(5deg,rgba(85,75,55,.012) 0 1px,transparent 1px 9px);
  box-shadow:var(--museum-shadow);
  transition:opacity .35s;
}
.poem-row:hover::after,
.ranking-item:hover::after,
.bookmark-item:hover::after{opacity:1}

/* Search feels like an archive desk */
.discover-tools{
  padding:48px 0 52px;
}
.search-box{
  padding:22px 24px 17px;
  border:1px solid rgba(255,255,255,.7);
  background:rgba(255,255,255,.38);
  box-shadow:0 18px 55px rgba(58,72,72,.05);
}
.search-box input{
  letter-spacing:.035em;
}
.tag-filter button{
  border-radius:999px;
  padding:10px 17px;
}
.tag-filter button.active{
  box-shadow:0 8px 22px rgba(22,25,24,.12);
}

/* Writing page becomes stationery */
.write-layout{
  max-width:1160px;
  gap:92px;
}
.write-layout>div:first-child{
  position:sticky;
  top:145px;
  align-self:start;
}
.letter-note{
  margin-bottom:16px;
  padding-left:16px;
  border-left:1px solid var(--blue-grey);
  font:400 11px/1.9 'Shippori Mincho',serif;
  letter-spacing:.09em;
  color:#7c827e;
}
form{
  position:relative;
  padding:52px 54px;
  background:
    repeating-linear-gradient(6deg,rgba(88,76,56,.014) 0 1px,transparent 1px 10px),
    rgba(255,254,249,.72);
  border:1px solid rgba(255,255,255,.92);
  box-shadow:
    0 40px 110px rgba(56,72,73,.10),
    inset 0 0 0 1px rgba(80,70,52,.025);
}
form::before{
  content:"YOH AKU / LETTER";
  position:absolute;
  right:28px;
  top:24px;
  font:400 8px 'Manrope',sans-serif;
  letter-spacing:.26em;
  color:#a0a49f;
}
textarea{
  font-size:21px;
}

/* Editorial room as a small publisher */
.editorial-page{
  position:relative;
}
.editorial-stamp{
  width:76px;
  height:76px;
  display:grid;
  place-items:center;
  margin-bottom:34px;
  border:1px solid rgba(125,157,168,.62);
  color:var(--blue-grey);
  font:500 35px 'Shippori Mincho',serif;
  transform:rotate(-3deg);
}
.editorial-letter{
  position:relative;
  padding-left:46px;
  border-left:1px solid var(--hairline);
}
.editorial-letter::before{
  content:"01";
  position:absolute;
  left:-19px;
  top:103px;
  padding:7px 0;
  background:var(--paper-light);
  font:400 27px 'Cormorant Garamond',serif;
  color:var(--blue-grey);
}
.editorial-grid section{
  overflow:hidden;
}
.editorial-grid section::after{
  content:"";
  position:absolute;
  width:170px;
  height:170px;
  right:-62px;
  bottom:-70px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(125,157,168,.13),transparent 70%);
}
.editorial-grid section{position:relative}

/* Detail becomes an exhibition room */
.detail-layout{
  background:
    radial-gradient(circle at 63% 44%,rgba(255,255,255,.58),transparent 33%);
}
.detail-poem{
  text-wrap:pretty;
}
.detail-actions button{
  transition:background .25s,color .25s,border-color .25s;
}
.detail-actions button:hover{
  border-color:#202423;
  background:#202423;
  color:#fff;
}

/* Night brand */
body.night{
  --ink:#182126;
  --line:rgba(34,55,63,.12);
  background:
    radial-gradient(circle at 78% 9%,rgba(188,211,220,.27),transparent 30%),
    repeating-linear-gradient(7deg,rgba(40,68,78,.012) 0 1px,transparent 1px 12px),
    linear-gradient(180deg,#eaf0f1,#dde7e8);
}
body.night form,
body.night .search-box,
body.night .editorial-grid section{
  background:rgba(247,251,251,.55);
}

/* Opening fades into the site, shown once per browser session */
.washi-opening{
  animation-duration:4.35s;
}
.washi-sheet{
  animation:washiPullBack 4.35s cubic-bezier(.4,0,.2,1) forwards;
}
.washi-opening.is-leaving{
  mix-blend-mode:normal;
}

/* Accessibility */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{
    scroll-behavior:auto!important;
    animation-duration:.001ms!important;
    animation-iteration-count:1!important;
    transition-duration:.001ms!important;
  }
}

/* Mobile brand refinements */
@media(max-width:820px){
  .topbar{padding:18px 20px}
  .hero{padding-top:118px}
  .hero-edition{
    position:static;
    margin:-10px 0 30px;
  }
  .hero-note::before{width:28px}
  .glass::after{right:-16px}
  .museum-intro::before,
  .today-gallery::before,
  .archive::before{
    left:24px;
    top:48px;
  }
  form{
    padding:38px 24px 32px;
  }
  form::before{
    right:20px;
    top:18px;
  }
  .write-layout>div:first-child{position:static}
  .editorial-stamp{
    width:60px;height:60px;font-size:29px;
  }
  .editorial-letter{
    padding-left:24px;
  }
}


/* ===== Posting route restoration ===== */
.hero-write-button{
  margin:42px 0 0 8%;
  display:inline-flex;
  align-items:center;
  gap:22px;
  border:1px solid rgba(23,24,22,.32);
  background:rgba(255,255,255,.32);
  padding:15px 22px;
  transition:.28s ease;
  box-shadow:0 14px 40px rgba(58,72,72,.055);
}
.hero-write-button span{
  font:400 8px 'Manrope',sans-serif;
  letter-spacing:.24em;
  color:#7f8782;
}
.hero-write-button strong{
  font:500 15px 'Shippori Mincho',serif;
  letter-spacing:.12em;
}
.hero-write-button:hover{
  background:#1d2220;
  color:#fff;
  transform:translateY(-2px);
}
.hero-write-button:hover span{color:rgba(255,255,255,.65)}

.post-invitation{
  max-width:1320px;
  margin:0 auto;
  padding:110px 7vw 140px;
  display:grid;
  grid-template-columns:1fr auto;
  gap:70px;
  align-items:end;
  border-top:1px solid var(--hairline);
  border-bottom:1px solid var(--hairline);
}
.post-invitation-copy>span{
  font:400 9px 'Manrope',sans-serif;
  letter-spacing:.3em;
  color:var(--blue-grey);
}
.post-invitation h2{
  margin:24px 0 25px;
  font:500 clamp(34px,4.5vw,62px)/1.7 'Shippori Mincho',serif;
  letter-spacing:.045em;
}
.post-invitation p{
  margin:0;
  font:400 14px/2.1 'Shippori Mincho',serif;
  color:#707671;
}
.post-invitation-button{
  width:190px;
  height:190px;
  border-radius:50%;
  border:1px solid rgba(29,34,32,.25);
  background:
    radial-gradient(circle at 35% 30%,rgba(255,255,255,.8),rgba(255,255,255,.28));
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:14px;
  box-shadow:0 24px 70px rgba(56,72,73,.08);
  transition:.35s cubic-bezier(.2,.8,.2,1);
}
.post-invitation-button span{
  font:500 15px 'Shippori Mincho',serif;
  letter-spacing:.12em;
}
.post-invitation-button b{
  font-size:23px;
  font-weight:300;
}
.post-invitation-button:hover{
  transform:rotate(4deg) scale(1.03);
  background:#202523;
  color:#fff;
}

.mobile-cta{
  border-radius:999px;
  font-weight:600;
  letter-spacing:.1em;
  box-shadow:0 14px 42px rgba(43,59,61,.18);
}

@media(max-width:820px){
  .hero-write-button{
    margin-left:0;
    margin-top:34px;
  }
  .post-invitation{
    padding:84px 24px 104px;
    grid-template-columns:1fr;
    gap:36px;
    align-items:start;
  }
  .post-invitation h2{
    font-size:34px;
    line-height:1.72;
  }
  .post-invitation-button{
    width:145px;
    height:145px;
    justify-self:end;
  }
}


/* ===== Monetization readiness / legal footer ===== */
.site-footer{
  display:grid;
  grid-template-columns:1fr auto;
  gap:44px 70px;
  padding:70px 6vw 38px;
  border-top:1px solid var(--line);
  background:rgba(250,249,245,.52);
}
.footer-brand{
  display:flex;
  flex-direction:column;
  gap:13px;
}
.footer-brand b{
  font:600 27px 'Shippori Mincho',serif;
  letter-spacing:.24em;
}
.footer-brand span{
  font:400 11px 'Shippori Mincho',serif;
  letter-spacing:.12em;
  color:#777;
}
.footer-links{
  display:grid;
  grid-template-columns:repeat(2,minmax(130px,1fr));
  gap:16px 32px;
  align-content:start;
}
.footer-links a{
  color:var(--ink);
  text-decoration:none;
  font:400 11px 'Shippori Mincho',serif;
  letter-spacing:.1em;
  border-bottom:1px solid transparent;
  padding-bottom:5px;
}
.footer-links a:hover{border-color:var(--ink)}
.footer-bottom{
  grid-column:1/-1;
  display:flex;
  justify-content:space-between;
  padding-top:30px;
  border-top:1px solid var(--line);
  font-size:8px;
  letter-spacing:.2em;
  color:#777;
}
.cookie-notice{
  position:fixed;
  left:22px;
  right:22px;
  bottom:22px;
  z-index:20000;
  max-width:860px;
  margin:auto;
  display:flex;
  align-items:center;
  gap:26px;
  padding:18px 20px;
  background:rgba(247,245,239,.97);
  border:1px solid rgba(24,28,27,.14);
  box-shadow:0 20px 70px rgba(43,59,61,.16);
  backdrop-filter:blur(14px);
}
.cookie-notice[hidden]{display:none}
.cookie-notice p{
  margin:0;
  flex:1;
  font:400 11px/1.9 'Shippori Mincho',serif;
  color:#5f6561;
}
.cookie-notice a{color:inherit}
.cookie-notice button{
  flex:none;
  border:1px solid #252a28;
  background:#252a28;
  color:#fff;
  padding:11px 15px;
  font:500 10px 'Shippori Mincho',serif;
  letter-spacing:.1em;
}
@media(max-width:820px){
  .site-footer{
    grid-template-columns:1fr;
    gap:36px;
    padding:58px 24px 105px;
  }
  .footer-links{
    grid-template-columns:1fr 1fr;
    gap:17px 18px;
  }
  .footer-bottom{
    flex-direction:column;
    gap:10px;
  }
  .cookie-notice{
    align-items:stretch;
    flex-direction:column;
    gap:14px;
    left:14px;
    right:14px;
    bottom:76px;
  }
  .cookie-notice button{align-self:flex-end}
}


/* ===== Hero logo refinement ===== */
.hero-copy{
  padding-top:28px;
}

.hero .kicker{
  margin-bottom:42px;
  gap:12px;
  font-size:8px;
  letter-spacing:.38em;
  color:rgba(125,157,168,.72);
}

.hero .kicker::before{
  width:44px;
  opacity:.72;
}

.hero h1{
  margin-top:0;
  letter-spacing:.19em;
  text-indent:.19em;
}

.hero .roman{
  margin-top:30px;
  margin-left:4px;
  font-size:16px;
  letter-spacing:.88em;
  color:rgba(65,71,68,.72);
}

.hero-text{
  margin-top:112px;
}

@media(max-width:820px){
  .hero-copy{
    padding-top:8px;
  }

  .hero .kicker{
    margin-bottom:30px;
    font-size:7px;
    letter-spacing:.30em;
  }

  .hero .kicker::before{
    width:30px;
  }

  .hero h1{
    font-size:70px;
    letter-spacing:.16em;
    text-indent:.16em;
  }

  .hero .roman{
    margin-top:22px;
    font-size:13px;
    letter-spacing:.62em;
  }

  .hero-text{
    margin-top:76px;
  }
}


/* ===== Writing page layout fix: stationery sits below the theme ===== */
.write-layout{
  grid-template-columns:minmax(300px,.78fr) minmax(520px,1.22fr);
  align-items:start;
}
.write-intro{
  grid-column:1;
  grid-row:1;
  position:sticky;
  top:145px;
  align-self:start;
  z-index:1;
}
.write-compose{
  grid-column:2;
  grid-row:1;
  min-width:0;
}
.write-compose .write-theme{
  margin-bottom:18px;
}
.write-compose .letter-note{
  margin:0 0 22px;
}
.write-compose form{
  width:100%;
  margin:0;
  box-sizing:border-box;
}
@media(max-width:820px){
  .write-layout{
    grid-template-columns:1fr;
    gap:46px;
  }
  .write-intro,
  .write-compose{
    grid-column:1;
    grid-row:auto;
  }
  .write-intro{
    position:static;
  }
  .write-compose .write-theme{
    margin-top:0;
  }
}


/* ===== Contact page refinement ===== */
.contact-page{
  max-width:1180px;
  margin:auto;
  padding:140px 6vw 120px;
}
.contact-back{
  display:inline-block;
  margin-bottom:72px;
  color:#6d7470;
  text-decoration:none;
  font:400 10px 'Shippori Mincho',serif;
  letter-spacing:.14em;
}
.contact-intro{
  max-width:760px;
  margin-bottom:78px;
}
.contact-intro>span{
  font:400 9px 'Manrope',sans-serif;
  letter-spacing:.31em;
  color:var(--accent);
}
.contact-intro h1{
  margin:20px 0 34px;
  font:500 clamp(58px,9vw,108px)/1.18 'Shippori Mincho',serif;
  letter-spacing:.08em;
}
.contact-intro p{
  margin:0;
  font:400 clamp(19px,2.4vw,29px)/2 'Shippori Mincho',serif;
  letter-spacing:.055em;
}
.contact-intro small{
  display:block;
  margin-top:28px;
  color:#7d837f;
  font:400 11px 'Shippori Mincho',serif;
  letter-spacing:.12em;
}

.contact-letter{
  position:relative;
  max-width:900px;
  margin-left:auto;
  padding:54px 58px 48px;
  background:
    repeating-linear-gradient(7deg,rgba(90,78,56,.015) 0 1px,transparent 1px 10px),
    linear-gradient(180deg,rgba(255,254,249,.94),rgba(248,246,238,.92));
  border:1px solid rgba(255,255,255,.94);
  box-shadow:
    0 44px 120px rgba(54,69,70,.11),
    inset 0 0 0 1px rgba(89,75,52,.025);
}
.contact-letter::before{
  content:"";
  position:absolute;
  inset:17px;
  border:1px solid rgba(77,82,78,.06);
  pointer-events:none;
}
.contact-letter-head{
  position:relative;
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:48px;
  padding-bottom:16px;
  border-bottom:1px solid rgba(40,45,42,.12);
}
.contact-letter-head span{
  font:400 8px 'Manrope',sans-serif;
  letter-spacing:.28em;
  color:#8a918c;
}
.contact-letter-head b{
  font:500 20px 'Shippori Mincho',serif;
  letter-spacing:.18em;
}
.contact-form{
  position:relative;
  display:grid;
  gap:34px;
  padding:0;
  background:none;
  border:0;
  box-shadow:none;
}
.contact-form::before{display:none}
.contact-form label{
  display:grid;
  gap:12px;
}
.contact-form label>span{
  font:500 11px 'Shippori Mincho',serif;
  letter-spacing:.13em;
  color:#59615d;
}
.contact-form input,
.contact-form textarea{
  width:100%;
  box-sizing:border-box;
  border:0;
  border-bottom:1px solid rgba(34,39,36,.18);
  background:transparent;
  outline:0;
  padding:11px 2px 14px;
  color:var(--ink);
  font:400 16px/2 'Shippori Mincho',serif;
  letter-spacing:.045em;
}
.contact-form textarea{
  min-height:220px;
  resize:vertical;
  background:
    repeating-linear-gradient(
      to bottom,
      transparent 0,
      transparent 37px,
      rgba(57,62,59,.075) 38px
    );
  line-height:38px;
  padding-top:1px;
}
.contact-form input::placeholder,
.contact-form textarea::placeholder{
  color:#aaa9a2;
}
.contact-submit{
  justify-self:end;
  min-width:190px;
  margin-top:12px;
  padding:14px 0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:28px;
  border:0;
  border-top:1px solid rgba(29,34,31,.42);
  border-bottom:1px solid rgba(29,34,31,.42);
  background:transparent;
  color:var(--ink);
  transition:.28s ease;
}
.contact-submit span{
  font:500 14px 'Shippori Mincho',serif;
  letter-spacing:.13em;
}
.contact-submit i{
  font-style:normal;
  font-size:20px;
}
.contact-submit:hover{
  padding-left:16px;
  padding-right:16px;
  background:#202523;
  color:#fff;
}
.contact-status{
  position:relative;
  margin:34px 0 0;
  padding:19px 22px;
  border-left:1px solid var(--accent);
  background:rgba(125,157,168,.075);
  color:#6b716d;
  font:400 11px/1.9 'Shippori Mincho',serif;
  opacity:.82;
}
.contact-status.is-visible{
  animation:contactFade .45s ease;
}
@keyframes contactFade{
  from{opacity:.15;transform:translateY(8px)}
  to{opacity:.82;transform:none}
}
.contact-note{
  max-width:700px;
  margin:90px 0 0 auto;
  padding-top:34px;
  border-top:1px solid var(--line);
}
.contact-note h2{
  margin:0 0 18px;
  font:500 23px 'Shippori Mincho',serif;
  letter-spacing:.08em;
}
.contact-note p{
  margin:0;
  color:#686e69;
  font:400 13px/2.15 'Shippori Mincho',serif;
}

@media(max-width:820px){
  .contact-page{
    padding:116px 24px 100px;
  }
  .contact-back{
    margin-bottom:50px;
  }
  .contact-intro{
    margin-bottom:52px;
  }
  .contact-intro h1{
    font-size:62px;
  }
  .contact-intro p{
    font-size:19px;
  }
  .contact-letter{
    padding:38px 24px 32px;
  }
  .contact-letter::before{
    inset:10px;
  }
  .contact-letter-head{
    margin-bottom:38px;
  }
  .contact-submit{
    min-width:170px;
  }
  .contact-note{
    margin-top:68px;
  }
}


/* ===== Final polish: literary list, footer, empty state, post ritual ===== */

/* Splash */
.washi-logo{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:18px;
}
.washi-logo-main{
  display:block;
}
.washi-logo-line{
  display:block;
  width:52px;
  height:1px;
  background:rgba(31,35,33,.42);
  transform:scaleX(0);
  transform-origin:center;
  animation:washiLogoLine 3.7s ease 1.05s forwards;
}
@keyframes washiLogoLine{
  0%,20%{transform:scaleX(0);opacity:0}
  48%,78%{transform:scaleX(1);opacity:1}
  100%{transform:scaleX(.65);opacity:0}
}

/* Poem list as literary archive */
.poem-row{
  position:relative;
  display:grid;
  grid-template-columns:72px minmax(0,1fr) 190px;
  gap:34px;
  align-items:start;
  padding:64px 18px 64px 0;
  border-bottom:1px solid var(--line);
  transition:padding-left .28s ease, background .28s ease;
}
.poem-row::before{
  content:"";
  position:absolute;
  left:0;
  top:24px;
  bottom:24px;
  width:1px;
  background:linear-gradient(180deg,transparent,var(--accent),transparent);
  opacity:0;
  transition:opacity .28s ease;
}
.poem-row:hover{
  padding-left:18px;
  background:linear-gradient(90deg,rgba(255,255,255,.52),rgba(255,255,255,0));
}
.poem-row:hover::before{opacity:.55}
.poem-row .no{
  font:400 31px 'Cormorant Garamond',serif;
  color:var(--accent);
  line-height:1;
  padding-top:8px;
}
.poem-row p{
  margin:0;
  white-space:pre-line;
  font:500 clamp(26px,3.2vw,42px)/1.95 'Shippori Mincho',serif;
  letter-spacing:.055em;
  word-break:keep-all;
  overflow-wrap:normal;
}
.poem-meta{
  display:flex;
  flex-direction:column;
  gap:12px;
  padding-top:9px;
  font-size:9px;
  letter-spacing:.15em;
  color:#777;
}

/* Empty archive */
.archive-empty{
  padding:110px 0 120px;
  text-align:center;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.archive-empty strong{
  display:block;
  font:500 clamp(28px,4vw,46px)/1.75 'Shippori Mincho',serif;
  letter-spacing:.06em;
}
.archive-empty p{
  margin:28px 0 0;
  font:400 13px/2 'Shippori Mincho',serif;
  color:#777;
}
.archive-empty button{
  margin-top:34px;
  border:0;
  border-bottom:1px solid var(--ink);
  background:transparent;
  padding:8px 2px;
  font:500 12px 'Shippori Mincho',serif;
  letter-spacing:.12em;
}

/* Post-complete ritual */
.post-complete{
  position:fixed;
  inset:0;
  z-index:22000;
  display:grid;
  place-items:center;
  padding:24px;
  background:
    repeating-linear-gradient(7deg,rgba(83,73,55,.012) 0 1px,transparent 1px 10px),
    rgba(247,245,238,.975);
  opacity:0;
  visibility:hidden;
  transition:opacity .55s ease, visibility .55s ease;
}
.post-complete.show{
  opacity:1;
  visibility:visible;
}
.post-complete-inner{
  text-align:center;
  max-width:720px;
}
.post-complete-inner>span{
  display:block;
  margin-bottom:40px;
  font:400 9px 'Manrope',sans-serif;
  letter-spacing:.3em;
  color:var(--accent);
}
.post-complete-inner strong{
  display:block;
  font:500 clamp(40px,6vw,72px)/1.6 'Shippori Mincho',serif;
  letter-spacing:.075em;
}
.post-complete-inner p{
  margin:44px 0 0;
  font:400 16px/2 'Shippori Mincho',serif;
  color:#686e69;
}

/* Footer */
.site-footer{
  position:relative;
  padding-top:86px;
}
.site-footer::before{
  content:"";
  position:absolute;
  left:6vw;
  right:6vw;
  top:0;
  height:1px;
  background:linear-gradient(90deg,transparent,var(--line),transparent);
}
.footer-kicker{
  font:400 8px 'Manrope',sans-serif!important;
  letter-spacing:.3em!important;
  color:var(--accent)!important;
  margin-bottom:5px;
}
.footer-brand b{
  font-size:31px;
}
.footer-links a{
  position:relative;
}
.footer-links a::after{
  content:"";
  position:absolute;
  left:0;
  right:100%;
  bottom:0;
  height:1px;
  background:var(--ink);
  transition:right .25s ease;
}
.footer-links a:hover::after{
  right:0;
}

@media(max-width:820px){
  .poem-row{
    grid-template-columns:34px minmax(0,1fr);
    gap:14px;
    padding:50px 0;
  }
  .poem-row .no{
    font-size:25px;
  }
  .poem-row p{
    font-size:clamp(25px,6.8vw,34px);
    line-height:1.9;
  }
  .poem-meta{
    grid-column:2;
    margin-top:8px;
  }
  .archive-empty{
    padding:82px 0 92px;
  }
  .site-footer{
    padding-top:68px;
  }
}


/* ===== Critical fix: post-complete overlay must never appear in page flow ===== */
#postComplete.post-complete{
  position:fixed !important;
  inset:0 !important;
  z-index:22000 !important;
  display:none !important;
  place-items:center !important;
  width:100vw !important;
  height:100vh !important;
  margin:0 !important;
  padding:24px !important;
  box-sizing:border-box !important;
  overflow:hidden !important;
  opacity:0 !important;
  visibility:hidden !important;
  pointer-events:none !important;
  background:
    repeating-linear-gradient(7deg,rgba(83,73,55,.012) 0 1px,transparent 1px 10px),
    rgba(247,245,238,.975) !important;
}
#postComplete.post-complete.show{
  display:grid !important;
  opacity:1 !important;
  visibility:visible !important;
  pointer-events:auto !important;
  animation:postCompleteFadeIn .48s ease both !important;
}
#postComplete .post-complete-inner{
  text-align:center !important;
  max-width:720px !important;
  margin:auto !important;
}
#postComplete .post-complete-inner>span{
  display:block !important;
  margin-bottom:34px !important;
  font:400 8px 'Manrope',sans-serif !important;
  letter-spacing:.28em !important;
  color:var(--accent) !important;
}
#postComplete .post-complete-inner strong{
  display:block !important;
  font:500 clamp(38px,6vw,68px)/1.55 'Shippori Mincho',serif !important;
  letter-spacing:.075em !important;
}
#postComplete .post-complete-inner p{
  margin:38px 0 0 !important;
  font:400 15px/2 'Shippori Mincho',serif !important;
  color:#686e69 !important;
}
@keyframes postCompleteFadeIn{
  from{opacity:0}
  to{opacity:1}
}