/* Technical references extend the existing HootBook architecture overview. */
.arch-reference-index{padding-top:38px;padding-bottom:48px;border-top:2px solid var(--ink)}
.arch-reference-head{display:grid;grid-template-columns:.85fr 1.15fr;gap:80px;align-items:start;margin-bottom:28px}
.arch-reference-index .reference-row{display:grid;grid-template-columns:.85fr 1.15fr;gap:80px;padding:24px 0;border-top:1px solid var(--line)}
.arch-reference-index .reference-row h3{margin-bottom:10px}
.arch-reference-index .reference-row p:last-child{margin-bottom:0}
.arch-reference-index .ref-index-meta{font:400 13px/1.6 var(--ui)!important;color:#514d45}
.ref-breadcrumb{display:flex;flex-wrap:wrap;gap:12px;padding:25px 0 0;font:400 13px/1.6 var(--ui);color:#514d45}
.ref-breadcrumb a{text-underline-offset:4px}
.ref-site .ref-hero{max-width:940px;padding:36px 0 35px}
.hb-site.ref-site h1{font:700 clamp(52px,6vw,88px)/.98 var(--display);letter-spacing:.01em;text-transform:uppercase;margin:16px 0 20px}
.hb-site.ref-site h2{font:700 clamp(34px,3.2vw,46px)/1.02 var(--display);letter-spacing:.01em;text-transform:uppercase;margin:0 0 22px}
.hb-site.ref-site h3{font:700 24px/1.1 var(--display);letter-spacing:.01em;text-transform:uppercase}
.hb-site.ref-site p:not(.eyebrow):not(.ref-lede):not(.ref-meta):not(.ref-section-number):not(.ref-speaker):not(.ref-example-note){font:400 17px/1.6 Georgia,serif;color:#34312b}
.hb-site.ref-site .ref-hero>p:not(.eyebrow):not(.ref-meta){max-width:64ch}
.hb-site.ref-site .ref-hero .ref-lede{font:400 19px/1.6 Georgia,serif;color:#34312b;margin:0 0 15px}
.hb-site.arch-site.ref-site .ref-meta{font:400 13px/1.6 var(--ui);color:#514d45;margin:24px 0 0}
.ref-layout{display:grid;grid-template-columns:225px minmax(0,760px);column-gap:72px;border-top:2px solid var(--ink);padding:38px 0 65px}
.ref-sidebar{align-self:start;position:sticky;top:24px;max-height:calc(100vh - 48px);overflow:auto;padding-right:6px}
.ref-sidebar .eyebrow{margin:0 0 12px}
.ref-library{padding:0 0 23px;border-bottom:1px solid var(--line);margin-bottom:24px}
.ref-library>a,.ref-contents a{display:flex;align-items:center;min-height:44px;font:400 13px/1.6 var(--ui);text-decoration:none;color:#514d45}
.ref-library>a[aria-current="page"]{color:var(--wine);text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:5px}
.ref-contents ol{list-style:none;margin:0;padding:0;counter-reset:contents}
.ref-contents li{counter-increment:contents;display:flex;align-items:baseline;gap:10px}
.ref-contents li::before{content:counter(contents,decimal-leading-zero);font:400 13px/1.6 var(--ui);color:#514d45}
.ref-site a:hover{text-decoration:underline;text-underline-offset:4px}
.ref-article{min-width:0;max-width:68ch}
.ref-article>section{padding:0 0 43px;scroll-margin-top:28px}
.ref-article>section+section{border-top:1px solid var(--line);padding-top:29px}
.hb-site.arch-site.ref-site .ref-section-number,.hb-site.arch-site.ref-site .ref-speaker{font:500 12px/1.6 var(--ui);letter-spacing:.12em;text-transform:uppercase;color:var(--wine);margin:0 0 10px}
.ref-example{margin:28px 0;background:#fbf8f1;border:1px solid #b5ab98;box-shadow:6px 6px 0 #e5ddcd80;padding:25px 28px}
.hb-site.ref-site .ref-example figcaption{padding:0 0 20px;margin:0;border-bottom:1px solid var(--line)}
.ref-example figcaption>span{display:block}
.hb-site.arch-site.ref-site .ref-example-note{font:400 15.5px/1.55 Georgia,serif;color:#514d45;margin:10px 0 0}
.ref-exchange{list-style:none;margin:0;padding:0 0 0 20px;border-left:2px solid var(--wine)}
.ref-exchange li{padding:20px 0;border-bottom:1px solid var(--line);position:relative}
.ref-exchange li::before{content:"";position:absolute;left:-26px;top:28px;width:10px;height:10px;background:var(--wine);border:2px solid #fbf8f1;box-sizing:border-box}
.ref-exchange li:last-child{border-bottom:0;padding-bottom:0}
.ref-exchange li>p:last-child{margin-bottom:0!important}
.ref-controls{margin:22px 0 26px}
.ref-controls>div{display:grid;grid-template-columns:145px 1fr;gap:25px;border-top:1px solid var(--line);padding:18px 0}
.ref-controls>div:last-child{border-bottom:1px solid var(--line)}
.ref-controls dt{font:500 14px/1.6 var(--ui);text-transform:uppercase;letter-spacing:.08em;color:var(--wine)}
.ref-controls dd{font:400 17px/1.6 Georgia,serif;color:#34312b;margin:0}
.hb-site.ref-site .ref-detail{border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin:24px 0 0}
.hb-site.ref-site .ref-detail summary{font:500 14px/1.6 var(--ui);text-transform:uppercase;letter-spacing:.08em;min-height:48px;padding:14px 0;color:var(--wine)}
.ref-detail>div{padding:8px 0 4px}
.ref-end{border-top:2px solid var(--ink);padding-top:24px}
.ref-end>a{display:block;min-height:44px;padding:8px 0;font:400 17px/1.6 Georgia,serif}
/* New article uses the documented reading scale; existing overview stays intact. */
.hb-site.ref-site .hb-nav nav a{font:500 14px/1.6 var(--ui)}
.hb-site.ref-site .btn{font:500 14px/1.4 var(--ui)}
.hb-site.ref-site .hb-footer p,.hb-site.ref-site .hb-footer a:not(.hb-brand){font:400 13px/1.6 var(--ui);text-transform:none;letter-spacing:normal}
.hb-site.ref-site code{font-family:ui-monospace,monospace;font-size:max(12px,.92em);font-weight:600}
.hb-site :focus-visible{outline:3px solid var(--wine);outline-offset:4px}
@media(max-width:1100px){.ref-layout{column-gap:40px;grid-template-columns:200px minmax(0,1fr)}.arch-reference-head,.arch-reference-index .reference-row{gap:40px}}
@media(max-width:900px){.ref-layout{grid-template-columns:1fr;padding-top:25px}.ref-sidebar{position:static;max-height:none;overflow:visible;display:grid;grid-template-columns:1fr 1.5fr;gap:25px;margin-bottom:32px;padding:0}.ref-library{border-bottom:0;margin:0;padding:0}.ref-contents{padding-left:25px;border-left:1px solid var(--line)}.ref-article{max-width:68ch}.ref-site .ref-hero{padding-top:28px}.ref-site .hb-mobile-nav a{font:500 13px/1.6 var(--ui)}}
@media(max-width:640px){.arch-reference-head,.arch-reference-index .reference-row{grid-template-columns:1fr;gap:12px}.arch-reference-index{padding:30px 20px}.ref-sidebar{grid-template-columns:1fr;gap:22px}.ref-contents{border-left:0;border-top:1px solid var(--line);padding:20px 0 0}.ref-contents ol{display:grid;grid-template-columns:1fr 1fr;column-gap:16px}.ref-contents li{gap:7px}.ref-library{display:flex;align-items:center;gap:0 20px;flex-wrap:wrap}.ref-library .eyebrow{flex-basis:100%;margin-bottom:4px}.ref-example{padding:20px 18px;margin:24px 0}.ref-controls>div{grid-template-columns:1fr;gap:8px}.ref-article>section{padding-bottom:30px}.ref-article>section+section{padding-top:24px}.ref-exchange{padding-left:18px}.ref-exchange li::before{left:-24px}.hb-site.ref-site h1{font-size:clamp(48px,10.7vw,68px)}.hb-site.arch-site.ref-site .ref-example-note{font-size:15px}.ref-breadcrumb{padding-top:20px}.ref-layout{padding-bottom:40px}}
@media(prefers-reduced-motion:no-preference){.ref-site{scroll-behavior:smooth}}
@media(max-width:640px){.hb-site.ref-site .hb-nav .btn{font-size:12px;max-width:none;white-space:nowrap;padding-inline:12px}.hb-site.ref-site .hb-nav{gap:14px}}
@media print{.ref-sidebar,.hb-nav,.hb-mobile-nav,.hb-footer,dialog,.ref-end{display:none!important}.ref-layout{display:block}.hb-site{background:white}.ref-site .ref-hero{padding-top:15px}.ref-article{max-width:none}.ref-example{box-shadow:none}a{color:inherit}}

.hb-site.ref-site .eyebrow{font-weight:500}
@media(max-width:360px){.hb-site.ref-site .hb-nav{flex-wrap:wrap;padding-block:14px}.hb-site.ref-site .hb-nav .btn{flex-basis:100%}}

.arch-reference-index p:not(.eyebrow):not(.ref-index-meta){font:400 17px/1.6 Georgia,serif;color:#34312b}
.hb-site .arch-reference-index h2{font:700 clamp(34px,3.2vw,46px)/1.02 var(--display);text-transform:uppercase;letter-spacing:.01em}
.hb-site .arch-reference-index h3{font:700 24px/1.1 var(--display);text-transform:uppercase;letter-spacing:.01em}
.hb-site .arch-reference-index .eyebrow{font-weight:500}
.hb-site .arch-reference-index .plain-link{font:500 14px/1.6 var(--ui);text-transform:uppercase;letter-spacing:.08em}