:root{
  --bg-primary:#0a0a0f; --bg-secondary:#0d1117; --bg-card:#111827; --bg-card-hover:#1a2233;
  --border-subtle:rgba(255,255,255,.06); --border-glow:rgba(59,130,246,.15);
  --text-primary:#f8fafc; --text-secondary:#94a3b8; --text-muted:#64748b;
  --accent-blue:#3b82f6; --accent-purple:#8b5cf6; --accent-cyan:#06b6d4;
  --gradient-primary:linear-gradient(135deg,#3b82f6 0%,#8b5cf6 50%,#06b6d4 100%);
  --font-body:'DM Sans',system-ui,sans-serif; --font-display:'Playfair Display',serif;
}
*{box-sizing:border-box;margin:0;padding:0}
body{background:var(--bg-primary);color:var(--text-primary);font-family:var(--font-body);
  min-height:100vh;display:flex;flex-direction:column}
a{color:var(--accent-blue-light,#60a5fa);text-decoration:none}
.app-main{flex:1;max-width:1100px;width:100%;margin:0 auto;padding:24px 20px 96px}
.topnav{display:flex;gap:24px;align-items:center;padding:16px 24px;border-bottom:1px solid var(--border-subtle)}
.topnav .brand{font-family:var(--font-display);font-size:1.25rem;
  background:var(--gradient-primary);-webkit-background-clip:text;background-clip:text;color:transparent}
.topnav a{color:var(--text-secondary);font-weight:600}
.topnav a.active{color:var(--text-primary)}
.card{background:var(--bg-card);border:1px solid var(--border-subtle);border-radius:14px;padding:20px;margin-bottom:16px}
.btn{display:inline-block;border:none;border-radius:10px;padding:10px 18px;font-weight:700;cursor:pointer;
  background:var(--gradient-primary);color:#fff;
  transition:transform .16s cubic-bezier(.22,.61,.36,1),box-shadow .16s cubic-bezier(.22,.61,.36,1),
    filter .16s cubic-bezier(.22,.61,.36,1)}
/* :not(.secondary) -- the outline/secondary variant stays flat on purpose;
   the lift+glow reads as emphasis, and a secondary action isn't one. */
.btn:hover:not(.secondary){filter:brightness(1.08);transform:translateY(-1px);
  box-shadow:0 8px 22px rgba(59,130,246,.32)}
.btn:active:not(.secondary){transform:scale(.985);box-shadow:0 4px 12px rgba(59,130,246,.24)}
@media (prefers-reduced-motion:reduce){
  .btn{transition:none}
  .btn:hover:not(.secondary),.btn:active:not(.secondary){transform:none}
}
.btn.secondary{background:transparent;border:1px solid var(--border-subtle);color:var(--text-primary)}
input,select,textarea{width:100%;background:var(--bg-secondary);border:1px solid var(--border-subtle);
  border-radius:10px;padding:10px 12px;color:var(--text-primary);font-family:inherit}
label{display:block;color:var(--text-secondary);font-size:.85rem;margin:12px 0 4px}
table{width:100%;border-collapse:collapse}
th,td{text-align:left;padding:10px 12px;border-bottom:1px solid var(--border-subtle)}
th{color:var(--text-muted);font-size:.78rem;text-transform:uppercase;letter-spacing:.04em}
.badge{display:inline-block;padding:2px 10px;border-radius:999px;font-size:.72rem;font-weight:700;
  background:rgba(59,130,246,.12);color:#60a5fa}
.ai-inferred{font-size:.72rem;color:var(--accent-purple);font-weight:700;text-transform:uppercase}
.flash{background:rgba(139,92,246,.12);border:1px solid rgba(139,92,246,.35);padding:10px 14px;border-radius:10px;margin-bottom:14px}

/* Jhome footer */
.jhome-credit{text-align:center;font-size:.72rem;color:var(--text-muted);opacity:.7;
  padding:14px 0 calc(14px + env(safe-area-inset-bottom));}
.jhome-credit a{color:var(--text-muted)}

/* Mobile bottom-tab nav — Trading-Jay tokens */
#lf-mobile-nav{display:none}
@media (max-width:1024px){
  .topnav .links{display:none}
  #lf-mobile-nav{display:flex;position:fixed;bottom:0;left:0;right:0;z-index:50;
    background:#0a0c14;border-top:1px solid #1e2535;
    height:calc(60px + env(safe-area-inset-bottom));padding-bottom:env(safe-area-inset-bottom)}
  #lf-mobile-nav a{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;
    gap:3px;color:#718096;font-size:.58rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em}
  #lf-mobile-nav a .ico{font-size:1.15rem}
  #lf-mobile-nav a:hover{color:#a78bfa}
  #lf-mobile-nav a.active{color:#667eea}
  .app-main{padding-bottom:120px}
}