
:root{
  --fam-ink:#142033;
  --fam-muted:#667085;
  --fam-bg:#ffffff;
  --fam-soft:#f7f8fa;
  --fam-border:#e6eaf0;
  --fam-primary:#102846;
  --fam-primary-hover:#0b1d34;
  --fam-accent:#e8b347;
  --fam-focus:#7aa7ff;
  --fam-shadow:0 10px 30px rgba(16,24,40,.14);
  --fam-radius:15px;
}

.fcc-backdrop{
  position:fixed;
  inset:0;
  background:rgba(15,23,42,.14);
  backdrop-filter:blur(1px);
  z-index:9998;
  display:none;
}
.fcc-backdrop.is-open{display:block;}

.fcc-banner{
  position:fixed;
  left:50%;
  bottom:16px;
  transform:translateX(-50%);
  z-index:9999;
  width:min(1040px, calc(100% - 30px));
  background:rgba(255,255,255,.98);
  color:var(--fam-ink);
  border:1px solid var(--fam-border);
  box-shadow:var(--fam-shadow);
  border-radius:var(--fam-radius);
  padding:12px 14px;
  display:none;
}
.fcc-banner.is-open{display:block;}

.fcc-banner__inner{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:16px;
  align-items:center;
}

.fcc-kicker{
  display:flex;
  align-items:center;
  gap:7px;
  margin-bottom:3px;
  font-weight:800;
  font-size:14px;
  line-height:1.2;
}
.fcc-icon{
  width:24px;
  height:24px;
  display:grid;
  place-items:center;
  border-radius:8px;
  background:rgba(232,179,71,.14);
  font-size:12px;
}
.fcc-copy{
  margin:0;
  color:var(--fam-muted);
  line-height:1.38;
  font-size:11px;
  max-width:650px;
}
.fcc-copy a,
.fcc-links a{
  color:var(--fam-primary);
  text-decoration:underline;
  text-underline-offset:2px;
}
.fcc-links{
  margin-top:4px;
  display:flex;
  flex-wrap:wrap;
  gap:9px;
  font-size:10px;
  color:var(--fam-muted);
}

.fcc-actions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:7px;
  margin-top:0;
}

.fcc-btn{
  appearance:none;
  border:1px solid var(--fam-border);
  background:#fff;
  color:var(--fam-ink);
  border-radius:999px;
  min-height:34px;
  padding:7px 13px;
  font:inherit;
  font-size:10.5px;
  font-weight:750;
  cursor:pointer;
  transition:.18s ease;
  white-space:nowrap;
}
.fcc-btn:hover{transform:translateY(-1px);}
.fcc-btn:focus-visible{
  outline:3px solid color-mix(in srgb, var(--fam-focus) 45%, transparent);
  outline-offset:2px;
}
.fcc-btn--primary{
  background:var(--fam-primary);
  color:#fff;
  border-color:var(--fam-primary);
  padding-left:16px;
  padding-right:16px;
}
.fcc-btn--primary:hover{background:var(--fam-primary-hover);}
.fcc-btn--ghost{background:var(--fam-soft);}

.fcc-modal{
  position:fixed;
  z-index:10000;
  top:50%;
  left:50%;
  transform:translate(-50%,-50%) scale(.98);
  width:min(620px, calc(100% - 28px));
  max-height:min(720px, calc(100vh - 40px));
  overflow:auto;
  display:none;
  background:#fff;
  color:var(--fam-ink);
  border:1px solid var(--fam-border);
  border-radius:22px;
  box-shadow:var(--fam-shadow);
}
.fcc-modal.is-open{
  display:block;
  animation:fccIn .16s ease forwards;
}
@keyframes fccIn{to{transform:translate(-50%,-50%) scale(1);}}

.fcc-modal__head{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:16px;
  padding:20px 20px 14px;
  border-bottom:1px solid var(--fam-border);
}
.fcc-modal__head h2{
  margin:0 0 5px;
  font-size:21px;
}
.fcc-modal__head p{
  margin:0;
  color:var(--fam-muted);
  font-size:13px;
  line-height:1.5;
}
.fcc-close{
  border:0;
  background:var(--fam-soft);
  width:34px;
  height:34px;
  border-radius:50%;
  font-size:20px;
  cursor:pointer;
}
.fcc-modal__body{padding:8px 20px 3px;}
.fcc-row{
  display:grid;
  grid-template-columns:1fr auto;
  gap:18px;
  padding:15px 0;
  border-bottom:1px solid var(--fam-border);
}
.fcc-row:last-child{border-bottom:0;}
.fcc-row h3{
  margin:0 0 4px;
  font-size:14px;
}
.fcc-row p{
  margin:0;
  color:var(--fam-muted);
  line-height:1.45;
  font-size:12px;
}
.fcc-always{
  font-size:11px;
  font-weight:800;
  color:var(--fam-primary);
  background:rgba(232,179,71,.14);
  border-radius:999px;
  padding:6px 9px;
  align-self:start;
}
.fcc-switch{
  position:relative;
  width:46px;
  height:26px;
  display:inline-block;
}
.fcc-switch input{
  opacity:0;
  width:0;
  height:0;
}
.fcc-slider{
  position:absolute;
  cursor:pointer;
  inset:0;
  background:#cbd5e1;
  border-radius:999px;
  transition:.2s;
}
.fcc-slider:before{
  content:"";
  position:absolute;
  height:20px;
  width:20px;
  left:3px;
  top:3px;
  background:white;
  border-radius:50%;
  transition:.2s;
  box-shadow:0 1px 3px rgba(0,0,0,.25);
}
.fcc-switch input:checked + .fcc-slider{background:var(--fam-primary);}
.fcc-switch input:checked + .fcc-slider:before{transform:translateX(20px);}

.fcc-modal__foot{
  display:flex;
  justify-content:flex-end;
  flex-wrap:wrap;
  gap:9px;
  padding:15px 20px 20px;
  border-top:1px solid var(--fam-border);
}

.fcc-settings-link{
  border:0;
  background:transparent;
  color:inherit;
  padding:0;
  font:inherit;
  text-decoration:underline;
  text-underline-offset:2px;
  cursor:pointer;
}

@media (max-width:900px){
  .fcc-banner{
    width:min(760px, calc(100% - 24px));
    padding:12px;
  }
  .fcc-banner__inner{
    grid-template-columns:1fr;
    gap:9px;
  }
  .fcc-actions{
    justify-content:flex-start;
    flex-wrap:wrap;
  }
}

@media (max-width:600px){
  .fcc-banner{
    left:10px;
    right:10px;
    bottom:10px;
    transform:none;
    width:auto;
    padding:12px;
    border-radius:14px;
  }
  .fcc-banner__inner{display:block;}
  .fcc-kicker{
    font-size:13px;
    margin-bottom:3px;
  }
  .fcc-copy{
    font-size:10.8px;
    line-height:1.35;
  }
  .fcc-links{
    font-size:10px;
    margin-top:4px;
  }
  .fcc-actions{
    display:grid;
    grid-template-columns:1fr 1fr 1fr;
    gap:6px;
    margin-top:9px;
  }
  .fcc-btn{
    min-height:32px;
    padding:6px 7px;
    font-size:9.5px;
  }
  .fcc-btn--primary{
    padding-left:7px;
    padding-right:7px;
  }
  .fcc-modal__head,
  .fcc-modal__body,
  .fcc-modal__foot{
    padding-left:16px;
    padding-right:16px;
  }
  .fcc-modal__foot{
    display:grid;
    grid-template-columns:1fr;
  }
}
