:root {
      --green: #3d9e72;
      --green-light: #4CAF87;
      --green-pale: #e8f5ef;
      --green-dark: #1f5c42;
      --ink: #1a1f1c;
      --muted: #6b7c74;
      --surface: #f5faf7;
      --white: #ffffff;
      --border: #e0ece6;
      --radius: 14px;
      --radius-sm: 8px;
      --radius-full: 999px;
    }

    [data-theme="dark"] {
      --green: #4CAF87;
      --green-light: #5dc496;
      --green-pale: rgba(76,175,135,.15);
      --green-dark: #7dd4aa;
      --ink: #f0f5f2;
      --muted: #8a9e94;
      --surface: #1a1f1c;
      --white: #242b27;
      --border: #2e3832;
    }

    @media (prefers-color-scheme: dark) {
      :root:not([data-theme="light"]) {
        --green: #4CAF87;
        --green-light: #5dc496;
        --green-pale: rgba(76,175,135,.15);
        --green-dark: #7dd4aa;
        --ink: #f0f5f2;
        --muted: #8a9e94;
        --surface: #1a1f1c;
        --white: #242b27;
        --border: #2e3832;
      }
    }

    * { box-sizing: border-box; margin: 0; padding: 0; -webkit-tap-highlight-color: transparent; }

    html, body {
      height: 100%;
      font-family: 'DM Sans', -apple-system, BlinkMacSystemFont, sans-serif;
      background: var(--surface);
      color: var(--ink);
      overflow: hidden;
    }

    /* ── APP SHELL ── */
    .app {
      max-width: 430px;
      margin: 0 auto;
      height: 100dvh;
      background: var(--white);
      display: flex;
      flex-direction: column;
      position: relative;
      overflow: hidden;
      box-shadow: 0 0 40px rgba(0,0,0,.08);
    }

    /* ── HEADER ── */
    .header {
      padding: env(safe-area-inset-top, 16px) 20px 0;
      padding-top: max(env(safe-area-inset-top), 16px);
      display: flex;
      align-items: center;
      justify-content: space-between;
      flex-shrink: 0;
    }

    .logo {
      font-size: 17px;
      font-weight: 500;
      color: var(--ink);
    }
    .logo span { color: var(--green); }

    .date-badge {
      font-size: 12px;
      color: var(--muted);
      background: var(--surface);
      padding: 4px 10px;
      border-radius: var(--radius-full);
      border: 1px solid var(--border);
    }

    /* ── SCREENS ── */
    .screen {
      display: none;
      flex: 1;
      flex-direction: column;
      overflow-y: auto;
      overflow-x: hidden;
      -webkit-overflow-scrolling: touch;
    }
    .screen.active { display: flex; }

    /* ── HOJE ── */
    .progress-area {
      padding: 16px 20px 0;
      text-align: center;
      flex-shrink: 0;
    }

    .ring-wrap {
      position: relative;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      margin-bottom: 12px;
    }

    .ring-wrap svg { transform: rotate(-90deg); }

    .ring-label {
      position: absolute;
      text-align: center;
      pointer-events: none;
    }

    .ring-pct {
      font-size: 26px;
      font-weight: 800;
      color: var(--ink);
      line-height: 1;
      letter-spacing: -.02em;
    }

    .ring-sub {
      font-size: 11px;
      color: var(--muted);
      margin-top: 2px;
    }

    .stats-row {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 8px;
      margin-bottom: 16px;
    }

    .stat {
      background: var(--surface);
      border-radius: var(--radius-sm);
      padding: 12px 8px;
      text-align: center;
      border: 1px solid var(--border);
    }

    .stat-n {
      font-size: 22px;
      font-weight: 700;
      color: var(--ink);
      letter-spacing: -.01em;
    }

    .stat-l {
      font-size: 11px;
      color: var(--muted);
      margin-top: 1px;
    }

    .stat.green .stat-n { color: var(--green); }

    /* ── SECTION TITLE ── */
    .section-title {
      font-size: 11px;
      font-weight: 700;
      color: var(--muted);
      text-transform: uppercase;
      letter-spacing: .08em;
      padding: 4px 20px 8px;
      margin-bottom: 0;
      display: flex;
      align-items: center;
      justify-content: space-between;
      flex-shrink: 0;
    }

    .add-btn {
      display: flex;
      align-items: center;
      gap: 4px;
      font-size: 12px;
      font-weight: 600;
      color: var(--green);
      cursor: pointer;
      background: var(--green-pale);
      border: none;
      font-family: inherit;
      padding: 5px 12px;
      border-radius: var(--radius-full);
      transition: opacity .15s;
    }

    .add-btn:active { opacity: .7; }

    /* ── META LIST ── */
    .metas-list {
      padding: 0 20px;
      display: flex;
      flex-direction: column;
      gap: 6px;
      flex: 1;
    }

    .meta-item {
      display: flex;
      align-items: center;
      gap: 10px;
      padding: 11px 12px;
      background: var(--surface);
      border-radius: var(--radius);
      border: 1px solid var(--border);
      cursor: grab;
      transition: opacity .15s, transform .15s, box-shadow .15s;
      user-select: none;
    }

    .meta-item:active { cursor: grabbing; }
    .meta-item.dragging { opacity: .35; transform: scale(.98); }
    .meta-item.drag-over { box-shadow: 0 0 0 2px var(--green); }

    .meta-item.done {
      opacity: .55;
    }

    .meta-item.done .meta-text {
      text-decoration: line-through;
      color: var(--muted);
    }

    .drag-handle {
      color: var(--border);
      font-size: 16px;
      flex-shrink: 0;
      touch-action: none;
    }

    .check-btn {
      width: 24px;
      height: 24px;
      border-radius: 50%;
      border: 1.5px solid var(--border);
      background: none;
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
      transition: all .2s;
    }

    .check-btn.checked {
      background: var(--green);
      border-color: var(--green);
    }

    .check-btn.checked::after {
      content: '';
      width: 10px;
      height: 6px;
      border-left: 2px solid white;
      border-bottom: 2px solid white;
      transform: rotate(-45deg) translateY(-1px);
    }

    .meta-text {
      flex: 1;
      font-size: 14px;
      color: var(--ink);
      line-height: 1.4;
    }

    .meta-tag {
      font-size: 10px;
      padding: 2px 7px;
      border-radius: var(--radius-full);
      flex-shrink: 0;
    }

    .meta-tag.recurrent {
      background: var(--green-pale);
      color: var(--green-dark);
    }

    .meta-actions {
      display: flex;
      gap: 2px;
      flex-shrink: 0;
    }

    .meta-action {
      background: none;
      border: none;
      cursor: pointer;
      padding: 5px;
      color: var(--muted);
      border-radius: var(--radius-sm);
      font-size: 15px;
      display: flex;
      align-items: center;
      justify-content: center;
      transition: background .15s, color .15s;
    }

    .meta-action:hover { background: var(--white); color: var(--ink); }
    .meta-action.danger:hover { color: #c0392b; }

    /* SVG icons inline */
    .icon { width: 16px; height: 16px; stroke: currentColor; fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }

    /* ── HUMOR ── */
    .humor-section {
      padding: 0 20px 12px;
      flex-shrink: 0;
    }
    .humor-label {
      font-size: 12px;
      color: var(--muted);
      margin-bottom: 8px;
      font-weight: 500;
    }
    .humor-btns { display: flex; gap: 8px; }
    .humor-btn {
      flex: 1;
      padding: 10px 8px;
      border-radius: var(--radius);
      border: 1.5px solid var(--border);
      background: var(--surface);
      cursor: pointer;
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 4px;
      font-size: 11px;
      color: var(--muted);
      font-family: inherit;
      transition: all .2s;
    }
    .humor-btn .humor-emoji { font-size: 26px; }
    .humor-btn.selected-ruim  { border-color: #e74c3c; background: #fdf0ef; color: #c0392b; }
    .humor-btn.selected-ok    { border-color: #f0a500; background: #fffbef; color: #b7800a; }
    .humor-btn.selected-otimo { border-color: var(--green); background: var(--green-pale); color: var(--green-dark); }
    .humor-btn:hover { filter: brightness(.96); }

    /* ── SAVE BAR ── */
    .save-bar {
      padding: 12px 20px;
      display: flex;
      gap: 8px;
      flex-shrink: 0;
    }

    .save-btn {
      flex: 1;
      padding: 14px;
      border-radius: var(--radius);
      border: none;
      font-size: 15px;
      font-weight: 600;
      cursor: pointer;
      font-family: inherit;
      transition: all .2s;
    }

    .save-btn.primary {
      background: var(--green);
      color: white;
      box-shadow: 0 4px 14px rgba(61,158,114,.3);
    }

    .save-btn.primary:hover { background: var(--green-dark); }
    .save-btn.primary:active { transform: scale(.98); }

    .save-btn.secondary {
      background: var(--surface);
      color: var(--muted);
      border: 1px solid var(--border);
    }

    .save-btn.secondary:hover { border-color: var(--green); color: var(--green); }

    /* ── CALENDÁRIO ── */
    .cal-header {
      padding: 16px 20px 10px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      flex-shrink: 0;
    }

    .cal-nav {
      background: none;
      border: none;
      cursor: pointer;
      color: var(--muted);
      padding: 6px 10px;
      border-radius: var(--radius-sm);
      font-size: 18px;
      transition: background .15s;
    }

    .cal-nav:hover { background: var(--surface); }

    .cal-month {
      font-size: 16px;
      font-weight: 500;
      color: var(--ink);
    }

    .cal-grid {
      padding: 0 20px;
      display: grid;
      grid-template-columns: repeat(7, 1fr);
      gap: 4px;
      flex-shrink: 0;
    }

    .cal-day-label {
      text-align: center;
      font-size: 11px;
      color: var(--muted);
      padding: 4px 0;
    }

    .cal-day {
      aspect-ratio: 1;
      border-radius: var(--radius-sm);
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 13px;
      cursor: pointer;
      transition: all .15s;
      font-weight: 400;
    }

    .cal-day.empty { visibility: hidden; }
    .cal-day.today { box-shadow: 0 0 0 2px var(--green); font-weight: 500; }
    .cal-day.none { background: var(--surface); color: var(--muted); }
    .cal-day.low { background: rgba(61,158,114,.18); color: var(--green-dark); }
    .cal-day.mid { background: rgba(61,158,114,.45); color: var(--green-dark); }
    .cal-day.full { background: var(--green); color: white; font-weight: 500; }
    .cal-day:hover { filter: brightness(.92); }

    .cal-legend {
      padding: 10px 20px;
      display: flex;
      align-items: center;
      gap: 10px;
      flex-wrap: wrap;
      flex-shrink: 0;
    }

    .legend-item {
      display: flex;
      align-items: center;
      gap: 5px;
      font-size: 11px;
      color: var(--muted);
    }

    .legend-dot {
      width: 11px;
      height: 11px;
      border-radius: 3px;
    }

    .cal-detail {
      margin: 8px 20px 16px;
      padding: 14px;
      background: var(--surface);
      border-radius: var(--radius);
      border: 1px solid var(--border);
      display: none;
    }

    .cal-detail.show { display: block; }

    .cal-detail-title {
      font-size: 13px;
      font-weight: 500;
      color: var(--ink);
      margin-bottom: 10px;
    }

    .cal-detail-item {
      display: flex;
      align-items: center;
      gap: 7px;
      font-size: 12px;
      color: var(--muted);
      padding: 3px 0;
    }

    .cal-detail-item .dot {
      width: 7px; height: 7px;
      border-radius: 50%;
      flex-shrink: 0;
    }

    /* ── DASHBOARD ── */
    .dash-inner {
      padding: 16px 20px 20px;
    }

    .dash-section { margin-bottom: 20px; }

    .dash-title {
      font-size: 12px;
      font-weight: 500;
      color: var(--muted);
      letter-spacing: .04em;
      text-transform: uppercase;
      margin-bottom: 10px;
    }

    .streak-card {
      background: var(--green-pale);
      border: 1px solid rgba(61,158,114,.25);
      border-radius: var(--radius);
      padding: 16px;
      display: flex;
      align-items: center;
      gap: 12px;
    }

    .streak-num {
      font-size: 42px;
      font-weight: 500;
      color: var(--green);
      line-height: 1;
      min-width: 52px;
    }

    .streak-info { flex: 1; }

    .streak-label {
      font-size: 14px;
      font-weight: 500;
      color: var(--ink);
    }

    .streak-sub {
      font-size: 12px;
      color: var(--muted);
      margin-top: 2px;
    }

    .streak-fire { font-size: 28px; }

    .insight-grid {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 8px;
    }

    .insight-card {
      background: var(--surface);
      border-radius: var(--radius);
      padding: 14px;
      border: 1px solid var(--border);
    }

    .insight-val {
      font-size: 22px;
      font-weight: 500;
      color: var(--ink);
    }

    .insight-label {
      font-size: 11px;
      color: var(--muted);
      margin-top: 3px;
    }

    .best-meta-card {
      background: var(--surface);
      border-radius: var(--radius);
      padding: 14px;
      border: 1px solid var(--border);
      display: flex;
      align-items: center;
      gap: 12px;
    }

    .best-meta-icon {
      width: 40px;
      height: 40px;
      background: var(--green-pale);
      border-radius: var(--radius-sm);
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 20px;
      flex-shrink: 0;
    }

    .best-meta-name {
      font-size: 13px;
      font-weight: 500;
      color: var(--ink);
    }

    .best-meta-pct {
      font-size: 12px;
      color: var(--green);
      margin-top: 2px;
    }

    .bar-chart {
      display: flex;
      flex-direction: column;
      gap: 8px;
    }

    .bar-row {
      display: flex;
      align-items: center;
      gap: 8px;
    }

    .bar-day {
      font-size: 12px;
      color: var(--muted);
      width: 28px;
      flex-shrink: 0;
    }

    .bar-track {
      flex: 1;
      height: 8px;
      background: var(--surface);
      border-radius: var(--radius-full);
      overflow: hidden;
      border: 1px solid var(--border);
    }

    .bar-fill {
      height: 100%;
      background: var(--green);
      border-radius: var(--radius-full);
      transition: width .5s ease;
    }

    .bar-pct {
      font-size: 11px;
      color: var(--muted);
      width: 30px;
      text-align: right;
      flex-shrink: 0;
    }

    /* ── BOTTOM NAV ── */
    .bottom-bar {
      padding: 10px 20px;
      padding-bottom: max(env(safe-area-inset-bottom), 10px);
      border-top: 1px solid var(--border);
      display: flex;
      gap: 6px;
      background: var(--white);
      flex-shrink: 0;
    }

    .bar-btn {
      flex: 1;
      padding: 8px 6px;
      border-radius: var(--radius);
      border: none;
      background: none;
      cursor: pointer;
      color: var(--muted);
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 3px;
      font-family: inherit;
      transition: all .15s;
    }

    .bar-btn svg { width: 22px; height: 22px; }
    .bar-btn .tab-label { font-size: 10px; }
    .bar-btn.active { color: var(--green); background: var(--green-pale); }

    /* ── MODAL ── */
    .modal-overlay {
      position: fixed;
      inset: 0;
      background: rgba(0,0,0,.45);
      display: flex;
      align-items: flex-end;
      justify-content: center;
      z-index: 200;
      padding: 0;
    }

    .modal {
      background: var(--white);
      border-radius: var(--radius) var(--radius) 0 0;
      padding: 20px 20px max(env(safe-area-inset-bottom), 20px);
      width: 100%;
      max-width: 430px;
      animation: slideUp .22s ease;
    }

    @keyframes slideUp {
      from { transform: translateY(100%); }
      to   { transform: translateY(0); }
    }

    .modal-title {
      font-size: 16px;
      font-weight: 500;
      color: var(--ink);
      margin-bottom: 16px;
    }

    .modal input[type=text] {
      width: 100%;
      padding: 11px 14px;
      border-radius: var(--radius);
      border: 1px solid var(--border);
      background: var(--surface);
      font-size: 14px;
      color: var(--ink);
      font-family: inherit;
      outline: none;
      margin-bottom: 12px;
    }

    .modal input[type=text]:focus {
      border-color: var(--green);
    }

    .modal-row {
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 10px 0;
      border-top: 1px solid var(--border);
    }

    .modal-row label {
      font-size: 13px;
      color: var(--ink);
    }

    .toggle {
      width: 40px;
      height: 22px;
      border-radius: var(--radius-full);
      background: var(--border);
      border: none;
      cursor: pointer;
      position: relative;
      transition: background .2s;
      flex-shrink: 0;
    }

    .toggle.on { background: var(--green); }

    .toggle::after {
      content: '';
      position: absolute;
      top: 3px;
      left: 3px;
      width: 16px;
      height: 16px;
      border-radius: 50%;
      background: white;
      transition: left .2s;
      box-shadow: 0 1px 3px rgba(0,0,0,.2);
    }

    .toggle.on::after { left: 21px; }

    .modal-actions {
      display: flex;
      gap: 8px;
      margin-top: 14px;
    }

    .modal-btn {
      flex: 1;
      padding: 12px;
      border-radius: var(--radius);
      border: none;
      font-size: 14px;
      font-weight: 500;
      cursor: pointer;
      font-family: inherit;
      transition: all .15s;
    }

    .modal-btn.confirm { background: var(--green); color: white; }
    .modal-btn.confirm:hover { background: var(--green-dark); }
    .modal-btn.cancel { background: var(--surface); color: var(--muted); border: 1px solid var(--border); }
    .modal-btn.cancel:hover { border-color: var(--ink); color: var(--ink); }

    /* ── END DAY MODAL ── */
    .end-modal-inner {
      text-align: center;
    }

    .end-emoji { font-size: 40px; margin-bottom: 8px; }

    .end-title {
      font-size: 20px;
      font-weight: 500;
      color: var(--ink);
      margin-bottom: 4px;
    }

    .end-sub {
      font-size: 13px;
      color: var(--muted);
      margin-bottom: 16px;
    }

    .end-ring-wrap {
      position: relative;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      margin-bottom: 16px;
    }

    .end-ring-wrap svg { transform: rotate(-90deg); }

    .end-ring-label {
      position: absolute;
      text-align: center;
    }

    .end-ring-pct {
      font-size: 22px;
      font-weight: 500;
      color: var(--green-dark);
    }

    .end-stats {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 8px;
      margin-bottom: 20px;
    }

    /* ── TOAST ── */
    .tipo-btn {
      flex: 1;
      padding: 10px;
      border-radius: var(--radius);
      border: 1px solid var(--border);
      background: var(--surface);
      font-size: 14px;
      cursor: pointer;
      font-family: inherit;
      color: var(--muted);
      transition: all .2s;
    }
    .tipo-btn.active {
      background: var(--green-pale);
      border-color: var(--green);
      color: var(--green-dark);
      font-weight: 500;
    }

    .overview-grid {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 10px;
    }
    .overview-card {
      background: var(--surface);
      border: 1px solid var(--border);
      border-radius: var(--radius);
      padding: 14px;
      display: flex;
      align-items: center;
      gap: 12px;
    }
    .overview-icon {
      width: 42px; height: 42px;
      border-radius: 12px;
      background: var(--green-pale);
      display: flex; align-items: center; justify-content: center;
      font-size: 20px; flex-shrink: 0;
    }
    .overview-info { flex: 1; min-width: 0; }
    .overview-val {
      font-size: 20px; font-weight: 600; color: var(--ink); line-height: 1.1;
    }
    .overview-label { font-size: 11px; color: var(--muted); margin-top: 2px; }

    .cat-chip {
      padding: 6px 12px;
      border-radius: 99px;
      border: 1px solid var(--border);
      background: var(--surface);
      font-size: 12px;
      cursor: pointer;
      font-family: inherit;
      color: var(--muted);
      transition: all .15s;
      display: inline-flex;
      align-items: center;
      gap: 4px;
    }
    .cat-chip.active {
      background: var(--green-pale);
      border-color: var(--green);
      color: var(--green-dark);
    }
    .cat-chip-add {
      padding: 6px 12px;
      border-radius: 99px;
      border: 1px dashed var(--border);
      background: none;
      font-size: 12px;
      cursor: pointer;
      font-family: inherit;
      color: var(--green);
    }
    .meta-cat-tag {
      font-size: 10px;
      padding: 2px 8px;
      border-radius: 99px;
      font-weight: 500;
      margin-left: 4px;
    }

    /* ── PREMIUM ── */
    .trial-banner {
      margin: 0 20px 12px;
      padding: 10px 14px;
      border-radius: var(--radius);
      background: linear-gradient(135deg, #1a472a, #2d6a4f);
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 10px;
      flex-shrink: 0;
    }
    .trial-banner .trial-text {
      font-size: 12px;
      color: rgba(255,255,255,.85);
      line-height: 1.4;
    }
    .trial-banner .trial-days {
      font-size: 18px;
      font-weight: 700;
      color: #7dd4aa;
    }
    .trial-banner .trial-btn {
      background: #4CAF87;
      color: white;
      border: none;
      padding: 7px 14px;
      border-radius: 99px;
      font-size: 12px;
      font-weight: 500;
      cursor: pointer;
      font-family: inherit;
      white-space: nowrap;
    }

    .paywall-overlay {
      position: fixed;
      inset: 0;
      background: rgba(0,0,0,.75);
      z-index: 400;
      display: flex;
      align-items: flex-end;
      justify-content: center;
      backdrop-filter: blur(4px);
    }
    .paywall-card {
      background: var(--white);
      border-radius: 28px 28px 0 0;
      padding: 32px 28px 48px;
      width: 100%;
      max-width: 480px;
      text-align: center;
    }
    .paywall-icon { font-size: 48px; margin-bottom: 12px; }
    .paywall-title {
      font-family: 'DM Sans', sans-serif;
      font-size: 22px;
      font-weight: 700;
      color: var(--ink);
      margin-bottom: 8px;
    }
    .paywall-sub {
      font-size: 14px;
      color: var(--muted);
      margin-bottom: 24px;
      line-height: 1.5;
    }
    .paywall-features {
      text-align: left;
      margin-bottom: 24px;
      display: flex;
      flex-direction: column;
      gap: 10px;
    }
    .paywall-feat {
      display: flex;
      align-items: center;
      gap: 10px;
      font-size: 14px;
      color: var(--ink);
    }
    .paywall-feat-icon {
      width: 32px;
      height: 32px;
      border-radius: 8px;
      background: var(--green-pale);
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 16px;
      flex-shrink: 0;
    }
    .paywall-price {
      font-size: 32px;
      font-weight: 700;
      color: var(--ink);
      margin-bottom: 4px;
    }
    .paywall-price span {
      font-size: 16px;
      font-weight: 400;
      color: var(--muted);
    }
    .paywall-cta {
      width: 100%;
      padding: 16px;
      border-radius: var(--radius);
      border: none;
      background: var(--green);
      color: white;
      font-size: 16px;
      font-weight: 600;
      cursor: pointer;
      font-family: inherit;
      margin-top: 16px;
      box-shadow: 0 4px 20px rgba(61,158,114,.4);
    }
    .paywall-cancel {
      margin-top: 12px;
      font-size: 12px;
      color: var(--muted);
      cursor: pointer;
      background: none;
      border: none;
      font-family: inherit;
      width: 100%;
    }
    .premium-badge {
      display: inline-flex;
      align-items: center;
      gap: 4px;
      background: linear-gradient(135deg, #f6d365, #fda085);
      color: white;
      font-size: 10px;
      font-weight: 600;
      padding: 2px 8px;
      border-radius: 99px;
      vertical-align: middle;
    }

    .toast {
      position: fixed;
      bottom: 90px;
      left: 50%;
      transform: translateX(-50%);
      background: #1a1f1c;
      color: #ffffff;
      -webkit-text-fill-color: #ffffff;
      padding: 9px 18px;
      border-radius: var(--radius-full);
      font-size: 13px;
      z-index: 300;
      white-space: nowrap;
      animation: toastIn .2s ease;
      pointer-events: none;
      box-shadow: 0 4px 16px rgba(0,0,0,.3);
    }

    @keyframes toastIn {
      from { opacity: 0; transform: translateX(-50%) translateY(8px); }
      to   { opacity: 1; transform: translateX(-50%) translateY(0); }
    }

    /* ── EMPTY STATE ── */
    .empty-state {
      text-align: center;
      padding: 32px 20px;
      color: var(--muted);
    }

    .empty-state .empty-icon { font-size: 36px; margin-bottom: 8px; }
    .empty-state p { font-size: 14px; }

    /* ── TREINO ── */
    .treino-screen { overflow-y: auto; }

    .timer-overlay {
      position: fixed;
      inset: 0;
      background: rgba(0,0,0,.85);
      z-index: 300;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 16px;
    }

    .timer-num {
      font-family: 'DM Sans', sans-serif;
      font-size: 96px;
      font-weight: 300;
      color: white;
      line-height: 1;
    }

    .timer-label { font-size: 16px; color: rgba(255,255,255,.6); }

    .timer-btn {
      background: var(--green);
      color: white;
      border: none;
      padding: 14px 40px;
      border-radius: 99px;
      font-size: 16px;
      cursor: pointer;
      font-family: inherit;
    }

    .serie-row {
      display: flex;
      align-items: center;
      gap: 8px;
      padding: 8px 10px;
      border-radius: var(--radius-sm);
      background: var(--surface);
      border: 1px solid var(--border);
      margin-bottom: 6px;
    }

    .serie-num {
      font-size: 13px;
      font-weight: 500;
      color: var(--muted);
      width: 20px;
      flex-shrink: 0;
    }

    .serie-input {
      border: none;
      background: var(--white);
      border-radius: var(--radius-sm);
      padding: 6px 8px;
      font-size: 14px;
      font-family: inherit;
      color: var(--ink);
      outline: none;
      border: 1px solid var(--border);
      width: 70px;
      text-align: center;
    }

    .serie-label { font-size: 11px; color: var(--muted); }

    .serie-check-btn {
      margin-left: auto;
      width: 28px;
      height: 28px;
      border-radius: 50%;
      border: 1.5px solid var(--border);
      background: none;
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
      transition: all .2s;
    }

    .serie-check-btn.done {
      background: var(--green);
      border-color: var(--green);
      color: white;
    }

    .serie-check-btn.done::after {
      content: '';
      width: 10px;
      height: 6px;
      border-left: 2px solid white;
      border-bottom: 2px solid white;
      transform: rotate(-45deg) translateY(-1px);
    }

    .serie-bolinhas {
      display: flex;
      gap: 8px;
      flex-wrap: wrap;
      margin: 4px 0 2px;
    }

    .serie-bolinha {
      width: 40px;
      height: 40px;
      border-radius: 50%;
      border: 2px solid var(--border);
      background: var(--surface);
      cursor: pointer;
      font-size: 14px;
      font-weight: 500;
      color: var(--muted);
      font-family: inherit;
      display: flex;
      align-items: center;
      justify-content: center;
      transition: all .2s;
    }

    .serie-bolinha.done {
      background: var(--green);
      border-color: var(--green);
      color: white;
      transform: scale(1.05);
    }

    .pr-badge {
      display: inline-flex;
      align-items: center;
      gap: 4px;
      font-size: 10px;
      padding: 2px 8px;
      border-radius: 99px;
      background: #fff3cd;
      color: #856404;
      border: 1px solid #ffc107;
    }

    .exercicio-card-treino {
      background: var(--surface);
      border: 1px solid var(--border);
      border-radius: var(--radius);
      padding: 14px;
      margin: 0 20px 10px;
    }

    .ex-header {
      display: flex;
      align-items: center;
      justify-content: space-between;
      margin-bottom: 10px;
    }

    .ex-nome-treino {
      font-size: 15px;
      font-weight: 500;
      color: var(--ink);
    }

    .ex-nota-input {
      width: 100%;
      border: none;
      border-top: 1px solid var(--border);
      background: none;
      font-size: 12px;
      color: var(--muted);
      font-family: inherit;
      padding: 8px 0 0;
      margin-top: 8px;
      outline: none;
      resize: none;
    }

    /* ── EXTRAS TABS ── */
    .extras-tabs {
      display: flex;
      gap: 6px;
      padding: 14px 20px 10px;
      flex-shrink: 0;
    }

    .extras-tab {
      flex: 1;
      padding: 8px 4px;
      border-radius: 12px;
      border: 1.5px solid var(--border);
      background: none;
      font-size: 10px;
      font-weight: 600;
      cursor: pointer;
      font-family: inherit;
      color: var(--muted);
      transition: all .2s;
      text-align: center;
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 3px;
      letter-spacing: .02em;
    }

    .extras-tab .tab-icon { font-size: 18px; line-height: 1; }

    .extras-tab.active {
      background: var(--green-pale);
      border-color: var(--green);
      color: var(--green);
    }

    .extras-panel { display: none; flex: 1; flex-direction: column; overflow-y: auto; }
    .extras-panel.active { display: flex; }

    /* ── TREINOS ── */
    .dias-semana {
      display: flex;
      gap: 6px;
      padding: 0 20px 14px;
      overflow-x: auto;
      flex-shrink: 0;
    }

    .dia-btn {
      flex-shrink: 0;
      width: 44px;
      height: 56px;
      border-radius: var(--radius-sm);
      border: 1px solid var(--border);
      background: var(--surface);
      cursor: pointer;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 3px;
      font-family: inherit;
      transition: all .2s;
    }

    .dia-btn.active {
      background: var(--green);
      border-color: var(--green);
      color: white;
    }

    .dia-btn.tem-treino:not(.active) {
      border-color: var(--green);
      background: var(--green-pale);
    }

    .dia-btn .dia-nome { font-size: 11px; font-weight: 500; color: inherit; }
    .dia-btn .dia-num { font-size: 16px; font-weight: 500; color: inherit; }
    .dia-btn.active .dia-nome, .dia-btn.active .dia-num { color: white; }
    .dia-btn.tem-treino:not(.active) .dia-nome, 
    .dia-btn.tem-treino:not(.active) .dia-num { color: var(--green-dark); }

    .treino-dia-header {
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 0 20px 10px;
      flex-shrink: 0;
    }

    .treino-dia-titulo {
      font-size: 15px;
      font-weight: 500;
      color: var(--ink);
    }

    .treino-concluido-btn {
      display: flex;
      align-items: center;
      gap: 6px;
      padding: 6px 12px;
      border-radius: 99px;
      border: 1px solid var(--border);
      background: var(--surface);
      font-size: 12px;
      font-weight: 500;
      cursor: pointer;
      font-family: inherit;
      color: var(--muted);
      transition: all .2s;
    }

    .treino-concluido-btn.done {
      background: var(--green-pale);
      border-color: var(--green);
      color: var(--green-dark);
    }

    .exercicios-list {
      padding: 0 20px;
      display: flex;
      flex-direction: column;
      gap: 8px;
      flex: 1;
    }

    .exercicio-card {
      background: var(--surface);
      border: 1px solid var(--border);
      border-radius: var(--radius);
      padding: 12px 14px;
      display: flex;
      align-items: center;
      gap: 10px;
    }

    .exercicio-info { flex: 1; }

    .exercicio-nome {
      font-size: 14px;
      font-weight: 500;
      color: var(--ink);
      margin-bottom: 3px;
    }

    .exercicio-detalhes {
      font-size: 12px;
      color: var(--muted);
      display: flex;
      gap: 8px;
      align-items: center;
    }

    .exercicio-badge {
      font-size: 10px;
      padding: 2px 7px;
      border-radius: 99px;
      background: var(--green-pale);
      color: var(--green-dark);
    }

    .exercicio-actions { display: flex; gap: 4px; }

    .add-treino-bar {
      padding: 12px 20px;
      flex-shrink: 0;
    }

    .add-treino-btn {
      width: 100%;
      padding: 11px;
      border-radius: var(--radius);
      border: 1.5px dashed var(--border);
      background: none;
      font-size: 14px;
      color: var(--green);
      cursor: pointer;
      font-family: inherit;
      transition: all .2s;
    }

    .add-treino-btn:hover { background: var(--green-pale); border-color: var(--green); }

    .descanso-card {
      margin: 0 20px;
      padding: 20px;
      border-radius: var(--radius);
      background: var(--surface);
      border: 1px solid var(--border);
      text-align: center;
    }

    .descanso-card .icon { font-size: 32px; margin-bottom: 8px; }
    .descanso-card p { font-size: 13px; color: var(--muted); }

    /* ── PLANTINHA ── */
    .plant-wrap {
      display: flex;
      flex-direction: column;
      align-items: center;
      padding: 8px 20px 2px;
      flex-shrink: 0;
    }

    .plant-container {
      position: relative;
      width: 76px;
      height: 76px;
      display: flex;
      align-items: center;
      justify-content: center;
      background: var(--green-pale);
      border-radius: 50%;
      border: 2px solid var(--border);
      margin-bottom: 6px;
    }

    .plant-emoji {
      width: 48px;
      height: 48px;
      display: flex;
      align-items: center;
      justify-content: center;
      transition: all .5s ease;
      filter: drop-shadow(0 4px 8px rgba(61,158,114,.2));
    }

    .plant-emoji svg { width: 48px; height: 48px; }

    .plant-streak {
      font-size: 12px;
      color: var(--muted);
      text-align: center;
      line-height: 1.4;
    }

    .plant-streak strong { color: var(--green); }


    /* ── LIVROS ── */
    .screen-livros { padding-bottom: 20px; }

    .livros-header {
      padding: 16px 20px 12px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      flex-shrink: 0;
    }

    .livros-title {
      font-size: 18px;
      font-weight: 500;
      color: var(--ink);
    }

    .livros-add {
      display: flex;
      align-items: center;
      gap: 4px;
      font-size: 13px;
      color: var(--green);
      cursor: pointer;
      background: none;
      border: none;
      font-family: inherit;
      padding: 4px 8px;
      border-radius: var(--radius-sm);
      transition: background .15s;
    }

    .livros-add:hover { background: var(--green-pale); }

    .livros-list {
      padding: 0 20px;
      display: flex;
      flex-direction: column;
      gap: 12px;
    }

    .livro-card {
      background: var(--surface);
      border: 1px solid var(--border);
      border-radius: var(--radius);
      padding: 14px;
      display: flex;
      gap: 14px;
      align-items: flex-start;
      transition: all .2s;
    }

    .livro-card:hover { transform: translateY(-2px); box-shadow: 0 4px 16px rgba(0,0,0,.08); }

    .livro-capa {
      width: 56px;
      height: 80px;
      border-radius: 6px;
      object-fit: cover;
      flex-shrink: 0;
      background: var(--green-pale);
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 24px;
      border: 1px solid var(--border);
    }

    .livro-capa img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      border-radius: 6px;
    }

    .livro-info { flex: 1; min-width: 0; }

    .livro-titulo {
      font-size: 14px;
      font-weight: 500;
      color: var(--ink);
      margin-bottom: 2px;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }

    .livro-autor {
      font-size: 12px;
      color: var(--muted);
      margin-bottom: 10px;
    }

    .livro-progress-bar {
      height: 6px;
      background: var(--border);
      border-radius: 99px;
      overflow: hidden;
      margin-bottom: 6px;
    }

    .livro-progress-fill {
      height: 100%;
      background: var(--green);
      border-radius: 99px;
      transition: width .4s ease;
    }

    .livro-progress-row {
      display: flex;
      align-items: center;
      justify-content: space-between;
    }

    .livro-pct {
      font-size: 12px;
      font-weight: 500;
      color: var(--green);
    }

    .livro-paginas {
      font-size: 11px;
      color: var(--muted);
    }

    .livro-actions {
      display: flex;
      flex-direction: column;
      gap: 4px;
      flex-shrink: 0;
    }

    .livro-btn {
      background: none;
      border: none;
      cursor: pointer;
      padding: 5px;
      color: var(--muted);
      border-radius: var(--radius-sm);
      font-size: 15px;
      display: flex;
      align-items: center;
      justify-content: center;
      transition: background .15s;
    }

    .livro-btn:hover { background: var(--white); color: var(--ink); }
    .livro-btn.danger:hover { color: #c0392b; }

    .livro-status {
      display: inline-flex;
      align-items: center;
      gap: 4px;
      font-size: 10px;
      padding: 2px 8px;
      border-radius: 99px;
      margin-bottom: 8px;
    }

    .livro-status.lendo { background: var(--green-pale); color: var(--green-dark); }
    .livro-status.concluido { background: rgba(61,158,114,.08); color: var(--muted); }
    .livro-status.quero-ler { background: rgba(240,169,74,.1); color: #b7800a; }

    .livros-stats {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 8px;
      padding: 0 20px 16px;
    }

    /* Modal de adicionar livro */
    .busca-results {
      max-height: 260px;
      overflow-y: auto;
      display: flex;
      flex-direction: column;
      gap: 8px;
      margin-top: 8px;
    }

    .busca-item {
      display: flex;
      gap: 10px;
      align-items: center;
      padding: 8px;
      border-radius: var(--radius-sm);
      cursor: pointer;
      transition: background .15s;
      border: 1px solid var(--border);
      background: var(--surface);
    }

    .busca-item:hover { background: var(--green-pale); border-color: var(--green); }

    .busca-capa {
      width: 36px;
      height: 52px;
      border-radius: 4px;
      object-fit: cover;
      background: var(--green-pale);
      flex-shrink: 0;
    }

    .busca-info { flex: 1; min-width: 0; }
    .busca-titulo { font-size: 13px; font-weight: 500; color: var(--ink); }
    .busca-autor { font-size: 11px; color: var(--muted); }
    .busca-paginas { font-size: 11px; color: var(--green); }

    .update-paginas-modal .modal { text-align: left; }

    /* ── AUTH ── */
    .auth-overlay {
      position: fixed;
      inset: 0;
      background: var(--white);
      z-index: 400;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      padding: 32px 28px;
      max-width: 430px;
      margin: 0 auto;
    }

    .auth-logo {
      font-size: 48px;
      margin-bottom: 8px;
    }

    .auth-title {
      font-family: 'DM Sans', sans-serif;
      font-size: 22px;
      font-weight: 500;
      color: var(--ink);
      margin-bottom: 4px;
      text-align: center;
    }

    .auth-sub {
      font-size: 13px;
      color: var(--muted);
      margin-bottom: 32px;
      text-align: center;
    }

    .auth-form {
      width: 100%;
      display: flex;
      flex-direction: column;
      gap: 10px;
    }

    .auth-input {
      width: 100%;
      padding: 12px 14px;
      border-radius: var(--radius);
      border: 1px solid var(--border);
      background: var(--surface);
      font-size: 14px;
      color: var(--ink);
      font-family: inherit;
      outline: none;
      transition: border .2s;
    }

    .auth-input:focus { border-color: var(--green); }

    .auth-btn {
      width: 100%;
      padding: 13px;
      border-radius: var(--radius);
      border: none;
      background: var(--green);
      color: white;
      font-size: 15px;
      font-weight: 500;
      cursor: pointer;
      font-family: inherit;
      transition: all .2s;
      box-shadow: 0 4px 14px rgba(61,158,114,.3);
      margin-top: 4px;
    }

    .auth-btn:hover { background: var(--green-dark); }
    .auth-btn:disabled { opacity: .6; cursor: not-allowed; }

    .auth-divider {
      display: flex;
      align-items: center;
      gap: 10px;
      margin: 4px 0;
      color: var(--muted);
      font-size: 12px;
    }

    .auth-divider::before, .auth-divider::after {
      content: '';
      flex: 1;
      height: 1px;
      background: var(--border);
    }

    .auth-google {
      width: 100%;
      padding: 12px;
      border-radius: var(--radius);
      border: 1px solid var(--border);
      background: var(--white);
      color: var(--ink);
      font-size: 14px;
      font-weight: 500;
      cursor: pointer;
      font-family: inherit;
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      transition: all .2s;
    }

    .auth-google:hover { background: var(--surface); border-color: var(--green); }

    .auth-switch {
      margin-top: 20px;
      font-size: 13px;
      color: var(--muted);
      text-align: center;
    }

    .auth-switch button {
      background: none;
      border: none;
      color: var(--green);
      font-size: 13px;
      cursor: pointer;
      font-family: inherit;
      font-weight: 500;
    }

    .auth-error {
      background: #fdf0ef;
      border: 1px solid #e74c3c;
      color: #c0392b;
      padding: 10px 12px;
      border-radius: var(--radius-sm);
      font-size: 12px;
      display: none;
    }

    .auth-error.show { display: block; }

    .sync-indicator {
      display: flex;
      align-items: center;
      gap: 5px;
      font-size: 11px;
      color: var(--muted);
    }

    .sync-dot {
      width: 6px;
      height: 6px;
      border-radius: 50%;
      background: var(--green);
      animation: pulse 2s infinite;
    }

    @keyframes pulse {
      0%, 100% { opacity: 1; }
      50% { opacity: .3; }
    }

    .user-menu {
      position: relative;
    }

    .user-avatar {
      width: 32px;
      height: 32px;
      border-radius: 50%;
      background: var(--green);
      color: white;
      font-size: 13px;
      font-weight: 700;
      display: flex;
      align-items: center;
      justify-content: center;
      cursor: pointer;
      border: 2px solid transparent;
      transition: all .2s;
      position: relative;
    }

    .user-avatar:hover { opacity: .85; transform: scale(1.05); }
    .user-avatar.bronze { border-color: #cd7f32; }
    .user-avatar.prata  { border-color: #aaa; }
    .user-avatar.ouro   { border-color: #f5c518; }
    .user-avatar.diamante { border-color: #b9f2ff; box-shadow: 0 0 8px rgba(185,242,255,.6); }
    .user-avatar.lendario { border-color: #a855f7; box-shadow: 0 0 10px rgba(168,85,247,.5); }

    .user-dropdown {
      position: absolute;
      top: 40px;
      right: 0;
      background: var(--white);
      border: 1px solid var(--border);
      border-radius: 16px;
      padding: 0;
      min-width: 220px;
      box-shadow: 0 12px 32px rgba(0,0,0,.15);
      z-index: 400;
      display: none;
      overflow: hidden;
    }

    .user-dropdown.show { display: block; }

    .user-dropdown-header {
      padding: 16px;
      background: linear-gradient(135deg, var(--green-pale), var(--surface));
      border-bottom: 1px solid var(--border);
    }

    .user-dropdown-nome {
      font-size: 15px;
      font-weight: 700;
      color: var(--ink);
      margin-bottom: 2px;
    }

    .user-dropdown-email {
      font-size: 12px;
      color: var(--muted);
      margin-bottom: 8px;
    }

    .nivel-badge {
      display: inline-flex;
      align-items: center;
      gap: 4px;
      padding: 3px 10px;
      border-radius: 99px;
      font-size: 11px;
      font-weight: 700;
      letter-spacing: .03em;
    }
    .nivel-badge.bronze   { background:#f5e6d3; color:#8b5e3c; }
    .nivel-badge.prata    { background:#e8e8e8; color:#666; }
    .nivel-badge.ouro     { background:#fff4c2; color:#9a7b00; }
    .nivel-badge.diamante { background:#e0f7ff; color:#0077a8; }
    .nivel-badge.lendario { background:#f3e8ff; color:#7c3aed; }

    .xp-bar-wrap { margin-top:8px; }
    .xp-bar-label { display:flex; justify-content:space-between; font-size:10px; color:var(--muted); margin-bottom:4px; font-weight:600; }
    .xp-bar { height:5px; background:var(--border); border-radius:99px; overflow:hidden; }
    .xp-bar-fill { height:100%; background:var(--green); border-radius:99px; transition:width .4s ease; }

    .profile-stats-row {
      display: flex;
      align-items: stretch;
      border-bottom: 1px solid var(--border);
    }
    .profile-stat {
      flex: 1;
      padding: 10px 8px;
      text-align: center;
      border-right: 1px solid var(--border);
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
    }
    .profile-stat:last-child { border-right: none; }
    .profile-stat-n { font-size: 16px; font-weight: 800; color: var(--ink); }
    .profile-stat-l { font-size: 9px; font-weight: 600; color: var(--muted); text-transform: uppercase; letter-spacing: .06em; margin-top: 2px; white-space: nowrap; }

    .user-dropdown-btn {
      display: flex;
      align-items: center;
      gap: 8px;
      width: 100%;
      padding: 11px 16px;
      background: none;
      border: none;
      font-size: 13px;
      color: var(--ink);
      cursor: pointer;
      font-family: inherit;
      font-weight: 500;
      border-bottom: 1px solid var(--border);
      transition: background .15s;
      text-align: left;
    }
    .user-dropdown-btn:last-child { border-bottom: none; }
    .user-dropdown-btn:hover { background: var(--surface); }
    .user-dropdown-btn.danger { color: #e74c3c; }

    .user-dropdown-email {
      font-size: 11px;
      color: var(--muted);
      padding: 4px 8px 8px;
      border-bottom: 1px solid var(--border);
      margin-bottom: 4px;
      word-break: break-all;
    }

    .user-dropdown-btn {
      width: 100%;
      padding: 8px;
      border-radius: var(--radius-sm);
      border: none;
      background: none;
      color: var(--ink);
      font-size: 13px;
      cursor: pointer;
      font-family: inherit;
      text-align: left;
      transition: background .15s;
    }

    .user-dropdown-btn:hover { background: var(--surface); }
    .user-dropdown-btn.danger { color: #c0392b; }

    /* ── CONQUISTAS ── */
    .conquistas-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 10px;
      padding: 0 20px;
    }

    .badge-card {
      background: var(--surface);
      border: 1px solid var(--border);
      border-radius: var(--radius);
      padding: 14px 8px;
      text-align: center;
      transition: all .2s;
      position: relative;
    }

    .badge-card.unlocked {
      background: var(--green-pale);
      border-color: var(--green);
      box-shadow: 0 2px 12px rgba(61,158,114,.15);
    }

    .badge-card.locked { opacity: .45; filter: grayscale(1); }

    .badge-icon { font-size: 28px; margin-bottom: 6px; }

    .badge-name {
      font-size: 11px;
      font-weight: 500;
      color: var(--ink);
      line-height: 1.3;
    }

    .badge-card.unlocked .badge-name { color: var(--green-dark); }

    .badge-new {
      position: absolute;
      top: -6px; right: -6px;
      background: #f0c94a;
      color: var(--ink);
      font-size: 9px;
      font-weight: 700;
      padding: 2px 5px;
      border-radius: 99px;
    }

    /* ── CORRELAÇÃO HUMOR ── */
    .humor-corr-section { margin-bottom: 20px; }

    .humor-corr-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 8px;
    }

    .humor-corr-card {
      background: var(--surface);
      border: 1px solid var(--border);
      border-radius: var(--radius);
      padding: 12px 8px;
      text-align: center;
      transition: all .2s;
    }

    .humor-corr-card:hover { transform: translateY(-2px); }

    .humor-corr-emoji { font-size: 24px; margin-bottom: 4px; }

    .humor-corr-pct {
      font-size: 20px;
      font-weight: 500;
      color: var(--ink);
    }

    .humor-corr-label {
      font-size: 10px;
      color: var(--muted);
      margin-top: 2px;
    }

    .humor-corr-dias {
      font-size: 10px;
      color: var(--muted);
      margin-top: 1px;
    }

    .humor-insight {
      margin-top: 10px;
      padding: 12px;
      background: var(--green-pale);
      border-radius: var(--radius);
      border: 1px solid rgba(61,158,114,.2);
      font-size: 12px;
      color: var(--green-dark);
      line-height: 1.5;
    }

    .humor-insight strong { font-weight: 500; }

    /* Toast conquista */
    .conquista-toast {
      position: fixed;
      top: 60px;
      left: 50%;
      transform: translateX(-50%) translateY(-20px);
      background: var(--green);
      color: white;
      padding: 12px 20px;
      border-radius: var(--radius);
      font-size: 14px;
      font-weight: 500;
      z-index: 300;
      white-space: nowrap;
      opacity: 0;
      transition: all .4s ease;
      box-shadow: 0 4px 20px rgba(61,158,114,.4);
      pointer-events: none;
    }

    .conquista-toast.show {
      opacity: 1;
      transform: translateX(-50%) translateY(0);
    }

    /* ── RELATÓRIO SEMANAL ── */
    .relatorio-banner { margin:0 16px 8px;padding:14px 16px;background:linear-gradient(135deg,var(--green-pale),rgba(76,175,135,.08));border:1.5px solid var(--green);border-radius:16px;display:flex;align-items:center;gap:12px;cursor:pointer;transition:opacity .15s; }
    .relatorio-banner:active { opacity:.8; }
    .relatorio-banner-icon { font-size:28px;flex-shrink:0; }
    .relatorio-banner-text { flex:1; }
    .relatorio-banner-title { font-size:13px;font-weight:700;color:var(--green);margin-bottom:2px; }
    .relatorio-banner-sub { font-size:11px;color:var(--muted);line-height:1.4; }
    .relatorio-banner-arrow { font-size:16px;color:var(--green);opacity:.6; }

    /* ── SHARE STREAK ── */
    .share-overlay { position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:350;display:flex;align-items:center;justify-content:center;padding:20px;backdrop-filter:blur(4px); }
    .share-card-wrap { background:var(--white);border-radius:24px;padding:28px 24px;width:100%;max-width:340px;text-align:center; }
    .share-visual { background:linear-gradient(135deg,#1f5c42,#3d9e72);border-radius:18px;padding:32px 20px;margin-bottom:20px;color:#fff;position:relative;overflow:hidden; }
    .share-visual::before { content:'';position:absolute;inset:0;background:radial-gradient(circle at 70% 20%,rgba(255,255,255,.1),transparent 60%); }
    .share-streak-num { font-size:72px;font-weight:800;line-height:1;letter-spacing:-3px; }
    .share-streak-lbl { font-size:16px;font-weight:500;opacity:.9;margin-bottom:4px; }
    .share-app-name { font-size:12px;opacity:.65;letter-spacing:.05em; }
    .share-plant { font-size:40px;margin-bottom:8px; }
    .share-quote { font-size:13px;opacity:.85;font-style:italic;margin-top:8px;line-height:1.4; }
    .share-btns { display:flex;gap:10px;justify-content:center; }
    .share-btn-main { flex:1;padding:13px;border-radius:12px;border:none;background:var(--green);color:#fff;font-size:14px;font-weight:600;cursor:pointer;font-family:inherit; }
    .share-btn-close { padding:13px 16px;border-radius:12px;border:1.5px solid var(--border);background:none;color:var(--muted);font-size:14px;cursor:pointer;font-family:inherit; }

    /* ── NUDGE NOTIFICAÇÕES ── */
    .notif-nudge {
      position: fixed;
      bottom: 80px;
      left: 50%;
      transform: translateX(-50%) translateY(20px);
      width: calc(100% - 32px);
      max-width: 398px;
      background: var(--white);
      border: 1.5px solid var(--border);
      border-radius: 18px;
      padding: 16px 18px;
      box-shadow: 0 8px 32px rgba(0,0,0,.12);
      z-index: 250;
      display: flex;
      gap: 14px;
      align-items: flex-start;
      opacity: 0;
      transition: all .35s cubic-bezier(.34,1.56,.64,1);
      pointer-events: none;
    }
    .notif-nudge.show { opacity:1; transform:translateX(-50%) translateY(0); pointer-events:all; }
    .notif-nudge-icon { font-size:32px; flex-shrink:0; line-height:1; }
    .notif-nudge-body { flex:1; }
    .notif-nudge-title { font-size:14px; font-weight:700; color:var(--ink); margin-bottom:3px; }
    .notif-nudge-desc { font-size:12px; color:var(--muted); line-height:1.5; margin-bottom:10px; }
    .notif-nudge-btns { display:flex; gap:8px; }
    .notif-nudge-sim { background:var(--green); color:#fff; border:none; border-radius:10px; padding:7px 14px; font-size:13px; font-weight:600; cursor:pointer; font-family:inherit; }
    .notif-nudge-nao { background:none; color:var(--muted); border:none; padding:7px 10px; font-size:13px; cursor:pointer; font-family:inherit; }

    /* ── ONBOARDING ── */
    .onboarding-overlay {
      position: fixed;
      inset: 0;
      background: var(--white);
      z-index: 900;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: space-between;
      padding: 0;
      max-width: 430px;
      margin: 0 auto;
      overflow: hidden;
    }

    .ob-header {
      width: 100%;
      display: flex;
      justify-content: flex-end;
      padding: 16px 20px;
      flex-shrink: 0;
    }

    .ob-skip {
      background: none;
      border: none;
      font-size: 13px;
      color: var(--muted);
      cursor: pointer;
      font-family: inherit;
      font-weight: 500;
      padding: 4px 8px;
    }

    .ob-content {
      flex: 1;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      padding: 0 32px;
      text-align: center;
      gap: 0;
    }

    .ob-illustration {
      font-size: 88px;
      line-height: 1;
      margin-bottom: 32px;
      animation: obPop .4s cubic-bezier(.34,1.56,.64,1);
    }

    @keyframes obPop {
      from { transform: scale(.5); opacity: 0; }
      to   { transform: scale(1);  opacity: 1; }
    }

    .ob-tag {
      font-size: 11px;
      font-weight: 700;
      letter-spacing: .1em;
      text-transform: uppercase;
      color: var(--green);
      background: var(--green-pale);
      padding: 4px 12px;
      border-radius: 99px;
      margin-bottom: 16px;
    }

    .ob-title {
      font-size: 26px;
      font-weight: 800;
      color: var(--ink);
      line-height: 1.2;
      margin-bottom: 14px;
      letter-spacing: -.02em;
    }

    .ob-desc {
      font-size: 15px;
      color: var(--muted);
      line-height: 1.6;
      max-width: 300px;
    }

    .ob-options {
      display: flex;
      flex-direction: column;
      gap: 10px;
      width: 100%;
      margin-top: 8px;
    }

    .ob-option {
      display: flex;
      align-items: center;
      gap: 12px;
      padding: 14px 16px;
      border-radius: 14px;
      border: 2px solid var(--border);
      background: var(--white);
      cursor: pointer;
      font-family: inherit;
      font-size: 15px;
      font-weight: 500;
      color: var(--ink);
      transition: all .15s;
      text-align: left;
    }

    .ob-option.selected {
      border-color: var(--green);
      background: var(--green-pale);
      color: var(--green);
    }

    .ob-option-icon { font-size: 22px; }

    .ob-footer {
      width: 100%;
      padding: 20px 32px 40px;
      flex-shrink: 0;
    }

    .ob-progress {
      display: flex;
      gap: 6px;
      justify-content: center;
      margin-bottom: 20px;
    }

    .ob-dot {
      width: 6px;
      height: 6px;
      border-radius: 99px;
      background: var(--border);
      transition: all .3s ease;
    }

    .ob-dot.active {
      width: 20px;
      background: var(--green);
    }

    .ob-btn {
      width: 100%;
      padding: 16px;
      border-radius: 16px;
      border: none;
      background: var(--green);
      color: white;
      font-size: 16px;
      font-weight: 700;
      cursor: pointer;
      font-family: inherit;
      transition: transform .15s, opacity .15s;
      letter-spacing: .01em;
    }

    .ob-btn:active { transform: scale(.97); opacity: .9; }

    .ob-meta-inputs { display:flex; flex-direction:column; gap:10px; width:100%; margin-top:14px; }
    .ob-meta-input-wrap { display:flex; align-items:center; gap:12px; background:var(--surface); border:1.5px solid var(--border); border-radius:12px; padding:11px 14px; transition:border-color .15s,background .15s; }
    .ob-meta-input-wrap:focus-within { border-color:var(--green); background:var(--green-pale); }
    .ob-meta-num { font-size:13px; font-weight:700; color:var(--green); min-width:20px; text-align:center; }
    .ob-meta-input { flex:1; border:none; background:none; font-family:inherit; font-size:15px; color:var(--ink); outline:none; }
    .ob-meta-input::placeholder { color:var(--muted); font-size:14px; }
    .ob-coach-cards { display:flex; gap:12px; width:100%; margin-top:14px; }
    .ob-coach-card { flex:1; padding:22px 12px 18px; border-radius:18px; border:2px solid var(--border); background:var(--white); cursor:pointer; text-align:center; transition:all .2s; }
    .ob-coach-card:active { transform:scale(.97); }
    .ob-coach-card.selected { border-color:var(--green); background:var(--green-pale); }
    .ob-coach-avatar { font-size:40px; margin-bottom:10px; }
    .ob-coach-name { font-size:15px; font-weight:700; color:var(--ink); margin-bottom:5px; }
    .ob-coach-spec { font-size:11px; color:var(--muted); line-height:1.5; }
    .ob-coach-card.selected .ob-coach-name { color:var(--green); }
    .ob-ready-items { display:flex; flex-direction:column; gap:8px; width:100%; margin-top:16px; }
    .ob-ready-item { display:flex; align-items:center; gap:12px; padding:12px 16px; background:var(--surface); border-radius:12px; font-size:14px; color:var(--ink); text-align:left; }
    .ob-ready-item-icon { font-size:20px; flex-shrink:0; }

    .onboarding-slides {
      flex: 1;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      text-align: center;
      width: 100%;
    }

    .onboarding-icon {
      font-size: 72px;
      margin-bottom: 24px;
      animation: bounceIn .5s ease;
    }

    @keyframes bounceIn {
      0%   { transform: scale(.5); opacity: 0; }
      70%  { transform: scale(1.1); }
      100% { transform: scale(1); opacity: 1; }
    }

    .onboarding-title {
      font-size: 26px;
      font-weight: 500;
      color: var(--ink);
      margin-bottom: 14px;
      line-height: 1.2;
    }

    .onboarding-desc {
      font-size: 15px;
      color: var(--muted);
      line-height: 1.7;
      max-width: 300px;
    }

    .onboarding-dots {
      display: flex;
      gap: 8px;
      margin-bottom: 32px;
    }

    .onboarding-dot {
      width: 8px;
      height: 8px;
      border-radius: 50%;
      background: var(--border);
      transition: all .3s;
    }

    .onboarding-dot.active {
      background: var(--green);
      width: 24px;
      border-radius: 99px;
    }

    .onboarding-btn {
      width: 100%;
      padding: 14px;
      border-radius: var(--radius);
      border: none;
      background: var(--green);
      color: white;
      font-size: 16px;
      font-weight: 500;
      cursor: pointer;
      font-family: inherit;
      box-shadow: 0 4px 20px rgba(61,158,114,.35);
      transition: all .2s;
    }

    .onboarding-btn:hover { background: var(--green-dark); transform: translateY(-1px); }
    .onboarding-btn:active { transform: scale(.98); }

    .onboarding-skip {
      background: none;
      border: none;
      color: var(--muted);
      font-size: 13px;
      cursor: pointer;
      margin-top: 14px;
      font-family: inherit;
      padding: 4px;
    }

    .onboarding-skip:hover { color: var(--ink); }

    .slide-enter { animation: slideIn .35s ease; }
    @keyframes slideIn {
      from { opacity: 0; transform: translateX(40px); }
      to   { opacity: 1; transform: translateX(0); }
    }

    /* ── TREINO HEVY STYLE ── */
    .ex-series-btn {
      flex:1; padding:10px 4px; border-radius:10px; border:1.5px solid var(--border);
      background:var(--surface); cursor:pointer; font-size:15px; font-weight:700;
      color:var(--muted); font-family:inherit; transition:all .15s;
    }
    .ex-series-btn.active { border-color:var(--green); background:var(--green-pale); color:var(--green); }

    .biblioteca-item {
      display:flex; align-items:center; gap:10px; padding:10px 14px;
      cursor:pointer; border-bottom:1px solid var(--border); transition:background .1s;
      font-size:14px; color:var(--ink); font-weight:500;
    }
    .biblioteca-item:last-child { border-bottom:none; }
    .biblioteca-item:hover, .biblioteca-item:active { background:var(--green-pale); }
    .biblioteca-item-grupo { font-size:11px; color:var(--muted); font-weight:400; }

    .set-row {
      display:grid; grid-template-columns:32px 1fr 1fr 36px; gap:6px;
      align-items:center; padding:6px 0; border-bottom:1px solid var(--border);
    }
    .set-row:last-child { border-bottom:none; }
    .set-num {
      font-size:12px; font-weight:700; color:var(--muted); text-align:center;
    }
    .set-input {
      padding:8px 10px; border-radius:8px; border:1.5px solid var(--border);
      background:var(--surface); font-size:14px; font-family:inherit; color:var(--ink);
      outline:none; text-align:center; width:100%; box-sizing:border-box;
      transition:border-color .15s;
    }
    .set-input:focus { border-color:var(--green); }
    .set-check {
      width:32px; height:32px; border-radius:50%; border:2px solid var(--border);
      background:transparent; cursor:pointer; display:flex; align-items:center;
      justify-content:center; font-size:14px; transition:all .15s; flex-shrink:0;
    }
    .set-check.done { background:var(--green); border-color:var(--green); color:#fff; }
    .set-input.done { border-color:var(--green); background:var(--green-pale); color:var(--green); font-weight:700; }

    .pr-tag {
      display:inline-flex; align-items:center; gap:3px; font-size:10px;
      font-weight:700; color:#f5a623; background:#fff8e7; padding:2px 7px;
      border-radius:99px; letter-spacing:.03em;
    }

    .ex-card {
      background:var(--white); border:1px solid var(--border); border-radius:14px;
      padding:14px; margin-bottom:10px; transition:border-color .2s;
    }
    .ex-card.all-done { border-color:var(--green); }

    .set-header {
      display:grid; grid-template-columns:32px 1fr 1fr 36px; gap:6px;
      padding:0 0 6px; margin-bottom:4px; border-bottom:1px solid var(--border);
    }
    .set-header-label {
      font-size:10px; font-weight:700; color:var(--muted); text-transform:uppercase;
      letter-spacing:.06em; text-align:center;
    }


    /* ── COACH ── */
    .coach-header { padding:14px 20px 10px; flex-shrink:0; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--border); }
    .coach-title { font-size:16px; font-weight:700; color:var(--ink); }
    .coach-status { display:flex; align-items:center; gap:5px; font-size:11px; color:var(--green); font-weight:600; }
    .coach-status-dot { width:6px; height:6px; border-radius:50%; background:var(--green); animation:pulse 2s infinite; }
    .coach-insight-card { margin:10px 16px 0; padding:10px 14px; background:var(--green-pale); border:1px solid rgba(61,158,114,.2); border-radius:12px; flex-shrink:0; cursor:pointer; }
    .coach-insight-label { font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.07em; color:var(--green); margin-bottom:5px; display:flex; align-items:center; gap:5px; }
    .coach-insight-toggle { margin-left:auto; font-size:11px; transition:transform .2s; }
    .coach-insight-collapsed .coach-insight-toggle { transform:rotate(-90deg); }
    .coach-insight-text { font-size:13px; color:var(--ink); line-height:1.55; }
    .coach-insight-collapsed .coach-insight-text, .coach-insight-collapsed .coach-insight-meta { display:none; }
    .coach-insight-meta { font-size:10px; color:var(--muted); margin-top:4px; }
    /* Cards de seleção de mentor */
    .coach-mentor-cards { display:flex; gap:12px; padding:16px; flex-shrink:0; }
    .coach-mentor-card { flex:1; padding:18px 12px 14px; border-radius:18px; border:1.5px solid var(--border); background:var(--surface); cursor:pointer; display:flex; flex-direction:column; align-items:center; gap:8px; text-align:center; transition:all .2s; }
    .coach-mentor-card:hover { border-color:var(--green); transform:translateY(-2px); box-shadow:0 4px 16px rgba(61,158,114,.12); }
    .coach-mentor-card.active { border-color:var(--green); background:var(--green-pale); }
    .coach-mentor-card-avatar { width:64px; height:64px; border-radius:50%; font-size:30px; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
    .coach-mentor-card-name { font-size:13px; font-weight:700; color:var(--ink); line-height:1.2; }
    .coach-mentor-card-spec { font-size:11px; color:var(--muted); line-height:1.45; }
    /* Barra de mentor ativo (durante conversa) */
    .coach-active-bar { display:none; flex-shrink:0; padding:8px 16px; border-bottom:1px solid var(--border); align-items:center; gap:10px; background:var(--surface); }
    .coach-active-bar.show { display:flex; }
    .coach-active-avatar { width:34px; height:34px; border-radius:50%; font-size:18px; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
    .coach-active-name { font-size:13px; font-weight:600; color:var(--ink); flex:1; }
    .coach-active-switch { background:none; border:1px solid var(--border); border-radius:99px; padding:4px 10px; font-size:11px; color:var(--muted); cursor:pointer; font-family:inherit; font-weight:500; transition:all .15s; }
    .coach-active-switch:hover { border-color:var(--green); color:var(--green); }
    .coach-clear-btn { background:none; border:none; font-size:11px; color:var(--muted); cursor:pointer; font-family:inherit; padding:4px 6px; border-radius:6px; transition:color .15s; }
    .coach-clear-btn:hover { color:#c0392b; }
    .coach-messages { flex:1; overflow-y:auto; overflow-x:hidden; padding:8px 16px; display:flex; flex-direction:column; gap:10px; -webkit-overflow-scrolling:touch; }
    .coach-msg { display:flex; flex-direction:column; max-width:86%; }
    .coach-msg.user { align-self:flex-end; align-items:flex-end; }
    .coach-msg.assistant { align-self:flex-start; align-items:flex-start; }
    .coach-bubble { padding:10px 14px; border-radius:18px; font-size:14px; line-height:1.55; word-break:break-word; }
    .coach-bubble strong { font-weight:700; }
    .coach-msg.user .coach-bubble { background:var(--green); color:white; border-bottom-right-radius:4px; }
    .coach-msg.assistant .coach-bubble { background:var(--surface); color:var(--ink); border:1px solid var(--border); border-bottom-left-radius:4px; }
    .coach-msg-time { font-size:10px; color:var(--muted); margin-top:3px; padding:0 4px; }
    .coach-typing { display:flex; align-items:center; gap:4px; padding:10px 14px; background:var(--surface); border:1px solid var(--border); border-radius:18px; border-bottom-left-radius:4px; width:fit-content; }
    .coach-typing-dot { width:6px; height:6px; border-radius:50%; background:var(--muted); animation:typingBounce 1.2s ease infinite; }
    .coach-typing-dot:nth-child(2){animation-delay:.2s} .coach-typing-dot:nth-child(3){animation-delay:.4s}
    @keyframes typingBounce { 0%,60%,100%{transform:translateY(0);opacity:.4} 30%{transform:translateY(-5px);opacity:1} }
    .coach-quick-btns-wrap { flex-shrink:0; border-top:1px solid var(--border); padding-top:6px; }
    .coach-quick-btns-wrap.hidden { display:none; }
    .coach-quick-label { font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.07em; color:var(--muted); padding:4px 16px 2px; }
    .coach-quick-btns { display:flex; gap:6px; padding:4px 16px 10px; overflow-x:auto; scrollbar-width:none; }
    .coach-quick-btns::-webkit-scrollbar { display:none; }
    .coach-quick-btn { flex-shrink:0; padding:7px 13px; border-radius:99px; border:1px solid var(--border); background:var(--surface); font-size:12px; color:var(--muted); cursor:pointer; font-family:inherit; white-space:nowrap; min-height:32px; display:flex; align-items:center; transition:all .2s; }
    .coach-quick-btn:hover { border-color:var(--green); color:var(--green); background:var(--green-pale); }
    .coach-quick-btn:active { transform:scale(.96); }
    .coach-empty { flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; padding:20px 32px; text-align:center; gap:8px; }
    .coach-empty-icon { font-size:48px; }
    .coach-empty-title { font-size:16px; font-weight:700; color:var(--ink); }
    .coach-empty-sub { font-size:13px; color:var(--muted); line-height:1.55; max-width:240px; }
    .coach-input-area { padding:10px 16px; padding-bottom:max(env(safe-area-inset-bottom),10px); border-top:1px solid var(--border); display:flex; gap:8px; align-items:flex-end; background:var(--white); flex-shrink:0; }
    .coach-input { flex:1; border:1.5px solid var(--border); border-radius:22px; padding:10px 16px; font-size:14px; font-family:inherit; background:var(--surface); color:var(--ink); -webkit-text-fill-color:var(--ink); outline:none; resize:none; max-height:100px; line-height:1.4; transition:border-color .2s; }
    .coach-input:focus { border-color:var(--green); }
    .coach-send-btn { width:40px; height:40px; border-radius:50%; background:var(--green); border:none; cursor:pointer; display:flex; align-items:center; justify-content:center; flex-shrink:0; transition:all .2s; box-shadow:0 2px 8px rgba(61,158,114,.3); }
    .coach-send-btn:disabled { opacity:.5; cursor:not-allowed; }
    .coach-send-btn:active:not(:disabled) { transform:scale(.92); }
    /* Botão salvar reflexão */
    .coach-msg-footer { display:flex; align-items:center; justify-content:space-between; padding:0 4px; margin-top:3px; gap:8px; }
    .coach-save-btn { background:none; border:none; cursor:pointer; font-size:14px; padding:2px 4px; border-radius:6px; transition:all .2s; opacity:.5; line-height:1; }
    .coach-save-btn:hover { opacity:1; transform:scale(1.15); }
    .coach-save-btn.saved { opacity:1; filter:drop-shadow(0 0 3px rgba(245,197,24,.6)); }
    /* Modal de reflexões */
    .reflexoes-overlay { position:fixed; inset:0; background:rgba(0,0,0,.5); z-index:300; display:flex; align-items:flex-end; justify-content:center; }
    .reflexoes-sheet { background:var(--white); border-radius:var(--radius) var(--radius) 0 0; width:100%; max-width:430px; max-height:85vh; display:flex; flex-direction:column; animation:slideUp .22s ease; }
    .reflexoes-header { padding:16px 20px 12px; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--border); flex-shrink:0; }
    .reflexoes-title { font-size:16px; font-weight:700; color:var(--ink); }
    .reflexoes-close { background:none; border:none; font-size:22px; color:var(--muted); cursor:pointer; line-height:1; padding:2px; }
    .reflexoes-list { flex:1; overflow-y:auto; padding:12px 16px; display:flex; flex-direction:column; gap:10px; }
    .reflexao-card { background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); padding:14px; position:relative; }
    .reflexao-card-header { display:flex; align-items:center; gap:8px; margin-bottom:8px; }
    .reflexao-mentor-tag { display:flex; align-items:center; gap:4px; font-size:11px; font-weight:700; color:var(--green-dark); background:var(--green-pale); padding:3px 8px; border-radius:99px; }
    .reflexao-date { font-size:11px; color:var(--muted); margin-left:auto; }
    .reflexao-text { font-size:13px; color:var(--ink); line-height:1.6; }
    .reflexao-delete { position:absolute; top:10px; right:10px; background:none; border:none; font-size:16px; color:var(--muted); cursor:pointer; padding:2px; border-radius:4px; opacity:.5; transition:opacity .15s; }
    .reflexao-delete:hover { opacity:1; color:#c0392b; }
    .reflexoes-empty { flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; padding:40px 20px; text-align:center; color:var(--muted); }
    .reflexoes-empty-icon { font-size:40px; }
    .reflexoes-empty-txt { font-size:13px; line-height:1.5; }

  /* ── AGENDA ──────────────────────────────────────────────────────── */
  .agenda-subtabs { display:flex; gap:0; flex-shrink:0; border-bottom:1px solid var(--border); }
  .agenda-subtab { flex:1; padding:11px 4px; border:none; background:none; font-family:inherit; font-size:13px; font-weight:500; color:var(--muted); cursor:pointer; border-bottom:2px solid transparent; transition:all .15s; margin-bottom:-1px; }
  .agenda-subtab.active { color:var(--green); border-bottom-color:var(--green); }

  .agenda-panel { display:none; flex:1; overflow-y:auto; flex-direction:column; }
  .agenda-panel.active { display:flex; }

  .cal-day.agenda-selected { background:var(--green); color:white; font-weight:600; }
  .cal-day.agenda-has-tasks { position:relative; }
  .cal-day.agenda-has-tasks::after { content:''; position:absolute; bottom:3px; left:50%; transform:translateX(-50%); width:4px; height:4px; border-radius:50%; background:var(--green); }
  .cal-day.agenda-selected.agenda-has-tasks::after { background:rgba(255,255,255,.7); }

  .agenda-day-header { display:flex; align-items:center; justify-content:space-between; padding:14px 20px 6px; flex-shrink:0; }
  .agenda-day-title { font-size:15px; font-weight:700; color:var(--ink); }

  .agenda-filter-chips { display:flex; gap:6px; padding:4px 20px 10px; overflow-x:auto; scrollbar-width:none; flex-shrink:0; }
  .agenda-filter-chips::-webkit-scrollbar { display:none; }

  .agenda-tasks-list { padding:0 20px 24px; display:flex; flex-direction:column; gap:10px; }
  .agenda-empty { text-align:center; color:var(--muted); font-size:13px; padding:32px 0; }

  .agenda-task-card { display:flex; align-items:flex-start; gap:10px; background:var(--surface); border:1px solid var(--border); border-left:4px solid var(--border); border-radius:var(--radius); padding:12px; transition:opacity .15s; }
  .agenda-task-card.concluida { opacity:.55; }
  .agenda-task-card.concluida .agenda-task-titulo { text-decoration:line-through; }

  .agenda-task-left { flex-shrink:0; }
  .agenda-check-btn { width:26px; height:26px; border-radius:50%; border:2px solid var(--border); background:none; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:all .15s; flex-shrink:0; }
  .agenda-check-btn svg { width:14px; height:14px; opacity:0; }
  .agenda-check-btn.checked { background:var(--green); border-color:var(--green); }
  .agenda-check-btn.checked svg { stroke:white; opacity:1; }

  .agenda-task-body { flex:1; cursor:pointer; min-width:0; }
  .agenda-task-titulo { font-size:14px; font-weight:500; color:var(--ink); margin-bottom:2px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .agenda-task-desc { font-size:12px; color:var(--muted); line-height:1.4; margin-bottom:4px; }
  .agenda-task-meta { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
  .agenda-task-hora { font-size:11px; color:var(--muted); }
  .agenda-cat-badge { font-size:11px; background:var(--green-pale); color:var(--green-dark); border-radius:99px; padding:2px 8px; font-weight:500; }

  .agenda-task-del { background:none; border:none; cursor:pointer; font-size:15px; opacity:.4; transition:opacity .15s; padding:2px; flex-shrink:0; }
  .agenda-task-del:hover { opacity:1; }

  .agenda-prio-btn { flex:1; padding:8px 6px; border-radius:var(--radius-sm); border:1.5px solid var(--border); background:var(--surface); font-family:inherit; font-size:12px; font-weight:500; color:var(--muted); cursor:pointer; transition:all .15s; text-align:center; }
  .agenda-prio-btn.active { border-color:var(--green); background:var(--green-pale); color:var(--green-dark); }