.palette-card{margin:28px 0;padding:28px;border:1px solid #d5dfe7;border-radius:18px;box-shadow:0 10px 30px #243b530b;color:#243b53}.milk{background:#faf9f5}.sage{background:#eef3ef}.night{background:#203852;color:#eaf2fb;border-color:#344f6f}.palette-card figcaption{display:grid;gap:8px;margin-bottom:28px}.palette-card figcaption small{font-size:11px;letter-spacing:.13em}.palette-card figcaption strong{font-size:27px;line-height:1.3;letter-spacing:-.025em}.palette-card figcaption>span{font-size:13px}.color-row{display:grid;grid-template-columns:126px 1fr 35px;gap:12px;align-items:center;margin:19px 0;font-size:14px}.color-row>div{border-left:1px solid #8295a9;height:24px}.color-row i{display:block;height:100%;border-radius:0 5px 5px 0}.color-row b{text-align:right}.scale{display:flex;justify-content:space-between;margin-left:138px;margin-right:47px;font-size:11px}.swatches{display:flex;flex-wrap:wrap;gap:18px;margin-top:24px;padding-top:16px;border-top:1px solid #8197ae50;font-size:12px}.swatches span{display:flex;align-items:center;gap:8px}.swatches i{width:15px;height:15px;border-radius:4px;border:1px solid #8197ae50}.scale-card{margin:28px 0;padding:24px;background:#faf9f5;border:1px solid #d5dfe7;border-radius:14px;color:#243b53}.scale-card figcaption{display:grid;gap:6px;margin-bottom:22px}.scale-card figcaption span{font-size:13px;color:#52647a}.sequential,.diverging{height:32px;border-radius:6px}.sequential{background:linear-gradient(90deg,#e3ecf6,#92b1d5,#426a9b)}.diverging{background:linear-gradient(90deg,#ac654c,#f3eee7,#426a9b)}.scale-labels{display:flex;justify-content:space-between;margin-top:9px;font-size:12px}.status-demo{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:24px 0}.status-demo>div{padding:22px;border:1px solid #cbd6e3;background:#edf2f8;border-radius:12px;display:grid;gap:9px}.status-demo span{font-size:13px}.status-demo strong{font-size:25px;line-height:1.3}.status-demo b{font-size:13px;color:#80503c}.status-demo p{font-size:14px;margin:0}.status-demo>div+div{background:#f5eee5;border-color:#d8c7b5}@media(max-width:600px){.palette-card{padding:18px}.palette-card figcaption strong{font-size:23px}.color-row{grid-template-columns:96px 1fr 29px;gap:8px;font-size:12px}.scale{margin-left:104px;margin-right:37px}.status-demo{grid-template-columns:1fr}}