.cl-hero{border-radius:var(--r-lg);justify-content:space-between;align-items:center;gap:16px;padding:clamp(20px,3vw,32px);transition:background .25s;display:flex;box-shadow:inset 0 0 0 1px #ffffff1f}.cl-hero>div{gap:6px;display:grid}.cl-hero strong{font-family:var(--font-display);letter-spacing:-.04em;font-size:clamp(2rem,5vw,3.6rem);line-height:1}.cl-hero .ak-mono{opacity:.8;font-size:.8rem}.cl-picker{cursor:pointer;border:3px solid;border-radius:50%;place-items:center;width:84px;height:84px;font-size:.78rem;font-weight:700;display:grid;position:relative}.cl-picker input{opacity:0;cursor:pointer;position:absolute;inset:0}.cl-formats{gap:8px;display:grid}.cl-formats>div{border:1px solid var(--line);border-radius:var(--r-sm);background:#0003;grid-template-columns:56px minmax(0,1fr) auto;align-items:center;gap:10px;padding:8px 10px;display:grid}.cl-formats code{font-family:var(--font-mono);overflow-wrap:anywhere;font-size:.86rem}.cl-row{flex-wrap:wrap;gap:8px;display:flex}.cl-row>*{flex:90px}.cl-swatch{border-radius:var(--r-sm);text-align:left;cursor:pointer;border:0;align-content:end;gap:2px;min-height:64px;padding:8px 10px;transition:transform .15s;display:grid;box-shadow:inset 0 0 0 1px #ffffff1f}.cl-swatch:hover{transform:translateY(-2px)}.cl-swatch.is-big{min-height:120px}.cl-swatch small{font-family:var(--font-mono);opacity:.75;font-size:.62rem}.cl-swatch b{font-family:var(--font-mono);font-size:.78rem;font-weight:600}.cl-scale{grid-template-columns:repeat(11,minmax(0,1fr));gap:4px;display:grid}.cl-scale .cl-swatch{min-height:96px;padding:6px}.cl-scale .cl-swatch b{writing-mode:vertical-rl;font-size:.6rem;transform:rotate(180deg)}.cl-preview{border-radius:var(--r-md);box-shadow:inset 0 0 0 1px var(--line);gap:12px;padding:28px;display:grid}.cl-preview h3{text-transform:none;letter-spacing:-.01em;margin:0;font-size:24px}.cl-preview p{margin:0;font-size:16px;line-height:1.55}.cl-preview small{font-size:13px}.cl-button{border-radius:var(--r-pill);justify-self:start;padding:10px 18px;font-weight:700}.cl-fix{color:var(--muted);gap:8px;font-size:.84rem;display:grid}.cl-image{border-radius:var(--r-md);cursor:crosshair;width:100%;display:block}.cl-palette{gap:6px;margin-top:14px;display:flex}.cl-palette>div{flex-basis:0;gap:4px;min-width:0;display:grid}.cl-palette small{text-align:center;color:var(--faint);font-size:.66rem}.cl-vision{gap:16px;display:grid}.cl-vision>div{gap:6px;display:grid}.cl-vision small{color:var(--faint);font-size:.74rem}@media (max-width:720px){.cl-scale{grid-template-columns:repeat(6,minmax(0,1fr))}.cl-palette{flex-wrap:wrap}}