/* 文章会：居中、逐层收束的目录。主栏大而安静，次栏与学生时代各自成行。 */
#writings .section-head{display:block;margin-bottom:34px;padding:0;border:0;text-align:center}
#writings .section-head h2{display:inline-block;position:relative;padding:0 0 19px;font-size:clamp(31px,3.2vw,38px);line-height:1.35;letter-spacing:.085em}
#writings .section-head h2::after{content:"";position:absolute;bottom:0;left:50%;width:42px;height:1px;background:color-mix(in srgb,var(--accent) 65%,transparent);transform:translateX(-50%)}
#writings .article-meeting-nav{display:flex;flex-direction:column;align-items:center;gap:18px;width:100%;margin:0 0 34px}
#writings.is-awaiting-choice{padding-bottom:80px}
#writings.is-awaiting-choice .article-meeting-nav{margin-bottom:0}
#writings .experience-tools{position:relative;width:min(100%,680px);margin:0}
#writings .experience-tools::after{content:"";position:absolute;top:100%;left:50%;width:1px;height:18px;background:color-mix(in srgb,var(--accent) 34%,var(--line));pointer-events:none}
#writings .experience-switch{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;padding:0;border:0;border-radius:0;background:transparent}
#writings .experience-switch::before{display:none}
#writings .experience-tab{position:relative;isolation:isolate;display:grid;place-items:center;min-width:0;min-height:84px;overflow:hidden;border:1px solid color-mix(in srgb,var(--line) 86%,transparent);border-radius:19px;padding:16px 19px;background:color-mix(in srgb,var(--card) 57%,var(--paper));color:var(--ink);box-shadow:0 7px 20px rgba(73,54,35,.025);transition:background-color 390ms var(--ease),border-color 390ms var(--ease),box-shadow 390ms var(--ease),transform 390ms var(--ease);cursor:pointer}
#writings .experience-tab::before{content:"";position:absolute;z-index:-1;inset:0;background:color-mix(in srgb,var(--accent) 6%,var(--card));opacity:0;transition:opacity 420ms var(--ease)}
#writings .experience-tab::after{content:"";position:absolute;bottom:0;left:50%;width:48px;height:2px;border-radius:2px;background:var(--accent);opacity:0;transform:translateX(-50%) scaleX(.3);transition:opacity 320ms ease,transform 480ms var(--ease)}
#writings .experience-tab span{font-family:"Songti SC","STSong",serif;font-size:clamp(24px,2.35vw,27px);font-weight:500;line-height:1.3;letter-spacing:.07em;opacity:.42;transition:opacity 380ms var(--ease),color 380ms var(--ease),transform 440ms var(--ease)}
#writings .experience-tab[aria-selected="true"]{border-color:color-mix(in srgb,var(--accent) 32%,var(--line));background:color-mix(in srgb,var(--card) 92%,var(--paper));box-shadow:0 14px 36px rgba(73,54,35,.055);transform:translateY(-2px)}
#writings .experience-tab[aria-selected="true"]::before{opacity:1}
#writings .experience-tab[aria-selected="true"]::after{opacity:1;transform:translateX(-50%) scaleX(1)}
#writings .experience-tab[aria-selected="true"] span{opacity:1;color:var(--ink);animation:writings-title-enter 460ms var(--ease) both}
#writings .story-switch,#writings .fiction-switch{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px;width:min(100%,850px);margin:0;padding:0;border:0;border-radius:0;background:transparent;animation:writings-layer-enter 500ms var(--ease) both}
#writings .story-switch::after{content:"";position:absolute;top:100%;left:50%;width:1px;height:18px;background:color-mix(in srgb,var(--accent) 25%,var(--line));opacity:0;pointer-events:none;transition:opacity 270ms ease}
#writings:has(.school-switch:not([hidden])) .story-switch::after{opacity:1}
#writings .fiction-switch{grid-template-columns:repeat(2,minmax(0,1fr));width:min(100%,820px);gap:15px}
#writings .story-switch[hidden],#writings .fiction-switch[hidden]{display:none!important}
#writings .story-tab,#writings .fiction-tab{position:relative;display:grid;place-items:center;min-width:0;min-height:72px;border:1px solid color-mix(in srgb,var(--line) 85%,transparent);border-radius:17px;padding:12px 13px;background:color-mix(in srgb,var(--paper) 94%,var(--card));color:color-mix(in srgb,var(--ink) 74%,var(--muted));box-shadow:none;cursor:pointer;transition:border-color 260ms ease,background-color 260ms ease,color 260ms ease,box-shadow 280ms ease,transform 300ms var(--ease)}
#writings .story-tab{transition:none}
#writings .fiction-tab{min-height:78px}
#writings .story-tab span,#writings .fiction-tab span{font-family:"Songti SC","STSong",serif;font-size:20px;font-weight:500;line-height:1.3;letter-spacing:.04em;white-space:nowrap}
#writings .story-tab[aria-selected="true"],#writings .fiction-tab[aria-selected="true"]{border-color:color-mix(in srgb,var(--accent) 34%,var(--line));background:color-mix(in srgb,var(--accent) 7%,var(--card));color:var(--ink);box-shadow:0 6px 19px rgba(73,54,35,.045);transform:translateY(-1px)}
#writings .story-tab[aria-selected="true"]{transform:none}
#writings .fiction-tab[aria-selected="true"]{transform:none}
#writings .story-tab[aria-selected="true"]::after,#writings .fiction-tab[aria-selected="true"]::after{content:"";position:absolute;bottom:8px;left:50%;width:19px;height:1px;background:var(--accent);transform:translateX(-50%);opacity:.75}
#writings .story-panel[hidden],#writings .fiction-panel[hidden]{display:none!important}
#writings .experience-panel.is-entering,#writings .story-panel.is-entering,#writings .fiction-panel.is-entering,#writings .school-panel.is-entering{animation:writings-panel-enter 470ms var(--ease) both}
#writings .experience-panel.is-entering .writing-card,#writings .story-panel.is-entering .writing-card,#writings .fiction-panel.is-entering .writing-card,#writings .school-panel.is-entering .writing-card{animation:writings-card-enter 490ms var(--ease) both}
#writings .experience-panel.is-entering .fiction-series .writing-card,#writings .fiction-panel.is-entering .fiction-series .writing-card{animation:none}
#writings .is-entering .writing-card:nth-child(2){animation-delay:45ms}
#writings .is-entering .writing-card:nth-child(3){animation-delay:90ms}
#writings .is-entering .writing-card:nth-child(4){animation-delay:135ms}
#writings .is-entering .writing-card:nth-child(n+5){animation-delay:165ms}
#writings .school-switch{--school-tab-index:0;position:relative;isolation:isolate;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;width:min(100%,510px);margin:0;padding:6px;border:1px solid color-mix(in srgb,var(--line) 84%,transparent);border-radius:999px;background:color-mix(in srgb,var(--paper-2) 72%,var(--paper));overflow:hidden;box-shadow:0 8px 24px rgba(73,54,35,.025);animation:writings-unfold 500ms var(--ease) both}
#writings .school-switch::before{content:"";position:absolute;z-index:-1;top:6px;bottom:6px;left:6px;width:calc((100% - 20px)/3);border-radius:999px;background:color-mix(in srgb,var(--card) 96%,white 4%);box-shadow:0 4px 15px rgba(73,54,35,.07);transform:translateX(calc(var(--school-tab-index) * (100% + 4px)));transition:transform 430ms var(--ease)}
#writings .school-switch[hidden]{display:none!important}
#writings .school-tab{position:relative;z-index:1;min-width:0;min-height:47px;border:0;border-radius:999px;padding:9px 15px;background:transparent;color:var(--muted);font-size:13px;letter-spacing:.06em;transition:color 290ms ease,transform 260ms var(--ease)}
#writings .school-tab[aria-selected="true"]{border:0;background:transparent;color:var(--ink);transform:none}
#writings .story-empty{margin:0;padding:45px 25px;border:1px dashed color-mix(in srgb,var(--line) 92%,transparent);border-radius:18px;color:var(--muted);background:color-mix(in srgb,var(--card) 40%,var(--paper));font-family:"Songti SC","STSong",serif;font-size:15px;line-height:1.8;text-align:center}
#writings .reader-letters-intro{margin-top:2px}
#writings #fiction-panel-letters > .reader-letters-intro,#writings #fiction-panel-letters > .writing-grid{width:min(100%,820px);margin-inline:auto}
#writings #fiction-panel-letters > .writing-grid{grid-template-columns:minmax(0,1fr)}
#writings .fiction-series{width:min(100%,820px);margin:3px auto 0;border-top:1px solid color-mix(in srgb,var(--line) 90%,transparent);border-bottom:1px solid color-mix(in srgb,var(--line) 90%,transparent)}
#writings .fiction-series+.fiction-series{margin-top:0;border-top:0}
#writings .fiction-series-trigger{display:grid;grid-template-columns:45px minmax(0,1fr) 20px;align-items:center;gap:17px;min-height:84px;padding:14px 5px;list-style:none;cursor:pointer}
#writings .fiction-series-trigger::-webkit-details-marker{display:none}
#writings .fiction-series-trigger::marker{content:""}
#writings .fiction-series-trigger:focus-visible{outline:2px solid var(--accent);outline-offset:4px;border-radius:5px}
#writings .fiction-series-number{color:var(--accent);font-family:Georgia,serif;font-size:13px;letter-spacing:.12em}
#writings .fiction-series-title{color:var(--ink);font-family:"Songti SC","STSong",serif;font-size:25px;letter-spacing:.055em}
#writings .fiction-series-chevron{width:10px;height:10px;border-right:1px solid var(--accent);border-bottom:1px solid var(--accent);transform:rotate(45deg);transition:transform 250ms var(--ease)}
#writings .fiction-series[open] .fiction-series-chevron{transform:translateY(4px) rotate(225deg)}
#writings .fiction-series-body{padding:0}
#writings .fiction-series-body > .writing-grid{padding:7px 0 25px}
#writings .fiction-series-body > .writing-grid:empty{display:none}
#writings .fiction-series .story-empty{margin:0;border:0;background:transparent;padding:24px 0 14px;text-align:left}
#writings .fiction-legacy h3{margin:0;color:var(--ink);font-family:"Songti SC","STSong",serif;font-size:23px;font-weight:500;letter-spacing:.055em}
#writings .fiction-legacy{margin-top:42px}
#writings .fiction-legacy h3{margin-bottom:19px;font-size:19px}
#writings .fiction-legacy[hidden]{display:none!important}
@media(hover:hover){#writings .experience-tab:hover:not([aria-selected="true"]){border-color:color-mix(in srgb,var(--accent) 24%,var(--line));background:color-mix(in srgb,var(--card) 80%,var(--paper))}#writings .experience-tab:hover:not([aria-selected="true"]) span{opacity:.7}#writings .story-tab:hover:not([aria-selected="true"]),#writings .fiction-tab:hover:not([aria-selected="true"]),#writings .school-tab:hover:not([aria-selected="true"]){border-color:color-mix(in srgb,var(--accent) 27%,var(--line));color:var(--ink)}}
@keyframes writings-title-enter{from{opacity:.58;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}
@keyframes writings-layer-enter{from{opacity:0;transform:translateY(-7px);filter:blur(2px)}to{opacity:1;transform:translateY(0);filter:blur(0)}}
@keyframes writings-unfold{from{opacity:0;clip-path:inset(0 0 38% 0 round 999px);transform:translateY(-9px)}to{opacity:1;clip-path:inset(0 0 0 0 round 999px);transform:translateY(0)}}
@keyframes writings-panel-enter{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:translateY(0)}}
@keyframes writings-card-enter{from{opacity:0;transform:translateY(12px) scale(.988)}to{opacity:1;transform:translateY(0) scale(1)}}
@media(max-width:760px){
  #writings .section-head{margin-bottom:25px}
  #writings .section-head h2{padding-bottom:15px;font-size:30px}
  #writings .article-meeting-nav{gap:12px;margin-bottom:24px}
  #writings .experience-tools::after,#writings .story-switch::after{height:12px}
  #writings.is-awaiting-choice{padding-bottom:66px}
  #writings .experience-tools{width:calc(100% - 20px)}
  #writings .experience-switch{gap:9px}
  #writings .experience-tab{min-height:72px;border-radius:16px;padding:12px 7px}
  #writings .experience-tab span{font-size:21px;letter-spacing:.035em}
  #writings .story-switch,#writings .fiction-switch{gap:8px;width:100%}
  #writings .story-tab,#writings .fiction-tab{min-height:63px;border-radius:13px;padding:11px 4px}
  #writings .story-tab span,#writings .fiction-tab span{font-size:15px;letter-spacing:0}
  #writings .story-tab[aria-selected="true"]::after,#writings .fiction-tab[aria-selected="true"]::after{bottom:6px;width:15px}
  #writings .school-switch{gap:3px;width:100%;padding:4px}
  #writings .school-switch::before{top:4px;bottom:4px;left:4px;width:calc((100% - 14px)/3);transform:translateX(calc(var(--school-tab-index) * (100% + 3px)))}
  #writings .school-tab{min-height:43px;padding:7px 9px;font-size:12px}
  #writings .story-empty{padding:35px 18px;font-size:13px}
  #writings .fiction-series{margin-top:2px}
  #writings .fiction-series-trigger{grid-template-columns:30px minmax(0,1fr) 16px;gap:9px;min-height:69px;padding:11px 2px}
  #writings .fiction-series-title{justify-self:start;font-size:20px;text-align:left}
}
@media(max-width:360px){#writings .experience-tab span{font-size:19px}#writings .story-tab span,#writings .fiction-tab span{font-size:13px}}
@media(prefers-reduced-motion:reduce){#writings .experience-tab,#writings .experience-tab span,#writings .experience-tab::before,#writings .experience-tab::after,#writings .story-tab,#writings .fiction-tab,#writings .school-tab,#writings .school-switch::before{transition:none!important;animation:none!important}#writings .story-switch,#writings .fiction-switch,#writings .school-switch,#writings .experience-panel.is-entering,#writings .story-panel.is-entering,#writings .fiction-panel.is-entering,#writings .school-panel.is-entering,#writings .is-entering .writing-card{animation:none!important}}
