/* O atributo `hidden` precisa sempre esconder o elemento, mesmo quando a
   classe do componente (`.btn`, `.iconbtn`, etc.) define seu próprio
   `display`. Sem isso, qualquer classe com display próprio "ganha" do
   `[hidden]` nativo do navegador por ter a mesma especificidade CSS — foi
   assim que o botão de teste local ficou visível em produção mesmo com
   `hidden` corretamente definido via JS. */
[hidden]{display:none !important;}

:root[data-theme="dark"]{
    --bg-a:#14225c; --bg-b:#0A1440; --bg-base:#0A1440;
    --surface:rgba(255,255,255,0.055); --surface-solid:#161a2c; --surface-alt:rgba(255,255,255,0.035);
    --ink:#EEF0FA; --ink-secondary:#9AA3C9; --ink-muted:#9AA3C9; --ink-faint:#6B76A0;
    --border:rgba(255,255,255,0.09);
    --positive:#34D399; --positive-bg:rgba(52,211,153,0.13);
    --negative:#FB8161; --negative-bg:rgba(251,129,97,0.13);
    --accent1:#00C6B3; --accent2:#0066FF;
    --shadow:0 8px 24px rgba(0,0,0,.4);
    --tile-shadow: inset 0 1px 0 rgba(255,255,255,.06), 0 4px 12px rgba(0,0,0,.35);
    --scroll-thumb: rgba(255,255,255,.14);
  }
  :root[data-theme="light"]{
    --bg-a:#E2E6EF; --bg-b:#E6EEFF; --bg-base:#F7F9FC;
    --surface:#FFFFFF; --surface-solid:#FFFFFF; --surface-alt:#F1F3FA;
    --ink:#0A1440; --ink-secondary:#5D6680; --ink-muted:#59647B; --ink-faint:#667085;
    --border:#E2E6EF;
    --positive:#0E9F6E; --positive-bg:rgba(14,159,110,0.10);
    --negative:#D9502F; --negative-bg:rgba(217,80,47,0.10);
    --accent1:#00C6B3; --accent2:#0066FF;
    --shadow:0 4px 16px rgba(30,20,80,.08);
    --tile-shadow: 0 1px 3px rgba(30,20,80,.06);
    --scroll-thumb: rgba(30,20,80,.14);
  }
  *{box-sizing:border-box;}
  body{
    margin:0; background:var(--bg-base); font-family:'Inter',sans-serif; color:var(--ink);
    display:flex; flex-direction:column; align-items:center; gap:16px; padding:24px 12px 60px;
    min-height:600px; transition:background .2s;
  }
  h1,h2,h3,.display{font-family:'Inter',sans-serif;}
  .tabular{font-variant-numeric:tabular-nums;}

  .phone{
    width:390px; max-width:100%; height:770px; border-radius:36px; border:8px solid var(--surface-solid);
    box-shadow:var(--shadow); overflow:hidden; position:relative; display:flex; flex-direction:column;
    background:
      radial-gradient(circle at 12% 8%, var(--bg-a) 0%, transparent 42%),
      radial-gradient(circle at 92% 85%, var(--bg-b) 0%, transparent 50%),
      var(--bg-base);
  }
  .screen{ display:none; flex-direction:column; flex:1; min-height:0; }
  .screen.active{ display:flex; }
  .content{ flex:1; overflow-y:auto; padding:0 18px 16px; scrollbar-width:thin; scrollbar-color:var(--scroll-thumb) transparent; }
  .content::-webkit-scrollbar{ width:4px; }
  .content::-webkit-scrollbar-track{ background:transparent; }
  .content::-webkit-scrollbar-thumb{ background:var(--scroll-thumb); border-radius:4px; }
  .topbar{ display:flex; align-items:center; gap:10px; padding:20px 18px 14px; flex-shrink:0; }
  .topbar .title{ font-size:17px; font-weight:700; font-family:'Inter',sans-serif; }
  .topbar .sub{ font-size:12px; color:var(--ink-secondary); margin-top:2px; }
  .topbar .spacer{ flex:1; }

  .iconbtn{
    width:36px; height:36px; border-radius:11px; border:1px solid var(--border); background:var(--surface);
    display:flex; align-items:center; justify-content:center; cursor:pointer; color:var(--ink); flex-shrink:0;
  }
  .avatar-account{
    width:38px; height:38px; border-radius:50%; flex-shrink:0; cursor:pointer;
    background:linear-gradient(135deg,var(--accent1),var(--accent2));
    display:flex; align-items:center; justify-content:center; color:#fff; font-weight:700; font-size:13px;
    box-shadow:0 0 0 2px var(--bg-base), 0 0 14px rgba(139,124,246,.5);
  }

  /* icon system */
  .icon{ width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; display:block; }
  .icon.accent{ stroke:url(#gradAccent); filter:drop-shadow(0 0 5px rgba(139,124,246,.55)); }
  .icon-sm{ width:16px; height:16px; }
  .icon-lg{ width:26px; height:26px; }
/* Gira o ícone inteiro. Girar o <use> por dentro (rotate(180 12 12)) usa o
   sistema de coordenadas do <svg>, que aqui tem 16px, não 24 — o desenho saía
   do quadro e sobrava só um risquinho no canto. */
.icon-chevron-right{ transform:rotate(180deg); }

  .tile{
    border-radius:14px; background:var(--surface); border:1px solid var(--border);
    box-shadow:var(--tile-shadow); display:flex; align-items:center; justify-content:center; flex-shrink:0; color:var(--ink-secondary);
  }
  .tile.selected{ color:var(--ink); box-shadow:var(--tile-shadow), 0 0 0 1.5px var(--accent2), 0 0 16px rgba(76,141,255,.3); }

  .hero{
    background:var(--surface); border:1px solid var(--border); border-radius:20px; padding:20px; margin:16px 0 20px;
    backdrop-filter:blur(6px);
  }
  .hero .label{ font-size:12px; color:var(--ink-secondary); margin-bottom:6px; }
  .hero .amount{ font-size:34px; font-weight:800; line-height:1.1; font-family:'Inter',sans-serif;}
  .hero .amount.positive{ color:var(--positive); text-shadow:0 0 22px var(--positive-bg); }
  .hero .amount.negative{ color:var(--negative); text-shadow:0 0 22px var(--negative-bg); }
  .hero .note{ font-size:13px; color:var(--ink-secondary); margin-top:6px; }

  .section-title{ font-size:12.5px; font-weight:700; color:var(--ink-secondary); margin:18px 0 10px; text-transform:uppercase; letter-spacing:.04em;}

  .event-card{
    background:var(--surface); border:1px solid var(--border); border-radius:16px; padding:14px;
    display:flex; align-items:center; gap:12px; margin-bottom:10px; cursor:pointer;
  }
  .event-tile{ width:46px; height:46px; }
  .event-info{ flex:1; min-width:0; }
  .event-info .name{ font-weight:700; font-size:14.5px; }
  .event-info .meta{ font-size:12px; color:var(--ink-secondary); margin-top:2px; }
  .avatars{ display:flex; margin-top:6px; }
  .avatar{
    width:22px; height:22px; border-radius:50%; font-size:9.5px; font-weight:700; color:#fff;
    display:flex; align-items:center; justify-content:center; border:2px solid var(--surface-solid); margin-left:-6px;
  }
  .avatar:first-child{ margin-left:0; }
  .balance-chip{ font-size:12px; font-weight:700; padding:5px 10px; border-radius:20px; white-space:nowrap; }
  .balance-chip.positive{ background:var(--positive-bg); color:var(--positive); }
  .balance-chip.negative{ background:var(--negative-bg); color:var(--negative); }
  .balance-chip.zero{ background:var(--surface-alt); color:var(--ink-secondary); }

  .action-bar{ padding:8px 18px 18px; display:flex; gap:10px; flex-shrink:0; }
  .btn{
    flex:1; border:none; border-radius:14px; padding:14px; font-family:'Inter',sans-serif; font-weight:700;
    font-size:14px; cursor:pointer; display:flex; align-items:center; justify-content:center; gap:6px;
  }
  .btn-primary{ background:linear-gradient(135deg,var(--accent1),var(--accent2)); color:#fff; box-shadow:0 6px 20px rgba(76,109,255,.32);}
  .btn-secondary{ background:var(--surface); color:var(--ink); border:1px solid var(--border); }

  .field-label{ font-size:12.5px; font-weight:600; color:var(--ink-secondary); margin:16px 0 8px; }
  .input{
    width:100%; border:1px solid var(--border); background:var(--surface); border-radius:12px;
    padding:12px 14px; font-family:'Inter',sans-serif; font-size:15px; color:var(--ink);
  }
  .input:focus{ outline:2px solid var(--accent2); outline-offset:1px; }
  .upload-box{
    border:1.5px dashed var(--border); border-radius:16px; height:110px; display:flex; flex-direction:column;
    align-items:center; justify-content:center; gap:8px; color:var(--ink-secondary); font-size:12.5px; cursor:pointer; margin-top:16px;
  }
  .chip-row{ display:flex; gap:8px; flex-wrap:wrap; }
  .chip{
    display:flex; align-items:center; gap:7px; padding:9px 13px; border-radius:12px; border:1px solid var(--border);
    background:var(--surface); font-size:13px; font-weight:600; cursor:pointer; color:var(--ink-secondary);
  }
  .chip.selected{ background:linear-gradient(135deg,var(--accent1),var(--accent2)); color:#fff; border-color:transparent; }
  .chip.selected .icon{ stroke:#fff; }

  .segmented{ display:flex; background:var(--surface-alt); border-radius:12px; padding:3px; margin:0 18px 16px; flex-shrink:0; }
  .segmented .seg{
    flex:1; text-align:center; padding:8px 4px; font-size:12.5px; font-weight:700; border-radius:9px; cursor:pointer;
    color:var(--ink-secondary);
  }
  .segmented .seg.active{ background:var(--surface-solid); color:var(--ink); box-shadow:var(--shadow); }

  .debt-row{ display:flex; align-items:center; gap:6px; font-size:13px; padding:8px 0; color:var(--ink); }
  .debt-row b{ font-weight:700; }
  .debt-row .arrow{ color:var(--ink-faint); }

  .debt-row-card{
    display:flex; align-items:center; gap:12px; padding:12px; margin-bottom:8px; border-radius:14px;
    background:var(--surface); border:1px solid var(--border); cursor:pointer; font-size:13.5px; color:var(--ink);
  }
  .debt-row-card .avatar{ width:32px; height:32px; font-size:12px; flex-shrink:0; }
  .debt-row-text{ flex:1; }
  .debt-row-text b{ font-weight:700; }
  .debt-contributions{ margin-top:4px; font-size:11.5px; font-weight:500; color:var(--ink-secondary); }
  .dv-contributions-title{ margin-top:10px; padding-top:10px; border-top:1px solid var(--border); font-size:11.5px; font-weight:700; color:var(--ink-faint); text-transform:uppercase; letter-spacing:.02em; }
  .debt-amount{ color:inherit; }
  .debt-row-card.settled{ opacity:.55; }
  .debt-row-card.settled .debt-amount{ text-decoration:line-through; }
  .debt-row-card.settled::after{ content:'Quitado ✓'; margin-left:auto; font-size:11px; font-weight:700; color:var(--positive); }
  .debt-row-card.settled svg{ display:none; }

  .expense-row{ display:grid; grid-template-columns:30px 40px minmax(220px,1fr) minmax(130px,.42fr) minmax(190px,.58fr); align-items:center; gap:12px; padding:12px 0; border-bottom:1px solid var(--border); cursor:pointer; }
  .expense-row:last-child{ border-bottom:none; }
  .expense-tile{ width:40px; height:40px; flex-shrink:0; }
  .expense-mid{ min-width:0; }
  .expense-mid .name{ font-weight:700; font-size:14px; }
  .expense-mid .meta{ font-size:12px; color:var(--ink-secondary); margin-top:1px; }
  .expense-total-column{ min-width:0; text-align:center; padding:0 12px; border-left:1px solid var(--border); border-right:1px solid var(--border); }
  .expense-total-column>span{ display:block; margin-bottom:3px; color:var(--ink-faint); font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.04em; }
  .expense-val{ font-weight:800; font-size:14px; text-align:center; white-space:nowrap; }
  .expense-status-column{ min-width:0; display:flex; align-items:center; justify-content:flex-end; gap:10px; }
  .expense-status{ font-size:11px; font-weight:700; line-height:1.2; padding:5px 8px; border-radius:999px; white-space:nowrap; text-align:right; }
  .expense-status.is-receivable{ color:var(--positive); background:color-mix(in srgb, var(--positive) 12%, transparent); }
  .expense-status.is-payable{ color:var(--negative); background:color-mix(in srgb, var(--negative) 11%, transparent); }
  .expense-status.is-neutral{ color:var(--ink-secondary); background:var(--surface-2); }
  .expense-chevron{ color:var(--ink-faint); flex-shrink:0; }
  .expense-date{ font-size:10.5px; color:var(--ink-faint); text-align:center; width:30px; flex-shrink:0; line-height:1.3; }

  .expense-settlement-card{ border:1px solid var(--border); border-radius:16px; padding:14px; background:var(--surface); }
  .expense-settlement-card.is-receivable{ border-color:color-mix(in srgb, var(--positive) 36%, var(--border)); box-shadow:0 8px 24px color-mix(in srgb, var(--positive) 10%, transparent); }
  .expense-settlement-card.is-payable{ border-color:color-mix(in srgb, var(--negative) 30%, var(--border)); box-shadow:0 8px 24px color-mix(in srgb, var(--negative) 8%, transparent); }
  .expense-settlement-head{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding-bottom:10px; border-bottom:1px solid var(--border); }
  .expense-settlement-head span{ font-size:13px; color:var(--ink-secondary); }
  .expense-settlement-head strong{ font-size:18px; }
  .expense-settlement-card.is-receivable .expense-settlement-head strong{ color:var(--positive); }
  .expense-settlement-card.is-payable .expense-settlement-head strong{ color:var(--negative); }
  .settlement-person-row{ display:grid; grid-template-columns:34px 1fr auto; align-items:center; gap:10px; padding:11px 0; border-bottom:1px solid var(--border); }
  .settlement-person-row:last-child{ border-bottom:none; padding-bottom:0; }
  .settlement-person-row .avatar{ width:34px; height:34px; font-size:12px; }
  .settlement-person-row div:nth-child(2){ display:flex; flex-direction:column; gap:2px; }
  .settlement-person-row small{ color:var(--ink-secondary); font-size:11px; }
  .settlement-person-row b{ font-size:13px; }

  .participant-row{ display:flex; align-items:center; gap:12px; padding:12px 0; border-bottom:1px solid var(--border); cursor:pointer; }
  .participant-row:last-child{ border-bottom:none; }
  .participant-row .avatar{ width:34px; height:34px; font-size:12px; margin-left:0; }
  .participant-name{ flex:1; font-weight:600; font-size:14px; }
  .participant-linked-hint{ display:block; font-weight:500; font-size:11.5px; color:var(--ink-faint); margin-top:2px; }

  .activity-item{ display:flex; gap:10px; padding:10px 0; font-size:13px; }
  .activity-dot{ width:6px; height:6px; border-radius:50%; background:var(--accent2); margin-top:6px; flex-shrink:0; box-shadow:0 0 6px var(--accent2);}
  .activity-time{ font-size:11px; color:var(--ink-faint); margin-top:2px; }

  .expandable{ border:1px solid var(--border); border-radius:12px; margin-top:8px; overflow:hidden; background:var(--surface); }
  .expandable-head{ display:flex; align-items:center; gap:10px; padding:12px 14px; cursor:pointer; font-size:13.5px; font-weight:600; }
  .expandable-head .hint{ margin-left:auto; font-weight:400; color:var(--ink-secondary); font-size:12.5px;}
  .expandable-body{ display:none; padding:0 14px 14px 44px; font-size:12.5px; color:var(--ink-secondary); }
  .expandable.open .expandable-body{ display:block; }

  .avatar-select-row{ display:flex; gap:10px; flex-wrap:wrap; }
  .avatar-select{ display:flex; flex-direction:column; align-items:center; gap:5px; cursor:pointer; opacity:.4; }
  .avatar-select.selected{ opacity:1; }
  .avatar-select .avatar{ margin-left:0; width:38px; height:38px; font-size:13px; border:2px solid transparent; }
  .avatar-select.selected .avatar{ box-shadow:0 0 0 2px var(--accent2), 0 0 10px rgba(76,141,255,.4); }
  .avatar-select .lbl{ font-size:10.5px; color:var(--ink-secondary); }

  /* bottom nav */
  .bottomnav{
    flex-shrink:0; display:flex; border-top:1px solid var(--border); background:var(--surface-solid);
    padding:10px 8px 14px;
  }
  .navitem{ flex:1; display:flex; flex-direction:column; align-items:center; gap:4px; cursor:pointer; color:var(--ink-faint); }
  .navitem .icon{ stroke:var(--ink-faint); }
  .navitem span{ font-size:10px; font-weight:600; }
  .navitem.active{ color:var(--ink); }
  .navitem.active .icon{ stroke:url(#gradAccent); filter:drop-shadow(0 0 5px rgba(139,124,246,.55)); }
  .nav-icon-wrap{ position:relative; }
  .nav-badge{
    position:absolute; top:-2px; right:-2px; width:8px; height:8px; border-radius:50%;
    background:var(--negative); box-shadow:0 0 0 2px var(--surface-solid); display:none;
  }
  .nav-badge.show{ display:block; }

  .alert-row{
    display:flex; align-items:flex-start; gap:12px; padding:13px; margin-bottom:8px; border-radius:14px;
    background:var(--surface); border:1px solid var(--border); cursor:pointer;
  }
  .alert-row.unread{ background:var(--surface-alt); border-color:rgba(76,141,255,.35); }
  .alert-icon{ width:36px; height:36px; flex-shrink:0; }
  .alert-mid{ flex:1; min-width:0; font-size:13px; line-height:1.4; }
  .alert-mid .meta{ font-size:11.5px; color:var(--ink-secondary); margin-top:3px; }
  .alert-dot{ width:8px; height:8px; border-radius:50%; background:var(--accent2); margin-top:5px; flex-shrink:0; box-shadow:0 0 6px var(--accent2); }

  /* login / auth */
  .brand{ text-align:center; margin:44px 0 36px; }
  .brand .logo{
    font-family:'Inter',sans-serif; font-weight:800; font-size:32px;
    background:linear-gradient(135deg,var(--accent1),var(--accent2)); -webkit-background-clip:text; background-clip:text; color:transparent;
  }
  .brand .tagline{ font-size:13px; color:var(--ink-secondary); margin-top:6px; }
  .auth-btn{
    width:100%; display:flex; align-items:center; gap:10px; padding:13px 14px; border-radius:14px;
    border:1px solid var(--border); background:var(--surface); color:var(--ink); font-weight:600; font-size:14px;
    cursor:pointer; margin-bottom:10px; font-family:'Inter',sans-serif;
  }
  .auth-btn:disabled{
    cursor:not-allowed; opacity:0.5;
  }
  .google-dot{
    width:22px; height:22px; border-radius:50%; background:#fff; display:flex; align-items:center;
    justify-content:center; flex-shrink:0; border:1px solid var(--border);
  }
  .auth-btn-google{
    font-weight:700;
  }
  .divider{ display:flex; align-items:center; gap:10px; margin:18px 0; color:var(--ink-faint); font-size:12px; }
  .divider::before, .divider::after{ content:''; flex:1; height:1px; background:var(--border); }
  .auth-footer{ text-align:center; font-size:13px; color:var(--ink-secondary); margin-top:20px; }
  .auth-footer b{ color:var(--ink); cursor:pointer; }

  /* switch */
  .switch{ width:44px; height:24px; border-radius:20px; background:var(--border); position:relative; cursor:pointer; flex-shrink:0; }
  .switch .knob{ width:18px; height:18px; border-radius:50%; background:#fff; position:absolute; top:3px; left:3px; transition:left .15s; }
  .switch.on{ background:linear-gradient(135deg,var(--accent1),var(--accent2)); }
  .switch.on .knob{ left:23px; }

  .settings-row{ display:flex; align-items:center; gap:12px; padding:14px 0; border-bottom:1px solid var(--border); }
  .settings-row:last-child{ border-bottom:none; }
  .settings-row .txt{ flex:1; font-size:14px; font-weight:600; }
  .settings-row .txt .hint{ font-weight:400; font-size:12px; color:var(--ink-secondary); margin-top:2px; }

/* ==========================================================
   JUNTÔ V1 — camada profissional e responsiva
   ========================================================== */
:root { color-scheme: dark; }
:root[data-theme="light"] { color-scheme: light; }
html { min-width: 320px; }
body {
  min-height: 100vh;
  padding: 0;
  gap: 0;
  overflow: hidden;
  background:
    radial-gradient(circle at 8% 5%, var(--bg-a) 0%, transparent 34%),
    radial-gradient(circle at 94% 92%, var(--bg-b) 0%, transparent 40%),
    var(--bg-base);
}
button, input, textarea, select { font: inherit; }
button, [onclick], .navitem, .chip, .event-card, .expense-row, .participant-row { -webkit-tap-highlight-color: transparent; }

.app-shell {
  width: 100%;
  max-width: none;
  height: 100vh;
  min-height: 0;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  overflow: hidden;
  position: relative;
  display: flex;
  flex-direction: column;
  background:
    radial-gradient(circle at 12% 8%, var(--bg-a) 0%, transparent 42%),
    radial-gradient(circle at 92% 85%, var(--bg-b) 0%, transparent 50%),
    var(--bg-base);
}
.version-badge {
  position: fixed;
  z-index: 100;
  top: 8px;
  left: 50%;
  transform: translateX(-50%);
  padding: 4px 9px;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: color-mix(in srgb, var(--surface-solid) 88%, transparent);
  color: var(--ink-secondary);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .05em;
  text-transform: uppercase;
  backdrop-filter: blur(12px);
  pointer-events: none;
}
.screen { padding-bottom: 72px; }
.topbar { padding-top: 32px; }
.content { overscroll-behavior: contain; }
.bottomnav {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 50;
  padding-bottom: max(10px, env(safe-area-inset-bottom));
  background: color-mix(in srgb, var(--surface-solid) 92%, transparent);
  backdrop-filter: blur(18px);
}
.event-card, .debt-row-card, .hero, .input, .btn, .chip, .tile {
  transition: transform .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease;
}
.event-card:hover, .debt-row-card:hover { transform: translateY(-1px); border-color: color-mix(in srgb, var(--accent2) 40%, var(--border)); }
.btn:active, .chip:active, .iconbtn:active { transform: scale(.98); }
:focus-visible { outline: 3px solid color-mix(in srgb, var(--accent2) 72%, white); outline-offset: 3px; }

@media (min-width: 768px) {
  body { align-items: stretch; }
  .app-shell {
    display: grid;
    grid-template-columns: 92px minmax(0, 1fr);
  }
  .screen {
    grid-column: 2;
    width: 100%;
    max-width: 980px;
    justify-self: center;
    padding-bottom: 0;
  }
  .screen.active { display: flex; }
  .bottomnav {
    grid-column: 1;
    grid-row: 1;
    position: static;
    height: 100vh;
    width: 92px;
    flex-direction: column;
    justify-content: center;
    gap: 12px;
    border-right: 1px solid var(--border);
    border-top: 0;
    padding: 20px 10px;
    background: color-mix(in srgb, var(--surface-solid) 84%, transparent);
  }
  .navitem {
    width: 72px;
    min-height: 64px;
    border-radius: 16px;
    padding: 9px 4px;
  }
  .navitem.active { background: var(--surface); }
  .topbar { padding: 34px 32px 16px; }
  .content { padding: 0 32px 32px; }
  .segmented { margin-left: 32px; margin-right: 32px; }
  .action-bar { padding: 10px 32px 28px; }
  .hero { padding: 26px; }
  .hero .amount { font-size: 42px; }
  .event-card { padding: 18px; }
  .event-tile { width: 54px; height: 54px; }
  .version-badge { left: auto; right: 16px; transform: none; }
}

@media (min-width: 1100px) {
  .app-shell { grid-template-columns: 220px minmax(0, 1fr); }
  .bottomnav { width: 220px; align-items: stretch; padding: 32px 18px; }
  .bottomnav::before {
    content: 'Juntô';
    position: absolute;
    top: 32px;
    left: 28px;
    font: 800 23px/1 'Inter', sans-serif;
    background: linear-gradient(135deg, var(--accent1), var(--accent2));
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
  }
  .navitem {
    width: 100%;
    min-height: 52px;
    flex-direction: row;
    justify-content: flex-start;
    gap: 14px;
    padding: 12px 14px;
    font-size: 13px;
  }
  .navitem span { font-size: 13px; }
  .screen { max-width: 1080px; }
  .content { padding-left: 46px; padding-right: 46px; }
  .topbar { padding-left: 46px; padding-right: 46px; }
  .segmented { margin-left: 46px; margin-right: 46px; }
  .action-bar { padding-left: 46px; padding-right: 46px; }
  #screen-home .content { display: grid; grid-template-columns: minmax(0, 1fr) minmax(320px, .72fr); gap: 0 28px; align-content: start; }
  #screen-home .hero { grid-column: 1 / -1; }
  #screen-home .section-title { grid-column: 1 / -1; }
}

@media (max-width: 420px) {
  .topbar { padding-left: 16px; padding-right: 16px; }
  .content { padding-left: 16px; padding-right: 16px; }
  .segmented { margin-left: 16px; margin-right: 16px; }
  .action-bar { padding-left: 16px; padding-right: 16px; }
  .hero .amount { font-size: clamp(28px, 9vw, 34px); }
  .event-card { gap: 9px; padding: 12px; }
  .balance-chip { padding: 5px 7px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}

/* =========================================================
   JUNTÔ DESKTOP FIRST — V1.2
   Cabeçalho institucional + navegação horizontal
   ========================================================= */
body{
  display:block;
  min-height:100vh;
  padding:0;
  background:var(--bg-base);
}
.site-header{
  position:sticky;
  top:0;
  z-index:120;
  background:color-mix(in srgb, var(--surface-solid) 96%, transparent);
  border-bottom:1px solid var(--border);
  backdrop-filter:blur(18px);
}
.header-inner,
.nav-inner{
  width:min(1320px, calc(100% - clamp(32px, 6vw, 112px)));
  margin-inline:auto;
}
.header-inner{
  min-height:84px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
}
.brand-button{
  border:0;
  padding:0;
  background:transparent;
  cursor:pointer;
  display:flex;
  align-items:center;
}
.site-logo{
  display:block;
  width:238px;
  max-height:58px;
  object-fit:contain;
  object-position:left center;
}
.header-actions,
.user-profile{
  display:flex;
  align-items:center;
}
.header-actions{ gap:12px; }
.header-theme{
  width:42px;
  height:42px;
  border:1px solid var(--border);
  border-radius:12px;
  background:var(--surface-alt);
  color:var(--ink);
  cursor:pointer;
  display:grid;
  place-items:center;
}
.user-profile{
  padding:0;
  border:0;
  border-radius:50%;
  background:transparent;
  color:var(--ink);
  cursor:pointer;
  font-family:inherit;
}
.site-nav{
  position:sticky;
  top:84px;
  z-index:110;
  background:color-mix(in srgb, var(--surface-solid) 94%, transparent);
  border-bottom:1px solid var(--border);
  box-shadow:0 8px 24px rgba(20,18,55,.04);
  backdrop-filter:blur(18px);
}
.nav-inner{
  display:flex;
  align-items:stretch;
  justify-content:center;
  gap:4px;
  overflow-x:auto;
  scrollbar-width:none;
}
.nav-inner::-webkit-scrollbar{ display:none; }
.site-nav-item{
  min-height:58px;
  padding:0 17px;
  border:0;
  border-bottom:3px solid transparent;
  background:transparent;
  color:var(--ink-secondary);
  font-family:inherit;
  font-size:13px;
  font-weight:700;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  white-space:nowrap;
  cursor:pointer;
  position:relative;
}
.site-nav-item:hover{ color:var(--ink); background:var(--surface-alt); }
.site-nav-item.active{
  color:var(--ink);
  border-bottom-color:var(--accent2);
  background:linear-gradient(180deg, transparent, color-mix(in srgb, var(--accent2) 9%, transparent));
}
.site-nav-item.active .icon{ stroke:url(#gradAccent); }
.menu-dot{ display:none; width:7px; height:7px; border-radius:50%; background:var(--negative); }
.menu-dot.show{display:block}
.app-shell{
  width:min(1320px, calc(100% - clamp(32px, 6vw, 112px)));
  min-height:calc(100vh - 143px);
  height:auto;
  margin:0 auto;
  border:0;
  border-radius:0;
  box-shadow:none;
  overflow:visible;
  display:block;
  background:transparent;
}
.screen{
  width:100%;
  max-width:none;
  min-height:calc(100vh - 143px);
  padding-bottom:36px;
}
.screen.active{ display:flex; }
.topbar{
  padding:34px 0 18px;
}
.topbar .title{ font-size:25px; }
.topbar .sub{ font-size:13px; }
#screen-home > .topbar .avatar-account{ display:none; }
.content{
  overflow:visible;
  padding:0 0 40px;
}
.action-bar{
  padding:12px 0 36px;
  justify-content:flex-end;
}
.action-bar .btn{ flex:0 1 220px; }
.segmented{ margin:0 0 18px; max-width:620px; }
.bottomnav{ display:none !important; }
.version-badge{
  position:fixed;
  top:auto;
  bottom:14px;
  left:auto;
  right:18px;
  transform:none;
}
.hero{
  margin-top:8px;
  padding:28px;
}
.hero .amount{ font-size:42px; }
.event-card{ padding:18px; }
#screen-home .content{
  display:grid;
  grid-template-columns:minmax(0, 1.25fr) minmax(320px, .75fr);
  gap:0 26px;
  align-content:start;
}
#screen-home .hero,
#screen-home .section-title{ grid-column:1 / -1; }
#screen-home .event-card:nth-of-type(1){ grid-column:1; }
#screen-home .event-card:nth-of-type(2){ grid-column:2; }

@media (max-width: 980px){
  .header-inner,.nav-inner,.app-shell{ width:min(100% - 32px, 1320px); }
  .site-logo{ width:205px; }
  .site-nav-item{ padding:0 13px; }
  #screen-home .content{ grid-template-columns:1fr; }
  #screen-home .event-card:nth-of-type(1),
  #screen-home .event-card:nth-of-type(2){ grid-column:1; }
}
@media (max-width: 680px){
  .header-inner{ min-height:72px; }
  .site-nav{ top:72px; }
  .site-logo{ width:156px; }
  .user-copy{ display:none; }
  .user-profile{ padding:5px; border:0; background:transparent; }
  .header-theme{ width:38px; height:38px; }
  .nav-inner{ width:100%; padding:0 12px; justify-content:flex-start; }
  .site-nav-item{ min-height:54px; padding:0 12px; font-size:12px; }
  .site-nav-item .icon{ width:18px; height:18px; }
  .app-shell{ width:calc(100% - 28px); min-height:calc(100vh - 126px); }
  .screen{ min-height:calc(100vh - 126px); }
  .topbar{ padding-top:24px; }
  .topbar .title{ font-size:21px; }
  .hero .amount{ font-size:34px; }
  .action-bar{ position:static; }
  .action-bar .btn{ flex:1; }
}

/* Conteúdo centralizado com margens responsivas */
main.app-shell{
  margin-inline:auto;
}
@media (min-width: 681px){
  .nav-inner::before,
  .nav-inner::after{
    content:"";
    flex:1 0 0;
  }
}


/* V1.3 — Home orientada a eventos */
#screen-home{ padding-bottom:56px; }
#screen-home .content, #screen-home > .topbar, #screen-home > .action-bar{ display:none !important; }
.home-heading{
  display:flex; align-items:flex-end; justify-content:space-between; gap:28px;
  padding:42px 0 26px;
}
.home-heading h1{ margin:5px 0 7px; font:800 clamp(28px,3vw,40px)/1.1 'Inter',sans-serif; letter-spacing:-.035em; }
.home-heading p{ margin:0; color:var(--ink-secondary); font-size:15px; max-width:660px; }
.eyebrow{ color:var(--accent2); font-size:11px; font-weight:800; letter-spacing:.14em; }
.home-new-event{ min-width:164px; flex:0 0 auto; }
.home-toolbar{ display:flex; align-items:center; gap:12px; margin-bottom:18px; }
.home-search{
  flex:1; min-height:48px; display:flex; align-items:center; gap:11px; padding:0 15px;
  border:1px solid var(--border); border-radius:14px; background:var(--surface-solid);
  box-shadow:0 8px 24px rgba(30,26,75,.04);
}
.home-search:focus-within{ border-color:var(--accent2); box-shadow:0 0 0 3px color-mix(in srgb,var(--accent2) 16%,transparent); }
.home-search input{ width:100%; border:0; outline:0; background:transparent; color:var(--ink); font:500 14px/1.4 'Inter',sans-serif; }
.home-search input::placeholder{ color:var(--ink-muted); }
.home-view-actions{ display:flex; }
.notification-ping{ position:absolute; width:8px; height:8px; border-radius:50%; background:var(--negative); top:8px; right:8px; border:2px solid var(--surface-solid); }
.home-view-actions .iconbtn{ position:relative; width:48px; height:48px; }
.home-filter-row{ display:flex; gap:8px; overflow:auto; padding:0 0 24px; scrollbar-width:none; }
.home-filter-row::-webkit-scrollbar{ display:none; }
.home-filter{
  border:1px solid var(--border); background:var(--surface-solid); color:var(--ink-secondary);
  min-height:38px; padding:0 13px; border-radius:999px; cursor:pointer; white-space:nowrap;
  font:700 12px/1 'Inter',sans-serif; display:flex; align-items:center; gap:7px;
}
.home-filter span{ min-width:20px; height:20px; border-radius:10px; display:grid; place-items:center; background:var(--surface-alt); font-size:10px; }
.home-filter:hover{ color:var(--ink); border-color:color-mix(in srgb,var(--accent2) 40%,var(--border)); }
.home-filter.active{ color:#fff; border-color:transparent; background:linear-gradient(135deg,var(--accent),var(--accent2)); box-shadow:0 8px 20px color-mix(in srgb,var(--accent2) 22%,transparent); }
.home-filter.active span{ background:rgba(255,255,255,.18); color:#fff; }
.home-layout{ display:grid; grid-template-columns:minmax(0,1fr) 340px; gap:24px; align-items:start; }
.events-panel,.attention-panel{ border:1px solid var(--border); border-radius:20px; background:var(--surface-solid); box-shadow:0 12px 34px rgba(25,21,65,.045); }
.events-panel{ padding:24px; }
.attention-panel{ padding:22px; position:sticky; top:166px; }
.panel-heading{ display:flex; align-items:flex-start; justify-content:space-between; gap:16px; margin-bottom:20px; }
.panel-heading h2{ margin:0 0 5px; font:800 18px/1.2 'Inter',sans-serif; }
.panel-heading p{ margin:0; color:var(--ink-secondary); font-size:12px; }
.text-action,.attention-all{ border:0; background:transparent; color:var(--accent2); font:700 12px/1.3 'Inter',sans-serif; cursor:pointer; }
.event-grid{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.event-project-card{
  min-width:0; border:1px solid var(--border); border-radius:17px; background:var(--surface);
  overflow:hidden; cursor:pointer; transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease;
}
.event-project-card:hover,.event-project-card:focus-visible{ transform:translateY(-3px); border-color:color-mix(in srgb,var(--accent2) 45%,var(--border)); box-shadow:0 16px 30px rgba(30,25,80,.09); outline:0; }
.event-project-card[hidden]{ display:none !important; }
.event-cover{ height:92px; position:relative; display:flex; align-items:center; padding:20px; overflow:hidden; }
.event-cover::after{ content:""; position:absolute; width:150px; height:150px; border-radius:50%; right:-46px; top:-70px; background:rgba(255,255,255,.13); }
.event-cover > .icon{ width:35px; height:35px; stroke:#fff; position:relative; z-index:1; }
.cover-travel{ background:linear-gradient(135deg,#312a7c,#4c8dff); }
.cover-party{ background:linear-gradient(135deg,#7a277e,#cb3df0); }
.cover-home{ background:linear-gradient(135deg,#176b68,#34b89c); }
.event-status{ position:absolute; top:14px; right:14px; z-index:2; padding:6px 9px; border-radius:999px; font-size:10px; font-weight:800; }
.status-active{ color:#fff; background:rgba(15,12,40,.34); backdrop-filter:blur(8px); }
.status-finished{ color:#135d51; background:#d8fff3; }
.event-project-body{ padding:17px; }
.event-project-title{ display:flex; justify-content:space-between; gap:10px; align-items:flex-start; }
.event-project-title h3{ margin:0 0 4px; font:800 15px/1.25 'Inter',sans-serif; }
.event-project-title p{ margin:0; color:var(--ink-secondary); font-size:11px; }
.iconbtn.compact{ width:31px; height:31px; border:0; box-shadow:none; background:transparent; }
.event-stats{ display:grid; grid-template-columns:1.45fr .75fr .9fr; gap:10px; margin:17px 0; padding:14px 0; border-top:1px solid var(--border); border-bottom:1px solid var(--border); }
.event-stats span{ min-width:0; color:var(--ink-secondary); font-size:9.5px; line-height:1.35; }
.event-stats strong{ display:block; color:var(--ink); font-size:12px; margin-bottom:2px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.event-project-footer{ display:flex; align-items:center; justify-content:space-between; gap:10px; min-height:28px; }
.event-attention{ display:flex; align-items:center; justify-content:flex-end; gap:6px; text-align:right; font-size:9.5px; font-weight:700; }
.event-attention.negative{ color:var(--negative); }.event-attention.warning{ color:#bd7415; }.event-attention.positive{ color:var(--positive); }
.status-dot{ width:7px; height:7px; border-radius:50%; background:currentColor; flex:0 0 auto; }
.attention-count{ min-width:28px; height:28px; border-radius:14px; display:grid; place-items:center; color:#fff; background:var(--negative); font-size:11px; font-weight:800; }
.attention-item{ width:100%; border:0; border-top:1px solid var(--border); background:transparent; color:var(--ink); padding:15px 0; display:grid; grid-template-columns:38px minmax(0,1fr) 18px; gap:11px; align-items:center; text-align:left; cursor:pointer; font-family:inherit; }
.attention-item:hover strong{ color:var(--accent2); }
.attention-item strong,.attention-item small{ display:block; }.attention-item strong{ font-size:12px; margin-bottom:4px; }.attention-item small{ font-size:10.5px; color:var(--ink-secondary); line-height:1.4; }
.attention-icon{ width:38px; height:38px; border-radius:12px; display:grid; place-items:center; }.attention-icon .icon{ width:18px; height:18px; }
.attention-icon.red{ color:var(--negative); background:var(--negative-bg); }.attention-icon.amber{ color:#bd7415; background:#fff2d9; }.attention-icon.blue{ color:var(--accent2); background:color-mix(in srgb,var(--accent2) 12%,transparent); }
.attention-item .chevron{ transform:rotate(180deg); color:var(--ink-muted); width:16px; }
.attention-all{ width:100%; padding-top:15px; border-top:1px solid var(--border); }
.home-empty{ text-align:center; padding:64px 20px; color:var(--ink-secondary); }.home-empty h3{ color:var(--ink); margin:14px 0 6px; }.home-empty p{ margin:0; font-size:12px; }
@media (max-width:1100px){ .home-layout{ grid-template-columns:1fr; }.attention-panel{ position:static; }.event-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:760px){ .home-heading{ align-items:flex-start; padding-top:28px; flex-direction:column; }.home-new-event{ width:100%; }.home-layout{ gap:16px; }.events-panel,.attention-panel{ padding:16px; border-radius:16px; }.event-grid{ grid-template-columns:1fr; }.home-filter-row{ margin-right:-14px; }.event-stats{ grid-template-columns:1.4fr .7fr .9fr; } }

/* =========================================================
   HOTFIX V1.3.1 — restaura a rolagem vertical no desktop
   ========================================================= */
html {
  height: auto;
  min-height: 100%;
  overflow-x: hidden;
  overflow-y: auto;
}
body {
  height: auto;
  min-height: 100vh;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior-y: auto;
}
.site-header,
.site-nav {
  width: 100%;
}
.app-shell,
.screen,
.screen.active {
  height: auto;
  overflow: visible;
}

@media (max-width: 680px) {
  html, body {
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }
}


/* V1.3.2 — campos de data com calendário nativo */
.date-range-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.date-field {
  display: grid;
  gap: 7px;
}
.date-field > span {
  color: var(--text-muted, #6b7280);
  font-size: 12px;
  font-weight: 650;
}
.date-input {
  min-height: 48px;
  cursor: text;
}
.date-input::-webkit-calendar-picker-indicator {
  cursor: pointer;
  opacity: .72;
}
/* Safari do iPhone/iPad: com o visual nativo, o campo de data ignora a
   largura da coluna (invade o vizinho e passa da tela) e, vazio, não mostra
   nem texto nem ícone — vira uma faixa cinza. Aqui ele ocupa só a sua coluna,
   mantém a altura e ganha ícone de calendário e o texto "Selecionar" quando
   está em branco (campos `required` vazios são :invalid). Só o iOS entende
   -webkit-touch-callout, então Android e computador não mudam. */
@supports (-webkit-touch-callout: none) {
  .date-input {
    -webkit-appearance: none;
    appearance: none;
    display: block;
    width: 100%;
    min-width: 0;
    box-sizing: border-box;
    text-align: left;
    padding-right: 40px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3.5' y='5' width='17' height='15.5' rx='2.5'/%3E%3Cpath d='M3.5 10h17M8 3v4M16 3v4'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 12px center;
    background-size: 18px;
  }
  .date-input::-webkit-date-and-time-value {
    text-align: left;
    min-height: 1.4em;
  }
  .date-field { position: relative; }
  .date-field:has(.date-input:invalid)::after {
    content: 'Selecionar';
    position: absolute;
    left: 14px;
    bottom: 0;
    height: 50px;
    display: flex;
    align-items: center;
    color: var(--ink-faint);
    font-size: 16px;
    pointer-events: none;
  }
}
.field-help {
  margin: 8px 0 0;
  color: var(--text-muted, #6b7280);
  font-size: 12px;
  line-height: 1.45;
}
@media (max-width: 620px) {
  .date-range-fields { grid-template-columns: 1fr; }
}


/* V1.5 — formulários funcionais */
.centered-actions{
  justify-content:center !important;
  align-items:center;
  gap:12px;
}
.centered-actions .btn{
  flex:0 1 210px;
  min-width:150px;
}
.expense-form-body{
  padding:0 14px 16px 44px;
}
.expense-form-body .date-field{ max-width:360px; }
.notes-author{
  display:flex;
  align-items:center;
  gap:10px;
  margin-bottom:10px;
  color:var(--ink);
}
.notes-author span:last-child{ display:flex; flex-direction:column; }
.notes-author small{ color:var(--ink-secondary); font-size:11px; margin-top:2px; }
.notes-input{ resize:vertical; min-height:100px; line-height:1.45; }
.modal-overlay{
  position:fixed;
  inset:0;
  z-index:3000;
  display:none;
  align-items:center;
  justify-content:center;
  padding:20px;
  background:rgba(15,18,32,.48);
  backdrop-filter:blur(4px);
}
.modal-overlay.open{ display:flex; }
.modal-card{
  width:min(520px,100%);
  border:1px solid var(--border);
  border-radius:18px;
  background:var(--surface);
  box-shadow:0 24px 70px rgba(16,20,40,.24);
  padding:20px;
}
.modal-head{ display:flex; align-items:flex-start; justify-content:space-between; gap:16px; margin-bottom:14px; }
.modal-head .title{ font-size:19px; font-weight:750; }
.receipt-options{ display:grid; gap:10px; }
.receipt-option{
  width:100%;
  border:1px solid var(--border);
  border-radius:14px;
  padding:14px;
  background:var(--surface);
  color:var(--ink);
  display:flex;
  align-items:center;
  gap:12px;
  text-align:left;
  cursor:pointer;
  font:inherit;
  transition:.18s ease;
}
.receipt-option:hover{ border-color:var(--accent); transform:translateY(-1px); }
.receipt-option span:last-child{ display:flex; flex-direction:column; gap:3px; }
.receipt-option small{ color:var(--ink-secondary); font-size:12px; }
.receipt-option.is-disabled{ opacity:.48; cursor:not-allowed; }
.receipt-option.is-disabled:hover{ border-color:var(--border); transform:none; }
@media (max-width:640px){
  .centered-actions{ flex-direction:column-reverse; }
  .centered-actions .btn{ width:100%; flex:auto; }
  .expense-form-body{ padding-left:14px; }
}


/* =========================================================
   V1.5.2 — eventos em lista
   ========================================================= */
#home-event-grid.event-list{
  display:flex;
  flex-direction:column;
  gap:0;
  border:1px solid var(--border);
  border-radius:16px;
  overflow:hidden;
  background:var(--surface);
}
#home-event-grid .event-list-row{
  display:grid;
  grid-template-columns:56px minmax(180px,1.45fr) minmax(112px,.8fr) 78px 100px 112px minmax(135px,.85fr) 116px 18px;
  align-items:center;
  gap:16px;
  min-height:88px;
  padding:14px 16px;
  border:0;
  border-bottom:1px solid var(--border);
  border-radius:0;
  overflow:visible;
  background:var(--surface);
  box-shadow:none;
  transition:background .16s ease,border-color .16s ease;
}
#home-event-grid .event-list-row:last-child{ border-bottom:0; }
#home-event-grid .event-list-row:hover,
#home-event-grid .event-list-row:focus-visible{
  transform:none;
  background:var(--surface-alt);
  border-color:var(--border);
  box-shadow:none;
  outline:2px solid color-mix(in srgb,var(--accent2) 32%,transparent);
  outline-offset:-2px;
}
.event-list-icon{
  width:52px;
  height:52px;
  border-radius:14px;
  display:grid;
  place-items:center;
}
.event-list-icon .icon{ width:25px; height:25px; stroke:#fff; }
.event-list-main{ min-width:0; }
.event-list-title h3{ margin:0 0 5px; font:800 14px/1.25 'Inter',sans-serif; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.event-list-title p{ margin:0; color:var(--ink-secondary); font-size:11px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.event-list-metric{ min-width:0; }
.event-list-metric span{ display:block; color:var(--ink-secondary); font-size:9px; margin-bottom:5px; }
.event-list-metric strong{ display:block; color:var(--ink); font-size:12px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.event-list-people .avatars{ justify-content:flex-start; }
.avatar-more{ background:var(--surface-alt)!important; color:var(--ink-secondary); border:1px solid var(--border); }
.event-list-state{ min-width:0; display:flex; flex-direction:column; align-items:flex-start; gap:7px; }
.event-list-state .event-status{ position:static; display:inline-flex; padding:5px 8px; }
.event-list-state .status-active{ color:var(--accent2); background:color-mix(in srgb,var(--accent2) 12%,transparent); backdrop-filter:none; }
.event-list-state .event-attention{ justify-content:flex-start; text-align:left; white-space:nowrap; }
:root[data-theme="light"] .event-list-state .event-attention.warning{color:#945400}
:root[data-theme="light"] .event-action-btn{color:#526078;border-color:#d6dce8}
:root[data-theme="light"] .event-list-chevron{color:#526078}
.event-list-actions{ display:flex; align-items:center; justify-content:flex-end; gap:6px; }
.event-action-btn{ width:34px; height:34px; border:1px solid var(--border); border-radius:10px; display:grid; place-items:center; background:var(--surface); color:var(--ink-secondary); cursor:pointer; transition:background .16s ease,border-color .16s ease,color .16s ease,transform .16s ease,box-shadow .16s ease; }
.event-action-btn .icon{ width:16px; height:16px; }
.event-action-btn:hover{ transform:translateY(-1px); box-shadow:0 5px 14px rgba(20,24,40,.10); }
.event-action-btn:focus-visible{ outline:2px solid color-mix(in srgb,var(--accent2) 42%,transparent); outline-offset:2px; }
.event-action-btn.action-finish:hover{ color:#14815d; border-color:color-mix(in srgb,#14815d 38%,var(--border)); background:color-mix(in srgb,#14815d 8%,var(--surface)); }
.event-action-btn.action-settings:hover{ color:var(--accent2); border-color:color-mix(in srgb,var(--accent2) 38%,var(--border)); background:color-mix(in srgb,var(--accent2) 8%,var(--surface)); }
.event-action-btn.action-delete:hover{ color:#c73c4d; border-color:color-mix(in srgb,#c73c4d 38%,var(--border)); background:color-mix(in srgb,#c73c4d 8%,var(--surface)); }
.event-list-chevron{ width:16px; height:16px; color:var(--ink-muted); transform:rotate(180deg); }
.event-list-mobile-status{ display:none; }

/* Meus eventos em dois blocos, nesta ordem: Em andamento (verde) e Em
   planejamento (azul). A cor do bloco se repete na faixa de cada linha e no
   status, para que os dois não se confundam. */
#home-event-grid{
  --status-active:var(--positive);
  --status-active-ink:color-mix(in srgb,var(--positive) 78%,var(--ink));
  --status-planning:var(--v2-primary,var(--accent2));
  --status-planning-ink:color-mix(in srgb,var(--v2-primary,var(--accent2)) 72%,var(--ink));
}
#home-event-grid .event-list-section{
  --section-color:var(--status-active);
  --section-ink:var(--status-active-ink);
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:4px 8px;
  padding:12px 16px 10px;
  background:var(--surface-alt);
  border-bottom:1px solid var(--border);
}
#home-event-grid .event-list-section[hidden]{ display:none; }
#home-event-grid .event-list-section.section-planning{
  --section-color:var(--status-planning);
  --section-ink:var(--status-planning-ink);
}
#home-event-grid .event-list-section .status-dot{ width:8px; height:8px; background:var(--section-color); }
#home-event-grid .event-list-section strong{ color:var(--section-ink); font:800 12px/1.2 'Inter',sans-serif; letter-spacing:.04em; text-transform:uppercase; }
.event-list-section-count{ min-width:22px; padding:2px 7px; border-radius:20px; text-align:center; font-size:11px; font-weight:800; color:var(--section-ink); background:color-mix(in srgb,var(--section-color) 14%,transparent); }
/* A frase fica sempre abaixo do título e em uma linha só. */
#home-event-grid .event-list-section small{ flex-basis:100%; min-width:0; margin-left:16px; overflow:hidden; color:var(--ink-secondary); font-size:11px; white-space:nowrap; text-overflow:ellipsis; }
#home-event-grid .event-list-row,
#home-event-grid .event-list-row:hover,
#home-event-grid .event-list-row:focus-visible{ box-shadow:inset 3px 0 0 var(--status-active); }
#home-event-grid .event-list-row[data-event-tags~="planning"],
#home-event-grid .event-list-row[data-event-tags~="planning"]:hover,
#home-event-grid .event-list-row[data-event-tags~="planning"]:focus-visible{ box-shadow:inset 3px 0 0 var(--status-planning); }
.event-list-state .event-attention.is-active{ color:var(--status-active-ink); }
.event-list-state .event-attention.is-planning{ color:var(--status-planning-ink); }
@media (max-width:560px){
  #home-event-grid .event-list-section{ padding:11px 12px 9px; }
}
@media (max-width:350px){
  #home-event-grid .event-list-section small{ margin-left:0; font-size:10px; }
}

/* Até 1300px: com as colunas fixas da linha mais largas que o painel, os
   botões de ação ficavam cortados à direita. */
@media (max-width:1300px){
  #home-event-grid .event-list-row{
    grid-template-columns:52px minmax(170px,1.4fr) minmax(105px,.8fr) 70px 92px minmax(125px,.8fr) 116px 18px;
  }
  .event-list-people{ display:none; }
}
@media (max-width:820px){
  #home-event-grid.event-list{ border-radius:14px; }
  #home-event-grid .event-list-row{
    grid-template-columns:48px minmax(0,1fr) auto;
    grid-template-areas:
      "icon main chevron"
      "icon total chevron";
    gap:5px 12px;
    min-height:92px;
    padding:14px;
  }
  .event-list-icon{ grid-area:icon; width:46px; height:46px; border-radius:13px; }
  .event-list-main{ grid-area:main; display:flex; align-items:flex-start; justify-content:space-between; gap:8px; }
  .event-list-mobile-status{ display:block; flex:0 0 auto; }
  .event-list-mobile-status .event-status{ position:static; padding:5px 7px; }
  .event-list-mobile-status .status-active{ color:var(--accent2); background:color-mix(in srgb,var(--accent2) 12%,transparent); backdrop-filter:none; }
  .event-list-metric.event-total{ grid-area:total; display:flex; align-items:center; gap:7px; }
  .event-list-metric.event-total span{ margin:0; }
  .event-list-metric.event-total strong{ font-size:11px; }
  .event-list-chevron{ grid-area:chevron; align-self:center; }
  .event-list-metric:not(.event-total),.event-list-state,.event-list-people{ display:none; }
}


/* V1.5.3 — painel de eventos simplificado */
#screen-home .home-toolbar,
#screen-home .attention-panel {
  display: none !important;
}
#screen-home .home-layout {
  grid-template-columns: minmax(0, 1fr);
}
#screen-home .events-panel {
  width: 100%;
}
#screen-home .home-filter-row {
  padding-top: 2px;
}

/* =========================================================
   V1.5.4 — menu integrado ao cabeçalho e Home simplificada
   ========================================================= */
.site-header{
  box-shadow:0 8px 24px rgba(20,18,55,.04);
}
.header-inner{
  min-height:78px;
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:clamp(16px,2.2vw,34px);
}
.site-header .site-nav{
  position:static;
  min-width:0;
  width:100%;
  border:0;
  box-shadow:none;
  background:transparent;
  backdrop-filter:none;
}
.site-header .nav-inner{
  width:100%;
  margin:0;
  justify-content:center;
  gap:2px;
}
.site-header .site-nav-item{
  min-height:46px;
  padding:0 clamp(8px,1vw,14px);
  border-bottom-width:2px;
  border-radius:10px 10px 0 0;
  font-size:12px;
}
.site-header .site-nav-item .icon{
  width:18px;
  height:18px;
}
.header-sync{
  width:38px;
  height:38px;
  border:1px solid var(--border);
  border-radius:12px;
  background:var(--surface-alt);
  cursor:pointer;
  display:grid;
  place-items:center;
  padding:0;
}
.sync-status-dot{width:9px;height:9px;border-radius:50%;background:var(--ink-faint);box-shadow:0 0 0 3px color-mix(in srgb,var(--ink-faint) 14%,transparent)}
.header-sync.is-synced .sync-status-dot{background:var(--positive);box-shadow:0 0 0 3px color-mix(in srgb,var(--positive) 14%,transparent)}
.header-sync.is-connecting .sync-status-dot,.header-sync.is-syncing .sync-status-dot,.header-sync.is-pending .sync-status-dot,.header-sync.is-offline .sync-status-dot{background:#E6A23C;box-shadow:0 0 0 3px color-mix(in srgb,#E6A23C 14%,transparent)}
.header-sync.is-syncing .sync-status-dot,.header-sync.is-connecting .sync-status-dot{animation:sync-pulse 1s ease-in-out infinite}
.header-sync.is-error .sync-status-dot{background:var(--negative);box-shadow:0 0 0 3px color-mix(in srgb,var(--negative) 14%,transparent)}
@keyframes sync-pulse{50%{opacity:.35;transform:scale(.82)}}
.app-shell{
  min-height:calc(100vh - 86px);
}
#screen-home{
  padding-top:32px;
}
#screen-home .home-heading{
  display:none !important;
}
#screen-home .home-filter-row{
  align-items:center;
  padding:0 0 20px;
}
.home-filter-new{
  color:#fff;
  border-color:transparent;
  background:linear-gradient(135deg,var(--accent),var(--accent2));
  box-shadow:0 8px 20px color-mix(in srgb,var(--accent2) 22%,transparent);
}
.home-filter-new .icon{
  width:16px;
  height:16px;
  stroke:#fff;
}
.home-filter-new:hover{
  color:#fff;
  border-color:transparent;
  filter:brightness(1.04);
}

@media (max-width:1100px){
  .header-inner{
    gap:14px;
  }
  .site-logo{ width:190px; }
  .site-header .site-nav-item{
    padding:0 8px;
    gap:5px;
    font-size:11px;
  }
  .user-copy{ display:none; }
  .user-profile{ padding:6px; }
}
@media (max-width:820px){
  .site-header .nav-inner{ justify-content:flex-start; padding-bottom:4px; }
  .site-header .site-nav-item{ min-height:46px; }
  .app-shell{ min-height:calc(100vh - 132px); }
}
@media (max-width:560px){
  .site-logo{ width:150px; }
  #screen-home{ padding-top:22px; }
  #screen-home .home-filter-row{ margin-right:-14px; }
}


/* V1.5.5 — Home institucional e painel de eventos separado */
#screen-home{padding-top:34px;}
.welcome-home{
  min-height:560px;
  display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(300px,.85fr);
  align-items:center;
  gap:72px;
  padding:72px 82px;
  border:1px solid var(--border);
  border-radius:28px;
  background:linear-gradient(135deg,var(--surface) 0%,var(--surface-alt) 100%);
  box-shadow:var(--shadow-sm);
  overflow:hidden;
}
.welcome-home-copy{max-width:700px;}
.welcome-eyebrow{display:inline-block;margin-bottom:16px;font-size:13px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--primary);}
.welcome-home h1{margin:0 0 18px;font-size:clamp(40px,5vw,68px);line-height:1.04;letter-spacing:-.045em;color:var(--text);}
.welcome-home p{max-width:680px;margin:0 0 32px;font-size:18px;line-height:1.7;color:var(--muted);}
.welcome-create{width:auto;min-height:48px;padding:0 22px;display:inline-flex;align-items:center;justify-content:center;gap:9px;}
.welcome-home-visual{display:flex;align-items:center;justify-content:center;position:relative;min-height:340px;}
.welcome-home-visual::before{content:"";position:absolute;width:330px;height:330px;border-radius:50%;background:color-mix(in srgb,var(--primary) 12%,transparent);filter:blur(2px);}
.welcome-home-visual img{position:relative;z-index:1;width:min(100%,310px);height:auto;filter:drop-shadow(0 24px 34px rgba(40,75,190,.22));}
#screen-eventos{padding-top:34px;padding-bottom:56px;}
#screen-eventos .home-filter-row{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:0 0 24px;overflow:visible;}
.event-filter-group{display:flex;align-items:center;gap:8px;overflow:auto;scrollbar-width:none;}
.event-filter-group::-webkit-scrollbar{display:none;}
.home-new-event-action{min-height:40px;padding:0 16px;border:0;border-radius:10px;background:#246BFD;color:#fff;font:inherit;font-size:14px;font-weight:750;display:inline-flex;align-items:center;justify-content:center;gap:7px;white-space:nowrap;cursor:pointer;box-shadow:0 7px 16px rgba(36,107,253,.2);}
.home-new-event-action:hover{filter:brightness(.96);transform:translateY(-1px);}
#screen-eventos .home-layout{grid-template-columns:minmax(0,1fr);}
#screen-eventos .events-panel{width:100%;}
@media (max-width:900px){.welcome-home{grid-template-columns:1fr;padding:48px 40px;gap:28px}.welcome-home-visual{min-height:220px}.welcome-home-visual img{width:220px}.welcome-home-visual::before{width:250px;height:250px}}
@media (max-width:620px){#screen-home,#screen-eventos{padding-top:20px}.welcome-home{padding:34px 22px;border-radius:20px}.welcome-home h1{font-size:40px}.welcome-home p{font-size:16px}.welcome-create{width:100%}#screen-eventos .home-filter-row{align-items:stretch;flex-direction:column}.event-filter-group{width:100%}.home-new-event-action{width:100%}}

/* =========================================================
   V1.5.8 — estados dos filtros e padronização de botões
   ========================================================= */
:root{
  --button-height:44px;
  --button-radius:12px;
}

/* Padrão visual comum para os principais botões do aplicativo */
.btn,
.home-filter,
.home-new-event-action,
.welcome-create{
  min-height:var(--button-height);
  height:var(--button-height);
  border-radius:var(--button-radius);
  padding:0 16px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  line-height:1;
  white-space:nowrap;
}

/* Cabeçalho do box Meus eventos */
#screen-eventos .panel-heading{
  align-items:center;
  overflow:visible;
}
#screen-eventos .home-toolbar{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:12px;
  overflow:visible;
}
#screen-eventos .event-filter-group{
  overflow:visible;
  padding:8px;
  margin:-8px;
}

/* Filtro selecionado: contorno luminoso e sombra sem recorte */
#screen-eventos .home-filter{
  background:var(--surface);
  border:1px solid var(--border);
  color:var(--ink-secondary);
  box-shadow:none;
  transition:border-color .18s ease, box-shadow .18s ease, color .18s ease, background .18s ease, transform .18s ease;
}
#screen-eventos .home-filter:hover{
  color:var(--ink);
  border-color:color-mix(in srgb,var(--accent2) 60%,var(--border));
}
#screen-eventos .home-filter.active{
  color:var(--accent2);
  background:color-mix(in srgb,var(--accent2) 10%,var(--surface));
  border-color:var(--accent2);
  box-shadow:
    0 0 0 2px color-mix(in srgb,var(--accent2) 28%,transparent),
    0 8px 22px color-mix(in srgb,var(--accent2) 24%,transparent);
}
#screen-eventos .home-filter.active span{
  color:var(--accent2);
  background:color-mix(in srgb,var(--accent2) 14%,transparent);
}

/* Ação primária consistente */
.home-new-event-action,
.welcome-create{
  border:1px solid transparent;
  background:#246BFD;
  color:#fff;
  font-size:14px;
  font-weight:750;
  box-shadow:0 8px 20px rgba(36,107,253,.22);
}
.home-new-event-action:hover,
.welcome-create:hover{
  filter:brightness(.97);
  transform:translateY(-1px);
}

@media (max-width:760px){
  #screen-eventos .panel-heading{
    align-items:stretch;
    flex-direction:column;
  }
  #screen-eventos .home-toolbar{
    width:100%;
    align-items:stretch;
    flex-direction:column;
  }
  #screen-eventos .event-filter-group{
    width:calc(100% + 16px);
    overflow-x:auto;
    padding:8px;
    margin:-8px;
  }
  #screen-eventos .home-new-event-action{
    width:100%;
  }
}


/* V1.5.9 — apresentação inicial convertida em popup de instruções */
body.modal-open{overflow:hidden;}
.welcome-modal-overlay{z-index:4200;background:rgba(8,16,38,.62);backdrop-filter:blur(8px);}
.welcome-modal-card{
  position:relative;
  width:min(680px,100%);
  max-height:calc(100vh - 40px);
  overflow:auto;
  padding:34px;
  border-radius:24px;
  text-align:left;
  box-shadow:0 30px 90px rgba(10,23,62,.34);
}
.welcome-modal-close{
  position:absolute;top:18px;right:18px;z-index:2;
  width:40px;height:40px;border:1px solid var(--border);border-radius:12px;
  display:inline-flex;align-items:center;justify-content:center;
  background:var(--surface);color:var(--ink);cursor:pointer;
}
.welcome-modal-close:hover{background:var(--surface-alt);}
.welcome-modal-brand{width:76px;height:76px;margin-bottom:20px;border-radius:22px;display:flex;align-items:center;justify-content:center;background:color-mix(in srgb,var(--accent2) 10%,var(--surface));}
.welcome-modal-brand img{width:62px;height:62px;object-fit:contain;}
.welcome-modal-card h1{margin:8px 0 14px;font-size:clamp(32px,5vw,46px);line-height:1.05;letter-spacing:-.035em;color:var(--ink);}
.welcome-modal-intro{margin:0;color:var(--ink-secondary);font-size:16px;line-height:1.65;}
.welcome-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:26px 0;}
.welcome-step{padding:16px;border:1px solid var(--border);border-radius:16px;background:var(--surface-alt);display:flex;gap:11px;align-items:flex-start;}
.welcome-step>span{width:28px;height:28px;flex:0 0 28px;border-radius:9px;display:inline-flex;align-items:center;justify-content:center;background:#246BFD;color:#fff;font-weight:800;font-size:13px;}
.welcome-step div{display:flex;flex-direction:column;gap:5px;}
.welcome-step strong{font-size:14px;color:var(--ink);}
.welcome-step small{font-size:12px;line-height:1.45;color:var(--ink-secondary);}
.welcome-modal-action{width:100%;}
@media(max-width:680px){
  .welcome-modal-card{padding:28px 20px 22px;border-radius:20px;}
  .welcome-steps{grid-template-columns:1fr;}
  .welcome-modal-brand{width:64px;height:64px;border-radius:18px;}
  .welcome-modal-brand img{width:52px;height:52px;}
}


/* Financeiro V1.6.0 */
.finance-content{padding-top:18px}
.finance-summary{display:grid;grid-template-columns:1.25fr 1fr 1fr;gap:16px;margin-bottom:20px}
.finance-summary-card{background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:20px;box-shadow:0 10px 28px rgba(22,27,45,.06);min-width:0}
.finance-summary-card>span{display:block;color:var(--ink-secondary);font-size:13px;font-weight:700;margin-bottom:8px}
.finance-summary-card>strong{display:block;font-family:'Inter',sans-serif;font-size:28px;line-height:1.2;margin-bottom:6px}
.finance-summary-card>small{display:block;color:var(--ink-secondary);font-size:12.5px;line-height:1.45}
.finance-balance-card{background:linear-gradient(135deg,var(--surface),var(--surface-alt));border-color:rgba(124,111,239,.28)}
.finance-statement-panel{background:var(--surface);border:1px solid var(--border);border-radius:18px;box-shadow:0 12px 34px rgba(22,27,45,.07);overflow:visible}
.finance-statement-head{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:20px 22px;border-bottom:1px solid var(--border)}
.finance-statement-head h2{font-family:'Inter',sans-serif;font-size:18px;margin:0 0 3px}.finance-statement-head p{margin:0;color:var(--ink-secondary);font-size:12.5px}
.finance-filter-group{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.finance-filter{min-height:40px;padding:0 16px;border:1px solid var(--border);border-radius:12px;background:var(--surface);color:var(--ink-secondary);font:700 13px 'Inter',sans-serif;cursor:pointer;transition:.18s ease;box-shadow:none}
.finance-filter:hover{border-color:rgba(0,102,255,.55);color:var(--ink)}
.finance-filter.active{color:var(--ink);border-color:#0066FF;box-shadow:0 0 0 3px rgba(0,102,255,.16),0 8px 18px rgba(0,102,255,.12);background:var(--surface-alt)}
.finance-statement-list{padding:8px 14px 14px}
.finance-entry{display:grid;grid-template-columns:44px minmax(0,1fr) minmax(120px,160px) minmax(110px,140px) 20px;gap:14px;align-items:center;padding:15px 10px;border-bottom:1px solid var(--border);cursor:pointer;border-radius:12px;transition:.18s ease}
.finance-entry:last-child{border-bottom:none}.finance-entry:hover{background:var(--surface-alt)}
.finance-entry-avatar{width:42px;height:42px;border-radius:13px;color:var(--accent2);background:color-mix(in srgb,var(--accent2) 12%,var(--surface));display:flex;align-items:center;justify-content:center}.finance-entry-avatar .icon{width:20px;height:20px}
.finance-entry-main{min-width:0}.finance-entry-event{color:#6D63DB;font-size:12px;font-weight:800;margin-bottom:3px}.finance-entry-main strong{display:block;font-size:14px;margin-bottom:4px}.finance-entry-main small{display:block;color:var(--ink-secondary);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.finance-entry-total,.finance-entry-value{text-align:right}.finance-entry-total span,.finance-entry-value span{display:block;color:var(--ink-secondary);font-size:10px;font-weight:800;margin-bottom:4px;text-transform:uppercase;letter-spacing:.04em}.finance-entry-value span{width:max-content;margin-left:auto;padding:3px 7px;border-radius:999px}.finance-entry-value.positive span{color:var(--positive);background:color-mix(in srgb,var(--positive) 13%,transparent)}.finance-entry-value.negative span{color:var(--negative);background:color-mix(in srgb,var(--negative) 13%,transparent)}.finance-entry-value.neutral span{background:var(--surface-alt)}.finance-entry-total strong,.finance-entry-value strong{font-size:16px}.finance-entry-value.neutral strong{color:var(--ink-secondary)}.finance-entry-chevron{width:18px;height:18px;transform:rotate(180deg);stroke:var(--ink-faint)}
.finance-empty{text-align:center;padding:46px 20px;color:var(--ink-secondary)}.finance-empty .icon{stroke:var(--positive);margin-bottom:10px}.finance-empty h3{color:var(--ink);margin:0 0 6px}.finance-empty p{margin:0}
@media(max-width:900px){.finance-summary{grid-template-columns:1fr 1fr}.finance-balance-card{grid-column:1/-1}.finance-statement-head{align-items:flex-start;flex-direction:column}.finance-filter-group{width:100%}.finance-filter{flex:1}}
@media(max-width:640px){.finance-summary{grid-template-columns:1fr}.finance-balance-card{grid-column:auto}.finance-summary-card{padding:16px}.finance-summary-card>strong{font-size:24px}.finance-statement-panel{border-radius:14px}.finance-statement-head{padding:16px}.finance-filter-group{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.finance-filter{padding:0 8px;min-height:38px}.finance-statement-list{padding:6px 8px 10px}.finance-entry{grid-template-columns:38px minmax(0,1fr) auto;grid-template-rows:auto auto;gap:8px 10px;padding:13px 8px}.finance-entry-avatar{width:38px;height:38px;border-radius:11px}.finance-entry-main small{max-width:180px}.finance-entry-total{grid-column:2;text-align:left}.finance-entry-value{grid-column:3;grid-row:1/-1}.finance-entry-chevron{display:none}.finance-entry-total strong,.finance-entry-value strong{font-size:14px}}


/* Evento — V1.6.1 */
.event-header-copy{min-width:0}
.event-add-expense{flex:0 0 auto; min-height:44px; padding:0 18px; border-radius:12px}
.event-tabs{max-width:none; overflow-x:auto; overflow-y:visible; padding:5px; scrollbar-width:none}
.event-tabs::-webkit-scrollbar{display:none}
.event-tabs .seg{min-width:108px; white-space:nowrap; padding:10px 12px}
.event-overview-grid{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin-bottom:18px}
.event-overview-card{background:var(--surface); border:1px solid var(--border); border-radius:16px; padding:16px; display:flex; flex-direction:column; gap:6px}
.event-overview-card span{font-size:12px; color:var(--ink-secondary)}
.event-overview-card strong{font-family:'Inter',sans-serif; font-size:20px; color:var(--ink)}
@media (max-width:700px){
  .event-header{align-items:flex-start; flex-wrap:wrap}
  .event-header .spacer{display:none}
  .event-header-copy{flex:1}
  .event-add-expense{order:3; width:100%; margin-top:4px}
  .event-tabs{justify-content:flex-start}
  .event-tabs .seg{flex:0 0 auto}
  .event-overview-grid{grid-template-columns:1fr}
}


/* Evento — resumo financeiro V1.6.2 */
.event-summary-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-bottom:22px;align-items:stretch}
.event-financial-status{margin:0;padding:22px;min-height:168px;display:flex;flex-direction:column;justify-content:center;overflow:visible;width:100%;color:inherit;font:inherit;text-align:left;cursor:pointer;transition:border-color .18s ease,box-shadow .18s ease}
.event-financial-status:hover{border-color:color-mix(in srgb,var(--accent2) 48%,var(--border));box-shadow:0 12px 30px rgba(31,38,74,.11)}
.event-financial-status:focus-visible{outline:none;border-color:var(--accent2);box-shadow:inset 0 0 0 2px color-mix(in srgb,var(--accent2) 42%,transparent),0 12px 30px rgba(31,38,74,.11)}
.event-financial-status .amount{font-size:34px}
.event-total-card{background:var(--surface);border:1px solid var(--border);border-radius:18px;padding:22px;display:flex;flex-direction:column;justify-content:center;box-shadow:0 12px 30px rgba(31,38,74,.08);overflow:visible;width:100%;color:inherit;font:inherit;text-align:left;cursor:pointer;transition:border-color .18s ease,box-shadow .18s ease}
.event-total-card:hover{border-color:color-mix(in srgb,var(--accent2) 48%,var(--border));box-shadow:0 12px 30px rgba(31,38,74,.11)}
.event-total-card:focus-visible{outline:none;border-color:var(--accent2);box-shadow:inset 0 0 0 2px color-mix(in srgb,var(--accent2) 42%,transparent),0 12px 30px rgba(31,38,74,.11)}
.event-total-card>span{font-size:12px;color:var(--ink-secondary);margin-bottom:8px}
.event-total-card>strong{font-family:'Inter',sans-serif;font-size:30px;line-height:1.1;color:var(--ink)}
.event-total-meta{display:flex;gap:14px;flex-wrap:wrap;margin-top:16px;padding-top:14px;border-top:1px solid var(--border);font-size:12px;color:var(--ink-secondary)}
.event-total-meta b{color:var(--ink);font-weight:800}
.event-summary-statement{background:var(--surface);border:1px solid var(--border);border-radius:18px;padding:18px 18px 4px;overflow:visible}
.event-summary-statement .section-title{margin:0 0 8px}
@media(max-width:760px){.event-summary-grid{grid-template-columns:1fr}.event-financial-status,.event-total-card{min-height:auto}.event-total-card>strong{font-size:26px}}


/* Extrato de despesas V1.6.4 */
@media (max-width: 900px){
  .expense-row{ grid-template-columns:28px 40px minmax(150px,1fr) 120px minmax(155px,.7fr); gap:9px; }
  .expense-total-column{ padding:0 8px; }
  .expense-status{ white-space:normal; max-width:145px; }
}
@media (max-width: 720px){
  .expense-row{ grid-template-columns:26px 38px minmax(0,1fr) auto; gap:9px; }
  .expense-total-column{ grid-column:3; grid-row:2; border:0; padding:4px 0 0; text-align:left; display:flex; align-items:baseline; gap:6px; }
  .expense-total-column>span{ margin:0; }
  .expense-val{ text-align:left; }
  .expense-status-column{ grid-column:4; grid-row:1 / span 2; max-width:128px; }
  .expense-status{ white-space:normal; text-align:right; max-width:105px; }
  .expense-chevron{ display:none; }
}
@media (max-width: 480px){
  .expense-date{ width:25px; }
  .expense-tile{ width:36px; height:36px; }
  .expense-mid .name{ font-size:13px; }
  .expense-status-column{ max-width:105px; }
  .expense-status{ font-size:10px; padding:4px 6px; }
}


/* Detalhe da despesa — V1.6.5: layout compacto e orientado à leitura */
#screen-despesa-detalhe .expense-detail-topbar{gap:12px}
.expense-detail-edit{flex:0 0 auto;min-height:40px;padding:0 14px;border-radius:11px}
.expense-detail-content{padding-top:18px;padding-bottom:28px}
.expense-detail-summary{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:18px 20px;margin-bottom:14px;background:var(--surface);border:1px solid var(--border);border-radius:16px;box-shadow:0 8px 24px rgba(22,27,45,.055)}
.expense-detail-identity{display:flex;align-items:center;gap:14px;min-width:0}
.expense-detail-date{width:34px;flex:0 0 34px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;text-align:center}
.expense-detail-date span{font-size:10px;font-weight:800;letter-spacing:.04em;color:var(--ink-secondary)}
.expense-detail-date strong{font:800 17px/1 'Inter',sans-serif;color:var(--ink)}
.expense-detail-icon{width:48px;height:48px;flex:0 0 48px;margin:0}
.expense-detail-label,.expense-detail-payer>span,.expense-detail-kicker{display:block;color:var(--ink-secondary);font-size:11px;font-weight:800;letter-spacing:.055em;text-transform:uppercase}
.expense-detail-identity .amount{font-size:26px;line-height:1.15;margin:2px 0 3px}
.expense-detail-payer{display:flex;flex-direction:column;align-items:flex-end;gap:7px;padding-left:22px;border-left:1px solid var(--border)}
.expense-detail-person{display:flex;align-items:center;gap:9px}
.expense-detail-person .avatar{width:34px;height:34px;font-size:12px}
.expense-detail-person strong{font-size:13px}
.expense-detail-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,.8fr);gap:14px;align-items:start}
.expense-detail-card{background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:16px;box-shadow:0 8px 24px rgba(22,27,45,.045);overflow:visible}
.expense-detail-section-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:12px}
.expense-detail-section-head h2{margin:3px 0 0;font:750 16px/1.25 'Inter',sans-serif;color:var(--ink)}
.expense-detail-settlement-section .expense-settlement-card{margin:0;padding:14px;border-radius:13px;box-shadow:none}
.expense-detail-settlement-section .expense-settlement-head{padding-bottom:10px;margin-bottom:6px}
.expense-detail-settlement-section .settlement-person-row{min-height:46px;padding:8px 0;gap:10px}
.expense-detail-settlement-section .settlement-person-row .avatar{width:32px;height:32px;font-size:11px}
.expense-detail-settlement-section .settlement-person-row strong{font-size:13px}
.expense-detail-settlement-section .settlement-person-row small{font-size:11px}
.expense-detail-split-list{display:flex;flex-direction:column}
.expense-detail-split-list .participant-row{min-height:46px;padding:8px 0;border-bottom:1px solid var(--border)}
.expense-detail-split-list .participant-row:last-child{border-bottom:none}
.expense-detail-split-list .avatar{width:32px;height:32px;font-size:11px}
.expense-detail-split-list .participant-name{font-size:13px}
.expense-detail-proof-section{margin-top:14px}
.expense-detail-proof-head{align-items:center;margin-bottom:10px}
.expense-detail-upload{min-height:62px;border-radius:12px;flex-direction:row;gap:9px;padding:14px;color:var(--ink-secondary)}
.expense-detail-upload .icon{width:20px;height:20px}
.expense-detail-upload span{font-size:13px;font-weight:700}
.expense-detail-proof-row{margin-top:0;border-radius:12px}
.expense-detail-proof-row .expandable-head{min-height:50px;padding:8px 10px}
.expense-detail-proof-row .btn{min-height:36px;padding:0 12px;border-radius:10px;font-size:12px}
@media(max-width:820px){
  .expense-detail-grid{grid-template-columns:1fr}
  .expense-detail-summary{align-items:flex-start}
}
@media(max-width:560px){
  .expense-detail-edit{width:40px;padding:0;font-size:0}
  .expense-detail-edit .icon{margin:0}
  .expense-detail-content{padding-top:12px}
  .expense-detail-summary{padding:15px 12px;gap:10px;align-items:center}
  .expense-detail-identity{gap:10px}
  .expense-detail-date{width:28px;flex-basis:28px}
  .expense-detail-date strong{font-size:16px}
  .expense-detail-identity .amount{font-size:23px}
  .expense-detail-payer{padding-left:14px}
  .expense-detail-payer>span{display:block}
  .expense-detail-person{flex-direction:column;gap:4px}
  .expense-detail-person strong{max-width:80px;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .expense-detail-card{padding:14px;border-radius:14px}
  .expense-detail-proof-section{margin-top:12px}
}


/* Situações financeiras — V1.6.7 */
.expense-status{
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  justify-content:center;
  gap:3px;
  min-width:118px;
  padding:0;
  border-radius:0;
  background:transparent!important;
  text-align:right;
}
.expense-status-label{
  font-size:12px;
  line-height:1.2;
  font-weight:600;
  letter-spacing:0;
  text-transform:none;
}
.expense-status-value{
  font-family:'Inter',sans-serif;
  font-size:18px;
  line-height:1.15;
  font-weight:800;
  white-space:nowrap;
}
.expense-status.is-receivable,
.expense-status.is-receivable .expense-status-value{color:var(--positive)}
.expense-status.is-payable,
.expense-status.is-payable .expense-status-value{color:var(--negative)}
.expense-status.is-neutral{color:var(--ink-secondary)}
.event-financial-label{
  margin-top:7px;
  font-size:14px;
  line-height:1.3;
  font-weight:500;
}
.event-financial-label.is-receivable{color:var(--positive)}
.event-financial-label.is-payable{color:var(--negative)}
.event-financial-label.is-neutral{color:var(--ink-secondary)}

@media(max-width:720px){
  .expense-status{min-width:94px;max-width:110px}
  .expense-status-value{font-size:16px}
  .expense-status-label{font-size:11px}
}


/* V1.6.9 — detalhe de despesa e ações rápidas */
.expense-detail-actions{display:flex;align-items:center;gap:8px;flex:0 0 auto}
.btn-danger-soft{background:color-mix(in srgb,var(--negative) 8%,var(--surface));border:1px solid color-mix(in srgb,var(--negative) 24%,var(--border));color:var(--negative)}
.btn-danger-soft:hover{background:color-mix(in srgb,var(--negative) 14%,var(--surface));border-color:color-mix(in srgb,var(--negative) 42%,var(--border))}
.expense-detail-summary-head{display:flex;align-items:center;gap:10px;margin-bottom:2px}
.expense-state-badge{display:inline-flex;align-items:center;min-height:24px;padding:3px 9px;border-radius:999px;font-size:10px;font-weight:800;letter-spacing:.035em;text-transform:uppercase}
.expense-state-badge.is-active{color:#9a5a00;background:rgba(245,158,11,.12);border:1px solid rgba(245,158,11,.24)}
.expense-state-badge.is-settled{color:var(--positive);background:color-mix(in srgb,var(--positive) 10%,transparent);border:1px solid color-mix(in srgb,var(--positive) 24%,transparent)}
.expense-row-actions{display:flex;align-items:center;gap:5px;opacity:.72;transition:opacity .18s ease}
.expense-row:hover .expense-row-actions{opacity:1}
.expense-row-action{width:32px;height:32px;display:inline-flex;align-items:center;justify-content:center;border-radius:9px;border:1px solid var(--border);background:var(--surface);color:var(--ink-secondary);cursor:pointer;padding:0}
.expense-row-action:hover{color:var(--accent2);border-color:color-mix(in srgb,var(--accent2) 35%,var(--border));background:color-mix(in srgb,var(--accent2) 7%,var(--surface))}
.expense-row-action.is-delete:hover{color:var(--negative);border-color:color-mix(in srgb,var(--negative) 35%,var(--border));background:color-mix(in srgb,var(--negative) 7%,var(--surface))}
.expense-split-row{display:grid!important;grid-template-columns:34px minmax(0,1fr) minmax(92px,auto) 82px;gap:10px;align-items:center;padding:9px 10px!important}
.expense-split-row .participant-name{display:flex;flex-direction:column;gap:2px}
.expense-split-row .participant-name strong{font-size:13px}
.expense-split-row .participant-name small{font-size:10.5px;color:var(--ink-faint);font-weight:500}
.expense-split-value{font-size:13px;font-weight:750;color:var(--ink);white-space:nowrap;text-align:right}
.split-payment-status{min-width:72px;text-align:center;padding:5px 8px;border-radius:999px;font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.035em}
.split-payment-status.is-paid{color:var(--positive);background:color-mix(in srgb,var(--positive) 10%,transparent)}
.split-payment-status.is-pending{color:var(--negative);background:color-mix(in srgb,var(--negative) 9%,transparent)}
@media(max-width:760px){
  .expense-detail-actions .btn{width:40px;padding:0;min-height:40px}
  .expense-detail-actions .btn span{display:none}
  .expense-row-actions{display:none}
  .expense-split-row{grid-template-columns:32px minmax(0,1fr) auto}
  .expense-split-value{grid-column:2;text-align:left}
  .split-payment-status{grid-column:3;grid-row:1 / span 2}
}


/* V1.6.9 — status no extrato e unificação de saldo + rateio */
.expense-name-line{display:flex;align-items:center;gap:8px;min-width:0}
.expense-name-line .name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.expense-name-line .expense-state-badge{flex:0 0 auto;min-height:20px;padding:2px 7px;font-size:9px}
.expense-detail-allocation-section{margin-top:0}
.expense-allocation-head{display:flex;align-items:center;justify-content:space-between;gap:18px}
.expense-allocation-summary{display:flex;flex-direction:column;align-items:flex-end;justify-content:center;min-width:118px;padding:8px 12px;border-radius:12px;background:var(--surface-2)}
.expense-allocation-summary span{font-size:10px;font-weight:750;text-transform:uppercase;letter-spacing:.04em;color:var(--ink-faint)}
.expense-allocation-summary strong{font-size:19px;line-height:1.15;margin-top:2px}
.expense-allocation-summary.is-receivable strong,.expense-allocation-summary.is-receivable span{color:var(--positive)}
.expense-allocation-summary.is-payable strong,.expense-allocation-summary.is-payable span{color:var(--negative)}
.expense-allocation-summary.is-neutral{color:var(--ink-secondary)}
.expense-split-row.is-current-user{background:color-mix(in srgb,var(--accent2) 5%,var(--surface));border-radius:10px}
@media(max-width:760px){
  .expense-name-line{align-items:flex-start;flex-direction:column;gap:4px}
  .expense-allocation-head{align-items:flex-start}
  .expense-allocation-summary{min-width:100px;padding:7px 9px}
  .expense-allocation-summary strong{font-size:16px}
}


/* V1.7.0 — criação rápida de despesas e participantes */
.global-expense-fab{position:fixed;left:50%;bottom:32px;transform:translateX(-50%);z-index:50;display:inline-flex;align-items:center;justify-content:center;gap:9px;height:52px;padding:0 20px;border:0;border-radius:16px;background:var(--accent2);color:#fff;font:800 14px 'Inter',sans-serif;box-shadow:0 14px 34px rgba(0,50,255,.28);cursor:pointer;transition:transform .18s ease,box-shadow .18s ease}
.global-expense-fab:hover{transform:translate(-50%,-2px);box-shadow:0 18px 42px rgba(0,50,255,.34)}
.global-expense-fab .icon{stroke:#fff}

/* Seleção múltipla no Histórico, para apagar vários eventos de uma vez */
.btn-danger{background:var(--negative);color:#fff;border:0}
.btn-danger:hover{background:color-mix(in srgb,var(--negative) 82%,black)}
.btn-danger .icon{stroke:#fff}
.text-action.is-active{color:var(--negative)}
.history-selection-bar{position:fixed;left:50%;bottom:32px;transform:translateX(-50%);z-index:50;display:inline-flex;align-items:center;gap:14px;height:52px;padding:0 10px 0 20px;border-radius:16px;background:var(--surface-solid);border:1px solid var(--border);box-shadow:var(--shadow)}
.history-selection-bar span{font-size:13px;font-weight:700;color:var(--ink-secondary);white-space:nowrap}
.history-selection-bar .btn{min-height:38px;padding:0 16px;border-radius:11px}
.history-event-card{position:relative}
.history-event-card .history-select-check{position:absolute;top:12px;right:12px;width:22px;height:22px;border-radius:50%;border:2px solid var(--border);background:var(--surface-solid);align-items:center;justify-content:center;color:#fff;display:none}
.history-event-card .history-select-check .icon{width:13px;height:13px;stroke:#fff;stroke-width:3}
.history-event-card.selecting{padding-right:44px}
.history-event-card.selecting .history-select-check{display:flex}
.history-event-card.selected{outline:2px solid var(--accent2);outline-offset:-2px}
.history-event-card.selected .history-select-check{background:var(--accent2);border-color:var(--accent2)}
.history-event-card.not-selectable{opacity:.55}
.expense-event-selector{padding:16px;border:1px solid var(--border);border-radius:14px;background:var(--surface-alt);margin-bottom:18px}
.expense-event-selector .field-label{margin-top:0}
.expense-event-select-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:center}
.expense-create-event-btn{white-space:nowrap}
.create-participants-card{margin-top:22px;padding:18px;border:1px solid var(--border);border-radius:16px;background:var(--surface)}
.create-participants-head{display:flex;justify-content:space-between;align-items:flex-start;gap:18px;margin-bottom:14px}
.create-participants-head h3{font-size:17px;margin:0 0 3px}.create-participants-head p{font-size:12px;color:var(--ink-secondary);margin:0}
.participant-count-badge{white-space:nowrap;padding:6px 9px;border-radius:999px;background:var(--surface-alt);color:var(--ink-secondary);font-size:11px;font-weight:800}
.invite-methods{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:10px}
.invite-method{min-height:34px;padding:0 12px;border:1px solid var(--border);border-radius:10px;background:var(--surface);font-weight:700;font-size:12px;color:var(--ink-secondary);cursor:pointer}
.invite-method.active{color:var(--accent2);border-color:var(--accent2);box-shadow:0 0 0 2px color-mix(in srgb,var(--accent2) 12%,transparent)}
.invite-entry-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:9px}.invite-entry-row .btn{white-space:nowrap}
.new-event-participant-list{display:flex;flex-direction:column;gap:7px;margin-top:12px}
.new-event-participant-item{display:grid;grid-template-columns:34px minmax(0,1fr) auto;gap:10px;align-items:center;padding:9px 10px;border:1px solid var(--border);border-radius:11px;background:var(--surface-alt)}
.new-event-participant-item strong{font-size:13px}.new-event-participant-item small{display:block;color:var(--ink-faint);font-size:10.5px;margin-top:2px}
.remove-new-participant{width:30px;height:30px;border:0;border-radius:8px;background:transparent;color:var(--ink-faint);cursor:pointer}.remove-new-participant:hover{background:color-mix(in srgb,var(--negative) 8%,transparent);color:var(--negative)}
@media(max-width:720px){.expense-event-select-row,.invite-entry-row{grid-template-columns:1fr}.create-participants-head{flex-direction:column;gap:8px}.participant-count-badge{align-self:flex-start}}


/* V1.7.1 — resumo e visão consolidada de dívidas */
.event-summary-debts,.debts-overview{margin-top:18px;background:var(--surface);border:1px solid var(--border);border-radius:18px;padding:18px;overflow:visible}
.summary-section-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:14px}
.summary-section-head .section-title{margin:0 0 4px}.summary-section-head p{margin:0;color:var(--ink-muted);font-size:13px;line-height:1.45}.btn-compact{min-height:36px;height:36px;padding:0 14px;white-space:nowrap}
.summary-debt-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.summary-debt-column{border:1px solid var(--border);border-radius:14px;overflow:hidden;background:var(--surface-soft)}
.summary-debt-column-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px;border-bottom:1px solid var(--border)}.summary-debt-column-head span{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--ink-muted)}.summary-debt-column-head strong{font-size:20px}.summary-debt-column.payable .summary-debt-column-head strong{color:var(--negative)}.summary-debt-column.receivable .summary-debt-column-head strong{color:var(--positive)}
.summary-debt-items{padding:4px 10px 10px}.summary-debt-item{width:100%;border:0;background:transparent;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 4px;text-align:left;color:var(--ink);cursor:pointer;border-bottom:1px solid var(--border)}.summary-debt-item:last-child{border-bottom:0}.summary-debt-item:hover{background:var(--surface);border-radius:9px}.summary-debt-item span{font-size:13px}.summary-debt-item strong{font-size:14px}.summary-debt-empty{padding:12px 4px;color:var(--ink-muted);font-size:13px}
.summary-group-debt-list{grid-column:1/-1}.summary-group-debt-list .summary-debt-items{padding-top:10px}.summary-group-debt-list .summary-debt-item{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center}.summary-group-debt-list .summary-debt-item:disabled{cursor:default}.summary-group-debt-list .summary-debt-item:disabled:hover{background:transparent}.summary-group-debt-copy{display:flex;align-items:center;gap:9px;min-width:0}.summary-group-debt-dot{width:9px;height:9px;flex:0 0 9px;border-radius:50%;box-shadow:0 0 0 4px color-mix(in srgb,currentColor 8%,transparent)}.summary-group-debt-value{padding:4px 9px;border-radius:999px;background:color-mix(in srgb,var(--accent2) 12%,transparent);color:var(--accent2);white-space:nowrap}
.debt-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:14px}.debt-kpis article{border:1px solid var(--border);border-radius:14px;padding:14px;background:var(--surface-soft)}.debt-kpis span{display:block;color:var(--ink-muted);font-size:12px;margin-bottom:5px}.debt-kpis strong{font-size:20px}.negative{color:var(--negative)!important}.positive{color:var(--positive)!important}
.participant-debt-list{display:grid;gap:8px}.participant-debt-row{display:grid;grid-template-columns:auto minmax(0,1fr) minmax(88px,auto);align-items:center;gap:12px;padding:12px;border:1px solid var(--border);border-radius:14px;background:var(--surface)}.participant-debt-row.is-you{border-color:color-mix(in srgb,var(--accent2) 45%,var(--border));background:color-mix(in srgb,var(--accent2) 5%,var(--surface))}.participant-debt-row .avatar{margin:0;width:36px;height:36px;font-size:12px}.participant-debt-name{display:flex;align-items:center;gap:7px;font-weight:700}.participant-debt-name small{font-size:10px;padding:2px 6px;border-radius:99px;background:var(--accent-soft);color:var(--accent2)}.participant-debt-relations{display:flex;flex-wrap:wrap;gap:5px 12px;margin-top:4px}.debt-relation{font-size:12px;color:var(--ink-muted)}.debt-relation.payable{color:var(--negative)}.debt-relation.receivable{color:var(--positive)}.debt-relation.neutral{color:var(--ink-muted)}
/* Valor sempre em cima, situação (A pagar/A receber) embaixo, alinhado à
   direita — igual em qualquer largura de tela, sem virar linha única. */
.participant-debt-balance{display:flex;flex-direction:column;align-items:flex-end;gap:2px;text-align:right}
.participant-debt-balance strong{display:block;font-size:18px}
.participant-debt-balance small{display:block;font-size:11px;color:var(--ink-muted)}
.participant-debt-balance.neutral strong{color:var(--ink)}
.debt-details-title{margin-top:20px}
/* O avatar de quem realmente paga (a raiz) fica sempre por cima dos
   avatares dos vinculados, e nenhum deles é reduzido de tamanho. */
.participant-debt-avatars{display:flex}
.participant-debt-avatars .avatar{position:relative;z-index:1;width:36px;height:36px;font-size:12px;border:2px solid var(--surface);margin-left:-12px}
.participant-debt-avatars .avatar:first-child{margin-left:0;z-index:2}
.participant-debt-avatars .avatar-more{background:var(--surface-alt);color:var(--ink-secondary);border:2px solid var(--surface)}
.participant-debt-linked-names{font-weight:500;color:var(--ink-secondary)}
@media(max-width:760px){.summary-debt-grid,.debt-kpis{grid-template-columns:1fr}.summary-section-head{align-items:center}.participant-debt-balance strong{font-size:16px}}


/* V1.7.2 — ação para adicionar participantes dentro do evento */
.event-header-actions{display:flex;align-items:center;gap:10px;flex:0 0 auto}
.event-add-participant{min-height:44px;padding:0 18px;border-radius:12px;white-space:nowrap}
.add-participants-content{max-width:880px;margin:0 auto;width:100%}
.current-participants-preview{margin-top:18px;background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:18px}
.current-participants-preview .participant-row{cursor:default}

/* No desktop, mantém os três botões originais. No mobile (≤720px), esconde
   os botões e mostra a engrenagem — ver responsive-mobile.css. */
.event-header-buttons{display:flex;align-items:center;gap:10px}
.event-actions-menu-wrap{display:none;position:relative}
.event-actions-toggle[aria-expanded="true"]{background:var(--surface-alt);border-color:var(--accent2)}
.event-actions-menu{position:absolute;top:calc(100% + 8px);right:0;z-index:40;min-width:220px;padding:6px;border:1px solid var(--border);border-radius:14px;background:var(--surface-solid);box-shadow:0 12px 32px rgba(20,18,55,.14);display:flex;flex-direction:column;gap:2px}
.event-actions-menu[hidden]{display:none!important}
.event-actions-menu button{display:flex;align-items:center;gap:10px;width:100%;padding:10px 12px;border:0;border-radius:10px;background:transparent;color:var(--ink);font:inherit;font-size:13.5px;font-weight:600;text-align:left;cursor:pointer}
.event-actions-menu button:hover{background:var(--surface-alt)}
.event-actions-menu .event-actions-finish{color:var(--accent2)}


/* V1.7.3 — diretório de participantes */
.participants-directory-content{padding-top:28px}
.participants-directory-panel{background:var(--surface);border:1px solid var(--border);border-radius:22px;padding:24px;box-shadow:var(--shadow-sm)}
.participants-directory-head{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:22px}
.participants-directory-head h2{margin:0 0 4px;font-size:22px}.participants-directory-head p{margin:0;color:var(--muted)}
.participants-search-wrap{min-width:290px;height:44px;display:flex;align-items:center;gap:9px;padding:0 14px;border:1px solid var(--border);border-radius:13px;background:var(--surface-alt)}
.participants-search-wrap input{width:100%;border:0;outline:0;background:transparent;color:var(--ink);font:600 13px 'Inter',sans-serif}
.participants-directory-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.participant-directory-card{display:flex;align-items:center;gap:13px;padding:16px;border:1px solid var(--border);border-radius:16px;background:var(--surface-alt)}
.participant-directory-avatar{width:44px;height:44px;flex:0 0 44px;margin:0}.participant-directory-info{min-width:0;display:flex;flex-direction:column;gap:3px}.participant-directory-info strong{font-size:14px}.participant-directory-info span,.participant-directory-info small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--muted);font-size:12px}
.participant-directory-action{margin-left:auto;width:36px;height:36px;border:1px solid var(--border);border-radius:11px;background:var(--surface);color:var(--accent2);display:grid;place-items:center;cursor:pointer}
.participants-directory-empty{text-align:center;padding:48px 20px;color:var(--muted)}.participants-directory-empty h3{color:var(--ink);margin:12px 0 4px}.participants-directory-empty p{margin:0}
@media(max-width:760px){.participants-directory-head{align-items:stretch;flex-direction:column}.participants-search-wrap{min-width:0}.participants-directory-grid{grid-template-columns:1fr}.participants-directory-panel{padding:16px;border-radius:16px}}

/* V1.7.4 — resumo financeiro por participante */
/* Acertos já quitados continuam na lista, apagados e marcados — é por eles
   que se volta ao detalhe da dívida para desfazer a quitação. */
.debt-settled-tag{margin-left:8px;font-size:11px;font-weight:700;color:var(--positive);white-space:nowrap}
.summary-debt-item.is-settled,.participant-finance-relation.is-settled{opacity:.6}
.summary-debt-item.is-settled .summary-group-debt-value,.participant-finance-relation.is-settled .participant-finance-relation-value strong{text-decoration:line-through}
.participant-finance-relation-value.settled strong{color:var(--ink-muted)}
.participant-debt-row{cursor:pointer;transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease}.participant-debt-row:hover{border-color:color-mix(in srgb,var(--accent2) 45%,var(--border));box-shadow:0 8px 24px rgba(23,30,50,.08);transform:translateY(-1px)}.participant-debt-name-button{appearance:none;border:0;background:none;padding:0;color:inherit;font:inherit;font-weight:700;cursor:pointer;text-align:left;display:inline-flex;align-items:center;gap:7px}.participant-debt-name-button:hover{text-decoration:underline}.participant-finance-hero{display:grid;grid-template-columns:56px minmax(0,1fr) minmax(130px,auto);align-items:center;gap:16px;padding:20px;border:1px solid var(--border);border-radius:18px;background:var(--surface);margin-top:16px}.participant-finance-hero .avatar{width:52px;height:52px;margin:0;font-size:18px}.participant-finance-hero span,.participant-finance-hero p{color:var(--ink-muted);font-size:12px}.participant-finance-hero h2{margin:2px 0 4px;font-size:22px}.participant-finance-hero p{margin:0}.participant-finance-net{text-align:right}.participant-finance-net span,.participant-finance-net small{display:block;font-size:11px;color:var(--ink-muted)}.participant-finance-net strong{display:block;font-size:22px;margin:2px 0}.participant-finance-net.positive strong{color:var(--positive)}.participant-finance-net.negative strong{color:var(--negative)}.participant-finance-kpis{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:14px 0}.participant-finance-kpis article{padding:16px;border:1px solid var(--border);border-radius:14px;background:var(--surface)}.participant-finance-kpis span{display:block;font-size:12px;color:var(--ink-muted);margin-bottom:4px}.participant-finance-kpis strong{font-size:20px}.participant-finance-panel{padding:18px;border:1px solid var(--border);border-radius:18px;background:var(--surface)}.participant-finance-panel-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:12px}.participant-finance-panel-head h3{margin:0 0 3px}.participant-finance-panel-head p{margin:0;font-size:12px;color:var(--ink-muted)}.participant-finance-panel-head>span{font-size:11px;color:var(--ink-muted);white-space:nowrap}.participant-finance-relations-list{display:grid;gap:9px}.participant-finance-relation{width:100%;display:grid;grid-template-columns:42px minmax(0,1fr) auto 20px;align-items:center;gap:12px;padding:12px;border:1px solid var(--border);border-radius:14px;background:var(--surface);color:inherit;text-align:left;cursor:pointer}.participant-finance-relation:hover{border-color:color-mix(in srgb,var(--accent2) 45%,var(--border));background:color-mix(in srgb,var(--accent2) 3%,var(--surface))}.participant-finance-relation .avatar{width:38px;height:38px;margin:0;font-size:12px;grid-column:1;grid-row:1}.participant-finance-relation-copy{grid-column:2;grid-row:1;min-width:0}.participant-finance-relation>.icon{grid-column:4;grid-row:1;justify-self:end;align-self:center;stroke:var(--ink-faint)}.participant-finance-relation-copy strong,.participant-finance-relation-copy small{display:block}.participant-finance-relation-copy small{margin-top:3px;color:var(--ink-muted);font-size:11px}.participant-finance-relation-value{grid-column:3;grid-row:1;text-align:right}.participant-finance-relation-value span{display:block;font-size:10px;color:var(--ink-muted)}.participant-finance-relation-value strong{font-size:16px}.participant-finance-relation-value.payable strong{color:var(--negative)}.participant-finance-relation-value.receivable strong{color:var(--positive)}
@media(max-width:700px){.participant-finance-hero{grid-template-columns:48px minmax(0,1fr)}.participant-finance-net{grid-column:2;text-align:left}.participant-finance-kpis{grid-template-columns:1fr}.participant-finance-relation{grid-template-columns:38px minmax(0,1fr) 16px;align-items:start;gap:10px}.participant-finance-relation .avatar{align-self:center}.participant-finance-relation-value{grid-column:2;grid-row:2;margin-top:4px;text-align:left;display:flex;gap:6px;align-items:baseline}.participant-finance-relation>.icon{grid-column:3;grid-row:1 / span 2;align-self:center}.participant-finance-panel-head{display:block}.participant-finance-panel-head>span{display:block;margin-top:8px}}
.participant-finance-hero{margin-bottom:14px}
.participant-finance-panel{margin-bottom:14px}


/* V1.7.5 — nova organização do extrato de despesas */
.expense-row{grid-template-columns:42px 44px minmax(180px,1fr) 92px 130px minmax(125px,.62fr) 112px;gap:10px}
.expense-state-column{display:flex;align-items:center;justify-content:center;min-width:0}
.expense-total-column{border:0;padding:0;text-align:right}
.expense-total-column .expense-val{text-align:right}
.expense-status-column{justify-content:flex-end}
.expense-status{display:flex;flex-direction:column;align-items:flex-end;background:transparent!important;padding:0;text-align:right}
.expense-status-value{font-size:14px;margin-top:2px}
.expense-actions-column{display:flex;align-items:center;justify-content:flex-end;gap:5px}
.expense-allocation-head-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:flex-end}
.expense-split-edit-btn{flex:0 0 auto;min-height:38px;padding:0 12px;border-radius:10px}
.expense-edit-split-section{margin-top:18px;padding:14px;border:1px solid var(--border);border-radius:14px;background:var(--surface-2)}
.expense-edit-split-section .field-label{margin-top:0}
.expense-edit-split-note{margin:3px 0 12px;max-width:680px}
#screen-despesa-editar.editing-split .expense-edit-split-section{border-color:color-mix(in srgb,var(--accent2) 44%,var(--border));box-shadow:0 0 0 3px color-mix(in srgb,var(--accent2) 9%,transparent)}
#screen-despesa-editar>.topbar,
#screen-despesa-editar>.expense-edit-content,
#screen-despesa-editar>.action-bar{width:min(100%,1120px);margin-left:auto;margin-right:auto}
#screen-despesa-editar>.expense-edit-content{flex:none;padding:24px;background:var(--surface);border:1px solid var(--border);border-radius:16px;box-shadow:0 8px 24px rgba(22,27,45,.045)}
.expense-edit-main-grid{display:grid;grid-template-columns:minmax(0,2fr) minmax(220px,.72fr);gap:20px;align-items:end}
.expense-edit-field{display:grid;gap:8px;min-width:0}
.expense-edit-field .field-label,.expense-edit-payer-section>.field-label{margin:0}
.expense-edit-name-control{display:grid;grid-template-columns:46px minmax(0,1fr);gap:10px;align-items:center}
.expense-edit-icon{width:46px;height:46px;margin:0}
.expense-edit-name-control .input{width:100%}
.expense-edit-value-field .input{width:100%;font-size:22px;font-weight:700}
.expense-edit-payer-section{margin-top:22px}
.expense-edit-payer-section .avatar-select-row{margin-top:10px}
#screen-despesa-editar>.action-bar{padding-top:14px}
@media(max-width:980px){
  .expense-row{grid-template-columns:34px 40px minmax(145px,1fr) 82px 112px minmax(110px,.6fr) 76px;gap:8px}
  .expense-actions-column .expense-chevron{display:none}
}
@media(max-width:760px){
  #screen-despesa-editar>.expense-edit-content{padding:16px;border-radius:14px}
  .expense-edit-main-grid{grid-template-columns:1fr;gap:18px}
  .expense-edit-payer-section{margin-top:18px}
  .expense-row{grid-template-columns:28px 38px minmax(0,1fr) auto;grid-template-rows:auto auto auto;align-items:start;padding:14px 0}
  .expense-date{grid-column:1;grid-row:1 / span 2}
  .expense-row .expense-tile{grid-column:2;grid-row:1 / span 2}
  .expense-mid{grid-column:3;grid-row:1}
  .expense-state-column{grid-column:4;grid-row:1;justify-content:flex-end}
  .expense-total-column{grid-column:3;grid-row:2;text-align:left;padding-top:5px}
  .expense-total-column .expense-val{text-align:left}
  .expense-total-column .expense-val::before{content:'Total gasto · ';font-size:10px;font-weight:700;color:var(--ink-faint);text-transform:uppercase;letter-spacing:.035em}
  .expense-status-column{grid-column:3;grid-row:3;justify-content:flex-start;padding-top:7px}
  .expense-status{align-items:flex-start;text-align:left;flex-direction:row;gap:6px}
  .expense-status-value{margin:0}
  .expense-actions-column{grid-column:4;grid-row:2 / span 2;align-self:end}
  .expense-actions-column .expense-row-action{display:none}
  .expense-actions-column .expense-chevron{display:block}
  .expense-allocation-head-actions{width:100%;justify-content:space-between}
}
@media(max-width:520px){
  .expense-split-edit-btn span{display:none}
  .expense-split-edit-btn{width:38px;padding:0;justify-content:center}
  .expense-allocation-summary{margin-left:auto}
}


/* V1.7.6 — formulário contextual e compacto de nova despesa */
.currency-input{font-size:22px;font-weight:750;letter-spacing:-.01em}
.expense-date-compact{display:flex;align-items:center;justify-content:space-between;gap:18px;margin:16px 0;padding:12px 14px;border:1px solid var(--border);border-radius:14px;background:var(--surface-alt)}
.expense-date-copy{display:flex;align-items:center;gap:10px;min-width:0}
.expense-date-copy>div{display:flex;flex-direction:column;gap:2px}
.expense-date-copy strong{font-size:14px;color:var(--ink)}
.expense-date-copy span{font-size:12px;color:var(--ink-secondary)}
.expense-date-compact .date-input{width:170px;min-height:42px;padding:8px 10px}
@media(max-width:560px){.expense-date-compact{gap:10px}.expense-date-compact .date-input{width:150px}.currency-input{font-size:20px}}

/* V1.7.7 — criação de evento mais compacta e participantes opcionais */
.compact-cover-upload{display:flex;align-items:center;gap:10px;width:100%;max-width:430px;padding:10px 12px;margin-bottom:18px;border:1px dashed var(--border);border-radius:12px;background:var(--surface);cursor:pointer;transition:.2s ease}
.compact-cover-upload:hover{border-color:var(--primary);background:var(--surface-alt)}
.compact-cover-icon{width:32px;height:32px;border-radius:9px;display:grid;place-items:center;background:var(--surface-alt);color:var(--primary);flex:0 0 auto}
.compact-cover-copy{display:flex;flex-direction:column;min-width:0;line-height:1.2}.compact-cover-copy strong{font-size:13px}.compact-cover-copy small{font-size:11px;color:var(--muted);margin-top:3px}
.compact-cover-action{margin-left:auto;font-size:12px;font-weight:700;color:var(--primary)}
.compact-cover-upload.has-image{background-size:cover;background-position:center;color:#fff;min-height:62px;position:relative;overflow:hidden}
.compact-cover-upload.has-image:before{content:"";position:absolute;inset:0;background:rgba(0,0,0,.48)}.compact-cover-upload.has-image>*{position:relative;z-index:1}.compact-cover-upload.has-image .compact-cover-copy small,.compact-cover-upload.has-image .compact-cover-action{color:#fff}
.optional-label{font-size:10px;text-transform:uppercase;letter-spacing:.06em;background:var(--surface-alt);color:var(--muted);padding:4px 7px;border-radius:999px;vertical-align:middle;margin-left:5px}
.add-participant-trigger{margin-top:12px}.new-event-invite-panel{margin-top:14px;padding-top:14px;border-top:1px solid var(--border)}
.invite-source-title{font-size:12px;font-weight:700;margin-bottom:9px;color:var(--muted)}
.invite-source-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.invite-source-grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.invite-source-grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.invite-source-grid-1{grid-template-columns:minmax(0,1fr)}
.invite-channel-options{display:flex;flex-direction:column;gap:8px;margin-top:14px}
.invite-channel-options .btn{width:100%}
.invite-source-card{border:1px solid var(--border);background:var(--surface);border-radius:12px;padding:11px;text-align:left;cursor:pointer;min-height:72px}.invite-source-card:hover,.invite-source-card.active{border-color:var(--primary);background:var(--surface-alt)}
.invite-source-card strong,.invite-source-card small{display:block}.invite-source-card strong{font-size:13px}.invite-source-card small{font-size:10px;color:var(--muted);margin-top:5px;line-height:1.3}
.invite-form-panel{margin-top:12px;padding:13px;border-radius:12px;background:var(--surface-alt)}
.manual-participant-grid{display:grid;grid-template-columns:1.2fr 1fr 1.2fr;gap:9px}.manual-participant-grid label span{display:block;font-size:11px;font-weight:700;color:var(--muted);margin-bottom:5px}
.manual-participant-grid-full{grid-column:1/-1}
.pt-linked-select{width:auto;max-width:160px;margin-left:auto;min-height:38px;padding:0 10px;font-size:12.5px}
.pt-presence{border-bottom:1px solid var(--border);padding-bottom:14px}
.pt-presence[hidden],.pt-presence-actions[hidden],.pt-presence-all[hidden]{display:none}
.pt-presence-head{border-bottom:none;padding-bottom:10px}
.pt-presence-all{margin-left:auto;background:none;border:none;padding:6px 2px;font:inherit;font-size:12.5px;font-weight:700;color:var(--accent2);cursor:pointer;white-space:nowrap}
.pt-presence-days{gap:6px}
.pt-presence-day{padding:8px 10px;font-size:12.5px;min-height:38px;font-variant-numeric:tabular-nums}
.pt-presence-day:not(.selected){color:var(--ink-faint);text-decoration:line-through;text-decoration-color:var(--border)}
.pt-presence-day:disabled{cursor:default;opacity:.7}
.pt-presence-day:focus-visible,.pt-presence-all:focus-visible{outline:2px solid var(--accent2);outline-offset:2px}
.pt-presence-note{margin-top:10px;font-size:12px}
.pt-presence-actions{display:flex;gap:10px;margin-top:12px}
.pt-presence-actions .btn{flex:1}
.split-mode-section[hidden]{display:none}
.split-mode-hint{margin-top:8px;font-size:12px}
.split-preview{max-width:560px;margin-top:10px;border:1px solid var(--border);border-radius:12px;background:var(--surface);overflow:hidden}
.split-preview:empty{display:none}
.split-preview-row{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:12px;padding:9px 12px;font-size:13px}
.split-preview-row+.split-preview-row{border-top:1px solid var(--border)}
.split-preview-name{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.split-preview-weight{color:var(--ink-secondary);font-size:12px;font-variant-numeric:tabular-nums}
.split-preview-value{font-variant-numeric:tabular-nums;min-width:84px;text-align:right}
.expense-split-explain{margin:0 0 10px;font-size:12.5px}
.expense-split-explain[hidden]{display:none}
.participant-days-field{margin-top:14px}
.participant-days-field[hidden]{display:none}
.participant-days-label{display:block;margin-bottom:8px;font-size:12.5px;font-weight:700;color:var(--ink-secondary)}
.participant-days-field .field-help{margin-top:8px}
.create-participants-toggle.is-locked{opacity:.6}
.create-participants-toggle.is-locked small{color:var(--negative)}
/* Mesmo espaço dos cartões do perfil (18px) acima e abaixo dos botões. */
.profile-actions{display:grid;gap:10px;margin:0 0 18px}
.profile-actions .btn{width:100%;display:inline-flex;align-items:center;justify-content:center;gap:8px}
.expense-category-caption{margin-top:6px;font-size:12px;color:var(--ink-secondary)}
.expense-category-caption strong{color:var(--ink)}
.expense-category-change{background:none;border:none;padding:2px 0;font:inherit;font-weight:700;color:var(--accent2);cursor:pointer}
.expense-category-change:focus-visible{outline:2px solid var(--accent2);outline-offset:2px}
.invite-form-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:10px}
.invite-qr-card{margin-top:14px;padding:16px;border-radius:12px;background:var(--surface);border:1px solid var(--border);text-align:center}
.invite-qr-card svg{width:150px;height:150px;max-width:100%}
.invite-qr-actions{display:flex;justify-content:center;gap:8px;margin-top:10px;flex-wrap:wrap}
.directory-picker-device-fallback{width:100%;margin-top:12px}
.app-toast{position:fixed;left:50%;bottom:32px;transform:translateX(-50%);z-index:1001;width:min(340px,calc(100vw - 32px));padding:14px 16px;border-radius:14px;background:var(--surface-solid);border:1px solid var(--border);box-shadow:var(--shadow)}
.app-toast p{margin:0;font-size:13px;font-weight:700;color:var(--ink)}
.app-toast-link{margin-top:10px;font-size:12px}
.app-toast-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:10px;flex-wrap:wrap}
.app-toast-actions .btn{min-height:36px;padding:0 14px;font-size:12.5px}
.invite-help-link{display:inline-block;margin:2px 0 10px;border:none;background:none;color:var(--primary);font-size:12px;font-weight:700;text-decoration:underline;cursor:pointer;padding:0}
.password-field{position:relative;display:flex;}
.password-field .input{width:100%;padding-right:42px;}
.password-toggle{position:absolute;right:4px;top:50%;transform:translateY(-50%);border:none;background:none;padding:8px;display:flex;align-items:center;justify-content:center;color:var(--ink-secondary);cursor:pointer;}
.password-toggle:hover{color:var(--ink);}
.install-home-modal-icon{width:56px;height:56px;border-radius:16px;display:grid;place-items:center;background:color-mix(in srgb,var(--primary) 14%,transparent);color:var(--primary);margin:0 0 16px;}
.install-home-modal-icon .icon{width:26px;height:26px;}
.install-home-modal-card .welcome-modal-intro{margin-bottom:18px;}
.install-screen-content{padding:16px}
.install-instructions{margin-top:16px;padding:14px;border-radius:12px;background:var(--surface-alt)}
.install-instructions strong{display:block;margin-bottom:6px;font-size:13px}
.install-instructions ol{margin:0;padding-left:18px;font-size:13px;color:var(--muted);line-height:1.6}
.install-instructions .btn{margin-top:12px;width:100%}
/* Dica visual do iOS: no Safari não existe botão de instalar, então o passo a
   passo aponta para o ícone de Compartilhar. Ele oscila na direção da barra
   onde o botão fica (embaixo no iPhone, no topo no iPad). O bloco global de
   prefers-reduced-motion já neutraliza a animação para quem pediu menos
   movimento. */
.install-ios-hint{display:flex;align-items:center;gap:12px;margin:10px 0 12px;padding:11px 12px;border:1px dashed color-mix(in srgb,var(--accent2) 45%,var(--border));border-radius:12px;background:color-mix(in srgb,var(--accent2) 8%,transparent)}
.install-ios-hint p{margin:0;font-size:12.5px;line-height:1.5;color:var(--ink-secondary)}
.install-ios-hint-icon{flex:0 0 38px;width:38px;height:38px;display:grid;place-items:center;border-radius:11px;background:var(--surface);color:var(--accent2);box-shadow:0 6px 16px rgba(20,25,50,.12)}
.install-ios-hint-icon .icon{width:21px;height:21px;stroke:currentColor}
.install-ios-hint.is-bottom .install-ios-hint-icon{animation:install-hint-down 1.7s ease-in-out infinite}
.install-ios-hint.is-top .install-ios-hint-icon{animation:install-hint-up 1.7s ease-in-out infinite}
@keyframes install-hint-down{0%,100%{transform:translateY(0)}50%{transform:translateY(5px)}}
@keyframes install-hint-up{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}
@media(max-width:760px){.invite-source-grid{grid-template-columns:1fr 1fr}.invite-source-grid-1{grid-template-columns:minmax(0,1fr)}.manual-participant-grid{grid-template-columns:1fr}.compact-cover-upload{max-width:none}}

/* Evento — revisão de hierarquia e leitura */
#screen-evento .event-header{
  display:grid;
  grid-template-columns:44px minmax(0,1fr) auto;
  align-items:center;
  gap:14px;
  padding-block:18px;
}
.event-header-kicker{
  display:block;
  margin-bottom:3px;
  color:var(--ink-muted);
  font-size:10px;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
}
#screen-evento .event-header-copy .title{font-size:22px;line-height:1.2}
#screen-evento .event-header-copy .sub{margin-top:4px}
#screen-evento .event-header-actions{
  display:grid;
  grid-template-columns:auto auto auto;
  align-items:center;
  gap:8px;
}
#screen-evento .event-header-buttons .btn{min-height:42px;padding-inline:15px}
#screen-evento .event-header-buttons .btn span{white-space:nowrap}
#screen-evento .event-finish-action{background:var(--ink);box-shadow:none}
#screen-evento.event-readonly .event-header-actions{display:none!important}
body.finished-event-context .expense-detail-edit,
body.finished-event-context .expense-detail-upload,
body.finished-event-context #dx-proof-row .iconbtn,
body.finished-event-context #pt-remove-btn,
body.finished-event-context #dv-action,
body.finished-event-context #dv-undo,
body.finished-event-context #dv-upload{display:none!important}
#screen-evento.event-readonly .event-participants-action{display:none!important}
#screen-evento .event-tabs{margin-top:0;margin-bottom:4px}
#screen-evento>.content{padding-top:18px}

#screen-evento .event-summary-grid{
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
  margin-bottom:16px;
}
#screen-evento .event-financial-status,
#screen-evento .event-total-card{
  min-height:138px;
  padding:18px 20px;
  border-radius:16px;
  box-shadow:0 8px 24px rgba(31,38,74,.055);
}
#screen-evento .event-financial-status .amount{font-size:29px}
#screen-evento .event-total-card>strong{font-size:27px}
#screen-evento .event-total-meta{margin-top:12px;padding-top:11px}

.event-summary-statement,
.event-summary-debts{box-shadow:0 8px 24px rgba(31,38,74,.045)}
.event-statement-head{margin-bottom:12px}
.summary-section-head .section-title{margin:0 0 4px}
.summary-section-head p{max-width:620px}
.expense-list-head{
  display:grid;
  grid-template-columns:42px 44px minmax(180px,1fr) 92px 130px minmax(125px,.62fr) 112px;
  gap:10px;
  align-items:center;
  padding:10px 0 8px;
  border-bottom:1px solid var(--border);
  color:var(--ink-muted);
  font-size:10px;
  font-weight:800;
  letter-spacing:.045em;
  text-transform:uppercase;
}
.expense-list-head span:nth-child(1){grid-column:1}
.expense-list-head span:nth-child(2){grid-column:2 / span 2}
.expense-list-head span:nth-child(3){grid-column:4;text-align:center}
.expense-list-head span:nth-child(4){grid-column:5;text-align:right}
.expense-list-head span:nth-child(5){grid-column:6;text-align:right}
.expense-list-head span:nth-child(6){grid-column:7;text-align:right}
#screen-evento .expense-row{padding:14px 0}
#screen-evento .expense-row:last-child{border-bottom:0}
#screen-evento .expense-mid .name{font-weight:750}
#screen-evento .expense-mid .meta{margin-top:4px}

#screen-evento .summary-debt-grid{gap:10px}
#screen-evento .summary-debt-column{border-radius:13px;background:var(--surface)}
#screen-evento .summary-debt-column-head{padding:13px 14px;background:var(--surface-alt)}
#screen-evento .summary-debt-column-head strong{font-size:18px}
#screen-evento .summary-debt-item{padding:11px 6px}
#screen-evento .summary-debt-item span{color:var(--ink-secondary)}
#screen-evento .summary-debt-item span b{color:var(--ink)}

@media(max-width:980px){
  .expense-list-head{grid-template-columns:34px 40px minmax(145px,1fr) 82px 112px minmax(110px,.6fr) 76px;gap:8px}
}
@media(max-width:760px){
  #screen-evento .event-summary-grid{grid-template-columns:1fr 1fr;gap:9px}
  #screen-evento .event-financial-status,#screen-evento .event-total-card{min-height:122px;padding:15px}
  #screen-evento .event-financial-status .amount,#screen-evento .event-total-card>strong{font-size:22px}
  #screen-evento .event-total-meta{gap:8px;margin-top:10px;padding-top:9px}
  .expense-list-head{display:none}
  #screen-evento .event-summary-statement{padding:15px 15px 3px}
}
@media(max-width:560px){
  #screen-evento .event-header{gap:10px;padding-block:14px}
  #screen-evento .event-header-copy .title{font-size:19px}
  #screen-evento .event-summary-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  #screen-evento .event-financial-status,#screen-evento .event-total-card{padding:13px;min-width:0}
  #screen-evento .event-financial-status .label,#screen-evento .event-total-card>span{font-size:10px}
  #screen-evento .event-financial-status .amount,#screen-evento .event-total-card>strong{font-size:18px;white-space:nowrap}
  #screen-evento .event-financial-label{font-size:12px}
  #screen-evento .event-total-meta{display:grid;gap:3px;font-size:10px}
  .event-statement-head{align-items:flex-start}
  .event-statement-head .btn{padding-inline:10px}
  #screen-evento .summary-debt-grid{grid-template-columns:1fr}
}

/* V1.7.8 — convites e remoção de participantes */
.event-invite-source-grid{margin-top:14px}
.participant-preview-row{display:flex;align-items:center;gap:12px}
.participant-preview-row .participant-name{flex:1;display:flex;flex-direction:column;gap:2px}
.participant-preview-row .participant-name small{font-size:12px;color:var(--muted)}
.remove-participant-inline{display:inline-flex;align-items:center;gap:6px;border:0;background:transparent;color:var(--negative);font-weight:700;cursor:pointer;padding:8px 10px;border-radius:10px}
.remove-participant-inline:hover{background:rgba(220,53,69,.08)}
.event-identity-banner{display:flex;flex-direction:column;gap:10px;padding:14px;margin-bottom:14px;border:1px solid var(--border);border-radius:14px;background:var(--surface-alt)}
.event-identity-banner.is-pending{border-color:var(--accent2)}
.event-identity-banner.is-confirmed{flex-direction:row;align-items:center;justify-content:space-between;gap:10px;padding:8px 10px 8px 14px}
.event-identity-banner.is-confirmed .event-identity-copy strong{font-size:13px;font-weight:600;color:var(--ink-secondary)}
.event-identity-banner.is-confirmed .event-identity-copy small{display:none}
.event-identity-banner.is-confirmed .event-identity-copy{min-width:0;flex:1}
.event-identity-banner.is-confirmed .event-identity-options{flex:0 0 auto}
.event-identity-copy{display:flex;flex-direction:column;gap:4px}
.event-identity-copy strong{font-size:14px}
.event-identity-copy small{font-size:12px;color:var(--muted);line-height:1.4}
.event-identity-options{display:flex;flex-wrap:wrap;gap:8px}
.event-identity-option{display:inline-flex;align-items:center;gap:8px;padding:6px 12px 6px 6px;border:1px solid var(--border);border-radius:999px;background:var(--surface-solid);color:var(--ink);font-weight:700;cursor:pointer}
.event-identity-option .avatar{width:28px;height:28px;font-size:12px}
.event-identity-option.is-mine{border-color:var(--accent2);box-shadow:0 0 0 1px var(--accent2) inset}
.event-identity-option-tag{font-size:11px;color:var(--muted);font-weight:700}
.event-identity-cancel{border:0;background:transparent;color:var(--muted);font-weight:700;font-size:12px;white-space:nowrap;cursor:pointer;padding:6px 10px;border-radius:10px}
.event-identity-cancel:hover{background:var(--surface)}
.group-invite-status{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-top:12px;font-size:13px;color:var(--ink-secondary)}
.group-invite-revoke{border:0;background:transparent;color:var(--accent2);font-weight:700;cursor:pointer;padding:8px 10px;border-radius:10px}
.resend-invite-inline{display:inline-flex;align-items:center;gap:6px;border:0;background:transparent;color:var(--accent2);font-weight:700;cursor:pointer;padding:8px 10px;border-radius:10px}
.resend-invite-inline:hover{background:var(--surface-alt)}
.owner-lock-label{font-size:12px;color:var(--muted);font-weight:700}
@media(max-width:760px){
  .remove-participant-inline span,.resend-invite-inline span{display:none}
  .remove-participant-inline,.resend-invite-inline{padding:10px}
  .event-invite-source-grid .invite-source-card{min-height:92px}
}

/* V1.7.9b — agenda estável de participantes */
.participants-directory-tools{display:flex;align-items:center;gap:10px;min-width:min(620px,58vw)}
.participants-directory-tools .participants-search-wrap{flex:1;min-width:260px}
.participants-add-contact{white-space:nowrap}
.participant-directory-card{align-items:flex-start}
.participant-directory-info{flex:1;padding-top:2px}
.participant-directory-actions{margin-left:auto;display:flex;align-items:center;gap:7px;flex-wrap:wrap;justify-content:flex-end}
.participant-directory-actions button{min-width:36px;height:36px;border:1px solid var(--border);border-radius:10px;background:var(--surface);color:var(--ink-secondary);display:inline-flex;align-items:center;justify-content:center;gap:5px;padding:0 9px;cursor:pointer;font:inherit;font-size:12px}
.participant-directory-actions button:hover{border-color:var(--accent2);color:var(--accent2)}
.participant-directory-actions button.danger:hover{border-color:var(--negative);color:var(--negative)}
.contact-modal{width:min(560px,100%)}
/* O formulário de participante atende os dois fluxos (criar evento e evento já
   criado) e cresce quando mostra o QR do convite e a confirmação. A camada de
   fundo centraliza sem rolar, então sem um teto de altura o cartão passaria da
   tela no celular e o botão de confirmar ficaria fora de alcance. */
#new-event-invite-modal .modal-card{max-height:calc(100vh - 40px);max-height:calc(100dvh - 40px);overflow-y:auto;overscroll-behavior:contain}
#new-event-invite-modal .invite-qr-card{margin-top:16px}
.contact-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.contact-field-full{grid-column:1/-1}
.contact-form-grid select{width:100%;border:1px solid var(--border);border-radius:12px;background:var(--surface);color:var(--ink);padding:12px;font:inherit;outline:none}
.contact-modal-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:20px}
.contact-event-list{display:grid;gap:10px;max-height:52vh;overflow:auto}
.contact-event-option{width:100%;border:1px solid var(--border);border-radius:14px;background:var(--surface-alt);color:var(--ink);padding:14px;display:flex;align-items:center;justify-content:space-between;gap:14px;text-align:left;cursor:pointer;font:inherit}
.contact-event-option span{display:flex;flex-direction:column;gap:3px}.contact-event-option small{color:var(--muted)}
.contact-event-option:hover{border-color:var(--accent2)}.contact-event-empty{text-align:center;padding:24px}
@media(max-width:760px){.participants-directory-tools{width:100%;min-width:0;flex-direction:column;align-items:stretch}.participants-directory-tools .participants-search-wrap{min-width:0}.participants-add-contact{width:100%}.participant-directory-card{flex-wrap:wrap}.participant-directory-info{min-width:calc(100% - 62px)}.participant-directory-actions{width:100%;margin-left:57px;justify-content:flex-start}.contact-form-grid{grid-template-columns:1fr}.contact-field-full{grid-column:auto}.contact-modal-actions{flex-direction:column-reverse}.contact-modal-actions .btn{width:100%}}


/* V1.8.0 — autenticação e primeiro acesso */
body.auth-mode .site-header, body.auth-mode #bottomnav, body.auth-mode .global-expense-fab, body.auth-mode .version-badge{display:none!important;}
body.auth-mode .app-shell{max-width:520px;min-height:100vh;margin:0 auto;border-radius:0;box-shadow:none;}
.auth-screen{min-height:100vh;background:var(--bg);}
.auth-content{max-width:420px;margin:0 auto;padding:34px 24px 44px;}
.auth-content-small{padding-top:30px;}
.auth-brand{margin:14px 0 26px;}
.auth-logo{width:72px;height:72px;object-fit:contain;display:block;margin:0 auto 8px;}
.auth-intro{display:flex;flex-direction:column;gap:5px;margin-bottom:18px;text-align:center;}
.auth-intro strong{font-size:18px;}.auth-intro span{font-size:12.5px;color:var(--ink-secondary);line-height:1.5;}
.auth-btn span{flex:1;text-align:left;}
.auth-topbar{max-width:520px;margin:0 auto;}
.auth-recovery-link{display:block;margin:10px 0 0 auto;padding:0;border:0;background:transparent;color:var(--accent2);font:inherit;font-size:12.5px;font-weight:700;cursor:pointer;}
.auth-recovery-link:hover{text-decoration:underline;}
.auth-recovery-link:focus-visible{outline:2px solid var(--accent2);outline-offset:4px;border-radius:4px;}
.remember-login{display:flex;align-items:flex-start;gap:9px;margin-top:14px;font-size:12.5px;line-height:1.4;color:var(--ink-secondary);cursor:pointer;}
.remember-login a{color:var(--accent2);font-weight:700;text-decoration:none;}
.remember-login a:hover{text-decoration:underline;}

/* V2.2.29 — instalação do aplicativo no desktop */
.install-modal-overlay{z-index:4300;}
.install-app-card{max-width:480px;}
.install-app-body{display:flex;align-items:center;gap:16px;margin:18px 0 22px;padding:16px;border:1px solid var(--border);border-radius:16px;background:var(--surface-alt);}
.install-app-icon{width:58px;height:58px;flex:0 0 58px;border-radius:15px;overflow:hidden;box-shadow:0 8px 22px rgba(0,0,0,.16);}
.install-app-icon img{display:block;width:100%;height:100%;object-fit:cover;}
.install-app-body strong{display:block;font-size:15px;line-height:1.35;}
.install-app-body p{margin:7px 0 0;color:var(--ink-secondary);font-size:12.5px;line-height:1.55;}
.install-app-card>.btn{width:100%;}
.remember-login input{margin-top:2px;accent-color:var(--accent2);}
.auth-test-note{margin-top:18px;padding:10px 12px;border:1px dashed var(--border);border-radius:12px;text-align:center;font-size:11.5px;color:var(--ink-secondary);background:var(--surface-alt);}
.local-visual-test-entry{width:100%;margin-top:10px;border-style:dashed}
.visual-test-banner{position:fixed;right:18px;bottom:18px;z-index:120;display:flex;align-items:center;gap:7px;max-width:min(390px,calc(100vw - 32px));padding:8px 12px;border:1px solid color-mix(in srgb,var(--warning) 45%,var(--border));border-radius:999px;background:color-mix(in srgb,var(--warning) 14%,var(--surface));color:var(--ink);font:700 11px/1.3 'Inter',sans-serif;box-shadow:0 8px 22px rgba(20,25,50,.12)}
.visual-test-banner[hidden]{display:none!important}
body.visual-test-mode .version-badge{display:none}
@media(max-width:720px){.visual-test-banner{right:50%;bottom:calc(138px + env(safe-area-inset-bottom));transform:translateX(50%);white-space:nowrap;font-size:9.5px}}
.welcome-never-show{display:flex;align-items:center;gap:8px;margin:4px 0 14px;font-size:12.5px;color:var(--ink-secondary);cursor:pointer;}
.welcome-never-show input{accent-color:var(--accent2);}
@media (max-width:640px){.auth-content{padding-left:18px;padding-right:18px}.auth-logo{width:64px;height:64px}}


/* V1.8.1 — perfil */
.account-editor-card{max-width:520px}.account-avatar-preview{width:64px;height:64px;border-radius:50%;display:grid;place-items:center;margin:4px auto 18px;background:linear-gradient(135deg,var(--accent1),var(--accent2));color:#fff;font-weight:800;font-size:20px}.account-form-grid{margin-top:0}.account-security-note{margin-top:14px;padding:12px 14px;border-radius:12px;background:var(--surface-soft,#f5f6fa)}.settings-row>.icon:last-child{margin-left:auto;color:var(--ink-secondary)}
.report-issue-textarea{width:100%;resize:vertical;padding:12px}
.report-issue-attach-row{display:flex;align-items:center;gap:10px;margin-top:10px}
.report-issue-file-name{font-size:12.5px;color:var(--ink-secondary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media (max-width:640px){.account-editor-card{width:calc(100% - 24px);margin:auto 12px 12px}.account-form-grid{grid-template-columns:1fr}.account-form-grid .contact-field-full{grid-column:auto}.contact-modal-actions{display:grid;grid-template-columns:1fr 1fr}.contact-modal-actions .btn{width:100%}}

/* V1.8.2 — correções de contraste em perfil e seletores */
.account-security-note{
  color:var(--ink-secondary);
  background:var(--surface-alt);
  border:1px solid var(--border);
  line-height:1.5;
}
#account-editor-modal .modal-head .note{
  color:var(--ink-secondary);
  line-height:1.45;
}
#expense-event-select{
  color:var(--ink);
  background-color:var(--surface-solid);
  color-scheme:light dark;
}
#expense-event-select option,
select.input option,
.contact-form-grid select option{
  color:var(--ink);
  background:var(--surface-solid);
}
:root[data-theme="light"] #expense-event-select,
:root[data-theme="light"] #expense-event-select option,
:root[data-theme="light"] select.input option,
:root[data-theme="light"] .contact-form-grid select option{
  color:#1B1E2B;
  background:#FFFFFF;
}
:root[data-theme="dark"] #expense-event-select,
:root[data-theme="dark"] #expense-event-select option,
:root[data-theme="dark"] select.input option,
:root[data-theme="dark"] .contact-form-grid select option{
  color:#EEEFF7;
  background:#161A2C;
}

/* V2.1.2 — aplicação da nova marca e apresentação responsiva */
.site-logo-set,.auth-logo-set{display:inline-flex;align-items:center;justify-content:center;line-height:0}
.site-logo-light,.auth-logo-light,.welcome-logo-light{display:none}
:root[data-theme="light"] .site-logo-dark,
:root[data-theme="light"] .auth-logo-dark,
:root[data-theme="light"] .welcome-logo-dark{display:none}
:root[data-theme="light"] .site-logo-light,
:root[data-theme="light"] .auth-logo-light,
:root[data-theme="light"] .welcome-logo-light{display:block}
.site-logo-set .site-logo{width:190px;height:auto;max-height:38px;object-fit:contain}
.auth-logo-set{width:100%;max-width:250px;margin:0 auto}
.auth-logo-vertical{display:block;width:100%;height:auto;max-height:205px;object-fit:contain}
.auth-brand{display:flex;justify-content:center;margin:4px 0 22px}

.welcome-modal-overlay{padding:20px;align-items:center;justify-content:center;overflow:hidden}
.welcome-modal-card{
  width:min(760px,100%);
  max-height:min(860px,calc(100dvh - 40px));
  padding:32px;
  overscroll-behavior:contain;
  scrollbar-width:thin;
}
.welcome-modal-brand{
  width:100%;height:auto;min-height:0;margin:0 auto 20px;padding:0;border-radius:0;background:transparent;
  display:flex;justify-content:center;align-items:center;
}
.welcome-logo{width:min(250px,42vw);height:auto;max-height:190px;object-fit:contain}
.welcome-modal-card h1{text-align:center;margin:0 0 12px;font-size:clamp(28px,4vw,40px)}
.welcome-modal-intro{max-width:650px;margin:0 auto;text-align:center;font-size:15px;line-height:1.6}
.welcome-steps{margin:22px 0 18px}
.welcome-never-show{margin:0 0 14px}
.welcome-modal-action{min-height:48px}

@media (min-width:681px) and (max-width:1024px){
  .welcome-modal-card{width:min(680px,calc(100% - 24px));padding:28px;max-height:calc(100dvh - 32px)}
  .welcome-logo{width:210px;max-height:170px}
  .welcome-steps{grid-template-columns:1fr;gap:9px}
  .welcome-step{padding:12px 14px;align-items:center}
  .welcome-step small{font-size:11.5px}
}

@media (max-width:680px){
  .welcome-modal-overlay{padding:0;align-items:flex-end}
  .welcome-modal-card{
    width:100%;max-height:calc(100dvh - max(12px,env(safe-area-inset-top)));
    margin:0;border-radius:22px 22px 0 0;padding:20px 16px calc(16px + env(safe-area-inset-bottom));
  }
  .welcome-modal-close{top:12px;right:12px;width:36px;height:36px;border-radius:11px}
  .welcome-modal-brand{margin-bottom:10px;padding-right:36px;padding-left:36px}
  .welcome-logo{width:min(168px,48vw);max-height:135px}
  .welcome-modal-card h1{font-size:25px;margin-bottom:8px}
  .welcome-modal-intro{font-size:13px;line-height:1.48}
  .welcome-steps{gap:7px;margin:14px 0 12px}
  .welcome-step{padding:10px 11px;border-radius:13px;gap:9px;align-items:center}
  .welcome-step>span{width:25px;height:25px;flex-basis:25px;border-radius:8px;font-size:12px}
  .welcome-step div{gap:2px}
  .welcome-step strong{font-size:12.5px}
  .welcome-step small{font-size:10.5px;line-height:1.3}
  .welcome-never-show{font-size:11px;margin-bottom:10px}
  .welcome-modal-action{min-height:44px}
  .auth-logo-set{max-width:205px}
  .auth-logo-vertical{max-height:170px}
  .auth-content{padding-top:22px}
}

@media (max-width:380px), (max-height:680px){
  .welcome-modal-card{padding-top:14px}
  .welcome-logo{width:135px;max-height:105px}
  .welcome-modal-brand{margin-bottom:6px}
  .welcome-modal-card h1{font-size:22px;margin-bottom:6px}
  .welcome-modal-intro{font-size:11.5px;line-height:1.4}
  .welcome-steps{margin:10px 0 9px;gap:5px}
  .welcome-step{padding:8px 9px}
  .welcome-step small{display:none}
  .welcome-never-show{font-size:10.5px;margin-bottom:8px}
  .welcome-modal-action{min-height:40px}
}
/* Estado final das variantes de marca */
.auth-logo-light,.welcome-logo-light,.site-logo-light{display:none!important}
:root[data-theme="light"] .auth-logo-dark,
:root[data-theme="light"] .welcome-logo-dark,
:root[data-theme="light"] .site-logo-dark{display:none!important}
:root[data-theme="light"] .auth-logo-light,
:root[data-theme="light"] .welcome-logo-light,
:root[data-theme="light"] .site-logo-light{display:block!important}

/* V2.1.3 — botão principal centralizado na apresentação */
.welcome-modal-action{
  width:min(100%,360px);
  margin-left:auto;
  margin-right:auto;
  display:flex;
  align-items:center;
  justify-content:center;
}

@media (max-width:680px){
  .welcome-modal-action{
    width:100%;
  }
}

/* Cabeçalhos contextuais fixos durante a rolagem */
.screen{
  --screen-inline-gutter:28px;
}
@media(max-width:1100px){
  .screen{
    --screen-inline-gutter:20px;
  }
}
.screen:has(>.topbar),
#screen-evento{
  padding-top:12px;
}
.screen.active>.topbar{
  position:sticky;
  top:calc(var(--app-header-height,72px) + 12px);
  z-index:45;
  box-shadow:0 8px 18px color-mix(in srgb,var(--v2-bg) 78%,transparent);
}
.screen.active>.topbar::before{
  content:"";
  position:fixed;
  left:0;
  right:0;
  top:var(--app-header-height,72px);
  height:12px;
  background:var(--v2-bg);
  pointer-events:none;
}
#screen-evento .event-navigation-sticky{
  position:sticky;
  top:calc(var(--app-header-height,72px) + 12px);
  z-index:46;
  padding-bottom:14px;
  background:var(--v2-bg);
}
#screen-evento .event-navigation-sticky::before{
  content:"";
  position:fixed;
  left:0;
  right:0;
  top:var(--app-header-height,72px);
  height:12px;
  background:var(--v2-bg);
  pointer-events:none;
}
#screen-evento .event-navigation-sticky .event-header{
  margin-bottom:12px;
}
#screen-evento .event-navigation-sticky .event-tabs{
  margin-bottom:0;
}

/* Financeiro — saldo principal e totais comparáveis */
#screen-financeiro .finance-summary{
  grid-template-columns:minmax(0,1.25fr) minmax(0,1fr) minmax(0,1fr);
  gap:12px;
}
#screen-financeiro .finance-balance-card{
  grid-column:auto;
}
@media(max-width:900px){
  #screen-financeiro .finance-summary{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  #screen-financeiro .finance-balance-card{grid-column:1/-1}
}

/* Nova despesa — campos e ações compactos */
#screen-despesa #expense-event-selector .expense-event-select-row{
  grid-template-columns:minmax(0,1fr);
}
#screen-despesa>.content,
#screen-plan-tarefa>.content,
#screen-plan-item>.content,
#screen-plan-pagamento>.content{
  flex:none;
  padding:24px;
  border:1px solid var(--border);
  border-radius:16px;
  background:var(--surface);
  box-shadow:0 8px 24px rgba(22,27,45,.045);
}
#screen-despesa>.content>.field-label:first-of-type{
  margin-top:0;
}
#screen-despesa>.action-bar,
#screen-plan-tarefa>.action-bar,
#screen-plan-item>.action-bar,
#screen-plan-pagamento>.action-bar{
  padding-top:14px;
}
#screen-despesa .expense-name-row{
  display:grid;
  grid-template-columns:48px minmax(0,1fr);
  gap:8px;
}
#screen-despesa .expense-selected-icon{
  width:48px;
  height:48px;
  padding:0;
  border:1px solid var(--border);
  cursor:pointer;
}
#screen-despesa .expense-selected-icon:hover,
#screen-despesa .expense-selected-icon[aria-expanded="true"]{
  border-color:var(--accent2);
  color:var(--accent2);
  box-shadow:0 0 0 2px color-mix(in srgb,var(--accent2) 12%,transparent);
}
#screen-despesa .expense-icon-picker,
#screen-plan-item .expense-icon-picker,
#screen-plan-pagamento .expense-icon-picker,
#screen-planejamento .expense-icon-picker{
  display:grid;
  grid-template-columns:repeat(6,minmax(0,1fr));
  gap:7px;
  margin-top:9px;
}
#screen-despesa .expense-icon-picker[hidden],
#screen-plan-item .expense-icon-picker[hidden],
#screen-plan-pagamento .expense-icon-picker[hidden],
#screen-planejamento .expense-icon-picker[hidden]{
  display:none!important;
}
#screen-despesa .expense-icon-option,
#screen-plan-item .expense-icon-option,
#screen-plan-pagamento .expense-icon-option,
#screen-planejamento .expense-icon-option{
  min-width:0;
  min-height:44px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  padding:0 8px;
  border:1px solid var(--border);
  border-radius:11px;
  background:var(--surface-alt);
  color:var(--ink-secondary);
  font:700 11px 'Inter',sans-serif;
  cursor:pointer;
  transition:.16s ease;
}
#screen-despesa .expense-icon-option:hover,
#screen-plan-item .expense-icon-option:hover,
#screen-plan-pagamento .expense-icon-option:hover,
#screen-planejamento .expense-icon-option:hover{
  border-color:color-mix(in srgb,var(--accent2) 45%,var(--border));
  color:var(--ink);
}
#screen-despesa .expense-icon-option.selected,
#screen-plan-item .expense-icon-option.selected,
#screen-plan-pagamento .expense-icon-option.selected,
#screen-planejamento .expense-icon-option.selected{
  border-color:var(--accent2);
  background:color-mix(in srgb,var(--accent2) 11%,var(--surface));
  color:var(--accent2);
  box-shadow:0 0 0 2px color-mix(in srgb,var(--accent2) 12%,transparent);
}
#screen-despesa .expense-icon-option .icon,
#screen-plan-item .expense-icon-option .icon,
#screen-plan-pagamento .expense-icon-option .icon,
#screen-planejamento .expense-icon-option .icon{flex:0 0 auto}
#screen-despesa .expense-value-date-grid,
#screen-plan-tarefa .expense-value-date-grid,
#screen-plan-item .expense-value-date-grid,
#screen-plan-pagamento .expense-value-date-grid,
#screen-planejamento .expense-value-date-grid{
  display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(260px,.85fr);
  gap:12px;
  align-items:end;
}
#screen-despesa .expense-compact-field,
#screen-plan-tarefa .expense-compact-field,
#screen-plan-item .expense-compact-field,
#screen-plan-pagamento .expense-compact-field,
#screen-planejamento .expense-compact-field{
  display:block;
  min-width:0;
}
#screen-despesa .expense-compact-field>.field-label,
#screen-plan-tarefa .expense-compact-field>.field-label,
#screen-plan-item .expense-compact-field>.field-label,
#screen-plan-pagamento .expense-compact-field>.field-label,
#screen-planejamento .expense-compact-field>.field-label{
  display:block;
  margin-bottom:8px;
}
#screen-despesa .expense-compact-field>.input,
#screen-plan-tarefa .expense-compact-field>.input,
#screen-plan-item .expense-compact-field>.input,
#screen-plan-pagamento .expense-compact-field>.input,
#screen-planejamento .expense-compact-field>.input,
#screen-despesa .expense-date-input-wrap,
#screen-plan-tarefa .expense-date-input-wrap,
#screen-plan-item .expense-date-input-wrap,
#screen-plan-pagamento .expense-date-input-wrap,
#screen-planejamento .expense-date-input-wrap{
  min-height:52px;
}
#screen-despesa .expense-date-input-wrap,
#screen-plan-tarefa .expense-date-input-wrap,
#screen-plan-item .expense-date-input-wrap,
#screen-plan-pagamento .expense-date-input-wrap,
#screen-planejamento .expense-date-input-wrap{
  position:relative;
  display:grid;
  grid-template-columns:38px minmax(0,1fr);
  align-items:center;
  border:1px solid var(--border);
  border-radius:14px;
  background:var(--surface-alt);
  overflow:hidden;
}
#screen-despesa .expense-date-icon,
#screen-plan-tarefa .expense-date-icon,
#screen-plan-item .expense-date-icon,
#screen-plan-pagamento .expense-date-icon,
#screen-planejamento .expense-date-icon{
  display:grid;
  place-items:center;
  color:var(--ink-secondary);
}
#screen-despesa .expense-date-input-wrap .date-input,
#screen-plan-tarefa .expense-date-input-wrap .date-input,
#screen-plan-item .expense-date-input-wrap .date-input,
#screen-plan-pagamento .expense-date-input-wrap .date-input,
#screen-planejamento .expense-date-input-wrap .date-input{
  width:100%;
  min-height:50px;
  padding:7px 10px 18px;
  border:0;
  border-radius:0;
  background:transparent;
}
#screen-despesa .expense-date-input-wrap small,
#screen-plan-tarefa .expense-date-input-wrap small,
#screen-plan-item .expense-date-input-wrap small,
#screen-plan-pagamento .expense-date-input-wrap small,
#screen-planejamento .expense-date-input-wrap small{
  position:absolute;
  left:48px;
  bottom:6px;
  color:var(--ink-secondary);
  font-size:10px;
  pointer-events:none;
}
#screen-despesa>.action-bar,
#screen-plan-tarefa>.action-bar,
#screen-plan-item>.action-bar,
#screen-plan-pagamento>.action-bar{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:10px;
}
#screen-despesa>.action-bar .btn,
#screen-plan-tarefa>.action-bar .btn,
#screen-plan-item>.action-bar .btn,
#screen-plan-pagamento>.action-bar .btn{
  width:100%;
  max-width:none;
}

@media(max-width:720px){
  #screen-despesa>.content,
#screen-plan-tarefa>.content,
#screen-plan-item>.content,
#screen-plan-pagamento>.content{
    padding:16px;
    border-radius:14px;
  }
  .screen.active>.topbar{
    top:calc(var(--app-header-height,58px) + 12px);
  }
  #screen-evento .event-navigation-sticky{
    top:calc(var(--app-header-height,58px) + 12px);
    padding-bottom:12px;
  }
  #screen-despesa .expense-value-date-grid,
#screen-plan-tarefa .expense-value-date-grid,
#screen-plan-item .expense-value-date-grid,
#screen-plan-pagamento .expense-value-date-grid,
#screen-planejamento .expense-value-date-grid{
    grid-template-columns:minmax(0,1fr) minmax(150px,.95fr);
    gap:8px;
  }
  /* 12 categorias: no celular, 4 por linha com o nome embaixo do ícone. */
  #screen-despesa .expense-icon-picker,
#screen-plan-item .expense-icon-picker,
#screen-plan-pagamento .expense-icon-picker,
#screen-planejamento .expense-icon-picker{
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:6px;
  }
  #screen-despesa .expense-icon-option,
#screen-plan-item .expense-icon-option,
#screen-plan-pagamento .expense-icon-option,
#screen-planejamento .expense-icon-option{
    min-height:54px;
    padding:6px 2px;
    flex-direction:column;
    gap:4px;
  }
  #screen-despesa .expense-icon-option span,
#screen-plan-item .expense-icon-option span,
#screen-plan-pagamento .expense-icon-option span,
#screen-planejamento .expense-icon-option span{font-size:10.5px;line-height:1.1;text-align:center;overflow-wrap:anywhere}
}


/* V2.1.4 — marca horizontal na apresentação */
.welcome-modal-brand{
  margin-bottom:18px;
}
.welcome-logo{
  width:min(300px,48vw);
  max-height:86px;
  object-fit:contain;
}
@media (min-width:681px) and (max-width:1024px){
  .welcome-logo{width:min(270px,46vw);max-height:78px}
}
@media (max-width:680px){
  .welcome-modal-brand{margin-bottom:10px;padding-left:42px;padding-right:42px}
  .welcome-logo{width:min(220px,62vw);max-height:64px}
}
@media (max-width:380px), (max-height:680px){
  .welcome-logo{width:min(190px,58vw);max-height:54px}
  .welcome-modal-brand{margin-bottom:7px}
}

/* V2.1.5 — apresentação: logo ampliada e alinhamento mobile */
.welcome-modal-brand{
  width:100%;
  display:flex;
  justify-content:center;
  align-items:center;
  padding:0;
}
.welcome-logo{
  display:block;
  width:min(390px,58vw);
  max-width:100%;
  max-height:none;
  height:auto;
  object-fit:contain;
}

@media (min-width:681px) and (max-width:1024px){
  .welcome-logo{
    width:min(340px,54vw);
    max-height:none;
  }
}

@media (max-width:680px){
  .welcome-modal-overlay{
    padding:12px;
    align-items:center;
    justify-content:center;
    overflow:hidden;
  }
  .welcome-modal-card{
    width:min(100%,460px);
    max-height:calc(100dvh - 24px);
    margin:auto;
    padding:22px 16px calc(18px + env(safe-area-inset-bottom));
    border-radius:20px;
    overflow-y:auto;
    overflow-x:hidden;
    box-sizing:border-box;
  }
  .welcome-modal-brand{
    margin:0 auto 12px;
    padding:0 40px;
    box-sizing:border-box;
  }
  .welcome-logo{
    width:min(230px,72vw);
    max-height:none;
  }
  .welcome-modal-card h1,
  .welcome-modal-intro{
    width:100%;
    margin-left:auto;
    margin-right:auto;
    text-align:center;
  }
  .welcome-steps,
  .welcome-never-show,
  .welcome-modal-action{
    width:100%;
    box-sizing:border-box;
  }
  .welcome-step{
    width:100%;
    box-sizing:border-box;
  }
}

@media (max-width:380px), (max-height:680px){
  .welcome-modal-overlay{padding:8px}
  .welcome-modal-card{
    width:100%;
    max-height:calc(100dvh - 16px);
    padding:16px 12px calc(14px + env(safe-area-inset-bottom));
    border-radius:17px;
  }
  .welcome-modal-brand{
    margin-bottom:8px;
    padding:0 34px;
  }
  .welcome-logo{
    width:min(205px,70vw);
    max-height:none;
  }
}

/* V2.1.6 — logo oficial na apresentação, 280 px no desktop */
.welcome-modal-brand{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:center;
}
.welcome-logo{
  width:280px;
  max-width:100%;
  height:auto;
  max-height:none;
  object-fit:contain;
}
@media (min-width:681px) and (max-width:1024px){
  .welcome-logo{width:240px;}
}
@media (max-width:680px){
  .welcome-logo{width:min(200px,72vw);}
}
@media (max-width:380px), (max-height:680px){
  .welcome-logo{width:min(175px,68vw);}
}

/* V2.1.7 — correção de especificidade: largura efetiva da logo na apresentação */
.welcome-modal-brand .welcome-logo{
  width:280px;
  max-width:100%;
  height:auto;
  max-height:none;
  object-fit:contain;
  flex:0 0 auto;
}
@media (min-width:681px) and (max-width:1024px){
  .welcome-modal-brand .welcome-logo{width:240px;}
}
@media (max-width:680px){
  .welcome-modal-brand .welcome-logo{width:min(200px,72vw);}
}
@media (max-width:380px), (max-height:680px){
  .welcome-modal-brand .welcome-logo{width:min(175px,68vw);}
}

/* V2.1.8 — logo horizontal oficial na apresentação: 200 px no desktop */
.welcome-modal-brand .welcome-logo{
  display:block;
  width:200px !important;
  max-width:none !important;
  height:auto !important;
  max-height:none !important;
  object-fit:contain;
  flex:0 0 auto;
}
@media (max-width: 900px){
  .welcome-modal-brand .welcome-logo{width:180px !important;}
}
@media (max-width: 599px){
  .welcome-modal-brand .welcome-logo{width:160px !important;}
}
@media (max-width: 360px), (max-height: 620px){
  .welcome-modal-brand .welcome-logo{width:145px !important;}
}

/* V2.1.9 — correção final de alinhamento da apresentação no mobile */
@media (max-width: 599px){
  .welcome-modal-overlay{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    padding:12px !important;
    box-sizing:border-box !important;
    overflow:hidden !important;
  }

  .welcome-modal-card{
    position:relative !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:flex-start !important;
    width:100% !important;
    max-width:460px !important;
    max-height:calc(100dvh - 24px) !important;
    margin:0 auto !important;
    padding:20px 14px calc(16px + env(safe-area-inset-bottom)) !important;
    border-radius:20px !important;
    box-sizing:border-box !important;
    overflow-x:hidden !important;
    overflow-y:auto !important;
  }

  .welcome-modal-close{
    top:10px !important;
    right:10px !important;
  }

  .welcome-modal-brand{
    width:100% !important;
    margin:0 auto 10px !important;
    padding:0 42px !important;
    display:flex !important;
    justify-content:center !important;
    align-items:center !important;
    box-sizing:border-box !important;
  }

  .welcome-modal-brand .welcome-logo{
    display:block !important;
    width:160px !important;
    max-width:100% !important;
    height:auto !important;
    margin:0 auto !important;
    flex:none !important;
  }

  .welcome-modal-card h1{
    width:100% !important;
    margin:0 auto 8px !important;
    text-align:center !important;
  }

  .welcome-modal-intro{
    width:100% !important;
    max-width:360px !important;
    margin:0 auto !important;
    padding:0 !important;
    text-align:center !important;
    box-sizing:border-box !important;
  }

  .welcome-steps{
    width:100% !important;
    margin:14px auto 10px !important;
    padding:0 !important;
    display:grid !important;
    grid-template-columns:1fr !important;
    box-sizing:border-box !important;
  }

  .welcome-step{
    width:100% !important;
    margin:0 !important;
    box-sizing:border-box !important;
  }

  .welcome-never-show{
    width:100% !important;
    margin:0 auto 10px !important;
    padding:0 2px !important;
    align-self:stretch !important;
    box-sizing:border-box !important;
  }

  .welcome-modal-action,
  .home-new-event-action.welcome-modal-action{
    width:min(100%,220px) !important;
    min-width:0 !important;
    margin:0 auto !important;
    align-self:center !important;
    display:flex !important;
    justify-content:center !important;
    box-sizing:border-box !important;
  }
}

@media (max-width: 360px), (max-height: 620px){
  .welcome-modal-overlay{padding:8px !important;}
  .welcome-modal-card{
    max-height:calc(100dvh - 16px) !important;
    padding:14px 11px calc(12px + env(safe-area-inset-bottom)) !important;
    border-radius:17px !important;
  }
  .welcome-modal-brand{padding:0 38px !important;margin-bottom:7px !important;}
  .welcome-modal-brand .welcome-logo{width:145px !important;}
  .welcome-modal-action,
  .home-new-event-action.welcome-modal-action{width:min(100%,200px) !important;}
}

/* V2.2.0 — correção do modal de apresentação em tablet e mobile
   Mantém QUALQUER modal com esta classe fora do fluxo quando fechado. Antes
   esta regra era só para #welcome-modal — como o popup de instalação
   (#install-home-modal) reaproveitou a mesma classe sem essa correção, ele
   ficava com display:flex forçado (regra `@media(max-width:599px)` acima)
   mesmo fechado, cobrindo a tela inteira e bloqueando todo clique no app no
   mobile. Generalizado por classe para não repetir esse bug em outro modal
   que reaproveite `.welcome-modal-overlay` no futuro. */
.welcome-modal-overlay{
  display:none !important;
  visibility:hidden !important;
  pointer-events:none !important;
  opacity:0 !important;
}
.welcome-modal-overlay.open,
.welcome-modal-overlay[aria-hidden="false"]{
  display:flex !important;
  visibility:visible !important;
  pointer-events:auto !important;
  opacity:1 !important;
}

/* A regra responsiva anterior aplicava display:block nas duas imagens. */
#welcome-modal .welcome-logo-light{
  display:none !important;
}
#welcome-modal .welcome-logo-dark{
  display:block !important;
}
:root[data-theme="light"] #welcome-modal .welcome-logo-dark{
  display:none !important;
}
:root[data-theme="light"] #welcome-modal .welcome-logo-light{
  display:block !important;
}

@media (max-width:599px){
  #welcome-modal.welcome-modal-overlay{
    display:none !important;
  }
  #welcome-modal.welcome-modal-overlay.open,
  #welcome-modal.welcome-modal-overlay[aria-hidden="false"]{
    display:flex !important;
  }
}

/* Evento — visão contínua e despesas simplificadas */
#screen-evento .event-header{
  grid-template-columns:44px minmax(0,1fr) auto;
}
#screen-evento>.content{padding-top:0}
#screen-evento .event-tabs{margin-bottom:16px}
#screen-evento .event-summary-grid{align-items:stretch}
#screen-evento .event-financial-status,
#screen-evento .event-total-card{
  min-height:112px;
  padding-block:16px;
}
#screen-evento .event-total-card>strong{margin-top:2px}
#screen-evento .event-expenses-title{
  display:flex;
  align-items:center;
  gap:8px;
}
#screen-evento .event-expense-count{
  display:inline-grid;
  place-items:center;
  min-width:23px;
  height:23px;
  padding:0 7px;
  border:1px solid var(--border);
  border-radius:999px;
  background:var(--surface-alt);
  color:var(--ink-secondary);
  font:700 11px/1 'Inter',sans-serif;
}
#screen-evento .event-summary-statement>.section-title,
#screen-evento .event-summary-debts .summary-section-head{
  margin:0;
  padding:0 0 12px;
  border-bottom:1px solid var(--border);
}
#screen-evento .event-summary-debts .summary-section-head{display:block}
#screen-evento .expense-row{
  grid-template-columns:42px 44px minmax(0,1fr) minmax(112px,auto);
  gap:12px;
  min-height:76px;
  padding:13px 0;
}
#summary-expense-list .expense-row{grid-template-columns:42px 44px minmax(0,1fr) minmax(112px,auto) 74px}
#summary-expense-list .summary-expense-actions{justify-content:flex-end;opacity:1}
#screen-evento .expense-date{
  width:42px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:1px;
  color:var(--ink-secondary);
  line-height:1;
  text-align:center;
  text-transform:none;
}
#screen-evento .expense-date span{
  font-size:10px;
  font-weight:800;
  letter-spacing:.045em;
  text-transform:uppercase;
}
#screen-evento .expense-date strong{
  margin-top:3px;
  color:var(--ink);
  font:800 17px/1 'Inter',sans-serif;
}
#screen-evento .expense-tile{width:42px;height:42px}
#screen-evento .expense-mid .name{font-size:14px}
#screen-evento .expense-mid .meta{font-size:12px;color:var(--ink-secondary)}
#screen-evento .expense-status-column{justify-content:flex-end}
#screen-evento .expense-status{min-width:105px}
#screen-evento .expense-status-label{font-size:11px}
#screen-evento .expense-status-value{font-size:15px}

@media(max-width:560px){
  #screen-evento .event-header{
    grid-template-columns:42px minmax(0,1fr) auto;
  }
  #screen-evento .event-tabs{margin-bottom:14px}
  #screen-evento .event-financial-status,
  #screen-evento .event-total-card{
    min-height:106px;
    padding-block:13px;
  }
  #screen-evento .summary-debt-grid{
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    gap:8px;
  }
  #screen-evento .summary-debt-column-head{
    align-items:flex-start;
    flex-direction:column;
    gap:5px;
    padding:11px;
  }
  #screen-evento .summary-debt-column-head strong{font-size:16px}
  #screen-evento .summary-debt-items{padding:3px 8px 8px}
  #screen-evento .summary-debt-item{
    align-items:flex-start;
    flex-direction:column;
    gap:5px;
    padding:9px 3px;
  }
  #screen-evento .expense-row{
    grid-template-columns:34px 38px minmax(0,1fr) auto;
    grid-template-rows:1fr;
    gap:9px;
    align-items:center;
    padding:13px 0;
  }
  #screen-evento .expense-date{
    grid-column:1;
    grid-row:1;
    width:34px;
  }
  #screen-evento .expense-tile{
    grid-column:2;
    grid-row:1;
    width:38px;
    height:38px;
  }
  #screen-evento .expense-mid{
    grid-column:3;
    grid-row:1;
  }
  #screen-evento .expense-status-column{
    grid-column:4;
    grid-row:1;
    padding:0;
  }
  #screen-evento .expense-status{
    min-width:78px;
    max-width:92px;
    align-items:flex-end;
    flex-direction:column;
    gap:2px;
    text-align:right;
  }
  #screen-evento .expense-status-value{font-size:13px}
  #summary-expense-list .expense-row{
    grid-template-columns:34px 38px minmax(0,1fr) auto;
    grid-template-rows:auto auto;
  }
  #summary-expense-list .summary-expense-actions{
    display:flex;
    grid-column:3 / 5;
    grid-row:2;
    justify-content:flex-end;
    padding-top:6px;
  }
}

/* Aba Dívidas — totais e extrato */
#screen-evento .debts-overview>.summary-section-head{
  display:block;
  margin-bottom:12px;
  padding-bottom:12px;
  border-bottom:1px solid var(--border);
}
#screen-evento .debt-kpis{
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:10px;
  margin-bottom:16px;
}
#screen-evento .debt-kpis article{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:14px 16px;
}
#screen-evento .debt-kpis span{margin:0;font-weight:700}
#screen-evento .debt-kpis strong{font-size:19px}
#screen-evento .debt-statement{
  padding:16px;
  border:1px solid var(--border);
  border-radius:15px;
  background:var(--surface);
}
#screen-evento .debt-statement-title{margin:0 0 12px}
#screen-evento .debt-primary-statement{margin-bottom:0}
#screen-evento .debt-participants-title{
  margin:20px 0 10px;
  font-size:13px;
}

@media(max-width:560px){
  #screen-evento .debt-kpis{grid-template-columns:1fr 1fr}
  #screen-evento .debt-kpis article{
    align-items:flex-start;
    flex-direction:column;
    gap:5px;
    padding:12px;
  }
  #screen-evento .debt-kpis strong{font-size:17px}
  #screen-evento .debt-statement{padding:12px}
}

/* Ação global flutuante para adicionar despesa */
.global-expense-fab{
  position:fixed;
  right:28px;
  bottom:28px;
  z-index:70;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-height:50px;
  padding:0 18px;
  border:0;
  border-radius:999px;
  background:var(--accent2);
  color:#fff;
  font:800 13px 'Inter',sans-serif;
  box-shadow:0 14px 32px color-mix(in srgb,var(--accent2) 34%,transparent);
  cursor:pointer;
}
.global-expense-fab .icon{width:20px;height:20px;stroke:#fff}
.global-expense-fab[hidden]{display:none!important}
.global-expense-fab.is-reactivate{background:var(--positive);box-shadow:0 14px 32px color-mix(in srgb,var(--positive) 34%,transparent)}
.history-event-card{width:100%;text-align:left;border:1px solid var(--border);background:var(--surface);cursor:pointer}
.history-event-summary{display:flex;align-items:flex-end;flex-direction:column;gap:8px;margin-left:auto;color:var(--ink)}
.history-empty{display:flex;align-items:center;flex-direction:column;gap:8px;padding:48px 20px;border:1px dashed var(--border);border-radius:16px;color:var(--ink-muted);text-align:center}
@media(max-width:560px){
  .history-event-card{align-items:center;padding:13px}
  .history-event-summary strong{display:none}
  .history-event-summary .balance-chip{font-size:10px}
}

/* Ações do cabeçalho */
.header-alerts{
  display:flex;
  position:relative;
  width:38px;
  height:38px;
  align-items:center;
  justify-content:center;
  border:1px solid var(--border);
  border-radius:12px;
  background:var(--surface-alt);
  color:var(--ink-secondary);
  cursor:pointer;
}
.header-alert-dot{
  display:none;
  position:absolute;
  top:7px;
  right:7px;
  width:8px;
  height:8px;
  border-radius:50%;
  background:var(--negative);
  box-shadow:0 0 0 2px var(--surface-alt);
}
.header-alert-dot.show{display:block}
.header-theme .icon{stroke:var(--ink-secondary)}
:root[data-theme="light"] .header-theme .icon{stroke:#b47b12}
@media(max-width:720px){
  .global-expense-fab{
    left:50%;
    right:auto;
    bottom:calc(78px + env(safe-area-inset-bottom));
    width:auto;
    height:auto;
    padding:0 18px;
    border-radius:999px;
    transform:translateX(-50%);
  }
  .global-expense-fab span{display:inline}
}

/* Selo do ambiente (js/ambiente.js): aparece fora da produção para ninguém
   confundir dados de teste com dados reais. Não recebe toques. */
.ambiente-selo{
  position:fixed;
  z-index:10000;
  top:calc(4px + env(safe-area-inset-top));
  left:4px;
  padding:2px 8px;
  border-radius:999px;
  font-size:10px;
  font-weight:700;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:#fff;
  background:#b45309;
  opacity:.92;
  pointer-events:none;
}
.ambiente-selo[data-ambiente="producao"]{background:#b91c1c}
.ambiente-selo[data-ambiente="emuladores"]{background:#475569}