@import url('https://fonts.googleapis.com/css2?family=Shippori+Mincho:wght@400;500;600;700&family=Zen+Kaku+Gothic+New:wght@300;400;500&family=Zen+Old+Mincho:wght@400;600;700&family=Zen+Maru+Gothic:wght@400;500;700&family=Sawarabi+Gothic&family=Josefin+Sans:wght@400;500;600&family=EB+Garamond:ital@1&display=swap');

:root{
  --ink:#2A2C4A;
  --navy:#3B3D66;
  --gold:#C9A063;
  --lavender:#A99BC9;
  --lavender-bg:#DCD5E8;
  --paper:#F5F0E6;
  --card:#FBF8F1;
}

*{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--ink);font-family:'Zen Kaku Gothic New',system-ui,sans-serif}
a{color:var(--navy);text-decoration:none}
a:hover{color:var(--gold)}

.site{max-width:1116px;margin:0 auto;padding:0 78px 74px;position:relative;z-index:1}

/* header */
.site-header{display:flex;align-items:center;flex-wrap:wrap;gap:24px 40px;padding:40px 0 0}
.brand-link{display:block}
.brand-link:hover .brand-ja{color:var(--gold)}
.brand-ja{font:400 23px/1 'Sawarabi Gothic',sans-serif;letter-spacing:.18em;color:var(--navy)}
.brand-en{font-family:'Josefin Sans',sans-serif;font-weight:400;font-size:13px;letter-spacing:.16em;color:var(--lavender);margin-top:7px;text-transform:lowercase}
.site-nav{display:flex;gap:24px;font:500 13.5px/1 'Zen Maru Gothic',sans-serif;color:var(--navy);align-items:baseline}
.nav-about{font-family:'Josefin Sans',sans-serif;font-weight:400;font-size:13px;letter-spacing:.1em;color:var(--lavender);text-transform:lowercase}
.menu-icon{display:none;background:none;border:none;padding:0;cursor:pointer}

/* top page */
.site-tagline{font:400 15px/2.1 'Zen Maru Gothic',sans-serif;color:rgba(42,44,74,.58);letter-spacing:.05em;text-align:center;margin:44px 0 0}

.featured-card{margin:52px 0 0;background:var(--card);border:1px solid rgba(42,44,74,.08);border-radius:24px;padding:50px 54px;box-shadow:0 10px 34px rgba(42,44,74,.06)}
.post-meta{display:flex;align-items:center;gap:14px}
.category-pill{display:inline-block;font:500 11.5px/1 'Zen Maru Gothic',sans-serif;letter-spacing:.12em;color:var(--gold);border:1.5px solid rgba(201,160,99,.5);padding:8px 16px;border-radius:20px}
.post-date{font-family:'Josefin Sans',sans-serif;font-weight:400;font-size:13px;letter-spacing:.1em;color:rgba(42,44,74,.5)}
.featured-head{display:flex;align-items:center;flex-wrap:wrap;gap:16px 26px}
.featured-title{font:400 37px/1.62 'Sawarabi Gothic',sans-serif;letter-spacing:.02em;color:var(--ink);margin:0;text-wrap:balance}
.featured-title a{color:inherit}
.featured-excerpt{font:300 16.5px/2.2 'Zen Kaku Gothic New',sans-serif;color:rgba(42,44,74,.8);margin:20px 0 0;text-wrap:pretty}
.btn-read{display:inline-block;margin-top:28px;font:500 13px/1 'Zen Maru Gothic',sans-serif;letter-spacing:.06em;color:var(--paper);background:var(--navy);padding:13px 25px;border-radius:24px}

.divider{height:0;border-top:2px dotted rgba(169,155,201,.55);margin:56px 0 0}

.post-list{display:flex;flex-direction:column;padding-top:26px}
.post-row{padding:26px 0;border-bottom:1px solid rgba(42,44,74,.09)}
.post-row:last-child{border-bottom:none}
.post-row-head{display:flex;align-items:baseline;flex-wrap:wrap;gap:8px 18px}
.post-row-meta{display:flex;align-items:baseline;gap:14px}
.post-row-category{font:500 11.5px/1 'Zen Maru Gothic',sans-serif;letter-spacing:.1em;color:var(--lavender)}
.post-row-date{font-family:'Josefin Sans',sans-serif;font-weight:400;font-size:12.5px;letter-spacing:.08em;color:rgba(42,44,74,.5)}
.post-row-body h3{font:400 22px/1.5 'Sawarabi Gothic',sans-serif;color:var(--ink);margin:0}
.post-row-body h3 a{color:inherit}
.post-row-body p{font:300 15.5px/1.95 'Zen Kaku Gothic New',sans-serif;color:rgba(42,44,74,.68);margin:9px 0 0}

/* tags */
.tag-list{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:40px;padding-top:32px;border-top:1px solid rgba(42,44,74,.1)}
.tag-label{font:500 11px/1 'Zen Maru Gothic',sans-serif;color:var(--lavender);margin-right:4px}
.tag{font:400 12px/1 'Zen Maru Gothic',sans-serif;color:var(--navy);background:var(--lavender-bg);padding:8px 14px;border-radius:20px}

/* article detail */
.post-detail{max-width:720px;margin:0 auto}
.post-detail-head{text-align:center;padding:66px 0 0}
.post-detail-head .post-meta{display:inline-flex;margin-top:26px}
.post-title{font:400 42px/1.6 'Sawarabi Gothic',sans-serif;letter-spacing:.03em;color:var(--ink);margin:0;text-wrap:balance}
.post-divider{height:0;border-top:2px solid rgba(169,155,201,.55);margin:44px auto 0;width:60px}
.post-body{color:var(--ink);font-size:17.5px;line-height: 1.8;margin-top:44px}
.post-body p{margin:0;text-wrap:pretty}
.post-body p + p{margin-top:1.9em}
.post-body ul + p,.post-body ol + p{margin-top:1.9em}
.pull-quote{margin:44px 0;padding:32px 36px;background:var(--card);border:1px solid rgba(42,44,74,.08);border-radius:20px;font:400 19px/2.1 'Sawarabi Gothic',sans-serif;letter-spacing:.02em;color:var(--navy);text-align:center;text-wrap:balance}
.post-subhead{font:400 24px/1.6 'Sawarabi Gothic',sans-serif;letter-spacing:.05em;color:var(--navy);margin:46px 0 0;padding-bottom: 10px;border-bottom:1px solid var(--lavender)}
.post-subhead-sm{font:400 19px/1.9 'Sawarabi Gothic',sans-serif;letter-spacing:.04em;color:var(--navy);margin:46px 0 0}
.post-subhead-sm span{background:linear-gradient(transparent 62%,rgba(201,160,99,.38) 62%,rgba(201,160,99,.38) 94%,transparent 94%);padding:0 .12em;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.post-subhead-sm + .post-body{margin-top:1.9em}.post-detail .tag-list{margin-top:48px;padding-top:30px}
.post-dedication{font-style:italic;font:300 14px/1.8 'Zen Kaku Gothic New',sans-serif;color:rgba(42,44,74,.55);text-align:center;margin-top:14px}
.post-source{font:400 12px/1.6 'Josefin Sans',sans-serif;letter-spacing:.05em;color:rgba(42,44,74,.45);text-align:center;margin-top:10px}
.post-note-head{font:600 17px/1.8 'Zen Kaku Gothic New',sans-serif;color:var(--navy);margin:2.2em 0 0}
.post-list-plain{margin:1.4em 0 0;padding-left:1.3em;font:400 17px/2 'Zen Kaku Gothic New',sans-serif;color:var(--ink)}
.post-list-plain li{margin:.3em 0}

/* 記事内の目次 */
.post-toc{margin:2.4em 0 0;padding:8px 28px;background:var(--card);border:1px solid rgba(42,44,74,.08);border-radius:14px}
.post-toc-label{display:flex;align-items:center;gap:11px;font:500 13px/1 'Zen Maru Gothic',sans-serif;letter-spacing:.14em;color:var(--navy);padding:14px 0;margin:0;cursor:pointer;list-style:none}
.post-toc-label::-webkit-details-marker{display:none}
.post-toc-label::before{content:'';flex:none;width:0;height:0;border-left:6px solid var(--lavender);border-top:4.5px solid transparent;border-bottom:4.5px solid transparent;transition:transform .2s ease}
.post-toc[open] .post-toc-label::before{transform:rotate(90deg)}
.post-toc ul{list-style:none;margin:0;padding:0 0 10px}
.post-toc li{margin:0;border-top:1px solid rgba(42,44,74,.08)}
.post-toc a{display:block;font:400 14px/1.7 'Josefin Sans','Zen Kaku Gothic New',sans-serif;letter-spacing:.04em;color:rgba(42,44,74,.75);padding:11px 2px;transition:color .2s ease}
.post-toc a:hover{color:var(--gold)}
.post-subhead[id]{scroll-margin-top:24px}

/* external link card */
.link-card{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:1.3em 0;padding:18px 24px;background:var(--card);border:1px solid rgba(42,44,74,.1);border-radius:14px;text-decoration:none;transition:border-color .15s}
.link-card:hover{border-color:var(--gold)}
.link-card:hover .lc-arrow{transform:translate(2px,-2px)}
.lc-title{display:block;font:500 14px/1.6 'Zen Kaku Gothic New',sans-serif;color:#000}
.lc-domain{display:block;font-family:'Josefin Sans',sans-serif;font-weight:400;font-size:11px;letter-spacing:.08em;color:rgba(42,44,74,.45);margin-top:5px;text-transform:lowercase}
.lc-arrow{flex:none;font-size:16px;color:var(--gold);transition:transform .15s}

/* embedded image */
.post-image{margin:1.8em 0;border-radius:16px;overflow:hidden;box-shadow:0 8px 30px rgba(42,44,74,.12);background:var(--card)}
.post-image img{display:block;width:100%;height:auto}
.post-image figcaption{font:400 12px/1.7 'Zen Kaku Gothic New',sans-serif;color:rgba(42,44,74,.5);text-align:center;padding:10px 14px 14px}

/* index filtering */
.filter-banner{display:flex;align-items:baseline;gap:14px;margin:40px 0 0;font:400 27px/1.5 'Sawarabi Gothic',sans-serif;letter-spacing:.05em;color:var(--ink)}
.filter-back{margin:26px 0 0;font:500 13px/1 'Zen Maru Gothic',sans-serif;letter-spacing:.06em;color:var(--navy)}
.filter-back:hover{color:var(--gold)}
.filter-empty{text-align:center;font:300 13px/2.2 'Zen Kaku Gothic New',sans-serif;color:rgba(42,44,74,.5);padding:50px 0}
.tag{text-decoration:none}
a.tag:hover{background:var(--navy);color:var(--paper)}

.post-pager{max-width:1116px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:16px;margin:52px auto 0;padding:30px 78px 74px;border-top:1px solid rgba(42,44,74,.1);font:500 13px/1.5 'Zen Maru Gothic',sans-serif;color:var(--navy)}
.post-pager a{max-width:22em}
.pager-prev{justify-self:start}
.pager-next{justify-self:end;text-align:right}

/* ページャーの矢印（丸いチップ + CSSで描いた矢印） */
a.pager-prev,a.pager-next,a.filter-back{position:relative;display:inline-flex;align-items:center;gap:13px;color:var(--navy)}

/* 円チップ。矢印（軸＋先端2本）はすべてこの円の背景として描くので、
   位置ズレが起きない。斜め線は45度/135度のグラデーションの帯。 */
a.pager-prev::before,a.pager-next::after,a.filter-back::before{
  content:'';
  flex:none;
  width:32px;height:32px;
  border-radius:50%;
  background-color:var(--lavender-bg);
  background-repeat:no-repeat;
  background-size:14px 1.5px,5px 5px,5px 5px;
  color:var(--navy);
  transition:transform .2s ease,background-color .2s ease,box-shadow .2s ease,color .2s ease;
}
a.pager-prev::before,a.filter-back::before{
  background-image:
    linear-gradient(currentColor,currentColor),
    linear-gradient(135deg,transparent calc(50% - .75px),currentColor calc(50% - .75px),currentColor calc(50% + .75px),transparent calc(50% + .75px)),
    linear-gradient(45deg,transparent calc(50% - .75px),currentColor calc(50% - .75px),currentColor calc(50% + .75px),transparent calc(50% + .75px));
  background-position:center,8.8px 11.2px,8.8px 15.8px;
}
a.pager-next::after{
  background-image:
    linear-gradient(currentColor,currentColor),
    linear-gradient(45deg,transparent calc(50% - .75px),currentColor calc(50% - .75px),currentColor calc(50% + .75px),transparent calc(50% + .75px)),
    linear-gradient(135deg,transparent calc(50% - .75px),currentColor calc(50% - .75px),currentColor calc(50% + .75px),transparent calc(50% + .75px));
  background-position:center,18.2px 11.2px,18.2px 15.8px;
}

a.pager-prev:hover::before,a.filter-back:hover::before{transform:translateX(-4px);background-color:var(--gold);color:var(--paper);box-shadow:0 4px 12px rgba(201,160,99,.45)}
a.pager-next:hover::after{transform:translateX(4px);background-color:var(--gold);color:var(--paper);box-shadow:0 4px 12px rgba(201,160,99,.45)}
.pager-index{justify-self:center;font:500 13px/1.5 'Zen Maru Gothic',sans-serif;letter-spacing:.08em;color:var(--lavender);max-width:none;white-space:nowrap}
.pager-index span{font-family:'Josefin Sans',sans-serif;font-weight:400;letter-spacing:.1em;text-transform:lowercase}

/* about への導線バンド */
.about-cta{max-width:1116px;margin:0 auto;padding:0 78px 56px}
.about-cta-inner{background:var(--ink);background: linear-gradient(to bottom, #2b4155, #192c3d 40%, #03111e);border-radius:24px;padding:54px 58px;display:flex;align-items:center;gap:56px}
.about-cta-fig{flex:none;width:270px;height:270px;border-radius:50%;overflow:hidden;box-shadow:0 14px 40px rgba(0,0,0,.28)}
/* 記事詳細では本文と同じ幅（720px）に合わせる */
.about-cta-narrow .about-cta-inner{max-width:720px;margin:0 auto;gap:38px;padding:44px 46px}
.about-cta-narrow .about-cta-fig{width:190px;height:190px}
.about-cta-fig img{display:block;width:100%;height:100%;object-fit:cover}
.about-cta-label{font-family:'Josefin Sans',sans-serif;font-weight:400;font-size:22px;letter-spacing:.16em;text-transform:lowercase;color:var(--gold);margin:0}
.about-cta-label span{font-family:'Zen Maru Gothic',sans-serif;font-weight:500;font-size:19px;letter-spacing:.14em;margin-left:.35em}
.about-cta-text{font:300 15.5px/2.3 'Zen Kaku Gothic New',sans-serif;color:rgba(251,248,241,.78);margin:22px 0 0;max-width:34em;text-wrap:pretty}
.about-cta-foot{display:flex;align-items:center;flex-wrap:wrap;gap:16px 26px;margin-top:32px}
.about-cta-btn{display:inline-block;font:500 14px/1 'Zen Maru Gothic',sans-serif;letter-spacing:.08em;color:var(--ink);background:var(--gold);padding:17px 32px;border-radius:6px;transition:background-color .2s ease,transform .2s ease}
.about-cta-btn:hover{background:#DCB87C;color:var(--ink);transform:translateY(-2px)}

/* mobile */
@media (max-width:600px){
  .about-cta{padding:0 20px 40px}
  .about-cta-inner{flex-direction:column;gap:28px;text-align:center;padding:38px 24px;border-radius:20px}
  .about-cta-fig{width:180px;height:180px}
  .about-cta-label{font-size:23px}
  .about-cta-text{font-size:14px;line-height:2.1}
  .about-cta-foot{justify-content:center;margin-top:26px}

  .site{padding:0 20px 40px}
  .site-header{position:relative;justify-content:space-between;align-items:flex-start;gap:0;padding-top:20px}
  .menu-icon{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:5px;width:32px;height:32px;padding:0;border-radius:50%;transition:background-color .2s ease}
  body.nav-open .menu-icon{background:var(--lavender-bg)}
  .menu-icon span{display:block;width:22px;height:3px;background:var(--navy);border-radius:10px;transition:transform .25s ease,opacity .2s ease,width .2s ease}
  .menu-icon span:last-child{width:15px}
  body.nav-open .menu-icon span:first-child{transform:translateY(8px) rotate(45deg)}
  body.nav-open .menu-icon span:nth-child(2){opacity:0}
  body.nav-open .menu-icon span:last-child{width:22px;transform:translateY(-8px) rotate(-45deg)}
  .site-nav{display:none;position:absolute;top:60px;right:0;min-width:200px;z-index:30;flex-direction:column;align-items:flex-start;gap:20px;font-size:14px;padding:22px 24px;background:var(--card);border:1px solid rgba(42,44,74,.1);border-radius:16px;box-shadow:0 12px 34px rgba(42,44,74,.16)}
  body.nav-open .site-nav{display:flex}

  .site-tagline{margin-top:24px;font-size: 12px;}
  .filter-banner{font-size:20px;margin-top:28px}
  .featured-card{margin-top:24px;padding:15px 20px 20px;border-radius:20px}
  .featured-title{font-size:22px}
  .featured-excerpt{font-size:14.5px;line-height:2;margin-top:10px}
  .category-pill {padding: 4px 10px 5px;}
  .btn-read {margin-top: 15px;font-size: 11px;padding: 9px 13px 10px;}

  .tag-list{margin-top: 20px;}
  .divider{margin-top: 26px;}
  .post-list{padding-top: 5px;}
  .post-row{padding:18px 0}
  .post-row-body h3{font-size:18px}
  .post-row-body p{font-size:13.5px}

  .post-detail-head{padding-top:32px}
  .post-title{font-size:26px}
  .post-body{font-size:15.5px;line-height:1.95;margin-top: 22px;}
  .post-note-head{font-size:15px}
  .post-list-plain{font-size:15px}
  .pull-quote{padding:24px 24px;font-size:16px}
  .post-subhead{font-size:19px}
  .post-subhead-sm{font-size:16px}

  .post-pager{padding:24px 20px 48px;gap:12px;font-size:12px;align-items:start}
  .pager-index{font-size:11px;padding-top:8px}
  a.pager-prev,a.pager-next{flex-direction:column;align-items:center;gap:10px;text-align:center;justify-self:center}
  a.pager-next::after{order:-1}

  .link-card{padding:14px 18px}
  .lc-title{font-size:13px}
}

/* ===== about ページ ===== */
.about-page .post-detail-head{padding-top:56px}
.about-label{font-family:'Josefin Sans',sans-serif;font-weight:400;font-size:22px;letter-spacing:.16em;text-transform:lowercase;color:var(--gold);margin:0 0 14px}
.about-fig{width:230px;height:230px;border-radius:50%;overflow:hidden;margin:40px auto 0;box-shadow:0 14px 40px rgba(42,44,74,.18)}
.about-fig img{display:block;width:100%;height:100%;object-fit:cover}

.anime-open-wrap{text-align:center;margin-top:52px}
.anime-open-btn{display:inline-flex;align-items:center;gap:14px;font:500 14px/1 'Zen Maru Gothic',sans-serif;letter-spacing:.08em;color:var(--paper);background:var(--navy);border:none;padding:17px 30px;border-radius:28px;cursor:pointer;transition:background-color .2s ease,transform .2s ease}
.anime-open-btn:hover{background:var(--gold);color:var(--ink);transform:translateY(-2px)}
.anime-open-count{font-family:'Josefin Sans',sans-serif;font-weight:400;font-size:12px;letter-spacing:.08em;background:rgba(251,248,241,.16);padding:6px 12px;border-radius:14px}
.anime-open-btn:hover .anime-open-count{background:rgba(42,44,74,.12)}

/* ===== index 下部: 夜に沈む about セクション ===== */
.about-night{position:relative;overflow:hidden;padding:100px 24px 100px;background:linear-gradient(180deg,#F5F0E6 0px,#F5EEE3 30px,#F6EDDF 60px,#F6EAD9 90px,#F7E6D0 120px,#F6E1C9 150px,#F4D6C2 180px,#F1CCBB 210px,#EDC2B7 240px,#E6B7B6 270px,#DFADB4 300px,#D4A4B3 330px,#C69BB2 360px,#B893B0 390px,#A98CAD 420px,#9985AA 450px,#8A7EA6 480px,#7A7398 510px,#6B698B 540px,#5C5E7E 570px,#4B4D6C 600px,#3A3C5B 630px,var(--ink) 660px,#22243F 820px,#1B1D3A 100%);background: linear-gradient(to bottom, #2b4155, #192c3d 40%, #03111e);}

/* 海面（境界）付近: 差し込む光と立ち上る泡 */
.sea-surface{position:absolute;top:0;left:0;right:0;height:260px;pointer-events:none;z-index:1}
.sea-surface::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(245,240,230,.14),rgba(245,240,230,.05) 45%,transparent)}
.sea-bubble{position:absolute;bottom:-30px;left:var(--x);width:var(--s);height:var(--s);border-radius:50%;background:radial-gradient(circle at 33% 30%,rgba(255,255,255,.6),rgba(255,255,255,.14) 45%,rgba(255,255,255,.05) 75%,transparent);
background: radial-gradient(#aeaeaea1, #ffffff);box-shadow:inset 0 0 5px rgba(255,255,255,.3),inset -2px -2px 4px rgba(169,155,201,.2);opacity:0;animation:bubble-rise var(--d) linear infinite;animation-delay:var(--dl);will-change:transform,opacity}
.sea-bubble-lav{background:radial-gradient(circle at 33% 30%,rgba(220,213,232,.62),rgba(169,155,201,.2) 48%,rgba(169,155,201,.06) 78%,transparent);
background: radial-gradient(#aeaeae, #ffffff);box-shadow:inset 0 0 5px rgba(220,213,232,.35),inset -2px -2px 4px rgba(169,155,201,.25)}
.sea-bubble-gold{background:radial-gradient(circle at 33% 30%,rgba(240,220,180,.55),rgba(201,160,99,.18) 48%,rgba(201,160,99,.05) 78%,transparent);
background: radial-gradient(#587e84, #ffffffa1);box-shadow:inset 0 0 5px rgba(240,220,180,.3),inset -2px -2px 4px rgba(201,160,99,.22)}
@keyframes bubble-rise{
  0%{transform:translateY(0) translateX(0) scale(.55);opacity:0}
  10%{opacity:.85}
  35%{transform:translateY(-85px) translateX(7px) scale(.72)}
  65%{transform:translateY(-160px) translateX(-6px) scale(.88);opacity:.7}
  90%{opacity:.35}
  100%{transform:translateY(-235px) translateX(3px) scale(1);opacity:0}
}
@media (prefers-reduced-motion:reduce){
  /* 負のdelayで各泡を周期の途中に静止させ、散らばった状態で固定表示する */
  .sea-bubble{animation-delay:calc(-1 * var(--dl));animation-play-state:paused}
}

.about-night-inner{position:relative;z-index:2;max-width:720px;margin:0 auto;text-align:center}
.about-night .about-label{margin-bottom:0}
.about-night .about-fig{margin-top:34px;box-shadow:0 14px 44px rgba(10,10,30,.45)}
.about-night-body{margin-top:48px;text-align:left;font-size:16.5px;line-height:2;color:rgba(251,248,241,.85)}
.about-night-body p{margin:0;text-wrap:pretty}
.about-night-body p + p{margin-top:1.8em}
.about-night-foot{margin-top:52px}
.about-night-btn{display:inline-block;font:500 14px/1 'Zen Maru Gothic',sans-serif;letter-spacing:.08em;color:var(--ink);background:var(--gold);padding:17px 32px;border-radius:28px;transition:background-color .2s ease,transform .2s ease,box-shadow .2s ease}
.about-night-btn:hover{background:#DCB87C;color:var(--ink);transform:translateY(-2px);box-shadow:0 8px 24px rgba(201,160,99,.35)}

@media (max-width:600px){
  .about-night{padding:60px 20px 70px;background:linear-gradient(180deg,#F5F0E6 0px,#F5EEE3 21px,#F6EDDF 42px,#F6EAD9 63px,#F7E6D0 84px,#F6E1C9 105px,#F4D6C2 126px,#F1CCBB 147px,#EDC2B7 168px,#E6B7B6 189px,#DFADB4 210px,#D4A4B3 231px,#C69CB2 252px,#B994B0 273px,#A98CAD 294px,#9A85AA 315px,#8A7EA6 336px,#7A7398 357px,#6B698B 378px,#5C5E7E 399px,#4B4D6C 420px,#3A3C5B 441px,var(--ink) 462px,#22243F 580px,#1B1D3A 100%);
  background: linear-gradient(to bottom, #2b4155, #192c3d 40%, #03111e);}
  .about-night::after{
    background:linear-gradient(180deg,#F5F0E6 0px,#F5EEE3 18px,#F6EDDF 37px,#F6EAD9 55px,#F7E6D0 73px,#F6E1C9 91px,#F4D6C2 110px,#F1CCBB 128px,#EDC2B7 146px,#E6B7B6 164px,#DFADB4 183px,#D4A4B3 201px,#C69BB2 219px,#B893B0 238px,#A98CAD 256px,#9985AA 274px,#8A7EA6 292px,#7A7398 311px,#6B698B 329px,#5C5E7E 347px,#4B4D6C 365px,#3A3C5B 384px,var(--ink) 402px,#22243F 500px,#1B1D3A 100%);
    -webkit-mask-image:radial-gradient(96% 560px at 47% 400px,rgba(0,0,0,0) 0%,rgba(0,0,0,.06) 30%,rgba(0,0,0,.22) 56%,rgba(0,0,0,.5) 78%,rgba(0,0,0,.78) 92%,#000 100%);
    mask-image:radial-gradient(96% 560px at 47% 400px,rgba(0,0,0,0) 0%,rgba(0,0,0,.06) 30%,rgba(0,0,0,.22) 56%,rgba(0,0,0,.5) 78%,rgba(0,0,0,.78) 92%,#000 100%);
  }
  .about-night-body{margin-top:36px;font-size:14.5px;line-height:2}
  .about-night-foot{margin-top:40px}
}

/* ===== 視聴アニメ一覧ドロワー ===== */
.anime-overlay{position:fixed;inset:0;background:rgba(42,44,74,.45);opacity:0;transition:opacity .3s ease;z-index:40}
body.anime-drawer-open .anime-overlay{opacity:1}
body.anime-drawer-open{overflow:hidden}

.anime-drawer{position:fixed;top:0;right:0;bottom:0;width:min(600px,88vw);background:var(--card);box-shadow:-12px 0 44px rgba(42,44,74,.25);transform:translateX(105%);transition:transform .35s cubic-bezier(.22,.7,.3,1);z-index:50;display:flex;flex-direction:column;padding:30px 0 0}
body.anime-drawer-open .anime-drawer{transform:translateX(0)}

.anime-drawer-head{display:flex;align-items:flex-start;justify-content:space-between;padding:0 30px}
.anime-drawer-label{font-family:'Josefin Sans',sans-serif;font-weight:400;font-size:14px;letter-spacing:.16em;text-transform:lowercase;color:var(--gold);margin:0}
.anime-drawer-title{font:400 21px/1.5 'Sawarabi Gothic',sans-serif;letter-spacing:.06em;color:var(--ink);margin:8px 0 0}
.anime-close-btn{flex:none;width:36px;height:36px;border:none;border-radius:50%;background:var(--lavender-bg);color:var(--navy);font-size:19px;line-height:1;cursor:pointer;transition:background-color .2s ease,color .2s ease}
.anime-close-btn:hover{background:var(--navy);color:var(--paper)}
.anime-drawer-note{font:300 12px/1.9 'Zen Kaku Gothic New',sans-serif;color:rgba(42,44,74,.55);margin:16px 0 0;padding:0 30px 18px;border-bottom:1px solid rgba(42,44,74,.1)}

.anime-drawer-body{flex:1;overflow-y:auto;padding:8px 30px 40px;overscroll-behavior:contain}
.anime-row{display:flex;align-items:baseline;gap:14px;margin-top:13px}
.anime-row:first-child{margin-top:16px}
.anime-year{flex:none;min-width:3.6em;font-family:'Josefin Sans','Zen Maru Gothic',sans-serif;font-weight:500;font-size:12.5px;letter-spacing:.08em;color:var(--gold);margin:0}
.anime-year-note{display:block;font:400 10px/1.4 'Zen Maru Gothic',sans-serif;letter-spacing:.06em;color:rgba(42,44,74,.45)}
.anime-items{font:400 13px/1.85 'Zen Kaku Gothic New',sans-serif;color:var(--ink);margin:0}
.anime-item{display:inline}
.anime-item + .anime-item::before{content:'・';color:var(--lavender);margin:0 .45em}
.anime-note{font-size:11px;color:rgba(42,44,74,.5)}

@media (max-width:600px){
  .about-page .post-detail-head{padding-top:32px}
  .about-label{font-size:22px}
  .about-fig{width:170px;height:170px;margin-top:28px}
  .anime-open-wrap{margin-top:38px}
  .anime-drawer{padding-top:22px}
  .anime-drawer-head,.anime-drawer-note,.anime-drawer-body{padding-left:22px;padding-right:22px}
}