/* Teaser e relatório: layout largo, herói escuro e abas. Escopo em .is-wide para não afetar as outras telas do fluxo. */
.analysis-page{--tone:#3c6b75;background:radial-gradient(1100px 420px at 85% -80px,#fbefd0 0,transparent 65%),#f5f2ea}
.analysis-page .analysis-top{width:min(calc(100% - 32px),1260px);min-height:76px}
.analysis-page .analysis-top .brand{gap:11px;font-size:21px;font-weight:760;letter-spacing:-.03em}
.analysis-page .analysis-body{display:block}
.is-wide .analysis-body{width:min(calc(100% - 32px),1260px);padding-top:24px}

/* Telas simples (envio, senha, leitura, erro, pagamento): mesmo painel do relatório, no mesmo shell da home */
.analysis-page:not(.is-wide) .analysis-body{position:relative;overflow:hidden;width:min(calc(100% - 32px),760px);margin-top:32px;margin-bottom:64px;padding:32px 22px 28px;border-radius:24px;background:#fff;box-shadow:0 24px 60px rgba(14,42,49,.12),0 0 0 1px #e3ddcf}
.analysis-page:not(.is-wide) .analysis-body::before{content:"";position:absolute;inset:0 0 auto;height:6px;background:linear-gradient(90deg,#3c6b75,#2f6b78 34%,#3f8f64 56%,#f2b83b 78%,#f2b83b)}
.analysis-page:not(.is-wide) .analysis-body h1{font-size:clamp(34px,7vw,56px)}
.analysis-page:not(.is-wide) .progress-bar{height:10px;border-radius:999px;background:#ece7da}
.analysis-page:not(.is-wide) .progress-bar i{border-radius:999px;background:linear-gradient(90deg,#3c6b75,#2f6b78,#3f8f64)}
.analysis-page:not(.is-wide) .upload-input{border:2px dashed #a9c0c3;border-radius:18px;background:#f1f4f3}
.upload-input::file-selector-button{margin-right:14px;padding:10px 16px;border:0;border-radius:999px;background:var(--ink);color:#fff;font:inherit;font-size:14px;font-weight:600;cursor:pointer}
.analysis-page:not(.is-wide) .analysis-alert{border-radius:14px}
.analysis-page:not(.is-wide) .confirm-select{border-radius:14px}
@media(min-width:720px){.analysis-page .analysis-top{width:min(calc(100% - 64px),1260px)}.is-wide .analysis-body{width:min(calc(100% - 64px),1260px)}.analysis-page:not(.is-wide) .analysis-body{padding:44px 48px 40px}}

/* Herói */
.is-wide .report-hero{position:relative;overflow:hidden;padding:28px 22px 24px;border-radius:24px;color:#fff;background:linear-gradient(135deg,#0b1e23 0,#0b1e23 62%,#0b1e23 100%);box-shadow:0 28px 60px rgba(14,42,49,.22)}
.rh-glow{position:absolute;inset:-120px -80px auto auto;width:420px;height:420px;border-radius:50%;background:radial-gradient(circle,rgba(242,184,59,.38),transparent 62%);pointer-events:none}
.rh-card{position:absolute;right:28px;top:26px;width:190px;fill:none;stroke:rgba(255,255,255,.22);stroke-width:2;transform:rotate(8deg);display:none}
.rh-top{position:relative;display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px}
.rh-logo{width:44px;height:44px;display:grid;place-items:center;border-radius:12px;background:#fff}
.rh-logo img{width:30px;height:auto;max-height:24px}
.rh-issuer{margin:0;font-size:17px;font-weight:650;letter-spacing:-.02em}
.rh-due{margin:0;padding:5px 11px;border-radius:999px;background:rgba(255,255,255,.14);font-size:13px}
.is-wide .report-hero h1{position:relative;margin:26px 0 0;display:grid;gap:4px;font-size:inherit;line-height:1}
.rh-label{color:#c9d6d3;font-family:var(--font-body);font-size:14px;font-weight:500;letter-spacing:0}
.rh-total{font-size:clamp(48px,13vw,92px);font-weight:700;letter-spacing:-.06em;line-height:.95;color:#fff}
.rh-meta{position:relative;margin:14px 0 0;display:flex;flex-wrap:wrap;gap:8px 14px;align-items:center;color:#c9d6d3;font-size:15px}
.is-wide .rh-check.analysis-check{margin:0;padding:5px 11px;border-radius:999px;background:rgba(242,184,59,.16);color:#f8d98a;font-size:13px;font-weight:600}
.split-bar{position:relative;margin-top:28px;height:16px;display:flex;gap:3px;border-radius:999px;overflow:hidden}
.split-bar i{display:block;min-width:6px;border-radius:999px}
.split-legend{position:relative;margin:14px 0 0;padding:0;list-style:none;display:flex;flex-wrap:wrap;gap:8px 18px;font-size:13px;color:#c9d6d3}
.split-legend li{display:inline-flex;align-items:center;gap:7px}
.split-legend i{width:10px;height:10px;border-radius:50%}
.split-legend b{color:#fff;font-weight:650}
.is-wide>.analysis-body>.analysis-check,.is-wide .analysis-body>.analysis-alert{margin-top:16px}

/* Destaques coloridos */
.is-wide .highlight-list{margin-top:14px;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:12px}
.is-wide .highlight-list li{position:relative;overflow:hidden;padding:18px 18px 16px;border:0;border-radius:18px;background:color-mix(in srgb,var(--tone) 11%,#fff);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--tone) 22%,transparent)}
.is-wide .highlight-list li::before{content:"";position:absolute;inset:0 auto 0 0;width:5px;background:var(--tone)}
.is-wide .highlight-list strong{color:color-mix(in srgb,var(--tone) 70%,#000);font-size:26px;letter-spacing:-.04em}
.is-wide .highlight-list span{color:#3f4e4b}
.is-wide .teaser-title{margin-top:28px;font-size:20px;letter-spacing:-.03em}
.is-wide .report-main>.teaser-title:first-child{margin-top:0}

/* Teaser: duas colunas com oferta fixa */
.report-grid{margin-top:28px;display:grid;gap:28px}
.is-wide .teaser-lock{margin-top:0;padding:22px 20px;border:0;border-radius:22px;color:#fff;background:linear-gradient(160deg,#0b1e23,#0b1e23);overflow:hidden;box-shadow:0 24px 50px rgba(14,42,49,.2)}
.is-wide .teaser-lock h2{color:#fff;font-size:28px;line-height:1.05}
.is-wide .teaser-includes li{color:#e6eeec}
.is-wide .teaser-lock .analysis-note{color:#c9d6d3}
.lock-badge{margin:0 0 10px;display:inline-block;padding:5px 10px;border-radius:999px;background:var(--accent);color:var(--ink);font-size:13px;font-weight:700;letter-spacing:.04em;text-transform:uppercase}
.is-wide .teaser-blur{display:grid;gap:12px;margin-bottom:18px;filter:blur(2.5px);opacity:.75}
.blur-tabs{height:auto!important;background:none!important;display:flex;gap:6px}
.blur-tabs i{height:22px;flex:1;border-radius:999px;background:rgba(255,255,255,.2)}
.blur-tabs i:first-child{background:rgba(242,184,59,.8)}
.blur-bars{height:84px!important;background:none!important;display:flex;align-items:flex-end;gap:8px}
.blur-bars i{flex:1;border-radius:8px 8px 3px 3px;background:var(--c)}

/* Abas */
.report-tabs{margin-top:24px}
.tab-bar{position:sticky;top:8px;z-index:5;margin-bottom:22px;padding:6px;display:flex;gap:4px;overflow-x:auto;scrollbar-width:none;border-radius:999px;background:rgba(255,255,255,.86);backdrop-filter:blur(10px);box-shadow:0 8px 24px rgba(14,42,49,.1),inset 0 0 0 1px #e3ddcf}
.tab-bar::-webkit-scrollbar{display:none}
.tab-bar[hidden]{display:none}
.tab-bar button{flex:0 0 auto;min-height:44px;padding:0 18px;border:0;border-radius:999px;background:none;color:#3f4e4b;font:inherit;font-size:14px;font-weight:600;cursor:pointer;white-space:nowrap;transition:background .16s,color .16s}
.tab-bar button:hover{background:#f0ebdf}
.tab-bar button[aria-selected=true]{background:var(--ink);color:#fff}
.tab-count{margin-left:6px;padding:2px 7px;border-radius:999px;background:#e3ddcf;color:var(--ink);font-size:13px}
.tab-count.is-alert{background:#ffd8a8;color:#6b3d00}
[aria-selected=true] .tab-count{background:rgba(255,255,255,.2);color:#fff}
.tab-panel{padding:22px 18px;border-radius:22px;background:#fff;box-shadow:0 1px 0 #fff inset,0 0 0 1px #e3ddcf}
.tab-panel[hidden]{display:none}
.report-tabs:not(.is-tabbed) .tab-panel{margin-top:22px}
.tab-panel h2{margin:8px 0 0;font-family:var(--font-display);font-size:clamp(24px,5vw,30px);font-weight:700;letter-spacing:-.04em;line-height:1.05}
.tab-panel h3{margin:28px 0 0;font-size:16px}
.tab-panel h3.first{margin-top:0}
.report-columns{display:grid;gap:32px}
.tab-panel .report-section{margin:0;padding:0;border:0}
.tab-panel .transaction-list{margin-top:14px}
.dot{width:9px;height:9px;margin-right:8px;display:inline-block;border-radius:50%;background:#b9b2a2}
.is-wide .read-list li{border:0;border-radius:16px;background:#fbefd0;color:#0e2a31}
.is-wide .read-list small{color:#4a5a57}

/* Categorias coloridas */
.is-wide .cat-row{padding:14px 0}
.is-wide .cat-row .dot{background:var(--tone)}
.is-wide .cat-bar{height:10px;border-radius:999px;background:color-mix(in srgb,var(--tone) 14%,#ece7da)}
.is-wide .cat-bar i{border-radius:999px;background:var(--tone)}

/* Gráfico de parcelas */
.month-chart{margin:20px 0 0;padding:0;list-style:none;height:240px;display:flex;align-items:stretch;gap:10px}
.month-chart li{flex:1;min-width:0;display:grid;grid-template-rows:auto 1fr auto;gap:8px;text-align:center}
.month-value{font-size:13px;font-weight:700;color:#1f5560;white-space:nowrap}
.month-col{display:flex;align-items:flex-end;border-radius:12px;background:#e6eeee}
.month-col i{display:block;width:100%;border-radius:12px;background:linear-gradient(180deg,#5a8c95,#2f6b78)}
.month-name{color:var(--ash);font-size:13px;font-weight:600}

.is-wide .all-transactions{margin-top:0;padding-top:22px;border-top:0}

@media(min-width:720px){
  .is-wide .report-hero{padding:40px 44px 36px}
  .rh-card{display:block}
  .tab-panel{padding:32px 36px}
  .report-columns{grid-template-columns:1.15fr 1fr;gap:48px}
  .tab-bar{display:inline-flex;max-width:100%}
}
@media(min-width:960px){
  .report-grid{grid-template-columns:1fr 400px;align-items:start;gap:40px}
  .report-side{position:sticky;top:24px}
  .is-wide .highlight-list{grid-template-columns:repeat(2,1fr)}
  .is-wide .teaser-lock{padding:28px 26px}
  #lancamentos .transaction-list{columns:2;column-gap:56px}
  #lancamentos .transaction-list li{break-inside:avoid}
}

/* Busca de cartão */
.combo{position:relative}
.combo-native{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.combo-input{padding-inline:16px;border-radius:14px;border-color:#d8d2c2}
.combo-input:focus{outline:3px solid var(--accent);outline-offset:2px}
.combo-list{position:absolute;inset:calc(100% + 6px) 0 auto;z-index:20;max-height:320px;margin:0;padding:6px;overflow:auto;list-style:none;border-radius:16px;background:#fff;box-shadow:0 18px 44px rgba(14,42,49,.2),0 0 0 1px #e3ddcf}
.combo-list[hidden]{display:none}
.combo-group{padding:10px 12px 4px;color:var(--ash);font-size:13px;font-weight:700;letter-spacing:.06em;text-transform:uppercase}
.combo-option{min-height:44px;padding:10px 12px;display:flex;align-items:center;border-radius:10px;font-size:15px;cursor:pointer}
.combo-option.is-active,.combo-option:hover{background:#fbefd0}
.combo-empty{padding:14px 12px;color:var(--ash);font-size:14px}

/* Retorno estimado do cartão */
.analysis-page .reward-list { list-style: none; margin: 8px 0 0; padding: 0; display: grid; gap: 8px; }
.analysis-page .reward-list li { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; padding: 12px 14px; border-radius: 12px; background: #f1ecdf; font-size: 15px; }
.analysis-page .reward-list small { display: block; color: #66726f; font-size: 13px; margin-top: 2px; }
.analysis-page .reward-list strong { white-space: nowrap; font-size: 17px; }
.analysis-page .reward-total { display: flex; flex-wrap: wrap; gap: 8px 20px; margin: 12px 0 4px; font-size: 15px; }
.analysis-page .reward-total b { font-size: 22px; }

/* Anuidade e comparação */
.analysis-page .fee-signal { margin: 16px 0 0; padding: 14px 16px; border-radius: 12px; font-size: 15px; border: 1px solid transparent; }
.analysis-page .fee-signal p { margin: 0; }
.analysis-page .fee-signal p + p { margin-top: 8px; }
.analysis-page .fee-signal.is-bad { background: #fff1ec; border-color: #ffc9b8; }
.analysis-page .fee-signal.is-good { background: #ecf8f1; border-color: #bfe6cf; }
.analysis-page .fee-signal .is-loss { color: #b42318; }
.analysis-page .fee-signal .is-gain { color: #0f5a33; }

/* Categoria editável nos lançamentos */
.analysis-page .tx-edit { grid-column: 2 / -1; display: flex; align-items: center; gap: 8px; margin: 0; min-width: 0; }
.analysis-page .tx-edit label { font-size: 13px; color: #66726f; }
.analysis-page .tx-select { flex: 1; min-width: 0; max-width: 100%; font: inherit; font-size: 14px; padding: 6px 8px; border: 1px solid #d8d2c2; border-radius: 8px; background: #fff; }
.analysis-page .tx-save { font: inherit; font-size: 13px; padding: 6px 10px; border-radius: 8px; border: 1px solid #d8d2c2; background: #fff; }
.analysis-page .all-transactions li:target { background: #fbefd0; box-shadow: 0 0 0 6px #fbefd0; border-radius: 6px; }
.analysis-page .tx-status { font-size: 13px; color: #66726f; min-width: 4.5em; }

/* Renda e gastos fora do cartão */
.analysis-page .profile-box { margin: 28px 0 0; padding: 20px; border-radius: 18px; background: #f1f4f3; box-shadow: inset 0 0 0 1px #dde5e4; }
.analysis-page .profile-box h2 { margin: 0 0 8px; font-size: 20px; }
.analysis-page .profile-form { display: grid; gap: 14px; margin-top: 14px; }
.analysis-page .profile-field { display: grid; gap: 6px; }
.analysis-page .profile-field label { font-weight: 600; font-size: 15px; }
.analysis-page .profile-field small { color: #66726f; font-size: 13px; }
.analysis-page .profile-field input { width: 100%; max-width: 100%; box-sizing: border-box; }
.analysis-page .profile-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.analysis-page .profile-skip { font: inherit; font-size: 14px; background: none; border: 0; padding: 8px 4px; color: #66726f; text-decoration: underline; cursor: pointer; }
.analysis-page .profile-reading { margin: 8px 0; padding: 12px 14px; border-radius: 12px; font-size: 17px; background: #ecf8f1; }
.analysis-page .profile-reading.is-warn, .analysis-page .profile-details .is-warn { background: #fff7dc; }
.analysis-page .profile-reading.is-risk, .analysis-page .profile-details .is-risk { background: #fff1ec; }
.analysis-page .profile-details { list-style: none; margin: 8px 0; padding: 0; display: grid; gap: 8px; }
.analysis-page .profile-details li { padding: 12px 14px; border-radius: 12px; background: #ecf8f1; }
.analysis-page .profile-details small { display: block; margin-top: 4px; color: #3f4e4b; font-size: 14px; }
.analysis-page .profile-edit { margin-top: 10px; font-size: 14px; }
.analysis-page .profile-edit summary { cursor: pointer; color: #66726f; }
.analysis-page .profile-unlock { margin-top: 14px; padding: 16px; border-radius: 14px; background: #0b1e23; color: #fff; }
.analysis-page .profile-unlock p { margin: 0 0 10px; font-size: 16px; }
.analysis-page .profile-unlock ul { list-style: none; margin: 0 0 14px; padding: 0; display: grid; gap: 8px; }
.analysis-page .profile-unlock li { display: flex; gap: 10px; align-items: flex-start; font-size: 15px; }
.analysis-page .profile-unlock svg { flex: none; width: 18px; height: 18px; margin-top: 2px; fill: none; stroke: #f2b83b; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.analysis-page .profile-unlock small { display: block; margin-top: 8px; font-size: 13px; color: #9fb0ad; }
.analysis-page .profile-unlock .button { display: flex; align-items: center; justify-content: center; text-align: center; }


/* ===== Identidade Olha Meu Dinheiro: Tinta e Sol (relatório e fluxo): um acento, bordas finas, sem sombra nem gradiente ===== */
.analysis-page { background: var(--bone); }
.analysis-page .analysis-top .brand { font-size: inherit; letter-spacing: 0; }
.analysis-page:not(.is-wide) .analysis-body { border: 1px solid var(--line); border-radius: var(--radius-card); box-shadow: none; }
.analysis-page:not(.is-wide) .analysis-body::before { height: 4px; background: var(--accent); }
.progress-bar i, .analysis-page:not(.is-wide) .progress-bar i { background: var(--ink); }
.analysis-page:not(.is-wide) .progress-bar { background: #ece7da; }
.analysis-page:not(.is-wide) .upload-input { border: 1.5px dashed #b9b2a2; border-radius: var(--radius-input); background: #fffdf8; }
.analysis-page:not(.is-wide) .analysis-alert, .analysis-page:not(.is-wide) .confirm-select { border-radius: var(--radius-input); }

.is-wide .report-hero { border-radius: var(--radius-card); background: var(--dark); box-shadow: none; }
.rh-glow { display: none; }
.rh-total { font-size: clamp(44px, 12vw, 84px); line-height: 1; font-variant-numeric: lining-nums tabular-nums; }
.is-wide .teaser-lock { border-radius: var(--radius-card); background: var(--dark); box-shadow: none; }
.is-wide .teaser-lock h2 { font-size: 26px; }
.tab-bar { background: rgba(255,255,255,.92); box-shadow: inset 0 0 0 1px var(--line); }
.tab-bar button[aria-selected=true] { background: var(--ink); }
.tab-count.is-alert { background: #fbefd0; color: #5b4a1a; }
.tab-panel { border-radius: var(--radius-card); box-shadow: inset 0 0 0 1px var(--line); }
.is-wide .highlight-list li { border-radius: var(--radius-wash); }
.is-wide .read-list li { border-radius: var(--radius-wash); color: var(--ink); }
.is-wide .read-list small { color: #4a5a57; }
.month-col { background: #e6eeee; }
.month-col i { background: #2f6b78; }
.combo-list { box-shadow: 0 0 0 1px var(--line); }
.analysis-page .profile-box { border-radius: var(--radius-wash); }
.analysis-page .profile-unlock { background: var(--dark); border-radius: var(--radius-wash); }
.analysis-page .all-transactions li:target { background: #fbefd0; box-shadow: 0 0 0 6px #fbefd0; }