/* Four module views share the existing state and market request lifecycle. */
html,body{height:auto;min-height:100%;overflow:auto}
body{font-size:17px}
main{display:block;width:min(100%,1280px);height:auto;min-height:100vh;margin:0 auto;padding:24px;overflow:visible}
header{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;margin:0 0 20px;min-height:0}
header h1{font-size:28px;line-height:1.3}
.header-actions{display:flex;gap:10px}
.header-actions button{min-height:44px;font-size:16px}
.date{font-size:15px}
.page-nav{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));position:sticky;top:0;z-index:3;background:var(--bg);border-bottom:1px solid var(--line);margin-bottom:20px}
.page-nav a{display:flex;align-items:center;justify-content:center;min-height:54px;padding:8px;color:var(--muted);text-decoration:none;font-size:18px;font-weight:750;border-bottom:3px solid transparent;text-align:center}
.page-nav a[aria-current="page"]{color:var(--blue);border-bottom-color:var(--blue);background:#edf4fa}
.page-nav a:hover{background:#e8eef2}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #1769c2;outline-offset:3px}
.page-heading h2{font-size:23px;line-height:1.4;margin:0 0 20px}
.page-heading h2:focus{outline:none}
.app-page[hidden],.settings-backdrop[hidden]{display:none!important}
.app-page{display:grid;gap:22px;min-width:0;align-items:start}
.app-page>.panel,.app-page>.status,.app-page>.reference-section{grid-area:auto;grid-column:auto;margin:0;min-height:0;max-height:none;overflow:visible}
.app-page>.panel,.app-page>.reference-section{padding:20px;background:white;border:0;border-top:1px solid var(--line);border-radius:0;box-shadow:none}
.page-today{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:"signal orders" "quote orders" "rebalance rebalance"}
.page-today>#statusCard{grid-area:signal;padding:20px}
.page-today>.market-panel{grid-area:quote}
.page-today>#ordersPanel{grid-area:orders}
.page-today>#rebalancePanel{grid-area:rebalance}
.page-holdings{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.page-market,.page-history{grid-template-columns:minmax(0,1fr)}
.panel-title{font-size:20px;margin-bottom:16px}
.status-label{font-size:16px}.status-action{font-size:28px;line-height:1.35}.status-detail{font-size:16px;margin-top:10px}.status-warning{font-size:15px;line-height:1.5}
.metrics{gap:12px;margin-top:12px}.metric{padding:14px 12px;border-radius:6px}.metric span{font-size:15px;white-space:normal}.metric strong{font-size:24px;margin-top:8px}
.app-page .note,.app-page .market-panel>.note,.app-page .holdings-panel>.note{display:block;font-size:14px;line-height:1.6;margin-top:12px}
.order{padding:14px 0;gap:12px}.sub{font-size:16px;line-height:1.5}.badge{font-size:14px}.money{font-size:18px;overflow-wrap:anywhere}
.actions{margin-top:16px;gap:12px}.actions button{min-height:46px;font-size:17px}
.page-link{display:inline-block;margin-top:16px;color:var(--blue);font-size:16px;text-underline-offset:4px;line-height:1.5}
.checklist{display:block;margin-top:20px;padding-top:12px}.checkitem{font-size:14px;line-height:1.55}
.rebalance-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 30px}
.rebalance-item{font-size:17px;padding:10px 0;gap:16px;line-height:1.5}
.rebalance-item.portfolio-total,.rebalance-item.portfolio-pnl{grid-column:auto}
.rebalance-item.portfolio-total strong,.rebalance-item.portfolio-pnl strong{font-size:21px}
.allocation-panel #allocation{display:block}.allocation{font-size:16px;padding:12px 0}
.allocation-panel .field,.holdings-inputs .field{padding:12px;margin-top:12px;min-width:0}
.allocation-panel .field label,.holdings-inputs .field label{font-size:16px;white-space:normal;line-height:1.5}
.allocation-panel .field input,.holdings-inputs .field input{font-size:23px}
.allocation-panel .ratio-grid{margin-top:16px;gap:12px}
.allocation-panel .ratio-field{display:block;padding:12px 10px;margin:0}
.allocation-panel .ratio-field input{display:block;text-align:left;margin:8px 0}
.allocation-panel .ratio-target{font-size:14px;line-height:1.5;text-align:left;white-space:normal;overflow:visible}
.allocation-panel .ratio-total{font-size:15px;margin-top:12px;line-height:1.5}
.allocation-panel .actions{margin-top:16px}.allocation-panel .actions button{min-height:48px;font-size:16px;padding:10px;line-height:1.5}
.small-select{font-family:inherit;font-size:15px;min-height:40px;max-width:180px}
.holdings-panel #quotes{display:none}
.holdings-inputs .field{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr) 68px}
.holdings-inputs .change{font-size:16px}.holding-price{display:block;margin:4px 0 0;font-size:14px;font-weight:500}
.holdings-panel .panel-title[style]{display:none}
.signal-history-panel{display:block;grid-template-columns:none;grid-template-rows:none}
.signal-history-panel .signal-history{max-height:none;overflow:auto;margin-top:16px;grid-area:auto}
.signal-history-panel .signal-history table{font-size:16px}.signal-history-panel .signal-history th,.signal-history-panel .signal-history td{padding:12px 10px}
.signal-history-panel .panel-title{margin-bottom:16px}.history-clear{font-size:15px;min-height:40px}
.recent-history-panel .history-title{font-size:20px;border:0;padding:0;margin:0 0 16px}
.history-row{grid-template-columns:100px minmax(0,1fr) auto;gap:12px;font-size:16px;padding:14px 0}.history-done{font-size:15px;min-height:40px}
.page-history>.usage-guide{margin:0;border-top:1px solid var(--line);padding:20px 0}
.usage-guide-title{font-size:20px}.usage-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;margin-top:16px}
.usage-item{padding:0;border:0;background:none}.usage-item strong{font-size:17px}.usage-item span{font-size:15px;line-height:1.65;margin-top:8px}
.reference-grid{gap:30px}.reference-section h2{font-size:20px}.reference-section h3{font-size:18px}.reference-note{font-size:14px}
.context-heading{font-size:20px;flex-wrap:wrap}.context-grid{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:28px;margin-top:20px}
.context-card{padding:0;border:0;border-radius:0;background:none}.context-card-title{font-size:18px;margin-bottom:14px;line-height:1.5}.qqq-influence-date{display:block;font-size:14px;font-weight:500;color:var(--muted)}
.vxn-value{font-size:34px}.vxn-meta{font-size:15px;line-height:1.5}.vxn-guide,.context-note{font-size:14px;line-height:1.7}.vxn-guide strong{font-size:16px}.context-table{font-size:16px}.context-table th,.context-table td{padding:12px 4px}
.settings-backdrop{position:fixed;inset:0;background:rgba(23,32,38,.35);z-index:8}
body.settings-visible{overflow:hidden}
#settingsPanel.open{position:fixed;z-index:9;top:50%;left:50%;transform:translate(-50%,-50%);display:block;width:min(720px,calc(100% - 24px));max-height:calc(100dvh - 24px);overflow:auto;padding:20px;margin:0;box-shadow:0 16px 50px #17202640}
#settingsPanel .panel-title{font-size:20px}#settingsPanel .note{font-size:14px}#settingsPanel .field{padding:12px}#settingsPanel label{font-size:16px}#settingsPanel input{font-size:18px}
.toast{z-index:10}
@media(max-width:899px){
  main{padding:18px 16px}.page-today,.page-holdings{grid-template-columns:minmax(0,1fr);grid-template-areas:none}
  .page-today>#statusCard,.page-today>.market-panel,.page-today>#ordersPanel,.page-today>#rebalancePanel{grid-area:auto}
  .reference-grid,.context-grid{grid-template-columns:minmax(0,1fr)}.usage-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:599px){
  main{padding:16px 12px max(24px,env(safe-area-inset-bottom))}header{gap:12px;margin-bottom:14px}header h1{font-size:24px}.header-actions{width:100%}.header-actions button:first-child{flex:1}
  .page-nav{margin-bottom:16px}.page-nav a{font-size:15px;min-height:52px;padding:6px 2px}.page-heading h2{font-size:21px;margin-bottom:16px}
  .app-page{gap:18px}.app-page>.panel,.app-page>.reference-section{padding:16px 12px}.page-today>#statusCard{padding:16px}
  .status-action{font-size:25px}.status-detail{font-size:15px}.metrics{gap:6px;grid-template-columns:repeat(3,minmax(0,1fr))}.metric{padding:10px 6px}.metric span{font-size:13px}.metric strong{font-size:20px}
  .rebalance-list{grid-template-columns:1fr;gap:4px}.rebalance-item{font-size:16px}.rebalance-item.portfolio-total strong,.rebalance-item.portfolio-pnl strong{font-size:19px}
  .allocation-panel .ratio-grid{gap:6px}.allocation-panel .ratio-field{padding:10px 6px}.allocation-panel .ratio-target{font-size:12px}
  .holdings-inputs .field{grid-template-columns:minmax(0,1fr) minmax(0,.8fr) 56px;padding:10px 8px}.holdings-inputs .field input{font-size:20px}.holdings-inputs .change{font-size:14px}.holding-price{font-size:13px}
  .history-row{grid-template-columns:90px minmax(0,1fr);font-size:14px}.history-row .state{grid-column:2;text-align:left}
  .context-table{font-size:14px}.context-table th,.context-table td{padding:10px 2px}.usage-item strong{font-size:16px}
}