/* ATLAS: warm glass, stable navigation and short, purposeful movement. */
:root{--ease-atlas:cubic-bezier(.22,.8,.25,1);--nav-index:0}
@media(max-width:740px){.mobile{grid-template-columns:repeat(var(--nav-count,6),minmax(0,1fr))!important}.mobile-indicator{width:calc((100% - 16px)/var(--nav-count,6))!important}}
button,a,input,textarea,select{-webkit-tap-highlight-color:transparent}
button:focus-visible,a:focus-visible,summary:focus-visible{outline:2px solid var(--bronze);outline-offset:4px}
.top{background:linear-gradient(110deg,rgba(39,50,64,.32),rgba(16,21,28,.6));border-bottom-color:rgba(231,235,239,.08)}
.brand em,.mobilebrand em{display:inline-block;text-shadow:0 0 22px rgba(185,155,112,.22)}
.status{box-shadow:inset 0 1px 0 rgba(255,255,255,.025);transition:border-color .2s,background .2s}
.status:hover{border-color:rgba(185,155,112,.35);background:rgba(185,155,112,.06)}
.page>.eyebrow{display:flex;align-items:center;gap:8px}
.page>.eyebrow:before{content:'';width:17px;height:2px;border-radius:5px;background:var(--bronze);opacity:.65}
.title{letter-spacing:-.045em}
.card{background:linear-gradient(145deg,rgba(48,61,76,.48),rgba(33,43,56,.6)),rgba(39,50,64,.72);border-color:rgba(231,235,239,.1);box-shadow:inset 0 1px 0 rgba(231,235,239,.045),0 12px 32px rgba(0,0,0,.1);transition:border-color .25s,box-shadow .25s}
.stat{position:relative;overflow:hidden;background:radial-gradient(ellipse at 80% 0,rgba(185,155,112,.07),transparent 70%),linear-gradient(150deg,rgba(83,103,121,.25),rgba(39,50,64,.5));box-shadow:inset 0 1px 0 rgba(231,235,239,.055);transition:transform .28s var(--ease-atlas),border-color .28s,box-shadow .28s}
.stat:after{content:'';position:absolute;inset:0 20% auto;height:1px;background:linear-gradient(90deg,transparent,rgba(185,155,112,.3),transparent)}
.stat .symbol{display:flex;align-items:center;justify-content:center;width:34px;height:34px;border:1px solid rgba(185,155,112,.1);border-radius:11px;background:rgba(185,155,112,.055);font-size:17px;margin-bottom:14px}
.stat strong,.goalval,.money{font-variant-numeric:tabular-nums}
.progress{height:5px;background:rgba(156,169,184,.13)}
.progress i{border-radius:inherit;background:linear-gradient(90deg,#a88b60,#d2b587);box-shadow:0 0 12px rgba(185,155,112,.13);transition:width .5s var(--ease-atlas)}
.btn{box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 3px 10px rgba(0,0,0,.08);transition:transform .18s var(--ease-atlas),filter .18s,box-shadow .18s}
.btn:active{transform:translateY(1px) scale(.975);box-shadow:inset 0 1px 2px rgba(0,0,0,.12)}
.btn.alt{box-shadow:inset 0 1px 0 rgba(255,255,255,.035)}
.field input,.field textarea,.field select{transition:border-color .2s,box-shadow .2s,background .2s}
.nav-icon{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;transform-origin:center;will-change:transform}
.nav-label{position:relative;white-space:nowrap}
.nav button{position:relative;min-height:46px;isolation:isolate}
.nav button:before{content:'';position:absolute;left:0;top:13px;bottom:13px;width:2px;border-radius:4px;background:var(--bronze);opacity:0;transform:scaleY(.3);transition:opacity .25s,transform .3s var(--ease-atlas)}
.nav button.active{background:linear-gradient(90deg,rgba(185,155,112,.14),rgba(185,155,112,.055));border-color:rgba(185,155,112,.14)}
.nav button.active:before{opacity:1;transform:scaleY(1)}
.nav button.active .nav-icon{color:var(--bronze)}
.page.leave{animation:none;pointer-events:auto}
.page.enter{animation:atlas-screen-in .26s var(--ease-atlas) both}
.page.enter>.card,.page.enter>.stats,.page.enter>.tip{animation:atlas-card-in .32s var(--ease-atlas) both}
.page.enter>.card:nth-of-type(2){animation-delay:25ms}
.page.enter>.card:nth-of-type(3){animation-delay:45ms}
.page.enter>.card:nth-of-type(4){animation-delay:65ms}
.goal-progress-form{animation:atlas-form-in .2s var(--ease-atlas) both}
@keyframes atlas-screen-in{from{opacity:.25;transform:translate3d(calc(var(--screen-direction,1)*9px),5px,0)}to{opacity:1;transform:translateZ(0)}}
@keyframes atlas-card-in{from{opacity:.4;transform:translateY(7px)}to{opacity:1;transform:translateY(0)}}
@keyframes atlas-form-in{from{opacity:.3;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}
@keyframes atlas-nav-pop{0%{transform:translateY(1px) scale(.88)}48%{transform:translateY(-4px) scale(1.08)}75%{transform:translateY(-1px) scale(.99)}100%{transform:translateY(-2px) scale(1.03)}}
@keyframes atlas-nav-label{from{opacity:.55;transform:translateY(2px)}to{opacity:1;transform:translateY(0)}}
@media(hover:hover) and (pointer:fine){.stat:hover{transform:translateY(-3px);border-color:rgba(185,155,112,.24);box-shadow:inset 0 1px 0 rgba(231,235,239,.07),0 9px 22px rgba(0,0,0,.12)}.card:hover{border-color:rgba(231,235,239,.16)}.nav button:hover:not(.active){background:rgba(231,235,239,.025);transform:translateX(2px)}.btn:hover:not(:disabled){filter:brightness(1.055)}}
.mobile-indicator{display:none}
@media(max-width:740px){
 html,body{scrollbar-width:none}
 html::-webkit-scrollbar,body::-webkit-scrollbar{display:none;width:0;height:0}
 .page{padding-bottom:calc(130px + env(safe-area-inset-bottom))}
 .stat .symbol{width:29px;height:29px;border-radius:10px;font-size:15px;margin-bottom:12px}
 .mobile{left:12px;right:12px;bottom:calc(10px + env(safe-area-inset-bottom));padding:6px 8px;min-height:72px;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:0;border:1px solid rgba(231,235,239,.12);border-radius:25px;background:linear-gradient(135deg,rgba(46,58,72,.88),rgba(27,36,47,.91));box-shadow:inset 0 1px 0 rgba(255,255,255,.065),0 12px 36px rgba(0,0,0,.32),0 2px 8px rgba(0,0,0,.16);backdrop-filter:blur(28px) saturate(125%);-webkit-backdrop-filter:blur(28px) saturate(125%);isolation:isolate}
 .mobile-indicator{display:block;position:absolute;left:8px;top:6px;bottom:6px;width:calc((100% - 16px)/6);border-radius:18px;background:linear-gradient(150deg,rgba(185,155,112,.2),rgba(185,155,112,.075));box-shadow:inset 0 1px 0 rgba(229,207,174,.18),inset 0 0 0 1px rgba(185,155,112,.075),0 2px 12px rgba(0,0,0,.08);transform:translate3d(calc(var(--nav-index)*100%),0,0);transition:transform .42s cubic-bezier(.22,.85,.25,1);pointer-events:none;z-index:-1}
 .mobile-indicator:after{content:'';position:absolute;top:3px;left:50%;width:15px;height:2px;transform:translateX(-50%);border-radius:3px;background:#d4b789;box-shadow:0 0 9px rgba(185,155,112,.3);opacity:.7}
 .mobile button{position:relative;z-index:1;min-height:58px;padding:9px 1px 6px;gap:5px;border-radius:18px;font-size:clamp(9px,2.5vw,10px);font-weight:500;letter-spacing:0;color:#9cabb9;background:transparent;transition:color .23s,transform .2s var(--ease-atlas)}
 .mobile button.active{background:transparent;color:#dcc29b}
 .mobile button:active{transform:scale(.94)}
 .mobile .nav-icon{height:24px;transition:transform .25s var(--ease-atlas)}
 .mobile svg{width:22px;height:22px}
 .mobile button.active svg{filter:drop-shadow(0 0 5px rgba(185,155,112,.16))}
 .mobile button.active .nav-icon{transform:translateY(-2px) scale(1.03);animation:atlas-nav-pop .45s var(--ease-atlas) both}
 .mobile button.active .nav-label{animation:atlas-nav-label .28s var(--ease-atlas) both}
 #toast{bottom:calc(98px + env(safe-area-inset-bottom));background:rgba(39,50,64,.95);backdrop-filter:blur(20px)}
}
@media(prefers-reduced-motion:reduce){
 .page.enter,.page.enter>.card,.page.enter>.stats,.page.enter>.tip,.goal-progress-form,.mobile button.active .nav-icon,.mobile button.active .nav-label{animation:none!important}
 .mobile-indicator,.stat,.nav button,.progress i{transition:none!important}
 .stat:hover{transform:none}
}
