/* Shared quiet-tech surfaces; paper figures retain their white background. */
:root{--paper:#f9fbfb;--soft:#eef3f3;--surface:#fff;--ink:#1d3038;--muted:#4c626b;--quiet:#61757d;--line:#cfdddf;--blue:#16746f;--blue-hover:#105b57;--accent-soft:#e3f2ee;--nav-surface:rgba(249,251,251,.94)}
html[data-theme=dark]{--paper:#0d171c;--soft:#142229;--surface:#172830;--ink:#e9f3f4;--muted:#b6c9ce;--quiet:#9eb5be;--line:#324951;--blue:#93dbce;--blue-hover:#b7efe2;--accent-soft:#203c3c;--nav-surface:rgba(13,23,28,.94)}
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI Variable","Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;letter-spacing:-.012em}
.navlinks a{font-size:17px;font-weight:650}.brand-cn{font-size:21px}.nav-skill-link,.btn:not(.secondary){background:#176e68;border-color:#176e68;color:#fff}.nav-skill-link:hover,.btn:not(.secondary):hover{background:#11554f;border-color:#11554f;color:#fff}
.community-series{--c-accent:var(--blue);--c-glow:#237d80;--c-tint:var(--accent-soft);--c-grid:#287d8220}html[data-theme=dark] .community-series{--c-accent:#93dbce;--c-glow:#9adbd4;--c-tint:#203c3c}
.catalog-head{padding:38px 0 24px}.catalog-kicker{font:550 14px/1.5 ui-monospace,Consolas,monospace;letter-spacing:.07em;color:var(--blue);margin:0 0 10px}.catalog-title-row{display:flex;justify-content:space-between;gap:22px;align-items:end}.catalog-head h1{font-size:clamp(34px,4.2vw,52px);line-height:1.15;letter-spacing:-.045em;margin:0 0 14px}.catalog-head p:not(.catalog-kicker){font-size:18px;line-height:1.65;color:var(--muted);margin:0}.catalog-title-row>a{white-space:nowrap}
.palette-library{padding:4px 0 70px}.palette-controls{display:flex;justify-content:space-between;align-items:center;gap:20px;border-bottom:1px solid var(--line);padding:0 0 18px}.palette-controls input{min-height:46px;border:1px solid var(--line);border-radius:12px;padding:10px 14px;background:var(--surface);color:var(--ink);font:inherit;width:250px;max-width:100%}.palette-filters{display:flex;flex-wrap:wrap;gap:8px}.palette-filters button{min-height:44px;padding:9px 16px;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--muted);font-family:inherit;font-size:16px;font-weight:600;line-height:1.4;cursor:pointer}.palette-filters button[aria-pressed=true]{background:var(--accent-soft);color:var(--blue);border-color:var(--blue)}
.palette-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:26px}.palette-card{border:1px solid var(--line);border-radius:18px;overflow:clip;background:var(--surface);transition:transform .18s,border-color .18s,box-shadow .18s}.palette-card:hover{transform:translateY(-3px);border-color:var(--blue);box-shadow:0 16px 36px #18363d14}.palette-study-image{display:block;background:#fff;overflow:hidden}.palette-study-image img{display:block;width:100%;height:auto;aspect-ratio:1560/945;object-fit:contain}.palette-card-body{padding:22px}.palette-kind{font:550 13px/1.5 ui-monospace,Consolas,monospace;letter-spacing:.05em;color:var(--blue)}.palette-card h2{font-size:25px;line-height:1.25;margin:6px 0 10px}.palette-card p{font-size:16px;line-height:1.6;color:var(--muted);margin:0 0 14px}.palette-hex-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.palette-hex{display:flex;align-items:center;gap:8px;min-height:42px;padding:7px;border:1px solid var(--line);border-radius:9px;color:var(--ink);background:var(--paper);cursor:pointer}.palette-hex i{display:block;min-width:23px;width:23px;height:16px;border-radius:9px;box-shadow:inset 0 0 0 1px #0001}.palette-hex code{font-size:13px;font-weight:600}.palette-copy-status{min-height:22px;font-size:14px!important;margin:8px 0!important}.palette-card-actions{display:flex;align-items:center;justify-content:space-between;gap:10px;border-top:1px solid var(--line);padding-top:14px}.palette-more{display:flex;justify-content:center;margin:30px 0}.palette-scope{border-top:1px solid var(--line);padding-top:25px;margin-top:26px;max-width:800px}.palette-scope h2{font-size:26px}.palette-code{background:var(--soft);color:var(--ink);border:1px solid var(--line);border-radius:12px;padding:22px;font-size:14px;line-height:1.65;overflow-x:auto;white-space:pre}.resource-swatch.hex-copy{border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--ink);cursor:pointer;padding:10px;min-height:44px;text-align:left}.resource-use-guide{margin:24px 0;padding:20px;border:1px solid var(--line);border-radius:14px;background:var(--soft)}.resource-use-guide h2{font-size:22px;margin:0 0 12px}.resource-use-guide p{font-size:17px;margin:8px 0}.resource-evidence .evidence-panels{font-size:17px}
.gallery-page-head{padding:30px 0 10px}.gallery-page-head h1{font-size:46px;margin:4px 0 12px}.gallery-page-head .lead{font-size:18px}.gallery-search-label{font-size:16px}.gallery-query{margin:5px 0 10px;min-height:44px;max-width:520px}.gallery-filters{gap:8px;margin:0}.gallery-filters .ghost{font-size:15px;min-height:42px;padding:8px 14px}.gallery-navigation{margin:10px 0 16px}.gallery-navigation>summary{font-size:15px}.gallery-navigation .category-nav{margin:14px 0;gap:8px}.gallery-navigation .category-nav a{font-size:15px;padding:7px 12px}.gallery-categories .section-head{margin-bottom:15px}.gallery-categories .section-head h2{font-size:27px}.gallery-flow{gap:22px}.gallery-slot{border:1px solid var(--line);border-radius:16px;overflow:hidden;background:var(--surface)}.gallery-slot .demo{border:0;margin:0}.gallery-slot .demo figcaption{padding:15px 18px}.gallery-slot .gallery-links{padding:0 18px 15px}.gallery-categories>.gallery-category{margin-bottom:40px}.gallery-foot-tools{border-top:1px solid var(--line);padding:25px 0}.gallery-foot-tools a{margin-right:26px}.page-block.soft:has(.gallery-categories){padding:18px 0 30px;background:var(--paper)}
.resource-advanced-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:18px 0}.resource-advanced-grid label{display:flex;flex-direction:column;gap:7px;font-size:16px;color:var(--muted)}.resource-advanced-grid select{min-height:44px;max-width:100%;width:100%;padding:9px 10px;border:1px solid var(--line);border-radius:9px;background:var(--surface);color:var(--ink);font:inherit}.resource-card{transition:transform .18s,border-color .18s}.resource-card:hover{transform:translateY(-3px);border-color:var(--blue)}.resource-card h3{font-size:24px}.resource-card p{font-size:17px}.resource-card small{font-size:15px}.resource-detail .resource-preview{width:100%;background:#fff;border-radius:14px}.resource-detail .copy-human-note{font-size:17px}.resource-input-steps{padding:17px 20px;border:1px solid var(--line);border-radius:12px;background:var(--soft);font-size:17px;line-height:1.65}.resource-input-steps p{margin:7px 0}
.commons-intro{padding:28px 0 20px}.commons-intro-copy h1{font-size:40px;line-height:1.2;margin:8px 0 12px}.commons-intro-copy h1 br{display:none}.commons-intro-copy p:not(.commons-kicker){font-size:18px;margin:0}.commons-stats{gap:24px;margin-top:12px;border:0;padding:0}.commons-stats>div{display:flex;align-items:baseline;gap:7px}.commons-stats strong{font-size:21px}.commons-stats span{font-size:14px}.commons-entry-actions{margin-top:12px;gap:20px}.commons-entry-actions .c-button{padding:5px 0;border:0;min-height:40px;font-size:16px;background:none;color:var(--blue)}.commons-entry-actions .c-quiet{font-size:16px;min-height:40px}.commons-library{padding-top:24px}.commons-library-heading h2{font-size:28px}.commons-library-heading p{margin:6px 0;font-size:16px}.commons-controls{margin-top:18px}.commons-card{transition:transform .18s,border-color .18s}.commons-card:hover{transform:translateY(-3px);border-color:var(--blue)}.commons-preview-button img{height:auto;aspect-ratio:1.5;object-fit:contain;background:#fff}.commons-card-count{font-size:14px}.commons-card-body h3{font-size:24px}.commons-description{font-size:17px}.commons-card-actions .c-quiet{font-size:16px}
@media(min-width:1000px){.topbar .nav{gap:14px}.navlinks{gap:18px}.community-series .commons-intro>.wrap{display:flex;align-items:center;flex-wrap:wrap;gap:8px 32px}.commons-intro-copy{flex:1 1 54%}.commons-entry-actions{margin:0}.commons-stats{flex:1 1 100%}.resource-advanced-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:760px){.catalog-title-row{display:block}.catalog-title-row>a{display:inline-flex;margin-top:12px}.palette-grid{grid-template-columns:1fr}.palette-controls{flex-direction:column;align-items:stretch;gap:12px}.palette-controls input{width:100%}.palette-filters{flex-wrap:nowrap;gap:6px}.palette-filters button{padding:8px 10px;font-size:14px;flex:1;white-space:nowrap}.palette-head{padding:24px 0 18px}.palette-head h1{font-size:34px}.palette-card-body{padding:18px}.palette-hex-row{grid-template-columns:repeat(3,minmax(0,1fr))}.palette-hex{gap:5px;padding:7px 5px}.palette-hex code{font-size:12px}.palette-hex i{min-width:18px;width:18px}.resource-advanced-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.gallery-page-head{padding:20px 0 6px}.gallery-page-head h1{font-size:34px;line-height:1.2}.gallery-page-head p{font-size:17px!important;margin-bottom:8px}.gallery-filters{flex-wrap:nowrap;overflow-x:auto;padding-bottom:4px;scrollbar-width:thin}.gallery-filters .ghost{flex-shrink:0;font-size:14px;padding:8px 12px}.gallery-navigation{margin:7px 0}.gallery-navigation .category-nav{display:flex;overflow-x:auto;flex-wrap:nowrap}.gallery-navigation a{white-space:nowrap}.gallery-query{width:100%;margin:4px 0 8px}.gallery-category .section-head{margin-bottom:10px}.gallery-categories .section-head h2{font-size:24px}.gallery-slot{border-radius:12px}.gallery-categories>.gallery-category{margin-bottom:28px}.gallery-flow{gap:18px}.commons-intro{padding:18px 0 12px}.commons-kicker{font-size:12px;margin:0 0 4px}.commons-intro-copy h1{font-size:30px;line-height:1.25;margin:5px 0 8px}.commons-intro-copy p:not(.commons-kicker){font-size:16px}.commons-entry-actions{gap:12px;margin-top:7px;flex-wrap:wrap}.commons-entry-actions .c-button,.commons-entry-actions .c-quiet{font-size:14px;min-height:36px;padding:4px 0}.commons-stats{display:none}.commons-library{padding-top:16px}.commons-library-heading{align-items:center;margin:0;gap:10px}.commons-library-heading h2{font-size:24px;margin:0}.commons-library-heading p{font-size:14px}.commons-library-heading .download-menu{font-size:14px}.commons-library-heading .download-menu>summary{min-height:40px;font-size:14px}.commons-controls{margin-top:12px;padding:12px}.commons-control-main{gap:10px}.commons-segments button{font-size:14px;padding:8px 9px;min-height:40px}.commons-search input{min-height:44px}.commons-control-options{gap:8px;margin-top:9px;align-items:center}.commons-size-label{font-size:13px}.commons-size-label select{min-height:38px;font-size:14px}.commons-local-note{font-size:13px;margin:7px 0}.commons-preview-button img{aspect-ratio:1.5}.commons-grid{gap:20px}.commons-card-body{padding:17px}.resource-top{gap:22px}.resource-use-guide{padding:17px}.resource-use-guide p{font-size:16px}.palette-code{font-size:13px;padding:16px}}
@media(prefers-reduced-motion:reduce){.palette-card,.resource-card,.commons-card{transition:none}.palette-card:hover,.resource-card:hover,.commons-card:hover{transform:none}}
html[data-reduced-motion=true] .palette-card,html[data-reduced-motion=true] .resource-card,html[data-reduced-motion=true] .commons-card{transition:none;transform:none}
[hidden]{display:none!important}
.catalog-pagination{display:flex;justify-content:center;padding:24px 0 12px}.catalog-pagination .ghost{min-height:44px;padding:10px 24px;border:1px solid var(--line);border-radius:12px;background:var(--surface);color:var(--blue);font-family:inherit;font-size:16px;font-weight:600;line-height:1.5;cursor:pointer}.catalog-pagination .ghost:hover{background:var(--accent-soft)}
@media(max-width:650px){
 .community-series .commons-intro>.wrap{gap:10px}
 .community-series .commons-entry-actions{display:flex;align-items:center;gap:5px 15px;margin-top:0;min-width:0}
 .community-series .commons-entry-actions .c-quiet{flex-basis:auto;justify-content:flex-start;font-size:14px;min-height:40px}
 .community-series .commons-entry-actions .c-button{flex:0 0 auto;justify-content:flex-start;font-size:14px;min-height:40px}
 .community-series .commons-stats{display:none}
 .community-series .commons-controls{margin-top:8px}
 .community-series .commons-library-heading{gap:8px}
 .community-series .commons-local-note{margin:6px 0}
}
/* Small-screen controls retain independent hit areas in both languages. */
@media(max-width:600px){
  .nav-skill-link{min-width:0;max-width:100%;width:100%;white-space:normal;line-height:1.3;text-align:center;padding:9px 10px}
  .nav .language-switcher select{width:116px;max-width:116px;padding-left:9px;padding-right:23px}
  .palette-filters{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;min-width:0}
  .palette-filters button{min-width:0;white-space:normal;font-size:16px;min-height:48px;line-height:1.35}
}
/* Downloads can extend past the card; only the artwork keeps a clipped edge. */
.palette-card{position:relative;overflow:visible}
.palette-study-image{border-radius:17px 17px 0 0}
.palette-card:focus-within,.palette-card:has(.download-menu[open]){z-index:4}

/* One continuous catalogue, with room inside every card. */
body:has(.gallery-categories) .wrap,body:has(.palette-grid) .wrap{width:min(calc(100% - 64px),1640px);max-width:1640px}
.gallery-flow,.palette-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:22px;align-items:start}
.gallery-slot{position:relative;overflow:visible;min-width:0}
.gallery-group-anchor{position:absolute;top:0;left:0;scroll-margin-top:140px}
.gallery-slot:focus-within,.gallery-slot:has(.download-menu[open]){z-index:5}
.gallery-slot .gallery-card{min-width:0}
.gallery-slot .gallery-image{border-radius:16px 16px 0 0;overflow:hidden;padding:12px;background:#fff;aspect-ratio:1.48;min-height:0}
.gallery-slot .gallery-image img{height:100%;width:100%;object-fit:contain}
.gallery-slot .gallery-caption{display:flex;flex-direction:column;gap:16px;padding:22px}
.gallery-caption>div:first-child{min-width:0;max-width:100%}
.gallery-slot .gallery-caption h3{font-size:21px;line-height:1.45;margin:10px 0 8px;overflow-wrap:anywhere}
.gallery-slot .gallery-caption p{font-size:17px;line-height:1.65}
.gallery-slot .synthetic{font-size:14px;line-height:1.6}
.gallery-slot .gallery-links{padding:0;display:flex;flex-wrap:wrap;gap:12px;width:100%;align-items:center}
.gallery-links .text-link{font-size:16px;margin:0;line-height:1.5;min-height:44px;display:inline-flex;align-items:center}
.gallery-slot .download-menu>summary{font-size:16px;gap:16px;padding:10px 15px;min-height:44px}
.gallery-links .download-menu-list{width:100%;max-width:100%;padding:7px}
.gallery-links .download-menu-list a{padding:10px;gap:9px;overflow-wrap:anywhere}
.gallery-links .download-menu-list strong{font-size:16px}
.gallery-links .download-menu-list small{font-size:14px}
.palette-card-body{padding:22px}
.palette-card h2{font-size:23px;line-height:1.4;overflow-wrap:anywhere}
.palette-hex-row{grid-template-columns:repeat(2,minmax(0,1fr))}
.palette-card-actions{flex-wrap:wrap;gap:12px}
.palette-card-actions .download-menu>summary{font-size:16px;padding:10px 15px;gap:14px}
.palette-card-actions .download-menu-list{position:static;width:100%;max-width:100%;margin-top:10px;box-shadow:none}
.palette-card-actions .download-menu[open]{width:100%}
@media(min-width:1760px){
  .gallery-flow,.palette-grid{grid-template-columns:repeat(5,minmax(0,1fr))}
}
@media(max-width:1199px){
  .gallery-flow,.palette-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:899px){
  .gallery-flow,.palette-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
}
@media(max-width:619px){
  body:has(.gallery-categories) .wrap,body:has(.palette-grid) .wrap{width:calc(100% - 36px)}
  .gallery-flow,.palette-grid{grid-template-columns:1fr;gap:20px}
  .gallery-slot .gallery-caption,.palette-card-body{padding:22px}
  .gallery-slot .gallery-image{padding:14px;border-radius:12px 12px 0 0}
  .gallery-slot .gallery-caption h3{font-size:23px}
  .palette-hex-row{grid-template-columns:repeat(3,minmax(0,1fr))}
  .palette-card .download-menu-list{left:0!important;right:auto!important;width:100%;max-width:100%}
}

.resource-preview-link{display:block;position:relative;border-radius:14px}.resource-preview-link>span{display:block;padding:10px 16px;text-align:right;font-size:16px;color:var(--teal)}.resource-preview-link:focus-visible{outline:3px solid var(--teal);outline-offset:4px}

.figure-preview.figure-natural img{width:auto;max-width:none;max-height:none}.figure-preview .figure-zoom{min-height:44px;padding:8px 16px}