/* Reusable templates: collections, curated hubs and subscription insert. */
.static-page { max-width:900px; padding-block:36px; }
@media(max-width:640px) {
  .reference-article .table-stack-ready,.table-stack-ready tbody { display:block; }
  .reference-article .table-stack-ready thead { display:none; }
  .reference-article .table-stack-ready tbody tr { display:grid; grid-template-columns:1fr 1fr; border-bottom:1px solid var(--line); padding:12px 0; }
  .reference-article .table-stack-ready tbody th,.reference-article .table-stack-ready tbody td { min-width:0!important; border:0; padding:10px; overflow-wrap:anywhere; }
  .reference-article .comparison-table.table-stack-ready tbody th { grid-column:1/-1; }
  .reference-article .table-stack-ready tbody td::before { content:attr(data-label); display:block; font-size:11px; font-weight:700; color:var(--muted); margin-bottom:6px; }
  .reference-article .pricing-table.table-stack-ready tbody tr { grid-template-columns:1fr; }
}
.static-page .page-panel { padding:0; background:none; border:0; }
.hub-chapters { display:flex; gap:10px; flex-wrap:wrap; padding:16px 0; border-block:1px solid var(--line); margin-block:24px; }
.hub-chapters a { padding:8px 12px; background:var(--surface); border:1px solid var(--line); border-radius:6px; font-size:13px; }
.hub-module { margin:40px 0; scroll-margin-top:24px; }.hub-module .section-title { align-items:center; }.hub-module-list article { display:grid; grid-template-columns:40px 1fr 24px; gap:18px; padding:22px 0; border-bottom:1px solid var(--line); }
.hub-module-icon { display:grid; place-items:center; width:40px; height:40px; border-radius:8px; background:var(--chip); color:var(--accent); }.hub-module h3 { font-size:21px; margin:0 0 8px; }.hub-module p { margin:0; color:var(--muted); font-size:15px; }.hub-module-link { align-self:center; }
.tool-summary { border:1px solid var(--line); background:var(--surface); border-radius:12px; padding:24px; margin:28px 0; }.tool-summary-heading { display:flex; align-items:flex-start; gap:14px; flex-wrap:wrap; }.tool-summary-heading > .icon { flex-shrink:0; color:var(--accent); }.tool-summary-heading > div { flex:1; min-width:180px; }.tool-summary-heading h2 { margin:0 0 8px; font-size:23px; }.tool-summary-heading p { font-size:13px; color:var(--muted); margin:0; }.tool-summary-heading .button { font-size:13px; }
.tool-platforms > div { padding:14px 0; border-bottom:1px solid var(--line); }.tool-platforms dt { font-size:12px; color:var(--muted); margin-bottom:8px; }.tool-platforms dd { display:flex; gap:6px; flex-wrap:wrap; margin:0; }.tool-platforms dd span { font-size:12px; padding:4px 9px; background:var(--chip); border-radius:4px; }.pricing-table { width:100%; border-collapse:collapse; font-size:14px; }.pricing-table th,.pricing-table td { padding:12px 10px; text-align:left; border-bottom:1px solid var(--line); vertical-align:top; min-width:110px; }.pricing-table th { background:var(--chip); font-size:12px; }.tool-availability { font-size:14px; line-height:1.7; }
.comparison-participants { display:grid; grid-template-columns:1fr 1fr; gap:16px; margin:24px 0; }.comparison-participants > div { display:flex; align-items:center; flex-wrap:wrap; gap:12px; padding:20px; background:var(--surface); border:1px solid var(--line); border-radius:10px; }.comparison-participants strong { font-size:20px; flex:1; }.comparison-participants a { flex-basis:100%; font-size:13px; color:var(--accent); }.comparison-participants > div > .icon { color:var(--accent); }
.scenario-choices { border-left:3px solid var(--accent); padding:20px; background:var(--chip); margin:28px 0; }.scenario-choices h2 { font-size:23px; margin-top:0; }.scenario-choices dl { margin-bottom:0; }.scenario-choices dl > div { display:grid; grid-template-columns:1fr 1fr; gap:20px; padding:12px 0; border-bottom:1px solid var(--line); }.scenario-choices dt { color:var(--muted); }.scenario-choices dd { margin:0; font-weight:600; }
.reference-article .comparison-table th,.reference-article .comparison-table td { padding:14px; min-width:150px; border-bottom:1px solid var(--line); text-align:left; vertical-align:top; }.reference-article .comparison-table thead { background:var(--chip); }.reference-article--glossary .definition-box { font-size:20px; border-radius:8px; }.reference-article--prompt .prompt-card { border:1px solid var(--line); border-radius:12px; padding:20px; background:var(--surface); }.reference-article--prompt .prompt-box { max-height:520px; overflow:auto; line-height:1.7; }.prompt-vars { background:var(--chip); border-radius:8px; padding:20px 20px 20px 40px; }.example-output { padding:20px; border-left:3px solid var(--accent); background:var(--surface); }
.archive-about { margin-top:20px; max-width:760px; }.archive-about summary { cursor:pointer; color:var(--accent); font-size:14px; }.archive-about p { font-size:15px; line-height:1.7; }
.glossary-search { display:flex; gap:12px; margin:24px 0; }.glossary-search label { flex:1; }.glossary-search input { width:100%; }.glossary-alphabet { display:flex; flex-wrap:wrap; gap:6px; padding:20px 0; border-bottom:1px solid var(--line); }.glossary-alphabet a { display:grid; place-items:center; min-width:32px; height:34px; padding:4px 8px; border:1px solid var(--line); border-radius:5px; background:var(--surface); font-size:14px; }.glossary-alphabet a.is-active { color:var(--surface); background:var(--ink); }.dictionary-entry { padding:24px 0; border-bottom:1px solid var(--line); }.dictionary-entry h2 { margin:0 0 10px; font-size:24px; }.dictionary-entry p { max-width:800px; color:var(--muted); margin:0 0 12px; }.dictionary-entry > a { font-size:13px; }
.explore-links { margin:32px 0; }.explore-links h2 { font-size:23px; }.explore-links > a { display:flex; gap:14px; align-items:center; border-bottom:1px solid var(--line); padding:18px 0; }.explore-links > a span { flex:1; }
.entry-content pre { padding:20px; background:var(--chip); border:1px solid var(--line); border-radius:8px; max-width:100%; overflow:auto; font-size:14px; line-height:1.7; }.entry-content :not(pre)>code { padding:2px 5px; background:var(--chip); border-radius:4px; overflow-wrap:anywhere; }.entry-content figure { margin:28px 0; max-width:100%; }.entry-content figcaption { font-size:13px; color:var(--muted); margin-top:10px; text-align:left; }.entry-content video { display:block; max-width:100%; height:auto; border-radius:8px; }.entry-content iframe { max-width:100%; }.entry-content blockquote { border-left:3px solid var(--accent); margin:24px 0; padding:12px 24px; background:var(--chip); }.entry-content table th { background:var(--chip); }.entry-content table th,.entry-content table td { padding:12px; border:1px solid var(--line); vertical-align:top; }
.slopsites-contact-page { max-width:860px; padding:36px 24px 64px; margin:auto; }.slopsites-contact-hero h1 { font-size:clamp(32px,4vw,48px); margin:12px 0; }.slopsites-contact-kicker { font-size:12px; color:var(--accent); letter-spacing:.08em; }.slopsites-contact-hero > p:last-child { color:var(--muted); font-size:18px; line-height:1.7; }.slopsites-contact-form { margin-top:28px; display:grid; grid-template-columns:1fr 1fr; gap:20px; padding:24px; background:var(--surface); border:1px solid var(--line); border-radius:12px; }.slopsites-contact-form label { display:flex; flex-direction:column; gap:8px; font-size:14px; font-weight:600; }.slopsites-contact-form input:not(.slopsites-contact-pot),.slopsites-contact-form textarea { width:100%; color:var(--ink); background:var(--paper); padding:12px; border:1px solid var(--line); border-radius:6px; font:inherit; }.slopsites-contact-form textarea { min-height:180px; resize:vertical; }.slopsites-contact-wide,.slopsites-contact-actions,.slopsites-contact-note { grid-column:1/-1; }.slopsites-contact-pot { position:absolute!important; left:-10000px!important; width:1px!important; height:1px!important; }.slopsites-contact-actions button { background:var(--ink); color:var(--surface); border:0; border-radius:6px; padding:14px 20px; font-weight:700; cursor:pointer; }.slopsites-contact-note { font-size:13px; color:var(--muted); margin:0; }.slopsites-contact-actions .is-success { color:var(--accent); }.slopsites-contact-actions .is-error { color:#bb3434; }
@media(max-width:640px) { .comparison-participants,.scenario-choices dl > div,.slopsites-contact-form { grid-template-columns:1fr; }.tool-summary,.slopsites-contact-form { padding:18px; }.reference-article--prompt .prompt-card { padding:14px; }.hub-module-list article { grid-template-columns:32px minmax(0,1fr) 20px; gap:12px; }.hub-module h3 { font-size:19px; }.hub-module-icon { width:32px; height:32px; }.glossary-search { flex-wrap:wrap; }.slopsites-contact-page { padding-inline:18px; }.dictionary-entry h2 { font-size:21px; } }
.catalog-filters { margin: 0 0 32px; }
.quick-filters { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:24px; }
.quick-filters-label { flex-basis:100%; color:var(--muted); font-size:12px; margin-bottom:4px; }
.filter-chip { border:1px solid var(--line); border-radius:999px; padding:9px 14px; background:var(--surface); font-size:14px; line-height:1.4; }
.filter-chip:hover,.filter-chip.is-active { background:var(--ink); color:var(--surface); text-decoration:none; border-color:var(--ink); }
.tool-filter { display:flex; flex-wrap:wrap; gap:16px; align-items:flex-end; padding:20px; border:1px solid var(--line); border-radius:12px; background:var(--surface); }
.filter-field { flex:1 1 190px; min-width:0; }
.filter-field > label { display:block; margin-bottom:8px; font-size:13px; font-weight:700; }
.filter-field > select { width:100%; min-height:46px; }
.filter-field > input[type=search] { width:100%; min-height:46px; }
.filter-field > select[hidden] { display:none; }
.filter-picker { position:relative; }
.filter-picker summary { display:flex; align-items:center; justify-content:space-between; gap:8px; min-height:46px; padding:10px 14px; border:1px solid var(--line); border-radius:7px; cursor:pointer; font-size:14px; list-style:none; overflow-wrap:anywhere; }
.filter-picker summary::-webkit-details-marker { display:none; }
.filter-picker summary::after { content:''; width:7px; height:7px; border-right:1.5px solid currentColor; border-bottom:1.5px solid currentColor; transform:rotate(45deg); flex-shrink:0; margin:0 2px 4px 8px; }
.filter-picker[open] summary { border-color:var(--accent); }
.filter-panel { position:absolute; top:calc(100% + 6px); left:0; right:0; z-index:25; border:1px solid var(--line); border-radius:10px; padding:10px; background:var(--surface); box-shadow:0 12px 32px #0002; }
.filter-panel input { width:100%; min-width:0; padding:10px; background:var(--bg); color:var(--ink); border:1px solid var(--line); border-radius:6px; }
.filter-options { max-height:260px; overflow:auto; margin-top:8px; overscroll-behavior:contain; }
.filter-options button { display:block; width:100%; padding:10px; border:0; border-radius:5px; background:transparent; color:var(--ink); text-align:left; font:inherit; font-size:14px; cursor:pointer; }
.filter-options button[hidden],.filter-panel p[hidden] { display:none; }
.filter-options button:hover,.filter-options button[aria-pressed=true] { background:var(--chip); color:var(--accent); }
.filter-panel p { font-size:14px; color:var(--muted); padding:10px; }
.filter-actions { display:flex; align-items:center; gap:14px; min-height:46px; }
.filter-actions button { min-height:46px; padding:10px 20px; background:var(--ink); color:var(--surface); border:0; border-radius:7px; cursor:pointer; font-weight:700; }
.filter-actions a { font-size:13px; color:var(--muted); }
.catalog-filters :focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
@media(max-width:640px) { .tool-filter { padding:16px; } .filter-field { flex-basis:100%; } .filter-chip { font-size:13px; padding:8px 12px; } .filter-actions { width:100%; } }
.article-interlinks { margin-top: 40px; }
.section-neighbors { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; border-block: 1px solid var(--line); padding: 28px 0; }
.section-neighbor { display: block; padding: 20px; background: var(--surface); border: 1px solid var(--line); border-radius: 10px; }
.section-neighbor:hover { border-color: var(--accent); text-decoration: none; }
.section-neighbor > span { display: flex; align-items: center; gap: 8px; color: var(--muted); font-size: 11px; letter-spacing: .04em; text-transform: uppercase; margin-bottom: 12px; }
.section-neighbor strong { font-size: 16px; line-height: 1.5; display: block; }
.section-neighbor--previous .icon { transform: rotate(180deg); }
.section-neighbor--next { text-align: right; }
.section-neighbor--next > span { justify-content: flex-end; }
.section-neighbor--next .icon { order: 2; }
.interlink-group { margin-top: 36px; }
.interlink-group > h2 { font-size: 28px; margin-bottom: 12px; }
.interlink-list { display: block; }
.interlink-item { display: grid; grid-template-columns: 144px minmax(0,1fr); gap: 22px; padding: 20px 0; border-bottom: 1px solid var(--line); }
.interlink-image { display: block; aspect-ratio: 16/10; border-radius: 6px; overflow: hidden; background: var(--chip); }
.interlink-image img { width: 100%; height: 100%; object-fit: cover; }
.interlink-item h3 { font-size: 20px; line-height: 1.35; margin: 5px 0 9px; text-wrap: pretty; }
.interlink-item time { font-size: 12px; color: var(--muted); }
@media(max-width:640px) {
  .section-neighbors { grid-template-columns: 1fr; }
  .section-neighbor { padding: 18px; }
  .interlink-item { grid-template-columns: 88px minmax(0,1fr); gap: 14px; }
  .interlink-image { aspect-ratio: 1; }
  .interlink-item h3 { font-size: 18px; }
}
.collection-page { max-width: 1040px; }
.collection-page .section-header { padding-bottom: 28px; border-bottom: 1px solid var(--line); }
.collection-page .section-header h1 { margin-top: 12px; }
.collection-list { display: block; }
.editorial-card--list { display: grid; grid-template-columns: 218px minmax(0,1fr); gap: 28px; padding: 28px 0; border-bottom: 1px solid var(--line); }
.editorial-card--list .editorial-card__media { margin: 0; aspect-ratio: 16/10; }
.editorial-card--list h2 { font-size: 25px; line-height: 1.25; text-wrap: pretty; }
.editorial-card--list p { margin: 0; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.subscription-strip { display: flex; align-items: center; gap: 24px; padding: 26px 28px; margin: 32px 0; border-block: 1px solid var(--line); background: var(--surface); }
.subscription-strip > img { flex: 0 0 40px; }
.subscription-strip > div { flex: 1; min-width: 0; }
.subscription-strip .eyebrow { margin: 0 0 6px; color: var(--muted); }
.subscription-strip h2 { font-size: 23px; margin: 0 0 6px; text-wrap: pretty; }
.subscription-strip p:last-child { margin: 0; color: var(--muted); font-size: 14px; }
.subscription-strip > .button { flex-shrink: 0; font-size: 13px; }
.collection-page .hub-intro { display: block; background: transparent; border: 0; padding: 0 0 28px; border-bottom: 1px solid var(--line); border-radius: 0; }
.collection-page .hub-routes { display: flex; flex-wrap: wrap; gap: 12px 26px; margin-top: 24px; }
.collection-page .hub-routes a { display: inline-flex; align-items: center; gap: 9px; padding: 0; background: none; border-radius: 0; }
.collection-page .hub-routes .icon { display: inline-block; margin: 0; }
.hub-selection { margin: 32px 0; }
.hub-selection ol { padding: 0; margin: 0; list-style: none; counter-reset: route; }
.hub-selection li { counter-increment: route; display: flex; gap: 20px; align-items: start; padding: 20px 0; border-bottom: 1px solid var(--line); }
.hub-selection li::before { content: counter(route, decimal-leading-zero); font-size: 14px; color: var(--accent); padding-top: 3px; }
.hub-selection a { flex: 1; }
.hub-selection strong { display: block; font-size: 20px; line-height: 1.35; }
.hub-selection span { display: block; margin-top: 7px; font-size: 14px; color: var(--muted); }
.hub-editorial-copy { max-width: 780px; margin-block: 32px; }
.collection-page .author-profile-hero { padding-bottom: 30px; border-bottom: 1px solid var(--line); }
.article-hero, .reference-hero { padding-bottom: 24px; margin-bottom: 28px; border-bottom: 1px solid var(--line); }
.reference-hero > .excerpt { font-size: 20px; line-height: 1.6; }
.tool-quickfacts { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; padding: 24px; background: var(--chip); border-radius: 6px; }
.reference-article .source-list { padding-left: 20px; font-size: 14px; line-height: 1.8; }
.reference-article .comparison-table { width: 100%; border-collapse: collapse; }
@media(max-width:760px) {
  .editorial-card--list { grid-template-columns: 104px minmax(0,1fr); gap: 16px; padding: 24px 0; }
  .editorial-card--list .editorial-card__media { aspect-ratio: 1; }
  .editorial-card--list h2 { font-size: 21px; }
  .editorial-card--list p { font-size: 13px; -webkit-line-clamp: 3; }
  .subscription-strip { display: grid; grid-template-columns: 32px minmax(0,1fr); gap: 16px; padding: 22px 18px; }
  .subscription-strip > img { width: 32px; height: 32px; align-self: start; }
  .subscription-strip h2 { font-size: 21px; }
  .subscription-strip > .button { grid-column: 2; justify-self: start; }
  .collection-page .hub-routes { gap: 16px 24px; }
  .tool-quickfacts { grid-template-columns: 1fr; }
}
@media(max-width:420px) {
  .editorial-card--list { grid-template-columns: 88px minmax(0,1fr); gap: 13px; }
  .editorial-card--list h2 { font-size: 19px; }
}