:root{
  --accent:#d8a300;          /* toasted yellow */
  --brand-red:#8b0000;       /* dark red */

  --text-main:#fff9d6;
  --text-dim:#cfc7a0;
  --bg-deep:#000;
  --panel-bg:rgba(0,0,0,.8);
  --panel-border:rgba(216,163,0,.6);
  --panel-glow:rgba(216,163,0,.35);
  --lang-border:rgba(216,163,0,.35);

  /* safe-area helpers para navegadores mobile com notch */
  --safe-area-inset-top: env(safe-area-inset-top, 0px);
  --safe-area-inset-right: env(safe-area-inset-right, 0px);
  --safe-area-inset-bottom: env(safe-area-inset-bottom, 0px);
  --safe-area-inset-left: env(safe-area-inset-left, 0px);
}

/* FULL LIGHT THEME */
html[data-theme="light"]{
  --text-main:#1c1a14;
  --text-dim:#3b3729;
  --bg-deep:#f7f3e7;
  --panel-bg:rgba(255,255,255,.92);
  --panel-border:rgba(216,163,0,.55);
  --panel-glow:rgba(216,163,0,.22);
  --lang-border:rgba(216,163,0,.45);
}

html,body{
  margin:0;
  padding:0;
  height:100%;
  overflow:hidden;
  background:var(--bg-deep);
  font-family:'Inter',system-ui,-apple-system,Roboto,sans-serif;
  color:var(--text-main);
  -webkit-tap-highlight-color: transparent;
  transition: background-color .35s ease;
}

/* Transições em elementos interativos / painéis */
button,
a,
.langBtn,
.donateBtn,
.iconBtn,
.actionBtn,
#popup,
#themeSwitch,
#controlsBar,
#donateBar {
  transition: color .25s ease,
              background-color .25s ease,
              border-color .25s ease,
              box-shadow .25s ease;
}

/* Focus visível – genérico */
button:focus-visible,
a:focus-visible{
  outline:2px solid var(--accent);
  outline-offset:2px;
}

/* remover outline “grosso” do X e pôr algo mais discreto */
#closePopup:focus-visible{
  outline:none;
  box-shadow:0 0 0 1px rgba(216,163,0,.6);
}

/* ===== HEADER ===== */
header{
  position:absolute;
  top:calc(26px + var(--safe-area-inset-top));
  width:100%;
  text-align:center;
  z-index:1200;
  cursor:default;
  user-select:none;
  pointer-events:auto;
  opacity:0;
  animation: fadeSlideIn 1s ease forwards;
}

#siteTitle{
  margin:0;
  font-family:'Playfair Display',serif;
  font-size:3rem;
  font-style:italic;
  font-weight:600;
  color:var(--brand-red);
  text-shadow:
    0 0 10px rgba(0,0,0,.9),
    0 3px 18px rgba(0,0,0,1);
}

/* Subtítulo sem overlap */
#tagline{
  position:absolute;
  top:calc(110px + var(--safe-area-inset-top));
  width:100%;
  text-align:center;
  font-size:.9rem;
  font-weight:500;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--text-dim);
  z-index:1190;
  text-shadow:
    0 0 6px rgba(0,0,0,.9),
    0 2px 10px rgba(0,0,0,.9);
  opacity:0;
  animation: fadeSlideIn 1s ease forwards .2s;
}

html[data-theme="light"] #siteTitle{
  color:#b02323;
  text-shadow:
    0 0 7px rgba(255,255,255,.8),
    0 2px 13px rgba(0,0,0,.25);
}

html[data-theme="light"] #tagline{
  color:#5e5230;
  text-shadow:
    0 0 4px rgba(255,255,255,.9),
    0 2px 9px rgba(0,0,0,.18);
}

/* Starfield canvas (dark mode) */
#starsCanvas{
  position:fixed;
  inset:0;
  z-index:0;
  pointer-events:none;
  opacity:1;
  background:radial-gradient(circle at top, rgba(255,255,255,0.02) 0, transparent 55%);
  transition: opacity .45s ease;
}
html[data-theme="light"] #starsCanvas{ opacity:0; }

#globeViz{
  position:absolute;
  inset:0;
  z-index:1;
  opacity:0;
  animation:fadeIn 1s forwards .4s;
}
@keyframes fadeIn{to{opacity:1;}}

/* Fade + slide-in genérico (header, tagline, barras) */
@keyframes fadeSlideIn {
  from {
    opacity: 0;
    transform: translateY(10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Initial fade-in overlay */
#fadeOverlay{
  position:fixed;
  inset:0;
  background:#000;
  opacity:0;
  z-index:3000;
  transition:opacity 1s ease;
  pointer-events:none;
}

/* Theme fade overlay – suaviza o crossfade dark/light */
#themeFade {
  position: fixed;
  inset: 0;
  background: #000;
  opacity: 0;
  pointer-events: none;
  transition: opacity .45s ease;
  z-index: 2500;
}

/* GRUPO base de botões com gloss translucido (igual ao popup) */
#themeSwitch,
#controlsBar,
#donateBar{
  background:linear-gradient(135deg, rgba(0,0,0,0.36), rgba(20,12,0,0.72));
  backdrop-filter:blur(18px) saturate(130%);
  -webkit-backdrop-filter:blur(18px) saturate(130%);
}
html[data-theme="light"] #themeSwitch,
html[data-theme="light"] #controlsBar,
html[data-theme="light"] #donateBar{
  background:linear-gradient(135deg, rgba(255,255,255,0.70), rgba(252,244,220,0.86));
}

/* THEME SWITCH + RANDOM (top-right) – grupo em pílula */
#themeSwitch{
  position:fixed;
  top:calc(14px + var(--safe-area-inset-top));
  right:calc(16px + var(--safe-area-inset-right));
  z-index:1300;
  display:flex;
  align-items:center;
  gap:.45rem;
  border:1px solid #c01624;
  padding:.3rem .6rem;
  border-radius:999px;
  box-shadow:0 0 12px var(--panel-glow);
  opacity:0;
  animation: fadeSlideIn 1s ease forwards .4s;
}

/* ícone de tema (lua/sol minimal com morph) */
#themeLabel{
  width:32px;
  height:32px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:var(--accent);
  flex-shrink:0;
  position:relative;
}
#themeLabel svg{
  width:24px;
  height:24px;
  display:block;
}

.theme-icon{
  position:absolute;
  inset:0;
  margin:auto;
  opacity:0;
  transform:scale(.6) rotate(-20deg);
  transition: opacity .35s ease, transform .35s ease;
}

/* estado dark -> lua visível */
html[data-theme="dark"] #themeLabel .icon-moon-min{
  opacity:1;
  transform:scale(1) rotate(0deg);
}
html[data-theme="dark"] #themeLabel .icon-sun-min{
  opacity:0;
  transform:scale(.6) rotate(20deg);
}

/* estado light -> sol visível */
html[data-theme="light"] #themeLabel .icon-sun-min{
  opacity:1;
  transform:scale(1) rotate(0deg);
}
html[data-theme="light"] #themeLabel .icon-moon-min{
  opacity:0;
  transform:scale(.6) rotate(-20deg);
}

.icon-sun-min circle{
  stroke:currentColor;
  stroke-width:1.8;
  fill:none;
}
.icon-moon-min path{
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}

/* Slider minimal */
.switch {
  position: relative;
  width: 48px;
  height: 24px;
  display:inline-block;
  flex-shrink:0;
}
.switch input { display:none; }

.slider {
  position:absolute;
  cursor:pointer;
  inset:0;
  background:rgba(150,150,150,.25);
  border-radius:999px;
}
html[data-theme="light"] .slider{
  background:rgba(0,0,0,.06);
}
.slider:before {
  content:"";
  position:absolute;
  height:18px;
  width:18px;
  left:3px;
  top:3px;
  background:#ffffff;
  border-radius:50%;
  transition:.2s;
  box-shadow:0 2px 4px rgba(0,0,0,.35);
}
input:checked + .slider {
  background:rgba(216,163,0,.35);
}
input:checked + .slider:before {
  transform: translateX(22px);
}

/* Randomizer button minimal */
.iconBtn{
  margin-left:.1rem;
  width:36px;
  height:36px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.18);
  background:transparent;
  color:var(--accent);
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  padding:0;
  box-shadow:none;
  touch-action: manipulation;
}
.iconBtn:hover{
  background:rgba(216,163,0,.16);
  color:var(--accent);
  border-color:var(--accent);
}
html[data-theme="light"] .iconBtn{
  border-color:rgba(0,0,0,.12);
  color:#b02323;
}

/* animação do dado ao clicar */
.iconBtn.is-rolling{
  animation: dice-roll 0.6s ease-in-out;
}
@keyframes dice-roll{
  0%   { transform: translateY(0) rotate(0deg); }
  20%  { transform: translateY(-2px) rotate(-12deg); }
  40%  { transform: translateY(1px) rotate(10deg); }
  60%  { transform: translateY(-1px) rotate(-6deg); }
  80%  { transform: translateY(0px) rotate(4deg); }
  100% { transform: translateY(0) rotate(0deg); }
}

/* ícone minimal de dado (SVG) */
.icon-die{
  width:24px;
  height:24px;
  stroke:currentColor;
  fill:none;
  stroke-width:1.6;
}
.icon-die rect{
  rx:3;
  ry:3;
}
.icon-die circle{
  fill:currentColor;
  stroke:none;
}

/* Language (bottom-right) – grupo em pílula */
#controlsBar{
  position:absolute;
  right:calc(20px + var(--safe-area-inset-right));
  bottom:calc(20px + var(--safe-area-inset-bottom));
  z-index:1300;
  display:flex;
  gap:.5rem;
  align-items:center;
  border:1px solid #c01624;
  border-radius:999px;
  padding:.4rem .5rem;
  box-shadow:0 0 12px var(--panel-glow);
  opacity:0;
  animation: fadeSlideIn 1s ease forwards .6s;
}

.langBtn{
  appearance:none;
  background:transparent;
  border:1px solid var(--lang-border);
  color:var(--text-dim);
  padding:.45rem .8rem;
  border-radius:999px;
  cursor:pointer;
  font-size:.8rem;
  font-weight:700;
  min-width:110px;
  text-align:center;
  touch-action: manipulation;
}
.langBtn:hover{
  background:rgba(216,163,0,.15);
  color:var(--text-main);
}
.langBtn.active{
  background:var(--accent);
  color:#000;
  border-color:var(--accent);
}
html[data-theme="light"] .langBtn{ color:#6b5b2a; }
html[data-theme="light"] .langBtn.active{ color:#000; }

/* Donate (bottom-left) – igual ao grupo de línguas */
#donateBar{
  position:absolute;
  left:calc(20px + var(--safe-area-inset-left));
  bottom:calc(20px + var(--safe-area-inset-bottom));
  z-index:1300;
  display:flex;
  align-items:center;
  gap:.5rem;                        /* igual ao controlsBar */
  border:1px solid #c01624;
  border-radius:999px;
  padding:.4rem .5rem;              /* igual ao controlsBar */
  box-shadow:0 0 12px var(--panel-glow);
  opacity:0;
  animation: fadeSlideIn 1s ease forwards .6s;

  /* mesmo “gloss” translúcido que os outros grupos */
  background:linear-gradient(135deg, rgba(0,0,0,0.36), rgba(20,12,0,0.72));
  backdrop-filter:blur(18px) saturate(130%);
  -webkit-backdrop-filter:blur(18px) saturate(130%);
}
html[data-theme="light"] #donateBar{
  background:linear-gradient(135deg, rgba(255,255,255,0.70), rgba(252,244,220,0.86));
}

/* Botão Support us – coerente com .langBtn mas em amarelo */
.donateBtn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  appearance:none;
  background:var(--accent);
  color:#000;
  border:1px solid transparent;
  border-radius:999px;
  box-sizing:border-box;
  padding:.45rem .8rem;             
  font-weight:700;
  font-size:.8rem;
  cursor:pointer;
  text-decoration:none;
  white-space:nowrap;
  line-height:1;
  min-width:110px;                  
  touch-action: manipulation;
}
.donateBtn:hover{
  background:#000;
  color:var(--accent);
  border-color:var(--accent);
}

/* “SaramagaBytes © 2025” */
#creditText{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:.45rem .8rem;
  border:none;                     /* remove o outline */
  border-radius:999px;
  font-size:.78rem;
  line-height:1;
  background:transparent;           /* sem fundo extra */
}
#creditText a {
  color: var(--text-dim) !important;
  text-decoration: none;
  transition: color .25s ease;
}
#creditText a:hover {
  color: #c01624 !important;
}
#creditText a:active {
  color: #d8a300 !important;
}

/* link Privacy & Cookies centro em baixo */
.legalLink{
  position:absolute;
  left:50%;
  transform:translateX(-50%);
  bottom:4px;
  z-index:1250;
  font-size:.7rem;
  color:var(--text-dim);
  text-decoration:none;
  opacity:0.85;
}
.legalLink:hover{
  text-decoration:underline;
  opacity:1;
}

/* POPUP – cinematic glass */
#popup{
  position:fixed;
  top:50%;
  left:50%;
  transform:translate(-50%,-46%) scale(.96);
  width:min(640px, 90vw);
  max-height:80vh;
  background:linear-gradient(135deg, rgba(0,0,0,0.36), rgba(20,12,0,0.72));
  color:var(--text-main);
  padding:1.1rem 1.2rem 1rem;
  border-radius:18px;
  box-shadow:0 24px 60px rgba(0,0,0,.85), 0 0 0 1px rgba(216,163,0,0.45);
  backdrop-filter:blur(22px) saturate(120%);
  -webkit-backdrop-filter:blur(22px) saturate(120%);
  z-index:1800;
  display:none;
  opacity:0;
  overflow-y:auto;
  overflow-x:hidden;
}

/* animação do popup */
@keyframes popupIn {
  from {
    opacity:0;
    transform:translate(-50%,-46%) scale(.96);
  }
  to {
    opacity:1;
    transform:translate(-50%,-50%) scale(1);
  }
}

#popup.show{
  display:flex;
  flex-direction:column;
  animation: popupIn .28s ease-out forwards;
}

#popupHeader{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom:.8rem;
}
#countryBlock{
  font-size:.85rem;
  line-height:1.3;
  font-weight:700;
  color:var(--accent);
  display:flex;
  align-items:center;
  gap:.45rem;
  letter-spacing:.08em;
  text-transform:uppercase;
}
#countryFlagImg{
  height:18px;
  width:auto;
  border-radius:3px;
  box-shadow:none;
}
#countryName{ font-size:.92rem; }

#closePopup{
  background:transparent;
  color:var(--text-dim);
  border:1px solid rgba(255,255,255,.18);
  font-size:1.05rem;
  width:1.9rem;
  height:1.9rem;
  border-radius:999px;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:0;
  box-shadow:none;
  touch-action: manipulation;
}
#closePopup span{
  display:block;
  line-height:1;
  transform: translateY(1px);
}
#closePopup:hover{
  background:var(--accent);
  color:#000;
  border-color:var(--accent);
}

/* Popup body */
#popupBody{
  display:flex;
  flex-direction:row;
  align-items:flex-start;
  gap:1rem;
  flex:1;
  min-height:0;
}

/* Poster – amarelo sempre, sem hover */
.posterCol{
  flex:0 0 210px;
  max-width:210px;
}
#moviePoster{
  width:100%;
  max-width:210px;
  border-radius:12px;
  box-shadow:none;
  border:2px solid rgba(216,163,0,.85);   /* sempre amarelo */
  box-sizing:border-box;
  display:block;
}

.infoCol{
  flex:1;
  min-width:0;
  display:flex;
  flex-direction:column;
  min-height:0;
}

#titleBlock{
  margin:0 0 .6rem;
  padding-bottom:.4rem;
  border-bottom:1px solid rgba(255,255,255,.08);
}
html[data-theme="light"] #titleBlock{
  border-bottom-color:rgba(0,0,0,.08);
}

#movieTitleOriginal{
  margin:0;
  font-size:1.15rem;
  line-height:1.3;
  color:var(--accent);
  font-weight:800;
  letter-spacing:.03em;
}
#movieTitleTranslated{
  margin:.18rem 0 0;
  font-size:.9rem;
  line-height:1.3;
  color:var(--text-main);
  opacity:.9;
}

.directorLine{
  font-size:.85rem;
  line-height:1.3;
  color:var(--text-main);
  font-weight:600;
  margin:0 0 .55rem;
  opacity:.95;
}
#overviewText{
  font-size:.9rem;
  line-height:1.55;
  color:var(--text-dim);
  margin:0;
  flex:1;
  overflow-y:auto;
  overflow-x:hidden;
  padding-right:.25rem;
}
#overviewText.loading{
  opacity:.8;
  font-style:italic;
}

/* Ações no popup */
.actionsRow{
  margin-top:auto;
  padding-top:.7rem;
  display:flex;
  flex-wrap:wrap;
  gap:.55rem;
}
.actionBtn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  background:var(--accent);
  color:#000;
  text-decoration:none;
  padding:.42rem .8rem;
  border-radius:999px;
  font-weight:500;
  font-size:.78rem;
  letter-spacing:.06em;
  text-transform:uppercase;
  cursor:pointer;
  border:1px solid transparent;
  box-sizing:border-box;
  box-shadow:none;
  touch-action: manipulation;
}
.actionBtn:hover{
  background:#000;
  color:var(--accent);
  border-color:var(--accent);
}

/* Letterboxd destaque */
#letterboxdBtn{
  background:#000;
  color:var(--accent);
  border-color:var(--accent);
}
#letterboxdBtn:hover{
  background:var(--accent);
  color:#000;
  border-color:var(--accent);
}

/* botão Another em vermelho */
#anotherBtn{
  background:transparent;
  color:#c01624;
  border-color:#c01624;
}
#anotherBtn:hover{
  background:#c01624;
  color:#000;
  border-color:#c01624;
}

/* Light theme popup */
html[data-theme="light"] #popup{
  background:linear-gradient(135deg, rgba(255,255,255,0.70), rgba(252,244,220,0.86));
  box-shadow:0 18px 40px rgba(0,0,0,.18), 0 0 0 1px rgba(216,163,0,.45);
  backdrop-filter:blur(130%);
  -webkit-backdrop-filter:blur(130%);
}
html[data-theme="light"] #overviewText{ color:#5a4c26; }
html[data-theme="light"] #closePopup{
  color:#7a6b2b;
  border-color:rgba(0,0,0,.08);
}
html[data-theme="light"] #closePopup:hover{
  background:var(--accent);
  color:#000;
  border-color:var(--accent);
}

/* Snow */
#snowOverlay{
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:2000;
  opacity:0;
  transition:opacity 0.9s ease-out;
}
#snowOverlay.show{ opacity:1; }

/* GRÃO DE PELÍCULA */
body::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:2;
  opacity:.18;
  mix-blend-mode:soft-light;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140' viewBox='0 0 140 140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='1.2' numOctaves='3' stitchTiles='noStitch'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='0.6'/%3E%3C/svg%3E");
  animation: grain 1.5s steps(2,end) infinite;
}
@keyframes grain{
  0%{ transform:translate(0,0); }
  25%{ transform:translate(-10px,5px); }
  50%{ transform:translate(5px,-10px); }
  75%{ transform:translate(-5px,10px); }
  100%{ transform:translate(0,0); }
}

/* ========================= */
/*        RESPONSIVE         */
/* ========================= */

@media (min-width: 1200px){
  header{
    top:32px;
  }
  #siteTitle{
    font-size:3.6rem;
  }
}

/* max 900px */
@media (max-width: 900px){
  #themeSwitch{ top:calc(12px + var(--safe-area-inset-top)); right:calc(12px + var(--safe-area-inset-right)); transform:scale(.9); }
  #controlsBar,#donateBar{ bottom:calc(14px + var(--safe-area-inset-bottom)); }
  #tagline{
    top:100px;
    font-size:.8rem;
    padding:0 .75rem;
  }
}

/* tablets / telemóveis médios */
@media (max-width: 720px){
  header{
    top:calc(52px + var(--safe-area-inset-top));
  }
  #siteTitle{
    font-size:2.4rem;
  }

  #tagline{
    top:calc(120px + var(--safe-area-inset-top));
    font-size:.8rem;
    padding:0 1rem;
  }

  #themeSwitch{
    top:calc(12px + var(--safe-area-inset-top));
    right:calc(12px + var(--safe-area-inset-right));
    transform:scale(.9);
  }

  #controlsBar, #donateBar{
    padding:.35rem .4rem;
    gap:.35rem;
  }
  .langBtn{
    padding:.35rem .7rem;
    min-width:auto;
    font-size:.78rem;
  }
  .donateBtn{
    padding:.35rem .65rem;
    font-size:.78rem;
  }
  #creditText{
    font-size:.7rem;
  }

  #popup{
    padding:0.9rem 0.9rem 0.8rem;
    border-radius:14px;
    width:94vw;
    max-height:78vh;
  }
  #popupBody{
    flex-direction:column;
  }
  .posterCol{
    align-self:center;
    flex:0 0 auto;
    max-width:70%;
  }
  #moviePoster{ max-width:100%; }
  .infoCol{ width:100%; }
  #movieTitleOriginal{ font-size:1.05rem; }
}

/* telemóveis pequenos */
@media (max-width: 480px){
  header{
    top:calc(60px + var(--safe-area-inset-top));
  }
  #siteTitle{
    font-size:2rem;
  }

  #tagline{
    top:calc(130px + var(--safe-area-inset-top));
    font-size:.75rem;
    padding:0 .9rem;
  }

  #themeSwitch{
    top:calc(10px + var(--safe-area-inset-top));
    right:calc(10px + var(--safe-area-inset-right));
    transform:scale(.8);
  }

  /* barras de baixo compactas, não full width */
  #donateBar{
    left:10px;
    right:auto;
    bottom:calc(18px + var(--safe-area-inset-bottom));
    transform:none;
  }

  #controlsBar{
    right:10px;
    left:auto;
    bottom:calc(18px + var(--safe-area-inset-bottom));
    transform:none;
    justify-content:center;
  }

  .langBtn{
    padding:.32rem .6rem;
    font-size:.75rem;
  }
  .donateBtn{
    padding:.35rem .6rem;
    font-size:.75rem;
  }

  #popup{
    width:96vw;
    max-height:80vh;
    padding:0.8rem 0.8rem 0.7rem;
  }
  #overviewText{
    font-size:.85rem;
  }
}

/* stack mobile controls/donate em ecrãs estreitos */
@media (max-width: 640px){
  #donateBar,
  #controlsBar{
    left:50%;
    right:auto;
    transform:translateX(-50%);
    width:calc(100vw - 40px - var(--safe-area-inset-left) - var(--safe-area-inset-right));
    max-width:420px;
    justify-content:center;
  }

  #donateBar{
    bottom:calc(110px + var(--safe-area-inset-bottom));
    flex-direction:column;
    align-items:stretch;
    gap:.45rem;
    text-align:center;
  }

  #donateBar .donateBtn{
    width:100%;
    max-width:100%;
  }

  #creditText{
    display:block;
    width:100%;
    font-size:.72rem;
  }

  #controlsBar{
    bottom:calc(20px + var(--safe-area-inset-bottom));
    flex-wrap:wrap;
    align-items:stretch;
    padding:.5rem .6rem;
    gap:.4rem;
  }

  .langBtn{
    flex:1 1 45%;
    min-width:120px;
    max-width:calc(50% - .4rem);
    justify-content:center;
  }
}

/* COOKIE BANNER – pill gloss translucido */
#cookieBanner{
  position:fixed;
  left:50%;
  transform:translateX(-50%);
  bottom:calc(18px + var(--safe-area-inset-bottom));
  z-index:2100;
  display:flex;
  align-items:center;
  gap:.6rem;
  max-width:520px;
  padding:.6rem .9rem;
  border-radius:999px;
  border:1px solid rgba(192,22,36,.9);
  box-shadow:0 14px 30px rgba(0,0,0,.85), 0 0 0 1px rgba(216,163,0,.25);
  background:linear-gradient(135deg, rgba(0,0,0,0.40), rgba(20,12,0,0.80));
  backdrop-filter:blur(18px) saturate(130%);
  -webkit-backdrop-filter:blur(18px) saturate(130%);
  color:var(--text-main);
  font-size:.8rem;
  line-height:1.4;
  opacity:0;
  pointer-events:none;
  transition:opacity .35s ease, transform .35s ease;
}
html[data-theme="light"] #cookieBanner{
  background:linear-gradient(135deg, rgba(255,255,255,0.90), rgba(252,244,220,0.96));
  box-shadow:0 14px 30px rgba(0,0,0,.25), 0 0 0 1px rgba(216,163,0,.35);
}

#cookieBanner.show{
  opacity:1;
  pointer-events:auto;
  transform:translateX(-50%) translateY(0);
}

.cookie-text{
  flex:1;
  color:var(--text-dim);
}

.cookie-actions{
  display:flex;
  align-items:center;
  gap:.4rem;
}

.cookieBtn{
  appearance:none;
  border-radius:999px;
  border:1px solid var(--lang-border);
  padding:.35rem .8rem;
  font-size:.75rem;
  font-weight:600;
  letter-spacing:.06em;
  text-transform:uppercase;
  background:transparent;
  color:var(--text-dim);
  cursor:pointer;
  white-space:nowrap;
}
.cookieBtn.primary{
  background:var(--accent);
  color:#000;
  border-color:var(--accent);
}
.cookieBtn.primary:hover{
  background:#000;
  color:var(--accent);
  border-color:var(--accent);
}
.cookieBtn:not(.primary):hover{
  background:rgba(216,163,0,.15);
  color:var(--text-main);
}

/* botão banner focus */
.cookieBtn:focus-visible{
  outline:2px solid var(--accent);
  outline-offset:2px;
}

/* Em mobile muito pequeno, o banner vira “bloco” em vez de pílula longa */
@media (max-width: 480px){
  #cookieBanner{
    bottom:calc(70px + var(--safe-area-inset-bottom));
    max-width:90vw;
    border-radius:18px;
    flex-direction:column;
    align-items:flex-start;
  }
  .cookie-actions{
    align-self:flex-end;
  }
}

/* COOKIE POPUP – pill gloss translúcido em baixo */
#cookieBanner{
  position:fixed;
  left:50%;
  transform:translateX(-50%) translateY(10px);
  bottom:calc(22px + var(--safe-area-inset-bottom));
  z-index:2100;

  display:flex;
  flex-direction:column;
  align-items:center;          /* centra conteúdo horizontalmente */
  justify-content:center;
  gap:.7rem;

  max-width:560px;
  padding:1rem 1.4rem 1rem;    /* mais respiro */
  border-radius:999px;
  border:1px solid rgba(192,22,36,.9);
  box-shadow:0 14px 30px rgba(0,0,0,.85), 0 0 0 1px rgba(216,163,0,.25);
  background:linear-gradient(135deg, rgba(0,0,0,0.40), rgba(20,12,0,0.80));
  backdrop-filter:blur(18px) saturate(130%);
  -webkit-backdrop-filter:blur(18px) saturate(130%);
  color:var(--text-main);
  font-size:.85rem;
  line-height:1.5;

  opacity:0;
  pointer-events:none;
  transition:opacity .35s ease, transform .35s ease;
}
html[data-theme="light"] #cookieBanner{
  background:linear-gradient(135deg, rgba(255,255,255,0.90), rgba(252,244,220,0.96));
  box-shadow:0 14px 30px rgba(0,0,0,.25), 0 0 0 1px rgba(216,163,0,.35);
}

#cookieBanner.show{
  opacity:1;
  pointer-events:auto;
  transform:translateX(-50%) translateY(0);
}

/* texto em cima, centrado, com respiro */
.cookie-text{
  margin:0;
  text-align:center;
  color:var(--text-dim);
  padding:0 .6rem;
}

/* link dentro do texto */
.cookie-text a{
  color:var(--accent);
  text-decoration:underline;
  font-weight:500;
}
.cookie-text a:hover{
  text-decoration:none;
}

.cookie-link-wrap {
  display:block;
  margin-top:.4rem;            /* espaçamento entre texto e link */
}

.cookie-link-wrap a {
  color:var(--accent);
  text-decoration:underline;
  font-weight:500;
  font-size:.8rem;
}

.cookie-link-wrap a:hover {
  text-decoration:none;
}

/* botões centrados horizontalmente */
.cookie-actions{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:.6rem;
  flex-wrap:wrap;
}

.cookieBtn{
  appearance:none;
  border-radius:999px;
  border:1px solid var(--lang-border);
  padding:.4rem 1rem;
  font-size:.8rem;
  font-weight:600;
  letter-spacing:.06em;
  text-transform:uppercase;
  background:transparent;
  color:var(--text-dim);
  cursor:pointer;
  white-space:nowrap;
  box-shadow:none;
  transition: background .15s ease, color .15s ease, border-color .15s ease;
}
.cookieBtn.primary{
  background:var(--accent);
  color:#000;
  border-color:var(--accent);
}
.cookieBtn.primary:hover{
  background:#000;
  color:var(--accent);
  border-color:var(--accent);
}
.cookieBtn:not(.primary):hover{
  background:rgba(216,163,0,.15);
  color:var(--text-main);
}

.cookieBtn:focus-visible{
  outline:2px solid var(--accent);
  outline-offset:2px;
}

/* mobile: cartão, largura total */
@media (max-width: 480px){
  #cookieBanner{
    bottom:calc(70px + var(--safe-area-inset-bottom));
    max-width:92vw;
    border-radius:18px;
    padding:1rem;
  }
}