.bands{padding:clamp(40px, 9vw, 120px) var(--gx);background:var(--cream)}.bands .wrap{max-width:var(--maxw);margin-inline:auto}.bands-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:32px;display:grid}.band{background:var(--snow);border:1px solid var(--line);border-radius:6px;flex-direction:column;gap:16px;padding:32px 28px;display:flex;position:relative;overflow:hidden}.band .swatch{border-radius:999px;width:28px;height:28px}.band.optimal .swatch{background:#b3c9b1;box-shadow:0 0 0 4px #b3c9b12e}.band.range .swatch{background:#c9b58c;box-shadow:0 0 0 4px #c9b58c2e}.band.flag .swatch{background:#c9a59f;box-shadow:0 0 0 4px #c9a59f2e}.band .k{font-family:var(--mono);letter-spacing:.22em;color:var(--stone);text-transform:uppercase;font-size:10px}.band h3{letter-spacing:-.02em;font-size:28px;font-weight:500;line-height:1.1}.band p{color:var(--graphite);font-size:14px;line-height:1.6}.band ul{border-top:1px solid var(--line);flex-direction:column;gap:8px;margin-top:auto;padding:16px 0 0;list-style:none;display:flex}.band ul li{color:var(--graphite);grid-template-columns:18px 1fr;gap:6px;font-size:13px;line-height:1.55;display:grid}.band ul li .n{font-family:var(--mono);letter-spacing:.18em;color:var(--stone);margin-top:4px;font-size:9.5px}@media (max-width:1080px){.bands-grid{grid-template-columns:1fr}}.example{padding:clamp(40px, 9vw, 120px) var(--gx);background:var(--ink);color:var(--cream)}.example .wrap{max-width:var(--maxw);margin-inline:auto}.example .head .h-note,.example .head .h-index{color:#efeadb8c}.ex-card{background:var(--char);border:1px solid #efeadb14;border-radius:12px;margin-top:32px;padding:32px}.ex-card h3{letter-spacing:-.015em;font-size:20px;font-weight:500}.ex-card .markers{gap:14px;margin-top:20px;display:grid}.marker-row{font-family:var(--mono);grid-template-columns:150px 90px 1fr 80px;align-items:center;gap:16px;font-size:12px;display:grid}.marker-row .name{color:var(--cream)}.marker-row .v{color:#efeadbb3;font-variant-numeric:tabular-nums}.marker-row .scale{opacity:.45;background:linear-gradient(90deg,#c9a59f 0%,#c9b58c 30%,#b3c9b1 60%,#c9b58c 85%,#c9a59f 100%);border-radius:8px;height:8px;position:relative}.marker-row .scale .pin{background:var(--cream);border-radius:2px;width:2px;height:16px;position:absolute;top:-4px}.marker-row .label{font-family:var(--mono);letter-spacing:.18em;text-transform:uppercase;text-align:right;color:#efeadb8c;font-size:10px}.marker-row .label.optimal{color:#b3c9b1}.marker-row .label.range{color:#c9b58c}.marker-row .label.flag{color:#c9a59f}@media (max-width:900px){.marker-row{grid-template-columns:1fr 60px;grid-template-areas:"name v""scale scale""label label";row-gap:6px}.marker-row .name{grid-area:name}.marker-row .v{text-align:right;grid-area:v}.marker-row .scale{grid-area:scale}.marker-row .label{text-align:left;grid-area:label}}body.dark .bands{background:var(--ink)}body.dark .bands h2{color:var(--cream)}body.dark .band{background:var(--char);border-color:var(--line-d);color:var(--cream)}body.dark .band h3{color:var(--cream)}body.dark .band p,body.dark .band ul li{color:#efeadbb8}body.dark .band ul{border-top-color:var(--line-d)}body.dark section.sc-cta{background:var(--ink)!important}body.dark section.sc-cta h2{color:var(--cream)}
