.arch{max-width:var(--page-max);margin:0 auto;padding:20px var(--m) clamp(96px,10vw,140px)}
.arch__head{padding-bottom:clamp(36px,4vw,56px);border-bottom:2px solid var(--ink)}
.arch__label{margin-top:clamp(20px,3vw,40px);font-family:var(--lat);font-stretch:75%;font-weight:400;font-size:clamp(64px,9vw,148px);line-height:.8;letter-spacing:.005em;text-transform:uppercase;font-feature-settings:normal;margin-left:-.03em}
.arch__label--strata{color:var(--ink)}
@supports ((-webkit-background-clip:text) or (background-clip:text)){
  .arch__label--strata{color:transparent;background-image:linear-gradient(to top,var(--l1) 0 21%,var(--l2) 21% 34%,var(--l3) 34% 47%,var(--l4) 47% 60%,var(--l5) 60% 73%,var(--l6) 73%);-webkit-background-clip:text;background-clip:text}
}
.arch__title{margin-top:18px;font-size:clamp(32px,3.4vw + 14px,60px);font-weight:900;line-height:1.25;letter-spacing:-.03em;word-break:keep-all;overflow-wrap:anywhere}
.arch__desc{margin-top:16px;max-width:38em;font-size:17px;line-height:1.9;color:var(--ink-2)}
.arch__stats{display:flex;flex-wrap:wrap;gap:12px 36px;margin-top:24px}
.arch__stats div{display:flex;flex-direction:column;gap:2px}
.arch__stats dt{font-size:16px;color:var(--ink-2)}
.arch__stats dd{margin:0;font-size:22px;font-weight:900;line-height:1.3;font-feature-settings:"tnum" 1,"palt" 1}
.arch__stats dd small{font-size:16px;font-weight:700;margin-left:.15em}
.arch__body{display:grid;grid-template-columns:minmax(0,1fr);gap:clamp(56px,6vw,80px);margin-top:clamp(40px,5vw,64px)}
@media (min-width:1024px){
  .arch__body{grid-template-columns:minmax(0,4fr) minmax(0,8fr);column-gap:var(--gut);align-items:start}
  .arch__aside{position:sticky;top:24px}
}

.tpanel__sum{display:flex;align-items:flex-end;gap:8px 16px;list-style:none;cursor:pointer}
.tpanel__sum::-webkit-details-marker{display:none}
.tpanel__h{display:flex;flex-direction:column;gap:2px;margin-right:auto;font-size:clamp(22px,2vw,26px);font-weight:900;line-height:1.35;letter-spacing:-.01em}
.tpanel__h .micro{color:var(--ink-2)}
.tpanel__n{font-size:16px;line-height:1.6;color:var(--ink-2);white-space:nowrap}
.tpanel__tg{display:inline-flex;align-items:center;min-height:44px;padding:0 16px;border:2px solid var(--ink);font-size:16px;font-weight:700;white-space:nowrap}
.tpanel__tg::before{content:"開く"}
.tpanel[open] .tpanel__tg::before{content:"閉じる"}
.tpanel[open] .tpanel__sum{margin-bottom:20px}
@media (max-width:1023px){
  .tpanel{padding-bottom:16px;border-bottom:1px solid var(--hair)}
  .tpanel[open]{padding-bottom:0;border-bottom:0}

  .tlist__cells .cell{width:32px;height:32px}
  .tkeys{position:sticky;top:0;z-index:1;padding-top:8px;background:var(--paper)}
  .tkeys span{width:32px}
}
@media (min-width:1024px){.tpanel__sum{cursor:default}.tpanel__tg,.tpanel__n{display:none}}

.tkeys{display:flex;gap:4px;justify-content:flex-end;padding-bottom:8px}
.tkeys span{width:28px;padding-bottom:5px;border-bottom:3px solid var(--lc);text-align:center;font-size:16px;font-weight:700;line-height:1.2;color:var(--ink-2)}
.tlist{border-top:2px solid var(--ink)}
.tlist li{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;column-gap:16px;padding:12px 0 13px;border-bottom:1px solid var(--hair);scroll-margin-top:24px}
.tlist__name{display:flex;flex-direction:column;align-items:flex-start;gap:0;text-align:left;font-size:16px;font-weight:700;line-height:1.5;word-break:keep-all;overflow-wrap:anywhere}
.tlist__name span{font-weight:500;color:var(--ink-2)}
button.tlist__name:hover b{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:.25em;text-decoration-color:var(--ul)}
button.tlist__name[aria-pressed="true"] b{text-decoration:underline;text-decoration-thickness:3px;text-underline-offset:.25em}
.tlist__cells{display:flex;gap:4px}
.tlist li:target{background:var(--paper-2);box-shadow:-10px 0 0 var(--paper-2),10px 0 0 var(--paper-2)}
.tinfo{min-height:3.4em;margin-top:16px;font-size:16px;line-height:1.7;color:var(--ink-2)}
.tinfo b{color:var(--ink);font-weight:700}
@media (hover:hover){.tinfo:empty::before{content:"四角にカーソルを合わせると、記事の題名がここに出ます。"}}
@media (hover:none){.tinfo{display:none}}

.filter{display:flex;flex-direction:column;gap:12px;margin-bottom:20px}
.filter__now{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 14px;font-size:16px;line-height:1.6;color:var(--ink-2)}
.filter__now b{color:var(--ink);font-weight:900;font-size:20px;font-feature-settings:"tnum" 1}
.filter__clear{font-weight:700;color:var(--ink);text-decoration:underline;text-underline-offset:.3em}
.filter[data-ready="false"]{display:none}
.entry[hidden]{display:none}
.arch .entries{display:block}
@media (min-width:1500px){.arch .entries{display:grid;grid-template-columns:1fr 1fr;column-gap:var(--gut)}}

.srch__count{margin-top:28px;font-size:18px;line-height:1.6}
.srch__count b{font-weight:900;font-feature-settings:"tnum" 1}
.srch__results{margin-top:20px}
.srch__empty{margin-top:28px;padding:22px 24px;border:2px solid var(--ink)}
.srch__empty p+p{margin-top:8px}
.srch__hint{margin-top:12px;font-size:16px;line-height:1.8;color:var(--ink-2)}
.srch__more{margin-top:clamp(56px,6vw,80px)}
.srch__more .chips{margin-top:4px}

.nf{max-width:var(--page-max);margin:0 auto;padding:clamp(32px,5vw,72px) var(--m) clamp(96px,10vw,140px)}
.nf__code{font-family:var(--lat);font-stretch:75%;font-weight:400;font-size:clamp(160px,30vw,420px);line-height:.78;letter-spacing:-.01em;font-feature-settings:normal;margin-left:-.04em}
.nf__title{margin-top:24px;word-break:keep-all;overflow-wrap:anywhere;font-size:clamp(26px,2.4vw + 14px,44px);font-weight:900;line-height:1.35;letter-spacing:-.02em}
.nf__text{margin-top:12px;max-width:36em;font-size:17px;line-height:1.9;color:var(--ink-2)}
.nf__grid{display:grid;grid-template-columns:minmax(0,1fr);gap:48px var(--gut);margin-top:48px}
@media (min-width:1024px){.nf__grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
.nf .search{margin-top:0}
.nf__links{display:flex;flex-wrap:wrap;gap:4px 28px;margin-top:20px}

.purpose-hub__lead{font-size:clamp(18px,.5vw + 16px,21px);font-weight:500;line-height:1.9}
.purpose-hub__nav{display:flex;flex-wrap:wrap;gap:8px;margin-top:24px}
.purpose-hub__nav a{display:inline-flex;align-items:center;min-height:44px;padding:0 16px;border:2px solid var(--ink);font-size:16px;font-weight:700;text-decoration:none}
.purpose-hub__nav a::after{content:"↓";margin-left:.5em}
.purpose-hub__nav a:hover{background:var(--ink);color:var(--paper)}
.purpose-section{margin-top:clamp(64px,6vw,96px);scroll-margin-top:24px}
.purpose-section__header{padding-top:18px;border-top:2px solid var(--ink)}
.purpose-section__header h2{font-size:clamp(23px,1vw + 18px,30px);font-weight:900;line-height:1.4;letter-spacing:-.01em;font-feature-settings:"palt" 1}
.purpose-section__header p{margin-top:8px;font-size:16px;line-height:1.85;color:var(--ink-2)}
.purpose-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:10px;margin-top:22px}
@media (min-width:600px){.purpose-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
.purpose-card{display:flex;flex-direction:column;gap:6px;height:100%;padding:16px 18px 20px;border-left:6px solid var(--lc);background:var(--paper-2);text-decoration:none!important}
.purpose-card__label{display:inline-flex;align-items:center;gap:.45em;font-size:16px;font-weight:700;color:var(--ink-2);letter-spacing:.02em}
.purpose-card__label::before{content:"";width:.72em;height:.72em;background:var(--lc)}
.purpose-card__title{font-size:clamp(18px,.4vw + 16px,20px);font-weight:700;line-height:1.55}
.purpose-card__description{font-size:16px;line-height:1.8;color:var(--ink-2)}
.purpose-card:hover .purpose-card__title{text-decoration:underline;text-decoration-color:var(--lc);text-decoration-thickness:2px;text-underline-offset:.2em}
.purpose-section__more{margin-top:14px}
.purpose-section__more a{font-weight:700}
.purpose-section__more a::after{content:" →"}

@media (min-width:1024px){
  .arch__head:has(.arch__stats){display:grid;grid-template-columns:minmax(0,8fr) minmax(0,4fr);column-gap:var(--gut);align-items:end}
  .arch__head:has(.arch__stats)>*{grid-column:1}
  .arch__head:has(.arch__stats)>.crumbs,.arch__head:has(.arch__stats)>.arch__label{grid-column:1 / -1}
  .arch__head .arch__stats{grid-column:2;grid-row:3 / span 2;justify-content:flex-end;margin-top:0}
}

.arch__list{margin-top:clamp(40px,5vw,64px)}