:root{color-scheme:light;--ink: #182033;--muted: #667085;--line: #e8eaf1;--panel: rgba(255, 255, 255, .88);--brand: #3157d5;--soft: #f6f7fb;--shadow: 0 22px 70px rgba(34, 46, 82, .1)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);background:radial-gradient(circle at 10% 0%,color-mix(in srgb,var(--detail-color, #3157d5) 13%,transparent),transparent 28rem),radial-gradient(circle at 92% 12%,rgba(109,93,252,.1),transparent 24rem),#fafbfe;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,Microsoft YaHei,sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit}button,input{font:inherit}.color-site-header{position:sticky;top:0;z-index:10;display:flex;align-items:center;justify-content:space-between;min-height:72px;padding:0 max(24px,calc((100vw - 1180px)/2));border-bottom:1px solid rgba(229,231,239,.85);background:#ffffffd1;backdrop-filter:blur(18px)}.color-brand{display:flex;align-items:center;gap:11px;text-decoration:none;font-weight:800}.color-brand-mark{display:grid;width:36px;height:36px;place-items:center;border-radius:12px;color:#fff;background:linear-gradient(135deg,#3157d5,#7c5df5);box-shadow:0 8px 20px #3157d540}.color-brand small{display:block;margin-top:2px;color:var(--muted);font-size:11px;font-weight:600}.color-header-actions{display:flex;align-items:center;gap:8px}.color-header-actions a{padding:9px 12px;border-radius:10px;text-decoration:none;color:#475467;font-size:14px;font-weight:650}.color-header-actions a:hover,.color-header-actions a.active{color:var(--brand);background:#eef2ff}.color-page{width:min(1180px,calc(100% - 40px));margin:0 auto;padding:28px 0 72px}.breadcrumbs{display:flex;gap:8px;align-items:center;margin-bottom:24px;color:var(--muted);font-size:13px}.breadcrumbs a{text-decoration:none}.breadcrumbs a:hover{color:var(--brand)}.color-hero{overflow:hidden;display:grid;grid-template-columns:minmax(0,1fr) 360px;min-height:390px;border:1px solid rgba(255,255,255,.9);border-radius:30px;background:var(--panel);box-shadow:var(--shadow)}.color-hero-copy{padding:clamp(32px,5vw,64px)}.eyebrow{display:inline-flex;align-items:center;gap:8px;color:var(--brand);font-size:12px;font-weight:800;letter-spacing:.12em;text-transform:uppercase}.eyebrow:before{content:"";width:24px;height:2px;border-radius:2px;background:currentColor}.color-hero h1{margin:18px 0 12px;font-size:clamp(38px,6vw,68px);line-height:1.02;letter-spacing:-.045em}.color-hero h1 span{display:block;margin-top:12px;color:var(--muted);font-size:clamp(17px,2vw,23px);font-weight:650;letter-spacing:-.01em}.color-hero p{max-width:680px;margin:0;color:var(--muted);font-size:17px;line-height:1.8}.hero-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}.primary-action,.secondary-action{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:0 18px;border-radius:13px;text-decoration:none;font-size:14px;font-weight:750}.primary-action{color:#fff;background:#172033;box-shadow:0 12px 30px #1720332e}.secondary-action{border:1px solid var(--line);background:#fff}.color-hero-swatch{position:relative;display:grid;min-height:320px;place-items:center;color:var(--detail-text, #fff);background:var(--detail-color)}.color-hero-swatch:before{content:"";position:absolute;inset:18px;border:1px solid color-mix(in srgb,currentColor 34%,transparent);border-radius:20px}.color-hero-swatch span{position:relative;font-size:20px;font-weight:800;letter-spacing:.06em}.section{margin-top:54px}.section-heading{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:18px}.section-heading h2{margin:0;font-size:clamp(25px,3vw,34px);letter-spacing:-.025em}.section-heading p{max-width:650px;margin:7px 0 0;color:var(--muted);line-height:1.7}.copy-all{border:1px solid var(--line);border-radius:11px;padding:9px 13px;background:#fff;color:var(--brand);cursor:pointer;font-weight:700}.value-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.value-card{min-width:0;padding:19px;border:1px solid var(--line);border-radius:17px;background:var(--panel);box-shadow:0 9px 25px #2a32490b}.value-card span{display:block;color:var(--muted);font-size:11px;font-weight:800;letter-spacing:.08em}.value-card strong{display:block;overflow:hidden;margin-top:9px;font-size:16px;text-overflow:ellipsis;white-space:nowrap}.value-card button,.code-row button{margin-top:12px;padding:0;border:0;color:var(--brand);background:transparent;cursor:pointer;font-size:12px;font-weight:750}.scale-strip{overflow:hidden;display:grid;grid-template-columns:repeat(11,1fr);min-height:116px;border-radius:20px;box-shadow:var(--shadow)}.scale-swatch{display:flex;align-items:end;justify-content:center;min-width:0;padding:12px 5px;color:var(--swatch-text);background:var(--swatch);text-decoration:none}.scale-swatch span{font-size:10px;font-weight:750;transform:rotate(-90deg);white-space:nowrap}.harmony-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.harmony-card{overflow:hidden;border:1px solid var(--line);border-radius:19px;background:#fff}.harmony-colors{display:grid;grid-template-columns:repeat(var(--count),1fr);height:112px}.harmony-colors a{position:relative;background:var(--swatch)}.harmony-body{padding:17px}.harmony-body h3{margin:0;font-size:16px}.harmony-body p{margin:7px 0 0;color:var(--muted);font-size:13px;line-height:1.55}.two-column{display:grid;grid-template-columns:1fr 1fr;gap:16px}.info-panel{padding:24px;border:1px solid var(--line);border-radius:21px;background:var(--panel)}.info-panel h3{margin:0 0 15px;font-size:20px}.contrast-row{display:grid;grid-template-columns:86px 1fr auto;gap:14px;align-items:center;margin-top:10px;padding:13px;border:1px solid var(--line);border-radius:14px}.contrast-sample{display:grid;height:52px;place-items:center;border-radius:10px;font-weight:800}.contrast-copy span,.contrast-copy small{display:block;color:var(--muted)}.contrast-copy strong{font-size:20px}.status-pill{padding:7px 9px;border-radius:999px;color:#087443;background:#e8f8ef;font-size:11px;font-weight:800}.status-pill.fail{color:#b42318;background:#fef0ed}.code-list{display:grid;gap:9px}.code-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px;border-radius:12px;background:var(--soft)}.code-row code{overflow:hidden;color:#344054;text-overflow:ellipsis;white-space:nowrap}.code-row button{flex:none;margin:0}.prose p{color:#475467;line-height:1.8}.prose ul{padding-left:20px;color:#475467;line-height:1.9}.related-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.related-card{overflow:hidden;border:1px solid var(--line);border-radius:16px;background:#fff;text-decoration:none;transition:transform .2s ease,box-shadow .2s ease}.related-card:hover{transform:translateY(-3px);box-shadow:0 14px 35px #2a32491f}.related-swatch{height:88px;background:var(--swatch)}.related-copy{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:13px}.related-copy strong{overflow:hidden;font-size:13px;text-overflow:ellipsis;white-space:nowrap}.related-copy span{color:var(--muted);font-size:11px}.directory-hero{padding:clamp(32px,6vw,68px);border:1px solid var(--line);border-radius:28px;background:linear-gradient(135deg,#fffffff5,#f5f7ffe6);box-shadow:var(--shadow)}.directory-hero h1{max-width:820px;margin:12px 0;font-size:clamp(38px,6vw,66px);line-height:1.05;letter-spacing:-.045em}.directory-hero p{max-width:760px;color:var(--muted);font-size:17px;line-height:1.75}.directory-search{position:sticky;top:86px;z-index:5;display:flex;gap:12px;margin:28px 0 18px;padding:12px;border:1px solid var(--line);border-radius:17px;background:#ffffffe6;backdrop-filter:blur(16px)}.directory-search input{width:100%;border:0;outline:0;padding:4px 7px;background:transparent;font-size:16px}.directory-search span{flex:none;padding:8px 10px;border-radius:10px;color:var(--brand);background:#eef2ff;font-size:13px;font-weight:750}.directory-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:10px}.directory-card{overflow:hidden;border:1px solid var(--line);border-radius:14px;background:#fff;text-decoration:none}.directory-card[hidden]{display:none}.directory-card i{display:block;height:72px;background:var(--swatch)}.directory-card div{padding:10px}.directory-card strong,.directory-card span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.directory-card strong{font-size:12px}.directory-card span{margin-top:3px;color:var(--muted);font-size:10px}.directory-empty{display:none;padding:40px;text-align:center;color:var(--muted)}.color-cta{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-top:56px;padding:30px;border-radius:24px;color:#fff;background:#172033}.color-cta h2{margin:0 0 7px;font-size:25px}.color-cta p{margin:0;color:#c9d0df}.color-cta .primary-action{color:#172033;background:#fff}.color-service-note{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-top:18px;padding:15px 4px;border-top:1px solid var(--line);color:var(--muted)}.color-service-note>div{min-width:0}.color-service-note>div>span{display:block;color:#526174;font-size:11px;font-weight:800}.color-service-note p{margin:4px 0 0;font-size:11px;line-height:1.6}.color-service-note nav{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:5px}.color-service-note nav a{padding:5px 7px;border:1px solid var(--line);border-radius:7px;background:#ffffffc7;color:#64748b;font-size:10px;font-weight:700;text-decoration:none;white-space:nowrap}.color-service-note nav a:hover{border-color:color-mix(in srgb,var(--detail-color, #3157d5) 35%,#dfe4ee);color:var(--brand)}.color-service-cities{flex:1}.color-service-links{flex:none}.color-footer{padding:28px 20px 44px;border-top:1px solid var(--line);color:var(--muted);text-align:center;font-size:12px}.toast{position:fixed;right:22px;bottom:22px;z-index:20;padding:12px 16px;border-radius:12px;color:#fff;background:#172033;opacity:0;transform:translateY(10px);pointer-events:none;transition:.2s ease}.toast.show{opacity:1;transform:translateY(0)}@media(max-width:900px){.color-hero{grid-template-columns:1fr}.color-hero-swatch{min-height:230px}.value-grid,.harmony-grid{grid-template-columns:repeat(2,1fr)}.directory-grid{grid-template-columns:repeat(4,1fr)}}@media(max-width:640px){.color-site-header{min-height:62px;padding:0 14px}.color-brand small,.color-header-actions .desktop-link{display:none}.color-header-actions a{padding:8px;font-size:12px}.color-page{width:min(100% - 24px,1180px);padding-top:16px}.breadcrumbs{overflow:hidden;white-space:nowrap}.color-hero{border-radius:22px}.color-hero-copy{padding:27px 23px}.color-hero h1{font-size:42px}.value-grid,.harmony-grid,.two-column,.related-grid{grid-template-columns:1fr 1fr}.value-card{padding:15px}.scale-strip{overflow-x:auto;grid-template-columns:repeat(11,minmax(62px,1fr))}.section{margin-top:40px}.section-heading{align-items:start;flex-direction:column}.two-column{grid-template-columns:1fr}.directory-grid{grid-template-columns:repeat(2,1fr)}.directory-search{top:70px}.color-cta,.color-service-note{align-items:flex-start;flex-direction:column}.color-service-note nav{justify-content:flex-start}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}