/* ═══ Link2Page · Cookie consent banner & preferences ═══
   Consent-first (opt-in). No tracker runs before the visitor chooses.
   Self-contained styling; uses the shared design tokens (css/01-tokens.css).
   Load order matters — see docs/ARCHITECTURE.md */

/* ── Banner ── */
.cc-banner{
  position:fixed;left:1rem;right:1rem;bottom:1rem;z-index:5000;
  max-width:520px;margin:0 auto;
  background:var(--surface);
  border:1px solid var(--border2);
  border-radius:18px;
  box-shadow:0 20px 60px rgba(0,0,0,.28), 0 2px 8px rgba(0,0,0,.12);
  padding:1.25rem 1.35rem 1.15rem;
  font-family:var(--fb);
  color:var(--text);
  transform:translateY(140%);
  opacity:0;
  transition:transform .45s cubic-bezier(.22,1,.36,1), opacity .45s ease;
}
.cc-banner.cc-show{transform:translateY(0);opacity:1}
.cc-banner[hidden]{display:none}

.cc-head{display:flex;align-items:center;gap:10px;margin-bottom:.55rem}
.cc-ic{width:34px;height:34px;border-radius:10px;flex:none;display:inline-flex;align-items:center;justify-content:center;background:rgba(108,99,255,.12);color:var(--accent2)}
.cc-ic svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.cc-title{font-family:var(--fd);font-size:16px;font-weight:800;color:var(--text)}

.cc-text{font-size:13.5px;line-height:1.6;color:var(--text2);margin-bottom:1rem}
.cc-text a{color:var(--accent2);text-decoration:underline;text-underline-offset:2px}
html[data-theme="light"] .cc-text a{color:var(--accent2)}

.cc-actions{display:flex;flex-wrap:wrap;gap:.6rem}
.cc-btn{
  flex:1 1 auto;min-width:120px;
  font-family:var(--fb);font-size:14px;font-weight:700;
  padding:11px 14px;border-radius:11px;cursor:pointer;
  border:1px solid var(--border2);
  transition:all .18s ease;
}
.cc-btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.cc-btn-accept{background:var(--accent);color:#fff;border-color:var(--accent);box-shadow:0 0 26px rgba(108,99,255,.28)}
.cc-btn-accept:hover{transform:translateY(-1px);box-shadow:0 0 40px rgba(108,99,255,.42)}
.cc-btn-reject{background:transparent;color:var(--text)}
.cc-btn-reject:hover{background:var(--surface2);border-color:var(--border2)}
.cc-btn-prefs{flex:1 1 100%;background:transparent;color:var(--text2);border-color:transparent;text-decoration:underline;text-underline-offset:2px;font-weight:600;padding:6px;min-width:0}
.cc-btn-prefs:hover{color:var(--text)}

/* ── Preferences modal ── */
.cc-modal{
  position:fixed;inset:0;z-index:5001;
  display:none;align-items:center;justify-content:center;
  padding:1rem;
  background:rgba(4,6,12,.62);
  backdrop-filter:blur(4px);
}
.cc-modal.cc-open{display:flex}
.cc-modal[hidden]{display:none}
.cc-panel{
  width:100%;max-width:540px;max-height:88vh;overflow-y:auto;
  background:var(--surface);
  border:1px solid var(--border2);
  border-radius:20px;
  box-shadow:0 30px 80px rgba(0,0,0,.4);
  padding:1.6rem 1.6rem 1.4rem;
  font-family:var(--fb);color:var(--text);
}
.cc-panel-head{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;margin-bottom:.4rem}
.cc-panel-title{font-family:var(--fd);font-size:20px;font-weight:800}
.cc-close{background:transparent;border:none;color:var(--text2);cursor:pointer;padding:4px;border-radius:8px;display:inline-flex;flex:none}
.cc-close:hover{color:var(--text);background:var(--surface2)}
.cc-close:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.cc-close svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
.cc-panel-intro{font-size:13.5px;line-height:1.6;color:var(--text2);margin-bottom:1.2rem}
.cc-panel-intro a{color:var(--accent2);text-decoration:underline;text-underline-offset:2px}

.cc-cat{border:1px solid var(--border);border-radius:14px;padding:1rem 1.1rem;margin-bottom:.8rem;background:var(--surface2)}
.cc-cat-top{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:.35rem}
.cc-cat-name{font-size:15px;font-weight:700;color:var(--text)}
.cc-cat-desc{font-size:12.5px;line-height:1.55;color:var(--text2)}
.cc-cat-locked{font-size:12px;font-weight:700;color:var(--tag-green);white-space:nowrap}

.cc-panel-actions{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1.2rem}
.cc-panel-actions .cc-btn{flex:1 1 140px}

/* ── Reopen link (footer / floating) ── */
.cc-reopen{background:none;border:none;padding:0;margin:0;font:inherit;color:inherit;cursor:pointer;text-decoration:none}
.cc-reopen:hover{color:var(--accent2)}

@media (max-width:480px){
  .cc-banner{left:.6rem;right:.6rem;bottom:.6rem;padding:1.1rem 1.1rem 1rem;border-radius:16px}
  .cc-btn{min-width:0;flex:1 1 100%}
  .cc-actions{flex-direction:column}
}