/* Corteccia-inspired colourway selector — exclusive to 200×1200 Shape-Cid studies. */
.shape-cid-colours{max-width:none;margin:17px 0 0;padding:0}
.shape-cid-colours-head{display:flex;justify-content:space-between;align-items:baseline;gap:18px;margin-bottom:14px}
.shape-cid-colours-head .kicker{margin:0!important}
.shape-cid-colour-name{margin:0;color:#5d544c;font:10px var(--mono);letter-spacing:.1em;text-align:right}
.shape-cid-swatches{display:flex;flex-wrap:nowrap;gap:12px;max-width:100%;overflow-x:auto;padding:4px;scrollbar-width:thin}
.shape-cid-swatches::-webkit-scrollbar{height:5px}.shape-cid-swatches::-webkit-scrollbar-thumb{background:#b8aa9a;border-radius:99px}
.shape-cid-swatch{flex:0 0 54px}
.shape-cid-swatch{width:54px;height:54px;padding:0;border:1px solid rgba(52,42,33,.28);border-radius:50%;background:var(--swatch) center/cover no-repeat;box-shadow:inset 0 0 0 2px rgba(255,255,255,.35);cursor:pointer;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;position:relative}
.shape-cid-swatch:hover,.shape-cid-swatch:focus-visible{transform:scale(1.12);border-color:var(--ink);outline:none}
.shape-cid-swatch.is-active{border-color:var(--ink);box-shadow:0 0 0 3px #f6f3ee,0 0 0 4px var(--ink)}
.shape-cid-swatch::after{content:attr(aria-label);position:absolute;z-index:4;left:50%;bottom:calc(100% + 9px);transform:translateX(-50%) translateY(4px);width:max-content;max-width:160px;padding:6px 8px;background:var(--ink);color:#fff;opacity:0;pointer-events:none;font:9px var(--mono);letter-spacing:.06em;transition:opacity .16s ease,transform .16s ease}
.shape-cid-swatch:hover::after,.shape-cid-swatch:focus-visible::after{opacity:1;transform:translateX(-50%) translateY(0)}
.shape-cid-visual-note{position:absolute;z-index:2;right:20px;bottom:18px;padding:7px 9px;background:rgba(31,26,21,.65);color:#fff;font:9px var(--mono);letter-spacing:.08em;text-transform:uppercase}
@media(max-width:800px){.shape-cid-colours{max-width:none;margin-top:18px}.shape-cid-swatch{width:46px;height:46px;flex-basis:46px}.shape-cid-visual-note{right:12px;bottom:12px;font-size:8px}}