/* タグページ(tag.html)のインライン<style>を抽出したもの。static build 用。 */
.archead{ position:relative; background:radial-gradient(110% 100% at 86% -10%, rgba(255,61,154,.12), transparent 55%), var(--blue); color:#fff; padding:40px 0 0; }
.archead::before{ content:""; position:absolute; inset:0; left:50%; transform:translateX(-50%); width:100vw; background:var(--blue); z-index:0; }
.archead > .wrap{ position:relative; z-index:1; }
.archead .crumb, .archead .crumb a{ color:rgba(255,255,255,.6); }
.archead .crumb .cur{ color:#fff; }
.archead .crumb .sep{ color:rgba(255,255,255,.32); }
.archead .kind{ font-family:var(--mono); font-size:11px; letter-spacing:.24em; text-transform:uppercase; color:var(--acid); margin:26px 0 16px; }
.archead h1{ font-family:var(--disp); font-weight:900; font-size:clamp(44px,8vw,108px); line-height:1; letter-spacing:-.01em; margin:0; color:#fff; display:flex; align-items:baseline; gap:.12em; }
.archead h1 .hash{ font-family:var(--disp); font-weight:400; color:var(--acid); font-size:.92em; }
.archead h1 .dot{ color:var(--acid); }
.archead .desc{ max-width:min(100%,780px); font-size:15.5px; line-height:1.95; color:rgba(255,255,255,.78); margin:18px 0 0; }
.archead .stat{ font-family:var(--mono); font-size:11px; letter-spacing:.14em; color:rgba(255,255,255,.6); display:flex; gap:24px; margin:24px 0 0; }
.archead .stat b{ color:var(--acid); font-weight:700; }

/* tag cloud */
.cloud{ position:relative; z-index:1; padding:32px 0 38px; }
.cloud .cl-lbl{ font-family:var(--mono); font-size:10px; letter-spacing:.2em; text-transform:uppercase; color:rgba(255,255,255,.5); margin-bottom:16px; }
.cloud .tags{ display:flex; gap:9px; flex-wrap:wrap; }
.cloud a{ font-family:var(--sans); font-size:13px; text-decoration:none; color:rgba(255,255,255,.72); border:1px solid rgba(255,255,255,.2); background:rgba(255,255,255,.04); border-radius:100px; padding:9px 16px; transition:.2s; display:inline-flex; align-items:center; gap:8px; cursor:pointer; }
.cloud a .h{ color:var(--acid); font-family:var(--mono); }
.cloud a .n{ font-family:var(--mono); font-size:10px; opacity:.55; }
.cloud a:hover{ border-color:#fff; color:#fff; }
.cloud a.on{ background:var(--acid); border-color:var(--acid); color:#0b0b0d; font-weight:700; }
.cloud a.on .h, .cloud a.on .n{ color:#0b0b0d; }
.cloud a.on .n{ opacity:.7; }

.sortbar{ border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.sortbar .in{ max-width:var(--maxw); margin:0 auto; padding:14px 40px; display:flex; justify-content:space-between; align-items:center; gap:20px; }
.sortbar .lbl{ font-family:var(--mono); font-size:11px; letter-spacing:.12em; color:var(--ink-3); display:flex; align-items:center; gap:8px; }
.sortbar .lbl .hh{ color:var(--acid); }
.sortbar .lbl b{ color:var(--ink); }
.sortbar .sort{ font-family:var(--mono); font-size:11px; color:var(--ink-3); }

.listwrap{ padding:54px 0 96px; }
.grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:42px 34px; }
.card{ text-decoration:none; color:inherit; display:flex; flex-direction:column; }
.card .thumb{ position:relative; margin-bottom:16px; }
.card .thumb img{ width:100%; aspect-ratio:4/3; object-fit:cover; border-radius:var(--r); border:1px solid var(--line); }
.card .tagrow{ position:absolute; left:11px; bottom:11px; display:flex; gap:6px; flex-wrap:wrap; }
.card .tagrow span{ font-family:var(--mono); font-size:9.5px; letter-spacing:.04em; color:#fff; background:rgba(11,11,13,.72); border:1px solid rgba(255,255,255,.16); padding:5px 9px; border-radius:100px; }
.card .cat{ font-family:var(--mono); font-size:10px; letter-spacing:.16em; text-transform:uppercase; color:var(--gold); }
.card h3{ font-family:var(--head); font-weight:700; font-size:18px; line-height:1.5; margin:9px 0 10px; }
.card:hover h3{ color:var(--gold); }
.card .ex{ font-size:13.5px; color:var(--ink-2); line-height:1.85; margin:0 0 14px; }
.card .meta{ margin-top:auto; font-family:var(--mono); font-size:10.5px; letter-spacing:.06em; color:var(--ink-3); display:flex; gap:13px; padding-top:13px; border-top:1px solid var(--line); }

.pager{ display:flex; justify-content:center; align-items:center; gap:8px; margin-top:70px; }
.pager a{ font-family:var(--mono); font-size:13px; min-width:42px; height:42px; padding:0 12px; display:flex; align-items:center; justify-content:center; border:1px solid var(--line); border-radius:9px; text-decoration:none; color:var(--ink-2); transition:.2s; }
.pager a:hover{ border-color:var(--ink); color:var(--ink); }
.pager a.on{ background:var(--acid); border-color:var(--acid); color:#0b0b0d; font-weight:700; }
.pager a.nav{ font-size:12px; letter-spacing:.06em; }
.pager .gap{ color:var(--ink-3); padding:0 4px; }

@media (max-width:860px){
  .grid{ grid-template-columns:1fr; gap:36px; }
  .archead{ padding-top:28px; }
  .archead h1{ font-size:clamp(22px,6.2vw,54px); line-height:1.04; white-space:normal; overflow-wrap:break-word; flex-wrap:wrap; }
  .sortbar .in{ padding-left:22px; padding-right:22px; }
}
