:root{
  --cc-bg:#fff; --cc-fg:#1a1a1a; --cc-muted:#5c5c5c; --cc-line:#e2e2e2;
  --cc-accent:#0b5fff; --cc-accent-fg:#fff; --cc-radius:10px;
}
.cc-banner,.cc-modal{font:15px/1.5 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:var(--cc-fg);box-sizing:border-box}
.cc-banner *,.cc-modal *{box-sizing:inherit}

.cc-banner{
  position:fixed;inset:auto 0 0 0;z-index:9999;background:var(--cc-bg);
  border-top:1px solid var(--cc-line);box-shadow:0 -4px 24px rgba(0,0,0,.12);
  padding:20px;display:flex;gap:20px;align-items:center;flex-wrap:wrap;justify-content:center
}
.cc-banner__text{flex:1 1 420px;min-width:260px;margin:0}
.cc-banner__text a{color:var(--cc-accent)}
.cc-banner__actions{display:flex;gap:10px;flex-wrap:wrap}

.cc-btn{
  font:inherit;font-weight:600;padding:10px 18px;border-radius:var(--cc-radius);
  border:1px solid var(--cc-line);background:var(--cc-bg);color:var(--cc-fg);cursor:pointer;white-space:nowrap
}
.cc-btn:hover{background:#f5f5f5}
.cc-btn--primary{background:var(--cc-accent);border-color:var(--cc-accent);color:var(--cc-accent-fg)}
.cc-btn--primary:hover{filter:brightness(.92)}
.cc-btn:focus-visible{outline:2px solid var(--cc-accent);outline-offset:2px}

.cc-overlay{position:fixed;inset:0;z-index:10000;background:rgba(0,0,0,.5);display:flex;align-items:center;justify-content:center;padding:20px}
.cc-modal{background:var(--cc-bg);border-radius:14px;max-width:560px;width:100%;max-height:85vh;overflow:auto;padding:24px}
.cc-modal h2{margin:0 0 8px;font-size:20px}
.cc-modal__intro{margin:0 0 20px;color:var(--cc-muted)}
.cc-cat{border-top:1px solid var(--cc-line);padding:16px 0}
.cc-cat__head{display:flex;justify-content:space-between;align-items:center;gap:12px}
.cc-cat__head strong{font-size:15px}
.cc-cat__desc{margin:6px 0 0;color:var(--cc-muted);font-size:14px}
.cc-modal__actions{display:flex;gap:10px;flex-wrap:wrap;border-top:1px solid var(--cc-line);padding-top:18px;margin-top:4px}

.cc-switch{position:relative;display:inline-block;width:46px;height:26px;flex:0 0 auto}
.cc-switch input{position:absolute;opacity:0;width:100%;height:100%;margin:0;cursor:pointer}
.cc-switch span{position:absolute;inset:0;background:#c9c9c9;border-radius:999px;transition:.2s;pointer-events:none}
.cc-switch span::before{content:"";position:absolute;width:20px;height:20px;left:3px;top:3px;background:#fff;border-radius:50%;transition:.2s}
.cc-switch input:checked+span{background:var(--cc-accent)}
.cc-switch input:checked+span::before{transform:translateX(20px)}
.cc-switch input:disabled+span{opacity:.55}
.cc-switch input:focus-visible+span{outline:2px solid var(--cc-accent);outline-offset:2px}

@media (max-width:640px){
  .cc-banner{padding:16px}
  .cc-banner__actions{width:100%}
  .cc-banner__actions .cc-btn{flex:1 1 100%}
}
@media (prefers-color-scheme:dark){
  :root{--cc-bg:#1c1c1e;--cc-fg:#f2f2f2;--cc-muted:#a9a9ad;--cc-line:#3a3a3c}
  .cc-btn:hover{background:#2a2a2c}
}