.palette-intro{color:var(--text-secondary);margin:0 0 28px;font-size:1rem;line-height:1.65}.palette-hero{border-radius:var(--radius-lg);box-shadow:var(--shadow-md);margin:0 0 32px;overflow:hidden}.palette-hero img{aspect-ratio:3/2;object-fit:cover;width:100%;height:auto;display:block}.palette-hero figcaption{color:var(--text-muted);background:var(--surface-color);border-top:1px solid var(--border-color);padding:10px 14px;font-size:.8125rem}.palette-hero figcaption a{color:var(--text-muted)}.palette-swatches{grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;margin:0 0 32px;padding:0;list-style:none;display:grid}.palette-swatch{border-radius:var(--radius-md);min-height:140px;box-shadow:var(--shadow-sm);flex-direction:column;justify-content:flex-end;gap:2px;padding:18px 16px;font-family:JetBrains Mono,Fira Code,Consolas,monospace;font-size:.875rem;transition:transform .15s;display:flex}.palette-swatch:hover{transform:translateY(-2px)}.swatch-name{font-family:var(--font-inter,"Inter"), sans-serif;letter-spacing:-.01em;margin-bottom:4px;font-size:.9375rem;font-weight:600}.swatch-hex{opacity:.95;font-size:.9375rem;font-weight:600}.swatch-rgb,.swatch-hsl{opacity:.78;font-size:.75rem}.palette-tool-cta{border:1px solid var(--border-color);border-radius:var(--radius-lg);text-align:center;background:linear-gradient(135deg,#eff6ff 0%,#fdf2f8 100%);margin:32px 0 40px;padding:28px 24px}.palette-tool-actions{flex-wrap:wrap;justify-content:center;gap:12px;display:flex}button.hub-cta-btn{cursor:pointer;font-family:inherit;font-size:inherit;border:none}a.palette-tool-link{background:var(--surface-color);border:2px solid var(--primary-blue);box-shadow:none;color:var(--primary-blue)!important}a.palette-tool-link:hover{background:var(--primary-blue-light);color:var(--primary-blue-hover)!important}.palette-related-grid{grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;margin:16px 0 0;padding:0;list-style:none;display:grid}.palette-related-card{border:1px solid var(--border-color);border-radius:var(--radius-md);background:var(--surface-color);overflow:hidden}.palette-related-card a{color:inherit;text-decoration:none;display:block}.palette-related-card a:hover{text-decoration:none}.palette-related-stripes{height:48px;display:flex}.palette-related-stripe{flex:1}.palette-related-body{color:var(--text-color);padding:12px 14px;font-size:.875rem;font-weight:600}.gallery-grid{grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px;margin:24px 0 40px;padding:0;list-style:none;display:grid}.gallery-card{background:var(--surface-color);border:1px solid var(--border-color);border-radius:var(--radius-md);box-shadow:var(--shadow-sm);transition:transform .15s,box-shadow .15s;overflow:hidden}.gallery-card:hover{box-shadow:var(--shadow-md);transform:translateY(-2px)}.gallery-card a{color:inherit;text-decoration:none;display:block}.gallery-card a:hover{text-decoration:none}.gallery-card-stripes{height:80px;display:flex}.gallery-card-stripe{flex:1}.gallery-card-body{padding:14px 16px 16px}.gallery-card-body h3{font-family:var(--font-cal-sans,"Cal Sans"), sans-serif;color:var(--text-color);letter-spacing:-.005em;margin:0 0 4px;font-size:1.0625rem;font-weight:600}.gallery-card-body p{color:var(--text-muted);margin:0;font-size:.8125rem}.palette-gallery-page{max-width:1120px}.demo-page{max-width:800px;color:var(--text-color);margin:0 auto;padding:40px 24px;line-height:1.6}.demo-page h1{margin-bottom:.25rem;font-size:2rem}.demo-page h2{border-bottom:1px solid var(--border-color);margin-top:2rem;padding-bottom:8px;font-size:1.25rem}.demo-page table{border-collapse:collapse;width:100%;margin-top:12px}.demo-page td,.demo-page th{text-align:left;border-bottom:1px solid var(--border-color);padding:8px}.demo-page .meta{color:var(--text-muted);margin-bottom:2rem}.demo-page .demo-banner{background:var(--primary-blue-light);border:1px solid var(--border-color);border-radius:var(--radius);margin-bottom:24px;padding:12px 16px;font-size:.9rem}.demo-page .demo-banner a{color:var(--primary-blue);font-weight:600}@media (max-width:640px){.palette-swatches{grid-template-columns:repeat(2,1fr);gap:8px}.palette-swatch{min-height:120px;padding:14px 12px}.gallery-grid{grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:12px}}@media print{.demo-page{padding:20px}.demo-page h2{page-break-before:always}.demo-page h2:first-of-type{page-break-before:avoid}}
