.font-pairings-studio>.creative-body{grid-template-columns:minmax(255px,.48fr) minmax(0,1fr)}
.font-pairing-choices{border:0;padding:0;margin:0;min-width:0;display:grid;gap:9px}
.font-pairing-legend{padding:0;margin:0 0 12px;font-size:15px;line-height:1.4;font-weight:700;color:#365c7c}
.font-pairing-choice{position:relative;display:flex;align-items:flex-start;gap:10px;min-width:0;min-height:96px;padding:11px 35px 11px 11px;box-sizing:border-box;border:1px solid #cbddea;border-radius:8px;background:#fff;cursor:pointer;transition:border-color .16s,background-color .16s;overflow:hidden}
.font-pairing-choice:has(input:checked){border-color:#356be6;box-shadow:inset 0 0 0 1px #356be6;background:#f1f6ff}
.font-pairing-choice:has(input:focus-visible){outline:3px solid #356be6;outline-offset:3px}
.font-pairing-choice:hover{border-color:#739de0}
.font-pairings-studio .font-pairing-choice>input[type=radio]{flex:none;accent-color:#356be6;appearance:auto;margin:3px 0 0;padding:0;border:0;border-radius:50%;background:transparent;min-height:16px;width:16px;height:16px}
.font-pairing-card-copy{display:flex;flex-direction:column;min-width:0;gap:5px}
.font-pairing-name{font-size:13px;line-height:1.3;font-weight:700;color:#365c7c}
.font-pairing-heading{font-size:20px;font-weight:700;line-height:1.25;color:#18324c;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}
.font-pairing-body{font-size:13px;font-weight:400;line-height:1.35;color:#4a637b;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}
.font-pairing-check{position:absolute;right:9px;top:11px;display:grid;place-items:center;width:18px;height:18px;border-radius:50%;background:#356be6;color:#fff;opacity:0}
.font-pairing-check>.ui-icon{width:13px;height:13px}
.font-pairing-choice:has(input:checked) .font-pairing-check{opacity:1}
.font-pairing-choice:has(input:disabled){cursor:wait;opacity:.7}
.font-pairing-versions{display:flex;align-items:center;border:1px solid #aac8ec;border-radius:7px;overflow:hidden;flex:none;background:#fff}
.font-pairings-studio .font-pairing-versions>button{min-height:44px;border:0;border-radius:0;padding:8px 11px;font-size:13px}
.font-pairings-studio .font-pairing-versions>button[aria-pressed=true]{background:#e0ecff;color:#1659c7}
.font-pairing-override-note{margin:0;font-size:13px;line-height:1.4;color:#55738b}
.font-pairing-launch{width:100%;display:flex;align-items:center;gap:9px;min-height:46px;text-align:left}
.font-pairing-launch>.font-pairing-aa{font-weight:700;font-size:20px;line-height:1;color:#356be6;flex:none}
.font-pairing-launch>strong{margin-left:auto;font-size:13px;font-weight:600;color:#55738b;min-width:0;overflow-wrap:anywhere}
.font-pairing-launch>.ui-icon{width:16px;height:16px;flex:none}
@media(max-width:760px){
  .font-pairings-studio>.creative-body{grid-template-columns:minmax(0,1fr)}
  .font-pairings-studio .composition-choices{max-height:34dvh;overflow:auto}
  .font-pairing-choices{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .font-pairing-legend{grid-column:1/-1}
  .font-pairing-choice{padding:10px 29px 10px 9px;min-height:92px;gap:7px}
  .font-pairing-heading{font-size:18px}.font-pairing-body{font-size:12px}
  .font-pairing-check{right:6px;top:12px;width:15px;height:15px}.font-pairing-check>.ui-icon{width:11px;height:11px}
  .font-pairings-studio .composition-preview-heading{flex-wrap:wrap}
}
@media(max-width:410px){
  .font-pairing-choices{grid-template-columns:1fr}
  .font-pairing-choice{min-height:88px}
  .font-pairings-studio .composition-preview-heading{flex-direction:row;gap:8px}
  .font-pairings-studio .composition-devices{align-self:auto}
  .font-pairings-studio .composition-devices>button,.font-pairings-studio .font-pairing-versions>button{padding:8px;font-size:12px}
}
@media(prefers-reduced-motion:reduce){.font-pairing-choice{transition:none}}
