.documentation { background:var(--tone-101010); color:var(--tone-f5f5f2); scroll-margin-top:90px; }
.documentation .about-intro { align-items:start; margin-bottom:56px; }
.about-eyebrow { margin:0 0 22px; font:14px 'DM Mono',monospace; letter-spacing:.04em; color:var(--tone-c2c2be); }
.documentation .about-intro h2 { font-size:clamp(32px,3.5vw,56px); line-height:1.12; }
.about-copy { max-width:590px; }
.about-copy p { font-size:16px; line-height:1.8; color:var(--tone-c2c2be); margin:0 0 20px; }
.about-copy .clear-text-link { display:inline-block; font-size:15px; margin-top:4px; }
.about-proof-heading { scroll-margin-top:100px; padding:32px 0 24px; border-top:1px solid var(--tone-414141); }
.about-proof-heading h3 { font-size:clamp(25px,2.5vw,36px); line-height:1.2; letter-spacing:-.03em; margin:14px 0; }
.about-proof-heading>p:last-child { max-width:760px; font-size:14px; line-height:1.7; color:var(--tone-c2c2be); margin:0; }
@media(max-width:760px) { .documentation .about-intro {margin-bottom:32px;} .about-eyebrow {font-size:12px;margin-bottom:16px;} .about-copy {max-width:none;} }
.gallery-close-label { display:none; }
.documentation-all[open] .gallery-open-label { display:none; }
.documentation-all[open] .gallery-close-label { display:inline; }
.gallery-collapse { width:100%; margin-top:20px; padding:16px; border:1px solid var(--tone-555555); background:var(--tone-222222); color:var(--tone-ffffff); font:inherit; cursor:pointer; border-radius:6px; }
.home-library .home-library-head { margin:30px 0; gap:32px; align-items:end; }
.home-library .home-library-head h2 { font-size:clamp(30px,3.4vw,52px); line-height:1.16; letter-spacing:-.04em; }
.home-library .home-library-head>p { color:var(--tone-c7c7c3); font-size:16px; line-height:1.7; }
.home-library .home-library-links { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; border:0; }
.home-library .home-library-links>a { display:flex; flex-direction:column; min-height:260px; padding:26px; background:var(--tone-181818); border:1px solid var(--tone-414141); border-radius:10px; color:var(--tone-eeeeee); transition:background .2s,color .2s,transform .2s; }
.home-library .home-library-links>a>span { font-size:14px; color:inherit; }
.home-library .home-library-links h3 { font-size:30px; line-height:1.15; letter-spacing:-.025em; margin:24px 0 16px; }
.home-library .home-library-links h3 br { display:block; }
.home-library .home-library-links p { font-size:16px; line-height:1.65; max-width:none; color:inherit; margin:0 0 24px; }
.home-library .home-library-links b { font-size:14px; margin-top:auto; padding-top:16px; border-top:1px solid var(--tone-555555); color:inherit; }
.home-library .home-library-links>a:hover,.home-library .home-library-links>a:focus-visible { background:var(--tone-f3f3ee); color:var(--tone-111111); transform:translateY(-3px); outline:2px solid var(--tone-ffffff); outline-offset:2px; }
@media(max-width:680px) { .home-library .home-library-head {grid-template-columns:1fr;gap:18px;}.home-library .home-library-links {grid-template-columns:1fr;}.home-library .home-library-links>a{padding:22px;min-height:240px;} }
@media(prefers-reduced-motion:reduce) { .home-library .home-library-links>a {transition:none;} }
.documentation-more { margin-top:20px; }
.documentation-more summary { cursor:pointer; display:flex; justify-content:space-between; padding:18px 20px; border:1px solid var(--tone-555555); border-radius:6px; font-size:16px; list-style:none; }
.documentation-more summary::-webkit-details-marker { display:none; }
.documentation-more summary:hover,.documentation-more summary:focus-visible { background:var(--tone-242424); outline:2px solid var(--tone-aaaaaa); }
.documentation-extra { margin-top:20px; }
.proof-navigation { display:flex; justify-content:space-between; align-items:center; gap:10px; padding-top:10px; font-size:14px; }
.proof-dialog img { height:calc(100% - 115px)!important; }
.documentation-head { display:grid; grid-template-columns:1.2fr 1fr; gap:48px; align-items:end; margin:42px 0 36px; }
.documentation-head h2 { font-size:clamp(32px,4vw,60px); line-height:1.12; letter-spacing:-.045em; margin:0; }
.documentation-head h2 em { color:var(--tone-a9a9a5); font-style:normal; }
.documentation-head>p { font-size:16px; line-height:1.75; color:var(--tone-c2c2be); max-width:550px; margin:0; }
.documentation-sources { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.documentation-sources>a { padding:28px; background:var(--tone-191919); border:1px solid var(--tone-393939); border-radius:8px; display:flex; flex-direction:column; color:inherit; text-decoration:none; transition:background .2s,border-color .2s,transform .2s; }
.documentation-sources>a:hover { background:var(--tone-242424); border-color:var(--tone-aaaaaa); transform:translateY(-3px); }
.documentation-label { font:12px 'DM Mono',monospace; color:var(--tone-aaaaaa); letter-spacing:.06em; }
.documentation-sources h3 { margin:22px 0 16px; font-size:clamp(25px,2.5vw,36px); letter-spacing:-.035em; line-height:1.15; }
.documentation-sources p { font-size:16px; line-height:1.65; color:var(--tone-bbbbbb); max-width:490px; margin:0 0 28px; }
.documentation-sources strong { display:flex; justify-content:space-between; margin-top:auto; font-size:15px; padding-top:18px; border-top:1px solid var(--tone-444444); }
.documentation-gallery-head { display:flex; justify-content:space-between; align-items:baseline; gap:16px; margin:36px 0 16px; }
.documentation-gallery-head h3 { margin:0; font-size:20px; letter-spacing:-.025em; }
.documentation-gallery-head p,.documentation-note { font-size:13px; line-height:1.6; color:var(--tone-aaaaaa); }
.documentation-gallery { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.documentation-image { display:block; color:inherit; text-decoration:none; min-width:0; }
.documentation-image>div { height:240px; position:relative; overflow:hidden; background:var(--tone-080808); border:1px solid var(--tone-393939); border-radius:8px; }
.documentation-image img { display:block; width:100%; height:100%; object-fit:contain; transition:transform .2s; }
.documentation-image:hover img { transform:scale(1.03); }
.documentation-image>div>span { position:absolute; bottom:12px; right:12px; display:grid; place-items:center; width:36px; height:36px; border-radius:50%; background:var(--tone-ffffff); color:var(--tone-000000); font-size:24px; }
.documentation-image p { display:flex; flex-direction:column; gap:4px; margin:12px 0; font-size:15px; }
.documentation-image p>span { color:var(--tone-aaaaaa); font-size:13px; }
.documentation-note { max-width:850px; margin-top:20px; }
.documentation a:focus-visible { outline:2px solid var(--tone-ffffff); outline-offset:5px; }
.proof-dialog { width:min(800px,95vw); height:92dvh; max-height:92dvh; padding:16px; border:1px solid var(--tone-555555); border-radius:10px; background:var(--tone-111111); color:var(--tone-ffffff); }
.proof-dialog::backdrop { background:var(--tone-000000e0); }
.proof-dialog header { display:flex; align-items:center; justify-content:space-between; gap:16px; font-size:14px; padding-bottom:12px; }
.proof-dialog button { padding:10px 16px; cursor:pointer; background:var(--tone-ffffff); color:var(--tone-111111); border:0; border-radius:4px; font-size:14px; }
.proof-dialog img { width:100%; height:calc(100% - 60px); object-fit:contain; display:block; }
@media(max-width:760px) { .documentation-head { grid-template-columns:1fr; gap:20px; margin-top:28px; }.documentation-sources{grid-template-columns:1fr;}.documentation-sources>a{padding:24px;}.documentation-gallery-head{display:block;}.documentation-gallery-head p{margin:8px 0;}.documentation-image>div{height:190px;}.documentation-image p{font-size:14px;} }
@media(prefers-reduced-motion:reduce) { .documentation *{transition:none!important;} }