.cc2-top{display:grid;grid-template-columns:160px 1fr;gap:1.5rem;align-items:center;margin-bottom:1.5rem;}
@media(max-width:520px){.cc2-top{grid-template-columns:1fr;}}
.cc2-swatch{width:160px;height:160px;border-radius:14px;border:1px solid var(--border,#e5e7eb);background:#E8472F;background-image:linear-gradient(45deg,#f0f0f0 25%,transparent 25%,transparent 75%,#f0f0f0 75%),linear-gradient(45deg,#f0f0f0 25%,transparent 25%,transparent 75%,#f0f0f0 75%);background-position:0 0,8px 8px;background-size:16px 16px;}
.cc2-picker-wrap{display:flex;flex-direction:column;gap:.75rem;}
.cc2-picker-label{font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--muted,#6b7280);margin-bottom:-.4rem;}
#cc2-picker{width:100%;height:50px;border:1.5px solid var(--border,#e5e7eb);border-radius:8px;cursor:pointer;background:none;}
.cc2-alpha-row{display:grid;grid-template-columns:60px 1fr 50px;gap:.75rem;align-items:center;}
.cc2-alpha-row label{font-size:.8125rem;font-weight:600;color:var(--text,#0D1B2A);}
#cc2-alpha{accent-color:var(--accent,#E8472F);}
#cc2-alpha-val{font-size:.8125rem;color:var(--muted,#6b7280);text-align:right;font-variant-numeric:tabular-nums;}
.cc2-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-bottom:1.5rem;}
@media(max-width:640px){.cc2-grid{grid-template-columns:1fr;}}
.cc2-field{display:flex;flex-direction:column;gap:.375rem;}
.cc2-field--full{grid-column:1 / -1;}
.cc2-field label{font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--muted,#6b7280);}
.cc2-input-row{display:grid;grid-template-columns:1fr auto;gap:.5rem;}
.cc2-input-row input{padding:.625rem .875rem;border:1.5px solid var(--border,#e5e7eb);border-radius:8px;font-size:.9375rem;font-family:monospace;outline:none;transition:border-color .15s;width:100%;box-sizing:border-box;}
.cc2-input-row input:focus{border-color:var(--accent,#E8472F);}
.cc2-copy{padding:.5rem .875rem;background:var(--bg,#FFFFFF);border:1.5px solid var(--border,#e5e7eb);border-radius:8px;font-size:.75rem;font-weight:700;cursor:pointer;color:var(--text,#0D1B2A);transition:all .15s;}
.cc2-copy:hover{border-color:var(--accent,#E8472F);color:var(--accent,#E8472F);}
.cc2-copy--ok{background:#16a34a !important;color:#fff !important;border-color:#16a34a !important;}
.cc2-contrast{margin-top:1.5rem;padding-top:1.5rem;border-top:1px solid var(--border,#e5e7eb);}
.cc2-contrast-heading{font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--muted,#6b7280);margin-bottom:.75rem;}
.cc2-contrast-grid{display:grid;grid-template-columns:1fr 1fr;gap:.875rem;}
@media(max-width:520px){.cc2-contrast-grid{grid-template-columns:1fr;}}
.cc2-contrast-card{display:grid;grid-template-columns:1fr 100px;gap:1rem;align-items:center;padding:1rem;border-radius:10px;border:1px solid var(--border,#e5e7eb);}
.cc2-contrast-card--white{background:#fff;}
.cc2-contrast-card--black{background:#0D1B2A;color:#fff;}
.cc2-contrast-sample{font-size:1rem;font-weight:600;}
.cc2-contrast-info{font-size:.75rem;text-align:right;display:flex;flex-direction:column;gap:.2rem;}
.cc2-contrast-card--black .cc2-contrast-info{color:#fff;}
.cc2-contrast-ratio{font-family:monospace;font-size:.875rem;font-weight:700;}
.cc2-contrast-badge{display:inline-block;padding:.15rem .5rem;border-radius:5px;font-size:.7rem;font-weight:700;letter-spacing:.04em;align-self:flex-end;}
.cc2-contrast-badge--aaa{background:#16a34a;color:#fff;}
.cc2-contrast-badge--aa{background:#22c55e;color:#fff;}
.cc2-contrast-badge--aalg{background:#facc15;color:#78350f;}
.cc2-contrast-badge--fail{background:#dc2626;color:#fff;}

/* cache-buster: 2026-05-24T05:06:05Z */