.brand-prose :where(code):not(:where(pre code)):before,.brand-prose :where(code):not(:where(pre code)):after{content:none}.brand-prose .brand-variants{display:grid;grid-template-columns:1fr;gap:.75rem;margin:1.25rem 0 1.75rem;padding:0}@media(min-width:640px){.brand-prose .brand-variants{grid-template-columns:repeat(2,minmax(0,1fr))}.brand-prose .brand-variants .brand-variant--wide{grid-column:span 2}}.brand-prose .brand-variant{display:grid;grid-template-rows:auto 1fr;gap:0;border:1px solid var(--color-border-secondary);border-radius:.5rem;overflow:hidden;background:var(--color-bg-primary);text-decoration:none;color:inherit;transition:border-color .12s ease,box-shadow .12s ease}.brand-prose .brand-variant:hover{border-color:var(--color-text-tertiary);box-shadow:0 1px 3px #0000000d;text-decoration:none}.brand-prose .brand-variant__preview{display:flex;align-items:center;justify-content:center;min-height:120px;padding:1.25rem 1.5rem;background:var(--color-bg-secondary);color:var(--color-text-primary)}.brand-prose .brand-variant__preview--dark{background:#1e2a3a;color:#fff}.brand-prose .brand-variant__preview img,.brand-prose .brand-variant__preview svg{max-width:100%;max-height:72px;width:auto;height:auto;margin:0}.brand-prose .brand-variant--wide .brand-variant__preview img,.brand-prose .brand-variant--wide .brand-variant__preview svg{max-height:56px}.brand-prose .brand-variant__meta{display:grid;grid-template-columns:1fr;gap:.125rem;padding:.75rem 1rem .875rem}.brand-prose .brand-variant__meta strong{font-size:.95rem;line-height:1.2;color:var(--color-text-primary)}.brand-prose .brand-variant__meta code{font-size:.8rem;color:var(--color-text-secondary);background:transparent;padding:0;word-break:break-all}.brand-prose .brand-variant__meta em{font-style:normal;font-size:.8rem;color:var(--color-text-tertiary)}.brand-prose .brand-swatches{display:grid;grid-template-columns:1fr;gap:.75rem;margin:1.25rem 0 1.75rem;padding:0;list-style:none}@media(min-width:640px){.brand-prose .brand-swatches{grid-template-columns:repeat(2,minmax(0,1fr))}}.brand-prose .brand-swatch{position:relative;display:grid;grid-template-columns:2.75rem 1fr;grid-template-rows:auto auto;-moz-column-gap:.75rem;column-gap:.75rem;row-gap:.125rem;align-items:center;padding:.75rem;border:1px solid var(--color-border-secondary);border-radius:.5rem;background:var(--color-bg-primary);text-align:left;font:inherit;color:inherit;cursor:pointer;transition:border-color .12s ease,box-shadow .12s ease}.brand-prose .brand-swatch:hover{border-color:var(--color-text-tertiary);box-shadow:0 1px 3px #0000000d}.brand-prose .brand-swatch:focus-visible{outline:2px solid var(--color-focus-ring, #2563eb);outline-offset:2px}.brand-prose .brand-swatch__chip{grid-row:1 / span 2;width:2.75rem;height:2.75rem;border-radius:.375rem;display:block}.brand-prose .brand-swatch__chip--bordered{box-shadow:inset 0 0 0 1px var(--color-border-secondary)}.brand-prose .brand-swatch strong{font-size:.95rem;line-height:1.2;color:var(--color-text-primary)}.brand-prose .brand-swatch code{font-size:.85rem;color:var(--color-text-secondary);background:transparent;padding:0}.brand-prose .brand-swatch em{grid-column:2;font-style:normal;font-size:.8rem;color:var(--color-text-tertiary)}.brand-prose .brand-swatch__copied{position:absolute;top:.5rem;right:.5rem;display:inline-flex;align-items:center;gap:.25rem;padding:.125rem .5rem;border-radius:999px;background:#16a34a;color:#fff;font-size:.7rem;font-weight:600;line-height:1.2;opacity:0;transform:translateY(-4px);transition:opacity .12s ease,transform .12s ease;pointer-events:none}.brand-prose .brand-swatch__copied:before{content:"";display:inline-block;width:.55rem;height:.55rem;background:#fff;-webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'><path fill='black' d='M16.7 5.3a1 1 0 0 1 0 1.4l-8 8a1 1 0 0 1-1.4 0l-4-4a1 1 0 1 1 1.4-1.4L8 12.6l7.3-7.3a1 1 0 0 1 1.4 0Z'/></svg>") no-repeat center / contain;mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'><path fill='black' d='M16.7 5.3a1 1 0 0 1 0 1.4l-8 8a1 1 0 0 1-1.4 0l-4-4a1 1 0 1 1 1.4-1.4L8 12.6l7.3-7.3a1 1 0 0 1 1.4 0Z'/></svg>") no-repeat center / contain}.brand-prose .brand-swatch.is-copied .brand-swatch__copied{opacity:1;transform:translateY(0)}.brand-prose .brand-swatch.is-copied{border-color:#16a34a}
