.ad-page {
  --ad-line: #dbdcd2;
  --ad-text: #252923;
  --ad-muted: #5e645a;
  --ad-green: #2b4139;
  --ad-paper: #f5f3e9;
}

.ad-main { padding: 24px 0 clamp(36px, 7vw, 96px); }
.ad-trail { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; margin: 0 0 22px; color: var(--ad-muted); font-size: .82rem; }
.ad-trail a:hover { text-decoration: underline; }
.ad-hero { position: relative; overflow: hidden; border-radius: 12px; }
.ad-cover, .ad-sector-hero, .ad-plan-hero { display: grid; grid-template-columns: minmax(0, 1.26fr) minmax(0, .74fr); }
.ad-cover, .ad-sector-hero { background: var(--ad-paper); }
.ad-intro { padding: clamp(28px, 4.5vw, 76px); align-self: center; }
.ad-intro .ad-kicker { color: #786142; font-weight: 700; font-size: .83rem; letter-spacing: .015em; }
.ad-intro h1 { margin: 14px 0 19px; font-size: clamp(2.7rem, 4.7vw, 5rem); line-height: 1.15; overflow-wrap: anywhere; }
.ad-intro > p:last-of-type { max-width: 40em; color: #4b5147; line-height: 1.7; font-size: clamp(.95rem, 1.25vw, 1.14rem); }
.ad-cover-image { position: relative; min-height: 250px; }
.ad-cover-image img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.ad-cover-image a { position: absolute; inset: auto 16px 16px auto; display: inline-flex; align-items: center; gap: 22px; padding: 10px 15px; border-radius: 6px; background: #fffdf5; color: var(--ad-text); box-shadow: 0 1px 12px #19251c25; }
.ad-cover-image a:hover { background: #fae8b4; }
.ad-counts { margin: 0; padding: clamp(18px, 2.4vw, 34px) 0; display: grid; grid-template-columns: repeat(5, 1fr); border-bottom: 1px solid var(--ad-line); }
.ad-counts > div { display: flex; flex-direction: column; gap: 2px; padding-left: clamp(12px, 2.7vw, 46px); border-left: 1px solid var(--ad-line); }
.ad-counts > div:first-child { border: 0; padding-left: 0; }
.ad-counts dt { color: var(--ad-muted); font-size: .83rem; }
.ad-counts dd { margin: 0; font-size: clamp(1.55rem, 2.8vw, 2.85rem); line-height: 1.15; letter-spacing: -.055em; font-variant-numeric: tabular-nums; }
.ad-block { margin-top: clamp(40px, 5vw, 80px); scroll-margin-top: 28px; }
.ad-section-head { margin-bottom: 23px; }
.ad-main h2 { font-size: clamp(1.6rem, 2.45vw, 2.55rem); line-height: 1.22; letter-spacing: -.058em; }
.ad-section-head p, .ad-quick > div > p, .ad-registry p, .ad-sources p { margin-top: 9px; line-height: 1.7; color: var(--ad-muted); }
.ad-sector-grid, .ad-concepts, .ad-subclass ul { list-style: none; padding: 0; margin: 0; }
.ad-sector-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.ad-sector-card { height: 100%; min-height: 98px; display: flex; align-items: center; gap: 14px; padding: 17px clamp(14px, 1.75vw, 28px); border: 1px solid var(--ad-line); background: #fffefb; border-radius: 8px; }
.ad-sector-card:hover, .ad-sector-card:focus-visible { border-color: #899581; background: #f0f3ea; }
.ad-index-letter { display: grid; place-items: center; flex: 0 0 38px; height: 38px; border: 1px solid #c6cbbc; color: var(--ad-green); background: #f2f3eb; font-family: Georgia, serif; font-size: 1.45rem; line-height: 1; }
.ad-sector-card > div { flex: 1; }
.ad-sector-card > svg, .ad-chip svg, .ad-inline-link svg, .ad-archive-link svg, .ad-action svg { flex-shrink: 0; }
.ad-sector-card h3 { font-size: clamp(.99rem, 1.18vw, 1.18rem); line-height: 1.4; letter-spacing: -.04em; }
.ad-sector-card p, .ad-demo-meta { color: var(--ad-muted); font-size: .79rem; margin-top: 4px; }
.ad-sector-card p span, .ad-demo-meta span { padding: 0 3px; }
.ad-quick, .ad-registry, .ad-sources { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 26px; align-items: start; }
.ad-quick { padding: 32px 0; border-block: 1px solid var(--ad-line); }
.ad-chips, .ad-archive-links, .ad-swatches, .ad-next, .ad-guide-nav, .ad-demo-links { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.ad-chip, .ad-archive-link, .ad-inline-link, .ad-action, .ad-source-links a { display: inline-flex; align-items: center; gap: 8px; width: fit-content; font-weight: 650; }
.ad-chip, .ad-archive-link, .ad-swatch { padding: 8px 12px; background: #fffefa; border-radius: 4px; border: 1px solid var(--ad-line); font-size: .9rem; }
.ad-chip:hover, .ad-archive-link:hover, .ad-swatch:hover { background: #f0f2e8; border-color: #83907d; }
.ad-page .ad-action { padding: 12px 18px; border-radius: 5px; color: white; background: var(--ad-green); }
.ad-page .ad-action:hover { background: #405c4e; }
.ad-page .ad-inline-link { color: var(--ad-green); font-size: .9rem; text-decoration: underline; text-underline-offset: 4px; padding: 4px 0; }
.ad-inline-link:hover, .ad-source-links a:hover { text-decoration-thickness: 2px; }
.ad-registry { grid-template-columns: minmax(0, 1fr) max-content; align-items: center; padding: clamp(23px, 3vw, 42px); background: #ecefe6; border-radius: 8px; }
.ad-registry p { max-width: 62em; }
.ad-archive { margin-top: 26px; padding: 16px 0; border-block: 1px solid var(--ad-line); }
.ad-archive > summary { cursor: pointer; font-weight: 650; padding: 2px 0; }
.ad-archive-links { margin-top: 16px; }
.ad-sources { grid-template-columns: minmax(0, 1.25fr) minmax(0, .75fr); margin-top: 38px; align-items: start; }
.ad-sources h2 { font-size: 1.1rem; }
.ad-sources p { font-size: .85rem; max-width: 56em; }
.ad-source-links { display: flex; gap: 6px 14px; flex-wrap: wrap; justify-content: end; }
.ad-source-links a { text-underline-offset: 3px; text-decoration: underline; font-size: .83rem; }
.ad-sector-hero { grid-template-columns: minmax(0, 1fr) minmax(145px, .34fr); }
.ad-sector-hero .ad-action { margin-top: 22px; }
.ad-sector-stat, .ad-plan-count { padding: clamp(20px, 3.2vw, 54px); display: flex; flex-direction: column; justify-content: end; }
.ad-sector-stat { color: var(--ad-green); align-self: stretch; border-left: 1px solid #d1d4c6; background: #eaeddf; }
.ad-sector-stat b, .ad-plan-count b { font-family: Georgia, serif; font-weight: 400; line-height: 1; font-size: clamp(3.4rem, 7vw, 7rem); letter-spacing: -.075em; }
.ad-sector-stat span, .ad-plan-count span { font-weight: 700; margin-top: 8px; }
.ad-sector-stat small { margin-top: 3px; }
.ad-division { border-bottom: 1px solid var(--ad-line); scroll-margin-top: 16px; }
.ad-division:first-of-type { border-top: 2px solid var(--ad-green); }
.ad-division > summary { list-style: none; display: flex; align-items: center; gap: clamp(9px, 2vw, 30px); padding: 16px 4px; cursor: pointer; }
.ad-division > summary::-webkit-details-marker { display: none; }
.ad-division > summary:hover { background: #f2f1e9; }
.ad-division[open] > summary { border-bottom: 1px solid var(--ad-line); }
.ad-division-code, .ad-subclass code { font-family: ui-monospace, monospace; font-variant-numeric: tabular-nums; }
.ad-division-code { font-size: .95rem; color: #646a57; }
.ad-division summary strong { flex: 1; font-size: clamp(1.05rem, 1.6vw, 1.5rem); line-height: 1.35; }
.ad-division-total { white-space: nowrap; font-size: .85rem; color: var(--ad-muted); }
.ad-reveal { width: 11px; height: 11px; margin: 0 9px; border-bottom: 2px solid #60705e; border-right: 2px solid #60705e; transform: rotate(45deg); }
.ad-division[open] .ad-reveal { transform: rotate(225deg); }
.ad-division-body { padding: 18px clamp(0px, 2vw, 30px) 22px; }
.ad-group { margin-top: 22px; }
.ad-group h3 { display: flex; align-items: baseline; flex-wrap: wrap; gap: 6px 11px; padding: 9px 12px; color: var(--ad-green); background: #ebeee5; font-size: 1.06rem; letter-spacing: -.03em; line-height: 1.45; }
.ad-group h3 span, .ad-subclass h4 small { font-weight: 500; color: #626b5e; font-size: .75rem; }
.ad-subclass { padding: 12px 0 4px; }
.ad-subclass h4 { margin: 0 0 6px; font-size: .94rem; line-height: 1.45; }
.ad-subclass h4 small { margin-right: 6px; }
.ad-subclass ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 20px; }
.ad-subclass li a { padding: 8px 0; min-height: 40px; display: flex; align-items: center; gap: 10px; border-bottom: 1px solid #e7e8e0; font-size: .89rem; }
.ad-subclass li a span { flex: 1; }
.ad-subclass li a svg { flex: 0 0 auto; color: #788272; }
.ad-subclass li a:hover { color: #395d44; background: #f1f3e9; }
.ad-subclass code { color: #626b5e; font-size: .81rem; }
.ad-next { justify-content: space-between; margin-top: 32px; }
.ad-plan-hero { background: var(--ad-green); color: #fff; }
.ad-plan-hero .ad-intro :is(h1, p), .ad-plan-hero .ad-kicker { color: #fffdf2; }
.ad-plan-hero .ad-intro > p:last-of-type { color: #e0e5d7; }
.ad-plan-hero h1 span { color: #f7b79a; }
.ad-plan-count { border-left: 1px solid #718476; color: #ebecce; }
.ad-plan-count b { font-size: clamp(3.3rem, 6.1vw, 6.7rem); }
.ad-guide-nav { border-bottom: 1px solid var(--ad-line); gap: 6px 25px; padding: 14px 0; }
.ad-guide-nav a { font-size: .9rem; color: var(--ad-muted); padding: 4px 0; }
.ad-guide-nav a:hover { text-decoration: underline; }
.ad-model-grid, .ad-nav-types, .ad-demo-grid { display: grid; gap: 15px; }
.ad-model-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ad-nav-types, .ad-demo-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ad-model-grid article, .ad-nav-types article { padding: clamp(16px, 2vw, 32px); border-top: 2px solid #65735d; background: #f1f2e9; }
.ad-model-grid h3, .ad-nav-types h3, .ad-demo h3 { font-size: clamp(1.1rem, 1.6vw, 1.6rem); letter-spacing: -.05em; line-height: 1.4; }
.ad-model-grid p, .ad-nav-types p, .ad-demo p { font-size: .93rem; line-height: 1.7; color: var(--ad-muted); margin-top: 8px; }
.ad-model-grid .ad-inline-link, .ad-nav-types .ad-inline-link { margin-top: 13px; }
.ad-concepts { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 1px; margin-top: 23px; border: 1px solid var(--ad-line); background: var(--ad-line); }
.ad-concepts li { background: #fdfcf9; }
.ad-concepts a { height: 100%; display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 15px 16px; }
.ad-concepts a:hover { background: #f0f2e8; }
.ad-concepts small { display: block; margin-top: 4px; color: var(--ad-muted); font-size: .83rem; }
.ad-concepts a svg { flex: 0 0 auto; }
.ad-swatch { display: inline-flex; align-items: center; gap: 8px; }
.ad-swatch i { width: 16px; height: 16px; background: var(--swatch); border: 1px solid #28332d33; border-radius: 50%; }
.ad-demo { display: grid; grid-template-columns: minmax(110px, .75fr) minmax(0,1.25fr); border: 1px solid var(--ad-line); border-radius: 7px; overflow: hidden; }
.ad-demo img { width: 100%; height: 100%; min-height: 145px; object-fit: cover; }
.ad-demo > div { align-self: center; padding: clamp(15px, 1.9vw, 30px); }
.ad-demo-meta { margin-top: 0; }
.ad-demo-links { margin-top: 14px; gap: 15px; }

@media (max-width: 990px) {
  .ad-sector-grid, .ad-concepts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ad-quick, .ad-sources { grid-template-columns: 1fr; gap: 14px; }
  .ad-source-links { justify-content: start; }
  .ad-demo { grid-template-columns: 1fr; }
  .ad-demo img { aspect-ratio: 16/7; min-height: 0; }
}
@media (max-width: 700px) {
  .ad-main { padding-top: 16px; }
  .ad-trail { margin-bottom: 14px; }
  .ad-cover, .ad-model-grid, .ad-registry { grid-template-columns: 1fr; }
  .ad-cover-image { min-height: 0; aspect-ratio: 2.45 / 1; }
  .ad-intro { padding: 24px 21px; }
  .ad-counts > div { padding-left: 8px; }
  .ad-counts dt, .ad-sector-card p { font-size: .75rem; }
  .ad-sector-card { padding: 11px; gap: 9px; min-height: 82px; }
  .ad-index-letter { flex-basis: 28px; height: 30px; font-size: 1.08rem; }
  .ad-sector-card > svg { display: none; }
  .ad-section-head { margin-bottom: 17px; }
  .ad-registry { gap: 12px; }
  .ad-sector-hero { grid-template-columns: minmax(0, 1fr) minmax(92px, .28fr); }
  .ad-sector-hero h1 { font-size: clamp(1.8rem, 6vw, 2.8rem); }
  .ad-sector-stat { padding: 15px 11px; }
  .ad-sector-stat b { font-size: clamp(2.4rem, 7vw, 3.4rem); }
  .ad-sector-stat span { font-size: .8rem; }
  .ad-division > summary { gap: 9px; }
  .ad-division-total { font-size: .76rem; }
  .ad-subclass ul { grid-template-columns: 1fr; }
  .ad-plan-hero { grid-template-columns: 1fr; }
  .ad-plan-count { flex-direction: row; align-items: baseline; justify-content: start; gap: 12px; padding: 14px 21px; border-left: 0; border-top: 1px solid #718476; }
  .ad-plan-count b { font-size: 2.5rem; }
  .ad-guide-nav { gap: 3px 14px; }
  .ad-model-grid, .ad-nav-types, .ad-demo-grid { gap: 10px; }
}
@media (max-width: 480px) {
  .ad-sector-grid, .ad-nav-types, .ad-demo-grid, .ad-concepts { grid-template-columns: 1fr; }
  .ad-sector-grid { gap: 7px; }
  .ad-sector-card { min-height: 67px; padding: 10px 14px; }
  .ad-sector-card > svg { display: block; }
  .ad-demo img { aspect-ratio: 2.8 / 1; }
  .ad-sector-hero { grid-template-columns: 1fr; }
  .ad-sector-stat { flex-direction: row; align-items: baseline; justify-content: start; gap: 9px; padding: 10px 21px; border: 0; }
  .ad-sector-stat b { font-size: 1.8rem; }
  .ad-concepts a { padding: 10px 13px; }
}

.ad-page{--ad-paper:#eeede3;--ad-line:#d4d4c8;--ad-green:#273d35;background:#f9f8f4}
.ad-hero,.ad-registry{border-radius:2px}
.ad-main .ad-plan-hero{background:#243930}
.ad-sector-card,.ad-chip,.ad-archive-link,.ad-swatch,.ad-page .ad-action,.ad-cover-image a{border-radius:2px}
.ad-signature-pick{display:grid;grid-template-columns:minmax(155px,.57fr) minmax(0,1.43fr);gap:24px;padding:clamp(20px,3vw,42px) 0;border-block:1px solid var(--ad-line)}
.ad-signature-pick>div>p{max-width:20em;margin:7px 0 0;font-size:14px;line-height:1.65;color:var(--ad-muted)}
.ad-signature-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px 16px}
.ad-signature-links a{display:grid;grid-template-columns:60px minmax(0,1fr) 18px;align-items:center;gap:9px;padding:5px 3px 9px;border-bottom:1px solid var(--ad-line)}
.ad-signature-links a img{width:60px;height:47px;object-fit:cover}
.ad-signature-links a small,.ad-signature-links a strong{display:block}
.ad-signature-links a strong{font-size:15px;letter-spacing:-.04em}
.ad-signature-links a small{color:var(--ad-muted);font-size:10px;line-height:1.35;word-break:keep-all}
.ad-signature-links a:hover strong{text-decoration:underline;text-underline-offset:3px}
@media(max-width:760px){.ad-signature-pick{grid-template-columns:1fr;gap:10px}.ad-signature-links{gap:7px 12px}}
@media(max-width:460px){.ad-signature-links{grid-template-columns:1fr}.ad-signature-links a{grid-template-columns:67px minmax(0,1fr) 18px}.ad-signature-links a img{width:67px;height:46px}}