/* Shared tour; mobile geometry is explicitly scoped below. */
.qp-tour-shade,.qp-tour-focus,.qp-tour-tip{position:fixed;z-index:220010;}
.qp-tour-shade{background:rgba(3,8,15,.68);}
.qp-tour-focus{pointer-events:none;border:1px solid #6c9ec8;border-radius:var(--radius-lg,18px);box-shadow:0 0 0 3px rgba(83,145,200,.12),0 0 20px rgba(65,126,182,.18);}
.qp-tour-tip{z-index:220012;width:360px;max-width:calc(100vw - 32px);box-sizing:border-box;padding:20px;border:1px solid #527da6;border-radius:var(--radius-lg,18px);background:linear-gradient(145deg,#102033,#0a1422);color:var(--text);box-shadow:0 8px 30px rgba(0,0,0,.35);font:inherit;}
.qp-tour-heading{display:flex;align-items:flex-start;gap:14px;}
.qp-tour-number{display:grid;place-items:center;flex:0 0 36px;height:36px;border-radius:50%;background:var(--primary);color:#fff;font-size:18px;font-weight:700;}
.qp-tour-tip p{margin:0;line-height:1.55;font-weight:600;}
.qp-tour-footer{display:flex;align-items:center;gap:12px;margin-top:20px;}
.qp-tour-progress{color:var(--text-muted);font-size:12px;margin-right:auto;white-space:nowrap;}
.qp-tour-tip button{font:inherit;font-size:13px;cursor:pointer;padding:9px 12px;border:0;background:transparent;color:var(--text-muted);}
.qp-tour-tip .qp-tour-next{background:var(--primary);color:#fff;border-radius:var(--radius-sm,10px);}
.qp-tour-tip button:hover{transform:none;filter:brightness(1.08);}
.qp-tour-tip button:focus-visible{outline:2px solid #82b4de;outline-offset:3px;}
.qp-tour-demo-badge{position:absolute;z-index:5;right:70px;top:10px;padding:3px 8px;border:1px solid var(--border);border-radius:8px;background:var(--panel);color:var(--text-muted);font-size:10px;pointer-events:none;}
.income-top > .qp-tour-demo-badge{right:18px;}
@media(prefers-reduced-motion:reduce){.qp-tour-tip{scroll-behavior:auto;}}
@media (max-width:900px) and (pointer:coarse), (orientation:landscape) and (max-height:560px) and (pointer:coarse){
  .qp-tour-mobile{
    width:360px;max-width:calc(100vw - 24px);overflow:visible;
    scroll-margin-top:max(12px,env(safe-area-inset-top));
    scroll-margin-bottom:max(12px,env(safe-area-inset-bottom));
  }
  .qp-tour-mobile::before{
    content:"";position:absolute;left:var(--qp-tour-arrow-x);width:12px;height:12px;
    background:#102033;border:1px solid #527da6;transform:translateX(-50%) rotate(45deg);
  }
  .qp-tour-mobile[data-placement="below"]::before{top:-7px;border-right:0;border-bottom:0;}
  .qp-tour-mobile[data-placement="above"]::before{bottom:-7px;border-left:0;border-top:0;}
}

/* Mobile annual statistics compatibility override.
   This stylesheet is loaded last, so it restores compact bubbles after older mobile rules.
   Never apply decorative bubble rules while the auth/loading skeleton is active. */
@media (max-width:900px) and (pointer:coarse), (orientation:landscape) and (max-height:560px) and (pointer:coarse){
  html[data-theme="dark"] body:not(.qp-auth-checking) #income #incomeAnalytics:not(.is-monthly) > .analytics-cards > .analytics-card::after{
    content:"" !important;
    display:block !important;
    position:absolute !important;
    z-index:0 !important;
    width:84px !important;
    height:84px !important;
    right:-28px !important;
    bottom:-48px !important;
    border-radius:50% !important;
    background:var(--qp-mobile-cloud) !important;
    background-image:none !important;
    opacity:1 !important;
    pointer-events:none !important;
  }

  html[data-theme="dark"] body:not(.qp-auth-checking) #income #incomeAnalytics:not(.is-monthly) > .analytics-cards > .analytics-card-best::after{
    content:none !important;
    display:none !important;
  }
  html[data-theme="dark"] body:not(.qp-auth-checking) #income #incomeAnalytics:not(.is-monthly) > .analytics-cards > .analytics-card-worst::after{
    background:color-mix(in srgb,var(--danger) 12%,var(--qp-mobile-cloud)) !important;
  }
  html[data-theme="dark"] body:not(.qp-auth-checking) #income #incomeAnalytics:not(.is-monthly) > .analytics-cards > .analytics-card-average::after{
    background:color-mix(in srgb,#4d9cff 12%,var(--qp-mobile-cloud)) !important;
  }

  html[data-theme="dark"] body:not(.qp-auth-checking) #income #incomeAnalytics:not(.is-monthly) > .analytics-cards > .annual-year-compare-card::after{
    width:58px !important;
    height:58px !important;
    right:-20px !important;
    bottom:-32px !important;
  }
  html[data-theme="dark"] body:not(.qp-auth-checking) #income #incomeAnalytics:not(.is-monthly) > .analytics-cards > .annual-year-compare-card.positive::after{
    background:color-mix(in srgb,var(--success) 12%,var(--qp-mobile-cloud)) !important;
  }
  html[data-theme="dark"] body:not(.qp-auth-checking) #income #incomeAnalytics:not(.is-monthly) > .analytics-cards > .annual-year-compare-card.negative::after{
    background:color-mix(in srgb,var(--danger) 12%,var(--qp-mobile-cloud)) !important;
  }
  html[data-theme="dark"] body:not(.qp-auth-checking) #income #incomeAnalytics:not(.is-monthly) > .analytics-cards > .annual-year-compare-card.neutral::after{
    background:var(--qp-mobile-cloud) !important;
  }
  body:not(.qp-auth-checking) #incomeAnalytics:not(.is-monthly) .annual-year-compare-body{
    position:relative !important;
    z-index:1 !important;
  }

  html[data-theme="dark"] body:not(.qp-auth-checking) #income #incomeAnalytics:not(.is-monthly) .analytics-category-panel::after{
    content:"" !important;
    display:block !important;
    position:absolute !important;
    z-index:0 !important;
    width:78px !important;
    height:78px !important;
    right:-26px !important;
    bottom:-44px !important;
    border-radius:50% !important;
    background:color-mix(in srgb,var(--category,#739bce) 12%,var(--qp-mobile-cloud)) !important;
    background-image:none !important;
    box-shadow:none !important;
    opacity:1 !important;
    pointer-events:none !important;
  }

  body:not(.qp-auth-checking) #incomeAnalytics:not(.is-monthly) :is(.annual-month-share,.annual-year-compare-percent,.analytics-category-panel-share){
    position:relative;
    z-index:3 !important;
  }
}

/* Mobile monthly statistics: use the same compact bubble treatment as Year,
   except the "Best category" summary card, which intentionally stays clean.
   Loading skeleton owns ::after while qp-auth-checking is present. */
@media (max-width:900px) and (pointer:coarse), (orientation:landscape) and (max-height:560px) and (pointer:coarse){
  html[data-theme="dark"] body:not(.qp-auth-checking) #income #incomeAnalytics.is-monthly .monthly-summary-card::after{
    content:"" !important;
    display:block !important;
    position:absolute !important;
    z-index:0 !important;
    width:84px !important;
    height:84px !important;
    right:-28px !important;
    bottom:-48px !important;
    border-radius:50% !important;
    background:var(--qp-mobile-cloud) !important;
    background-image:none !important;
    opacity:1 !important;
    pointer-events:none !important;
  }

  html[data-theme="dark"] body:not(.qp-auth-checking) #income #incomeAnalytics.is-monthly .monthly-summary-best::after{
    content:none !important;
    display:none !important;
  }
  html[data-theme="dark"] body:not(.qp-auth-checking) #income #incomeAnalytics.is-monthly .monthly-summary-average::after{
    background:color-mix(in srgb,#4d9cff 12%,var(--qp-mobile-cloud)) !important;
  }
  html[data-theme="dark"] body:not(.qp-auth-checking) #income #incomeAnalytics.is-monthly .monthly-summary-growth.positive::after{
    background:color-mix(in srgb,var(--success) 12%,var(--qp-mobile-cloud)) !important;
  }
  html[data-theme="dark"] body:not(.qp-auth-checking) #income #incomeAnalytics.is-monthly .monthly-summary-growth.negative::after{
    background:color-mix(in srgb,var(--danger) 12%,var(--qp-mobile-cloud)) !important;
  }
  html[data-theme="dark"] body:not(.qp-auth-checking) #income #incomeAnalytics.is-monthly .monthly-summary-growth.neutral::after{
    background:var(--qp-mobile-cloud) !important;
  }

  body:not(.qp-auth-checking) #incomeAnalytics.is-monthly :is(.monthly-corner-percent,.monthly-summary-card-body,.monthly-summary-card-icon){
    position:relative;
    z-index:2 !important;
  }

  html[data-theme="dark"] body:not(.qp-auth-checking) #income #incomeAnalytics.is-monthly .monthly-category-card::after{
    content:"" !important;
    display:block !important;
    position:absolute !important;
    z-index:0 !important;
    width:78px !important;
    height:78px !important;
    right:-26px !important;
    bottom:-44px !important;
    border-radius:50% !important;
    background:color-mix(in srgb,var(--monthly-category,#739bce) 12%,var(--qp-mobile-cloud)) !important;
    background-image:none !important;
    box-shadow:none !important;
    opacity:1 !important;
    pointer-events:none !important;
  }

  body:not(.qp-auth-checking) #incomeAnalytics.is-monthly :is(.monthly-category-icon,.monthly-category-name,.monthly-category-value,.monthly-category-share){
    position:relative;
    z-index:2 !important;
  }
}