.app{display:grid;grid-template-columns:var(--rail-w) var(--panel-w) minmax(0,1fr);min-height:100vh}
.rail{background:var(--rail-bg);color:var(--rail-text);display:flex;flex-direction:column;align-items:center;gap:var(--s-1);padding:var(--s-3) 0;position:sticky;top:0;height:100vh;overflow:auto}
.rail .logo{width:44px;height:44px;margin-bottom:var(--s-3);border-radius:12px;background:#fff;padding:4px}
.rail a{width:64px;display:flex;flex-direction:column;align-items:center;gap:3px;padding:8px 2px;border-radius:var(--r-md);color:inherit;text-decoration:none;font-size:11px;font-weight:600;text-align:center;line-height:1.15}
.rail a:hover{background:rgba(255,255,255,.08)}
.rail a[aria-current=page]{background:rgba(255,255,255,.16);color:var(--rail-active)}
.rail a .dot{width:6px;height:6px;border-radius:50%;background:var(--c,var(--blue-400))}
.panel{background:var(--surface);border-right:1px solid var(--line);padding:var(--s-4) var(--s-3);position:sticky;top:0;height:100vh;overflow:auto}
.panel h2{font-size:var(--t-md);padding:var(--s-2) var(--s-3) var(--s-3);display:flex;align-items:center;gap:var(--s-2)}
.panel h2 i{width:10px;height:10px;border-radius:50%;background:var(--c)}
.panel ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:2px}
.panel a{display:flex;align-items:center;gap:var(--s-3);min-height:42px;padding:0 var(--s-3);border-radius:var(--r-sm);color:var(--text);text-decoration:none;font-weight:500}
.panel a:hover{background:var(--surface-2)}
.panel a[aria-current=page]{background:var(--primary-soft);color:var(--primary);font-weight:700}
.panel .group{font-size:var(--t-xs);font-weight:700;color:var(--text-3);padding:var(--s-4) var(--s-3) var(--s-1)}
.maincol{min-width:0;display:flex;flex-direction:column}
.topbar{height:var(--top-h);background:var(--surface);border-bottom:1px solid var(--line);display:flex;align-items:center;gap:var(--s-3);padding:0 var(--s-5);position:sticky;top:0;z-index:20}
.topbar .search{max-width:360px}
.aatma{display:flex;align-items:center;gap:8px;flex:1;max-width:420px}
.aatma .input{min-height:40px}
.menu-btn{display:none}
main{padding:var(--s-6) var(--s-5) var(--s-8);width:100%;max-width:var(--page-max);margin:0 auto;outline:none}
.menu{position:relative}
.menu .pop{position:absolute;right:0;top:calc(100% + 8px);min-width:240px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);box-shadow:var(--shadow-2);padding:var(--s-2);z-index:40;display:none}
.menu.open .pop{display:block}
.menu .pop button,.menu .pop a{display:flex;width:100%;align-items:center;gap:var(--s-3);min-height:42px;padding:0 var(--s-3);border:0;background:none;border-radius:var(--r-sm);text-align:left;text-decoration:none;color:var(--text)}
.menu .pop button:hover,.menu .pop a:hover{background:var(--surface-2)}
.menu .pop .who{padding:var(--s-3);border-bottom:1px solid var(--line);margin-bottom:var(--s-2)}
.menu .pop .sel[aria-checked=true]{background:var(--primary-soft);font-weight:700}
.bottombar{display:none}

/* Home: goal first */
.hello{margin-bottom:var(--s-5)}
.goals{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:var(--s-4)}
.goal{display:flex;flex-direction:column;gap:var(--s-2);padding:var(--s-5);border-radius:var(--r-lg);background:var(--surface);border:1px solid var(--line);text-decoration:none;color:var(--text);box-shadow:var(--shadow-1);transition:transform var(--dur) var(--ease),box-shadow var(--dur);position:relative;overflow:hidden;min-height:150px}
.goal::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--c,var(--primary))}
.goal:hover{transform:translateY(-2px);box-shadow:var(--shadow-2)}
.goal .gi{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;background:color-mix(in srgb,var(--c,var(--primary)) 14%,transparent);color:var(--c,var(--primary))}
.goal b{font-size:var(--t-lg)}.goal span{color:var(--text-2);font-size:var(--t-sm)}
.section{margin-top:var(--s-6)}.section>h3{margin-bottom:var(--s-3)}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:var(--s-4)}
.kpi{padding:var(--s-4) var(--s-5);border-radius:var(--r-md);background:var(--surface);border:1px solid var(--line)}
.kpi .v{font-size:var(--t-h2);font-weight:800}.kpi .l{color:var(--text-2);font-size:var(--t-sm)}

/* Sign in */
.auth{min-height:100vh;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr)}
.auth .side{background:linear-gradient(160deg,var(--navy-900),var(--blue-700));color:#fff;padding:clamp(24px,5vw,64px);display:flex;flex-direction:column;justify-content:space-between;gap:var(--s-6)}
.auth .side h1{color:#fff;max-width:14ch}.auth .side p{color:#D3E0FA}
.auth .side ul{list-style:none;padding:0;margin:0;display:grid;gap:var(--s-3)}
.auth .side li{display:flex;gap:var(--s-3);align-items:flex-start;color:#E4ECFF}
.auth .form{display:grid;place-items:center;padding:var(--s-5)}
.auth .box{width:min(420px,100%);display:flex;flex-direction:column;gap:var(--s-4)}
.brandrow{display:flex;align-items:center;gap:var(--s-3);font-weight:800;font-size:var(--t-lg)}
.brandrow img{width:40px;height:40px;border-radius:10px;background:#fff;padding:3px}

@media (max-width:1099px){
  .app{grid-template-columns:var(--rail-w) minmax(0,1fr)}
  .panel{position:fixed;left:var(--rail-w);top:0;bottom:0;width:min(var(--panel-w),calc(100vw - var(--rail-w)));z-index:50;transform:translateX(calc(-100% - 90px));visibility:hidden;transition:transform var(--dur) var(--ease),visibility 0s linear var(--dur);box-shadow:var(--shadow-2)}
  .app.panel-open .panel{transform:none;visibility:visible;transition-delay:0s}
  .menu-btn{display:inline-flex}
  .topbar .aatma{display:none}
}
@media (max-width:699px){
  .app{grid-template-columns:minmax(0,1fr)}
  .rail{display:none}
  .panel{left:0;width:min(300px,86vw)}
  main{padding:var(--s-4) var(--s-4) 96px}
  .topbar{padding:0 var(--s-3)}.topbar .search{display:none}
  .bottombar{display:grid;grid-template-columns:repeat(4,1fr);position:fixed;left:0;right:0;bottom:0;z-index:30;background:var(--surface);border-top:1px solid var(--line);padding-bottom:env(safe-area-inset-bottom)}
  .bottombar a,.bottombar button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-height:60px;border:0;background:none;color:var(--text-2);font-size:11px;font-weight:600;text-decoration:none}
  .bottombar [aria-current=page]{color:var(--primary)}
  .auth{grid-template-columns:minmax(0,1fr)}.auth .side{display:none}
  .toasts{bottom:76px}
}
@media (max-width:699px){.stepper li:not([aria-current=step]) .lab{display:none}.stepper{gap:6px}}