/* Shared shell/foundation styles extracted from index.html (v292) */
:root{
  color-scheme:dark;
  --color-bg:#0b0f16;
  --color-bg-alt:#070a10;
  --color-surface:rgba(255,255,255,.045);
  --color-surface-alt:rgba(255,255,255,.028);
  --color-line:rgba(255,255,255,.10);
  --color-border:rgba(255,255,255,.12);
  --color-border-strong:rgba(255,255,255,.16);
  --color-text:#e8eefc;
  --color-muted:rgba(232,238,252,.76);
  --color-primary:#2f6df6;
  --color-primary-press:#1f6feb;
  --color-header-bg:rgba(47,109,246,.18);
  --color-header-text:#5d92ff;
  --surface-card-top:rgba(255,255,255,.07);
  --surface-card-bottom:rgba(255,255,255,.03);
  --surface-control:rgba(255,255,255,.075);
  --surface-control-strong:rgba(255,255,255,.12);
  --surface-chip-top:rgba(255,255,255,.12);
  --surface-chip-bottom:rgba(255,255,255,.05);
  --text-muted-strong:rgba(232,238,252,.82);
  --bg:var(--color-bg);
  --bg2:var(--color-bg-alt);
  --glass:var(--color-surface);
  --glass2:var(--color-surface-alt);
  --line:var(--color-line);
  --border:var(--color-border);
  --border2:var(--color-border);
  --text:var(--color-text);
  --muted:var(--color-muted);
  --accent:var(--color-primary);
  --lbsBlue:#5d92ff;
  --good:#2EA043;
  --pplYellow:#ffd54a;
  --bad:#ff4d4f;
  --neutral:#aeb8cd;
  --analytics-accent:rgba(47,109,246,.18);
  --analytics-surface-top:rgba(255,255,255,.075);
  --analytics-surface-bottom:rgba(255,255,255,.03);
  --btc-logo-blue:#2E5FBF;
  --btc-logo-blue-highlight:#4181E3;
  --btc-logo-blue-shine:#69B7EC;
  --btc-logo-blue-shadow:#142D89;
  --btc-logo-blue-deep:#102A8C;
  --btc-logo-panel-navy:#040F2B;
  --btc-logo-gold:#C1B68A;
  --money:var(--good);
  --lbs:var(--lbsBlue);
  --ppl:var(--pplYellow);
  --trips:#f2f5ff;
  --warn-border:rgba(255,77,79,.40);
  --warn-bg:rgba(255,77,79,.14);
  --ppl-bg:rgba(255,210,63,.08);
  --r:20px;
  --r-card:14px;
  --r-btn:12px;
  --r-pill:999px;
  --pad:16px;
  --cardpad:14px;
  --sh:0 18px 50px rgba(0,0,0,.55);
  --shadow:0 18px 50px rgba(0,0,0,.55);
  --tabbar-h:50px;
  --tabbar-top-pad:2px;
  --tabbar-dock-inset-top:4px;
  --tabbar-dock-inset-x:12px;
  --safeTop:env(safe-area-inset-top);
  --safeBottom:env(safe-area-inset-bottom);
  --tabbar-safe:max(0px, var(--safeBottom));
  --tabbar-control-safe:max(2px, calc(var(--tabbar-safe) * 0.08));
  --tabbar-painted-h:calc(var(--tabbar-h) + var(--tabbar-control-safe));
  --tabbar-content-gap:max(6px, calc(var(--bottom-overlay-gap) - 2px));
  --tabbar-reserve-h:calc(var(--tabbar-total-h) + var(--bottom-overlay-h) + var(--tabbar-content-gap));
  --tabbar-total-h:calc(var(--tabbar-h) + var(--tabbar-safe) + var(--tabbar-top-pad));
  --tabbar-underlap:10px;
  --tabbar-edge-fill:linear-gradient(180deg, rgba(22,32,52,.06) 0%, rgba(12,18,30,.14) 28%, rgba(7,11,18,.24) 62%, rgba(4,7,12,.38) 100%);
  --tabbar-glass-fill:linear-gradient(180deg, rgba(10,15,26,.34) 0%, rgba(8,12,21,.4) 48%, rgba(6,9,16,.46) 100%);
  --bottom-overlay-h:0px;
  --bottom-overlay-gap:8px;
  --shell-top-stack-gap:10px;
  --shell-intro-gap:6px;
  --section-gap:16px;
  --section-gap-tight:13px;
  --card-stack-gap:16px;
  --card-pad-y:14px;
  --card-pad-x:14px;
  --card-title-gap:8px;
  --card-body-gap:10px;
  --card-action-gap:10px;
  --affordance-pad-x:12px;
  --affordance-pad-y:9px;
  --divider-color:rgba(255,255,255,.14);
  --motion-ease-standard:cubic-bezier(.22,.61,.36,1);
  --motion-ease-soft:ease;
  --motion-duration-screen:180ms;
  --motion-duration-overlay:240ms;
  --motion-duration-surface:280ms;
  --motion-duration-press:180ms;
  --shell-page-gutter:12px;
  --shell-max-width:430px;
  --shell-overlay-max-width:520px;
  --shell-viewport-offset-y:0px;
}
:root[data-theme="dark"]{
  color-scheme:dark;
}
:root[data-display-mode="standalone"]{
  --shell-viewport-offset-y:0px;
  --tabbar-h:44px;
  --tabbar-top-pad:0px;
  --tabbar-control-safe:max(2px, calc(var(--tabbar-safe) * 0.08));
  --tabbar-painted-h:calc(var(--tabbar-h) + var(--tabbar-control-safe));
  --tabbar-edge-fill:linear-gradient(180deg, rgba(24,34,56,.045) 0%, rgba(12,18,30,.11) 32%, rgba(7,11,18,.2) 68%, rgba(4,7,12,.29) 100%);
  --tabbar-glass-fill:linear-gradient(180deg, rgba(11,17,28,.28) 0%, rgba(8,12,21,.33) 54%, rgba(6,9,16,.37) 100%);
  --shell-page-gutter:6px;
  --shell-max-width:100vw;
  --shell-overlay-max-width:100vw;
}
:root[data-display-mode="standalone"] body{
  padding:0;
  background:var(--bg);
}
:root[data-display-mode="standalone"] .phone{
  width:100vw;
  max-width:100vw;
  min-height:100dvh;
  padding-top:max(10px, var(--safeTop));
  border-radius:0;
  border:0;
  box-shadow:none;
  background:var(--bg);
}
:root[data-display-mode="standalone"] #tabbar{
  height:var(--tabbar-painted-h);
  padding-bottom:var(--tabbar-control-safe);
  padding-left:6px;
  padding-right:6px;
  overflow:hidden;
  background:var(--tabbar-glass-fill);
  backdrop-filter:blur(24px) saturate(1.16);
  -webkit-backdrop-filter:blur(24px) saturate(1.16);
  box-shadow:0 -10px 24px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.055), inset 0 10px 18px rgba(7,11,18,.12);
}
:root[data-display-mode="standalone"] #tabbar::before{
  top:auto;
  bottom:calc(var(--tabbar-painted-h) - 1px);
  z-index:0;
}
:root[data-display-mode="standalone"] #tabbar::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:var(--tabbar-painted-h);
  background:var(--tabbar-edge-fill);
  backdrop-filter:blur(24px) saturate(1.16);
  -webkit-backdrop-filter:blur(24px) saturate(1.16);
  z-index:0;
  pointer-events:none;
}

:root[data-display-mode="standalone"] #tabbar .tabbtn:not(.plus){
  padding-top:6px;
  padding-bottom:4px;
}

:root[data-display-mode="standalone"] .tabbtn.active,
:root[data-display-mode="standalone"] .tabbtn[aria-current="page"]{
  box-shadow:none;
}
:root[data-display-mode="standalone"] .tabbtn.active svg,
:root[data-display-mode="standalone"] .tabbtn[aria-current="page"] svg{
  transform:translateY(0) scale(1.04);
}
:root[data-display-mode="standalone"] .tabbtn.active span,
:root[data-display-mode="standalone"] .tabbtn[aria-current="page"] span{
  transform:translateY(0);
}

:root[data-display-mode="standalone"] #tabbar .tabbtn.plus,
body[data-display-mode="standalone"] #tabbar .tabbtn.plus{
  -webkit-mask-image:none;
  mask-image:none;
  transform:translateY(0);
  height:46px;
  border-radius:22px;
  margin-bottom:0;
}
:root[data-display-mode="standalone"] #tabbar .tabbtn.plus:active,
body[data-display-mode="standalone"] #tabbar .tabbtn.plus:active{
  transform:translateY(1px) scale(.98);
  filter:brightness(.98);
}
:root[data-display-mode="standalone"] #toast{
  bottom:calc(var(--tabbar-reserve-h) + 2px);
}
:root[data-display-mode="standalone"] .modalRoot,
:root[data-display-mode="standalone"] .celebrationRoot{
  padding:12px;
  padding-bottom:calc(10px + var(--safeBottom));
}

@media (max-width:520px){
  :root[data-display-mode="browser"]{
    --shell-page-gutter:4px;
    --shell-max-width:100vw;
    --shell-overlay-max-width:100vw;
    --tabbar-top-pad:0px;
    --tabbar-safe:max(7px, var(--safeBottom));
    --bottom-overlay-gap:10px;
    --tabbar-reserve-h:calc(var(--tabbar-painted-h) + var(--bottom-overlay-h) + var(--tabbar-content-gap));
    --tabbar-edge-fill:linear-gradient(180deg, rgba(20,30,50,.07) 0%, rgba(12,18,30,.16) 28%, rgba(7,11,18,.29) 62%, rgba(4,7,12,.48) 100%);
    --tabbar-glass-fill:linear-gradient(180deg, rgba(10,16,27,.4) 0%, rgba(8,12,21,.48) 54%, rgba(6,9,16,.56) 100%);
    --shell-viewport-offset-y:0px;
  }
  :root[data-display-mode="browser"] body{
    padding:0 var(--shell-page-gutter);
  }
  :root[data-display-mode="browser"] .phone{
    width:100%;
    border-radius:16px;
    border:1px solid rgba(255,255,255,.09);
    box-shadow:0 8px 24px rgba(0,0,0,.24);
  }
  :root[data-display-mode="browser"] #tabbar{
    height:var(--tabbar-painted-h);
    padding-bottom:var(--tabbar-control-safe);
    padding-left:6px;
    padding-right:6px;
    background:var(--tabbar-glass-fill);
    backdrop-filter:blur(19px) saturate(1.1);
    -webkit-backdrop-filter:blur(19px) saturate(1.1);
    box-shadow:0 -10px 24px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.055), inset 0 10px 18px rgba(7,11,18,.12);
  }
  :root[data-display-mode="browser"] #tabbar::before{
    top:auto;
    bottom:calc(var(--tabbar-painted-h) - 1px);
  }
  :root[data-display-mode="browser"] #tabbar::after{
    content:"";
    position:absolute;
    left:0;
    right:0;
    bottom:0;
    height:var(--tabbar-painted-h);
    background:var(--tabbar-edge-fill);
    backdrop-filter:blur(19px) saturate(1.1);
    -webkit-backdrop-filter:blur(19px) saturate(1.1);
    pointer-events:none;
    z-index:0;
  }
  :root[data-display-mode="browser"] #tabbar .tabbtn.plus{
    height:48px;
    border-radius:20px;
    transform:translateY(-1px);
  }
  :root[data-display-mode="browser"] #tabbar .tabbtn.plus:active{
    transform:translateY(0) scale(.98);
  }
  :root[data-display-mode="browser"] #toast{
    bottom:calc(var(--tabbar-reserve-h) + 2px);
  }
  :root[data-display-mode="browser"] .modalRoot,
  :root[data-display-mode="browser"] .celebrationRoot{
    padding:12px;
    padding-bottom:calc(12px + var(--safeBottom));
  }
}


/* Semantic metric colors */
.trips,
.tripsMetric{color:var(--trips)!important}
.lbsBlue{color:var(--lbs)!important}
.money{color:var(--money)!important}
.ppl,
.rate.ppl{color:var(--ppl)!important}
.tone-up{color:var(--good)!important}
.tone-positive{color:var(--good)!important}
.tone-down{color:var(--bad)!important}
.tone-negative{color:var(--bad)!important}
.tone-neutral,
.tone-steady{color:var(--neutral)!important}

.safeBottom{ padding-bottom: max(10px, var(--safeBottom)); }
.safeTop{ padding-top: max(10px, var(--safeTop)); }

*{box-sizing:border-box}
html{-webkit-tap-highlight-color:transparent;width:100%;max-width:100%;overflow-x:clip}
button:focus-visible,
a:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible{
  outline:3px solid #ffd54a;
  outline-offset:2px;
}
.phTitle{
  outline:none;
  box-shadow:none;
  -webkit-tap-highlight-color:transparent;
}
html,body{height:100%;width:100%;max-width:100%;background:var(--bg);overflow:hidden}
html[data-boot-fallback="hidden"] #bootFallback{display:none}
html[data-boot-fallback="visible"] #bootFallback{display:block}
body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial;color:var(--text);background:radial-gradient(1200px 600px at 50% 8%, rgba(47,109,246,.25) 0%, rgba(47,109,246,0) 55%),var(--bg);padding:0 var(--shell-page-gutter);display:flex;justify-content:center;overflow:hidden;overscroll-behavior:none}
.sr-only{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  padding:0!important;
  margin:-1px!important;
  overflow:hidden!important;
  clip:rect(0,0,0,0)!important;
  clip-path:inset(50%)!important;
  white-space:nowrap!important;
  border:0!important;
  pointer-events:none!important;
}
.phone{width:min(var(--shell-max-width), calc(100vw - (var(--shell-page-gutter) * 2)));max-width:100%;min-width:0;height:calc(100dvh - var(--shell-viewport-offset-y));max-height:calc(100dvh - var(--shell-viewport-offset-y));min-height:calc(100dvh - var(--shell-viewport-offset-y));border-radius:30px;background:linear-gradient(180deg, var(--glass) 0%, var(--glass2) 100%);border:1px solid var(--border2);box-shadow:var(--sh);overflow:hidden;isolation:isolate;display:flex;flex-direction:column}
header h1{margin:0;font-size:18px;letter-spacing:.2px}
header p{margin:8px 0 0;color:var(--muted);font-size:12px;line-height:1.35}
.boot{display:inline-block;margin-left:8px;padding:2px 8px;border-radius:999px;border:1px solid var(--line);font-size:11px;color:var(--muted);vertical-align:middle}
.boot.err{border-color:var(--warn-border);color:var(--bad);background:var(--warn-bg)}
main{padding:14px 14px 18px}
.card{background:linear-gradient(180deg, rgba(255,255,255,.06) 0%, rgba(255,255,255,.02) 100%);border:1px solid var(--line);border-radius:var(--r);padding:var(--card-pad-y) var(--card-pad-x);margin-bottom:var(--card-stack-gap)}
.row{display:flex;gap:10px;flex-wrap:wrap}
.btn{appearance:none;border:1px solid var(--line);background:rgba(15,23,42,.55);color:var(--text);border-radius:16px;padding:12px 14px;font-weight:800;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px;font-size:14px;min-height:48px;-webkit-tap-highlight-color:transparent;touch-action:manipulation;transition:transform .08s ease,filter .12s ease,box-shadow .12s ease,border-color .12s ease,background-color .12s ease,color .12s ease}
.btn.primary{background:linear-gradient(180deg, rgba(47,109,246,.92) 0%, rgba(31,111,235,.92) 100%);border-color:rgba(47,109,246,.9);box-shadow:0 10px 26px rgba(31,111,235,.20)}
.btn.good{background:linear-gradient(180deg, rgba(46,160,67,.90) 0%, rgba(33,120,49,.92) 100%);border-color:rgba(46,160,67,.95)}
.btn.bad{background:linear-gradient(180deg, rgba(255,77,79,.92) 0%, rgba(220,38,38,.92) 100%);border-color:rgba(255,77,79,.95)}
.btn.ghost,
.btn.btn-ghost{background:rgba(255,255,255,.02);border-color:rgba(255,255,255,.16);color:var(--text-muted-strong);box-shadow:none}
.btn:active{transform:translateY(1px);filter:brightness(.97)}
.btn[disabled]{opacity:.55;filter:saturate(.8);box-shadow:none;cursor:not-allowed}
.input,.select,.textarea{width:100%;padding:12px 12px;border-radius:14px;border:1px solid var(--border);background:var(--glass2);color:var(--text);font-weight:700}
.textarea{min-height:110px;resize:vertical;font-weight:600}
main#app{flex:1 1 auto;min-height:0;min-width:0;max-width:100%;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;padding-bottom:var(--tabbar-underlap);scroll-padding-bottom:calc(var(--tabbar-total-h) + var(--tabbar-underlap))}
main#app.screenTransitionActive{will-change:opacity,transform;backface-visibility:hidden}
main#app.screenTransitionOut{opacity:0;transform:translate3d(0,8px,0) scale(.992);transition:opacity calc(var(--motion-duration-screen) * .52) ease-out,transform calc(var(--motion-duration-screen) * .52) ease-out}
main#app.screenTransitionIn{opacity:1;transform:translate3d(0,0,0) scale(1);animation:screenTransitionIn var(--motion-duration-screen) var(--motion-ease-standard)}
@keyframes screenTransitionIn{
  from{opacity:0;transform:translate3d(0,10px,0) scale(.992)}
  to{opacity:1;transform:translate3d(0,0,0) scale(1)}
}
@media (prefers-reduced-motion: reduce){
  main#app.screenTransitionActive,
  main#app.screenTransitionOut,
  main#app.screenTransitionIn,
  #toast,
  #toast .toastAction,
  .celebrationRoot,
  .celebrationPanel,
  .celebrationAction,
  .modalOverlay,
  .modalCard,
  .modalRoot,
  .modalSheet{animation:none;transition:none;opacity:1;transform:none;will-change:auto}
}

/* Toast + tab shell */
#toast{position:fixed;left:50%;bottom:calc(var(--tabbar-reserve-h) + 2px);transform:translateX(-50%) translateY(26px) scale(.985);transform-origin:center bottom;opacity:0;pointer-events:none;width:min(var(--shell-overlay-max-width),calc(100vw - (var(--shell-page-gutter) * 2)));max-width:calc(100vw - (var(--shell-page-gutter) * 2));background:linear-gradient(180deg, rgba(22,31,50,.95) 0%, rgba(11,18,33,.94) 100%);border:1px solid rgba(255,255,255,.16);color:var(--text);padding:11px 13px;border-radius:16px;box-shadow:0 18px 40px rgba(0,0,0,.34), 0 8px 22px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.08);backdrop-filter:blur(16px) saturate(1.08);-webkit-backdrop-filter:blur(16px) saturate(1.08);font-weight:800;font-size:13px;line-height:1.35;z-index:9999;transition:opacity var(--motion-duration-overlay) var(--motion-ease-standard), transform var(--motion-duration-surface) var(--motion-ease-standard), box-shadow var(--motion-duration-overlay) var(--motion-ease-soft), border-color var(--motion-duration-overlay) var(--motion-ease-soft);display:flex;align-items:center;gap:10px;overflow:hidden}
#toast.show{opacity:1;transform:translateX(-50%) translateY(0) scale(1);box-shadow:0 22px 44px rgba(0,0,0,.38), 0 10px 24px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.1)}
#toast .toastText{flex:1;min-width:0;max-width:100%;overflow-wrap:anywhere;word-break:break-word}
#toast .toastAction{appearance:none;border:1px solid rgba(255,255,255,.24);background:linear-gradient(180deg, rgba(68,128,255,.30) 0%, rgba(47,109,246,.24) 100%);color:var(--text);border-radius:999px;padding:6px 10px;font-weight:800;font-size:12px;line-height:1;cursor:pointer;pointer-events:auto;min-height:30px;max-width:100%;box-shadow:inset 0 1px 0 rgba(255,255,255,.08);transition:transform var(--motion-duration-press) var(--motion-ease-soft), filter var(--motion-duration-press) var(--motion-ease-soft), background var(--motion-duration-press) var(--motion-ease-soft), border-color var(--motion-duration-press) var(--motion-ease-soft)}
#toast .toastAction:active{transform:translateY(1px);filter:brightness(.98)}

.celebrationRoot{position:fixed;inset:0;z-index:10000;display:flex;align-items:center;justify-content:center;padding:16px;padding-bottom:calc(16px + var(--safeBottom));background:rgba(3,8,18,.40);-webkit-backdrop-filter:blur(10px) saturate(1.02);backdrop-filter:blur(10px) saturate(1.02);opacity:0;pointer-events:none;transition:opacity var(--motion-duration-overlay) var(--motion-ease-soft)}
.celebrationRoot.hidden{display:none}
.celebrationRoot.show{opacity:1;pointer-events:auto}
.celebrationPanel{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%) scale(.94);transform-origin:center center;width:min(420px,calc(100vw - 24px));max-width:calc(100vw - 24px);max-height:min(360px,calc(100dvh - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px) - var(--tabbar-total-h) - 28px));box-sizing:border-box;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;padding:18px 16px max(15px,calc(15px + env(safe-area-inset-bottom,0px)));border-radius:22px;display:flex;flex-direction:column;gap:12px;background:radial-gradient(120% 140% at 50% 0%, rgba(104,165,255,.18) 0%, rgba(104,165,255,0) 46%), linear-gradient(180deg, rgba(11,18,33,.985) 0%, rgba(7,12,24,.975) 100%);border:1px solid rgba(126,200,255,.45);box-shadow:0 26px 58px rgba(0,0,0,.46), 0 14px 32px rgba(8,14,30,.34), inset 0 1px 0 rgba(255,255,255,.08);transition:transform var(--motion-duration-surface) var(--motion-ease-standard)}
.celebrationRoot.show .celebrationPanel{transform:translate(-50%,-50%) scale(1)}
.celebrationPanel::before{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(180deg, rgba(255,255,255,.10) 0%, rgba(255,255,255,0) 38%);opacity:.8;pointer-events:none}
.celebrationContent{display:flex;flex-direction:column;gap:7px;text-align:center;min-width:0;max-width:100%;position:relative;z-index:1}
.celebrationTitle{font-size:20px;line-height:1.2;font-weight:900;letter-spacing:.01em;overflow-wrap:anywhere;word-break:break-word}
.celebrationDetail{font-size:14px;line-height:1.4;opacity:.95;overflow-wrap:anywhere;word-break:break-word}
.celebrationAction{appearance:none;border:1px solid rgba(255,255,255,.24);background:linear-gradient(180deg, rgba(81,140,255,.42) 0%, rgba(47,109,246,.30) 100%);color:var(--text);border-radius:999px;padding:9px 14px;font-weight:800;font-size:13px;line-height:1;cursor:pointer;pointer-events:auto;align-self:center;min-width:96px;max-width:100%;box-shadow:inset 0 1px 0 rgba(255,255,255,.08);transition:transform var(--motion-duration-press) var(--motion-ease-soft), filter var(--motion-duration-press) var(--motion-ease-soft), background var(--motion-duration-press) var(--motion-ease-soft), border-color var(--motion-duration-press) var(--motion-ease-soft);position:relative;z-index:1;white-space:normal}
.celebrationAction:active{transform:translateY(1px);filter:brightness(.98)}

#tabbar{position:relative;z-index:2;width:100%;height:var(--tabbar-total-h);margin-top:calc(var(--tabbar-underlap) * -1);padding:var(--tabbar-top-pad) 10px var(--tabbar-safe);background:var(--tabbar-glass-fill);backdrop-filter:blur(18px) saturate(1.12);-webkit-backdrop-filter:blur(18px) saturate(1.12);display:flex;justify-content:space-around;align-items:flex-end;gap:6px;overflow:hidden;box-shadow:0 -12px 30px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.055), inset 0 10px 18px rgba(7,11,18,.12);flex:0 0 auto}
#tabbar::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:linear-gradient(90deg, transparent 0%, rgba(255,255,255,.16) 14%, rgba(116,156,214,.14) 50%, rgba(255,255,255,.12) 86%, transparent 100%);opacity:.72;z-index:0;pointer-events:none}
#tabbar::after{content:"";position:absolute;left:0;right:0;bottom:0;height:var(--tabbar-painted-h);background:var(--tabbar-edge-fill);backdrop-filter:blur(18px) saturate(1.12);-webkit-backdrop-filter:blur(18px) saturate(1.12);z-index:0;pointer-events:none}
.tabbtn{position:relative;z-index:1;flex:1;min-width:0;appearance:none;border:0;background:transparent;color:var(--muted);padding:7px 6px 6px;border-radius:16px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;font-weight:800;font-size:12px;line-height:1;min-height:46px;box-shadow:none;transition:transform .16s ease,color .18s ease,background .18s ease,opacity .18s ease,filter .18s ease,box-shadow .18s ease}
.tabbtn::after{content:"";position:absolute;left:50%;bottom:2px;width:26px;height:3px;border-radius:999px;background:currentColor;opacity:0;transform:translateX(-50%) scaleX(.45);transition:transform .18s ease,opacity .18s ease,background .18s ease}
.tabbtn svg{width:22px;height:22px;display:block;opacity:.9;transform:translateY(0) scale(1);transform-origin:center;transition:transform .18s ease,opacity .18s ease,stroke .18s ease,filter .18s ease}
.tabbtn span{position:relative;opacity:.92;transform:translateY(0);transition:transform .18s ease,opacity .18s ease,letter-spacing .18s ease}
.tabbtn.standard{align-self:auto;padding-top:7px;padding-bottom:6px}
.tabbtn:not(.plus),
.tabbtn.standard{background:transparent;box-shadow:none}
.tabbtn:not(.plus).active,
.tabbtn:not(.plus)[aria-current="page"],
.tabbtn.standard.active,
.tabbtn.standard[aria-current="page"]{background:transparent;box-shadow:none}
.tabbtn.active,
.tabbtn[aria-current="page"]{color:var(--text);background:transparent;box-shadow:none}
.tabbtn.active svg,
.tabbtn[aria-current="page"] svg{stroke:var(--accent);opacity:1;transform:translateY(-1px) scale(1.04);filter:drop-shadow(0 4px 10px rgba(47,109,246,.18))}
.tabbtn.active span,
.tabbtn[aria-current="page"] span{opacity:1;transform:translateY(-1px);letter-spacing:.01em}
.tabbtn.active::after,
.tabbtn[aria-current="page"]::after{opacity:.95;transform:translateX(-50%) scaleX(1);background:var(--accent)}

.tabbtn.standard[data-tab="reports"].active,
.tabbtn.standard[data-tab="reports"][aria-current="page"]{
  color:#e8ddbc;
  background:transparent;
  box-shadow:none;
}
.tabbtn.standard[data-tab="reports"].active svg,
.tabbtn.standard[data-tab="reports"][aria-current="page"] svg{
  stroke:#d6bf86;
  filter:drop-shadow(0 4px 10px rgba(160,118,54,.26));
}
.tabbtn.standard[data-tab="reports"].active span,
.tabbtn.standard[data-tab="reports"][aria-current="page"] span{
  color:#f0e5c8;
}
.tabbtn.standard[data-tab="reports"].active::after,
.tabbtn.standard[data-tab="reports"][aria-current="page"]::after{
  background:linear-gradient(90deg, #ad8750 0%, #d9c78f 100%);
}
.tabbtn:active{transform:scale(.97);filter:brightness(1.03)}
.tabbtn:active svg{transform:translateY(0) scale(.98)}
.tabbtn.plus{flex:0 0 64px;min-width:64px;max-width:64px;padding:0;margin-bottom:2px;color:#fff;background:linear-gradient(180deg, rgba(93,146,255,.98) 0%, rgba(47,109,246,.98) 100%);border-radius:999px;border:0;height:52px;display:flex;align-items:center;justify-content:center;box-shadow:0 14px 30px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,255,255,.18);transform:translateY(-5px)}
.tabbtn.plus::after{display:none}
.tabbtn.plus svg{width:26px;height:26px;stroke:#fff;opacity:1;filter:none;transform:none}
.tabbtn.plus span{display:none}
.tabbtn.plus.active,
.tabbtn.plus[aria-current="page"]{background:linear-gradient(180deg, rgba(116,163,255,1) 0%, rgba(47,109,246,1) 100%);box-shadow:0 16px 34px rgba(31,111,235,.28), 0 10px 24px rgba(0,0,0,.32), inset 0 1px 0 rgba(255,255,255,.24)}
.tabbtn.plus:active{transform:translateY(-4px) scale(.98);filter:brightness(.98)}

/* Modal shell */
body.scrollLock{overflow:hidden;overscroll-behavior:none}
.modalOverlay{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;padding:18px;background:rgba(3,8,18,.12);backdrop-filter:blur(0px);-webkit-backdrop-filter:blur(0px);z-index:9999;pointer-events:auto;opacity:0;transition:opacity var(--motion-duration-overlay) var(--motion-ease-soft), background var(--motion-duration-surface) var(--motion-ease-soft), backdrop-filter var(--motion-duration-surface) var(--motion-ease-soft), -webkit-backdrop-filter var(--motion-duration-surface) var(--motion-ease-soft)}
.modalOverlay.is-visible{opacity:1;background:rgba(3,8,18,.58);backdrop-filter:blur(12px) saturate(1.02);-webkit-backdrop-filter:blur(12px) saturate(1.02)}
.modalOverlay.is-closing{opacity:0;background:rgba(3,8,18,.16);backdrop-filter:blur(0px);-webkit-backdrop-filter:blur(0px)}
.modalCard{width:min(420px,100%);transform:translateY(20px) scale(.985);transform-origin:center;opacity:0;transition:transform var(--motion-duration-surface) var(--motion-ease-standard), opacity var(--motion-duration-overlay) var(--motion-ease-soft), box-shadow var(--motion-duration-overlay) var(--motion-ease-soft)}
.modalOverlay.is-visible .modalCard{transform:translateY(0) scale(1);opacity:1;box-shadow:0 24px 60px rgba(0,0,0,.38)}
.modalOverlay.is-closing .modalCard{transform:translateY(14px) scale(.992);opacity:0}
.modalRoot{position:fixed;inset:0;z-index:9999;display:flex;align-items:flex-end;justify-content:center;padding:16px;padding-bottom:calc(16px + var(--safeBottom));background:rgba(3,8,18,.14);-webkit-backdrop-filter:blur(0px);backdrop-filter:blur(0px);pointer-events:auto;overflow-x:hidden;opacity:0;transition:opacity var(--motion-duration-overlay) var(--motion-ease-soft), background var(--motion-duration-surface) var(--motion-ease-soft), backdrop-filter var(--motion-duration-surface) var(--motion-ease-soft), -webkit-backdrop-filter var(--motion-duration-surface) var(--motion-ease-soft)}
.modalRoot.is-visible{opacity:1;background:rgba(3,8,18,.48);-webkit-backdrop-filter:blur(10px) saturate(1.02);backdrop-filter:blur(10px) saturate(1.02)}
.modalRoot.is-closing{opacity:0;background:rgba(3,8,18,.18);-webkit-backdrop-filter:blur(0px);backdrop-filter:blur(0px)}



.modalRoot.hidden{ display:none; }
.modalSheet{width:min(560px,100%);max-width:100%;min-width:0;background: linear-gradient(180deg, var(--glass) 0%, var(--glass2) 100%);border:1px solid var(--border);border-radius:18px;box-shadow:0 18px 55px rgba(0,0,0,.55);overflow:hidden;transform:translateY(26px) scale(.985);transform-origin:center bottom;opacity:0;transition:transform var(--motion-duration-surface) var(--motion-ease-standard), opacity var(--motion-duration-overlay) var(--motion-ease-soft), box-shadow var(--motion-duration-overlay) var(--motion-ease-soft)}
.modalRoot.is-visible .modalSheet{transform:translateY(0) scale(1);opacity:1;box-shadow:0 24px 66px rgba(0,0,0,.42)}
.modalRoot.is-closing .modalSheet{transform:translateY(18px) scale(.992);opacity:0}
.modalSheet--center{transform:translate(-50%,-50%) translateY(18px) scale(.985);transform-origin:center center}
.modalRoot.is-visible .modalSheet--center{transform:translate(-50%,-50%) translateY(0) scale(1)}
.modalRoot.is-closing .modalSheet--center{transform:translate(-50%,-50%) translateY(12px) scale(.992)}
.modalHdr{padding:14px 16px 10px 16px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:10px}
.modalTitle{ font-weight:800; letter-spacing:.04em; text-transform:uppercase; font-size:12px; opacity:.9; }
.modalBody{ padding:14px 16px 16px 16px; }
.modalActions{display:flex;gap:10px;justify-content:flex-end;padding:0 16px 16px 16px}
.modalErr{margin-top:10px;font-size:12px;opacity:.9;color: var(--danger, #ff6b6b)}

@media (min-width:700px){
  :root{
    --shell-page-gutter:22px;
    --shell-max-width:460px;
    --shell-overlay-max-width:560px;
    --section-gap:18px;
    --card-stack-gap:18px;
  }
  body{
    padding-top:0;
    padding-bottom:0;
  }
  main{
    padding:15px 16px 20px;
  }
  .modalOverlay,
  .modalRoot,
  .celebrationRoot{
    padding:22px;
  }
}