.br-cpt{max-width:44rem;margin:0 auto}.br-cpt__controls{display:grid;grid-template-columns:1fr;gap:var(--br-space-md);margin-bottom:var(--br-space-lg);padding:var(--br-space-md);background-color:var(--br-color-bg-light);border:1px solid var(--br-color-border);border-radius:var(--br-radius)}@media (min-width:640px){.br-cpt__controls{grid-template-columns:repeat(3,1fr)}}.br-cpt__field{display:flex;flex-direction:column;gap:var(--br-space-xs);min-width:0}.br-cpt__label{font-size:var(--br-text-xs);font-weight:600;color:var(--br-color-text-sub)}.br-cpt__input-row{display:flex;align-items:center;gap:var(--br-space-xs)}.br-cpt__swatch{width:2.5rem;height:2.5rem;padding:0;border:1px solid var(--br-color-border);border-radius:var(--br-radius);cursor:pointer;background:0 0}.br-cpt__text{flex:1 1 0;min-width:0;width:100%;min-height:var(--br-tap-min);padding:var(--br-space-xs) var(--br-space-sm);font-family:"Courier New",Courier,monospace;font-size:var(--br-text-sm);background-color:var(--br-color-surface);border:1px solid var(--br-color-border);border-radius:var(--br-radius);color:var(--br-color-text);text-transform:uppercase}.br-cpt__text:focus-visible{outline:2px solid var(--br-color-accent);outline-offset:2px}.br-cpt__contrast{display:grid;grid-template-columns:1fr;gap:var(--br-space-sm);margin-bottom:var(--br-space-lg)}@media (min-width:640px){.br-cpt__contrast{grid-template-columns:1fr 1fr}}.br-cpt__contrast-item{display:flex;align-items:center;justify-content:space-between;gap:var(--br-space-sm);padding:var(--br-space-sm) var(--br-space-md);background-color:var(--br-color-surface);border:1px solid var(--br-color-border);border-radius:var(--br-radius)}.br-cpt__contrast-label{font-size:var(--br-text-xs);color:var(--br-color-text-sub)}.br-cpt__contrast-ratio{font-family:"Courier New",Courier,monospace;font-size:var(--br-text-md);font-weight:700;color:var(--br-color-text)}.br-cpt__contrast-badge{font-size:var(--br-text-xs);font-weight:700;padding:2px 6px;border-radius:3px;background-color:var(--br-color-bg-light);color:var(--br-color-text-sub)}.br-cpt__contrast-badge.is-aaa{background-color:#dcfce7;color:#15803d}.br-cpt__contrast-badge.is-aa{background-color:#fef9c3;color:#854d0e}.br-cpt__contrast-badge.is-fail{background-color:#fee2e2;color:#991b1b}.br-cpt__preview{padding:var(--br-space-xl);border:1px solid var(--br-color-border);border-radius:var(--br-radius);margin-bottom:var(--br-space-lg);transition:background-color .15s,color .15s}.br-cpt__preview-title{margin:0 0 var(--br-space-sm);font-size:var(--br-text-xl);font-weight:700}.br-cpt__preview-body{margin:0 0 var(--br-space-sm);font-size:var(--br-text-sm);line-height:1.7}.br-cpt__preview-link{text-decoration:underline;cursor:pointer}.br-cpt__preview-button{display:inline-block;padding:var(--br-space-xs) var(--br-space-md);border:none;border-radius:var(--br-radius);font-size:var(--br-text-sm);font-weight:600;cursor:pointer;font-family:inherit;margin-top:var(--br-space-sm)}.br-cpt__code{position:relative;background-color:var(--br-color-bg-light);border:1px solid var(--br-color-border);border-radius:var(--br-radius);padding:var(--br-space-md)}.br-cpt__code-block{font-family:"Courier New",Courier,monospace;font-size:var(--br-text-xs);color:var(--br-color-text);margin:var(--br-space-xs) 0 var(--br-space-sm);white-space:pre-wrap;word-break:break-all}