/* CineDiário — estilos escopados em .cd-app */
@font-face{font-family:'FrauncesLogo';src:url('fonts/fraunces-logo.ttf') format('truetype');font-weight:normal;font-style:normal;font-display:swap}
.cd-app{
  --bg:#0e2430; --bg-2:#0b1d27; --surface:#153140; --surface-2:#1d3c4c;
  --border:rgba(232,213,183,.13); --border-strong:rgba(232,213,183,.24);
  --text:#e8d5b7; --muted:#9fb1b6; --gold:#f5b349; --gold-soft:#f7c67f; --red:#fc3a51;
  --liked:#fc3a51; --neutral:#f5b349; --disliked:#8ea6ad;
  --shadow:0 18px 50px -20px rgba(0,0,0,.6); --r:14px;
  --display:'Fraunces','Georgia',serif; --ui:'Manrope',system-ui,-apple-system,sans-serif;
  background:radial-gradient(900px 420px at 92% 118%, rgba(245,179,73,.10), transparent 70%), radial-gradient(1100px 480px at 50% -180px, rgba(252,58,81,.17), transparent 70%), var(--bg);
  color:var(--text); font-family:var(--ui); line-height:1.5; border-radius:16px;
  padding:8px 20px 40px; margin:0 auto; max-width:1180px;
}
.cd-app *{box-sizing:border-box}
.cd-app a{color:var(--gold-soft)}
.cd-app button{font-family:inherit;cursor:pointer;color:inherit}
.cd-app :focus-visible{outline:2px solid var(--gold);outline-offset:2px;border-radius:6px}

.cd-gate{text-align:center;padding:60px 20px;font-family:var(--display);font-size:20px;line-height:1.7}
.cd-btn{display:inline-block;background:var(--gold);color:#0e2430;border:none;border-radius:10px;padding:11px 20px;font-weight:700;font-size:14px;text-decoration:none;margin-top:14px}
.cd-btn.cd-ghost{background:transparent;border:1px solid var(--border-strong);color:var(--text)}
.cd-loading{text-align:center;color:var(--muted);padding:60px;font-style:italic;font-family:var(--display)}
.cd-app .cd-cta{text-align:center;padding:44px 20px;border:1px dashed var(--border-strong);border-radius:16px}
.cd-app .cd-cta .big,.cd-app .cd-auth .big{font-family:var(--display);font-size:22px;color:var(--text);margin-bottom:8px}
.cd-app .cd-cta p,.cd-app .cd-auth p{color:var(--muted);margin:0 0 16px}
.cd-app .cd-auth{padding:6px 28px 34px;text-align:center}
.cd-app .cd-auth-tabs{display:flex;gap:8px;justify-content:center;margin:6px 0 16px}
.cd-app .cd-auth-tabs button{background:var(--surface);border:1px solid var(--border);color:var(--muted);border-radius:999px;padding:8px 18px;font-weight:700;font-size:14px;font-family:var(--ui);cursor:pointer}
.cd-app .cd-auth-tabs button.on{background:var(--gold);color:#0e2430;border-color:var(--gold)}
.cd-app #cd-auth-form{display:flex;flex-direction:column;gap:10px;max-width:340px;margin:0 auto}
.cd-app .cd-a-inp{background:var(--surface);border:1px solid var(--border-strong);color:var(--text);border-radius:10px;padding:12px 14px;font-family:var(--ui);font-size:15px}
.cd-app .cd-a-inp:focus{border-color:var(--gold);outline:none}
.cd-app #cd-auth-form .btn{margin-top:4px}
.cd-app .cd-auth-msg{color:var(--red);font-size:13px;margin-top:10px;min-height:16px}
.cd-app .cd-auth-sub{color:var(--muted);font-size:14px;margin:0 0 6px}
.cd-app .cd-hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;opacity:0;pointer-events:none}
.cd-app .cd-google{display:flex;align-items:center;justify-content:center;gap:8px;background:#fff;color:#222;max-width:340px;margin:4px auto 2px;text-decoration:none;font-weight:700}
.cd-app .cd-google:hover{background:#f1f1f1;color:#222}
.cd-app .cd-google span{display:inline-grid;place-items:center;width:20px;height:20px;border-radius:50%;background:#fff;color:#4285F4;font-weight:800;font-family:Arial,sans-serif;border:1px solid #ddd}
.cd-app .cd-or{color:var(--muted);font-size:12px;margin:12px 0}
.cd-app .cd-auth-link{display:block;color:var(--muted);font-size:13px;margin-top:10px;text-decoration:none}
.cd-app .cd-auth-link:hover{color:var(--gold-soft)}
.cd-app .cd-dot{color:var(--border-strong);margin:0 4px}
.cd-app .cd-cta .btn,.cd-app .cd-auth .btn{margin:4px}

.cd-app .head{position:relative;padding:30px 0 20px;text-align:center;border-bottom:1px solid var(--border)}
.cd-app .head::before{content:"";position:absolute;left:0;right:0;top:0;height:2px;background:linear-gradient(90deg,transparent,var(--red) 15%,var(--gold) 50%,var(--red) 85%,transparent);opacity:.9}
.cd-app .eyebrow{font-size:11px;letter-spacing:.28em;text-transform:uppercase;color:var(--gold);font-weight:600;margin-bottom:6px}
.cd-app .brand{font-family:'FrauncesLogo','Fraunces','Georgia',serif;font-weight:normal;font-size:clamp(30px,5vw,50px);line-height:1;margin:0}
.cd-app .cd-logo-img{display:block;margin:0 auto -12px;width:clamp(104px,13vw,140px);height:auto}
.cd-app .brand em{font-style:italic;color:var(--red)}
.cd-app .tagline{color:var(--muted);margin-top:8px;font-size:14px}
.cd-app .cd-tabs{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin:20px auto 6px}
.cd-app .cd-tab{background:var(--surface);border:1px solid var(--border);color:var(--muted);padding:9px 18px;border-radius:999px;font-size:14px;font-weight:700;font-family:var(--ui);transition:.15s}
.cd-app .cd-tab:hover{color:var(--text);border-color:var(--border-strong)}
.cd-app .cd-tab.on{background:var(--red);border-color:var(--red);color:#fff}

/* Navegação entre Meu Diário e Descobrir */
.cd-app .cd-nav{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin:20px auto 4px}
.cd-app .cd-navbtn{background:var(--surface);border:1px solid var(--border-strong);color:var(--muted);padding:11px 24px;border-radius:999px;font-size:15px;font-weight:700;font-family:var(--ui);transition:.15s}
.cd-app .cd-navbtn:hover{color:var(--text)}
.cd-app .cd-navbtn.on{background:var(--red);border-color:var(--red);color:#fff}
.cd-app .cd-view{padding-top:6px}

/* Marca + tagline */
.cd-app .cd-brandwrap{text-align:center}
.cd-app .cd-tag{color:var(--muted);font-size:12.5px;letter-spacing:.14em;text-transform:lowercase;margin:4px 0 0}
/* Barra do usuário + avatar */
.cd-app .cd-topbar{display:flex;justify-content:flex-end;align-items:center;min-height:22px;padding-top:8px}
.cd-app .cd-userbar{display:flex;align-items:center;gap:10px}
.cd-app .cd-hello{color:var(--text);font-size:14px;font-weight:600}
.cd-app .cd-logout{color:var(--muted);font-size:13px;text-decoration:none}
.cd-app .cd-logout:hover{color:var(--gold-soft)}
.cd-app .cd-mini{padding:7px 14px;font-size:13px}
.cd-app .cd-avatar{width:34px;height:34px;border-radius:50%;overflow:hidden;border:1px solid var(--border-strong);padding:0;background:var(--surface-2);cursor:pointer}
.cd-app .cd-avatar img{width:100%;height:100%;object-fit:cover;display:block}
.cd-app .cd-stylebtn{background:transparent;border:1px solid var(--border);color:var(--muted);border-radius:999px;padding:5px 12px;font-size:12px;font-weight:600;cursor:pointer}
.cd-app .cd-stylebtn:hover{border-color:var(--gold);color:var(--gold-soft)}
/* Perfil */
.cd-app .cd-profile{padding:6px 28px 32px;text-align:center;max-width:400px;margin:0 auto}
.cd-app .cd-avatar-lg{width:100px;height:100px;border-radius:50%;overflow:hidden;margin:8px auto 14px;border:2px solid var(--border-strong);background:var(--surface-2)}
.cd-app .cd-avatar-lg img{width:100%;height:100%;object-fit:cover;display:block}
.cd-app .cd-profile .cd-a-inp{width:100%;background:var(--surface);border:1px solid var(--border-strong);color:var(--text);border-radius:10px;padding:12px 14px;font-family:var(--ui);font-size:15px}
.cd-app .cd-uname{display:flex;align-items:center;gap:8px}
.cd-app .cd-uname span{color:var(--gold-soft);font-size:20px;font-weight:800}
.cd-app .cd-uname .cd-a-inp{flex:1}

/* Estados ativos neutros pra ícones coloridos ficarem visíveis */
.cd-app .chip.type.on{background:var(--surface-2);border-color:var(--gold);color:var(--gold-soft)}
.cd-app .cd-seg.on{background:var(--surface-2);color:var(--text);box-shadow:inset 0 0 0 2px var(--gold)}

/* Estilo 2 — Noir (escuro + dourado, mais plano) */
.cd-app.cd-style-2{background:radial-gradient(1000px 460px at 50% -160px, rgba(245,179,73,.10), transparent 70%), #0b1920}
.cd-app.cd-style-2 .brand em{color:var(--gold-soft)}
.cd-app.cd-style-2 .card{background:#12242e;box-shadow:none;border-color:rgba(232,213,183,.10)}
.cd-app.cd-style-2 .card:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
.cd-app.cd-style-2 .btn{background:var(--gold);box-shadow:none}
.cd-app.cd-style-2 .cd-navbtn.on{background:var(--gold);color:#0e2430;box-shadow:none}

/* Estilo 3 — Vibrante (colorido + gradientes) */
.cd-app.cd-style-3{background:radial-gradient(700px 380px at 8% 0%, rgba(252,58,81,.20), transparent 60%), radial-gradient(760px 400px at 96% 12%, rgba(245,179,73,.17), transparent 60%), var(--bg)}
.cd-app.cd-style-3 .brand{background:linear-gradient(90deg,#f5b349,#fc3a51);-webkit-background-clip:text;background-clip:text;color:transparent}
.cd-app.cd-style-3 .brand em{color:transparent}
.cd-app.cd-style-3 .card{background:linear-gradient(180deg,#1c4256,#153140);border-color:rgba(245,179,73,.28)}
.cd-app.cd-style-3 .card:hover{transform:translateY(-6px) scale(1.015)}
.cd-app.cd-style-3 .btn{background:linear-gradient(180deg,#ff7a5c,#fc3a51);color:#fff;box-shadow:0 8px 20px -8px rgba(252,58,81,.6)}
.cd-app.cd-style-3 .cd-navbtn.on{background:linear-gradient(180deg,#ff7a5c,#fc3a51)}

/* Barra de adicionar (tipo + busca) */
.cd-app .cd-addbar{display:flex;gap:10px;max-width:700px;margin:22px auto 0;align-items:stretch;flex-wrap:wrap;justify-content:center}
.cd-ico{width:18px;height:18px;display:inline-block;flex:none}
.cd-app .cd-typeseg{display:flex;gap:4px;background:var(--surface);border:1px solid var(--border-strong);border-radius:999px;padding:4px}
.cd-app .cd-seg{display:inline-flex;align-items:center;gap:7px;height:44px;padding:0 15px;border-radius:999px;border:none;background:transparent;color:var(--muted);cursor:pointer;font-family:var(--ui);font-size:14px;font-weight:600;transition:.15s;white-space:nowrap}
.cd-app .cd-seg:hover{color:var(--text);background:var(--surface-2)}
.cd-app .cd-seg .cd-ico{display:block}
.cd-app .cd-addbar .searchbar{margin:0;flex:1;min-width:240px}
.cd-app .chip.type{display:inline-flex;align-items:center;gap:7px;padding:9px 16px;font-size:14px}
.cd-app .chip.type .cd-ico{width:16px;height:16px}
.cd-app .c-year .cd-ico{width:13px;height:13px;vertical-align:-2px;opacity:.85}
/* Fileiras "Em alta" (rolagem horizontal) */
.cd-app .cd-rowsec{margin-top:26px}
.cd-app .cd-row{overflow:hidden;padding:4px 2px 12px}
.cd-app .cd-track{display:flex;width:max-content;animation-name:cd-marquee;animation-timing-function:linear;animation-iteration-count:infinite;will-change:transform}
.cd-app .cd-row:hover .cd-track,.cd-app .cd-row.paused .cd-track{animation-play-state:paused}
.cd-app .cd-track .card{width:150px;flex:0 0 150px;margin-right:14px}
@keyframes cd-marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
/* Meu Diário */
.cd-app .cd-diary{padding-top:26px}
.cd-app .cd-typebar{display:flex;gap:8px;flex-wrap:wrap;margin:2px 0 14px}
.cd-app .chip.type{padding:9px 16px;font-size:14px}
.cd-app .chip.type.on{background:var(--gold);color:#0e2430;border-color:var(--gold)}
.cd-app .cd-subfilters{display:flex;gap:12px;flex-wrap:wrap;align-items:center;justify-content:space-between;margin-bottom:18px}
.cd-app .cd-status{display:flex;gap:8px;flex-wrap:wrap}
.cd-app .cd-sorts{display:flex;gap:8px;flex-wrap:wrap}

.cd-app .searchbar{margin:22px auto 0;max-width:620px;position:relative}
.cd-app .searchbar input{width:100%;padding:14px 44px 14px 18px;border-radius:999px;border:1px solid var(--border-strong);background:var(--surface);color:var(--text);font-size:16px}
.cd-app .searchbar input:focus{border-color:var(--gold);box-shadow:0 0 0 4px rgba(245,179,73,.14);outline:none}
.cd-app .searchbar .ic{position:absolute;right:16px;top:50%;transform:translateY(-50%);color:var(--muted)}
.cd-app .toolbar{display:flex;gap:10px;justify-content:center;align-items:center;flex-wrap:wrap;margin-top:14px;font-size:13px;color:var(--muted)}
.cd-app .toolbar b{color:var(--text)}

.cd-app section{padding:28px 0}
.cd-app .sec-head{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;margin-bottom:16px}
.cd-app .sec-title{font-family:var(--display);font-size:22px;font-weight:600;margin:0}
.cd-app .sec-title span{color:var(--muted);font-family:var(--ui);font-size:13px;font-weight:500}
.cd-app .filters{display:flex;gap:8px;flex-wrap:wrap;margin-left:auto;align-items:center}
.cd-app .chip{background:var(--surface);border:1px solid var(--border);color:var(--muted);padding:7px 14px;border-radius:999px;font-size:13px;font-weight:600}
.cd-app .chip:hover{color:var(--text)}
.cd-app .chip.on{background:var(--gold);color:#0e2430;border-color:var(--gold)}
.cd-app select.sort{background:var(--surface);border:1px solid var(--border);color:var(--muted);padding:7px 12px;border-radius:999px;font-size:13px;font-weight:600}

.cd-app .grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(138px,1fr));gap:16px}
.cd-app .card{background:linear-gradient(180deg,#183848,var(--surface));border:1px solid var(--border);border-radius:var(--r);overflow:hidden;display:flex;flex-direction:column;cursor:pointer;box-shadow:0 4px 14px -8px rgba(0,0,0,.6);transition:transform .18s,border-color .18s,box-shadow .18s}
.cd-app .card:hover{transform:translateY(-5px);border-color:var(--border-strong);box-shadow:0 22px 40px -18px rgba(0,0,0,.75)}
.cd-app .poster{aspect-ratio:2/3;background:var(--surface-2);position:relative;overflow:hidden}
.cd-app .poster img{width:100%;height:100%;object-fit:cover;display:block}
.cd-app .poster .noimg{position:absolute;inset:0;display:grid;place-items:center;color:var(--muted);font-size:12px;text-align:center;padding:14px;font-family:var(--display);font-style:italic}
.cd-app .badge{position:absolute;top:8px;left:8px;font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;padding:4px 8px;border-radius:999px;background:rgba(0,0,0,.6);color:var(--gold-soft)}
.cd-app .v-badge{position:absolute;top:8px;right:8px;width:26px;height:26px;border-radius:999px;display:grid;place-items:center;font-size:13px;background:rgba(0,0,0,.62)}
.cd-app .card-body{padding:11px 12px 13px}
.cd-app .c-title{font-family:var(--display);font-weight:600;font-size:15px;line-height:1.2;margin:0 0 2px}
.cd-app .c-orig{font-size:11.5px;color:var(--muted);font-style:italic;line-height:1.25;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cd-app .c-year{font-size:11px;color:var(--muted);margin-top:5px}
.cd-app .rel-tag{font-size:11px;color:var(--gold-soft);margin-top:4px}
.cd-app .res-actions{display:flex;flex-direction:column;gap:6px;padding:0 12px 12px;margin-top:auto}
.cd-app .btn-mini{width:100%;font-size:12px;font-weight:700;padding:9px 8px;border-radius:9px;border:1px solid var(--border-strong);background:transparent;color:var(--text)}
.cd-app .btn-mini:hover{border-color:var(--gold);color:var(--gold-soft)}
.cd-app .btn-mini.solid{background:var(--gold);color:#0e2430;border-color:var(--gold)}
.cd-app .btn-mini.added{background:var(--surface-2);color:var(--muted);border-color:var(--border);cursor:default}

.cd-app .empty{text-align:center;padding:50px 20px;color:var(--muted);max-width:460px;margin:0 auto}
.cd-app .empty .big{font-family:var(--display);font-style:italic;font-size:20px;color:var(--text);margin-bottom:8px}

/* Modal */
.cd-app .overlay{position:fixed;inset:0;background:rgba(6,15,20,.75);backdrop-filter:blur(6px);z-index:99999;display:none;align-items:flex-start;justify-content:center;padding:28px 16px;overflow-y:auto}
.cd-app .overlay.open{display:flex}
.cd-app .modal{background:var(--bg-2);border:1px solid var(--border-strong);border-radius:18px;max-width:760px;width:100%;box-shadow:var(--shadow);overflow:hidden}
.cd-app .modal-head{display:flex;justify-content:flex-end;padding:12px 12px 0}
.cd-app .x{background:transparent;border:none;color:var(--muted);font-size:22px;width:36px;height:36px;border-radius:999px;line-height:1}
.cd-app .x:hover{color:var(--text);background:var(--surface)}
.cd-app .detail{display:grid;grid-template-columns:210px 1fr;gap:24px;padding:4px 28px 30px}
.cd-app .detail .poster{border-radius:12px;border:1px solid var(--border)}
.cd-app .d-orig-label{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);font-weight:600;margin-bottom:4px}
.cd-app .d-title{font-family:var(--display);font-size:28px;font-weight:600;line-height:1.05;margin:0 0 4px}
.cd-app .d-orig{font-family:var(--display);font-style:italic;font-size:17px;color:var(--gold-soft);margin:0 0 2px}
.cd-app .d-meta{color:var(--muted);font-size:13px;margin:8px 0 14px}
.cd-app .d-overview{font-size:14px;color:#d9cbb2;line-height:1.6;margin-bottom:18px}
.cd-app .field-label{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);font-weight:700;margin:16px 0 8px}
.cd-app .lbl-hint{font-size:11px;color:var(--muted);font-weight:500;letter-spacing:normal;text-transform:none}
.cd-app .verdicts{display:flex;gap:8px;flex-wrap:wrap}
.cd-app .vbtn{border:1px solid var(--border-strong);background:transparent;color:var(--text);border-radius:10px;padding:9px 14px;font-size:13px;font-weight:600;display:inline-flex;gap:7px;align-items:center}
.cd-app .vbtn.on[data-v="liked"]{background:rgba(252,58,81,.15);border-color:var(--liked);color:var(--liked)}
.cd-app .vbtn.on[data-v="neutral"]{background:rgba(245,179,73,.15);border-color:var(--neutral);color:var(--neutral)}
.cd-app .vbtn.on[data-v="disliked"]{background:rgba(142,166,173,.15);border-color:var(--disliked);color:var(--disliked)}
.cd-app .stars{display:flex;gap:4px}
.cd-app .star{background:none;border:none;font-size:26px;color:var(--border-strong);line-height:1;padding:0}
.cd-app .star.on{color:var(--gold)}
.cd-app textarea{width:100%;background:var(--surface);border:1px solid var(--border);border-radius:12px;color:var(--text);padding:12px 14px;font-family:inherit;font-size:14px;resize:vertical;min-height:80px}
.cd-app textarea:focus{border-color:var(--gold);outline:none}
.cd-app .providers{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.cd-app .prov-a{display:inline-block;transition:transform .12s}
.cd-app .prov-a:hover{transform:translateY(-2px)}
.cd-app .prov{width:42px;height:42px;border-radius:9px;border:1px solid var(--border);object-fit:cover}
.cd-app .pub-note{background:var(--surface);border:1px solid var(--border);border-left:3px solid var(--gold);border-radius:8px;padding:10px 12px;margin:0 0 8px;font-size:14px;color:#d9cbb2}
.cd-app .cd-reacts{display:flex;flex-wrap:wrap;gap:6px;margin-top:9px}
.cd-app .cd-react{background:var(--surface-2);border:1px solid var(--border);border-radius:999px;padding:3px 9px;font-size:15px;cursor:pointer;color:var(--text);display:inline-flex;align-items:center;gap:5px;line-height:1}
.cd-app .cd-react span{font-size:12px;color:var(--muted);font-weight:700}
.cd-app .cd-react.on{border-color:var(--gold);background:rgba(245,179,73,.16)}
.cd-app .cd-react:hover{border-color:var(--gold-soft)}
.cd-app .pub-note b{color:var(--gold-soft);font-size:12px}
.cd-app .cd-cats{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px}
.cd-app .cd-cat-chip{display:inline-flex;align-items:center;gap:6px;background:var(--surface);border:1px solid var(--border-strong);color:var(--gold-soft);border-radius:999px;padding:5px 6px 5px 12px;font-size:12px;font-weight:600}
.cd-app .cd-cat-chip button{background:none;border:none;color:var(--muted);font-size:15px;line-height:1;cursor:pointer;padding:0 2px}
.cd-app .cd-cat-chip button:hover{color:var(--red)}
.cd-app .cd-cat-add{display:flex;gap:8px;align-items:center}
.cd-app .cd-cat-add input{flex:1;background:var(--surface);border:1px solid var(--border);border-radius:10px;color:var(--text);padding:9px 12px;font-family:inherit;font-size:14px}
.cd-app .cd-cat-add input:focus{border-color:var(--gold);outline:none}
.cd-app .cd-seasons-list{display:flex;flex-wrap:wrap;gap:8px}
.cd-app .cd-season{background:var(--surface);border:1px solid var(--border-strong);color:var(--text);border-radius:10px;padding:8px 12px;font-size:13px;font-weight:600;font-family:var(--ui);display:inline-flex;gap:6px;align-items:center}
.cd-app .cd-season span{color:var(--muted);font-weight:500;font-size:11px}
.cd-app .cd-season.on{background:rgba(245,179,73,.16);border-color:var(--gold);color:var(--gold-soft)}
.cd-app .cd-season.on::before{content:"\2713";font-weight:700}
.cd-app .d-foot{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:20px;flex-wrap:wrap}
.cd-app .toggle{display:inline-flex;gap:8px;align-items:center;font-size:13px;color:var(--muted)}
.cd-app .switch{width:44px;height:24px;border-radius:999px;background:var(--surface-2);border:1px solid var(--border-strong);position:relative;transition:.2s;flex:none}
.cd-app .switch::after{content:"";position:absolute;top:2px;left:2px;width:18px;height:18px;border-radius:999px;background:var(--muted);transition:.2s}
.cd-app .switch.on{background:rgba(245,179,73,.28);border-color:var(--gold)}
.cd-app .switch.on::after{left:22px;background:var(--gold)}
.cd-app .remove{background:none;border:none;color:var(--red);font-size:13px;font-weight:600;opacity:.85}
.cd-app .btn{background:linear-gradient(180deg,#f8c869,var(--gold));color:#0e2430;border:none;border-radius:10px;padding:11px 18px;font-weight:700;font-size:14px;text-decoration:none;display:inline-block;box-shadow:0 8px 18px -8px rgba(245,179,73,.55)}
.cd-app .btn:hover{background:linear-gradient(180deg,#ffd27e,#f8c266)}
.cd-app .btn.ghost{background:transparent;border:1px solid var(--border-strong);color:var(--text)}
.cd-app .spinner{display:inline-block;width:16px;height:16px;border:2px solid var(--border-strong);border-top-color:var(--gold);border-radius:50%;animation:cd-spin .7s linear infinite;vertical-align:-3px}
@keyframes cd-spin{to{transform:rotate(360deg)}}
.cd-app .toast{position:fixed;bottom:22px;left:50%;transform:translateX(-50%) translateY(20px);background:var(--surface-2);border:1px solid var(--border-strong);color:var(--text);padding:12px 20px;border-radius:12px;font-size:14px;box-shadow:var(--shadow);opacity:0;pointer-events:none;transition:.25s;z-index:100000}
.cd-app .toast.show{opacity:1;transform:translateX(-50%) translateY(0)}

@media (max-width:560px){
  .cd-app .detail{grid-template-columns:1fr;padding:4px 18px 24px}
  .cd-app .detail .poster{max-width:180px;margin:0 auto}
  .cd-app .grid{grid-template-columns:repeat(auto-fill,minmax(132px,1fr));gap:14px}
  .cd-app .cd-addbar{flex-direction:column;gap:12px}
  .cd-app .cd-typeseg{flex-wrap:wrap;justify-content:center;background:transparent;border:none;padding:0;gap:8px}
  .cd-app .cd-seg{height:40px;padding:0 14px;font-size:13px;border:1px solid var(--border-strong);background:var(--surface)}
  .cd-app .cd-seg.on{border-color:var(--gold)}
  .cd-app .cd-addbar .searchbar{width:100%;min-width:0}
  .cd-app .cd-topbar{justify-content:center;margin-bottom:18px}
  .cd-app .cd-mini{padding:8px 16px}
  .cd-app .brand{font-size:34px}
  .cd-app .cd-track .card{width:132px;flex-basis:132px}
}
@media (prefers-reduced-motion:reduce){.cd-app *{animation:none!important;transition:none!important}}