:root { --radius-lg:22px; --radius-md:16px; --radius-sm:12px;
  --elev-1:0 6px 20px rgba(0,0,0,.25); --elev-2:0 10px 28px rgba(0,0,0,.35);
  --glass:rgba(255,255,255,.04); --glass-2:rgba(255,255,255,.06); }
html,body{ background:var(--cor-fundo,#0f0f10); color:var(--cor-texto,#eaeaea);
  font-family:var(--fonte-base,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif); }
.top-nav{ position:sticky; top:0; z-index:50; backdrop-filter:blur(10px);
  background:color-mix(in srgb, var(--cor-secundaria,#121212) 70%, transparent);
  border-bottom:1px solid rgba(255,255,255,.06); }
.top-nav .nav-container{ max-width:1280px; margin:0 auto; padding:14px 20px; display:flex; gap:16px; align-items:center; }
/* Container com os links (versão desktop) */
.top-nav .links{
    display:flex;
    gap:16px;
    align-items:center;
    justify-content:center;
    flex-wrap:wrap;
}

.top-nav .brand{ display:flex; align-items:center; gap:10px; text-decoration:none; color:var(--cor-texto); margin-right:auto; }
.top-nav a{ color:#d8d8d8; text-decoration:none; padding:10px 14px; border-radius:var(--radius-sm); transition:transform .15s, background-color .2s, color .2s; }
.top-nav a:hover{ background:var(--glass-2); color:#fff; transform:translateY(-1px); }
.header-main{ max-width:1280px; margin:32px auto 0; padding:0 20px 8px; display:flex; align-items:center; gap:18px; }
.site-logo{ height:56px; width:auto; filter:drop-shadow(0 4px 12px rgba(0,0,0,.35)); }
.header-main h1{ font-size:clamp(28px,2.6vw,44px); font-weight:700; letter-spacing:.3px; }
#week-selector{ max-width:680px; margin:18px auto 12px; padding:8px; display:grid; grid-template-columns:1fr auto 1fr; gap:10px; align-items:center; background:var(--glass); border:1px solid rgba(255,255,255,.06); border-radius: var(--radius-md); box-shadow:var(--elev-1); }
#week-selector button{ background:var(--cor-primaria,#00bcd4); color:#0c0c0c; font-weight:600; padding:10px 16px; border-radius:var(--radius-sm); border:none; cursor:pointer; transition:transform .12s, filter .2s; }
#week-selector button:hover{ transform:translateY(-1px); filter:brightness(1.05); }
#current-week-display{ text-align:center; opacity:.9; font-weight:600; }
#schedule-grid{ max-width:1376px; margin:24px auto; padding:0 20px 60px; display:grid; gap:22px; grid-template-columns: repeat(auto-fill, minmax(280px,1fr)); }
.card{ background:linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.03)); border:1px solid rgba(255,255,255,.08); border-radius:var(--radius-lg); box-shadow:var(--elev-2); overflow:hidden; transition:transform .18s, box-shadow .2s, border-color .2s; }
.card:hover{ transform:translateY(-2px); border-color:rgba(255,255,255,.14); }
.card .poster{ aspect-ratio:16/9; background:#202020; }
.card .content{ padding:16px 18px 18px; }
.card .title{ font-size:1.05rem; font-weight:650; margin-bottom:8px; }
.card .meta{ font-size:.92rem; opacity:.8; display:flex; gap:12px; flex-wrap:wrap; }
.loading{ position:relative; min-height:160px; }
.loading .loader{ position:absolute; inset:0; margin:auto; width:48px; height:48px; border:4px solid rgba(255,255,255,.14); border-top-color:var(--cor-primaria,#00bcd4); border-radius:999px; animation:spin 1s linear infinite; }
@keyframes spin{ to{ transform:rotate(360deg);} }
.filters-bar{ max-width:1280px; margin:18px auto; padding:10px; display:flex; align-items:center; gap:12px; flex-wrap:wrap; background:var(--glass); border:1px solid rgba(255,255,255,.06); border-radius: var(--radius-md); }
.input-search{ flex:1 1 320px; background:#0f0f0f; border:1px solid #2a2a2a; border-radius: var(--radius-sm); padding:12px 14px; color:var(--cor-texto); }
.chips{ display:flex; gap:8px; flex-wrap:wrap; }
.chip{ padding:8px 14px; border-radius:999px; border:1px solid rgba(255,255,255,.12); background:#181818; color:#e8e8e8; cursor:pointer; font-size:.92rem; transition:background .2s, border-color .2s, transform .1s; }
.chip:hover{ transform:translateY(-1px); }
.chip.active{ background:color-mix(in srgb, var(--cor-primaria) 22%, #181818); border-color:var(--cor-primaria); color:#fff; }
#watched-grid{ max-width:1400px; margin:10px auto 80px; padding:0 12px; display:grid; gap:22px; grid-template-columns: repeat(auto-fill, minmax(240px,1fr)); }
.watched-item{ background:#1a1a1a; border:1px solid #2a2a2a; border-radius:var(--radius-lg); overflow:hidden; box-shadow:var(--elev-1); }
.watched-item .poster{ aspect-ratio:2/3; background:#242424; }
.watched-item .body{ padding:14px; }
.watched-item .title{ font-weight:650; margin-bottom:6px; }
.watched-item .sub{ opacity:.8; font-size:.92rem; }
footer{ border-top:1px solid rgba(255,255,255,.06); padding:24px 18px; opacity:.9; text-align:center; }
footer a{ color:#cfcfcf; text-decoration:none; }
footer a:hover{ color:#fff; }


:root[data-theme="light"]{ --cor-fundo:#f6f7f9; --cor-secundaria:#ffffff; --cor-texto:#0e0f12; }
:root[data-theme="light"] .top-nav{ background:color-mix(in srgb, var(--cor-secundaria) 92%, transparent); border-bottom-color:rgba(0,0,0,.08); }
:root[data-theme="light"] .card, :root[data-theme="light"] .watched-item{ background:linear-gradient(180deg,rgba(0,0,0,.03),rgba(0,0,0,.02)); border-color:rgba(0,0,0,.08); }
:root[data-theme="light"] .filters-bar{ background:rgba(0,0,0,.04); border-color:rgba(0,0,0,.08); }
:root[data-theme="light"] .chip{ background:#f1f3f5; color:#222; border-color:rgba(0,0,0,.12); }
.top-nav .nav-actions{ display:flex; gap:8px; align-items:center; }
.theme-toggle,.burger{ border:1px solid rgba(255,255,255,.12); padding:8px 10px; border-radius:12px; background:var(--glass); cursor:pointer; color:var(--cor-texto); display:inline-flex; align-items:center; gap:8px; }
:root[data-theme="light"] .theme-toggle,:root[data-theme="light"] .burger{ border-color:rgba(0,0,0,.12); background:rgba(0,0,0,.04); }
.burger{ display:none; }
@media (max-width:900px){ .top-nav .links{ display:none; } .burger{ display:inline-flex; } }
.mobile-panel{
    position:fixed;
    left:0;
    right:0;
    top:64px;
    background:color-mix(in srgb, var(--cor-secundaria,#121212) 95%, #000 5%);
    display:none;
    padding:14px 18px 18px;
    z-index:9999;
}
.mobile-panel.open{ display:block; }
.mobile-panel a{
    display:block;
    padding:12px 8px;
    border-radius:12px;
    color:var(--cor-texto,#fbe4e4);
    font-weight:600;
}
.mobile-panel a:hover{ background:var(--glass-2); }

.footer-socials{ display:flex; gap:16px; justify-content:center; margin-top:6px; }
.footer-socials a{ display:inline-flex; align-items:center; gap:8px; }


/* ===== Week selector — proporções e responsividade (v3) ===== */
#week-selector { grid-template-columns:auto 1fr auto; gap:12px; padding:8px 12px; border-radius:14px; }
#week-selector .btn-week { min-height:44px; padding:10px 14px; border-radius:12px; font-weight:600; font-size:.95rem; line-height:1; }
#current-week-display { font-weight:700; text-align:center; white-space:nowrap; font-size:clamp(1rem, 1.1vw + .6rem, 1.4rem); }
@media (max-width:768px){
  #week-selector { grid-template-columns:44px 1fr 44px; padding:6px 8px; }
  #week-selector .btn-week { min-width:44px; min-height:44px; padding:0; font-size:0; border-radius:12px; }
  #week-selector button:first-child::before,
  #week-selector button:last-child::before { display:inline-block; width:44px; line-height:44px; text-align:center; font-size:22px; color:#0c0c0c; content:''; }
  #week-selector button:first-child::before { content:'‹'; }
  #week-selector button:last-child::before { content:'›'; }
  #current-week-display { white-space:normal; text-wrap:balance; font-size:clamp(1rem, 2.6vw + .4rem, 1.2rem); line-height:1.25; }
}


/* ===== v3.2 — Correções de layout ===== */
#schedule-grid { grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 22px; }
@media (max-width: 1200px) { #schedule-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (max-width: 900px)  { #schedule-grid { grid-template-columns: repeat(2, 1fr); } }

#background-overlay { position: fixed; inset: 0; z-index: 0; background-position: center; background-repeat: no-repeat; background-size: cover; pointer-events: none; }
.top-nav, header, main, footer { position: relative; z-index: 1; }

/* setas-only em todas as larguras */
#week-selector .btn-week { font-size: 0; min-width: 52px; min-height: 44px; padding: 0; display: inline-flex; align-items: center; justify-content: center; line-height: 1; }
#week-selector #prev-week::before { content: '‹'; }
#week-selector #next-week::before { content: '›'; }
#week-selector .btn-week::before { font-size: 22px; line-height: 1; color: #0c0c0c; }
@media (min-width: 1200px) { #week-selector .btn-week { min-width: 56px; min-height: 48px; } #week-selector .btn-week::before { font-size: 24px; } }