/* H< — an illustrated journal for ideas in artificial intelligence. */
:root {
  --bg:#0d1110; --paper:#151c18; --surface:#1b2420; --ink:#f1f3ec;
  --muted:#adb8b0; --faint:#8d9e93; --line:#2a3730;
  --accent:#d5a17c; --teal:#b7d7c3; --bg-rgb:13,17,16;
  --display:'Space Grotesk',Arial,sans-serif; --sans:'Inter',Arial,sans-serif;
  --mono:'JetBrains Mono',monospace; --serif:var(--display); color-scheme:dark;
}
:root[data-theme=light] {
  --bg:#f6f5ee; --paper:#eeeee5; --surface:#e5e9df; --ink:#182b22;
  --muted:#526258; --faint:#617267; --line:#d3dbcf;
  --accent:#925b36; --teal:#326a4c; --bg-rgb:246,245,238; color-scheme:light;
}
* { box-sizing:border-box }
html { scroll-behavior:smooth; scroll-padding-top:40px }
body { margin:0; background:var(--bg); color:var(--ink); font:16px/1.7 var(--sans); -webkit-font-smoothing:antialiased }
button,input,select { font:inherit }
button { color:inherit; cursor:pointer }
a { color:inherit; text-decoration:none }
a,button,select { -webkit-tap-highlight-color:transparent; transition:color .2s,background .2s,border-color .2s,transform .2s }
button,input,select { border-radius:0 }
svg,img { display:block }
[hidden] { display:none!important }
::selection { background:var(--teal); color:var(--bg) }
a:hover { color:var(--teal) }
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible { outline:2px solid var(--teal); outline-offset:5px }
h1,h2,h3,p,figure { margin-top:0 }
h1,h2,h3 { font-family:var(--display); font-weight:600 }
h2 { font-size:44px; line-height:1.15; letter-spacing:-.045em; margin-bottom:0; text-wrap:balance }
.wrap,.content-wrap { width:calc(100% - 112px); max-width:1248px; margin:0 auto }
.mono { font-family:var(--mono) }
.eyebrow,.figure-label { font:500 11px/1.6 var(--mono); letter-spacing:.055em; text-transform:uppercase; color:var(--teal) }
.eyebrow { margin:0 0 17px }
.glyph { width:24px; height:24px; flex:none; fill:none; stroke:currentColor; stroke-width:1.65; stroke-linecap:round; stroke-linejoin:round }
.glyph-brand { fill:currentColor; stroke:none; overflow:visible }
.sr-only,.motion-button span { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0 }
.skip-link { position:fixed; top:-100px; left:20px; z-index:20; padding:10px 20px; background:var(--ink); color:var(--bg) }
.skip-link:focus { top:10px }
/* Navigation */
.masthead { height:100px; display:flex; align-items:center; gap:38px; border-bottom:1px solid var(--line); position:relative; z-index:5 }
.identity { display:inline-flex; align-items:center; min-width:54px; min-height:48px; margin-right:auto }
.identity-mark .glyph { width:50px; height:40px; color:var(--ink) }
.masthead nav { display:flex; gap:36px; font-size:14px; font-weight:500; color:var(--muted) }
.masthead nav a { padding:12px 0 }
.header-tools { display:flex; gap:8px; padding-left:26px; border-left:1px solid var(--line) }
.icon-button { width:44px; height:44px; display:grid; place-items:center; border:0; border-radius:50%; background:transparent; color:var(--muted) }
.icon-button .glyph { width:22px; height:22px }
.icon-button:hover { background:var(--paper); color:var(--ink) }
.menu-button { display:none }
/* The approved latent field stays full bleed and continuous. */
.hero { position:relative; isolation:isolate; overflow:hidden; background:var(--bg) }
.hero-field { position:absolute; inset:0; margin:0; z-index:0; pointer-events:none; mix-blend-mode:screen; opacity:.82; mask-image:radial-gradient(ellipse 90% 94% at 74% 47%,#000 15%,#000 45%,transparent 88%); -webkit-mask-image:radial-gradient(ellipse 90% 94% at 74% 47%,#000 15%,#000 45%,transparent 88%) }
#field { width:100%; height:100%; display:block; pointer-events:none }
.field-fallback { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transform:scale(1.12) }
.hero::after { content:''; position:absolute; inset:0; z-index:1; pointer-events:none; background:linear-gradient(90deg,rgba(var(--bg-rgb),.99) 0%,rgba(var(--bg-rgb),.92) 28%,rgba(var(--bg-rgb),.4) 54%,rgba(var(--bg-rgb),0) 78%) }
[data-theme=light] .hero-field { mix-blend-mode:multiply; filter:invert(1) hue-rotate(180deg); opacity:.65 }
.hero-inner { min-height:740px; padding-top:88px; padding-bottom:100px; position:relative; z-index:2; display:flex; align-items:center }
.hero-copy { max-width:1000px }
.hero-kicker { font:500 11px/1.8 var(--mono); letter-spacing:.04em; text-transform:uppercase; color:var(--teal); margin-bottom:32px }
.hero h1 { font:500 clamp(68px,7.7vw,110px)/1.02 var(--display); letter-spacing:-.065em; margin:0 0 30px }
.hero h1>span { display:block }
.hero h1>.hero-overline { font:400 27px/1.4 var(--sans); letter-spacing:-.035em; margin-bottom:15px }
.hero-humanity,.hero-next { white-space:nowrap }
.hero-next { color:var(--teal) }
.hero-description { max-width:460px; font-size:17px; line-height:1.8; color:var(--muted); margin-bottom:30px; text-wrap:pretty }
.hero-cta { display:inline-flex; align-items:center; gap:30px; font-size:14px; font-weight:600; line-height:1.5; padding:17px 23px; border:1px solid var(--ink); border-radius:6px; background:var(--ink); color:var(--bg) }
.hero-cta:hover { color:var(--bg); background:var(--teal); border-color:var(--teal); transform:translateY(-2px) }
.hero-cta .glyph { width:22px; height:22px }
.motion-button { position:absolute; bottom:28px; right:0; display:grid; place-items:center; width:44px; height:44px; padding:0; background:transparent; border:1px solid var(--line); color:var(--muted); border-radius:50% }
.motion-button .glyph { width:15px; height:15px }
.motion-button:hover { color:var(--ink); background:var(--paper) }
.text-link { display:inline-flex; align-items:center; gap:10px; background:transparent; border:0; font-size:14px; font-weight:500; line-height:1.6; padding:8px 0; color:var(--muted) }
.text-link .glyph { width:19px; height:19px; color:var(--teal) }
.text-link:hover { color:var(--ink) }
/* Journal: one illustrated opening story, then an even editorial grid. */
.journal { padding:78px 0 104px; border-top:1px solid var(--line) }
.section-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:24px; margin-bottom:36px }
.section-intro { max-width:340px; font-size:15px; line-height:1.75; color:var(--muted); margin:0; text-wrap:pretty }
.journal-tools { display:flex; align-items:center; justify-content:space-between; gap:24px; padding:0 0 18px; margin-bottom:32px; border-bottom:1px solid var(--line) }
.search-box { display:flex; align-items:center; gap:12px; flex:1; max-width:380px }
.search-box .glyph { width:20px; height:20px; color:var(--faint) }
.search-box input { width:100%; min-width:0; background:transparent; border:0; color:var(--ink); font-size:14px; padding:12px 0 }
.search-box input::placeholder { color:var(--faint) }
.topic-picker { display:flex; position:relative; align-items:center; flex:none }
.topic-picker select { appearance:none; -webkit-appearance:none; background:var(--bg); border:0; color:var(--muted); font-size:13px; padding:10px 28px 10px 8px; max-width:200px; min-height:44px; cursor:pointer }
.topic-picker>.glyph { position:absolute; right:0; width:17px; height:17px; pointer-events:none; color:var(--faint) }
#entries,.related-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:48px 36px; min-width:0 }
.entry { position:relative; min-width:0; display:flex; flex-direction:column; padding-bottom:28px; border-bottom:1px solid var(--line) }
.entry-visual { overflow:hidden; border-radius:10px; background:#101913; margin-bottom:25px; isolation:isolate }
.entry-cover { width:100%; height:auto; aspect-ratio:1.95; object-fit:cover; transition:transform .6s cubic-bezier(.2,.7,.2,1) }
.entry-copy { display:flex; flex-direction:column; flex:1; min-width:0 }
.entry-category { display:flex; align-items:center; flex-wrap:wrap; gap:8px 14px; font-size:12px; font-weight:500; line-height:1.6; color:var(--faint); margin-bottom:16px }
.entry-category>span:first-child { color:var(--teal) }
.entry-category>span+span { padding-left:14px; border-left:1px solid var(--line) }
.entry h3 { font-size:32px; line-height:1.16; letter-spacing:-.04em; margin:0 0 17px; text-wrap:pretty }
.entry p { max-width:560px; color:var(--muted); font-size:15px; line-height:1.8; margin:0 0 25px; text-wrap:pretty }
.entry-bottom { display:flex; align-items:center; justify-content:space-between; gap:18px; margin-top:auto }
.entry-meta { display:flex; align-items:center; flex-wrap:wrap; gap:5px 12px; color:var(--faint); font-size:12px; line-height:1.7 }
.entry-meta time,.entry-meta>span { white-space:nowrap }
.entry-meta>span:last-child::before { content:'·'; margin-right:12px }
.entry-arrow { width:38px; height:38px; display:grid; place-items:center; color:var(--teal); border:1px solid var(--line); border-radius:50%; transition:background .2s,color .2s,transform .2s }
.entry-arrow .glyph { width:21px; height:21px }
.entry-link::after { content:''; position:absolute; inset:0; z-index:1; border-radius:10px }
.entry-link:focus-visible { outline:none }
.entry-link:focus-visible::after { outline:2px solid var(--teal); outline-offset:6px }
.entry:has(.entry-link:hover) .entry-cover { transform:scale(1.035) }
.entry:has(.entry-link:hover) .entry-arrow { background:var(--teal); color:var(--bg); transform:translateX(3px) }
.entry-lead { grid-column:1/-1; display:grid; grid-template-columns:1.08fr 1fr; border:1px solid var(--line); background:var(--paper); border-radius:14px; overflow:hidden; padding:0 }
.entry-lead .entry-visual { margin:0; border-radius:0; height:100% }
.entry-lead .entry-cover { aspect-ratio:1.35; min-height:430px; height:100% }
.entry-lead .entry-copy { padding:42px 42px 32px; align-self:center }
.entry-lead h3 { font-size:45px; line-height:1.08; letter-spacing:-.05em; margin-bottom:22px }
.entry-lead p { font-size:16px; margin-bottom:34px }
.entry-lead .entry-bottom { padding-top:16px }
#empty-state { padding:50px 0; text-align:center; border-bottom:1px solid var(--line) }
#empty-state h3 { font-size:30px; margin-bottom:10px }
#empty-state p { color:var(--muted) }
/* Supporting sections stay quiet and spacious. */
.lab,.about { display:grid; grid-template-columns:1fr 2fr; gap:100px; padding:72px 0 90px; border-top:1px solid var(--line) }
.lab .section-heading { flex-direction:column; align-items:flex-start; justify-content:flex-start; gap:17px; margin:0 }
.lab .eyebrow { margin-bottom:0 }
.lab .section-intro { max-width:260px }
.lab .text-link { margin-top:3px }
.model-list { min-width:0 }
.model-list>a { display:flex; align-items:center; justify-content:space-between; gap:30px; padding:28px 0; border-bottom:1px solid var(--line) }
.model-list>a:first-child { padding-top:0 }
.model-list h3 { font-size:24px; line-height:1.35; letter-spacing:-.035em; margin:0 0 8px }
.model-list p { color:var(--muted); font-size:14px; line-height:1.8; margin:0 }
.model-list>a>.glyph { width:23px; height:23px; color:var(--teal) }
.about h2 { font-size:35px }
.about-copy { max-width:760px; min-width:0 }
.about-copy p { font:400 27px/1.5 var(--display); letter-spacing:-.025em; margin-bottom:28px; text-wrap:pretty }
.social-links { display:flex; flex-wrap:wrap; gap:28px; font-size:14px; font-weight:500; color:var(--muted) }
.social-links a { display:inline-flex; align-items:center; gap:8px }
.social-links .glyph { width:17px; height:17px; color:var(--faint) }
.footer { display:flex; align-items:center; justify-content:space-between; gap:24px; border-top:1px solid var(--line); padding:32px 0 38px; color:var(--faint); font-size:12px }
.footer-name { display:flex; align-items:center; gap:14px; font:500 15px var(--display); color:var(--muted) }
.footer-name>.glyph { width:34px; height:27px }
.back-top { display:inline-flex; align-items:center; gap:12px }
.back-top .glyph { width:19px; height:19px }
/* Reader: an opening spread followed by a focused, anchored reading column. */
.reader { width:calc(100% - 112px); max-width:1248px; margin:0 auto; padding:38px 0 96px }
.reader-nav { display:flex; justify-content:space-between; align-items:center; margin-bottom:48px }
.reader-return { display:inline-flex; align-items:center; gap:10px; font-size:13px; color:var(--muted); padding:7px 0 }
.reader-return .glyph { width:20px; height:20px; color:var(--teal) }
.reader-edition { font:11px var(--mono); color:var(--faint) }
.reader-opening { display:grid; grid-template-columns:1.08fr 1fr; align-items:center; gap:56px; padding-bottom:64px; border-bottom:1px solid var(--line); margin-bottom:64px }
.reader-head .entry-category { margin-bottom:23px }
.reader-head h1 { font:600 clamp(42px,4.65vw,66px)/1.05 var(--display); letter-spacing:-.055em; margin:0 0 25px; text-wrap:pretty }
.reader-subtitle { color:var(--muted); font-size:17px; line-height:1.8; max-width:610px; margin-bottom:30px; text-wrap:pretty }
.reader-byline { display:flex; align-items:center; gap:14px }
.author-mark { display:grid; place-items:center; width:45px; height:45px; border:1px solid var(--line); border-radius:50%; color:var(--teal) }
.author-mark .glyph { width:27px; height:23px }
.reader-author { display:block; font-size:13px; font-weight:500; margin-bottom:3px }
.reader-meta { font-size:11px }
.reader-cover { margin:0; min-width:0 }
.reader-cover>img { width:100%; height:auto; aspect-ratio:1.08; object-fit:cover; border-radius:12px; background:#0d1110 }
.reader-cover>figcaption { padding-top:12px; font-size:11px; line-height:1.7; color:var(--faint) }
.reader-layout { display:grid; grid-template-columns:210px minmax(0,720px); gap:90px; justify-content:center; align-items:start }
.reader-sidebar { position:sticky; top:36px; align-self:start }
.reader-contents { border-top:1px solid var(--line); padding-top:17px }
.reader-contents summary { display:flex; align-items:center; justify-content:space-between; gap:14px; font-size:13px; font-weight:600; line-height:1.6; list-style:none; cursor:pointer }
.reader-contents summary::-webkit-details-marker { display:none }
.reader-contents summary .glyph { width:17px; height:17px; transition:transform .2s }
.reader-contents[open] summary .glyph { transform:rotate(180deg) }
.reader-contents ol { list-style:none; padding:0; margin:21px 0 0; display:grid; gap:17px }
.reader-contents a { display:flex; align-items:baseline; gap:10px; font-size:12px; line-height:1.6; color:var(--faint) }
.reader-contents a>span { font:10px var(--mono); color:var(--accent) }
.reader-contents a:hover,.reader-contents a[aria-current=true] { color:var(--ink) }
.reader-contents a[aria-current=true]>span { color:var(--teal) }
.reader-sidebar-back { font-size:12px; margin-top:30px; border-top:1px solid var(--line); padding-top:20px; width:100% }
.reader-body { color:var(--muted); font-size:18px; line-height:1.85; overflow-wrap:break-word; min-width:0 }
.reader-body p { margin-bottom:25px }
.reader-body strong { font-weight:600; color:var(--ink) }
.reader-body .article-lead { font:400 25px/1.6 var(--display); letter-spacing:-.02em; color:var(--ink); margin-bottom:36px }
.reader-body h2 { color:var(--ink); font:600 32px/1.2 var(--display); letter-spacing:-.04em; margin:50px 0 22px; text-wrap:pretty; scroll-margin-top:36px }
.reader-body h3 { color:var(--ink); font:600 22px/1.35 var(--display); letter-spacing:-.025em; margin:34px 0 18px }
.reader-body code { font-family:var(--mono); font-size:.8em; color:var(--teal); overflow-wrap:anywhere }
.reader-body>p a { color:var(--ink); text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:4px; text-decoration-color:var(--faint) }
.reader-body>p a:hover { color:var(--teal) }
.reader-body .article-takeaway { margin:36px 0 44px; padding:24px 28px; border-left:3px solid var(--teal); border-radius:0 8px 8px 0; background:var(--paper) }
.article-takeaway .figure-label { display:block; margin-bottom:12px }
.reader-body .article-takeaway p { font:500 23px/1.45 var(--display); letter-spacing:-.02em; color:var(--ink); margin:0 }
.article-specs { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); margin:32px 0 14px; padding:24px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line) }
.article-specs>div { padding:0 24px; border-left:1px solid var(--line) }
.article-specs>div:first-child { padding-left:0; border-left:0 }
.article-specs dt { font-size:11px; line-height:1.8; color:var(--faint); margin-bottom:12px }
.article-specs dd { font:500 33px/1.2 var(--display); letter-spacing:-.045em; color:var(--ink); margin:0 }
.reader-body .figure-footnote { font-size:12px; line-height:1.8; color:var(--faint); margin:15px 0 32px }
/* Diagrams and examples are treated as designed editorial figures. */
.technical-figure { border:1px solid var(--line); border-radius:10px; background:var(--paper); padding:27px 30px; margin:34px 0 }
.figure-heading { display:flex; justify-content:space-between; align-items:baseline; flex-wrap:wrap; gap:8px 16px; margin-bottom:30px }
.figure-heading>span:last-child { font-size:11px; color:var(--faint) }
.technical-figure figcaption { font:12px/1.85 var(--sans); color:var(--faint); border-top:1px solid var(--line); padding-top:19px; margin-top:25px }
.lora-diagram { display:flex; align-items:center; justify-content:center; gap:25px; padding:12px 0 25px }
.matrix-block { position:relative; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; border:1px solid var(--line); border-radius:3px; background-color:var(--bg); background-image:linear-gradient(color-mix(in srgb,var(--teal) 9%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in srgb,var(--teal) 9%,transparent) 1px,transparent 1px); background-size:14px 14px; color:var(--ink) }
.matrix-block strong { font:500 43px/1 var(--display); color:inherit }
.matrix-block small { font:10px/1.4 var(--mono); color:var(--muted) }
.matrix-block>span { font:9px var(--mono); text-transform:uppercase; letter-spacing:.03em; color:var(--muted) }
.matrix-base { width:145px; height:145px }
.adapter-group { position:relative; display:flex; align-items:center; gap:14px; padding-top:24px; color:var(--teal) }
.adapter-label { position:absolute; left:0; right:0; top:0; text-align:center; font:9px var(--mono); text-transform:uppercase; letter-spacing:.04em }
.matrix-b { width:60px; height:145px; border-color:color-mix(in srgb,var(--teal) 50%,var(--line)); color:var(--teal) }
.matrix-a { width:145px; height:75px; border-color:color-mix(in srgb,var(--accent) 50%,var(--line)); color:var(--accent) }
.math-operator { font:400 28px/1 var(--display); color:var(--faint) }
.figure-equation { font:400 26px/1.4 var(--display); text-align:center; color:var(--ink) }
.figure-equation span { color:var(--teal) }
.process-flow { list-style:none; padding:0; margin:0; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:26px }
.process-flow-four { grid-template-columns:repeat(4,minmax(0,1fr)) }
.process-flow li { border-left:1px solid var(--line); padding-left:18px }
.process-flow li>span { display:block; font:10px/1.8 var(--mono); color:var(--teal); margin-bottom:10px }
.process-flow strong { display:block; font:500 19px/1.4 var(--display); letter-spacing:-.025em; margin-bottom:5px }
.process-flow small { display:block; font:12px/1.8 var(--sans); color:var(--faint) }
.preference-prompt { padding:22px 24px; border:1px solid var(--line); background:var(--bg); border-radius:6px; margin-bottom:22px }
.preference-prompt>span { display:block; font:10px/1.8 var(--mono); text-transform:uppercase; color:var(--faint); margin-bottom:10px }
.reader-body .preference-prompt p { font:500 24px/1.4 var(--display); color:var(--ink); margin:0 }
.response-pair { display:grid; grid-template-columns:1fr 1fr; gap:18px }
.response { padding:22px; border-top:2px solid var(--teal); background:var(--bg); border-radius:0 0 5px 5px; min-width:0; display:flex; flex-direction:column }
.response.rejected { border-color:var(--accent) }
.response-label { font:10px/1.7 var(--mono); letter-spacing:.04em; text-transform:uppercase; color:var(--teal); margin-bottom:16px }
.response.rejected .response-label { color:var(--accent) }
.reader-body .response p { font:15px/1.8 var(--sans); margin:0 0 22px }
.response small { margin-top:auto; font:11px/1.7 var(--sans); color:var(--faint) }
.code-block { margin:34px 0; border:1px solid var(--line); border-radius:10px; background:var(--paper); overflow:hidden }
.code-bar { display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:62px; padding:6px 20px; border-bottom:1px solid var(--line); font:11px/1.6 var(--mono); color:var(--muted) }
.code-bar>div { display:flex; align-items:center; gap:15px }
.code-language { font-size:10px; color:var(--faint) }
.copy-code { background:transparent; border:1px solid var(--line); border-radius:5px; min-width:85px; min-height:40px; font:12px var(--sans); padding:8px 12px; color:var(--ink) }
.copy-code:hover { background:var(--bg); border-color:var(--teal) }
.code-block>pre { padding:25px 27px; margin:0; overflow-x:auto; white-space:pre; tab-size:4; font:13px/1.95 var(--mono); color:var(--ink); max-width:100%; scrollbar-color:var(--line) transparent }
.code-block pre code { font:inherit; color:inherit; overflow-wrap:normal; white-space:pre }
.syntax-comment { color:var(--faint) }
.syntax-keyword { color:var(--accent) }
.syntax-string { color:var(--teal) }
.syntax-number { color:#cbb69b }
[data-theme=light] .syntax-number { color:#865d34 }
.code-output { border-top:1px solid var(--line); padding:18px 27px; background:var(--bg) }
.code-output>span { font:10px var(--mono); text-transform:uppercase; color:var(--faint); letter-spacing:.04em }
.code-output pre { font:12px/1.9 var(--mono); margin:10px 0 0; white-space:pre-wrap; color:var(--teal) }
.article-table-wrap { margin:32px 0; border:1px solid var(--line); border-radius:8px; overflow:hidden }
.article-table { border-collapse:collapse; width:100%; font:14px/1.75 var(--sans); table-layout:fixed }
.article-table caption { font:500 12px/1.8 var(--sans); text-align:left; color:var(--faint); padding:18px 20px }
.article-table th { background:var(--paper); font-weight:600; text-align:left; font-size:12px; padding:14px 20px; color:var(--ink) }
.article-table td { padding:17px 20px; vertical-align:top; border-top:1px solid var(--line); color:var(--muted) }
.article-table td:first-child { color:var(--ink) }
.article-table th:first-child { width:37% }
.article-pull { margin:46px 0; padding:30px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line) }
.reader-body .article-pull p { font:500 31px/1.3 var(--display); letter-spacing:-.035em; color:var(--teal); margin:0 0 18px; text-wrap:pretty }
.article-pull>span { font:10px var(--mono); letter-spacing:.04em; text-transform:uppercase; color:var(--faint) }
.reader-body .article-source-link { display:flex; align-items:center; justify-content:space-between; gap:24px; background:var(--paper); border:1px solid var(--line); border-radius:8px; padding:24px 27px; margin:30px 0; text-decoration:none }
.article-source-link small { display:block; font:11px/1.8 var(--sans); color:var(--faint); margin-bottom:10px }
.article-source-link strong { font:500 19px/1.4 var(--display); letter-spacing:-.02em }
.article-source-link>.glyph { width:24px; height:24px; color:var(--teal) }
.article-source-link:hover { border-color:var(--teal) }
/* Reference material has a distinct, quieter finish. */
.reader-references { margin-top:54px; padding-top:4px; border-top:1px solid var(--line) }
.reader-body .reader-references h2 { font-size:27px; margin:28px 0 20px }
.reference-list { padding:0; list-style:none; margin:0 0 25px }
.reference-list li { border-bottom:1px solid var(--line) }
.reference-list a { display:flex; justify-content:space-between; align-items:center; gap:24px; padding:15px 0; font-size:14px; line-height:1.7; color:var(--ink) }
.reference-list .glyph { width:19px; height:19px; color:var(--teal) }
.publication-note { font-size:12px; line-height:1.9; color:var(--faint); margin:24px 0 0 }
.publication-note .figure-label { display:block; margin-bottom:10px; font-size:10px }
.reader-actions { display:flex; justify-content:space-between; align-items:center; gap:20px; margin:30px 0 0 }
.reader-actions button { display:inline-flex; align-items:center; gap:9px; background:transparent; border:1px solid var(--line); border-radius:6px; padding:12px 16px; font-size:13px }
.reader-actions button:hover { border-color:var(--teal); background:var(--paper) }
.reader-actions button .glyph { width:18px; height:18px; color:var(--teal) }
.related { border-top:1px solid var(--line); padding-top:54px; margin-top:90px }
.related-heading { margin-bottom:34px }
.related h2 { font-size:39px }
.related .entry h3 { font-size:29px }
/* Tablet */
@media(max-width:1100px) {
  .wrap,.content-wrap,.reader { width:calc(100% - 80px) }
  .hero-inner { min-height:690px; padding-top:76px; padding-bottom:90px }
  .hero h1 { font-size:clamp(65px,8.2vw,90px) }
  .entry-lead .entry-copy { padding:30px }
  .entry-lead h3 { font-size:37px }
  .entry-lead .entry-cover { min-height:410px }
  .entry h3 { font-size:29px }
  .reader-opening { gap:35px }
  .reader-head h1 { font-size:50px }
  .reader-cover>img { aspect-ratio:.95 }
  .reader-layout { grid-template-columns:180px minmax(0,1fr); gap:48px }
  .lora-diagram { gap:17px }
  .lab,.about { gap:60px }
}
@media(max-width:900px) {
  .section-heading { align-items:flex-start }
  .section-intro { max-width:280px; font-size:14px }
  h2 { font-size:37px }
  .entry-lead { grid-template-columns:1fr 1fr }
  .entry-lead h3 { font-size:33px }
  .entry-lead p { font-size:14px }
  .entry-lead .entry-copy { padding:28px }
  .entry-lead .entry-cover { min-height:400px }
  .entry-category { font-size:11px; gap:6px 10px }
  .entry-category>span+span { padding-left:10px }
  #entries,.related-grid { gap:40px 28px }
  .entry h3 { font-size:27px }
  .reader-opening { grid-template-columns:1fr; gap:30px; padding-bottom:42px; margin-bottom:36px }
  .reader-head { max-width:690px }
  .reader-head h1 { font-size:57px }
  .reader-cover>img { aspect-ratio:2.1 }
  .reader-layout { display:block; max-width:760px; margin:0 auto }
  .reader-sidebar { position:static; margin-bottom:35px }
  .reader-sidebar-back { display:none }
  .reader-contents { padding:0; border-bottom:1px solid var(--line) }
  .reader-contents summary { min-height:60px }
  .reader-contents ol { margin:0 0 24px; gap:14px }
  .reader-contents a { font-size:13px }
  .lab,.about { grid-template-columns:1fr 1.8fr; gap:45px }
  .about-copy p { font-size:24px }
}
/* Mobile: large images and readable type, without a miniature desktop layout. */
@media(max-width:700px) {
  .wrap,.content-wrap,.reader { width:calc(100% - 40px) }
  .masthead { height:80px; gap:12px }
  .identity { min-width:48px }
  .identity-mark .glyph { width:44px; height:35px }
  .header-tools { gap:2px; border:0; padding-left:0 }
  .menu-button { display:grid }
  .masthead nav { display:none; position:absolute; top:79px; left:-20px; right:-20px; padding:20px; background:var(--bg); border-bottom:1px solid var(--line); z-index:10; gap:28px; font-size:14px }
  .masthead nav.is-open { display:flex }
  .hero-inner { min-height:715px; padding-top:60px; padding-bottom:220px; align-items:flex-start }
  .hero-copy { max-width:100% }
  .hero-kicker { font-size:8.5px; line-height:1.9; letter-spacing:.015em; margin-bottom:28px }
  .hero h1 { font-size:clamp(42px,11.7vw,77px); letter-spacing:-.065em; margin-bottom:25px }
  .hero h1>.hero-overline { font-size:21px; letter-spacing:-.025em; margin-bottom:12px }
  .hero-description { max-width:350px; font-size:15px; line-height:1.85; margin-bottom:25px }
  .hero-cta { font-size:13px; padding:15px 19px; gap:28px }
  .motion-button { bottom:25px }
  .hero-field { opacity:.8; mask-image:linear-gradient(180deg,transparent 0%,#000 30%,#000 76%,transparent 100%); -webkit-mask-image:linear-gradient(180deg,transparent 0%,#000 30%,#000 76%,transparent 100%) }
  .hero::after { background:linear-gradient(180deg,rgba(var(--bg-rgb),.82) 0%,rgba(var(--bg-rgb),.82) 30%,rgba(var(--bg-rgb),.48) 50%,rgba(var(--bg-rgb),.1) 73%,rgba(var(--bg-rgb),.36) 100%) }
  [data-theme=light] .hero-field { opacity:.58 }
  .journal { padding:50px 0 65px }
  .section-heading { display:block; margin-bottom:28px }
  .section-heading .eyebrow { font-size:10px; margin-bottom:13px }
  h2 { font-size:35px }
  .section-intro { max-width:100%; font-size:14px; margin-top:20px }
  .journal-tools { gap:12px; padding-bottom:14px; margin-bottom:26px }
  .search-box { gap:9px }
  .search-box input { font-size:12px }
  .search-box .glyph { width:18px; height:18px }
  .topic-picker select { font-size:12px; max-width:138px; padding-left:0; padding-right:20px }
  #entries,.related-grid { grid-template-columns:1fr; gap:32px }
  .entry { padding-bottom:25px }
  .entry-visual { margin-bottom:22px; border-radius:8px }
  .entry-cover { aspect-ratio:1.7 }
  .entry-category { font-size:11px; margin-bottom:13px }
  .entry h3 { font-size:30px; line-height:1.15; margin-bottom:15px }
  .entry p { font-size:14px; margin-bottom:20px }
  .entry-meta { font-size:11px }
  .entry-lead { display:flex; border-radius:10px; padding-bottom:0 }
  .entry-lead .entry-visual { height:auto }
  .entry-lead .entry-cover { min-height:0; height:auto; aspect-ratio:1.5 }
  .entry-lead .entry-copy { padding:25px 23px; width:100% }
  .entry-lead h3 { font-size:34px; line-height:1.1; margin-bottom:18px }
  .entry-lead p { font-size:14px; margin-bottom:22px }
  .entry-lead .entry-bottom { padding-top:0 }
  .lab,.about { display:block; padding:46px 0 58px }
  .lab .section-heading { margin-bottom:32px; gap:14px }
  .lab .section-intro { margin:0 }
  .model-list>a { padding:24px 0; gap:24px }
  .model-list h3 { font-size:23px }
  .model-list p { font-size:13px }
  .about h2 { font-size:30px; margin-bottom:25px }
  .about-copy p { font-size:24px; line-height:1.5 }
  .social-links { gap:23px; font-size:13px }
  .footer { flex-wrap:wrap; padding:27px 0; gap:20px }
  .footer-name { font-size:13px; gap:10px }
  .footer>span { display:none }
  .back-top { font-size:11px; gap:7px }
  .reader { padding:25px 0 65px }
  .reader-nav { margin-bottom:32px }
  .reader-edition { display:none }
  .reader-return { font-size:12px }
  .reader-head h1 { font-size:43px; line-height:1.07; letter-spacing:-.05em; margin-bottom:23px }
  .reader-head .entry-category { margin-bottom:19px }
  .reader-subtitle { font-size:16px; line-height:1.75; margin-bottom:25px }
  .reader-opening { gap:30px; padding-bottom:34px; margin-bottom:27px }
  .reader-cover>img { aspect-ratio:1.4; border-radius:8px }
  .reader-cover>figcaption { font-size:11px; line-height:1.7 }
  .reader-sidebar { margin-bottom:30px }
  .reader-body { font-size:17px; line-height:1.85 }
  .reader-body .article-lead { font-size:22px; line-height:1.55; margin-bottom:30px }
  .reader-body h2 { font-size:29px; line-height:1.2; margin:39px 0 20px }
  .reader-body h3 { font-size:22px }
  .reader-body .article-takeaway { padding:22px; margin:29px 0 36px }
  .reader-body .article-takeaway p { font-size:22px }
  .figure-label { font-size:10px }
  .article-specs>div { padding:0 12px }
  .article-specs dt { font-size:10px; line-height:1.6; margin-bottom:10px }
  .article-specs dd { font-size:27px }
  .technical-figure { padding:23px 20px; border-radius:8px }
  .figure-heading { margin-bottom:25px }
  .figure-heading>span:last-child { font-size:10px }
  .figure-equation { font-size:24px }
  .lora-diagram { flex-direction:column; gap:17px; padding-bottom:24px }
  .matrix-base { height:135px }
  .matrix-b { height:135px }
  .process-flow,.process-flow-four { grid-template-columns:1fr; gap:23px }
  .process-flow li { padding-left:17px }
  .process-flow li>span { margin-bottom:4px }
  .process-flow strong { font-size:19px; margin-bottom:3px }
  .process-flow small { font-size:12px }
  .response-pair { grid-template-columns:1fr; gap:16px }
  .response { padding:20px }
  .preference-prompt { padding:18px }
  .reader-body .preference-prompt p { font-size:22px }
  .code-bar { padding:8px 15px; font-size:10px; gap:10px }
  .code-bar>div { gap:8px }
  .code-language { display:none }
  .copy-code { min-width:78px; font-size:11px; min-height:44px }
  .code-block>pre { padding:22px 18px; font-size:12px; line-height:1.9 }
  .code-output { padding:17px 18px }
  .article-table { font-size:12px }
  .article-table caption { font-size:11px; padding:14px }
  .article-table th { font-size:11px }
  .article-table td,.article-table th { padding:14px 12px }
  .reader-body .article-pull p { font-size:28px }
  .reader-body .article-source-link { padding:22px }
  .article-source-link strong { font-size:18px }
  .reader-body .reader-references h2 { font-size:25px }
  .reference-list a { font-size:13px }
  .reader-actions { flex-wrap:wrap; gap:18px }
  .reader-actions .text-link { font-size:13px }
  .related { margin-top:60px; padding-top:38px }
  .related h2 { font-size:34px }
  .related .entry h3 { font-size:29px }
}
@media(max-width:370px) {
  .hero h1 { font-size:38px }
  .hero-kicker { font-size:7.5px }
  .hero h1>.hero-overline { font-size:20px }
  .hero-inner { min-height:680px; padding-top:53px; padding-bottom:200px }
  .hero-description { font-size:14px }
  .reader-head h1 { font-size:38px }
  .entry-lead .entry-copy { padding:24px 20px }
  .entry-lead h3 { font-size:31px }
  .topic-picker select { max-width:116px; font-size:11px }
  .search-box input { font-size:11px }
  .entry-category { font-size:10px }
  .adapter-group { gap:10px }
  .matrix-a { width:120px }
  .article-specs dd { font-size:24px }
}
@media(prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto }
  *,*::before,*::after { transition:none!important }
}