/* =====================================================================
   CURRENT LAYOUT SYSTEM — shared shell
   Version: 4.8.19.7
   Scope: page width, navigation, page rhythm, shared buttons/utilities.
   ===================================================================== */

:root{
  --layout-width:760px;
  --layout-gap-1:8px;
  --layout-gap-2:12px;
  --layout-gap-3:16px;
  --layout-gap-4:24px;
  --layout-line:#e2e8f0;
  --layout-surface:#ffffff;
  --layout-canvas:#f5f7fb;
}

*{box-sizing:border-box}
html,body{margin:0;min-height:100%}
body{background:var(--layout-canvas)!important}
main{
  width:100%!important;
  max-width:var(--layout-width)!important;
  margin:0 auto!important;
  padding:0 18px 36px!important;
  background:transparent!important;
}
.tab-page{display:none}
.tab-page.active{display:block}
.u-hidden{display:none!important}

/* Navigation */
.tabs.dashboard-tabs{
  display:flex!important;
  align-items:stretch!important;
  justify-content:flex-start!important;
  height:54px!important;
  min-height:54px!important;
  margin:0 0 22px!important;
  padding:0!important;
  gap:10px!important;
  overflow:visible!important;
  background:transparent!important;
  border:0!important;
  border-bottom:1px solid #dfe5ed!important;
  border-radius:0!important;
  box-shadow:none!important;
}
.dashboard-tabs .tab-btn{
  position:relative!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  flex:0 0 auto!important;
  width:auto!important;
  min-width:0!important;
  height:54px!important;
  min-height:54px!important;
  padding:0 14px!important;
  gap:7px!important;
  border:0!important;
  border-radius:0!important;
  outline:0!important;
  background:transparent!important;
  box-shadow:none!important;
  font-size:14px!important;
  line-height:1!important;
}
.dashboard-tabs .tab-btn:focus{outline:0!important;box-shadow:none!important}
.dashboard-tabs .tab-btn:focus-visible{outline:2px solid rgba(37,99,235,.25)!important;outline-offset:-4px!important}
.dashboard-tabs .tab-btn.active::after{height:2px!important}

/* Shared detail-page rhythm */
#swingPage,#fundPage{background:transparent!important}
#swingPage>.swing-tag,#fundPage>.fund-tag{margin:0 0 5px!important}
#swingPage>.subtitle,#fundPage>.subtitle{margin:0 0 16px!important;line-height:1.5!important}
#swingPage>.card,#fundPage>.card,
#swingPage>.swing-signal,#fundPage>.fund-signal,
#swingPage>.strategy-rules-details,#fundPage>.strategy-rules-details{
  margin-top:0!important;
  margin-bottom:14px!important;
}
#swingPage>:last-child,#fundPage>:last-child{margin-bottom:0!important}

/* Shared refresh button */
#dashboardPage .dashboard-refresh,
#swingPage #swingRefreshBtn,
#fundPage #fundRefreshBtn{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
  width:auto!important;
  min-width:132px!important;
  height:42px!important;
  min-height:42px!important;
  margin:0!important;
  padding:0 16px!important;
  border:1px solid #93c5fd!important;
  border-radius:12px!important;
  background:#fff!important;
  color:#2563eb!important;
  box-shadow:0 5px 14px rgba(37,99,235,.07)!important;
  font-size:13px!important;
  font-weight:650!important;
  line-height:1!important;
  cursor:pointer!important;
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease,background-color .18s ease!important;
}
#dashboardPage .dashboard-refresh::before,
#swingPage #swingRefreshBtn::before,
#fundPage #fundRefreshBtn::before{
  content:"↻"!important;
  display:inline-block!important;
  font-size:20px!important;
  line-height:1!important;
  font-weight:400!important;
  transform-origin:50% 50%;
}
#dashboardPage .dashboard-refresh:hover:not(:disabled),
#swingPage #swingRefreshBtn:hover:not(:disabled),
#fundPage #fundRefreshBtn:hover:not(:disabled){
  transform:translateY(-1px)!important;
  background:#f8fbff!important;
  border-color:#60a5fa!important;
  box-shadow:0 8px 18px rgba(37,99,235,.11)!important;
}
#dashboardPage .dashboard-refresh:active:not(:disabled),
#swingPage #swingRefreshBtn:active:not(:disabled),
#fundPage #fundRefreshBtn:active:not(:disabled){transform:translateY(0)!important}
#dashboardPage .dashboard-refresh:disabled,
#swingPage #swingRefreshBtn:disabled,
#fundPage #fundRefreshBtn:disabled{cursor:wait!important;opacity:.78!important}
#dashboardPage .dashboard-refresh:disabled::before,
#swingPage #swingRefreshBtn:disabled::before,
#fundPage #fundRefreshBtn:disabled::before{animation:ss-refresh-spin .85s linear infinite!important}
@keyframes ss-refresh-spin{to{transform:rotate(360deg)}}

@media(max-width:700px){
  main{padding:0 12px 28px!important}
  .tabs.dashboard-tabs{height:48px!important;min-height:48px!important;margin-bottom:16px!important;gap:0!important}
  .dashboard-tabs .tab-btn{flex:1 1 0!important;height:48px!important;min-height:48px!important;padding:0 5px!important;font-size:12px!important}
  #swingPage>.subtitle,#fundPage>.subtitle{margin-bottom:12px!important}
  #dashboardPage .dashboard-refresh,#swingPage #swingRefreshBtn,#fundPage #fundRefreshBtn{width:100%!important}
}