:root{--paper:#fff;--surface:#f5f5f6;--ink:#111;--muted:#65656a;--line:#dcdcdf;--red:#cc0000;--bar:rgba(255,255,255,.97);color-scheme:light}
html[data-theme="dark"]{--paper:#09090a;--surface:#171719;--ink:#f7f7f8;--muted:#aaaab0;--line:#3a3a3e;--bar:rgba(9,9,10,.97);color-scheme:dark}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:"IBM Plex Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;-webkit-font-smoothing:antialiased}button,input{font:inherit}button{cursor:pointer}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}.skip-link{position:absolute;left:16px;top:-70px;z-index:20;background:var(--ink);color:var(--paper);padding:10px 14px}.skip-link:focus{top:8px}
.site-bar{position:sticky;top:0;z-index:10;background:var(--bar);border-bottom:1px solid var(--line);backdrop-filter:blur(14px)}.site-bar-inner{width:min(1440px,100%);margin:auto;padding:10px clamp(18px,3vw,44px);display:flex;align-items:center;justify-content:space-between;gap:30px;min-height:62px}.wordmark{display:flex;align-items:center;gap:10px;white-space:nowrap;color:var(--ink);text-decoration:none;font:700 13px "IBM Plex Sans",sans-serif;letter-spacing:-.02em}.brand-sigil{width:30px;height:30px;border:3px solid var(--ink);border-right-color:transparent;border-radius:50%;display:grid;place-items:center;line-height:1;transform:rotate(-25deg);font-size:13px}.brand-sigil::first-letter{transform:rotate(25deg)}.bar-tools{display:flex;align-items:center;justify-content:flex-end;gap:10px;min-width:0}.search-wrap{width:min(300px,26vw);position:relative}.search-wrap input{width:100%;height:37px;border:1px solid var(--line);border-radius:3px;background:var(--surface);color:var(--ink);padding:0 12px;font-size:12px}.search-wrap input:focus-visible{outline:2px solid var(--red);outline-offset:2px}.search-results{position:absolute;top:calc(100% + 6px);left:0;right:0;min-width:300px;max-height:390px;overflow:auto;display:none;border:1px solid var(--line);background:var(--paper);box-shadow:0 14px 28px rgba(0,0,0,.12)}.search-results.open{display:block}.search-results button{width:100%;border:0;border-bottom:1px solid var(--line);padding:10px 12px;background:transparent;color:var(--ink);text-align:left;display:flex;justify-content:space-between;gap:12px;font-size:12px}.search-results button:hover,.search-results button:focus-visible{background:var(--surface)}.search-results small{font:500 10px "IBM Plex Mono",monospace;color:var(--muted);white-space:nowrap}.search-results p{margin:0;padding:12px;color:var(--muted);font-size:12px}.theme-switch{display:flex;align-items:center;padding:2px;border:1px solid var(--line);border-radius:30px}.theme-switch button{border:0;background:transparent;color:var(--muted);padding:7px 11px;border-radius:30px;font:600 11px "IBM Plex Mono",monospace}.theme-switch button[aria-pressed="true"]{background:var(--ink);color:var(--paper)}.utility-button{border:1px solid var(--line);background:transparent;color:var(--ink);padding:9px 11px;border-radius:3px;white-space:nowrap;font:600 11px "IBM Plex Mono",monospace}.utility-button[aria-pressed="true"].code-button{border-color:var(--red);color:var(--red)}.site-bar button:focus-visible,.site-bar a:focus-visible,.category-nav a:focus-visible,.site-footer a:focus-visible{outline:2px solid var(--red);outline-offset:2px}
.catalog{width:min(1440px,100%);margin:auto;padding:0 clamp(18px,3vw,44px) 110px;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));column-gap:20px;row-gap:24px;align-items:stretch}.hero-copy,.category-nav,.group-heading,.catalog .source .atlas-item{order:var(--item-order)}.hero-copy{grid-column:span 3;min-height:560px;padding:64px 20px 48px 0;display:flex;flex-direction:column;justify-content:center}.hero-kicker{font:600 11px "IBM Plex Mono",monospace;text-transform:uppercase;letter-spacing:.18em;color:var(--muted);margin-bottom:32px}.hero-copy h1{margin:0;font-size:clamp(62px,7vw,114px);letter-spacing:-.075em;line-height:.87;font-weight:800}.hero-copy h1 span{color:var(--red)}.hero-copy p{max-width:550px;font-size:clamp(17px,1.5vw,21px);line-height:1.5;margin:32px 0 0;color:var(--muted)}.hero-facts{display:flex;gap:0;margin-top:46px}.hero-facts div{min-width:118px;padding-right:22px;margin-right:22px;border-right:1px solid var(--line);display:flex;flex-direction:column;gap:4px}.hero-facts div:last-child{border-right:0}.hero-facts strong{font-size:28px;letter-spacing:-.05em;line-height:1}.hero-facts span{font:500 10px "IBM Plex Mono",monospace;text-transform:uppercase;letter-spacing:.12em;color:var(--muted)}
.category-nav{grid-column:1/-1;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-top:8px}.category-nav a{display:flex;gap:10px;align-items:center;min-height:62px;padding:8px 8px 8px 0;color:var(--ink);text-decoration:none;font:600 11px "IBM Plex Mono",monospace}.category-nav a span{color:var(--red)}.category-nav a:hover{text-decoration:underline;text-decoration-color:var(--red);text-underline-offset:6px}.group-heading{grid-column:1/-1;scroll-margin-top:90px;border-top:1px solid var(--ink);padding-top:20px;margin-top:58px;display:grid;grid-template-columns:1fr 1fr auto;align-items:end;gap:20px}.group-number{grid-column:1/-1;font:600 11px "IBM Plex Mono",monospace;color:var(--red);letter-spacing:.12em}.group-heading h2{font-size:clamp(42px,5vw,70px);letter-spacing:-.065em;line-height:.96;margin:0}.group-heading p{font:400 15px/1.5 "IBM Plex Mono",monospace;color:var(--muted);margin:0;max-width:500px}.group-count{font:600 11px "IBM Plex Mono",monospace;color:var(--muted);text-transform:uppercase;white-space:nowrap;align-self:end;padding-bottom:4px}
.source,.catalog .source .page,.catalog .source .grid{display:contents!important}.catalog .source header,.catalog .source .accentrow,.catalog .source .section-title,.catalog .source .finish-line,.catalog .source .code-veil-item{display:none!important}.catalog .source .atlas-item{grid-column:span 3;min-width:0;display:flex;flex-direction:column;gap:12px;border-top:1px solid var(--line);padding-top:12px;scroll-margin-top:98px}.catalog .source .atlas-item.wide-item{grid-column:span 6}.catalog .source .atlas-item.featured-item{grid-column:span 3;min-height:560px;border-top:0;padding-top:38px;justify-content:center}.catalog .source .atlas-item.featured-item .card{min-height:440px}.item-meta{display:flex;align-items:center;justify-content:space-between;color:var(--red);font:600 10px "IBM Plex Mono",monospace;letter-spacing:.11em;text-transform:uppercase}.catalog .source .cap{display:flex;align-items:start;justify-content:space-between;gap:12px;padding:0;margin:0;color:var(--ink);font:600 18px/1.2 "IBM Plex Sans",sans-serif;letter-spacing:-.025em}.catalog .source .cap>span:first-child{max-width:72%;color:var(--ink)}.catalog .source .cap .pill{font:500 10px "IBM Plex Mono",monospace;letter-spacing:0;color:var(--muted);background:transparent;border:1px solid var(--line);border-radius:3px;padding:5px 7px;white-space:normal;text-align:right}.catalog .source .card{background:var(--surface);border-radius:0;padding:28px 26px;min-height:370px;width:100%;height:100%;display:flex;flex-direction:column;align-items:center;gap:18px;min-width:0;box-shadow:none}.catalog .source .component-copy{order:50;margin-top:auto;align-self:stretch;max-width:680px;color:var(--muted);font-size:13px;line-height:1.58}.catalog .source .hint{order:60;color:var(--muted);font-size:11px;line-height:1.5}.catalog .source .readout{font-variant-numeric:tabular-nums}.catalog .source .rthemes{order:-1}.catalog .source .code-snippet{order:70;max-height:0;opacity:0;visibility:hidden;margin-top:0}.catalog .source .code-snippet.open{width:min(780px,100%);max-height:560px;opacity:1;visibility:visible;margin-top:4px;overflow:auto}.catalog .source .view-code{display:none;margin-left:auto;border:1px solid var(--line);border-radius:3px;background:transparent;color:var(--ink);padding:5px 8px;font:600 10px "IBM Plex Mono",monospace}.code-mode .catalog .source .view-code{display:inline-block}.catalog .source .view-code[aria-expanded="true"]{color:var(--red);border-color:var(--red)}.catalog .source .view-code:focus-visible{outline:2px solid var(--red);outline-offset:2px}
html[data-theme="dark"] .catalog .source .card{background:var(--surface);color:var(--ink)}html[data-theme="dark"] .catalog .source .component-copy,html[data-theme="dark"] .catalog .source .hint,html[data-theme="dark"] .catalog .source .readout{color:var(--muted)}html[data-theme="dark"] .catalog .source .component-copy strong,html[data-theme="dark"] .catalog .source .readout b{color:var(--ink)}html[data-theme="dark"] .catalog .source .pill{background:transparent;color:var(--muted)}html[data-theme="dark"] .catalog .source .rthemes button,html[data-theme="dark"] .catalog .source .stepbar button{background:#242427;color:var(--ink);border-color:#4b4b50}html[data-theme="dark"] .catalog .source .rthemes button[aria-pressed="true"],html[data-theme="dark"] .catalog .source .stepbar button[aria-pressed="true"]{background:#f7f7f8;color:#111;border-color:#f7f7f8}
html[data-theme="dark"] .catalog .source{--ink:#f7f7f8;--muted:#aaaab0;--tile:#171719;--paper:#09090a;--line:#3a3a3e}
html[data-theme="dark"] .catalog .source .cap,html[data-theme="dark"] .catalog .source .cap>span:first-child{color:#f7f7f8}
html[data-theme="dark"] .catalog .source .prevnext button{background:#29292d;color:#f7f7f8;border-color:#4b4b50}
.site-footer{border-top:1px solid var(--line);padding:28px clamp(18px,3vw,44px) 45px;max-width:1440px;margin:auto;display:flex;justify-content:space-between;gap:24px;color:var(--muted)}.site-footer strong{color:var(--ink);font-size:14px}.site-footer p{margin:7px 0 0;font-size:13px}.site-footer a{color:var(--ink);font:600 11px "IBM Plex Mono",monospace;text-decoration:none}
@media(max-width:980px){.catalog{column-gap:16px}.site-bar-inner{align-items:flex-start;flex-direction:column;gap:10px}.bar-tools{width:100%;justify-content:flex-start}.search-wrap{width:min(330px,35vw)}.category-nav{overflow-x:auto;grid-template-columns:repeat(6,minmax(150px,1fr))}.group-heading{grid-template-columns:1fr auto}.group-heading p{grid-column:1/-1;grid-row:3}.group-count{grid-column:2;grid-row:2}}
@media(max-width:700px){html,body{overflow-x:clip}.catalog{grid-template-columns:1fr;row-gap:20px}.hero-copy,.catalog .source .atlas-item,.catalog .source .atlas-item.wide-item,.catalog .source .atlas-item.featured-item,.group-heading,.category-nav{grid-column:1/-1}.hero-copy{min-height:auto;padding:52px 0 24px}.hero-copy h1{font-size:clamp(56px,14vw,82px)}.hero-copy p{font-size:17px;margin-top:24px}.hero-facts{margin-top:30px}.hero-facts div{min-width:90px;padding-right:12px;margin-right:12px}.catalog .source .atlas-item.featured-item{min-height:0;padding-top:6px}.catalog .source .atlas-item.featured-item .card{min-height:380px}.category-nav{margin-top:12px}.group-heading{margin-top:42px;grid-template-columns:1fr auto}.group-heading h2{font-size:44px}.group-heading p{grid-column:1/-1}.catalog .source .cap{font-size:17px}.catalog .source .card{padding:24px 16px}.bar-tools{flex-wrap:wrap}.search-wrap{width:100%;flex-basis:100%}.site-bar-inner{padding-block:10px}.site-bar{position:relative}}
@media(max-width:360px){.hero-facts div{min-width:73px}.hero-facts strong{font-size:23px}.theme-switch button,.utility-button{font-size:10px;padding-inline:7px}.catalog .source .cap{flex-wrap:wrap}.catalog .source .cap>span:first-child{max-width:100%}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
/* One top-bar code drawer; embedded snippets remain as the read-only source. */
.code-button[aria-expanded="true"]{border-color:var(--red);color:var(--red)}
.code-drawer[hidden]{display:none!important}
.code-drawer{position:fixed;top:62px;right:max(20px,calc((100vw - 1440px)/2 + 44px));z-index:12;width:min(660px,calc(100vw - 40px));max-height:calc(100dvh - 80px);display:flex;flex-direction:column;gap:12px;overflow:auto;padding:18px;background:var(--paper);color:var(--ink);border:1px solid var(--line);box-shadow:0 20px 50px rgba(0,0,0,.25)}
.code-drawer-head{display:flex;align-items:center;justify-content:space-between;gap:12px;font:600 11px "IBM Plex Mono",monospace;text-transform:uppercase;letter-spacing:.06em}
.code-drawer-head button{border:1px solid var(--line);border-radius:3px;background:var(--surface);color:var(--ink);padding:8px 10px;font:600 11px "IBM Plex Mono",monospace}
.code-drawer label{font:600 10px "IBM Plex Mono",monospace;text-transform:uppercase;color:var(--muted)}
.code-drawer select{width:100%;padding:9px;border:1px solid var(--line);background:var(--surface);color:var(--ink);font:500 12px "IBM Plex Mono",monospace}
.code-drawer pre{overflow:auto;min-height:180px;max-height:calc(100dvh - 230px);margin:0;padding:16px;background:#111;color:#f5f5f5;font:12px/1.55 "IBM Plex Mono",monospace;white-space:pre}
.code-drawer :focus-visible{outline:2px solid var(--red);outline-offset:2px}
.catalog .source .code-snippet{display:none!important}
@media(max-width:700px){.code-drawer{top:10px;left:10px;right:10px;width:auto;max-height:calc(100dvh - 20px)}}

/* The authored Aemeth state cards use a light selected/hover surface. */
html[data-theme="dark"] .catalog .source .ae-st[aria-pressed="true"],html[data-theme="dark"] .catalog .source .ae-st:hover{--ink:#111;--muted:#6e6e6e}

/* Top-level purpose copy for the atlas introduction. */
.collection-links{display:flex;flex-wrap:wrap;gap:0 24px}.hud-gallery .study-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.hud-item .study-preview{aspect-ratio:16/10;padding:0;background:#09090a}.hud-item .study-preview img{inset:0;width:100%;height:100%;object-fit:contain}@media(max-width:700px){.hud-gallery .study-grid{grid-template-columns:1fr}}
.hero-brief{margin:30px 0 0;max-width:550px;display:flex;flex-direction:column}
.hero-brief>div{display:grid;grid-template-columns:78px 1fr;gap:14px;align-items:baseline;padding:10px 0;border-top:1px solid var(--line)}
.hero-brief dt{font:600 10px "IBM Plex Mono",monospace;text-transform:uppercase;letter-spacing:.12em;color:var(--red)}
.hero-brief dd{margin:0;font:400 13px/1.5 "IBM Plex Mono",monospace;color:var(--muted)}
@media(max-width:640px){.hero-brief>div{grid-template-columns:1fr;gap:4px}}

/* Reserve the authored 340px gauge face instead of collapsing its auto grid track. */
@media(min-width:901px){.catalog .source .qt-wrap{grid-template-columns:340px minmax(0,1fr)}}
html[data-theme="dark"] .catalog .source .qt-verdict{--ink:#111;--muted:#6e6e6e}

/* Device studies keep separate runtime pages and use real rendered previews. */
.catalog .atlas-item{position:relative}.showcase-anchor{position:absolute;top:0;left:0;width:1px;height:1px;scroll-margin-top:98px}.devices-jump{display:inline-block;margin-top:26px;color:var(--ink);font:600 13px "IBM Plex Mono",monospace;text-underline-offset:5px}.study-gallery{width:min(1440px,100%);margin:0 auto;padding:0 clamp(18px,3vw,44px) 100px;scroll-margin-top:90px}.study-heading{border-top:1px solid var(--ink);padding-top:26px;margin-bottom:32px}.study-heading h2{font-size:clamp(32px,4vw,54px);letter-spacing:-.04em;margin:0 0 16px}.study-heading p{max-width:640px;color:var(--muted);line-height:1.6}.study-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:38px 24px}.study-item{min-width:0;scroll-margin-top:90px;display:flex;flex-direction:column}.study-preview{display:grid;place-items:center;position:relative;overflow:hidden;aspect-ratio:16/10;background:var(--surface);padding:18px;border:1px solid var(--line)}.study-preview img{position:absolute;top:18px;left:18px;width:calc(100% - 36px);height:calc(100% - 36px);min-height:0;object-fit:contain}.preview-dark{display:none}html[data-theme="dark"] .preview-light{display:none}html[data-theme="dark"] .preview-dark{display:block}.study-item h3{font-size:19px;letter-spacing:-.02em;line-height:1.3;margin:18px 0 8px}.study-item h3 a{color:var(--ink);text-decoration:none}.study-item p{font-size:13px;line-height:1.6;color:var(--muted);margin:0 0 16px}.study-open{display:inline-flex;align-items:center;min-height:44px;color:var(--ink);text-decoration-color:var(--red);font:600 11px "IBM Plex Mono",monospace;text-underline-offset:4px;margin-top:auto}.study-gallery a:focus-visible,.devices-jump:focus-visible{outline:2px solid var(--red);outline-offset:4px}@media(max-width:980px){.study-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:600px){.study-grid{grid-template-columns:1fr}.study-gallery{padding-bottom:60px}.study-item h3{font-size:19px}}