:root{
  --cc-bg:#0f172a;
  --cc-fg:#ffffff;
  --cc-accent:#22c55e;
  --cc-muted:#94a3b8;
  --cc-modal-bg:#ffffff;
  --cc-shadow:0 10px 30px rgba(0,0,0,.25);
  --cc-radius:14px;
}
@media (prefers-color-scheme: dark){
  :root{ --cc-modal-bg:#0b1020; }
}
.cc-hidden{ display:none !important; }
.cc-banner{
  position:fixed; inset:auto 0 0 0;
  background:var(--cc-bg); color:var(--cc-fg);
  z-index:2147483000; padding:16px;
  box-shadow:var(--cc-shadow);
  font:14px/1.45 system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
}
.cc-container{ max-width:1100px; margin:0 auto; display:flex; gap:16px; align-items:center; }
.cc-text{ flex:1; }
.cc-actions{ display:flex; gap:8px; flex-wrap:wrap; }
.cc-btn{
  appearance:none; border:0; border-radius:999px; padding:10px 16px;
  font-weight:600; cursor:pointer;
}
.cc-btn-primary{ background:var(--cc-accent); color:#04210f; }
.cc-btn-secondary{ background:#1f2937; color:var(--cc-fg); }
.cc-link{ color:#a7f3d0; text-decoration:underline; }
.cc-modal-backdrop{
  position:fixed; inset:0; background:rgba(3,6,23,.6);
  z-index:2147483001; display:flex; align-items:center; justify-content:center;
  padding:24px;
}
.cc-modal{ width:min(720px, 100%); background:var(--cc-modal-bg); color:#e5e7eb;
  border-radius:var(--cc-radius); box-shadow:var(--cc-shadow); overflow:hidden; }
.cc-modal header, .cc-modal footer{ padding:16px 20px; background:rgba(255,255,255,.04); }
.cc-modal main{ padding:20px; color:#e2e8f0; }
.cc-title{ margin:0; font-size:18px; color:#fff; }
.cc-grid{ display:grid; grid-template-columns:1fr auto; gap:12px 16px; align-items:center; }
.cc-chip{
  display:inline-flex; align-items:center; gap:8px; border:1px solid #334155;
  padding:8px 12px; border-radius:999px; background:rgba(255,255,255,.02);
}
.cc-desc{ color:var(--cc-muted); font-size:13px; margin-top:4px; }
.cc-switch{
  appearance:none; width:44px; height:26px; background:#334155; border-radius:999px; position:relative; outline:none; cursor:pointer;
}
.cc-switch:checked{ background:var(--cc-accent); }
.cc-switch::after{
  content:""; position:absolute; width:20px; height:20px; border-radius:50%; background:#fff; top:3px; left:3px; transition:left .2s;
}
.cc-switch:checked::after{ left:21px; }
.cc-switch:disabled{ opacity:.6; cursor:not-allowed; }
.cc-btn-ghost{ background:transparent; color:#e2e8f0; border:1px solid #334155; }
.visually-hidden{
  position:absolute!important; height:1px;width:1px;overflow:hidden;clip:rect(1px,1px,1px,1px);
  white-space:nowrap; border:0; padding:0; margin:-1px;
}