@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700&display=swap');

:root{
  --bg: #f8fafc;
  --card: #ffffff;
  --text: #0f172a;
  --muted: #64748b;
  --line: #e2e8f0;
  --primary: #2563eb;
  --primary-2: #1d4ed8;
  --history-study-accent: var(--primary);
  --success: #16a34a;
  --accent: var(--success);
  --ring: rgba(37,99,235,.18);
  --shadow: 0 10px 30px rgba(2,6,23,.07);
  --shadow-soft: 0 10px 24px rgba(2,6,23,.05);
  --radius: 18px;
  --radius-sm: 14px;
  --panel: rgba(255,255,255,.70);
  --panel2: rgba(255,255,255,.80);
  --ink: rgba(15,23,42,.06);
}


/* ---- Modal: níveis por tópico ---- */
.topic-levels-table{display:flex;flex-direction:column;gap:10px;}
.tl-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;}
.tl-legend{display:flex;flex-wrap:wrap;gap:12px;font-size:12px;color:#556;line-height:1.2;}
.tl-row{display:flex;align-items:center;justify-content:space-between;gap:12px;border:1px solid #e7eaf3;border-radius:12px;padding:10px 12px;overflow-x:hidden;}
.tl-title-toggle{display:flex;align-items:center;gap:8px;flex:1 1 auto;min-width:0;border:0;background:transparent;padding:0;text-align:left;cursor:pointer;color:inherit;font:inherit;}
.tl-title{font-size:14px;font-weight:600;color:#1b2340;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.tl-caret{font-size:12px;color:#64748b;transition:transform .2s ease;}
.tl-title-toggle[aria-expanded="true"] .tl-caret{transform:rotate(180deg);}
.tl-options{display:flex;gap:8px;flex:0 0 auto;flex-wrap:wrap;justify-content:flex-end;}
.tl-opt{display:flex;align-items:center;gap:6px;border:1px solid #e7eaf3;border-radius:999px;padding:6px 8px;cursor:pointer;user-select:none;font-size:12px;color:#223;}
.tl-opt input{margin:0;}

@media (max-width: 820px){
  .tl-row{flex-direction:column;align-items:flex-start;}
  .tl-title{min-width:auto;white-space:normal;}
  .tl-options{flex-wrap:wrap;justify-content:flex-start;}
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  color: var(--text);
  background: var(--bg);
}

a{color:inherit; text-decoration:none}

/* Generic flex row helper (used throughout templates) */
.row{display:flex;align-items:center;gap:10px;}
.row.wrap{flex-wrap:wrap;}

/* Landing: clamp feature titles to 2 lines to avoid ugly wrapping */
.feature-title{
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
  overflow:hidden;
  line-height:1.15;
  min-height:2.3em; /* ensures consistent card height */
}

/* Public footer (landing) */
.site-footer{padding:22px 0 38px; border-top:1px solid rgba(15,23,42,.08); margin-top:18px;}
.site-footer-inner{max-width:1200px;margin:0 auto;padding:0 18px;display:grid;grid-template-columns:1fr auto 1fr;gap:16px;align-items:center;}
.footer-left{justify-self:start;}
.footer-brand-wrap{display:flex;align-items:center;gap:8px;}
.footer-logo{width:34px;height:34px;object-fit:contain;}
.footer-brand{font-weight:700; color:#0f172a;}
.footer-center{justify-self:center;}
.footer-links{display:flex;gap:14px;flex-wrap:wrap;align-items:center;justify-self:end;}
.footer-link{color:var(--muted);font-size:14px;}
.footer-link:hover{color:var(--text);text-decoration:underline;}
.footer-social{display:flex;gap:10px;align-items:center;}
.footer-ig{width:38px;height:38px;border-radius:12px;display:flex;align-items:center;justify-content:center;border:1px solid rgba(15,23,42,.10);background:rgba(255,255,255,.7)}
.footer-ig:hover{border-color:rgba(37,99,235,.35);box-shadow:0 8px 18px rgba(2,6,23,.08)}
.ig-dot{font-weight:700; font-size:18px; line-height:1;}

@media (max-width: 900px){
  .site-footer-inner{grid-template-columns:1fr;justify-items:center;text-align:center;}
  .footer-left,.footer-center,.footer-links{justify-self:center;}
}

.cookie-banner{
  position:fixed;
  left:16px;
  right:16px;
  bottom:16px;
  z-index:90;
  border:1px solid rgba(15,23,42,.14);
  border-radius:14px;
  background:rgba(248,250,252,.96);
  box-shadow:0 14px 28px rgba(2,6,23,.14);
  padding:12px 14px;
  display:flex;
  gap:12px;
  align-items:center;
  justify-content:space-between;
  color:#334155;
}
.cookie-banner__text{font-size:13px; line-height:1.45; font-weight:500; color:#334155;}
.cookie-banner__actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
.cookie-banner__link{font-size:13px;font-weight:600;color:#1d4ed8;text-decoration:underline;}

/* Mobile polish: prevent top nav from exploding */
@media (max-width: 820px){
  .topbar-inner{gap:10px}
  .topnav .navlink{display:none;}
  body:not(.app-shell) .topnav .navlink.navlink-login{display:inline-flex;}
  .topnav .nav-sep{display:none;}
  .brand-sub{display:none;}
  .price-card{width:100%;max-width:520px;}
  .pricing{justify-content:center;}
}

/* subtle background blobs */
body::before{
  content:"";
  position:fixed;
  inset:-42vh -22vw auto auto;
  width:62vw;
  height:62vw;
  background:
    radial-gradient(circle at 30% 30%, rgba(37,99,235,.16), rgba(37,99,235,0) 62%),
    radial-gradient(circle at 70% 55%, rgba(16,185,129,.10), rgba(16,185,129,0) 58%),
    radial-gradient(circle at 40% 85%, rgba(99,102,241,.10), rgba(99,102,241,0) 55%);
  filter: blur(12px);
  pointer-events:none;
  z-index:0;
}

/* ---------- LAYOUTS ---------- */
.layout{
  position:relative;
  z-index:1;
  display:flex;
  min-height:100vh;
}

.layout.no-sidebar{
  display:block;
  min-height:100vh;
}

.container{
  width:100%;
  max-width: 1320px;
  margin: 0 auto;
  /* aproximar o conteúdo da borda esquerda (menos "respiro" lateral) */
  padding: 26px 24px 56px;
}

/* App shell: não centralizar, aproximar da borda esquerda */
body.app-shell .container{
  max-width: none;
  margin: 0;
  padding: 0;
}

/* App shell: dar mais presença e largura ao painel */
body.app-shell .layout{
  gap: 0;
  background: radial-gradient(900px 400px at 80% 0%, rgba(37,99,235,.10), rgba(255,255,255,0)),
              radial-gradient(700px 320px at 20% 20%, rgba(16,185,129,.08), rgba(255,255,255,0)),
              var(--bg);
}
body.app-shell .sidebar{border-radius: 0;}
body.app-shell .main{padding: 28px 28px 40px;}


/* Em telas muito largas, manter um respiro à direita mas puxar tudo para a esquerda */
@media (min-width: 1200px){
  body.app-shell .container{
    padding-left: 10px;
    padding-right: 16px;
  }
}

/* App shell topbar: não centralizar (evita espaço grande à esquerda em telas largas) */
body.app-shell .topbar-inner{
  max-width: none;
  margin: 0;
  padding-left: 14px;
  padding-right: 14px;
}

@media (min-width: 1200px){
  body.app-shell .topbar-inner{
    padding-left: 10px;
    padding-right: 16px;
  }
}

/* Footer acompanha o app shell */
body.app-shell .footer{
  max-width: none;
  margin-left: 0;
  margin-right: 0;
}


/* ---------- TOPBAR (public) ---------- */
.topbar{
  position:sticky;
  top:0;
  z-index:5;
  backdrop-filter: blur(10px);
  background: rgba(246,248,252,.75);
  border-bottom:1px solid var(--line);
}

.topbar-inner{
  max-width:1200px;
  margin:0 auto;
  padding: 16px 20px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
}

/* App shell: topbar acompanha o conteúdo (sem centralizar) */
body.app-shell .topbar-inner{
  max-width: none;
  margin: 0;
  padding-left: 14px;
  padding-right: 14px;
}

.topbar-brand{display:flex; align-items:center; gap:10px; font-weight:700}
.brand-mark{width:10px; height:10px; border-radius:999px; background: var(--primary)}
.topbar-actions{display:flex; align-items:center; gap:10px}

/* ---------- SIDEBAR (app) ---------- */
.sidebar{
  width: 236px;
  padding: 16px 14px;
  border-right:1px solid var(--line);
  background: rgba(255,255,255,.92);
}

/* blocos do menu lateral */
.sidebox{
  background: transparent;
  border: none;
  border-radius: 0;
  padding: 0;
  box-shadow: none;
  margin-bottom: 16px;
}

.side-title{
  font-size: 12px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: #64748b;
  margin: 0 0 10px;
}

.side-welcome{
  padding: 8px 10px;
  border-radius: 12px;
  background: rgba(37,99,235,.06);
  border: 1px solid rgba(37,99,235,.12);
  margin: 8px 0 12px;
}

.side-welcome-name{
  font-weight: 600;
  letter-spacing: -0.02em;
  margin-top: 2px;
}

/* Sidebar (menu lateral) - links */
.nav-btn{
  display: block;
  width: 100%;
  text-decoration: none;
  color: var(--text);
  padding: 10px 10px;
  border-radius: 10px;
  margin: 2px 0;
  font-weight: 600;
  background: transparent;
  border: 1px solid transparent;
  transition: background .12s ease, color .12s ease;
}

.nav-btn:hover{
  background: rgba(2,6,23,.04);
}

.nav-btn.active{
  background: rgba(37,99,235,0.10);
  border-color: rgba(37,99,235,0.18);
  color: #1d4ed8;
  border-left: 3px solid rgba(37,99,235,0.9);
  padding-left: 7px;
}

/* ---------- ADMIN DASHBOARD ---------- */
body.app-shell .main{padding-top: 8px;}

.admin-dashboard{max-width: none;}

.admin-header{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
  margin-bottom: 14px;
}

.admin-title{
  margin: 0;
  font-size: 22px;
  font-weight: 600;
  letter-spacing: -0.02em;
}

.admin-sub{color: var(--muted); font-size: 13px; margin-top: 6px; line-height:1.5}

.admin-actions{display:flex; gap:10px; flex-wrap:wrap;}

.admin-toolbar{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  padding: 12px;
  background: rgba(255,255,255,.75);
  border: 1px solid var(--line);
  border-radius: 14px;
}

.tool-link{
  display:inline-flex;
  align-items:center;
  padding: 10px 14px;
  border-radius: 999px;
  text-decoration:none;
  font-weight: 600;
  font-size: 13px;
  color: var(--text);
  background: rgba(255,255,255,.60);
  border: 1px solid rgba(15,23,42,0.08);
}
.tool-link:hover{
  background: rgba(37,99,235,.10);
  border-color: rgba(37,99,235,.20);
  color: #1d4ed8;
}

.admin-section{margin-top: 14px;}

.section-head{margin-bottom: 12px;}
.section-title{margin: 0; font-size: 16px; font-weight: 600; letter-spacing:-0.01em}

.kpi-grid{
  display:grid;
  grid-template-columns: repeat(4, minmax(160px, 1fr));
  gap: 12px;
}

.kpi{
  background: rgba(255,255,255,.9);
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 14px;
}

.kpi-label{color: var(--muted); font-size: 12px; font-weight: 700; letter-spacing:.02em}
.kpi-value{font-size: 22px; font-weight: 700; margin-top: 4px;}

.admin-panel{
  background: rgba(255,255,255,.9);
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 14px;
}

.panel-head{display:flex; align-items:flex-end; justify-content:space-between; gap:12px; flex-wrap:wrap; margin-bottom: 8px}
.panel-title{font-weight: 700; letter-spacing:-0.01em}

.nav-section-title{
  margin: 2px 0 10px;
  font-size: 12px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: #64748b;
}

.brand{display:flex; align-items:center; gap:12px; margin-bottom: 18px}
.brand-dot{width:10px; height:10px; border-radius:999px; background: var(--primary)}
.brand-title{font-weight:600; letter-spacing:-.02em}
.brand-sub{font-size:12px; color: var(--muted)}

.nav{display:flex; flex-direction:column; gap:8px; margin-top: 14px}
.nav-link{
  display:flex;
  align-items:center;
  gap:10px;
  padding: 10px 12px;
  border-radius: 12px;
  color: var(--text);
  border: 1px solid transparent;
}
.nav-link:hover{background: rgba(37,99,235,.06); border-color: rgba(37,99,235,.12)}
.nav-link.active{background: rgba(37,99,235,.10); border-color: rgba(37,99,235,.18)}

.main{flex:1; min-width:0; width:100%}

.main > .card{width:100%;}
.main > section{width:100%;}

/* ---------- COMMON UI ---------- */
.card{
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow-soft);
  padding: 26px;
}

.page-title{
  font-size: 22px;
  font-weight: 700;
  letter-spacing: -0.02em;
  margin: 2px 0 14px;
}

.page-head{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:14px;}
.page-head .sub{color: var(--muted); font-size: 13px; margin-top: 4px; line-height:1.5}
.page-actions{display:flex;gap:10px;flex-wrap:wrap;}
.card.soft{background: rgba(255,255,255,.70);}

.grid{
  display:grid;
  grid-template-columns: repeat(12, 1fr);
  gap: 18px;
}

.span-4{grid-column: span 4}
.span-6{grid-column: span 6}
.span-12{grid-column: span 12}

.muted{color: var(--muted)}

/* ---------------- Charts (/charts) ---------------- */
.table-scroll{ overflow:auto; }
.sp-table{ width:100%; border-collapse:separate; border-spacing:0; min-width:720px; }
.sp-table thead th{
  font-size:12px;
  font-weight:700;
  padding:12px 14px;
  text-align:center;
  background: rgba(2,6,23,.35);
  border-bottom:1px solid rgba(255,255,255,.06);
}
.sp-table thead th:first-child{ text-align:left; }
.sp-table tbody td, .sp-table tfoot td{
  padding:12px 14px;
  border-bottom:1px solid rgba(255,255,255,.06);
  text-align:center;
}
.sp-table tbody tr:hover td{ background: rgba(255,255,255,.03); }
.sp-td-title{ text-align:left !important; font-weight:600; }
.sp-td-total{ text-align:left !important; font-weight:600; letter-spacing:.2px; }
.sp-table tfoot td{ background: rgba(2,6,23,.45); font-weight:700; }

.topics-tree{ display:flex; flex-direction:column; gap:10px; }
.topic-group{ border:1px solid rgba(255,255,255,.08); border-radius:14px; overflow:hidden; background: rgba(2,6,23,.28); }
.topic-group summary{
  cursor:pointer;
  list-style:none;
  padding:12px 14px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  font-weight:700;
}
.topic-group summary::-webkit-details-marker{ display:none; }
.topic-rows{ padding:10px 12px 14px; display:flex; flex-direction:column; gap:10px; }
.topic-rows .topic-row{ display:grid; grid-template-columns: 1fr 220px 120px; gap:12px; align-items:center; }
.topic-label{ font-size:13px; line-height:1.25; opacity:.95; }
.topic-bar{ height:10px; border-radius:999px; background: rgba(255,255,255,.10); overflow:hidden; position:relative; }
.topic-bar-inner{ height:100%; border-radius:999px; background: #22c55e; }
.topic-metrics{ text-align:right; font-variant-numeric: tabular-nums; }
.topic-acc{ font-weight:600; color:#22c55e; margin-right:6px; }

@media (max-width: 900px){
  .sp-table{ min-width: 680px; }
  .topic-rows .topic-row{ grid-template-columns: 1fr 160px 110px; }
}

.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding: 10px 14px;
  border-radius: 12px;
  background: var(--primary);
  color: #fff;
  font-weight:600;
  border: 1px solid rgba(255,255,255,.15);
  box-shadow: 0 10px 24px rgba(37,99,235,.18);
}
.btn:hover{background: var(--primary-2)}
.btn.btn-sm{padding:8px 12px; border-radius:12px; font-size:13px;}
.btn-ghost{
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.10);
  box-shadow: none;
  color: var(--text);
}
.btn.btn-ghost:hover{ background: rgba(255,255,255,.10); }
.btn.secondary{
  background: #fff;
  color: var(--text);
  border: 1px solid var(--line);
  box-shadow: none;
}
.btn.secondary:hover{border-color: rgba(37,99,235,.22); box-shadow: 0 10px 24px rgba(2,6,23,.06)}
.btn.block{width:100%}

.input,
select.input,
.textarea,
textarea.input{
  width:100%;
  padding: 11px 12px;
  border-radius: 12px;
  border: 1px solid var(--line);
  background: rgba(255,255,255,.55);
  outline:none;
  font: inherit;
  color: var(--text);
}
.textarea,
textarea.input{min-height: 112px; resize: vertical;}
.input:focus,
select.input:focus,
.textarea:focus,
textarea.input:focus{border-color: rgba(37,99,235,.45); box-shadow: 0 0 0 5px var(--ring)}

/* ---------- Combobox (dropdown pesquisável) ---------- */
.combo{ position:relative; }
.combo-btn{
  position:absolute;
  right:10px;
  top:50%;
  transform: translateY(-50%);
  width:36px;
  height:36px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius: 12px;
  border: 1px solid rgba(15,23,42,.06);
  background: rgba(255,255,255,.55);
  color: #334155;
  cursor:pointer;
}
.combo-btn:hover{ background: rgba(255,255,255,.72); border-color: rgba(37,99,235,.18); }
.combo .input{ padding-right: 54px; }

.combo-menu{
  position:absolute;
  left:0; right:0;
  top: calc(100% + 8px);
  background: rgba(255,255,255,.92);
  border: 1px solid var(--line);
  border-radius: 14px;
  box-shadow: var(--shadow-soft);
  overflow:hidden;
  max-height: 320px;
  overflow-y:auto;
  display:none;
  z-index: 20;
}
.combo[data-open="1"] .combo-menu{ display:block; }

.combo-item{
  width:100%;
  text-align:left;
  padding: 10px 12px;
  border:0;
  background: transparent;
  cursor:pointer;
  font: inherit;
  color: var(--text);
}
.combo-item:hover{ background: rgba(37,99,235,.08); }

.combo-empty{
  padding: 12px;
  color: var(--muted);
  font-size: 13px;
}

.form-row{display:flex; flex-direction:column; gap:8px; margin-top: 14px}
.label{font-size: 13px; font-weight:600}
.help{font-size: 12px; color: var(--muted)}

.alert{
  background: rgba(239,68,68,.14);
  border: 1px solid rgba(239,68,68,.35);
  color: #7f1d1d;
  padding: 10px 12px;
  border-radius: 12px;
  margin-bottom: 12px;
}

/* Flash variants (padronização global de avisos) */
.alert.success{
  background: rgba(16,185,129,.14);
  border-color: rgba(16,185,129,.32);
  color: #064e3b;
}
.alert.warning{
  background: rgba(245,158,11,.14);
  border-color: rgba(245,158,11,.32);
  color: #78350f;
}
.alert.info{
  background: rgba(37,99,235,.12);
  border-color: rgba(37,99,235,.30);
  color: #1e3a8a;
}
.alert.error{
  background: rgba(239,68,68,.14);
  border-color: rgba(239,68,68,.35);
  color: #7f1d1d;
}



/* ---------- LANDING ---------- */
.hero{
  padding: 18px 0 4px;
}
.hero-inner{
  display:grid;
  grid-template-columns: 1.1fr .9fr;
  gap: 18px;
  align-items:stretch;
}
.hero-copy h1{
  font-size: 46px;
  line-height: 1.05;
  letter-spacing: -.03em;
  margin: 12px 0 10px;
}
.hero-copy p{margin:0 0 16px; color: var(--muted); font-size: 16px; line-height: 1.6}
.pill{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding: 8px 10px;
  border-radius: 999px;
  background: rgba(37,99,235,.08);
  border: 1px solid rgba(37,99,235,.14);
  color: var(--text);
  font-weight:600;
  font-size: 12px;
}

.hero-actions{display:flex; gap: 10px; flex-wrap:wrap}

.hero-preview{
  position:relative;
  overflow:hidden;
}
.hero-preview::before{
  content:"";
  position:absolute;
  inset:-40% -40% auto auto;
  width: 520px;
  height: 520px;
  background: radial-gradient(circle at 30% 30%, rgba(37,99,235,.24), rgba(37,99,235,0) 60%);
  transform: rotate(12deg);
}
.preview-grid{position:relative; display:grid; grid-template-columns: 1fr 1fr; gap:12px}
.mini{
  border-radius: 16px;
  border: 1px solid var(--line);
  background: rgba(255,255,255,.55);
  padding: 14px;
}
.mini-title{font-weight:700; margin:0 0 6px}
.mini p{margin:0; color: var(--muted); font-size: 13px; line-height: 1.5}
.mini.big{grid-column: span 2}

.features{margin-top: 14px}
.feature{
  display:flex;
  gap: 12px;
  align-items:flex-start;
}
.icon{
  width: 38px;
  height: 38px;
  border-radius: 14px;
  background: rgba(37,99,235,.08);
  border: 1px solid rgba(37,99,235,.14);
  display:flex;
  align-items:center;
  justify-content:center;
}
.icon svg{width:18px; height:18px; fill: var(--primary)}
.feature h3{margin:0 0 6px; font-size: 15px}
.feature p{margin:0; color: var(--muted); font-size: 13px; line-height: 1.55}

/* ---------- AUTH ---------- */
.auth{
  display:grid;
  grid-template-columns: 1fr;
  place-items:center;
  min-height: calc(100vh - 90px);
  padding: 12px 0 40px;
}
.auth-card{max-width: 640px; width: 100%}
.auth-header h2{margin:0 0 6px; font-size: 22px}
.auth-header p{margin:0; color: var(--muted); font-size: 13px; line-height: 1.5}
.form-actions{display:flex; gap: 10px; margin-top: 16px}
.form-actions .btn{flex:1}
.auth-foot{margin-top: 14px; font-size: 13px; color: var(--muted)}
.auth-foot a{color: var(--primary); font-weight:600}

.auth-split{
  grid-template-columns: 1.1fr .9fr;
  gap: 18px;
  align-items: stretch;
}
.auth-side{
  border: 1px solid rgba(15,23,42,.08);
  background: rgba(255,255,255,.55);
  border-radius: 20px;
  padding: 22px;
  box-shadow: 0 12px 28px rgba(2,6,23,.06);
}
.auth-side .pill{display:inline-block}
.auth-side ul{margin: 10px 0 0 16px; padding:0}
.auth-side li{margin: 8px 0; color: var(--muted)}

/* benefits list (login split) */
.auth-benefits{ margin-top: 14px; display:flex; flex-direction:column; gap: 10px; }
.benefit{ display:flex; align-items:flex-start; gap: 10px; }
.benefit-ico{
  width: 20px; height: 20px;
  border-radius: 999px;
  display:flex; align-items:center; justify-content:center;
  background: rgba(16,185,129,.14);
  border: 1px solid rgba(16,185,129,.22);
  color: rgba(5,150,105,1);
  font-weight: 700;
  flex: 0 0 auto;
  margin-top: 2px;
}
.benefit-t{ font-weight: 700; }
.small{ font-size: 13px; line-height: 1.5; }

.auth-links{
  display:flex;
  justify-content:space-between;
  gap: 10px;
  flex-wrap:wrap;
  margin-top: 10px;
  font-size: 13px;
}
.auth-links a{color: var(--primary); font-weight:700}

.check{
  display:flex;
  align-items:center;
  gap: 10px;
  margin-top: 10px;
  user-select:none;
}
.check input{width: 16px; height: 16px}

.tiny-note{
  margin-top: 12px;
  padding: 10px 12px;
  border-radius: 14px;
  border: 1px solid rgba(15,23,42,.08);
  background: rgba(2,6,23,.02);
}

@media (max-width: 980px){
  .auth-split{grid-template-columns: 1fr;}
}

/* Split auth layout (login/forgot/reset) */
.auth.auth-split{
  grid-template-columns: 1.05fr 0.95fr;
  gap: 22px;
  align-items: stretch;
  padding-top: 22px;
}
.auth-side{
  width: 100%;
  max-width: 640px;
  padding: 22px 22px;
  border-radius: var(--radius);
  background: rgba(255,255,255,.55);
  border: 1px solid rgba(15,23,42,.08);
  box-shadow: 0 18px 50px rgba(2,6,23,.06);
}
.auth-side .mini-grid{ display:grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; margin-top: 14px; }
.mini-card{ padding: 12px 12px; border-radius: 14px; border: 1px solid rgba(15,23,42,.08); background: rgba(255,255,255,.66); }
.mini-k{ font-weight: 700; letter-spacing: -0.02em; }
.mini-v{ font-size: 12px; color: var(--muted); margin-top: 2px; line-height:1.3 }

.auth-links{ display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; margin-top: 10px; }
.auth-links a{ color: var(--primary); font-weight: 700; }
.check{ display:flex; align-items:center; gap: 8px; user-select:none; font-size: 13px; color: var(--muted); }
.check input{ width: 16px; height:16px; }

@media (max-width: 980px){
  .auth.auth-split{ grid-template-columns: 1fr; }
  .auth-side{ order: 2; }
}

/* ---------- RESPONSIVE ---------- */

/* timer visibility */
#timer_stop[disabled]{ display:none; }

@media (max-width: 980px){
  .sidebar{display:none}
  .layout{display:block}
  .container{padding-top: 18px}
  .hero-inner{grid-template-columns: 1fr}
  .hero-copy h1{font-size: 38px}
}

@media (max-width: 720px){
  .grid{grid-template-columns: 1fr}
  .span-4, .span-6, .span-12{grid-column: auto}
}



/* ---------- Topbar (global) ---------- */
.topbar{
  position: sticky;
  top: 0;
  z-index: 50;
  backdrop-filter: blur(10px);
  background: rgba(255,255,255,.55);
  border-bottom: 1px solid rgba(15,23,42,.08);
}
.topbar-inner{
  max-width: 1320px;
  margin: 0 auto;
  padding: 14px 20px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
}
.brand{ display:flex; align-items:center; gap:12px; text-decoration:none; color:inherit; }
.brand-mark{
  width:48px;height:48px;border-radius:14px;
  background: linear-gradient(135deg, rgba(37,99,235,.18), rgba(99,102,241,.18));
  border: 1px solid rgba(37,99,235,.22);
  display:flex;align-items:center;justify-content:center;
  font-weight:700; letter-spacing:.5px;
}
.brand-mark img{
  width: 80%;
  height: 80%;
  object-fit: contain;
  display:block;
}
.brand-title{ font-weight:700; line-height:1; }
.brand-sub{ font-size:12px; color: var(--muted); margin-top:2px; }
.topnav{ display:flex; align-items:center; gap:10px; }
.navlink{
  color: var(--muted);
  text-decoration:none;
  padding:8px 10px;
  border-radius:10px;
}
.navlink:hover{ background: rgba(15,23,42,.05); color: var(--text); }
.nav-sep{ width:1px; height:22px; background: rgba(15,23,42,.12); margin: 0 4px; }
.nav-user{ font-size:13px; color: var(--muted); max-width:220px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

.user-menu{ position: relative; }
.user-menu-trigger{
  list-style: none;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  cursor: pointer;
  padding: 8px 10px;
  border-radius: 10px;
  color: var(--muted);
  border: 1px solid rgba(15,23,42,.10);
  background: rgba(255,255,255,.72);
}
.user-menu-trigger::-webkit-details-marker{ display:none; }
.user-menu[open] .user-menu-trigger,
.user-menu-trigger:hover{ color: var(--text); background: rgba(15,23,42,.05); }
.user-menu-popover{
  position: absolute;
  right: 0;
  top: calc(100% + 8px);
  min-width: 220px;
  display: grid;
  gap: 2px;
  padding: 8px;
  border-radius: 12px;
  border: 1px solid rgba(15,23,42,.12);
  background: #fff;
  box-shadow: 0 18px 42px rgba(2,6,23,.18);
  z-index: 90;
}
.user-menu-item{
  text-decoration:none;
  color: var(--text);
  font-size: 14px;
  border-radius: 8px;
  padding: 9px 10px;
}
.user-menu-item:hover{ background: rgba(15,23,42,.06); }
.user-menu-item.danger{ color: rgb(185,28,28); }

.user-menu-backdrop{
  position: fixed;
  inset: 0;
  background: rgba(2,6,23,.12);
  z-index: 45;
}

body.app-shell .user-menu-mobile-nav{ display:none; }

/* ---------- Shell adjustments ---------- */
.container{ max-width: 1320px; }
.app-shell{ padding-top: 18px; }
.sidebar{ position: sticky; top: 76px; height: calc(100vh - 96px); }
.content{ min-height: 60vh; }

/* ---------- Landing (hero) ---------- */
.hero{
  position: relative;
  margin-top: 18px;
  border-radius: 22px;
  overflow: hidden;
  border: 1px solid rgba(15,23,42,.08);
  background: #fff;
}
.hero-bg{
  position:absolute; inset:0;
  background:
    radial-gradient(800px 300px at 20% 15%, rgba(37,99,235,.20), transparent 60%),
    radial-gradient(600px 260px at 80% 20%, rgba(99,102,241,.22), transparent 60%),
    radial-gradient(700px 280px at 40% 100%, rgba(14,165,233,.16), transparent 60%);
  pointer-events:none;
}
.hero-inner{
  position: relative;
  padding: 38px 28px;
  display:grid;
  grid-template-columns: 1.25fr .85fr;
  gap: 26px;
  align-items: center;
}
.pill{
  display:inline-flex;
  gap:8px;
  padding:6px 10px;
  border-radius:999px;
  font-size:12px;
  color: rgba(37,99,235,1);
  background: rgba(37,99,235,.10);
  border: 1px solid rgba(37,99,235,.16);
  font-weight:700;
}
.hero-title{
  margin: 14px 0 0;
  font-size: 44px;
  letter-spacing: -0.03em;
  line-height: 1.05;
}
.grad{
  background: linear-gradient(90deg, #2563eb, #6366f1, #0ea5e9);
  -webkit-background-clip:text;
  background-clip:text;
  color: transparent;
}
.hero-sub{
  margin: 12px 0 0;
  color: var(--muted);
  font-size: 16px;
  line-height: 1.6;
  max-width: 56ch;
}
.hero-cta{ margin-top: 18px; display:flex; gap:10px; flex-wrap:wrap; }
.btn-lg{ padding: 12px 14px; border-radius: 14px; }
.hero-metrics{
  margin-top: 18px;
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}
.metric{
  background: rgba(255,255,255,.55);
  border: 1px solid rgba(15,23,42,.08);
  border-radius: 16px;
  padding: 16px 16px;
  min-height: 76px;
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.metric-k{ font-weight: 700; font-size: 12px; line-height: 1.25; }
.metric-v{ color: var(--muted); font-size: 12px; margin-top: 3px; }

.hero-card{
  background: rgba(255,255,255,.55);
  border: 1px solid rgba(15,23,42,.10);
  border-radius: 18px;
  padding: 14px;
  box-shadow: 0 18px 40px rgba(15,23,42,.08);
}
.mock{ border-radius: 14px; overflow:hidden; border: 1px solid rgba(15,23,42,.10); background: rgba(255,255,255,.55); }
.mock-top{ display:flex; gap:6px; padding: 10px; border-bottom: 1px solid rgba(15,23,42,.08); }
.dot{ width:10px; height:10px; border-radius:999px; background: rgba(15,23,42,.18); }
.mock-body{ padding: 12px; }
.mock-row{ display:flex; align-items:center; gap:10px; padding: 8px 0; }
.mock-chip{ width:44px; font-size:12px; font-weight:600; color: rgba(37,99,235,1); }
.mock-line{ height:10px; flex:1; border-radius: 999px; background: linear-gradient(90deg, rgba(37,99,235,.14), rgba(99,102,241,.12)); }
.mock-kpis{ display:grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-top: 10px; }
.kpi{ border-radius: 14px; border: 1px solid rgba(15,23,42,.08); padding: 10px; background: rgba(255,255,255,.55); }
.kpi-n{ font-weight: 700; }
.kpi-t{ font-size: 12px; color: var(--muted); margin-top: 2px; }

.section{ margin-top: 22px; }
.section-head{ padding: 0 6px 14px; }
.h2{ margin:0; font-size: 22px; letter-spacing:-.02em; }
.feature-grid{
  display:grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap: 12px;
}
.feature{
  background: #fff;
  border: 1px solid rgba(15,23,42,.08);
  border-radius: 18px;
  padding: 16px;
  box-shadow: 0 10px 25px rgba(15,23,42,.06);
}
.feature-ico{
  width: 44px; height: 44px;
  border-radius: 14px;
  display:flex; align-items:center; justify-content:center;
  background: rgba(37,99,235,.10);
  border: 1px solid rgba(37,99,235,.16);
  color: rgba(37,99,235,1);
}
.feature-ico svg{ width: 24px; height: 24px; }
.feature-title{ margin-top: 10px; font-weight: 700; }

.cta-band{
  background: linear-gradient(135deg, rgba(37,99,235,.12), rgba(99,102,241,.10), rgba(14,165,233,.10));
  border: 1px solid rgba(15,23,42,.08);
  border-radius: 22px;
  padding: 18px;
}
.cta-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 14px;
  flex-wrap: wrap;
}
.cta-title{ font-size: 18px; font-weight: 700; }
.cta-actions{ display:flex; gap: 10px; flex-wrap:wrap; }

/* ---------- LANDING: steps / pricing / FAQ ---------- */
.step-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;}
.step{background:rgba(255,255,255,.72);border:1px solid rgba(15,23,42,.08);border-radius:18px;padding:16px;box-shadow:0 14px 34px rgba(2,6,23,.05);}
.step-n{width:34px;height:34px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-weight:700;background:rgba(37,99,235,.12);border:1px solid rgba(37,99,235,.18);color:rgba(37,99,235,1);}
.step-title{margin-top:10px;font-weight:700;}
.step .muted{margin-top:6px;line-height:1.55;}

.pricing{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;}
.price-card{background:rgba(255,255,255,.78);border:1px solid rgba(15,23,42,.08);border-radius:20px;padding:16px;box-shadow:0 16px 40px rgba(2,6,23,.06);}
.price-card.featured{border-color:rgba(37,99,235,.22);background:linear-gradient(135deg, rgba(255,255,255,.86), rgba(37,99,235,.06));}
.price-k{font-weight:700;font-size:18px;}
.price-v{font-size:28px;font-weight:600;letter-spacing:-0.02em;margin-top:4px;}
.price-v span{font-size:12px;font-weight:700;color:var(--muted);}
.price-list{margin:10px 0 0 18px;color:var(--muted);}

.faq{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;}
.faq-item{background:rgba(255,255,255,.72);border:1px solid rgba(15,23,42,.08);border-radius:18px;padding:16px;}
.faq-q{font-weight:700;}
.faq-a{margin-top:6px;color:var(--muted);line-height:1.6;}

@media (max-width: 980px){
  .hero-inner{ grid-template-columns: 1fr; }
  .feature-grid{ grid-template-columns: repeat(2, minmax(0,1fr)); }
  .sidebar{ display:none; }
  .app-shell{ grid-template-columns: 1fr; }
  .step-grid{grid-template-columns: 1fr;}
  .pricing{grid-template-columns: 1fr;}
  .faq{grid-template-columns: 1fr;}
}
@media (max-width: 520px){
  .hero-title{ font-size: 34px; }
  .hero-metrics{ grid-template-columns: 1fr; }
  .feature-grid{ grid-template-columns: 1fr; }
  .topbar-inner{ padding: 12px 14px; }
  .nav-user{ max-width: 140px; }
  .user-menu-popover{ right: -8px; }
}


/* ---------- MODAL ---------- */
.modal-backdrop{
  position:fixed; inset:0;
  background: rgba(2,6,23,.45);
  display:none;
  align-items:center;
  justify-content:center;
  z-index: 2000;
  padding: 18px;
}
.modal-backdrop.show{ display:flex; }
.sp-modal{
  width: min(560px, 96vw);
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow-soft);
  overflow:hidden;
  transform: translateY(8px);
  opacity: 0;
  transition: all .16s ease;

  max-height: 85vh;
  display:flex;
  flex-direction: column;
}

.sp-modal--wide{ width: min(980px, 96vw); }
.modal-backdrop.show .sp-modal{
  transform: translateY(0);
  opacity: 1;
}
.modal-header{
  padding: 14px 16px;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap: 12px;
  border-bottom:1px solid var(--line);
}
.modal-title{ margin:0; font-size: 16px; font-weight: 600; }
.modal-sub{ margin:4px 0 0 0; color: var(--muted); font-size: 13px; }
.modal-body{ padding: 16px; }
.modal-footer{
  padding: 14px 16px;
  border-top:1px solid var(--line);
  display:flex;
  justify-content:flex-end;
  gap: 10px;
}
.icon-btn{
  width:38px; height:38px;
  border-radius: 12px;
  border: 1px solid var(--line);
  background: #fff;
  display:flex; align-items:center; justify-content:center;
  cursor:pointer;
}
.icon-btn:hover{ box-shadow: 0 6px 18px rgba(2,6,23,.08); }

.queue-item{
  padding: 16px 16px;
  border:1px solid var(--line);
  border-radius: 16px;
  background: rgba(255,255,255,.55);
  display:flex;
  justify-content:space-between;
  gap: 14px;
  cursor:pointer;
}
.queue-item:hover{ box-shadow: 0 10px 26px rgba(2,6,23,.06); }
.queue-left{ display:flex; gap: 10px; align-items:flex-start; }
.dot{
  width:10px; height:10px; border-radius:999px;
  background: #22c55e;
  margin-top: 6px;
}
.dot.gray{ background:#94a3b8; }
.dot.orange{ background:#fb923c; }
.queue-title{ font-weight: 400; }
.queue-meta{ color: var(--muted); font-size: 13px; margin-top: 2px; }
.queue-actions{ display:flex; gap: 8px; align-items:center; }
.pie{
  width: 170px; height: 170px;
  border-radius: 999px;
  background: conic-gradient(var(--primary) var(--p1,0%), rgba(148,163,184,.22) 0);
  border: 1px solid var(--line);
  box-shadow: inset 0 0 0 10px rgba(255,255,255,.6);
}
.pie-legend{ display:flex; flex-direction:column; gap:6px; }
.legend-row{ display:flex; align-items:center; gap:10px; font-size:13px; color: var(--muted); }
.legend-swatch{ width:12px; height:12px; border-radius:4px; background: var(--primary); }
.legend-swatch.gray{ background: rgba(148,163,184,.35); }

.timer-mini{
  display:flex; align-items:center; justify-content:space-between; gap: 12px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: rgba(255,255,255,.55);
}
.timer-clock{ font-size: 26px; font-weight: 700; letter-spacing: .5px; }


/* Planning wizard helpers */
.card-soft{
  background: rgba(255,255,255,0.65);
  border: 1px solid rgba(0,0,0,0.06);
  border-radius: 16px;
  padding: 16px;
  box-shadow: 0 10px 30px rgba(0,0,0,0.05);
}

.subject-grid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 10px;
  align-items: start;
}
@media (max-width: 980px){
  .subject-grid{ grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 680px){
  .subject-grid{ grid-template-columns: 1fr; }
}

.subject-chip{
  display:flex;
  gap:10px;
  align-items:flex-start;
  background: rgba(255,255,255,0.8);
  border: 1px solid rgba(0,0,0,0.06);
  border-radius: 14px;
  padding: 10px 12px;
  cursor:pointer;
}
.subject-chip:hover{
  border-color: rgba(0,0,0,0.12);
}
.subject-chip input{
  margin-top:3px;
}

.subject-title{
  font-weight: 700;
  line-height: 1.1;
}

.accordion{
  display:flex;
  flex-direction:column;
  gap: 10px;
  margin-top: 10px;
}

.acc-item{
  background: rgba(255,255,255,0.8);
  border: 1px solid rgba(0,0,0,0.06);
  border-radius: 14px;
  overflow:hidden;
}
.acc-item summary{
  list-style:none;
  cursor:pointer;
  padding: 12px 12px;
  display:flex;
  align-items:center;
  gap: 10px;
}
.acc-item summary::-webkit-details-marker{ display:none; }
.acc-body{
  padding: 0 12px 12px 12px;
}

/* Planning step 3 - Topics editor */
.topic-editor{
  margin-top: 8px;
}
.topic-quick-add{
  display:flex;
  gap: 10px;
  align-items:center;
}
.topic-add-input{
  flex: 1;
  padding: 10px 12px;
  border: 1px solid rgba(0,0,0,0.12);
  border-radius: 12px;
  background: rgba(255,255,255,0.9);
}
.topic-add-input:focus{
  outline: none;
  border-color: rgba(37, 99, 235, 0.55);
  box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.12);
}
.topic-tags{
  margin-top: 10px;
  padding: 10px;
  border: 1px solid rgba(0,0,0,0.06);
  border-radius: 14px;
  background: rgba(250, 251, 255, 0.9);
  display:flex;
  flex-direction: column;
  flex-wrap: nowrap;
  align-items: stretch;
  gap: 8px;
  max-height: 240px;
  overflow: auto;
}
.topic-pill{
  border: 1px solid rgba(0,0,0,0.08);
  background: rgba(255,255,255,0.95);
  border-radius: 14px;
  padding: 8px 10px;
  display:flex;
  align-items:center;
  gap: 10px;
  width: 100%;
  cursor: grab;
  box-shadow: 0 8px 18px rgba(0,0,0,0.05);
}
.topic-pill:active{ cursor: grabbing; }
.topic-pill.is-dragging{
  opacity: 0.55;
  transform: scale(0.98);
}
.topic-pill.is-drag-over{
  outline: 2px dashed rgba(37, 99, 235, 0.55);
  outline-offset: 2px;
}
.topic-pill:hover{
  transform: translateY(-1px);
  box-shadow: 0 10px 22px rgba(0,0,0,0.07);
}
.topic-pill-text{
  font-size: 13px;
  font-weight: 700;
  flex: 1;
  text-align: left;
  white-space: normal;
  line-height: 1.25;
}
.topic-pill-x{
  width: 22px;
  height: 22px;
  border-radius: 999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background: rgba(239, 68, 68, 0.12);
  color: rgba(185, 28, 28, 1);
  font-weight: 700;
  line-height: 1;
}
.topic-tools{
  display:flex;
  align-items:center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 10px;
}
.topics-textarea{
  width: 100%;
  margin-top: 10px;
  padding: 10px 12px;
  border: 1px solid rgba(0,0,0,0.12);
  border-radius: 12px;
  background: rgba(255,255,255,0.9);
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  font-size: 13px;
}
.topics-textarea.is-hidden{ display:none; }

.alert{
  border-radius: 14px;
  padding: 12px 12px;
}
.alert-warn,
.alert.warning{
  background: rgba(245,158,11,.14);
  border: 1px solid rgba(245,158,11,.32);
  color: #78350f;
}
.alert-info,
.alert.info{
  background: rgba(37,99,235,.12);
  border: 1px solid rgba(37,99,235,.30);
  color: #1e3a8a;
}


/* Schedule grid */
.schedule-grid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 16px;
}
@media (max-width: 980px){
  .schedule-grid{ grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 680px){
  .schedule-grid{ grid-template-columns: 1fr; }
}

.day-card{
  background: rgba(255,255,255,0.65);
  border: 1px solid rgba(0,0,0,0.06);
  border-radius: 18px;
  padding: 14px;
  box-shadow: 0 12px 30px rgba(0,0,0,0.05);
}

.day-title{
  font-weight: 700;
  font-size: 18px;
  margin-bottom: 12px;
}

.block-card{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap: 12px;
  background: rgba(255,255,255,0.85);
  border: 1px solid rgba(0,0,0,0.06);
  border-radius: 14px;
  padding: 12px;
  margin-bottom: 10px;
  cursor:pointer;
}
.block-card:hover{
  border-color: rgba(0,0,0,0.12);
}
.block-subject{ font-weight: 700; }
.block-topic{ margin-top:4px; }
.block-meta{ margin-top:6px; font-size:12px; opacity:0.7; }

.link{ font-weight:700; }



.pulse{ box-shadow: 0 0 0 10px var(--ring), var(--shadow); transition: box-shadow .2s ease; }
/* ---------- DASHBOARD (Patch B) ---------- */
.dash{ display:flex; flex-direction:column; gap:22px; }

.dash-head{ display:flex; flex-direction:column; gap:18px; }

.dash-hero{
  display:flex;
  justify-content:space-between;
  align-items:stretch;
  gap:22px;
  padding: 24px 24px;
}
.dash-hero .hero-left{ flex: 1 1 380px; min-width: 260px; }
.dash-hero .hero-title{ font-size: 22px; display:flex; gap:8px; align-items:baseline; }
.dash-hero .hero-sub{ margin-top:6px; }

.hero-timer{
  flex: 0 0 380px;
  min-width: 320px;
  padding: 18px 18px;
  border:1px solid var(--line);
  border-radius: 16px;
  background: rgba(255,255,255,.55);
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap: 8px;
}
.hero-clock{ font-size: 40px; font-weight: 600; letter-spacing: .02em; }
.hero-actions{ margin-top: 2px; flex-wrap:wrap; }

.dash-grid{
  display:grid;
  grid-template-columns: 1.65fr .95fr;
  gap:18px;
  align-items:start;
}

.dash-main, .dash-side{ display:flex; flex-direction:column; gap:18px; }

.meta-card .meta-big{ font-size: 32px; font-weight: 700; margin-top:4px; }
.meta-card .meta-right{ display:flex; flex-direction:column; gap:8px; align-items:flex-end; }
.meta-bar{
  margin-top: 14px;
  height: 14px;
  border-radius: 999px;
  background: rgba(148,163,184,.22);
  border:1px solid var(--line);
  overflow:hidden;
}
.meta-fill{
  height:100%;
  background: linear-gradient(90deg, var(--primary), rgba(16,185,129,.85));
}
.meta-quick{ margin-top: 14px; }

.tabs{
  display:flex;
  gap:10px;
  align-items:center;
  border-bottom: 1px solid var(--line);
  padding-bottom: 10px;
  margin-bottom: 12px;
}
.tab-btn{
  appearance:none;
  border:1px solid var(--line);
  background: rgba(255,255,255,.55);
  padding: 8px 10px;
  border-radius: 999px;
  cursor:pointer;
  display:flex;
  align-items:center;
  gap:8px;
  font-weight: 700;
}
.tab-btn:hover{ box-shadow: 0 10px 26px rgba(2,6,23,.06); }
.tab-btn.active{
  border-color: rgba(37,99,235,.35);
  box-shadow: 0 0 0 6px var(--ring);
}
.tab-pill{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width: 22px;
  height: 22px;
  padding: 0 8px;
  border-radius: 999px;
  background: rgba(37,99,235,.12);
  font-size: 12px;
}
.tab-panel.hidden{ display:none; }
.queue-list{ display:flex; flex-direction:column; gap:10px; }

.stat-grid{
  margin-top: 14px;
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}
.stat-card{
  padding: 16px 16px;
  border:1px solid var(--line);
  border-radius: 16px;
  background: rgba(255,255,255,.55);
}
.stat-label{ font-size:12px; letter-spacing:.06em; text-transform:uppercase; color: var(--muted); }
.stat-value{ margin-top:6px; font-size:22px; font-weight: 700; }
.stat-sub{ margin-top:2px; font-size: 12px; }

.heatmap{
  display:grid;
  grid-template-columns: repeat(14, 1fr);
  gap: 6px;
}
.heat-cell{
  width: 100%;
  aspect-ratio: 1 / 1;
  border-radius: 6px;
  border: 1px solid var(--line);
  background: rgba(148,163,184,.20);
}
.heat-cell.on{
  background: rgba(16,185,129,.65);
  border-color: rgba(16,185,129,.25);
}

@media (max-width: 980px){
  .dash-grid{ grid-template-columns: 1fr; }
  .hero-timer{ flex: 1 1 auto; }
  .dash-hero{ flex-direction:column; }
  .meta-card .meta-right{ align-items:flex-start; }
}


/* ---------------- Dashboard vNext ---------------- */
.dash.vnext{ display:flex; flex-direction:column; gap:18px; }

.cmdbar{
  position: sticky;
  top: 74px; /* below topbar */
  z-index: 20;
  display:grid;
  grid-template-columns: 1.2fr 1fr auto;
  gap:18px;
  padding: 16px 18px;
  border-radius: calc(var(--radius) + 4px);
  border: 1px solid rgba(37,99,235,.12);
  background: rgba(255,255,255,.78);
  backdrop-filter: blur(12px);
  box-shadow: 0 14px 38px rgba(2,6,23,.08);
}

.cmd-kicker{
  font-size:12px;
  letter-spacing:.08em;
  text-transform:uppercase;
  color: rgba(15,23,42,.55);
  margin-bottom:4px;
}

.cmd-title{ font-size:22px; line-height:1.2; }
.cmd-sub{ margin-top: 6px; max-width: 56ch; }

.cmd-timer{
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:flex-start;
  gap:6px;
  padding-left: 10px;
  border-left: 1px solid rgba(2,6,23,.08);
}

.cmd-clock{
  font-size:36px;
  font-weight:600;
  letter-spacing:.02em;
}

.cmd-actions{
  display:flex;
  align-items:center;
  gap:10px;
  justify-content:flex-end;
  flex-wrap:wrap;
}


.meta-wide{ padding:18px; }
.meta-wide-top{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:16px;
  flex-wrap:wrap;
}
.meta-label{ font-size:12px; letter-spacing:.08em; text-transform:uppercase; color: rgba(15,23,42,.55); }
.meta-big{ font-size:34px; font-weight:600; margin-top:4px; }
.meta-sep{ opacity:.35; padding: 0 6px; }
.meta-side{ display:flex; align-items:flex-end; gap:18px; flex-wrap:wrap; }
.meta-side-item{ text-align:right; }
.meta-side-val{ font-size:18px; font-weight:700; }
.small-btn{ padding:10px 12px; border-radius: 12px; }

.metrics-row{
  margin-top: 14px;
  display:grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap:12px;
}
.metric{
  padding: 14px 14px;
  border-radius: 16px;
  border: 1px solid rgba(2,6,23,.08);
  background: rgba(255,255,255,.55);
}
.metric-k{ font-size:12px; letter-spacing:.08em; text-transform:uppercase; color: rgba(15,23,42,.55); }
.metric-v{ margin-top:6px; font-size:22px; font-weight:600; }

.constancy-wide{ margin-top: 14px; padding-top: 12px; border-top: 1px solid rgba(2,6,23,.08); }
.constancy-head{ display:flex; justify-content:space-between; align-items:center; margin-bottom: 10px; }
.constancy-title-row{ display:flex; align-items:center; gap:4px; min-width: 0; }
.constancy-link{ margin-left:auto; white-space:nowrap; }
.constancy-right{ display:flex; gap:10px; align-items:center; }
.streak-pill{ height:28px; padding: 0 8px; font-weight:700; }
.streak-inline{ padding: 0 10px; }

.constancy-dots{ display:flex; flex-wrap:wrap; gap:8px; }
.dot{ width:14px; height:14px; border-radius: 6px; background: rgba(148,163,184,.45); border: 1px solid rgba(2,6,23,.08); }
.dot.on{ background: rgba(37,99,235,.85); border-color: rgba(37,99,235,.25); box-shadow: 0 10px 18px rgba(37,99,235,.14); }
.dot.off{ background: rgba(148,163,184,.35); }
.dot.disabled{ background: rgba(15,23,42,.18); border-color: rgba(15,23,42,.12); }
.dot.miss{ background: rgba(239,68,68,.78); border-color: rgba(239,68,68,.25); box-shadow: 0 10px 18px rgba(239,68,68,.10); }
.dot.vacation{ background: rgba(241,245,249,1); border-color: rgba(148,163,184,.35); box-shadow: 0 10px 18px rgba(2,6,23,.06); }

.today{ padding:18px; }
.today-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:14px;
  flex-wrap:wrap;
}
.section-title{ font-size:18px; font-weight:600; }
.today-tabs{ display:flex; gap:10px; }
.tab{
  border: 1px solid rgba(2,6,23,.10);
  background: rgba(255,255,255,.55);
  border-radius: 999px;
  padding: 10px 12px;
  font-weight:700;
  cursor:pointer;
}
.tab.is-active{ border-color: rgba(37,99,235,.35); box-shadow: 0 0 0 4px var(--ring); }
.pill{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width: 24px;
  height: 20px;
  padding: 0 8px;
  border-radius: 999px;
  background: rgba(37,99,235,.12);
  color: rgba(37,99,235,1);
  font-size:12px;
  margin-left:8px;
}

.tabpanes{ margin-top: 14px; }
.tabpane{ display:none; }
.tabpane.is-active{ display:block; }

.queue{ display:flex; flex-direction:column; gap:12px; }
.queue-row{
  display:grid;
  grid-template-columns: 44px 1fr auto;
  gap:12px;
  align-items:center;
  padding: 10px;
  border-radius: 18px;
  border: 1px solid rgba(2,6,23,.08);
  background: rgba(255,255,255,.65);
}

/* Quando a linha é clicável (sem botão ▶ na esquerda) */
.today-item.queue-row{
  grid-template-columns: 1fr auto;
}
.today-item.queue-row .queue-main{ min-width:0; }
.today-item.queue-row .queue-title{
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.today-item.queue-row .queue-title strong,
.today-item.queue-row .queue-title .muted{
  white-space: nowrap;
}

.play{
  width:44px;
  height:44px;
  border-radius: 16px;
  border: 1px solid rgba(37,99,235,.25);
  background: rgba(37,99,235,.10);
  color: rgba(37,99,235,1);
  font-weight:700;
  cursor:pointer;
}
.play:hover{ box-shadow: 0 0 0 4px var(--ring); }

.queue-item{
  padding: 2px 4px;
  cursor:pointer;
}
.q-title{ font-size:15px; }
.ghost-link{
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid rgba(2,6,23,.10);
  background: rgba(255,255,255,.55);
  font-weight:700;
  white-space:nowrap;
}
.tag{
  padding: 8px 10px;
  border-radius: 999px;
  background: rgba(2,6,23,.06);
  border: 1px solid rgba(2,6,23,.10);
  font-size:12px;
  font-weight:700;
  white-space:nowrap;
}

.empty{
  padding: 18px;
  border-radius: 18px;
  border: 1px dashed rgba(2,6,23,.16);
  background: rgba(255,255,255,.55);
}
.empty-title{ font-size:16px; font-weight:600; margin-bottom: 6px; }

.snap{ padding:18px; }
.snap-grid{ display:grid; grid-template-columns: 1fr 1fr; gap:12px; margin-top: 12px; }
.snap-item{ padding: 14px; border-radius: 16px; border: 1px solid rgba(2,6,23,.08); background: rgba(255,255,255,.55); }
.snap-k{ font-size:12px; letter-spacing:.08em; text-transform:uppercase; color: rgba(15,23,42,.55); }
.snap-v{ margin-top: 8px; font-size:18px; font-weight:600; }

@media (max-width: 980px){
  .cmdbar{ grid-template-columns: 1fr; top: 66px; }
  .cmd-timer{ border-left:none; padding-left: 0; }
  .metrics-row{ grid-template-columns: 1fr 1fr; }
  .snap-grid{ grid-template-columns: 1fr; }
  .queue-row{ grid-template-columns: 44px 1fr; }
  .ghost-link,.tag{ display:none; }
}


/* --- vNext Phase 1: Mission + Next Focus + Focus Mode --- */
.cmd-mission{
  margin-top: 10px;
  display:flex;
  align-items: center;
  gap:10px;
  flex-wrap: wrap;
}
.badge{
  display:inline-flex;
  align-items:center;
  padding:4px 10px;
  border-radius:999px;
  border:1px solid rgba(0,0,0,.08);
  background: rgba(255,255,255,.65);
  font-size:12px;
  font-weight:600;
}

.queue-row [data-next-focus="1"] + .queue-item .q-title strong,
.queue-row .queue-item[data-next-focus="1"] .q-title strong{
  text-decoration: underline;
}

.queue-row [data-next-focus="1"]{
  box-shadow: 0 0 0 3px rgba(37, 99, 235, .18);
}

.focus-mode .sidebar,
.focus-mode .topbar{
  display:none !important;
}
.focus-mode .shell{
  padding-top: 18px;
}
.focus-mode .content{
  width:100%;
  max-width: 1200px;
  margin: 0 auto;
}

.focus-mode .container{
  padding-top: 14px;
}
.focus-mode .layout{
  max-width: 1200px;
  margin: 0 auto;
}
.focus-mode .main{
  padding-left: 0;
}

.focus-mode .cmdbar{
  position: sticky;
  top: 0;
  z-index: 20;
}


/* vNext Phase 1B: mission + coach + playlist polish */
.cmd-mission .mission-head{display:flex;align-items:baseline;gap:10px}
.cmd-mission .mission-sub{display:flex;gap:10px;margin-top:4px}
.remain-highlight{color: var(--text); font-weight: 700;}
.remain-highlight.is-active{color: var(--accent);}

.mission-bar{height:8px;border-radius:999px;background:rgba(2,6,23,.08);margin-top:10px;overflow:hidden}
.mission-bar-fill{height:100%;background:rgba(37,99,235,.9)}
.chip{display:inline-flex;align-items:center;gap:6px;padding:3px 10px;border-radius:999px;font-size:12px;font-weight:700;border:1px solid rgba(2,6,23,.10);background:rgba(255,255,255,.70);margin-right:8px}
.chip.next{border-color:rgba(37,99,235,.25);background:rgba(37,99,235,.10);color:rgba(37,99,235,1)}
.chip.warn{border-color:rgba(245,158,11,.35);background:rgba(245,158,11,.10);color:rgba(146,64,14,1)}
.queue{display:flex;flex-direction:column;gap:12px}
.queue-row{padding:10px 10px;align-items:center}
.queue-item{padding:12px 14px}
.q-title{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.coach{margin-top:14px;padding:14px;border-radius:18px;border:1px solid rgba(2,6,23,.08);background:rgba(255,255,255,.65)}
.coach-title{font-weight:600;margin-bottom:6px}
.coach-list{margin:0;padding-left:18px}
.coach-list li{margin:4px 0;color:rgba(15,23,42,.85)}
/* Toast */
.toast-wrap{position:fixed;left:50%;transform:translateX(-50%);bottom:22px;z-index:9999;display:flex;flex-direction:column;gap:10px}
.toast{min-width:260px;max-width:520px;padding:12px 14px;border-radius:16px;border:1px solid rgba(2,6,23,.10);background:rgba(255,255,255,.92);box-shadow:0 10px 30px rgba(2,6,23,.12);font-weight:700}
.toast.ok{border-color:rgba(34,197,94,.25)}
.toast.err{border-color:rgba(239,68,68,.25)}

/* Onboarding (MVP) */
.sp-onboard p{color:rgba(15,23,42,.92)}
.sp-soft{color:rgba(15,23,42,.75)}
/* Focus mode */
body.focus-mode .topbar, body.focus-mode .sidebar{display:none !important}
body.focus-mode .main{margin-left:0 !important}
body.focus-mode .cmdbar{position:sticky;top:0}
body.focus-mode .cmd-clock{font-size:56px}

.moodbtn.is-selected{border-color:rgba(37,99,235,.35) !important;background:rgba(37,99,235,.14) !important}


/* vNext: week planner + subjects controls */

.week-head{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin-bottom:12px}
.week-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.week-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:10px;overflow:auto;padding-bottom:4px}
.week-col{min-width:160px;border:1px solid rgba(2,6,23,.08);background:rgba(255,255,255,.60);border-radius:18px;padding:10px}
.week-day{font-weight:700;font-size:13px;color:rgba(15,23,42,.85);margin-bottom:8px}
.week-empty{padding:12px 0;text-align:center}
.week-block{border:1px solid rgba(2,6,23,.08);border-radius:14px;padding:10px;background:rgba(255,255,255,.75);margin-bottom:8px}
.week-block.is-done{opacity:.65}

/* Weekly list rows (dashboard): keep completed visible, but clearly read-only */
.today-item.is-done{
  background:#f6f7fb;
  border:1px solid rgba(0,0,0,.06);
}
.today-item.is-done .queue-title,
.today-item.is-done .queue-sub{
  opacity:.7;
}
.today-play[disabled]{
  opacity:.55;
  cursor:not-allowed;
}
.wb-top{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.wb-title{font-size:13px;line-height:1.25}
.wb-actions{display:flex;gap:6px}
.iconbtn{border:1px solid rgba(2,6,23,.10);background:rgba(255,255,255,.85);border-radius:10px;padding:4px 7px;font-weight:700;cursor:pointer}
.iconbtn:hover{transform:translateY(-1px)}
.iconbtn.is-on{border-color:rgba(37,99,235,.25);background:rgba(37,99,235,.10)}
.topic-done.is-on{border-color:rgba(34,197,94,.25);background:rgba(34,197,94,.12)}
.hot{font-weight:700}
.subjects-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:12px}
.subj-card{border:1px solid rgba(2,6,23,.08);background:rgba(255,255,255,.65);border-radius:20px;padding:14px}
.subj-top{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-bottom:10px}
.subj-row{display:grid;grid-template-columns:110px 1fr 46px;align-items:center;gap:10px;margin:10px 0}
.range{width:100%}
.pill{display:inline-flex;align-items:center;justify-content:center;height:30px;border-radius:999px;border:1px solid rgba(2,6,23,.10);background:rgba(255,255,255,.80);font-weight:700}
.bar.mini{height:8px;border-radius:999px;background:rgba(2,6,23,.08);overflow:hidden;margin-top:10px}
.diag-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin-top:12px;overflow-x:hidden}
.diag-item{min-width:0;border:1px solid rgba(2,6,23,.08);background:rgba(255,255,255,.65);border-radius:18px;padding:12px}
.diag-val{font-size:22px;font-weight:1000;margin-top:6px}
.summary-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:12px}
.summary-item{border:1px solid rgba(2,6,23,.08);background:rgba(255,255,255,.65);border-radius:18px;padding:12px}
.summary-val{font-size:18px;font-weight:700;margin-top:6px}
@media (max-width: 1100px){
  .subjects-grid{grid-template-columns:1fr}
  .summary-grid{grid-template-columns:1fr}
}

/* Extra UX */
#spToTop{position:fixed;right:18px;bottom:18px;z-index:9998;display:none;align-items:center;justify-content:center;width:44px;height:44px;border-radius:14px;border:1px solid rgba(2,6,23,.12);background:rgba(255,255,255,.9);box-shadow:0 10px 30px rgba(2,6,23,.14);font-weight:1000;cursor:pointer}
#spToTop.is-show{display:flex}
.queue-item.is-selected{border-color:rgba(37,99,235,.25) !important;box-shadow:0 10px 30px rgba(37,99,235,.12)}
.cmd-clock.is-running{letter-spacing:1px}


/* ---- Hoje inteligente ---- */
.today-controls{display:flex; align-items:center; gap:10px;}
.today-search input{
  width: 260px;
  max-width: 48vw;
  padding: 10px 12px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.04);
  border-radius: 10px;
  color: inherit;
  outline: none;
}
.today-search input:focus{border-color: rgba(255,255,255,.22);}

.today-subhead{
  display:flex;
  align-items:center;
  gap:10px;
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid rgba(255,255,255,.08);
}
.subhead-title{font-weight: 600; letter-spacing: .2px;}
.subhead-hint{flex:1;}
.queue-row .tag{margin-left: 10px;}
.queue-row .queue-sub{margin-top: 2px;}
.chip{
  display:inline-flex;
  align-items:center;
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.08);
  font-size: 12px;
}


/* ---------- RESPONSIVO (tablet/celular) ---------- */
@media (max-width: 980px){
  body.app-shell .layout{
    flex-direction: column;
  }
  body.app-shell .sidebar{
    width: 100%;
    border-right: none;
    border-bottom: 1px solid var(--line);
    padding: 14px 12px;
  }
  body.app-shell .sidebox{
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
  }
  body.app-shell .sidebox .sideitem{
    flex: 1 1 160px;
  }
  body.app-shell .sidebox-title{
    width: 100%;
  }
  body.app-shell .main{
    padding-top: 12px;
  }
}

@media (max-width: 540px){
  body.app-shell .container{
    padding: 14px 10px 28px;
  }
  body.app-shell .sidebar{
    border-radius: 14px;
  }
  body.app-shell .sidebox .sideitem{
    flex: 1 1 140px;
  }
}


/* --- Sprint 2: badges + small buttons --- */
.badge.soft{
  background: rgba(255,255,255,.75);
}
.badge.ok{
  background: rgba(0,0,0,.06);
  border-color: rgba(0,0,0,.12);
}
.badge.warn{
  background: rgba(0,0,0,.04);
  border-color: rgba(0,0,0,.14);
}
.badge.danger{
  background: rgba(0,0,0,.05);
  border-color: rgba(0,0,0,.18);
}
.btn.small{
  padding: 8px 10px;
  font-size: 12px;
  border-radius: 12px;
}


/* Accordion + compact table (cronograma) */
.accordion .acc-head{
  width:100%;
  border:0;
  background:transparent;
  padding:14px 16px 12px 16px;
  display:grid;
  grid-template-columns: 1fr auto;
  grid-template-rows:auto auto;
  gap:10px 12px;
  text-align:left;
  cursor:pointer;
}

/* --- Meu edital (layout) --- */
.edital-header{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:12px;
  margin: 6px 0 14px;
}
.edital-h1{
  font-size: 26px;
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.05;
}
.edital-sub{ color: var(--muted); margin-top: 6px; }
.edital-header__actions{ display:flex; gap:10px; flex-wrap:wrap; justify-content:flex-end; }

.edital-summary{ margin-bottom: 14px; }
.edital-summary__main{ padding: 16px 18px; }
.edital-kicker{
  font-size: 12px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: #64748b;
  margin-bottom: 6px;
}
.edital-summary__top{ display:flex; justify-content:space-between; align-items:flex-start; gap:12px; }
.edital-summary__line{ font-size: 14px; }
.edital-summary__pct{ font-size: 28px; font-weight: 700; letter-spacing: -0.02em; }
.edital-progress{ margin-top: 12px; }
.edital-summary__chips{ margin-top: 12px; display:flex; flex-wrap:wrap; gap:10px; }

.edital-ignored{ padding: 16px 18px; margin-bottom: 14px; border:1px solid rgba(245,158,11,.22); background: rgba(245,158,11,.06); }
.edital-ignored__top{ display:flex; justify-content:space-between; align-items:center; gap:12px; }
.edital-ignored__title{ font-weight: 700; }
.edital-ignored__list{ margin-top: 12px; display:flex; flex-direction:column; gap:10px; }
.edital-ignored__item{ display:flex; justify-content:space-between; align-items:flex-start; gap:12px; padding: 12px; border-radius: 14px; background: rgba(255,255,255,.75); border: 1px solid rgba(15,23,42,0.08); }
.edital-ignored__label{ font-weight: 600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.edital-ignored__meta{ font-size: 12px; color: #64748b; margin-top: 4px; }

.edital-accordion .edital-subject{
  padding: 0;
  overflow: hidden;
  margin-bottom: 12px;
}
.edital-accordion .acc-head{ padding: 14px 16px 12px 16px; }
.acc-title__name{ font-weight: 700; }
.acc-title__meta{ font-size: 12px; color: #64748b; margin-top: 4px; display:flex; align-items:center; gap:8px; }
.acc-title__meta .dot{ opacity: .6; }

.edital-table th{ background: rgba(2,6,23,0.02); }
.edital-topic__name{ font-weight: 850; }
.edital-topic__meta{ margin-top: 2px; font-size: 12px; color: #64748b; }

@media (max-width: 720px){
  .edital-header{ align-items:flex-start; flex-direction:column; }
  .edital-header__actions{ width:100%; justify-content:flex-start; }
  .edital-summary__pct{ font-size: 24px; }
}

/* Generic modal (confirm) */
.modal{position:fixed;inset:0;display:none;z-index:1000}
.modal.is-open{display:block}
.modal__backdrop{position:absolute;inset:0;background:rgba(0,0,0,.55);backdrop-filter: blur(2px)}
.modal__dialog{
  position:relative;
  width:min(520px,calc(100% - 28px));
  margin: 9vh auto 0 auto;
  background: rgba(20,22,28,.98);
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 16px;
  box-shadow: 0 18px 60px rgba(0,0,0,.55);
  overflow:hidden;
}
.modal__header{display:flex;align-items:center;justify-content:space-between;padding:14px 14px 10px 16px;border-bottom:1px solid rgba(255,255,255,.08)}
.modal__title{font-weight:700}
.modal__body{padding:14px 16px}
.modal__footer{display:flex;gap:10px;justify-content:flex-end;padding:12px 16px 16px;border-top:1px solid rgba(255,255,255,.08)}
.btn.danger{background:rgba(255,76,76,.18);border:1px solid rgba(255,76,76,.35)}
.btn.danger:hover{filter:brightness(1.05)}
.badge.warn{background:rgba(255,194,61,.15);border:1px solid rgba(255,194,61,.35)}
.badge.danger{background:rgba(255,76,76,.16);border:1px solid rgba(255,76,76,.35)}
.badge.ok{background:rgba(80,210,120,.14);border:1px solid rgba(80,210,120,.35)}


/* Study tips list */
.tips{margin:0; padding-left:18px;}
.tips li{margin:6px 0; line-height:1.35;}

/* History tabs compatibility */
.tab{appearance:none;border:1px solid var(--line);background: rgba(255,255,255,.55);padding:8px 10px;border-radius:999px;cursor:pointer;font-weight:700}
.tab.active{background: var(--ink);color:white;border-color: transparent}


/* ---------- Save modal (Registro de Estudo) ---------- */
.like-input{
  display:flex;
  align-items:center;
  min-height:40px;
  background: #fff;
}
.save-head{ margin-bottom: 10px; }
.save-title{ font-weight: 700; font-size: 20px; }
.save-sub{ font-size: 13px; margin-top: 4px; line-height: 1.4; }
.save-grid{
  display:grid;
  grid-template-columns: 1fr;
  gap: 12px;
  margin-top: 10px;
}
.save-field label{ display:block; font-size: 12px; color: rgba(2,6,23,.75); margin-bottom:6px; }
.save-opts{ display:flex; gap: 14px; flex-wrap:wrap; margin-top: 12px; }
.check{ display:flex; gap:8px; align-items:center; font-size: 13px; user-select:none; }
.check input{ width:16px; height:16px; }
.save-panels{
  display:grid;
  grid-template-columns: 1fr;
  gap: 12px;
  margin-top: 12px;
}
.save-panel{
  border: 1px solid rgba(2,6,23,.08);
  border-radius: 16px;
  background: rgba(255,255,255,.75);
  padding: 12px;
}
.panel-title{ font-weight: 700; margin-bottom: 8px; }
.panel-grid{
  display:grid;
  grid-template-columns: 1fr;
  gap: 10px;
}

.inline-two{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

.activity-modal{ display:flex; flex-direction:column; gap: 12px; }
.activity-head{ padding: 12px; border:1px solid rgba(2,6,23,.08); border-radius:16px; background: rgba(255,255,255,.75); }
.activity-title{ font-weight: 950; font-size: 16px; }
.activity-badges{ display:flex; flex-wrap:wrap; gap: 8px; margin-top: 10px; }
.badge.ok{ background:#e7f7ed; color:#0f5132; border:1px solid #b7e1c4; }
.badge.warn{ background:#fff3cd; color:#664d03; border:1px solid #ffecb5; }

.timer-card{ padding: 14px; border-radius: 16px; border:1px solid rgba(2,6,23,.08); background: rgba(255,255,255,.75); }
.timer-label{ font-size: 12px; text-transform: uppercase; letter-spacing: .06em; color: rgba(2,6,23,.7); }
.timer-big{ font-size: 34px; font-weight: 950; margin-top: 6px; }

.acc-list{ display:flex; flex-direction:column; gap: 10px; }
.acc{ border:1px solid rgba(2,6,23,.08); border-radius: 16px; background: rgba(255,255,255,.75); overflow:hidden; }
.acc > summary{ cursor:pointer; padding: 12px 14px; font-weight: 700; list-style:none; }
.acc > summary::-webkit-details-marker{ display:none; }
.acc-body{ padding: 0 14px 14px 14px; }

.sr-only{
  position:absolute!important;
  width:1px;height:1px;
  padding:0;margin:-1px;
  overflow:hidden;clip:rect(0,0,0,0);
  white-space:nowrap;border:0;
}

/* Make weekly items clearly clickable */
.queue-row.today-item[data-open-study="1"]{
  cursor: pointer;
}
.queue-row.today-item[data-open-study="1"]:hover{
  border-color: rgba(37,99,235,.25);
  box-shadow: 0 10px 24px rgba(2,6,23,.08);
}


/* radio options */
.radio{display:flex; gap:10px; align-items:flex-start; padding:10px 12px; border:1px solid rgba(148,163,184,.35); border-radius:12px; background: rgba(15,23,42,.03);} 
.radio input{margin-top:3px;} 

.callout{ 
  padding: 10px 12px; 
  border: 1px solid rgba(148,163,184,.35);
  border-radius: 12px;
  background: rgba(15,23,42,.03);
  margin-bottom: 10px;
  font-size: 13px;
  color: rgba(2,6,23,.85);
}


/* Status real do cronograma */
.status-tag{ text-transform:uppercase; letter-spacing:.04em; font-size:11px; padding:3px 8px; }


/* --- Weekly queue numbering + status pills --- */
.queue-row{display:flex; align-items:center; gap:12px;}
.queue-num{
  width:34px; flex:0 0 34px;
  height:28px; border-radius:10px;
  display:flex; align-items:center; justify-content:center;
  font-weight:700; font-size:12px;
  background: rgba(59,130,246,.08);
  border:1px solid rgba(59,130,246,.18);
  color:#1d4ed8;
}
.status-pill{font-weight:600;}
.status-tag{font-weight:600; text-transform:none;}
.status-done{background:rgba(16,185,129,.12); border:1px solid rgba(16,185,129,.22); color:#065f46;}
.status-ignored{background:rgba(245,158,11,.10); border:1px solid rgba(245,158,11,.22); color:#92400e;}
.status-late{background:rgba(239,68,68,.10); border:1px solid rgba(239,68,68,.22); color:#991b1b;}
.status-today{background:rgba(59,130,246,.10); border:1px solid rgba(59,130,246,.22); color:#1d4ed8;}
.status-pending{background:rgba(107,114,128,.10); border:1px solid rgba(107,114,128,.22); color:#374151;}


/* simple radio rows (modals) */
.radio-row{display:flex;gap:10px;align-items:flex-start;padding:8px 10px;border:1px solid rgba(15,23,42,.08);border-radius:10px;margin:8px 0;background:#fff;}
.radio-row input{margin-top:3px;}


/* Next week button (weekly mission) */
.next-week-btn{
  margin-left:auto;
  padding:8px 12px;
  border-radius:10px;
  border:1px solid rgba(2,6,23,.10);
  font-weight:600;
  font-size:13px;
  line-height:1;
}
.next-week-btn.disabled{
  background: rgba(2,6,23,.06);
  color: rgba(2,6,23,.45);
  cursor: not-allowed;
}
.next-week-btn.active{
  background: var(--accent);
  border-color: rgba(0,0,0,0);
  color: #fff;
  cursor: pointer;
}
.next-week-btn.active:hover{
  filter: brightness(.95);
}

/* Performance panel */
.perf-grid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap:10px;
}
.perf-card{
  background: rgba(2,6,23,.03);
  border:1px solid rgba(2,6,23,.06);
  border-radius:14px;
  padding:10px 12px;
}
.perf-label{font-size:12px;color:rgba(2,6,23,.55);font-weight:600}
.perf-value{font-size:18px;font-weight:700;margin-top:2px}
.perf-sub{margin-top:2px;font-size:12px}
@media (max-width: 900px){
  .perf-grid{grid-template-columns:1fr}
  .next-week-btn{margin-left:0}
  .mission-head{flex-wrap:wrap;align-items:center}
}



/* Disabled button visual */
.btn[disabled], .btn:disabled {
  opacity: 0.55;
  cursor: not-allowed;
  filter: grayscale(20%);
}

/* -----------------------------
   /schedule — Diagnóstico
   ----------------------------- */
.diag{display:grid;gap:12px}
.schedule-hero{
  position:relative;
  overflow:hidden;
  border:1px solid rgba(59,130,246,.22);
  border-radius:18px;
  padding:16px;
  background:linear-gradient(125deg, rgba(255,255,255,.96), rgba(239,246,255,.92));
  box-shadow:0 14px 34px rgba(37,99,235,.10);
}
.schedule-hero::after{
  content:"";
  position:absolute;
  width:260px;
  height:260px;
  right:-120px;
  top:-120px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(59,130,246,.24) 0%, rgba(59,130,246,0) 72%);
  pointer-events:none;
}
.schedule-hero__title{display:flex;align-items:center;gap:10px}
.schedule-hero__logo{width:30px;height:30px;border-radius:9px;box-shadow:0 8px 20px rgba(2,6,23,.16)}
.diag__summary{padding:14px 14px 12px}
.diag__summaryTop{display:flex;justify-content:space-between;align-items:flex-start;gap:14px}
.diag__kicker{font-size:11px;letter-spacing:.08em;color:rgba(2,6,23,.55);font-weight:700}
.diag__headline{margin-top:2px;font-size:16px;font-weight:700}
.diag__headline strong{font-weight:750}
.diag__subline{margin-top:4px;font-size:12px;color:rgba(2,6,23,.65)}
.diag__pct{font-size:34px;font-weight:950;line-height:1}
.diag__progress{margin-top:10px}
.diag__chips{margin-top:10px;display:flex;flex-wrap:wrap;gap:8px}

.diag__controls{
  display:flex;
  gap:10px;
  align-items:center;
  justify-content:space-between;
  border:1px solid rgba(2,6,23,.08);
  border-radius:16px;
  background:rgba(255,255,255,.92);
  box-shadow:0 8px 20px rgba(2,6,23,.05);
  padding:10px;
}
.diag__search{flex:1;min-width:220px}
.diag__sort{display:flex;gap:8px;flex-wrap:wrap}

/* Tabs segmentadas (Índice / Pontos fracos / Pontos fortes) */
.seg-tabs{display:inline-flex;align-items:center;gap:2px;padding:4px;border-radius:999px;background:rgba(2,6,23,.04);border:1px solid rgba(2,6,23,.08)}
.seg-tab{appearance:none;border:0;background:transparent;color:rgba(2,6,23,.72);font-weight:850;font-size:12px;line-height:1;cursor:pointer;padding:9px 12px;border-radius:999px;transition:background .12s ease, box-shadow .12s ease, color .12s ease}
.seg-tab:hover{background:rgba(2,6,23,.05)}
.seg-tab[aria-pressed="true"]{background:#fff;color:rgba(2,6,23,.9);box-shadow:0 6px 18px rgba(2,6,23,.08)}
.seg-tab:focus-visible{outline:2px solid rgba(59,130,246,.55);outline-offset:2px}

.diag__list{padding:0;overflow-x:auto;overflow-y:auto;max-height:560px}
.diag__listHead{display:grid;grid-template-columns:72px 1fr 130px 110px 76px 76px 110px 110px 110px 44px;gap:0;border-bottom:1px solid rgba(2,6,23,.08);padding:12px 14px;background:linear-gradient(180deg, rgba(248,250,252,.96), rgba(241,245,249,.84));position:sticky;top:0;z-index:3}
.diag__col{font-size:11px;letter-spacing:.02em;color:rgba(2,6,23,.58);font-weight:700}
.diag__col--exp{justify-self:end}

.diag__row{border-top:1px solid rgba(2,6,23,.06)}
.diag__row:nth-child(even){background:rgba(248,250,252,.55)}
.diag__row:has(.diag__main[aria-expanded="true"]){background:rgba(59,130,246,.03)}
.diag__main{width:100%;display:grid;grid-template-columns:72px 1fr 130px 110px 76px 76px 110px 110px 110px 44px;gap:0;align-items:stretch;text-align:left;padding:10px 14px;background:transparent;border:0;cursor:pointer}
.diag__main:hover{background:rgba(59,130,246,.04)}
.diag__cell{display:flex;align-items:center}
.diag__listHead,.diag__main{min-width:980px}
.diag__cell--id{color:rgba(2,6,23,.72);font-weight:600}
.diag__cell--num{justify-content:flex-end;font-variant-numeric:tabular-nums;}
.diag__col--num{justify-self:end}
.diag__cell--exp{justify-content:flex-end}
.diag__chev{font-size:16px;opacity:.75}

.diag__titleLine{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.diag__title{font-weight:650;letter-spacing:0;color:#0f172a}
.diag__titleLine .badge{font-size:11px;padding:4px 10px}
.diag__meta{margin-top:4px;font-size:12px;color:rgba(2,6,23,.55);display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.diag__bar{margin-top:8px}
.diagbar{height:10px;border-radius:999px;background:rgba(2,6,23,.10);overflow:hidden}
.diagbar__fill{height:100%;background:rgba(59,130,246,.85)}
.diag__pctPill{display:inline-flex;align-items:center;justify-content:center;padding:4px 10px;border-radius:999px;background:rgba(59,130,246,.10);color:rgba(2,6,23,.85);font-weight:700}

.diag__details{padding:0 14px 12px;background:linear-gradient(180deg, rgba(59,130,246,.03), rgba(59,130,246,0));}
.diag__empty{padding:12px 0;color:rgba(2,6,23,.65)}

.diag__topics{border:1px solid rgba(2,6,23,.08);border-radius:14px;overflow:hidden;background:rgba(2,6,23,.015)}
.diag__topicsHead{display:flex;justify-content:space-between;align-items:center;padding:10px 12px;background:rgba(2,6,23,.03);border-bottom:1px solid rgba(2,6,23,.08);font-weight:700}
.diag__topicsCols{display:grid;grid-template-columns:90px 220px 130px 130px;gap:10px;font-size:12px;color:rgba(2,6,23,.6);font-weight:700}

.diag__topic{display:flex;justify-content:space-between;gap:12px;padding:10px 12px;border-bottom:1px solid rgba(2,6,23,.06)}
.diag__topic:last-child{border-bottom:0}
.diag__topicLeft{min-width:0;flex:1}
.diag__topicTitle{display:flex;gap:10px;align-items:flex-start}
.diag__topicCode{font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;font-size:12px;opacity:.7;min-width:48px}
.diag__topicLabel{font-weight:850;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.diag__topicMeta{margin-top:4px;font-size:12px;color:rgba(2,6,23,.6);display:flex;gap:8px;flex-wrap:wrap}

.diag__topicRight{display:grid;grid-template-columns:90px 220px 130px 130px;gap:10px;align-items:center}
.diag__metric{display:flex;align-items:center;justify-content:flex-start}
.diag__qN{font-weight:950}

.perfbar{height:12px;border-radius:999px;overflow:hidden;background:rgba(2,6,23,.12);display:flex}
.perfbar__ok{height:100%;background:rgba(34,197,94,.9)}
.perfbar__bad{height:100%;background:rgba(239,68,68,.85)}
.perfbar--empty{background:rgba(2,6,23,.08)}
.diag__perfText{margin-top:4px;font-size:12px;display:flex;gap:6px;align-items:baseline}
.diag__perfText .ok{font-weight:950}

.diag__ignored{padding:12px 14px}
.diag__ignoredTop{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.diag__ignoredTitle{font-weight:950}
.diag__ignoredList{margin-top:10px;display:grid;gap:8px}
.diag__ignoredItem{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:10px 12px;border:1px solid rgba(2,6,23,.08);border-radius:14px;background:rgba(2,6,23,.015)}
.diag__ignoredLabel{font-weight:850;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.diag__ignoredMeta{margin-top:2px;font-size:12px;color:rgba(2,6,23,.6)}

@media (max-width: 980px){
  .diag__listHead, .diag__main{grid-template-columns:70px 1fr 110px 96px 34px}
  .diag__topicsCols, .diag__topicRight{grid-template-columns:70px 180px 110px 110px}
}
@media (max-width: 720px){
  .diag__summaryTop{flex-direction:column;align-items:flex-start}
  .diag__controls{flex-direction:column;align-items:stretch}
  .diag__listHead{display:none}
  .diag__main{grid-template-columns:70px 1fr 0 0 34px}
  .diag__cell--level, .diag__cell--pct{display:none}
  .diag__topicRight{grid-template-columns:70px 1fr;}
  .diag__topicsCols{display:none}
  .diag__metric--prio, .diag__metric--sched{display:none}
}

/* =========================================================
   Design polish (v5)
   - Ajustes para consistência visual (home/login/admin)
   ========================================================= */

/* Evita páginas “esticadas” no admin e mantém o conteúdo legível */
body.app-shell .container{
  max-width: 1320px;
  margin: 0 auto;
  padding: 22px 20px 40px;
}
body.app-shell .topbar-inner{
  max-width: 1320px;
  margin: 0 auto;
}

/* Home: grid de passos (o template usa .steps/.step) */
.steps{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}
@media (max-width: 980px){
  .steps{ grid-template-columns: 1fr; }
}

/* Melhor contraste/forma em cards de FAQ */
.faq summary{
  list-style: none;
}
.faq summary::-webkit-details-marker{ display:none; }
.faq details{
  border: 1px solid rgba(15,23,42,.10);
  background: rgba(255,255,255,.75);
}
.faq details[open]{
  box-shadow: 0 18px 45px rgba(15,23,42,.08);
}

/* Auth: melhor alinhamento e altura */
.auth{
  min-height: calc(100vh - 140px);
}
.auth-card{
  border: 1px solid rgba(15,23,42,.10);
  background: rgba(255,255,255,.55);
  border-radius: var(--radius);
  box-shadow: 0 18px 50px rgba(2,6,23,.06);
  padding: 22px;
  height: 100%;
}

/* Admin: tabelas mais claras */
.table th{
  font-weight: 600;
}
.table td, .table th{
  vertical-align: middle;
}

/* Admin: botões de ação compactos e consistentes */
.btn.small{
  padding: 8px 12px;
  border-radius: 12px;
}



/* Landing: FAQ cards (answers always visible) */
.faq-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;}
.faq-card{background:rgba(255,255,255,.78);border:1px solid rgba(15,23,42,.08);border-radius:18px;padding:16px;box-shadow:0 16px 40px rgba(2,6,23,.05);}
.faq-q{font-weight:700;margin-bottom:8px;}
@media (max-width: 980px){.faq-cards{grid-template-columns:1fr;}}

.ux-value-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;}
.ux-value-card{background:rgba(255,255,255,.8);border:1px solid rgba(15,23,42,.08);border-radius:18px;padding:16px;box-shadow:0 16px 40px rgba(2,6,23,.05);}
.ux-value-card h3{margin:0 0 8px;font-size:18px;line-height:1.3;}
@media (max-width: 980px){.ux-value-grid{grid-template-columns:1fr;}}


/* Admin dashboard shortcut menu */
.admin-shortcuts{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:12px;
}

.admin-chip{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:8px 12px;
  border-radius:999px;
  background: rgba(255,255,255,.92);
  color: var(--text);
  border: 1px solid var(--line);
  font-weight:600;
  box-shadow:none;
  text-decoration:none;
}

.admin-chip:hover{
  background: var(--primary-soft);
  border-color: rgba(37,99,235,.35);
  color: var(--primary);
}




/* ---------- SIDEBAR (SaaS dashboard) ---------- */
.sidebar.sidebar-solid{
  width: 260px;
  flex: 0 0 260px;
  background: linear-gradient(180deg, rgba(37,99,235,.10), rgba(16,185,129,.08));
  border-right: 1px solid var(--line);
}
.sidebar-inner{
  position: sticky;
  top: 66px; /* abaixo da topbar */
  height: calc(100vh - 66px);
  min-height: calc(100vh - 66px);
  padding: 18px 14px 44px;
  display:flex;
  flex-direction:column;
  gap: 14px;
  overflow-y: auto;
  overscroll-behavior: contain;
}
.sidebar-brand{
  display:flex;
  align-items:center;
  gap: 10px;
  padding: 10px 10px;
  border-radius: 14px;
  background: rgba(255,255,255,.65);
  border: 1px solid rgba(15,23,42,.06);
}
.brand-mark{
  width: 42px;
  height: 42px;
  border-radius: 13px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight: 700;
  color: #1d4ed8;
  background: rgba(37,99,235,.14);
}
.brand-text{min-width:0}
.brand-name{
  font-weight: 600;
  letter-spacing:-0.01em;
  font-size: 14px;
  color: var(--text);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.brand-sub{font-size: 12px; color: var(--muted); margin-top:2px}

.sidebar-user{
  display:flex;
  gap: 10px;
  align-items:center;
  padding: 10px 10px;
  border-radius: 14px;
  background: rgba(255,255,255,.55);
  border: 1px solid rgba(15,23,42,.06);
}
.user-dot{
  width: 10px; height:10px; border-radius: 999px;
  background: rgba(34,197,94,.95);
  box-shadow: 0 0 0 4px rgba(34,197,94,.12);
}
.user-name{font-weight: 600; font-size: 13px; color: var(--text); line-height:1.1}
.user-sub{font-size: 12px; color: var(--muted); margin-top:2px}

.sidebar-nav{
  display:flex;
  flex-direction:column;
  gap: 8px;
  padding: 6px 0;
}
.nav-item{
  display:flex;
  align-items:center;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 14px;
  text-decoration:none;
  color: var(--text);
  font-weight: 700;
  font-size: 12px;
  background: rgba(255,255,255,.35);
  border: 1px solid rgba(15,23,42,.06);
  white-space: normal;
  line-height: 1.2;
}
.nav-item:hover{
  background: rgba(255,255,255,.60);
  border-color: rgba(37,99,235,.18);
}
.nav-item.active{
  background: rgba(37,99,235,.14);
  border-color: rgba(37,99,235,.25);
  color: #1d4ed8;
}
.sidebar-footer{
  margin-top:auto;
  padding-top: 8px;
  display:flex;
  flex-direction:column;
  gap: 10px;
}

.sidebar-meta{display:flex;flex-direction:column;gap:4px}
.sidebar-version{font-size:12px;color:rgba(15,23,42,.65)}
.sidebar-report{font-size:12px;color:rgba(15,23,42,.70);text-decoration:underline;cursor:pointer}
.sidebar-report:hover{color:rgba(15,23,42,.95)}
.nav-logout{
  background: rgba(239,68,68,.08);
  border-color: rgba(239,68,68,.18);
  color: #991b1b;
}
.nav-logout:hover{background: rgba(239,68,68,.12); border-color: rgba(239,68,68,.25)}
@media (max-width: 980px){
  .sidebar.sidebar-solid{width: 220px; flex-basis:220px;}
  body.app-shell .main{padding: 22px 16px 32px;}
}
@media (max-width: 820px){
  .layout{flex-direction:column;}
  .sidebar.sidebar-solid{width:auto; flex-basis:auto; border-right:none; border-bottom:1px solid var(--line);}
  .sidebar-inner{position:relative; top:auto; height:auto; flex-direction:row; align-items:center; overflow:auto;}
  .sidebar-nav{flex-direction:row; gap: 8px; overflow:auto; padding: 0;}
  .sidebar-user{display:none;}
  .sidebar-footer{display:none;}
}

@media (max-width: 1100px){
  .kpi-grid{grid-template-columns: repeat(2, minmax(160px, 1fr));}
}
@media (max-width: 520px){
  .kpi-grid{grid-template-columns: 1fr;}
}



/* ===== PATCH v77: Full-width app + foco na lista ===== */

/* Garantir shell realmente full-width (evita “vazios” laterais em telas largas) */
body.app-shell .container{
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.app-shell .layout{
  width: 100% !important;
  align-items: stretch;
}

/* Sidebar e main com proporção mais “produto SaaS” */
body.app-shell .sidebar{
  width: 280px;
  background: rgba(255,255,255,.92);
}

body.app-shell .main{
  flex: 1 1 auto;
  min-width: 0;
  padding: 22px 28px 44px !important;
}

/* Topbar do app acompanha a largura total */
body.app-shell .topbar-inner{
  max-width: 100% !important;
  margin: 0 !important;
  padding-left: 18px !important;
  padding-right: 18px !important;
}

/* Mais densidade/menos “blog”: cards com espaçamento mais firme */
body.app-shell .card{
  border: 1px solid rgba(15,23,42,.08);
  box-shadow: 0 10px 26px rgba(2,6,23,.06);
}

/* Painel superior (cmdbar) mais compacto para dar protagonismo à lista */
body.app-shell .cmdbar{
  top: 68px;
  padding: 12px 14px;
  gap: 14px;
  border-radius: 18px;
}

body.app-shell .cmd-title{ font-size: 20px; }
body.app-shell .cmd-sub{ margin-top: 4px; font-size: 13px; }
body.app-shell .cmd-kicker{ margin-bottom: 2px; }

/* Lista da semana como “centro da página” */
body.app-shell .today.card{
  padding: 18px;
  border-color: rgba(37,99,235,.16);
  background: rgba(255,255,255,.82);
}

body.app-shell .today .section-title{
  font-size: 20px;
  font-weight: 700;
}

body.app-shell .queue-row{
  padding: 12px;
  border-radius: 18px;
  background: rgba(255,255,255,.78);
}

body.app-shell .q-title{ font-size: 15px; }
body.app-shell .q-meta{ font-size: 12px; }

/* Reduzir a sensação de “coluna estreita” em telas muito largas */
@media (min-width: 1500px){
  body.app-shell .main{
    padding-left: 34px !important;
    padding-right: 34px !important;
  }
}

/* Mobile: sidebar vira topo, manter padding adequado */
@media (max-width: 980px){
  body.app-shell .main{ padding: 16px 16px 40px !important; }
  body.app-shell .topbar-inner{ padding-left: 14px !important; padding-right: 14px !important; }
}




/* --- Patch P0c: tipografia e hierarquia (atividade / semana) --- */
.activity-title .act-subj { font-weight: 600; }
.activity-title .act-topic { font-weight: 400; }

.block-subject { font-weight: 600; }
.block-topic { font-weight: 400; }


/* Admin tables */
.admin-table{
  width:100%;
  border-collapse:separate;
  border-spacing:0;
  border:1px solid rgba(15,23,42,.10);
  border-radius:14px;
  overflow:hidden;
  background:#fff;
}
.admin-table thead th{
  font-size:12px;
  letter-spacing:.02em;
  text-transform:uppercase;
  font-weight:600;
  color:#334155;
  background:rgba(2,6,23,.03);
  padding:12px 14px;
  border-bottom:1px solid rgba(15,23,42,.10);
  text-align:left;
}
.admin-table td{
  padding:12px 14px;
  border-bottom:1px solid rgba(15,23,42,.07);
  vertical-align:middle;
}
.admin-table tbody tr:nth-child(even){
  background:rgba(2,6,23,.015);
}
.admin-table tbody tr:hover{
  background:rgba(59,130,246,.06);
}
.admin-table tbody tr:last-child td{
  border-bottom:none;
}
.admin-table .num{
  text-align:right;
  font-variant-numeric: tabular-nums;
  white-space:nowrap;
}
.admin-table-compact td{ padding:10px 14px; }
.admin-user-link{
  font-weight:600;
  color:inherit;
  text-decoration:none;
}
.admin-user-link:hover{ text-decoration:underline; }
.admin-subline{ font-size:12px; margin-top:2px; }
.admin-exam{ color:#0f172a; }

/* Progress */
.progress-wrap{
  display:flex;
  align-items:center;
  gap:10px;
  justify-content:flex-end;
}
.progress-bar{
  width:120px;
  height:8px;
  border-radius:999px;
  background:rgba(2,6,23,.08);
  overflow:hidden;
}
.progress-bar span{
  display:block;
  height:100%;
  width:0%;
  background:rgba(59,130,246,.75);
}
.progress-label{
  min-width:44px;
  text-align:right;
  font-weight:600;
  color:#0f172a;
}

/* Streak */
.streak-pill{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:32px;
  padding:2px 10px;
  border-radius:999px;
  border:1px solid rgba(15,23,42,.10);
  background:rgba(2,6,23,.03);
  font-weight:600;
}
.streak-fire{ margin-left:6px; }


/* ---------- History calendar (improved) ---------- */
.cal-grid{ display:grid; grid-template-columns: repeat(7, 1fr); gap:10px; }
.cal-d{
  border:1px solid #eef0f5;
  border-radius:12px;
  padding:10px;
  min-height:74px;
  background:#fff;
  cursor:pointer;
  transition: transform .05s ease, box-shadow .1s ease;
}
.cal-d:hover{ transform: translateY(-1px); box-shadow: 0 10px 22px rgba(0,0,0,.06); }
.cal-d.out{ opacity:.45; background:#fafbff; cursor:default; }
.cal-n{ font-weight:700; font-size:14px; }
.cal-meta{ margin-top:8px; display:flex; flex-direction:column; gap:4px; }
.cal-m1, .cal-m2{ font-size:12px; color:#556074; }
.cal-d.lv0{ background:#fff; }
.cal-d.lv1{ background:#f3f7ff; }
.cal-d.lv2{ background:#e6f0ff; }
.cal-d.lv3{ background:#d6e7ff; }
.cal-d.lv4{ background:#c6ddff; }

/* ---------- Day modal (history) ---------- */
/*
  IMPORTANT:
  We already have a generic `.modal` used by the global Confirm Modal.
  Styling `.modal` globally here made the Confirm Modal permanently visible
  (and without handlers), which looked like a frozen popup on public pages.
  Therefore, we scope these rules to the History day modal only.
*/
#dayModal{ position:fixed; inset:0; z-index:9999; display:flex; align-items:center; justify-content:center; }
#dayModal .modal-backdrop{ position:absolute; inset:0; background: rgba(14,18,28,.55); }
#dayModal .modal-card{
  position:relative;
  width: min(780px, calc(100vw - 24px));
  max-height: min(82vh, 760px);
  background:#fff;
  border-radius:18px;
  border:1px solid #eef0f5;
  box-shadow: 0 26px 70px rgba(0,0,0,.30);
  overflow:hidden;
}
#dayModal .modal-head{
  padding:14px 16px;
  border-bottom:1px solid #eef0f5;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
#dayModal .modal-body{ padding:14px 16px; overflow:auto; max-height: calc(82vh - 62px); }
body.modal-open{ overflow:hidden; }

.day-list{ display:flex; flex-direction:column; gap:10px; }
.day-row{
  display:flex; justify-content:space-between; align-items:flex-start; gap:12px;
  padding:12px; border:1px solid #eef0f5; border-radius:14px;
}
.day-title{ font-weight:700; }
.day-sub{ color:#556074; font-size:12px; margin-top:4px; }
.day-time{ font-weight:600; color:#26314a; }




/* Extra disciplines (planning step 2) */
.label-row{display:flex; align-items:baseline; justify-content:space-between; gap:12px}
.label-row .hint{font-size:12px; opacity:.75}
.extra-disciplines{display:flex; gap:14px; align-items:flex-start; margin-top:10px}
.extra-add-tile{
  flex:0 0 220px;
  min-height:120px;
  height:120px; /* FIX: não esticar com as linhas da direita */
  border-radius:16px;
  border:1px solid rgba(37,99,235,.25);
  background:rgba(37,99,235,.10);
  color:rgb(37,99,235);
  font-weight:700;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:14px;
}
.extra-add-tile:hover{background:rgba(37,99,235,.14)}
.extra-list{flex:1; display:flex; flex-direction:column; gap:10px}
.extra-row{display:flex; gap:10px; align-items:center}
.extra-row .extra-input{
  flex:1;
  padding:10px 12px;
  border-radius:12px;
  border:1px solid rgba(2,6,23,.14);
  background:rgba(255,255,255,.9);
  outline:none;
}
.extra-row .extra-input:focus{border-color:rgba(37,99,235,.35); box-shadow:0 0 0 4px rgba(37,99,235,.10)}
.extra-remove{
  flex:0 0 42px;
  width:42px;
  height:42px;
  border-radius:12px;
  border:1px solid rgba(239,68,68,.28);
  background:rgba(239,68,68,.10);
  color:rgb(239,68,68);
  font-weight:1000;
  cursor:pointer;
}
.extra-remove:hover{background:rgba(239,68,68,.14)}

.extra-save{
  flex:0 0 auto;
  height:42px;
  padding:0 12px;
  border-radius:12px;
  border:1px solid rgba(37,99,235,.22);
  background:rgba(37,99,235,.10);
  color:rgb(37,99,235);
  font-weight:700;
  cursor:pointer;
}
.extra-save:hover{background:rgba(37,99,235,.14)}
.extra-save[disabled]{opacity:.55; cursor:default}

/* Step 2 (planning): Extras UX simplificada */
.extra-add-row{display:flex; gap:10px; align-items:stretch; flex-wrap:nowrap}
.extra-add-row .extra-input{flex:1 1 auto; min-width:0}
.extra-add-row .btn{white-space:nowrap; flex:0 0 auto}
.extra-help{margin-top:8px; font-size:12px; color:rgba(2,6,23,.60)}
.extra-chip-title{margin-top:12px; font-weight:700; font-size:12px; color:rgba(2,6,23,.65)}
.extra-chips{display:flex; flex-wrap:wrap; gap:8px; margin-top:8px}
.extra-chip{display:inline-flex; align-items:center; gap:10px; padding:8px 10px; border-radius:999px; border:1px solid rgba(2,6,23,.12); background:rgba(255,255,255,.8)}
.extra-chip-text{font-weight:600}
.extra-chip-remove{border:1px solid rgba(239,68,68,.28); background:rgba(239,68,68,.10); color:rgb(239,68,68); font-weight:700; padding:6px 10px; border-radius:999px; cursor:pointer}
.extra-chip-remove:hover{background:rgba(239,68,68,.14)}
.extra-chip-remove[disabled]{opacity:.60; cursor:default}
@media (max-width: 900px){
  .extra-disciplines{flex-direction:column}
  .extra-add-tile{width:100%; flex:0 0 auto}
}


/* --- Compact cards (used in diagnóstico / histórico) --- */
.card.sm{ padding: 18px; }
.card.xs{ padding: 14px; }
@media (max-width: 640px){
  .card.sm{ padding: 16px; }
  .card.xs{ padding: 12px; }
}

/* --- Charts compact --- */
.charts-head{ margin-top: 14px; margin-bottom: 12px; }
.charts-card{ margin-bottom: 12px; overflow: hidden; }
.charts-toolbar .pill{ padding: 6px 10px; }
.charts-toolbar select.input{ height: 32px; padding: 6px 10px; }

.metaChartBox{
  position: relative;
  height: 240px;
}
.metaChartBox canvas{
  width: 100% !important;
  height: 100% !important;
}

/* --- Diagnóstico sizing tweaks --- */
.diag-grid{ gap: 10px; }
.diag-item{ padding: 10px; border-radius: 16px; min-width: 150px; }
.diag-val{ font-size: 18px; }
.summary-item{ padding: 10px; border-radius: 16px; }
.summary-val{ font-size: 16px; }

/* --- History calendar tighter --- */
.calendar{ gap: 8px; }
.calendar .day{ padding: 10px; border-radius: 14px; min-height: 64px; }
.calendar .day .muted{ margin-top: 4px !important; }



/* --- Premium grids for /schedule and /history --- */
.diag-grid{
  display:grid;
  grid-template-columns: minmax(0, 1fr) 360px;
  gap:16px;
  align-items:start;
}
.diag-grid--schedule{margin-top:14px}
@media (max-width: 980px){
  .diag-grid{ grid-template-columns:1fr; }
}

.diag-grid > div:last-child{
  position: sticky;
  top: 14px;
  align-self: start;
}
@media (max-width: 980px){
  .diag-grid > div:last-child{ position: static; }
}

.diag-charts{
  display:grid;
  gap:12px;
}
.chart-wrap{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:10px 8px 8px;
  min-width:0;
  overflow:hidden;
}

.diag-charts canvas{
  max-width:100%;
  height:auto;
}
.chart-center{
  position:absolute;
  text-align:center;
  pointer-events:none;
}
.chart-center__big{
  font-weight:950;
  font-size:26px;
  letter-spacing:-.02em;
}
.chart-center__small{
  margin-top:2px;
  font-size:12px;
  color: var(--muted);
}
.chart-legend{
  width:100%;
  margin-top:10px;
  display:grid;
  gap:6px;
}
.legend-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  font-size:12px;
}
.legend-dot{
  width:10px;
  height:10px;
  border-radius:999px;
  box-shadow: 0 0 0 3px rgba(15,23,42,.05);
  margin-right:8px;
  flex:0 0 auto;
}

.thermo-chart-card{
  position:relative;
  min-width:0;
  overflow:hidden;
}

.thermo-chart-wrap{
  position:relative;
  width:100%;
  height:140px;
  min-width:0;
  overflow:hidden;
}

.thermo-chart-wrap--tall{
  height:160px;
}

.thermo-chart-wrap canvas{
  display:block;
  width:100% !important;
  height:100% !important;
  box-sizing:border-box;
}

.thermo-placeholder{
  margin-top:8px;
  color: var(--muted);
  font-size:13px;
  font-weight:600;
}

.thermo-placeholder[hidden]{
  display:none !important;
}
.legend-name{
  flex:1 1 auto;
  color: rgba(15,23,42,.82);
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.legend-val{
  color: var(--muted);
  font-weight:600;
  flex:0 0 auto;
}

/* History */
.history-header{justify-content:space-between;align-items:flex-start;gap:14px;margin-bottom:12px}
.history-toolbar{padding:12px;margin-bottom:12px}
.history-dashboard{display:grid;gap:14px}
.history-kpi-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;align-items:stretch}
.history-kpi-card{padding:14px;min-height:220px;display:flex;flex-direction:column;height:100%}
.history-kpi-card .chart-wrap{display:grid;place-items:center;flex:1;min-height:150px}
.history-kpi-card canvas{max-width:100%;height:auto}
.history-streak-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:10px}
.history-streak-grid .pill.big{height:100%;padding:10px 8px;display:grid;justify-items:center;text-align:center;gap:4px}
.history-secondary-row{display:grid;grid-template-columns:minmax(0,1fr);gap:14px;align-items:start}
.history-cards{display:grid;grid-template-columns:minmax(0,.4fr) minmax(0,.6fr);gap:14px;align-items:start}
.history-card{height:auto}
.history-summary-panel{padding:12px;display:flex;flex-direction:column;min-height:0;height:100%}
.history-summary-panel .section-title,.history-summary-card__title{font-size:16px;line-height:1.2;font-weight:900}
.history-summary-card{min-height:0}
.history-month-summary-card,
.history-summary-card{
  max-height:320px;
  overflow:auto;
}
.history-topics-card{padding:14px}
.history-table-wrap{overflow:auto}
.history-summary-card .history-table-wrap{flex:1;min-height:0;overflow:visible}
.history-summary-card .sp-table thead th{position:sticky;top:0;background:var(--card);z-index:2}
.history-month-summary-card{gap:8px}
.history-month-kpis{display:grid;gap:6px;margin-top:8px}
.history-month-kpis .pill.big{display:flex;justify-content:space-between;align-items:center;padding:8px 10px}
.history-month-kpis .muted.small{font-size:11px}
.history-month-kpis .pill-val{font-size:14px;line-height:1.2}
.history-month-bestday{margin-top:6px;font-size:12px}
.history-month-top3{margin-top:6px}
.history-month-top3 ul{list-style:none;padding:0;margin:4px 0 0;display:grid;gap:4px}
.history-month-top3 li{display:flex;justify-content:space-between;gap:12px;font-size:12px}
.history-summary-card__head{justify-content:space-between;align-items:center;gap:10px;margin-bottom:8px;flex-wrap:wrap}
.history-summary-card__total{font-size:12px;line-height:1.3}
.history-summary-table{font-size:12px}
.history-summary-table th,.history-summary-table td{padding:7px 8px}
.hist-perf-top{
  display:grid;
  grid-template-columns: 1.15fr .85fr;
  gap:14px;
  align-items:start;
  margin-bottom:12px;
}
@media (max-width: 980px){
  .hist-perf-top{ grid-template-columns:1fr; }
  .history-perf-layout{grid-template-columns:1fr}
  .history-summary-card{max-height:none}
}
.hist-charts{
  display:grid;
  gap:12px;
}
.spark-wrap{
  padding:8px 8px 0;
}
.spark-axis{
  display:flex;
  justify-content:space-between;
  margin-top:6px;
  padding:0 8px 6px;
}

.history-table-controls{display:grid;grid-template-columns:minmax(220px,1fr) minmax(200px,.7fr) auto minmax(220px,.7fr);gap:10px;align-items:center;margin-bottom:10px}
.history-toggle{display:inline-flex;align-items:center;gap:10px;font-size:13px;color:var(--muted);font-weight:700}
.history-toggle input{appearance:none;width:40px;height:22px;border-radius:999px;border:1px solid var(--border);background:rgba(148,163,184,.35);position:relative;transition:.2s}
.history-toggle input::before{content:"";position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:#fff;transition:.2s;box-shadow:0 1px 3px rgba(2,6,23,.2)}
.history-toggle input:checked{background:var(--primary);border-color:var(--primary)}
.history-toggle input:checked::before{left:20px}

.history-topics-table .topic-col{width:34%}
.history-topics-table th.num,.history-topics-table td.num{text-align:right;width:88px;white-space:nowrap}
.history-topics-table tbody tr:nth-child(odd) td{background:rgba(148,163,184,.08)}
.history-topics-table tbody tr:hover td{background:rgba(37,99,235,.08)}

.revprio-table{
  width:100%;
  table-layout:fixed;
  border-collapse:separate;
  border-spacing:0;
  min-width:0;
}
.revprio-table th:nth-child(2),
.revprio-table td:nth-child(2){text-align:left}

.revprio-table,
.revprio-table thead,
.revprio-table tbody,
.revprio-table tr,
.revprio-table th,
.revprio-table td{
  display:table;
  float:none;
}
.revprio-table thead{display:table-header-group}
.revprio-table tbody{display:table-row-group}
.revprio-table tr{display:table-row}
.revprio-table th,.revprio-table td{display:table-cell;vertical-align:middle}
.revprio-table .topic-col{width:34%}
.revprio-table td > *{max-width:100%}

.topic-cell{max-width:420px}
.topic-cell .topic-text{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;line-height:1.3;word-break:break-word}
.topic-expand{display:inline-flex;align-items:center;padding:0;margin-top:4px;border:none;background:transparent;color:var(--primary);font-size:12px;font-weight:700;cursor:pointer}

.topic-full-modal-root{display:none}
.topic-full-modal-root.is-open{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;padding:16px;z-index:9999}
.topic-full-modal-overlay{
  position:absolute;
  inset:0;
  background:rgba(0,0,0,.45);
}
.topic-full-modal{
  position:relative;
  width:min(760px, 95vw);
  max-height:90vh;
  background:#fff;
  color:#0f172a;
  border-radius:16px;
  border:1px solid rgba(15,23,42,.12);
  box-shadow:0 20px 40px rgba(0,0,0,.12);
  z-index:1;
  display:flex;
  flex-direction:column;
  overflow:hidden;
}
.topic-full-modal__header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:16px 18px;
  border-bottom:1px solid #e5e7eb;
  margin-bottom:16px;
}
.topic-full-modal__title{font-weight:700;font-size:20px}
.topic-full-modal__subtitle{margin-top:2px;color:#6b7280}
.topic-full-modal__body{
  overflow-y:auto;
  overflow-x:hidden;
  padding:0 14px 14px;
  white-space:normal;
  line-height:1.45;
  min-height:0;
}
.topic-details-content{display:flex;flex-direction:column;gap:10px;width:100%;min-width:0}
.modal-section{background:#f8fafc;border-radius:12px;padding:12px;margin-bottom:0;border:1px solid #e5e7eb;width:100%;max-width:100%;box-sizing:border-box;height:auto;min-width:0}
.topic-details-block__title{font-weight:900;margin-bottom:6px;font-size:13px;line-height:1.2}
.topic-details-topic-text{white-space:pre-wrap;line-height:1.4;font-size:12px;padding:8px;min-height:44px;background:#fff;border-radius:8px;border:1px solid #e5e7eb}
.topic-details-link{margin-top:6px;font-size:12px}
.modal-metrics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.metric-card{background:#fff;padding:10px;border-radius:8px;border:1px solid #e5e7eb;text-align:center;display:grid;gap:4px}
.metric-card span{font-size:12px;color:var(--muted)}
.topic-trend-chip{display:inline-flex;padding:4px 8px;border-radius:999px;border:1px solid var(--border);font-weight:800;background:rgba(37,99,235,.09);font-size:11px}
.topic-timeline-wrap{overflow-x:hidden;overflow-y:visible}
.topic-timeline-table{font-size:12px;table-layout:fixed;width:100%}
.topic-timeline-table th,.topic-timeline-table td{padding:6px 7px;vertical-align:top;word-break:break-word}
.topic-timeline-table th:nth-child(1),
.topic-timeline-table td:nth-child(1){width:116px}
.topic-timeline-table th:nth-child(2),
.topic-timeline-table td:nth-child(2){width:92px}
.topic-timeline-table th:nth-child(3),
.topic-timeline-table td:nth-child(3),
.topic-timeline-table th:nth-child(4),
.topic-timeline-table td:nth-child(4),
.topic-timeline-table th:nth-child(5),
.topic-timeline-table td:nth-child(5){width:78px}
.topic-timeline-table th:last-child,
.topic-timeline-table td:last-child{width:auto;overflow-wrap:anywhere}
.history-topic-modal{overflow:hidden}
.history-topic-modal .topic-full-modal__header{padding:12px 14px;margin-bottom:10px}
.history-topic-modal .topic-full-modal__title{font-size:18px}
.history-topic-modal .modal-metrics{gap:8px}
.history-topic-modal .metric-card{padding:8px}

.cal-mini{padding:14px;height:fit-content;align-self:start}
.cal-mini-head{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:12px}
.cal-mini-nav{display:flex;gap:8px}
/*
  NOTE: .btn-sm is also used as a standalone small icon button (e.g. history month nav).
  When combined with the main .btn class ("btn btn-sm"), it MUST keep the primary styling.
  So we scope this 32x32 icon style to elements that are NOT .btn.
*/
.btn-sm:not(.btn){display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:10px;border:1px solid var(--border);background:var(--card);font-weight:900}
.cal-mini-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:8px}
.cal-mini-grid .dow{font-size:11px;color:var(--muted);text-align:center;padding:2px 0;font-weight:700}
.cal-mini-grid .day{display:flex;align-items:center;justify-content:center;height:34px;border-radius:10px;border:1px solid var(--border);background:rgba(255,255,255,.03);font-weight:700;font-size:13px;text-decoration:none;color:inherit;transition:.15s}
.cal-mini-grid .day:hover{border-color:var(--history-study-accent);color:var(--history-study-accent)}
.cal-mini-grid .day.out{opacity:.35}
.cal-mini-grid .day.has{background:color-mix(in srgb, var(--history-study-accent) 14%, white);border-color:color-mix(in srgb, var(--history-study-accent) 45%, white);color:#0f172a}
.cal-mini-foot{display:flex;justify-content:flex-start;align-items:center;gap:12px;margin-top:12px}
.cal-mini-foot .dot{width:10px;height:10px;border-radius:999px;background:var(--history-study-accent);display:inline-block}

.sessions-panel{padding:14px}
.sessCards{display:grid;gap:12px}
.sessions-filters{display:grid;grid-template-columns:minmax(180px,1fr) minmax(160px,.7fr) auto minmax(220px,1.4fr);gap:10px;align-items:center;margin-bottom:12px}
.sess-day{border:1px solid var(--border);border-radius:16px;background:var(--card);overflow:hidden}
.sess-day-head{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:12px 14px;border-bottom:1px solid var(--border);background:rgba(255,255,255,.02)}
.sess-day-head .day{font-weight:900}
.chip{display:inline-flex;align-items:center;gap:8px;padding:6px 10px;border-radius:999px;border:1px solid var(--border);background:rgba(255,255,255,.03);font-weight:800;font-size:12px}
.sess-day-body{display:grid}
.sess-item + .sess-item{border-top:1px solid var(--border)}
.sess-toggle{width:100%;border:none;background:transparent;padding:12px 14px;display:grid;grid-template-columns:minmax(210px,1fr) auto minmax(180px,auto) auto;gap:12px;align-items:center;text-align:left;cursor:pointer;transition:.15s}
.sess-toggle:hover{background:rgba(37,99,235,.06)}
.sess-toggle:active{transform:translateY(1px)}
.sess-left .title{font-weight:900}
.sess-left .tiny{font-size:11px;margin-top:2px}
.sess-center .t{font-weight:900;font-size:16px;min-width:92px;text-align:center}
.sess-right{display:grid;justify-items:end;gap:6px}
.sess-badges{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.nums{display:flex;gap:10px;align-items:center;font-weight:900;justify-content:flex-end}
.nums .ok{color:#22c55e}.nums .bad{color:#ef4444}.nums .all{color:var(--muted)}
.sess-chevron{font-size:18px;color:var(--muted);transition:.15s}
.sess-item.open .sess-chevron{transform:rotate(180deg);color:var(--primary)}
.sess-details{padding:0 14px 14px 14px;display:grid;gap:6px;font-size:13px;color:var(--muted);border-top:1px dashed var(--border)}

/* Make schedule/history tables feel tighter */
.sp-table td, .sp-table th{ padding:10px 12px; }
.card.sm .sp-table td, .card.sm .sp-table th{ padding:9px 10px; }


/* evita rolagem horizontal acidental */
body{ overflow-x:hidden; }


.sp-modal .modal-body{ overflow:auto; min-height:0; }


@media (min-width: 920px){
  .save-grid{ grid-template-columns: 1.1fr 0.9fr; align-items: start; }
  .save-panels{ grid-template-columns: 1fr 1fr; }
  .save-panels > .panel:last-child{ grid-column: 1 / -1; }
  .panel-grid{ grid-template-columns: 1fr 1fr; }
  .panel-grid .field.span-2{ grid-column: 1 / -1; }
}

/* History tabs: align class .tab with existing tab-btn styles */
.tabs .tab{
  appearance:none;
  border:1px solid var(--line);
  background: rgba(255,255,255,.55);
  padding: 8px 10px;
  border-radius: 999px;
  cursor:pointer;
  display:flex;
  align-items:center;
  gap:8px;
  font-weight: 600;
  font-size: 13px;
}
.tabs .tab:hover{ box-shadow: 0 6px 18px rgba(0,0,0,.08); transform: translateY(-1px); }
.tabs .tab.active{
  background: rgba(37,99,235,.10);
  border-color: rgba(37,99,235,.35);
  color: rgba(37,99,235,1);
}

@media (max-width: 1080px){
  .history-kpi-row{grid-template-columns:1fr 1fr}
  .history-kpi-row .history-kpi-card:last-child{grid-column:1 / -1}
  .history-cards{grid-template-columns:1fr}
  .history-summary-card{max-height:none}
  .history-table-controls,.sessions-filters{grid-template-columns:1fr 1fr}
}
@media (max-width: 720px){
  .history-kpi-row,.history-streak-grid,.history-cards,.history-table-controls,.sessions-filters{grid-template-columns:1fr}
  .modal-metrics{grid-template-columns:1fr}
  .sess-toggle{grid-template-columns:1fr;align-items:flex-start}
  .sess-center .t{text-align:left}
  .sess-right{justify-items:start}
  .sess-badges{justify-content:flex-start}
}

/* Profile responsiveness */
@media (max-width: 720px){
  .profile-grid-2col{ grid-template-columns: 1fr !important; }
  .profile-grid-3col{ grid-template-columns: 1fr !important; }
  .profile-row-end{ text-align:left !important; }
}

.footer-social .footer-ig{
  width:42px;height:42px;border-radius:12px;
  display:flex;align-items:center;justify-content:center;
  border:1px solid var(--line);
  background: rgba(255,255,255,.55);
}
.ig-icon{ width:20px;height:20px; fill: rgba(17,24,39,.9); }
.footer-ig:hover{ transform: translateY(-1px); }


/* Hero watermark logo */
.hero{ position:relative; overflow:hidden; }
.hero-watermark{
  position:absolute;
  left:34px;
  top:18px;
  width:min(560px, 72vw);
  height:auto;
  opacity:0.18;
  filter:saturate(1.1);
  pointer-events:none;
  user-select:none;
  z-index:0;
}
.hero-inner{ position:relative; z-index:1; }
@media (max-width: 720px){
  .hero-watermark{
    left:18px;
    top:10px;
    width:min(460px, 92vw);
    opacity:0.14;
  }
}

/* Landing: logo limpo no header */
.page-landing .topbar .brand{align-items:center;}
.page-landing .topbar .brand-mark{display:flex;}


/* Landing benefits cards - responsive + title wrapping */
.feature-h{
  margin:0;
  font-weight:600;
  line-height:1.2;
  word-break:normal;
  overflow-wrap:break-word;
}
.feature-sub{ overflow-wrap:break-word; }

@media (max-width: 980px){
  .feature-grid{ grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px){
  .feature-grid{ grid-template-columns: 1fr; }
  .feature-card{ padding:14px 14px; }
  .feature-icon{ flex:0 0 auto; }
}



/* Global busy indicator (AJAX) */
.busy-indicator{
  position: fixed;
  right: 18px;
  top: 18px;
  z-index: 10000;
  display: none;
  gap: 6px;
  align-items: center;
  padding: 10px 12px;
  border-radius: 999px;
  border: 1px solid rgba(2,6,23,.10);
  background: rgba(255,255,255,.92);
  box-shadow: 0 10px 30px rgba(2,6,23,.12);
  backdrop-filter: blur(6px);
}
.busy-indicator span{
  width: 6px;
  height: 6px;
  border-radius: 999px;
  background: rgba(2,6,23,.45);
  display: inline-block;
  animation: busyPulse 0.9s infinite ease-in-out;
}
.busy-indicator span:nth-child(2){ animation-delay: .12s; }
.busy-indicator span:nth-child(3){ animation-delay: .24s; }

@keyframes busyPulse{
  0%, 80%, 100% { transform: translateY(0); opacity: .35; }
  40% { transform: translateY(-3px); opacity: 1; }
}



/* ------------------------------
   Planning Step 2 - Extras UX (polished)
---------------------------------*/
.extra-disciplines{display:block; margin-top:10px}
.extra-add-row{display:flex; gap:10px; align-items:stretch; flex-wrap:nowrap}
.extra-add-row{max-width:520px;}
.extra-add-row .input.extra-input{
  flex: 1 1 auto;
  min-width: 0;
  max-width: none;
  width: 100%;
}
#extra_add_btn{ white-space:nowrap; align-self:stretch; }
.extra-help{margin-top:8px; color: rgba(2,6,23,.62); font-size:12px}
.extra-chip-title{margin-top:14px}
.extra-chips{
  display:flex;
  flex-direction:column;
  gap:10px;
  margin-top:10px;
  max-width: 520px;
}
.extra-chip{
  width:100%;
  justify-content:space-between;
  border-radius:14px;
  padding:10px 12px;
}
.extra-chip-text{font-weight:600}
.extra-chip-remove{
  border: 1px solid rgba(2,6,23,.12);
  background: #fff;
  color: rgba(2,6,23,.68);
  font-weight:600;
  padding:7px 12px;
  border-radius:999px;
  cursor:pointer;
}
.extra-chip-remove:hover{
  border-color: rgba(239,68,68,.28);
  color: rgb(239,68,68);
  background: rgba(239,68,68,.06);
}
.extra-chip-remove[disabled]{opacity:.60; cursor:default}

/* ---------- Mobile nav drawer (logged-in shell only) ---------- */
.mobile-nav-toggle,
.mobile-nav-backdrop{
  display:none;
}

@media (max-width: 680px){
  .extra-add-row{flex-direction:column; align-items:stretch;}
  .extra-add-row .input.extra-input{max-width:none;}
}

@media (max-width: 980px){
  body.app-shell .user-menu-mobile-nav{ display:block; }

  body.app-shell .mobile-nav-toggle{
    display:inline-flex;
    align-items:center;
    gap:6px;
    border:1px solid rgba(15,23,42,.14);
    background: rgba(255,255,255,.82);
    border-radius: 12px;
    padding: 8px 10px;
    font-weight: 700;
    color: var(--text);
    cursor: pointer;
  }

  body.app-shell .mobile-nav-backdrop{
    position: fixed;
    inset: 0;
    z-index: 58;
    border: 0;
    background: rgba(2,6,23,.45);
  }

  body.app-shell .sidebar.sidebar-solid{
    display:block;
    position: fixed;
    top: 68px;
    left: 10px;
    width: min(290px, calc(100vw - 20px));
    max-height: calc(100vh - 86px);
    z-index: 60;
    border: 1px solid rgba(15,23,42,.12);
    border-radius: 16px;
    box-shadow: 0 24px 56px rgba(2,6,23,.24);
    transform: translateX(-120%);
    transition: transform .2s ease;
    overflow: hidden;
  }

  body.app-shell .sidebar-inner{
    top: 0;
    height: 100%;
    overflow-y: auto;
  }

  body.app-shell.mobile-nav-open .sidebar.sidebar-solid{
    transform: translateX(0);
  }

  body.app-shell.mobile-nav-open .mobile-nav-backdrop{
    display:block;
  }
}

/* planning step 3 compact reorder */
.subject-seq-list{display:flex;flex-direction:column;gap:10px;max-height:62vh;overflow:auto;padding-right:4px}
.subject-seq-item{border:1px solid rgba(2,6,23,.1);border-radius:12px;background:rgba(255,255,255,.78);padding:10px 12px}
.subject-seq-head{display:flex;justify-content:space-between;gap:10px;align-items:center}
.subject-seq-main{display:flex;align-items:center;gap:8px;min-width:0;flex:1 1 auto;border:0;background:transparent;padding:0;text-align:left;cursor:pointer;color:inherit;font:inherit}
.subject-seq-caret{font-size:12px;color:#64748b;transition:transform .2s ease}
.subject-seq-item.is-open .subject-seq-caret{transform:rotate(180deg)}
.subject-seq-title{font-size:13px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:520px}
.subject-seq-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end;flex:0 0 auto}
.subject-seq-editor{margin-top:10px}
.subject-seq-editor.is-hidden{display:none}
.topic-sort-wrap{display:flex;flex-direction:column;gap:10px}
.topic-sort-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.topic-sort-item{display:flex;align-items:center;gap:8px;padding:8px;border:1px solid rgba(2,6,23,.10);border-radius:12px;background:#fff}
.topic-sort-item.is-dragging{opacity:.55}
.topic-sort-item.is-over{border-color:rgba(37,99,235,.45);box-shadow:0 0 0 3px rgba(37,99,235,.12)}
.topic-sort-handle{font-weight:700;color:rgba(2,6,23,.45);cursor:grab}
.topic-sort-item-input{flex:1 1 auto;min-width:0}
.topic-sort-remove{
  white-space:nowrap;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:34px;
  height:34px;
  padding:0;
  border-radius:10px;
  border:1px solid rgba(220,38,38,.25);
  background: rgba(220,38,38,.06);
  color: rgb(220,38,38);
  font-weight:800;
  line-height:1;
  box-shadow:none;
  cursor:pointer;
}
.topic-sort-remove:hover{ background: rgba(220,38,38,.10); border-color: rgba(220,38,38,.40); }
.topic-sort-remove:focus{ outline:none; box-shadow: 0 0 0 3px rgba(220,38,38,.18); }
.topic-sort-add-row{display:flex;gap:8px;align-items:stretch}
.topic-sort-add-row .topic-sort-input{flex:1 1 auto;min-width:0}
.topics-textarea.compact{min-height:104px;font-size:12px;line-height:1.35}
.tl-topic-list{overflow-x:hidden}
.tl-topic{flex:1 1 320px;min-width:220px;max-width:100%;word-break:break-word}

/* admin plans cleanup */
.admin-plans-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:12px}
.admin-plan-card{border:1px solid rgba(2,6,23,.1);border-radius:14px;padding:12px;background:rgba(255,255,255,.78)}
.admin-plan-meta{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.admin-plan-toolbar{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}

/* Landing refresh - foco conversão (aprovação sem promessas) */
.lp-hero-inner{grid-template-columns:1.05fr .95fr;}
.lp-hero-media img{width:100%;height:auto;display:block;border-radius:16px;border:1px solid rgba(15,23,42,.08);box-shadow:0 20px 40px rgba(2,6,23,.08);background:#fff;}
.lp-social-inline{margin-top:14px;display:flex;gap:8px;flex-wrap:wrap;font-size:14px;align-items:center;}
.lp-hero-strip .metric{background:rgba(255,255,255,.74);border:1px solid rgba(15,23,42,.08);}
.lp-compare{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;}
.lp-compare-card{border-radius:18px;padding:18px;background:#fff;border:1px solid rgba(15,23,42,.08);box-shadow:0 14px 30px rgba(2,6,23,.05);}
.lp-compare-card h3{margin:0 0 10px;font-size:18px;line-height:1.2;font-weight:700;color:#0f172a;}
.lp-compare-card ul{margin:0;padding-left:18px;display:grid;gap:8px;color:var(--muted);font-size:14px;}
.lp-compare-bad{border-color:rgba(239,68,68,.24);background:linear-gradient(180deg, rgba(254,242,242,.85), #fff);}
.lp-compare-mid{border-color:rgba(59,130,246,.20);background:linear-gradient(180deg, rgba(239,246,255,.85), #fff);}
.lp-compare-best{border-color:rgba(16,185,129,.28);background:linear-gradient(180deg, rgba(236,253,245,.86), #fff);}
.lp-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;}
.lp-proof-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;}
.lp-proof-card{background:#fff;border:1px solid rgba(15,23,42,.08);border-radius:18px;padding:16px;box-shadow:0 14px 30px rgba(2,6,23,.05);}
.lp-proof-number{font-size:32px;font-weight:700;line-height:1.1;letter-spacing:-.02em;color:#1d4ed8;}
.lp-showcase-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;}
.lp-showcase-card{margin:0;background:#fff;border:1px solid rgba(15,23,42,.08);border-radius:18px;padding:12px;box-shadow:0 14px 30px rgba(2,6,23,.05);}
.lp-showcase-card img{width:100%;height:auto;border-radius:12px;display:block;}
.lp-showcase-card figcaption{margin-top:8px;font-size:14px;color:var(--muted);line-height:1.4;}
.lp-pricing .price-card{position:relative;}
.lp-badge{display:inline-block;padding:5px 10px;border-radius:999px;font-size:11px;font-weight:700;background:rgba(37,99,235,.12);border:1px solid rgba(37,99,235,.2);color:#1d4ed8;margin-bottom:10px;}

@media (max-width: 760px){
  .cookie-banner{left:10px;right:10px;bottom:10px;align-items:flex-start;flex-direction:column;}
  .cookie-banner__actions{width:100%;justify-content:space-between;}
}
.lp-cta-final{margin-bottom:8px;}

@media (max-width: 980px){
  .lp-hero-inner{grid-template-columns:1fr;}
  .lp-steps,.lp-proof-grid,.lp-showcase-grid,.lp-compare{grid-template-columns:1fr;}
}


.lp-hero{isolation:isolate;}
.lp-hero-watermark{
  left:32px;
  right:auto;
  top:96px;
  width:min(480px,42vw);
  opacity:.09;
  filter:saturate(1.15) contrast(1.05);
  z-index:0;
}
.lp-shot-wrap{position:relative;border-radius:12px;overflow:hidden;border:1px solid rgba(37,99,235,.18);}
.lp-shot-wrap::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(135deg, rgba(37,99,235,.16), rgba(99,102,241,.10), rgba(14,165,233,.08));
  mix-blend-mode:multiply;
  pointer-events:none;
}
.lp-shot-wrap img{
  width:100%;
  height:auto;
  display:block;
  filter:saturate(1.12) contrast(1.04);
}
@media (max-width: 980px){
  .lp-hero-watermark{left:14px;top:130px;width:min(340px,70vw);opacity:.08;}
}


.thermo-premium{
  margin-top:12px;
}

.thermo-premium__header{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  margin-bottom:12px;
}

.thermo-premium__header h1{
  margin:0;
  font-size:28px;
  line-height:1.1;
  font-weight:800;
  letter-spacing:-.02em;
}

.thermo-premium__header p{
  margin:6px 0 0;
  color:#64748b;
  font-weight:500;
}

.thermo-premium__scope{
  background:linear-gradient(135deg, rgba(14,165,233,.12), rgba(99,102,241,.12));
  color:#0f172a;
  border:1px solid rgba(14,165,233,.2);
  border-radius:999px;
  padding:8px 14px;
  font-size:12px;
  font-weight:700;
}

.thermo-premium__grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}

.thermo-widget{
  border-radius:16px;
  border:1px solid rgba(148,163,184,.22);
  background:linear-gradient(180deg,#fff 0%, #f8fbff 100%);
  box-shadow:0 12px 28px rgba(15,23,42,.08);
}

.thermo-widget__head{
  display:flex;
  justify-content:space-between;
  gap:12px;
  margin-bottom:8px;
}

.thermo-widget__head h3{ margin:0; font-weight:800; }
.thermo-widget__head p{ margin:4px 0 0; color:#64748b; font-size:13px; }

.thermo-widget__subhead{
  display:flex;
  gap:10px;
  margin-bottom:12px;
  align-items:flex-end;
  justify-content:space-between;
  flex-wrap:wrap;
}

.thermo-control{ display:flex; flex-direction:column; gap:5px; font-size:12px; font-weight:700; color:#334155; }

.thermo-select{
  background:#fff;
  border:1px solid rgba(148,163,184,.35);
  border-radius:10px;
  padding:8px 10px;
  min-width:190px;
}

.thermo-chart-wrap--line{ height:260px; }
.thermo-chart-wrap--radar{ height:300px; }
.thermo-chart-wrap--bars{ height:320px; }

.thermo-state{
  border:1px dashed rgba(148,163,184,.35);
  border-radius:12px;
  padding:16px;
  color:#64748b;
  font-weight:600;
  background:rgba(248,250,252,.65);
}

.thermo-state--loading{ border-style:solid; }

.thermo-skeleton{
  background:linear-gradient(90deg, #e2e8f0 0%, #f1f5f9 50%, #e2e8f0 100%);
  background-size:200% 100%;
  animation:thermo-shimmer 1.6s linear infinite;
  border-radius:10px;
}

.thermo-skeleton--title{ height:16px; width:42%; margin-bottom:12px; }
.thermo-skeleton--chart{ height:190px; width:100%; }

.thermo-kpi{
  border-radius:10px;
  border:1px solid rgba(14,165,233,.25);
  background:linear-gradient(135deg, rgba(14,165,233,.08), rgba(99,102,241,.06));
  padding:10px 12px;
  font-size:12px;
  color:#0f172a;
  font-weight:700;
}

@keyframes thermo-shimmer{
  from{ background-position:200% 0; }
  to{ background-position:-200% 0; }
}

@media (max-width:980px){
  .thermo-premium__grid{ grid-template-columns:1fr; }
  .thermo-premium__header{ flex-direction:column; }
  .thermo-select{ min-width:100%; }
}

.thermo-compat{ display:none; }

/* /schedule premium restructuring */
.diag{gap:16px}
.diag__top{
  display:grid;
  grid-template-columns:minmax(0,7fr) minmax(0,3fr);
  gap:24px;
  align-items:stretch;
}
.diag__summary,
.diag__controls,
.diag__list,
.diag-charts .card{
  border-radius:18px;
  padding:24px;
  box-shadow:0 10px 26px rgba(15,23,42,.08);
  border:1px solid rgba(15,23,42,.08);
}
.diag__summary{grid-column:1}
.diag-charts{grid-column:2;display:grid;gap:24px;grid-template-areas:'progress' 'time';}
.diag-charts__progress{grid-area:progress}
.diag-charts__time{grid-area:time;grid-column:1 / -1}
.diag__top .diag-charts{
  grid-column:2;
}
.diag__top .diag-charts__time{
  grid-column:1 / -1;
}
.diag__top{grid-template-areas:'summary progress' 'time time'}
.diag__top .diag__summary{grid-area:summary}
.diag__top .diag-charts{grid-area:progress}
.diag__top .diag-charts .diag-charts__time{grid-area:time}
.diag__controls{padding:16px 20px}

.chart-wrap{
  overflow:visible;
  min-height:280px;
  height:280px;
  display:flex;
  align-items:center;
  justify-content:center;
}
.diag-charts canvas{
  width:100% !important;
  height:100% !important;
  max-height:280px;
}

.diag__list{padding:0;overflow:auto;max-height:none}
.diag__listHead,
.diag__main{
  grid-template-columns:3fr 1fr 1fr 1.5fr 1.5fr 1.5fr;
  min-width:1080px;
}
.diag__listHead{padding:14px 18px}
.diag__main{padding:16px 18px;transition:transform .16s ease, box-shadow .16s ease, background .16s ease}
.diag__row{border-top:1px solid rgba(15,23,42,.08)}
.diag__row:nth-child(even){background:rgba(148,163,184,.08)}
.diag__main:hover{background:rgba(255,255,255,.96);transform:translateY(-1px);box-shadow:0 8px 20px rgba(15,23,42,.10)}
.diag__title{font-weight:800;color:#020617}
.diag__meta{color:#64748b;font-size:12px;margin-top:6px}
.diag__chev{margin-left:auto}
.diag__progressWrap{width:100%;display:grid;grid-template-columns:1fr auto;gap:10px;align-items:center}
.diag__stack{display:grid;gap:3px;font-size:12px;color:#334155}
.diag__stack strong{color:#0f172a}
.diag__badgePriority{font-weight:800;padding:6px 12px}
.diag__badgePriority--med{background:rgba(250,204,21,.2);color:#854d0e;border:1px solid rgba(202,138,4,.35)}

@media (max-width: 1100px){
  .diag__top{grid-template-columns:1fr;grid-template-areas:'summary' 'progress' 'time'}
  .diag__top .diag-charts{grid-area:progress;grid-column:1}
  .diag__top .diag-charts .diag-charts__time{grid-area:time}
}

@media (max-width: 760px){
  .diag__listHead{display:none}
  .diag__row{border:1px solid rgba(15,23,42,.10);border-radius:16px;margin:0 10px 12px;background:#fff;overflow:hidden}
  .diag__main{display:block;min-width:0;padding:14px}
  .diag__cell{display:flex;justify-content:space-between;align-items:flex-start;padding:8px 0;border-bottom:1px dashed rgba(148,163,184,.35)}
  .diag__cell:last-child{border-bottom:0}
  .diag__cell::before{content:attr(data-label);font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:#64748b;font-weight:700;margin-right:12px;min-width:92px}
  .diag__cell--discipline{display:block}
  .diag__cell--discipline::before{display:none}
  .diag__titleLine{display:flex;align-items:center;gap:8px}
  .diag__meta{display:flex;flex-wrap:wrap;gap:6px 8px}
  .diag__details{padding:0 12px 12px}
}

.diag__top{grid-template-areas:"summary progress" "time time";}
.diag__summary{grid-area:summary;}
.diag__topProgress{grid-area:progress;}
.diag__topTime{grid-area:time;}
.diag__topProgress,.diag__topTime{padding:24px;border-radius:18px;box-shadow:0 10px 26px rgba(15,23,42,.08);border:1px solid rgba(15,23,42,.08);}
@media (max-width: 1100px){.diag__top{grid-template-areas:"summary" "progress" "time";grid-template-columns:1fr;}}

.diag__topTime{
  max-width:100%;
  overflow-x:hidden;
}

.chart-legend{
  display:grid;
  gap:8px;
  max-width:100%;
}

.chart-legend .legend-row{
  display:grid;
  grid-template-columns:18px minmax(0,1fr) auto;
  align-items:start;
  gap:10px;
  min-width:0;
}

.chart-legend .legend-name{
  min-width:0;
  overflow-wrap:anywhere;
  word-break:break-word;
}

.chart-legend .legend-val{
  white-space:nowrap;
  justify-self:end;
}

.chart-legend .legend-dot{
  width:10px;
  height:10px;
  border-radius:999px;
  margin-top:3px;
}

/* =========================================================
   Mobile overflow guardrails (P1)
   ========================================================= */
html, body{
  max-width:100%;
}

body{
  overflow-x:hidden;
}

.layout,
.container,
.main,
.card,
.topbar-inner,
.page-head,
.row{
  min-width:0;
}

img,
svg,
canvas,
video,
iframe{
  max-width:100%;
}

@media (max-width: 980px){
  .topbar-inner{
    flex-wrap:wrap;
    align-items:flex-start;
  }

  .brand,
  .topnav,
  .user-menu,
  .user-menu-trigger,
  .user-menu-popover{
    min-width:0;
    max-width:100%;
  }

  .brand{
    flex:1 1 auto;
  }

  .brand-text,
  .nav-user{
    min-width:0;
    max-width:100%;
  }

  .user-menu-popover{
    right:0;
    left:auto;
  }

  .user-menu-mobile-nav{
    position:relative;
  }

  .user-menu-mobile-nav > .user-menu-popover{
    position:fixed;
    top:calc(var(--menu-top, 64px) + env(safe-area-inset-top));
    left:auto;
    right:max(12px, env(safe-area-inset-right));
    width:min(320px, calc(100vw - 24px - env(safe-area-inset-left) - env(safe-area-inset-right)));
    min-width:min(220px, calc(100vw - 24px));
    max-height:70vh;
    overflow:auto;
    z-index:46;
  }

  .card{
    padding:16px;
  }

  .btn,
  .btn-sm,
  .input,
  select.input,
  textarea.input{
    font-size:16px;
  }

  .diag__search,
  .diag__sort,
  .seg-tabs,
  .history-table-controls > *,
  .sessions-filters > *{
    min-width:0;
  }

  .seg-tabs{
    flex-wrap:wrap;
  }

  .history-table-wrap,
  .diag__list{
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
  }

  .history-table-controls,
  .sessions-filters,
  .sess-toggle,
  .diag__ignoredItem{
    grid-template-columns:1fr;
  }

  .sess-toggle,
  .diag__ignoredItem{
    display:grid;
    align-items:flex-start;
    gap:10px;
  }

  .sess-right,
  .sess-badges,
  .nums{
    justify-content:flex-start;
    justify-items:flex-start;
  }

  .topic-cell,
  .topic-cell .topic-text,
  .diag__topicLabel,
  .diag__ignoredLabel{
    overflow-wrap:anywhere;
    word-break:break-word;
    white-space:normal;
  }

  .topic-full-modal-root.is-open,
  .modal-backdrop,
  .modal{
    padding: max(12px, env(safe-area-inset-top)) max(12px, env(safe-area-inset-right)) max(12px, env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-left));
  }

  .sp-modal,
  .topic-full-modal,
  .modal__dialog{
    width:min(100%, 96vw);
    max-height:calc(100dvh - 24px);
  }
}

/* -------------------- /history · Cronogramas (somente leitura) -------------------- */
.history-weeks-list{ display:flex; flex-direction:column; gap:10px; }
.history-weeks-list .week-card{ border:1px solid rgba(0,0,0,.08); border-radius:14px; padding:10px 12px; background:#fff; box-shadow:0 2px 10px rgba(0,0,0,.04); }
.history-weeks-list .week-card.disabled{ opacity:.55; background:#f7f7f9; cursor:not-allowed; }
.history-weeks-list .week-summary{ list-style:none; }
.history-weeks-list details.week-card > summary.week-summary{ cursor:pointer; }
.history-weeks-list details.week-card[open] > summary.week-summary{ margin-bottom:6px; }
.history-weeks-list details.week-card > summary::-webkit-details-marker{ display:none; }

@media (max-width: 760px){
  .diag__listHead,
  .diag__main{
    min-width:0;
  }

  .history-summary-table,
  .history-topics-table,
  .revprio-table{
    min-width:640px;
  }
}


/* --- Responsive polish: /history prioridade de revisão por tópico (mobile cards) --- */
@media (max-width: 560px){
  .revprio-table{table-layout:auto;}
  .revprio-table thead{display:none;}
  .revprio-table tbody{display:block;}
  .revprio-table tr{display:block;background:#fff;border:1px solid rgba(148,163,184,.25);border-radius:16px;padding:12px;margin:10px 0;box-shadow:0 1px 3px rgba(2,6,23,.06)}
  .revprio-table td{display:block;border:0 !important;padding:0 !important;text-align:left !important;white-space:normal !important}
  .revprio-table td::before{display:block;font-size:12px;font-weight:800;color:rgba(71,85,105,1);margin:0 0 4px 0}
  .revprio-table td:nth-child(1)::before{content:"Disciplina"}
  .revprio-table td:nth-child(2)::before{content:"Tópico"}
  .revprio-table td:nth-child(3)::before{content:"Sessões"}
  .revprio-table td:nth-child(4)::before{content:"Tempo"}
  .revprio-table td:nth-child(5)::before{content:"Acertos"}
  .revprio-table td:nth-child(6)::before{content:"Questões"}
  .revprio-table td:nth-child(7)::before{content:"%"}
  .revprio-table td:nth-child(8)::before{content:"Última vez"}
  .revprio-table td:nth-child(9)::before{content:"Prioridade"}

  /* spacing + separators for numeric fields */
  .revprio-table td.num{margin-top:8px;padding-top:8px !important;border-top:1px solid rgba(148,163,184,.18) !important}
  .revprio-table td:nth-child(1),
  .revprio-table td:nth-child(2){margin-top:0;padding-top:0 !important;border-top:0 !important}

  .revprio-table .topic-cell{max-width:none}
  .revprio-table .topic-cell .topic-text{-webkit-line-clamp:3;word-break:break-word}
  .revprio-table .topic-expand{margin-top:6px}

  /* keep 'há 0d' together */
  .revprio-table td:nth-child(8){white-space:nowrap !important}

  /* priority pill alignment */
  .revprio-table td:nth-child(9) .pill{display:inline-flex;align-items:center}
}

/* --- Admin only: wider content container (does NOT affect non-admin users) --- */
body.app-shell[data-admin="1"] .container{
  max-width: 1500px;
}

@media (min-width: 1600px){
  body.app-shell[data-admin="1"] .container{
    max-width: 1650px;
  }
}