:root{--maroon:#800000;--maroon-2:#A13A47;--maroon-dark:#2A0B12;--wine:#5D1630;--cream:#F7F0E7;--paper:#FFFDFC;--ink:#23191B;--muted:#6E5E61;--line:#DCCECE;--rose:#E8C8CD;--gold:#B68D40;--slate:#4D5158;--max:1280px;--shadow:0 24px 70px rgba(55,11,20,.12)}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:120px}body{margin:0;background:var(--paper);color:var(--ink);font-family:Arial,Helvetica,sans-serif;line-height:1.62;-webkit-font-smoothing:antialiased}img{display:block;max-width:100%}a{color:inherit;text-decoration:none}button,input{font:inherit}button{color:inherit}h1,h2,h3,p{margin-top:0}h1,h2,h3{letter-spacing:-.04em;line-height:.98}::selection{background:#800000;color:#fff}.skip{position:fixed;left:14px;top:10px;z-index:9999;background:#fff;padding:10px 14px;border:1px solid var(--line);transform:translateY(-150%)}.skip:focus{transform:none}.top-note{height:34px;background:var(--maroon-dark);color:#F8E9E5;display:flex;align-items:center;justify-content:space-between;padding:0 max(20px,calc((100vw - var(--max))/2));font-size:.66rem;letter-spacing:.15em}.top-note button{border:0;background:transparent;color:#F8E9E5;text-transform:uppercase;font-size:.62rem;letter-spacing:.12em;cursor:pointer}.site-header{position:sticky;top:0;z-index:90;background:rgba(255,253,252,.94);backdrop-filter:blur(18px);border-bottom:1px solid var(--line)}.nav-wrap{width:min(var(--max),calc(100% - 40px));min-height:82px;margin:auto;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:28px}.brand{display:inline-flex;align-items:center;gap:11px}.brand img{width:46px;height:46px}.brand span{display:grid;line-height:.86}.brand b{font-size:1.1rem;letter-spacing:-.03em}.brand small{text-transform:uppercase;letter-spacing:.18em;font-size:.58rem;color:var(--muted);margin-top:8px}.primary-nav{justify-self:center}.primary-nav ul{list-style:none;display:flex;align-items:center;gap:3px;margin:0;padding:0}.primary-nav a{display:block;padding:10px 12px;font-size:.79rem;font-weight:700;border-bottom:2px solid transparent}.primary-nav a:hover,.primary-nav a[aria-current=page]{color:var(--maroon);border-color:var(--maroon)}.nav-actions{display:flex;align-items:center;gap:9px}.core-chip{display:flex;align-items:center;gap:8px;border:1px solid var(--line);background:#fff;padding:7px 10px;cursor:pointer}.core-chip i{width:26px;height:26px;background:var(--maroon);display:block;border-radius:50%}.core-chip span{font:700 .72rem/1 monospace}.nav-toggle{display:none;width:42px;height:42px;border:1px solid var(--line);background:#fff;padding:9px}.nav-toggle span{height:2px;background:var(--ink);display:block;margin:4px 0}.wrap,.footer-top,.footer-bottom{width:min(var(--max),calc(100% - 40px));margin-inline:auto}.eyebrow{display:inline-flex;align-items:center;gap:10px;color:var(--maroon);font-size:.68rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase}.eyebrow:before{content:"";width:30px;height:1px;background:currentColor}.section{padding:96px 0}.section-title{display:grid;grid-template-columns:1fr minmax(280px,.72fr);gap:64px;align-items:end;margin-bottom:40px}.section-title h2{font-size:clamp(2.6rem,5.7vw,5.8rem);margin:14px 0 0;max-width:820px}.section-title>p{color:var(--muted);max-width:560px;margin-bottom:5px}.crumbs ol{list-style:none;padding:0;margin:0 0 34px;display:flex;gap:8px;flex-wrap:wrap;font-size:.7rem;color:var(--muted)}.crumbs li:not(:last-child):after{content:"›";margin-left:8px}.crumbs a:hover{color:var(--maroon)}
/* Home: asymmetric magazine cover, intentionally different from the source project. */
.home-hero{background:var(--cream);border-bottom:1px solid var(--line);overflow:hidden}.home-hero__grid{display:grid;grid-template-columns:1.15fr .85fr;min-height:710px}.home-hero__copy{padding:90px 76px 82px 0;display:flex;flex-direction:column;justify-content:center;border-right:1px solid var(--line)}.home-hero h1{font-size:clamp(4.8rem,10vw,9.5rem);margin:18px 0 26px;line-height:.82}.home-hero h1 span{display:block;color:var(--maroon)}.home-hero__lede{max-width:720px;font-size:1.08rem;color:#594B4E}.hero-cta{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-top:30px}.hero-cta button,.hero-cta a{min-height:52px;padding:0 18px;display:inline-flex;align-items:center;gap:20px;font-weight:800;font-size:.78rem}.hero-cta button{border:0;background:var(--maroon);color:#fff;cursor:pointer}.hero-cta button b{font:800 .82rem monospace;border-left:1px solid rgba(255,255,255,.35);padding-left:18px}.hero-cta a{border:1px solid #B7A4A7;background:#fff}.hero-mini{display:flex;gap:9px;flex-wrap:wrap;margin-top:28px}.hero-mini span{border:1px solid #CDBABD;background:rgba(255,255,255,.55);padding:7px 9px;font-size:.67rem}.home-hero__art{position:relative;display:grid;grid-template-rows:1fr auto;padding:56px 0 56px 56px}.color-orbit{position:relative;min-height:480px}.color-orbit__disk{position:absolute;inset:35px 10px 35px 10px;border-radius:50%;background:#800000;box-shadow:0 35px 80px rgba(75,0,0,.24);display:flex;align-items:center;justify-content:center;color:#fff;cursor:pointer;border:0}.color-orbit__disk b{font:800 clamp(2.5rem,5vw,4.7rem)/1 monospace}.color-orbit__disk span{position:absolute;top:19%;font-size:.64rem;letter-spacing:.2em;text-transform:uppercase}.orbit-note{position:absolute;background:#fff;border:1px solid var(--line);padding:12px 14px;box-shadow:0 10px 30px rgba(55,11,20,.08);font-size:.68rem;font-weight:800}.orbit-note--a{top:10px;left:0}.orbit-note--b{right:0;bottom:26px}.hero-index{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.hero-index div{padding:16px 12px;border-right:1px solid var(--line)}.hero-index div:last-child{border-right:0}.hero-index span{display:block;font-size:.56rem;text-transform:uppercase;letter-spacing:.13em;color:var(--muted)}.hero-index b{display:block;margin-top:6px;font-size:.82rem}.format-bar{background:#fff;border-bottom:1px solid var(--line)}.format-bar__grid{display:grid;grid-template-columns:repeat(4,1fr)}.format-bar button{border:0;border-right:1px solid var(--line);background:#fff;padding:22px;text-align:left;display:grid;gap:4px;cursor:pointer}.format-bar button:first-child{border-left:1px solid var(--line)}.format-bar span{font-size:.57rem;text-transform:uppercase;letter-spacing:.16em;color:var(--muted)}.format-bar b{font:800 .86rem monospace}.format-bar small{font-size:.62rem;color:var(--maroon)}.facts{background:#2A0B12;color:#FFF7F2}.facts .eyebrow{color:#D58A97}.facts .section-title>p{color:#C9AFB4}.stat-row{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid #5E333B}.stat-block{padding:28px;border-right:1px solid #5E333B;min-height:210px;display:flex;flex-direction:column}.stat-block:last-child{border-right:0}.stat-block b{font-size:2.3rem;color:#F3C6CD}.stat-block span{text-transform:uppercase;letter-spacing:.14em;font-size:.62rem;margin:16px 0 8px}.stat-block p{margin:auto 0 0;color:#C6ABB0;font-size:.78rem}.spectrum-rail{display:grid;grid-template-columns:repeat(9,1fr);min-height:180px;border:1px solid var(--line)}.spectrum-rail button{border:0;cursor:pointer;position:relative;background:var(--tone);color:var(--tone-ink)}.spectrum-rail button span{position:absolute;left:12px;bottom:10px;font:700 .61rem monospace;writing-mode:vertical-rl;transform:rotate(180deg)}.featured-section{background:#F9F3F1}.swatch-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}.swatch-card{border:1px solid var(--line);background:#fff;min-width:0}.swatch-card__color{width:100%;height:172px;border:0;background:var(--swatch);color:var(--swatch-ink);display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;padding:14px;cursor:pointer;text-align:left}.swatch-card__color span{font-size:.64rem;font-weight:800;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.swatch-card__color b{font:800 .72rem monospace}.swatch-card__color small{font-size:.57rem;opacity:.8;text-transform:uppercase;letter-spacing:.12em}.swatch-card__meta{padding:11px 13px;display:flex;justify-content:space-between;gap:10px;align-items:center;font-size:.62rem;color:var(--muted)}.swatch-card__meta a{font-weight:800;color:var(--maroon)}.library-callout{margin-top:30px;display:grid;grid-template-columns:1fr auto;gap:30px;align-items:center;border-top:1px solid var(--line);padding-top:26px}.library-callout strong{font-size:1.2rem}.library-callout a{background:var(--maroon-dark);color:#fff;padding:13px 16px;font-weight:800;font-size:.75rem}.family-board{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.family-tile{min-height:230px;border:1px solid var(--line);padding:22px;position:relative;overflow:hidden;background:#fff}.family-tile:after{content:"";position:absolute;width:180px;height:180px;border-radius:50%;background:var(--family);right:-46px;bottom:-46px}.family-tile span{font:700 .62rem monospace;color:var(--muted)}.family-tile h3{font-size:1.65rem;margin:28px 0 7px;max-width:170px}.family-tile p{max-width:220px;font-size:.74rem;color:var(--muted);position:relative;z-index:2}.tone-section{background:#EEE4DB}.tone-layout{display:grid;grid-template-columns:.72fr 1.28fr;gap:64px;align-items:center}.tone-copy h2{font-size:clamp(3rem,5vw,5.8rem);margin:14px 0 22px}.tone-copy p{color:var(--muted)}.tone-copy a{display:inline-block;margin-top:18px;border-bottom:1px solid var(--maroon);color:var(--maroon);font-weight:800}.tone-stairs{display:grid;grid-template-columns:repeat(6,1fr);align-items:end;height:460px}.tone-stairs button{border:0;background:var(--tone);height:var(--h);color:var(--inkc);display:flex;align-items:flex-end;padding:10px;cursor:pointer}.tone-stairs span{font:800 .58rem monospace;writing-mode:vertical-rl;transform:rotate(180deg)}.palette-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}.palette-card{border:1px solid var(--line);background:#fff;padding:20px}.palette-card__head{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:16px}.palette-card__head span{font-size:.6rem;text-transform:uppercase;letter-spacing:.12em;color:var(--muted)}.palette-card__head h3{font-size:1.25rem;margin:0}.palette-card__colors{display:grid;grid-template-columns:repeat(5,1fr);height:120px}.palette-card__colors button{border:0;background:var(--p);position:relative;cursor:pointer}.palette-card__colors span{position:absolute;bottom:7px;left:50%;transform:translateX(-50%) rotate(-90deg);font:700 .5rem monospace;background:rgba(255,255,255,.78);padding:3px;opacity:0;transition:.15s}.palette-card__colors button:hover span{opacity:1}.use-grid{display:grid;grid-template-columns:1.1fr .9fr .9fr;grid-template-rows:auto auto;gap:14px}.use-card{border:1px solid var(--line);padding:26px;min-height:260px;background:#fff}.use-card:first-child{grid-row:1/3;min-height:534px;background:#800000;color:#fff;display:flex;flex-direction:column;justify-content:flex-end}.use-card span{font-size:.62rem;text-transform:uppercase;letter-spacing:.14em;opacity:.72}.use-card h3{font-size:2rem;margin:16px 0 12px}.use-card:first-child h3{font-size:3.7rem}.use-card p{font-size:.8rem;max-width:420px;color:var(--muted)}.use-card:first-child p{color:#E9C8CC}.contrast-section{background:#2B292A;color:#fff}.contrast-layout{display:grid;grid-template-columns:1fr 1fr;gap:58px;align-items:center}.contrast-demo{display:grid;grid-template-columns:1fr 1fr;gap:12px}.contrast-demo article{min-height:330px;padding:24px;display:flex;flex-direction:column;justify-content:flex-end}.contrast-demo article:first-child{background:#F8EDE7;color:#29191B}.contrast-demo article:last-child{background:#800000}.contrast-demo h3{font-size:2rem;margin:10px 0}.contrast-demo p{font-size:.76rem;margin:0}.contrast-copy .eyebrow{color:#E6A5B0}.contrast-copy h2{font-size:clamp(3rem,5vw,5.4rem);margin:14px 0 22px}.contrast-copy p,.contrast-copy li{color:#CBC6C6}.contrast-copy a{display:inline-block;margin-top:16px;color:#F5BBC5;border-bottom:1px solid currentColor;font-weight:800}.code-section{background:#FAF6F2}.code-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.code-panel{border:1px solid var(--line);background:#1E1719;color:#F6EDEE;overflow:hidden}.code-panel>div{display:flex;justify-content:space-between;align-items:center;padding:12px 14px;border-bottom:1px solid #4A383C}.code-panel span{font-size:.64rem;text-transform:uppercase;letter-spacing:.12em;color:#C7AEB2}.code-panel button{border:1px solid #5C4449;background:transparent;color:#fff;padding:6px 8px;font-size:.62rem;cursor:pointer}.code-panel pre{margin:0;padding:18px;overflow:auto;min-height:180px}.code-panel code{font:400 .72rem/1.8 monospace}.tool-list{border-top:1px solid var(--line)}.tool-link{display:grid;grid-template-columns:70px 1fr auto;align-items:center;gap:24px;padding:24px 0;border-bottom:1px solid var(--line)}.tool-link>span{font:700 .7rem monospace;color:var(--maroon)}.tool-link h3{font-size:1.65rem;margin:0 0 7px}.tool-link p{margin:0;color:var(--muted);font-size:.78rem}.tool-link>b{font-size:.72rem}.comparison-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.comparison-card{border:1px solid var(--line);background:#fff;padding:24px}.comparison-chip{height:130px;background:var(--c);margin-bottom:20px}.comparison-card h3{font-size:1.6rem;margin-bottom:9px}.comparison-card p{font-size:.78rem;color:var(--muted)}.guide-preview{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.guide-card{border:1px solid var(--line);padding:22px;background:#fff;min-height:280px;display:flex;flex-direction:column}.guide-card span{font:700 .62rem monospace;color:var(--maroon)}.guide-card h3{font-size:1.55rem;margin:30px 0 13px}.guide-card p{font-size:.76rem;color:var(--muted)}.guide-card b{margin-top:auto;font-size:.68rem}.faq-grid{display:grid;grid-template-columns:.66fr 1.34fr;gap:70px}.faq-grid h2{font-size:4.4rem;margin:12px 0 18px}.faq-grid>div:first-child p{color:var(--muted)}.faq-list details{border-top:1px solid var(--line);padding:18px 0}.faq-list details:last-child{border-bottom:1px solid var(--line)}.faq-list summary{font-weight:800;cursor:pointer}.faq-list p{margin:12px 0 0;color:var(--muted);font-size:.82rem}.site-footer{background:#1F0A0F;color:#F9F1EC;padding-top:64px}.footer-top{display:grid;grid-template-columns:1.5fr repeat(4,1fr);gap:34px;padding-bottom:48px}.footer-brand p{max-width:330px;color:#BCA7AA;font-size:.78rem}.brand--footer small{color:#B79BA0}.footer-copy{border:1px solid #5A333B;background:#2B1017;color:#fff;padding:14px;display:grid;text-align:left;margin-top:22px;cursor:pointer}.footer-copy span,.footer-copy small{font-size:.58rem;text-transform:uppercase;letter-spacing:.12em;color:#C5A8AD}.footer-copy b{font:800 1.05rem monospace;margin:7px 0}.footer-top h3{font-size:.62rem;text-transform:uppercase;letter-spacing:.14em;color:#A9848B;margin:0 0 16px}.footer-top>div:not(.footer-brand) a{display:block;margin:9px 0;font-size:.74rem;color:#D8C8CA}.footer-top a:hover{color:#fff}.footer-bottom{border-top:1px solid #4A2931;padding:20px 0 28px;display:flex;justify-content:space-between;gap:20px;color:#9D8086;font-size:.68rem}.footer-bottom p{margin:0}.footer-bottom a{color:#fff;text-decoration:underline;text-underline-offset:3px}.copy-toast{position:fixed;right:20px;bottom:20px;z-index:500;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow);display:flex;align-items:center;gap:10px;padding:12px 14px;min-width:220px;opacity:0;transform:translateY(15px);pointer-events:none;transition:.18s}.copy-toast.show{opacity:1;transform:none}.copy-toast__icon{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:#800000;color:#fff}.copy-toast>span:last-child{display:grid;line-height:1.1}.copy-toast b{font-size:.78rem}.copy-toast small{font-size:.62rem;color:var(--muted);margin-top:4px}
/* Library */.page-hero{padding:74px 0;background:#F6ECE8;border-bottom:1px solid var(--line)}.page-hero__grid{display:grid;grid-template-columns:1fr auto;gap:60px;align-items:end}.page-hero h1{font-size:clamp(4rem,8vw,8rem);margin:16px 0 20px}.page-hero p{max-width:690px;color:var(--muted)}.count-badge{width:180px;height:180px;border-radius:50%;background:var(--maroon);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center}.count-badge b{font-size:2.4rem}.count-badge span{font-size:.62rem;text-transform:uppercase;letter-spacing:.14em}.library-controls{position:sticky;top:82px;z-index:70;background:rgba(255,253,252,.96);border-bottom:1px solid var(--line);padding:14px 0}.library-controls__grid{display:grid;grid-template-columns:minmax(240px,1fr) 2fr auto;gap:14px;align-items:center}.library-search{border:1px solid var(--line);background:#fff;padding:12px 14px;width:100%}.filter-row{display:flex;gap:7px;overflow:auto;padding-bottom:2px}.filter-row button{white-space:nowrap;border:1px solid var(--line);background:#fff;padding:9px 11px;font-size:.68rem;cursor:pointer}.filter-row button.is-active{background:var(--maroon-dark);color:#fff;border-color:var(--maroon-dark)}.visible-count{font:700 .68rem monospace;color:var(--muted)}.library-body{padding:46px 0 90px}.swatch-grid--library{grid-template-columns:repeat(6,minmax(0,1fr));gap:9px}.swatch-grid--library .swatch-card__color{height:140px}.empty-state{text-align:center;padding:50px;border:1px dashed var(--line);color:var(--muted)}
/* Shade detail */.shade-hero{padding:70px 0}.shade-hero__grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:70px;align-items:center}.shade-chip{height:440px;background:var(--shade);color:var(--shade-ink);padding:28px;display:flex;flex-direction:column;justify-content:space-between;cursor:pointer;border:0;width:100%}.shade-chip span{font-size:.65rem;text-transform:uppercase;letter-spacing:.14em}.shade-chip b{font:800 clamp(2.5rem,5vw,4.8rem)/1 monospace}.shade-chip small{font-size:.7rem}.shade-info h1{font-size:clamp(3.8rem,6vw,6.5rem);margin:12px 0 18px}.shade-info p{color:var(--muted);max-width:600px}.format-cards{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-top:25px}.format-cards button{border:1px solid var(--line);background:#fff;padding:13px;text-align:left;display:grid;gap:5px;cursor:pointer}.format-cards span{font-size:.58rem;text-transform:uppercase;letter-spacing:.12em;color:var(--muted)}.format-cards b{font:800 .72rem monospace}.related-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}
/* Tools */.tool-hero{padding:70px 0;background:#F4ECE7}.tool-hero h1{font-size:clamp(4rem,7vw,7rem);margin:15px 0 20px}.tool-hero p{max-width:720px;color:var(--muted)}.tool-workbench{display:grid;grid-template-columns:.75fr 1.25fr;gap:36px;border:1px solid var(--line);background:#fff;padding:24px}.control-panel{display:grid;gap:18px}.control-panel label{font-size:.67rem;font-weight:800;text-transform:uppercase;letter-spacing:.1em;color:var(--muted)}.control-panel input[type=text]{width:100%;border:1px solid var(--line);padding:13px;margin-top:7px}.control-panel input[type=color]{width:100%;height:52px;border:1px solid var(--line);background:#fff;margin-top:7px}.control-panel input[type=range]{width:100%}.tool-preview{min-height:360px;border:1px solid var(--line);background:#800000;padding:24px}.tool-output-list{display:grid;gap:10px;margin-top:18px}.tool-output-list button{border:1px solid var(--line);background:#fff;padding:13px;display:flex;align-items:center;justify-content:space-between;gap:10px;cursor:pointer}.tool-output-list span{font-size:.6rem;text-transform:uppercase;letter-spacing:.12em;color:var(--muted)}.tool-output-list b{font:800 .75rem monospace}.contrast-preview{min-height:360px;padding:30px;display:flex;flex-direction:column;justify-content:flex-end}.contrast-preview b{font-size:2.8rem}.contrast-preview p{max-width:480px}.gradient-preview{min-height:400px;display:flex;align-items:flex-end;padding:24px;color:#fff}.gradient-code{background:#211719;color:#fff;padding:17px;font:700 .72rem/1.6 monospace;margin-top:12px}.generated-scale{display:grid;grid-template-columns:repeat(4,1fr)}.generated-scale button{height:150px;border:0;display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-start;padding:12px;cursor:pointer}.generated-scale span{font-size:.56rem;text-transform:uppercase;letter-spacing:.12em}.generated-scale b{font:800 .68rem monospace;margin-top:4px}
/* Guides */.guide-index-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:15px}.guide-index-card{border:1px solid var(--line);background:#fff;padding:26px;min-height:300px;display:grid;grid-template-columns:70px 1fr;gap:20px}.guide-index-card__no{font:800 1rem monospace;color:var(--maroon)}.guide-index-card h2{font-size:2rem;margin:0 0 13px}.guide-index-card p{font-size:.8rem;color:var(--muted)}.guide-index-card b{font-size:.68rem}.article-hero{padding:72px 0;background:#F7EFEB}.article-hero__grid{display:grid;grid-template-columns:1fr 260px;gap:70px;align-items:end}.article-hero h1{font-size:clamp(3.8rem,7vw,7rem);margin:15px 0 24px}.article-hero p{font-size:1rem;color:var(--muted);max-width:800px}.article-meta{border-left:1px solid var(--line);padding-left:22px}.article-meta span,.article-meta b{display:block}.article-meta span{font-size:.58rem;text-transform:uppercase;letter-spacing:.13em;color:var(--muted);margin-top:12px}.article-meta b{margin-top:4px}.article-layout{display:grid;grid-template-columns:minmax(0,780px) 300px;gap:72px;padding:66px 0 96px}.article-body{font-size:1rem}.article-body h2{font-size:2.5rem;margin:54px 0 18px}.article-body h3{font-size:1.55rem;margin:35px 0 13px}.article-body p{color:#493C3F}.article-body ul,.article-body ol{color:#493C3F}.article-body pre{background:#211719;color:#F7ECEE;padding:18px;overflow:auto}.article-body code{font-family:monospace}.article-aside{position:relative}.article-aside>div{position:sticky;top:120px;border-left:1px solid var(--line);padding-left:20px}.article-aside h3{font-size:.7rem;text-transform:uppercase;letter-spacing:.13em}.article-aside a{display:block;margin:10px 0;font-size:.74rem;color:var(--muted)}.article-aside a:hover{color:var(--maroon)}
/* Legal */.legal-hero{padding:68px 0;background:#F5ECE7}.legal-hero h1{font-size:clamp(4rem,7vw,6.6rem);margin:14px 0 16px}.legal-hero p{max-width:760px;color:var(--muted)}.legal-layout{display:grid;grid-template-columns:260px minmax(0,760px);gap:70px;padding:64px 0 96px}.legal-layout aside{border-right:1px solid var(--line);padding-right:24px}.legal-layout aside ol{margin:0;padding-left:18px;position:sticky;top:122px}.legal-layout aside a{font-size:.72rem;color:var(--muted)}.legal-content h2{font-size:2.2rem;margin:46px 0 15px}.legal-content h2:first-child{margin-top:0}.legal-content h3{font-size:1.35rem;margin:28px 0 10px}.legal-content p,.legal-content li{color:#4E4144}.legal-content a{color:var(--maroon);text-decoration:underline;text-underline-offset:3px}.contact-card{border:1px solid var(--line);padding:20px;background:#fff;margin:22px 0}.not-found{text-align:center;padding:110px 20px}.not-found b{font-size:8rem;color:#E7D3D4;line-height:1}.not-found h1{font-size:3.5rem;margin:15px 0}.not-found p{color:var(--muted)}
@media(max-width:1120px){.swatch-grid--library{grid-template-columns:repeat(5,1fr)}.swatch-grid{grid-template-columns:repeat(4,1fr)}.guide-preview{grid-template-columns:repeat(2,1fr)}.footer-top{grid-template-columns:1.4fr repeat(2,1fr)}.footer-top>div:nth-child(n+4){margin-top:8px}.article-layout{grid-template-columns:minmax(0,1fr) 260px;gap:46px}}
@media(max-width:920px){.primary-nav{display:none;position:absolute;left:20px;right:20px;top:86px;background:#fff;border:1px solid var(--line);padding:10px;box-shadow:var(--shadow)}.primary-nav.open{display:block}.primary-nav ul{display:grid}.nav-toggle{display:block}.core-chip{display:none}.home-hero__grid,.shade-hero__grid,.tone-layout,.contrast-layout,.tool-workbench{grid-template-columns:1fr}.home-hero__copy{border-right:0;border-bottom:1px solid var(--line);padding-right:0}.home-hero__art{padding-left:0}.section-title{grid-template-columns:1fr;gap:20px}.stat-row{grid-template-columns:repeat(2,1fr)}.stat-block:nth-child(2){border-right:0}.stat-block:nth-child(-n+2){border-bottom:1px solid #5E333B}.family-board{grid-template-columns:repeat(2,1fr)}.use-grid{grid-template-columns:1fr 1fr}.use-card:first-child{grid-column:1/-1;grid-row:auto;min-height:380px}.code-grid{grid-template-columns:1fr}.page-hero__grid{grid-template-columns:1fr}.count-badge{width:150px;height:150px}.library-controls{top:82px}.library-controls__grid{grid-template-columns:1fr}.visible-count{display:none}.swatch-grid--library{grid-template-columns:repeat(4,1fr)}.article-hero__grid,.article-layout,.legal-layout{grid-template-columns:1fr}.article-aside>div,.legal-layout aside ol{position:static}.legal-layout aside{border-right:0;border-bottom:1px solid var(--line);padding:0 0 20px}.article-aside{grid-row:1}.footer-top{grid-template-columns:1fr 1fr}.footer-brand{grid-column:1/-1}}
@media(max-width:680px){.top-note{display:none}.nav-wrap,.wrap,.footer-top,.footer-bottom{width:min(var(--max),calc(100% - 28px))}.home-hero__copy{padding:66px 0}.home-hero h1{font-size:clamp(4.4rem,20vw,7rem)}.home-hero__art{padding:38px 0}.color-orbit{min-height:390px}.color-orbit__disk{inset:25px 15px}.hero-index{grid-template-columns:1fr}.hero-index div{border-right:0;border-bottom:1px solid var(--line)}.hero-index div:last-child{border-bottom:0}.format-bar__grid{grid-template-columns:1fr 1fr}.section{padding:70px 0}.section-title h2{font-size:3.2rem}.stat-row{grid-template-columns:1fr}.stat-block{border-right:0!important;border-bottom:1px solid #5E333B}.spectrum-rail{grid-template-columns:repeat(3,1fr);min-height:450px}.swatch-grid,.swatch-grid--library,.related-grid{grid-template-columns:repeat(2,1fr)}.family-board,.palette-grid,.comparison-grid,.guide-index-grid{grid-template-columns:1fr}.tone-stairs{grid-template-columns:repeat(3,1fr);height:520px}.use-grid{grid-template-columns:1fr}.use-card:first-child{grid-column:auto}.contrast-demo{grid-template-columns:1fr}.tool-link{grid-template-columns:40px 1fr}.tool-link>b{display:none}.guide-preview{grid-template-columns:1fr}.faq-grid{grid-template-columns:1fr;gap:26px}.faq-grid h2{font-size:3.4rem}.page-hero h1,.shade-info h1,.tool-hero h1,.legal-hero h1,.article-hero h1{font-size:3.7rem}.shade-chip{height:330px}.format-cards{grid-template-columns:1fr}.generated-scale{grid-template-columns:repeat(2,1fr)}.footer-bottom{flex-direction:column}.footer-top{grid-template-columns:1fr 1fr}}
@media(max-width:440px){.brand small{display:none}.format-bar__grid{grid-template-columns:1fr}.format-bar button{border-left:1px solid var(--line)}.swatch-grid,.swatch-grid--library,.related-grid{grid-template-columns:1fr}.tone-stairs{grid-template-columns:repeat(2,1fr)}.footer-top{grid-template-columns:1fr}.copy-toast{left:14px;right:14px;bottom:14px}.palette-card__colors{height:160px}.generated-scale{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
/* Responsive stability pass: header, footer and homepage. */
html,body{max-width:100%;overflow-x:clip}
main{min-width:0}
.nav-wrap>*,.home-hero__grid>*,.section-title>*,.tone-layout>*,.contrast-layout>*,.palette-grid>*,.use-grid>*,.code-grid>*,.faq-grid>*,.footer-top>*{min-width:0}
button,a,input,pre,code{max-width:100%}
pre{white-space:pre-wrap;overflow-wrap:anywhere}
.home-hero__lede,.section-title>p,.use-card p,.guide-card p,.footer-brand p,.footer-bottom p{overflow-wrap:anywhere}

@media(max-width:1080px){
  .nav-wrap{display:flex;position:relative;justify-content:space-between;gap:14px;min-height:74px}
  .primary-nav{display:none;position:absolute;z-index:120;left:0;right:0;top:calc(100% + 1px);justify-self:auto;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow);padding:10px}
  .primary-nav.open{display:block}
  .primary-nav ul{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px}
  .primary-nav a{padding:12px 14px;border:1px solid transparent;border-bottom:1px solid var(--line)}
  .primary-nav a:hover,.primary-nav a[aria-current=page]{border-color:var(--line);border-left:3px solid var(--maroon);background:#faf5f3}
  .nav-actions{margin-left:auto}
  .nav-toggle{display:block;flex:0 0 42px;cursor:pointer}
  .home-hero__grid{grid-template-columns:minmax(0,1fr) minmax(340px,.72fr);min-height:auto}
  .home-hero__copy{padding:72px 48px 72px 0}
  .home-hero h1{font-size:clamp(4.5rem,9.7vw,7.5rem)}
  .home-hero__art{padding:48px 0 48px 38px}
  .color-orbit{min-height:420px}
  .swatch-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
  .footer-top{grid-template-columns:repeat(4,minmax(0,1fr));gap:30px}
  .footer-brand{grid-column:1/-1}
  .footer-top>div:nth-child(n+4){margin-top:0}
}

@media(max-width:900px){
  .home-hero__grid{grid-template-columns:1fr}
  .home-hero__copy{padding:64px 0 54px;border-right:0;border-bottom:1px solid var(--line)}
  .home-hero__art{padding:42px 0 48px}
  .color-orbit{width:min(100%,560px);aspect-ratio:1;min-height:0;margin-inline:auto}
  .color-orbit__disk{inset:8%}
  .hero-index{max-width:720px;margin-inline:auto;width:100%}
  .section-title{grid-template-columns:1fr;gap:18px}
  .section-title>p{max-width:700px}
  .tone-layout,.contrast-layout{grid-template-columns:1fr;gap:42px}
  .palette-grid{grid-template-columns:1fr}
  .code-grid{grid-template-columns:1fr}
  .guide-preview{grid-template-columns:repeat(2,minmax(0,1fr))}
  .faq-grid{grid-template-columns:1fr;gap:34px}
  .footer-top{grid-template-columns:repeat(2,minmax(0,1fr));gap:30px 42px}
  .footer-brand{grid-column:1/-1}
}

@media(max-width:720px){
  .wrap,.nav-wrap,.footer-top,.footer-bottom{width:calc(100% - 32px)}
  .site-header{backdrop-filter:blur(12px)}
  .nav-wrap{min-height:68px;gap:10px}
  .brand{gap:9px;min-width:0}
  .brand img{width:40px;height:40px;flex:0 0 40px}
  .brand b{font-size:1rem}
  .brand small{font-size:.52rem;margin-top:6px;letter-spacing:.14em}
  .core-chip{display:none}
  .primary-nav{left:-1px;right:-1px;padding:8px}
  .primary-nav ul{grid-template-columns:1fr}
  .primary-nav a{font-size:.82rem;padding:12px}
  .home-hero__copy{padding:54px 0 42px}
  .home-hero h1{font-size:clamp(3.45rem,16.5vw,5.8rem);line-height:.86;margin:15px 0 22px;overflow-wrap:normal}
  .home-hero__lede{font-size:.98rem;line-height:1.65}
  .hero-cta{align-items:stretch}
  .hero-cta button,.hero-cta a{min-height:50px}
  .home-hero__art{padding:32px 0 38px}
  .color-orbit{width:min(100%,480px)}
  .color-orbit__disk b{font-size:clamp(2.25rem,11vw,4.1rem)}
  .color-orbit__disk span{top:17%;max-width:72%;text-align:center;line-height:1.5}
  .orbit-note{font-size:.58rem;padding:9px 10px}
  .orbit-note--a{left:0;top:2px}
  .orbit-note--b{right:0;bottom:12px}
  .hero-index{grid-template-columns:1fr}
  .hero-index div{border-right:0;border-bottom:1px solid var(--line)}
  .hero-index div:last-child{border-bottom:0}
  .format-bar__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .format-bar button{padding:18px 16px;border-bottom:1px solid var(--line)}
  .section{padding:64px 0}
  .section-title{margin-bottom:30px}
  .section-title h2,.tone-copy h2,.contrast-copy h2{font-size:clamp(2.45rem,12vw,4rem);line-height:.96}
  .stat-row{grid-template-columns:1fr}
  .stat-block{min-height:0;border-right:0!important;border-bottom:1px solid #5E333B;padding:24px}
  .stat-block:last-child{border-bottom:0}
  .spectrum-rail{grid-template-columns:repeat(3,minmax(0,1fr));min-height:420px}
  .swatch-grid,.swatch-grid--library,.related-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .family-board{grid-template-columns:1fr}
  .family-tile{min-height:210px}
  .tone-stairs{height:430px;grid-template-columns:repeat(3,minmax(0,1fr))}
  .palette-card{padding:16px}
  .palette-card__colors{height:130px}
  .use-grid{grid-template-columns:1fr}
  .use-card,.use-card:first-child{grid-column:auto;grid-row:auto;min-height:240px}
  .use-card:first-child{min-height:330px}
  .use-card:first-child h3{font-size:clamp(2.5rem,11vw,3.4rem)}
  .contrast-demo{grid-template-columns:1fr}
  .contrast-demo article{min-height:250px}
  .comparison-grid{grid-template-columns:1fr}
  .guide-preview{grid-template-columns:1fr}
  .tool-link{grid-template-columns:42px minmax(0,1fr);gap:14px}
  .tool-link>b{display:none}
  .faq-grid h2{font-size:clamp(2.8rem,13vw,4rem)}
  .footer-top{grid-template-columns:repeat(2,minmax(0,1fr));padding-bottom:38px;gap:30px 26px}
  .footer-brand{grid-column:1/-1}
  .footer-copy{width:min(100%,360px)}
  .footer-bottom{flex-direction:column;align-items:flex-start;gap:8px;padding:18px 0 24px}
}

@media(max-width:520px){
  .wrap,.nav-wrap,.footer-top,.footer-bottom{width:calc(100% - 24px)}
  .brand small{display:block}
  .nav-toggle{width:40px;height:40px;flex-basis:40px}
  .home-hero__copy{padding:44px 0 36px}
  .home-hero h1{font-size:clamp(3.15rem,16vw,4.6rem)}
  .hero-cta{display:grid;grid-template-columns:1fr;width:100%}
  .hero-cta button,.hero-cta a{width:100%;justify-content:space-between;padding-inline:16px}
  .hero-mini{display:grid;grid-template-columns:1fr 1fr}
  .hero-mini span:last-child{grid-column:1/-1}
  .home-hero__art{padding:26px 0 34px}
  .color-orbit{width:100%}
  .orbit-note{max-width:48%;line-height:1.35}
  .format-bar__grid{grid-template-columns:1fr}
  .format-bar button,.format-bar button:first-child{border-left:1px solid var(--line);border-right:1px solid var(--line)}
  .section{padding:54px 0}
  .section-title h2,.tone-copy h2,.contrast-copy h2{font-size:clamp(2.25rem,12.2vw,3.2rem)}
  .eyebrow{font-size:.61rem;letter-spacing:.13em}
  .spectrum-rail{grid-template-columns:repeat(3,minmax(0,1fr));min-height:360px}
  .swatch-grid,.swatch-grid--library,.related-grid{grid-template-columns:1fr}
  .swatch-card__color{height:190px}
  .tone-stairs{height:420px;grid-template-columns:repeat(2,minmax(0,1fr))}
  .library-callout{grid-template-columns:1fr;gap:16px}
  .library-callout a{width:100%;text-align:center}
  .palette-card__head{align-items:flex-start;flex-direction:column;gap:7px}
  .palette-card__colors{height:170px}
  .comparison-card,.use-card,.guide-card{padding:20px}
  .code-panel pre{min-height:0;font-size:.67rem}
  .footer-top{grid-template-columns:1fr;gap:28px;padding-bottom:32px}
  .footer-brand{grid-column:auto}
  .footer-top h3{margin-bottom:12px}
  .footer-top>div:not(.footer-brand) a{margin:7px 0}
  .footer-bottom{font-size:.66rem}
  .copy-toast{left:12px;right:12px;bottom:12px;min-width:0}
}

@media(max-width:360px){
  .brand img{width:36px;height:36px;flex-basis:36px}
  .brand b{font-size:.94rem}
  .brand small{font-size:.48rem}
  .home-hero h1{font-size:3rem}
  .hero-mini{grid-template-columns:1fr}
  .hero-mini span:last-child{grid-column:auto}
  .color-orbit__disk b{font-size:2rem}
  .color-orbit__disk span{font-size:.52rem}
  .spectrum-rail{grid-template-columns:repeat(2,minmax(0,1fr))}
}
