/* ---- Botões ---- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  font-family:var(--font-ui); font-size:.9rem; font-weight:600;
  padding:9px 16px; border-radius:var(--radius-sm); border:1px solid transparent;
  cursor:pointer; transition:opacity var(--dur-fast) var(--ease), background var(--dur-fast) var(--ease), transform var(--dur-fast) var(--ease);
  white-space:nowrap;
}
.btn:active{ transform:translateY(1px); }
.btn-primary{ background:var(--accent); color:var(--accent-ink); }
.btn-primary:hover{ opacity:.9; }
.btn-secondary{ background:var(--paper-raised); color:var(--ink); border-color:var(--hairline-strong); }
.btn-secondary:hover{ border-color:var(--ink-soft); }
.btn-ghost{ background:transparent; color:var(--ink-soft); }
.btn-ghost:hover{ color:var(--ink); background:var(--paper-raised); }
.btn-danger{ background:var(--danger-soft); color:var(--danger); }
.btn-danger:hover{ opacity:.85; }
.btn-sm{ padding:6px 11px; font-size:.82rem; }
.btn-icon{ padding:8px; border-radius:var(--radius-sm); }
.btn:disabled{ opacity:.45; cursor:not-allowed; }

/* ---- Badge / tag ---- */
.badge{
  display:inline-flex; align-items:center; gap:5px;
  font-size:var(--fs-micro); color:var(--ink-soft);
  background:var(--paper-sunken); border:1px solid var(--hairline);
  padding:3px 8px; border-radius:var(--radius-pill);
}
.badge-accent{ background:var(--accent-soft); color:var(--accent); border-color:transparent; }
.badge-plum{ background:var(--plum-soft); color:var(--plum); border-color:transparent; }

/* ---- Tabs de filtro ---- */
.tabs{ display:flex; gap:var(--sp-1); border-bottom:1px solid var(--hairline); margin-bottom:var(--sp-5); }
.tab{
  background:none; border:none; cursor:pointer;
  padding:9px 4px; margin-right:var(--sp-5);
  font-size:.92rem; color:var(--ink-faint);
  border-bottom:2px solid transparent; margin-bottom:-1px;
  transition:color var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease);
}
.tab:hover{ color:var(--ink); }
.tab.active{ color:var(--ink); border-color:var(--accent); font-weight:600; }

/* ---- Barra de progresso ---- */
.progress-track{ height:3px; background:var(--hairline); border-radius:99px; overflow:hidden; }
.progress-fill{ height:100%; background:var(--accent); border-radius:99px; transition:width var(--dur-base) var(--ease); }

/* ---- Cartão de fonte (biblioteca) ---- */
.source-grid{
  display:grid; grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); gap:var(--sp-4);
}
.source-card{
  background:var(--paper-raised); border:1px solid var(--hairline);
  border-radius:var(--radius-md); padding:var(--sp-4);
  display:flex; flex-direction:column; gap:var(--sp-3);
  cursor:pointer; text-decoration:none; color:inherit;
  transition:border-color var(--dur-fast) var(--ease), transform var(--dur-fast) var(--ease);
}
.source-card:hover{ border-color:var(--ink-soft); transform:translateY(-1px); }
.source-card-top{ display:flex; align-items:flex-start; justify-content:space-between; gap:8px; }
.source-type-icon{
  width:30px; height:30px; border-radius:var(--radius-sm);
  display:flex; align-items:center; justify-content:center;
  background:var(--paper-sunken); color:var(--ink-soft); flex:none;
}
.fav-btn{ background:none; border:none; cursor:pointer; color:var(--hairline-strong); padding:2px; }
.fav-btn.is-fav{ color:var(--plum); }
.source-card h3{ font-size:1.02rem; margin:0; }
.source-meta{ font-size:var(--fs-small); color:var(--ink-faint); display:flex; gap:6px; align-items:center; flex-wrap:wrap; }
.source-card .progress-track{ margin-top:auto; }

/* ---- Continue reading (hero da biblioteca) ---- */
.continue-strip{ display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:var(--sp-4); margin-bottom:var(--sp-7); }
.continue-card{
  position:relative; overflow:hidden;
  background:var(--paper-raised); border:1px solid var(--hairline); border-radius:var(--radius-md);
  padding:var(--sp-5); cursor:pointer; text-decoration:none; color:inherit;
  display:flex; flex-direction:column; gap:var(--sp-2);
}
.continue-card::before{
  content:""; position:absolute; inset:0;
  background:radial-gradient(420px 160px at 100% 0%, var(--accent-soft), transparent 70%);
  opacity:.7; pointer-events:none;
}
.continue-card > *{ position:relative; }
.continue-eyebrow{ font-size:var(--fs-small); color:var(--ink-faint); font-family:var(--font-display); font-style:italic; }
.continue-card h3{ font-size:1.2rem; }

/* ---- Cartão vazio ---- */
.empty-state{
  border:1px dashed var(--hairline-strong); border-radius:var(--radius-md);
  padding:var(--sp-8) var(--sp-5); text-align:center; color:var(--ink-soft);
}
.empty-state h3{ color:var(--ink); }
.empty-state p{ max-width:36ch; margin:0 auto var(--sp-4); color:var(--ink-faint); }

/* ---- Modal ---- */
.modal-backdrop{
  position:fixed; inset:0; background:rgba(20,18,12,.42);
  display:flex; align-items:center; justify-content:center; padding:var(--sp-5);
  z-index:200; animation:fade-in var(--dur-fast) var(--ease);
}
@keyframes fade-in{ from{opacity:0} to{opacity:1} }
.modal{
  background:var(--paper-raised); border-radius:var(--radius-md);
  box-shadow:var(--shadow-modal); width:min(520px,100%);
  max-height:88vh; overflow:auto; padding:var(--sp-6);
  animation:modal-in var(--dur-base) var(--ease);
}
@keyframes modal-in{ from{opacity:0; transform:translateY(10px) scale(.98);} to{opacity:1; transform:none;} }
.modal h2{ margin-bottom:var(--sp-1); }
.modal .modal-sub{ color:var(--ink-faint); font-size:var(--fs-small); margin-bottom:var(--sp-5); }
.modal-field{ margin-bottom:var(--sp-4); }
.modal-actions{ display:flex; justify-content:flex-end; gap:var(--sp-2); margin-top:var(--sp-6); }
.modal-close{ position:absolute; }

.modal-tabs{ display:flex; gap:4px; background:var(--paper-sunken); padding:4px; border-radius:var(--radius-sm); margin-bottom:var(--sp-5); }
.modal-tab{ flex:1; text-align:center; padding:7px; border-radius:3px; background:none; border:none; cursor:pointer; font-size:.86rem; color:var(--ink-soft); }
.modal-tab.active{ background:var(--paper-raised); color:var(--ink); font-weight:600; box-shadow:0 0 0 1px var(--hairline); }

.dropzone{
  border:1.5px dashed var(--hairline-strong); border-radius:var(--radius-md);
  padding:var(--sp-7) var(--sp-4); text-align:center; color:var(--ink-faint);
  cursor:pointer; transition:border-color var(--dur-fast) var(--ease), background var(--dur-fast) var(--ease);
}
.dropzone:hover, .dropzone.is-drag{ border-color:var(--accent); background:var(--accent-soft); color:var(--ink); }
.dropzone input[type=file]{ display:none; }

/* ---- Toast ---- */
.toast-host{ position:fixed; bottom:var(--sp-5); left:50%; transform:translateX(-50%); z-index:400; display:flex; flex-direction:column; gap:8px; align-items:center; }
.toast{
  background:var(--ink); color:var(--paper); font-size:.86rem;
  padding:10px 16px; border-radius:var(--radius-pill);
  box-shadow:var(--shadow-modal); animation:toast-in var(--dur-base) var(--ease);
}
.toast.toast-danger{ background:var(--danger); }
@keyframes toast-in{ from{opacity:0; transform:translateY(8px);} to{opacity:1; transform:none;} }

/* ---- Toolbar de seleção (criar flashcard) ---- */
.selection-toolbar{
  position:fixed; z-index:150; transform:translate(-50%,-100%);
  background:var(--ink); color:var(--paper); border-radius:var(--radius-pill);
  padding:6px 8px 6px 14px; display:flex; align-items:center; gap:8px;
  box-shadow:var(--shadow-modal); font-size:.84rem;
  animation:toast-in var(--dur-fast) var(--ease);
}
.selection-toolbar button{
  background:var(--paper); color:var(--ink); border:none; border-radius:var(--radius-pill);
  padding:6px 12px; font-size:.82rem; font-weight:600; cursor:pointer;
}

/* ---- Leitor: cabeçalho e corpo ---- */
.reader-head{ display:flex; align-items:flex-start; justify-content:space-between; gap:var(--sp-4); margin-bottom:var(--sp-5); }
.reader-head h1{ font-size:1.5rem; }
.reader-body{
  font-family:var(--font-reading); font-size:var(--fs-reading); line-height:1.75;
  color:var(--ink); white-space:pre-wrap;
}
.reader-body p{ margin:0 0 1.2em; }
.reader-toolbar{ display:flex; align-items:center; gap:var(--sp-3); }
.reader-progress-wrap{ position:sticky; top:0; background:var(--paper); padding:var(--sp-2) 0; z-index:5; }

/* ---- PDF viewer ---- */
.pdf-shell{ display:flex; flex-direction:column; align-items:center; gap:var(--sp-4); }
.pdf-page-wrap{ position:relative; background:var(--paper-raised); box-shadow:0 1px 0 var(--hairline-strong), 0 0 0 1px var(--hairline); }
.pdf-page-wrap canvas{ display:block; }
.pdf-text-layer{ position:absolute; inset:0; overflow:hidden; opacity:1; line-height:1; }
.pdf-text-layer span{ position:absolute; color:transparent; cursor:text; white-space:pre; }
.pdf-text-layer ::selection{ background:var(--accent-soft); }
.pdf-nav{ display:flex; align-items:center; gap:var(--sp-4); font-size:.88rem; color:var(--ink-soft); }
.pdf-ocr-banner{
  display:flex; align-items:center; gap:10px; justify-content:space-between;
  background:var(--paper-sunken); border:1px solid var(--hairline); border-radius:var(--radius-sm);
  padding:10px 14px; font-size:.85rem; color:var(--ink-soft); width:100%; max-width:640px;
}

/* ---- Vídeo ---- */
.video-layout{ display:grid; grid-template-columns:1.5fr 1fr; gap:var(--sp-6); align-items:start; }
.video-frame-wrap{ position:relative; aspect-ratio:16/9; background:#000; border-radius:var(--radius-md); overflow:hidden; }
.video-frame-wrap iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; }
.transcript-panel{ background:var(--paper-raised); border:1px solid var(--hairline); border-radius:var(--radius-md); padding:var(--sp-4); max-height:72vh; overflow:auto; }
.transcript-panel textarea{ min-height:300px; font-family:var(--font-reading); font-size:1.02rem; line-height:1.7; border:none; padding:0; }
.transcript-panel textarea:focus{ box-shadow:none; }
@media (max-width: 980px){ .video-layout{ grid-template-columns:1fr; } }

/* ---- Flashcards ---- */
.flash-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:var(--sp-4); }
.flash-card{
  background:var(--paper-raised); border:1px solid var(--hairline); border-radius:var(--radius-md);
  padding:var(--sp-4); display:flex; flex-direction:column; gap:var(--sp-2);
}
.flash-front{ font-family:var(--font-display); font-size:1.15rem; font-weight:600; }
.flash-back{ color:var(--ink-soft); }
.flash-context{ font-family:var(--font-reading); font-style:italic; color:var(--ink-faint); font-size:.92rem; border-left:2px solid var(--hairline-strong); padding-left:10px; }
.flash-foot{ display:flex; align-items:center; justify-content:space-between; margin-top:auto; padding-top:var(--sp-2); border-top:1px solid var(--hairline); }
.flash-source-link{ display:flex; align-items:center; gap:6px; font-size:var(--fs-small); color:var(--accent); background:none; border:none; cursor:pointer; padding:0; }
.flash-actions{ display:flex; gap:4px; }

/* ---- Modo revisão (flip) ---- */
.review-stage{ display:flex; flex-direction:column; align-items:center; gap:var(--sp-5); padding:var(--sp-6) 0; }
.flip-card{ width:min(480px,92vw); height:280px; perspective:1200px; cursor:pointer; }
.flip-inner{ position:relative; width:100%; height:100%; transition:transform .5s var(--ease); transform-style:preserve-3d; }
.flip-card.flipped .flip-inner{ transform:rotateY(180deg); }
.flip-face{
  position:absolute; inset:0; backface-visibility:hidden;
  background:var(--paper-raised); border:1px solid var(--hairline); border-radius:var(--radius-md);
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:var(--sp-3);
  padding:var(--sp-5); text-align:center;
}
.flip-face.back{ transform:rotateY(180deg); }
.flip-face .word{ font-family:var(--font-display); font-size:1.9rem; font-weight:600; }

/* ---- Shadowing: frases e barra do player ---- */
.shadow-active .sent{ border-radius:2px; cursor:pointer; transition:background var(--dur-fast) var(--ease); }
.shadow-active .sent:hover{ background:var(--paper-sunken); }
.sent.is-current{ background:var(--accent-soft); box-decoration-break:clone; -webkit-box-decoration-break:clone; }
.sent.is-turn{ background:var(--plum-soft); }

.shadow-bar{
  position:sticky; bottom:var(--sp-4); z-index:20; margin-top:var(--sp-5);
  background:var(--paper-raised); border:1px solid var(--hairline-strong);
  border-radius:var(--radius-md); box-shadow:var(--shadow-modal);
  padding:var(--sp-3) var(--sp-4); display:flex; flex-direction:column; gap:var(--sp-2);
  font-family:var(--font-ui);
}
.shadow-row{ display:flex; align-items:center; gap:var(--sp-3); flex-wrap:wrap; }
.shadow-transport{ display:flex; align-items:center; gap:4px; }
.shadow-play{ min-width:104px; }
.shadow-count{ font-size:var(--fs-small); color:var(--ink-faint); font-variant-numeric:tabular-nums; margin-right:auto; }
.shadow-opts{ font-size:var(--fs-small); color:var(--ink-soft); gap:var(--sp-4); }
.shadow-opts label{ display:flex; align-items:center; gap:6px; }
.shadow-opts select{ width:auto; font-size:var(--fs-small); padding:4px 6px; }
.shadow-opts label[hidden]{ display:none; }
.shadow-voice{ min-width:0; }
.shadow-voice select{ max-width:220px; }
.shadow-check input{ width:auto; }
.shadow-hint{ font-size:var(--fs-micro); color:var(--ink-faint); line-height:1.4; }
.shadow-hint[hidden]{ display:none; }
.seg{ display:inline-flex; border:1px solid var(--hairline-strong); border-radius:var(--radius-sm); overflow:hidden; }
.seg button{
  background:transparent; border:none; padding:6px 11px; font-size:.8rem; font-weight:600;
  color:var(--ink-soft); cursor:pointer; font-family:var(--font-ui);
}
.seg button + button{ border-left:1px solid var(--hairline-strong); }
.seg button.active{ background:var(--accent); color:var(--accent-ink); }
.pdf-shadow-panel{ width:100%; max-width:780px; }

/* ---- Estatísticas (biblioteca) ---- */
.stats-wrap{ margin-bottom:var(--sp-6); }
.stats-head{ display:flex; align-items:center; justify-content:space-between; gap:var(--sp-3); margin-bottom:var(--sp-3); }
.stats-head h2{ margin:0; font-size:var(--fs-h3); }
.stats-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(168px,1fr)); gap:var(--sp-3); }
.stat-card{
  background:var(--paper-raised); border:1px solid var(--hairline); border-radius:var(--radius-md);
  padding:var(--sp-4); display:flex; flex-direction:column; gap:2px;
}
.stat-top{ display:flex; align-items:center; justify-content:space-between; gap:var(--sp-2); }
.stat-label{ font-size:var(--fs-small); color:var(--ink-soft); }
.stat-icon{ color:var(--ink-faint); display:flex; }
.stat-value{ font-family:var(--font-display); font-size:2rem; font-weight:600; line-height:1.1; margin-top:var(--sp-2); font-variant-numeric:tabular-nums; }
.stat-sub{ font-size:var(--fs-micro); color:var(--ink-faint); }

/* ---- Botão "Foco" na sidebar ---- */
button.nav-link{ width:100%; background:none; border:none; cursor:pointer; font:inherit; text-align:left; }
.nav-focus .nav-focus-time{ margin-left:auto; font-size:var(--fs-small); font-variant-numeric:tabular-nums; color:var(--ink-faint); }
.nav-focus.is-live .nav-focus-time{ color:var(--accent); font-weight:600; }

/* ---- Painel Foco (Pomodoro + sons ambientes) ---- */
.focus-panel{
  position:fixed; left:248px; bottom:var(--sp-4); z-index:60; width:300px;
  background:var(--paper-raised); border:1px solid var(--hairline-strong); border-radius:var(--radius-md);
  box-shadow:var(--shadow-modal); padding:var(--sp-4); display:flex; flex-direction:column; gap:var(--sp-4);
  animation:modal-in var(--dur-base) var(--ease);
}
.focus-panel[hidden]{ display:none; }
.fp-head{ display:flex; align-items:center; justify-content:space-between; }
.fp-head h3{ margin:0; }
.fp-pomo{ display:flex; flex-direction:column; gap:var(--sp-3); align-items:stretch; }
.fp-modes{ display:flex; }
.fp-modes button{ flex:1; }
.fp-time{ font-family:var(--font-display); font-size:3rem; font-weight:600; text-align:center; line-height:1; font-variant-numeric:tabular-nums; }
.focus-panel.is-break .fp-time{ color:var(--plum); }
.focus-panel.is-break .progress-fill{ background:var(--plum); }
.fp-actions{ display:flex; gap:var(--sp-2); }
.fp-actions .btn-primary{ flex:1; }
.fp-today{ font-size:var(--fs-micro); color:var(--ink-faint); text-align:center; }
.fp-amb{ display:flex; flex-direction:column; gap:var(--sp-2); padding-top:var(--sp-3); border-top:1px solid var(--hairline); }
.fp-title{ font-size:var(--fs-small); color:var(--ink-soft); font-weight:600; }
.fp-amb-list{ display:flex; flex-direction:column; gap:6px; }
.fp-amb-btn{
  display:flex; align-items:center; gap:10px; width:100%; text-align:left; cursor:pointer;
  background:var(--paper); border:1px solid var(--hairline); border-radius:var(--radius-sm);
  padding:8px 10px; color:var(--ink-soft); font-size:var(--fs-small);
  transition:background var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease);
}
.fp-amb-btn:hover{ background:var(--paper-sunken); color:var(--ink); }
.fp-amb-btn span{ flex:1; }
.fp-amb-btn i{ display:flex; font-style:normal; }
.fp-amb-btn.is-playing{ background:var(--accent-soft); border-color:var(--accent); color:var(--ink); font-weight:600; }
.fp-vol{ display:flex; align-items:center; gap:10px; margin:var(--sp-1) 0 0; color:var(--ink-faint); }

/* ---- Controles: slider e switch ---- */
input[type=range]{ padding:0; border:none; background:transparent; accent-color:var(--accent); height:20px; cursor:pointer; }
input[type=range]:focus{ box-shadow:none; }
.switch{ position:relative; display:inline-block; width:40px; height:23px; margin:0; flex:none; }
.switch input{ position:absolute; inset:0; width:100%; height:100%; margin:0; padding:0; opacity:0; cursor:pointer; z-index:1; }
.switch span{ position:absolute; inset:0; background:var(--hairline-strong); border-radius:99px; transition:background var(--dur-fast) var(--ease); }
.switch span::after{
  content:''; position:absolute; left:3px; top:3px; width:17px; height:17px; border-radius:50%;
  background:var(--paper-raised); transition:transform var(--dur-fast) var(--ease);
}
.switch input:checked + span{ background:var(--accent); }
.switch input:checked + span::after{ transform:translateX(17px); }
.switch input:focus-visible + span{ outline:2px solid var(--accent); outline-offset:2px; }

/* ---- Configurações ---- */
.settings-group{ background:var(--paper-raised); border:1px solid var(--hairline); border-radius:var(--radius-md); padding:var(--sp-5); margin-bottom:var(--sp-5); }
.settings-group h2{ font-size:var(--fs-h3); margin-bottom:var(--sp-2); }
.setting-row{ display:flex; align-items:center; justify-content:space-between; gap:var(--sp-5); padding:var(--sp-3) 0; border-top:1px solid var(--hairline); }
.setting-row:first-of-type{ border-top:none; }
.setting-name{ font-weight:600; }
.setting-desc{ font-size:var(--fs-small); color:var(--ink-faint); }
.setting-control{ display:flex; align-items:center; gap:var(--sp-3); flex:none; }
.setting-control input[type=range]{ width:160px; }
.setting-value{ width:42px; text-align:right; font-size:var(--fs-small); color:var(--ink-soft); font-variant-numeric:tabular-nums; }
.setting-numbers label{ display:flex; flex-direction:column; gap:4px; margin:0; font-size:var(--fs-micro); }
.setting-numbers input{ width:68px; padding:6px 8px; }

@media (max-width: 880px){
  .focus-panel{ left:var(--sp-3); right:var(--sp-3); bottom:var(--sp-3); width:auto; }
  .setting-row{ flex-direction:column; align-items:flex-start; gap:var(--sp-2); }
}

/* ---- Flashcards: campos gramaticais e botões de avaliação ---- */
.fc-details{ display:grid; grid-template-columns:1fr 1fr; gap:0 var(--sp-3); }
.fc-details[hidden]{ display:none; }
.fc-details .modal-field:nth-child(odd):last-child{ grid-column:1 / -1; }
.flash-details{ margin:var(--sp-2) 0 0; display:flex; flex-wrap:wrap; gap:4px var(--sp-4); font-size:var(--fs-small); }
.flash-details div{ display:flex; gap:6px; }
.flash-details dt{ color:var(--ink-faint); }
.flash-details dt::after{ content:':'; }
.flash-details dd{ margin:0; font-weight:600; }
.flip-face.back .flash-details{ justify-content:center; margin-top:var(--sp-3); }
.rate-row{ display:flex; gap:var(--sp-3); }
.rate-btn{ flex-direction:column; gap:2px; min-width:96px; }
.rate-btn small{ font-weight:400; opacity:.75; font-size:var(--fs-micro); }
@media (max-width: 520px){ .fc-details{ grid-template-columns:1fr; } }

/* ---- Painéis recolhíveis ---- */
.collapsible-head{ display:flex; align-items:center; justify-content:space-between; gap:var(--sp-3); margin-bottom:var(--sp-3); }
.collapsible.is-collapsed .collapsible-head{ margin-bottom:0; }
.collapse-toggle{
  display:flex; align-items:center; gap:8px; background:none; border:none; cursor:pointer;
  padding:4px 6px 4px 0; margin-left:-2px; color:var(--ink); font:inherit; border-radius:var(--radius-sm);
}
.collapse-toggle h2, .collapse-toggle h3{ margin:0; font-size:var(--fs-h3); }
.collapse-toggle:hover{ color:var(--accent); }
.collapse-chevron{ display:flex; color:var(--ink-faint); transition:transform var(--dur-fast) var(--ease); }
.collapsible.is-collapsed .collapse-chevron{ transform:rotate(-90deg); }
.collapsible-body[hidden]{ display:none; }
.collapsible-actions{ display:flex; gap:var(--sp-2); }

.shadow-min{ margin-left:auto; }
.shadow-min svg{ transition:transform var(--dur-fast) var(--ease); }
.shadow-bar.is-min .shadow-min svg{ transform:rotate(180deg); }
.shadow-bar.is-min .shadow-opts, .shadow-bar.is-min .shadow-hint, .shadow-bar.is-min .seg{ display:none; }
.shadow-count{ margin-right:0; }
.reader-tools{ display:flex; align-items:center; gap:var(--sp-2); }

/* ---- Flashcards: filtros e dificuldade ---- */
.fc-filters{ display:flex; gap:10px; flex-wrap:wrap; align-items:center; margin-bottom:var(--sp-3); }
.fc-filters input#fc-search{ max-width:220px; }
.fc-filters select{ max-width:220px; width:auto; }
.fc-filters + .fc-filters{ margin-bottom:0; }
#fc-list{ margin-top:var(--sp-5); }
.chip-row{ display:flex; gap:6px; flex-wrap:wrap; }
.chip, .chip-check{
  display:inline-flex; align-items:center; gap:6px; cursor:pointer; font:inherit; font-size:var(--fs-small);
  padding:5px 12px; border-radius:99px; border:1px solid var(--hairline-strong);
  background:var(--paper-raised); color:var(--ink-soft);
  transition:background var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease);
}
.chip:hover, .chip-check:hover{ background:var(--paper-sunken); }
.chip small, .chip-check small{ opacity:.7; font-variant-numeric:tabular-nums; }
.chip.active{ background:var(--accent-soft); border-color:var(--accent); color:var(--ink); font-weight:600; }
.chip.level-hard.active{ background:var(--danger-soft); border-color:var(--danger); color:var(--danger); }
.chip-check input{ width:auto; margin:0; padding:0; }
.flash-badges{ display:flex; gap:6px; align-items:center; flex:none; }
.level-badge{
  font:inherit; font-size:var(--fs-micro); font-weight:600; cursor:pointer; padding:2px 9px; border-radius:99px;
  border:1px solid transparent; background:var(--paper-sunken); color:var(--ink-soft);
}
.level-badge.level-easy{ background:var(--accent-soft); color:var(--accent); }
.level-badge.level-hard{ background:var(--danger-soft); color:var(--danger); }
.level-badge:hover{ border-color:currentColor; }
.review-nav{ display:flex; gap:var(--sp-3); }

/* ---- Diário ---- */
.journal-layout{ display:grid; grid-template-columns:300px 1fr; gap:var(--sp-6); align-items:start; }
.journal-list-pane{ display:flex; flex-direction:column; gap:var(--sp-3); position:sticky; top:var(--sp-4); max-height:calc(100vh - 2*var(--sp-4)); }
#jr-list{ overflow-y:auto; display:flex; flex-direction:column; gap:var(--sp-4); padding-right:4px; }
.journal-day{ display:flex; flex-direction:column; gap:4px; }
.journal-day-label{ font-size:var(--fs-micro); font-weight:600; letter-spacing:.04em; text-transform:uppercase; color:var(--ink-faint); padding:0 2px; }
.journal-item{
  display:flex; flex-direction:column; gap:2px; text-align:left; cursor:pointer; width:100%;
  background:var(--paper-raised); border:1px solid var(--hairline); border-radius:var(--radius-sm);
  padding:9px 11px; font:inherit; color:var(--ink);
  transition:background var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease);
}
.journal-item:hover{ background:var(--paper-sunken); }
.journal-item.active{ border-color:var(--accent); background:var(--accent-soft); }
.journal-item-title{ font-weight:600; font-size:var(--fs-small); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.journal-item-prev{ font-size:var(--fs-micro); color:var(--ink-soft); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.journal-item-src{ font-size:var(--fs-micro); color:var(--accent); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.journal-empty{ color:var(--ink-faint); font-size:var(--fs-small); padding:var(--sp-3) 2px; line-height:1.5; }
.journal-editor{
  background:var(--paper-raised); border:1px solid var(--hairline); border-radius:var(--radius-md);
  padding:var(--sp-5); display:flex; flex-direction:column; gap:var(--sp-3); min-height:420px;
}
.journal-meta{ display:flex; gap:var(--sp-4); flex-wrap:wrap; align-items:flex-end; }
.journal-meta label{ display:flex; flex-direction:column; gap:4px; font-size:var(--fs-micro); color:var(--ink-faint); margin:0; }
.journal-meta input[type=date]{ width:auto; }
.journal-src{ flex:1; min-width:160px; }
.journal-title{ font-family:var(--font-display); font-size:1.4rem; font-weight:600; border:none; border-bottom:1px solid var(--hairline); border-radius:0; padding:6px 2px; background:transparent; }
.journal-title:focus{ box-shadow:none; border-bottom-color:var(--accent); }
.journal-body{ font-family:var(--font-reading); font-size:var(--fs-reading); line-height:1.75; flex:1; min-height:260px; resize:vertical; border:none; background:transparent; padding:6px 2px; }
.journal-body:focus{ box-shadow:none; }
.journal-foot{ display:flex; align-items:center; gap:var(--sp-4); border-top:1px solid var(--hairline); padding-top:var(--sp-3); }
.journal-foot .btn{ margin-left:auto; }
.journal-placeholder{ margin:auto; text-align:center; color:var(--ink-faint); display:flex; flex-direction:column; align-items:center; gap:var(--sp-2); }
@media (max-width: 880px){
  .journal-layout{ grid-template-columns:1fr; }
  .journal-list-pane{ position:static; max-height:260px; }
}

/* ============================================================ v6.0 — dados, avisos, lixeira */

/* Avisos persistentes (banners) */
.banner-host{ display:flex; flex-direction:column; gap:var(--sp-2); margin-bottom:var(--sp-4); }
.banner-host:empty{ display:none; }
.banner{
  display:flex; align-items:center; justify-content:space-between; gap:var(--sp-4); flex-wrap:wrap;
  padding:var(--sp-3) var(--sp-4); border-radius:var(--radius-md);
  border:1px solid var(--hairline-strong); background:var(--paper-raised);
  font-size:var(--fs-small); color:var(--ink);
}
.banner-text{ flex:1 1 320px; line-height:1.45; }
.banner-actions{ display:flex; align-items:center; gap:var(--sp-2); flex-wrap:wrap; }
.banner-info{ background:var(--accent-soft); border-color:transparent; }
.banner-warn{ background:var(--plum-soft); border-color:transparent; }
.banner-danger{ background:var(--danger-soft); border-color:var(--danger); }
.banner-x{ background:none; border:none; cursor:pointer; color:var(--ink-soft); font-size:20px; line-height:1; padding:2px 6px; border-radius:var(--radius-sm); }
.banner-x:hover{ color:var(--ink); background:var(--paper-sunken); }

/* Modal com várias saídas empilhadas */
.modal-actions-stack{ flex-direction:column; align-items:stretch; }
.modal-actions-stack .btn{ justify-content:center; }

/* Configurações → Dados e backup */
.setting-row.ds-block{ align-items:flex-start; }
.setting-row select{ width:auto; min-width:140px; }
.ds-counts{ margin-top:var(--sp-2); color:var(--ink); }
.ds-meter{ height:8px; border-radius:var(--radius-pill); background:var(--paper-sunken); overflow:hidden; margin-top:var(--sp-3); }
.ds-meter > div{ height:100%; background:var(--accent); border-radius:var(--radius-pill); }
.ds-meter-label{ font-size:var(--fs-micro); margin-top:var(--sp-1); color:var(--ink-soft); }
.ds-ok{ margin-top:var(--sp-3); color:var(--accent); }
.ds-warn{ margin-top:var(--sp-3); color:var(--ink); background:var(--plum-soft); padding:var(--sp-2) var(--sp-3); border-radius:var(--radius-sm); display:flex; align-items:center; gap:var(--sp-3); flex-wrap:wrap; }
.ds-list{ margin-top:var(--sp-3); display:flex; flex-direction:column; }
.ds-item{ display:flex; align-items:center; justify-content:space-between; gap:var(--sp-3); padding:var(--sp-2) 0; border-top:1px solid var(--hairline); flex-wrap:wrap; }
.ds-item:first-child{ border-top:none; }
.ds-item-main{ min-width:0; flex:1 1 220px; }
.ds-item-title{ font-weight:600; color:var(--ink); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ds-item-sub{ font-size:var(--fs-micro); color:var(--ink-soft); }
.ds-item-actions{ display:flex; gap:var(--sp-1); }
.ds-empty{ font-size:var(--fs-small); color:var(--ink-faint); }

/* Cartão cuja fonte foi removida */
.flash-source-link.is-gone{ color:var(--ink-faint); cursor:default; }

/* ============================================================ v6.1 — revisão */

/* Artigo colorido (o texto do artigo sempre aparece; a cor só reforça). Cores com contraste nos dois temas. */
:root{ --g-der:#2b62a8; --g-die:#b8365a; --g-das:#2a7d52; }
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]){ --g-der:#86b6ee; --g-die:#f291a8; --g-das:#84d3a6; } }
:root[data-theme="dark"]{ --g-der:#86b6ee; --g-die:#f291a8; --g-das:#84d3a6; }
.art{ font-weight:600; }
:root[data-gender-colors="on"] .art-der{ color:var(--g-der); }
:root[data-gender-colors="on"] .art-die{ color:var(--g-die); }
:root[data-gender-colors="on"] .art-das{ color:var(--g-das); }

/* Cabeçalho com dois botões */
.view-head-actions{ display:flex; gap:var(--sp-2); flex-wrap:wrap; align-items:center; }
.view-head-actions[hidden]{ display:none; }

/* Painel "hoje" */
.today-panel{
  display:flex; align-items:center; gap:var(--sp-5); margin-bottom:var(--sp-5);
  padding:var(--sp-4) var(--sp-5); border-radius:var(--radius-md);
  background:var(--accent-soft); border:1px solid transparent;
}
.today-num{ font-family:var(--font-display); font-size:2.4rem; font-weight:700; line-height:1; color:var(--accent); min-width:2ch; text-align:center; font-variant-numeric:tabular-nums; }
.today-title{ font-weight:600; color:var(--ink); }
.today-detail{ font-size:var(--fs-small); color:var(--ink-soft); line-height:1.5; }
.today-deferred{ color:var(--ink); }

/* Selos */
.badge-leech{ background:var(--danger-soft); color:var(--danger); }
.flash-card.is-archived{ opacity:.65; }
.flash-context-extra{ font-size:var(--fs-small); opacity:.85; }
.speak-mini, .speak-btn{ background:none; border:none; cursor:pointer; color:var(--ink-soft); padding:2px 4px; border-radius:var(--radius-sm); vertical-align:middle; display:inline-flex; align-items:center; }
.speak-mini:hover, .speak-btn:hover{ color:var(--accent); background:var(--paper-sunken); }
.speak-btn svg{ width:20px; height:20px; }
.fav-btn.on{ color:var(--accent); }

/* Sessão de revisão */
.review-progress{ width:100%; max-width:560px; height:4px; border-radius:var(--radius-pill); background:var(--paper-sunken); overflow:hidden; }
.review-progress > div{ height:100%; background:var(--accent); transition:width var(--dur-base) var(--ease); }
.review-meta{ display:flex; align-items:center; gap:var(--sp-2); flex-wrap:wrap; justify-content:center; }
.flip-card[role="button"]{ cursor:pointer; }
.flip-card:focus-visible{ outline:2px solid var(--accent); outline-offset:4px; border-radius:var(--radius-md); }
.rate-btn.grade-again{ color:var(--danger); }
#rv-grades{ display:flex; flex-direction:column; align-items:center; gap:var(--sp-3); }
#rv-grades[hidden]{ display:none; }
.review-nav{ flex-wrap:wrap; justify-content:center; }
kbd{
  font-family:var(--font-ui); font-size:var(--fs-micro); padding:1px 6px; margin-left:6px;
  border:1px solid var(--hairline-strong); border-bottom-width:2px; border-radius:var(--radius-sm);
  background:var(--paper-raised); color:var(--ink-soft);
}
.btn-primary kbd{ background:transparent; color:inherit; border-color:currentColor; opacity:.8; }

/* Resumo */
.review-summary{ max-width:640px; margin:0 auto; padding:var(--sp-6) 0; display:flex; flex-direction:column; gap:var(--sp-4); }
.summary-tiles{ display:grid; grid-template-columns:repeat(3, 1fr); gap:var(--sp-3); }
.summary-tile{ padding:var(--sp-4); border-radius:var(--radius-md); background:var(--paper-sunken); display:flex; flex-direction:column; gap:2px; }
.summary-tile b{ font-family:var(--font-display); font-size:1.5rem; }
.summary-tile span{ font-size:var(--fs-small); color:var(--ink-soft); }
.summary-split{ display:flex; gap:var(--sp-2); flex-wrap:wrap; }
.grade-pill{ padding:4px 12px; border-radius:var(--radius-pill); background:var(--paper-sunken); font-size:var(--fs-small); }
.grade-pill.grade-again{ background:var(--danger-soft); color:var(--danger); }
.grade-pill.grade-good, .grade-pill.grade-easy{ background:var(--accent-soft); color:var(--accent); }
.summary-list{ display:flex; flex-direction:column; }
.summary-row{ display:flex; align-items:center; justify-content:space-between; gap:var(--sp-3); padding:var(--sp-2) 0; border-top:1px solid var(--hairline); }
.summary-row:first-child{ border-top:none; }
.summary-front{ font-family:var(--font-display); font-weight:600; }
.summary-back{ color:var(--ink-soft); margin-left:var(--sp-2); }
.summary-actions{ display:flex; gap:var(--sp-2); flex-wrap:wrap; margin-top:var(--sp-2); }