:root{color-scheme:dark;font-family:system-ui,-apple-system,sans-serif;color:#e8f0ed;background:#071410}*{box-sizing:border-box}body{margin:0}.wrap{max-width:1120px;margin:auto;padding:28px 24px 80px}header{display:flex;align-items:center;gap:20px;flex-wrap:wrap}.brand{font-size:12px;letter-spacing:.14em;color:#90a79c;margin-right:auto}a{color:#83e2ba}button{border:0;border-radius:10px;background:#84e2b7;color:#102019;padding:12px 17px;font:inherit;font-weight:650;cursor:pointer}button:disabled{opacity:.45;cursor:not-allowed}.secondary{background:#253b31;color:#ecf8f0}button:focus-visible,input:focus-visible,select:focus-visible,a:focus-visible{outline:3px solid #d8af67;outline-offset:3px}.intro{padding:48px 0 20px}.eyebrow{color:#82d4ad;font-size:11px;letter-spacing:.12em}h1{font-size:clamp(32px,5vw,54px);letter-spacing:-.04em;margin:12px 0}h2{font-size:21px;letter-spacing:-.02em;margin-top:0}p{line-height:1.65;color:#aabfb3}.notice{border-left:3px solid #bc965c;padding:10px 18px;max-width:860px;background:#14221b}.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:14px;margin:16px 0 28px}.card,.panel{background:#10231a;border:1px solid #294336;border-radius:16px;padding:24px}.card strong{display:block;font-size:28px;margin-top:12px}.card span{color:#a7beb0;font-size:13px}.panel{margin-bottom:20px}.row{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:18px 0;border-bottom:1px solid #294336;flex-wrap:wrap}.row:last-child{border-bottom:0}.row small{display:block;color:#abc0b1;line-height:1.6;margin-top:5px;overflow-wrap:anywhere}.actions{display:flex;gap:8px;flex-wrap:wrap}.forms{display:grid;grid-template-columns:1fr 1fr;gap:20px}fieldset{border:0;padding:0;min-width:0}legend{color:#b2c9ba;margin-bottom:18px}label{display:block;color:#c7d9ce;margin:16px 0}input,select{display:block;width:100%;min-width:0;margin-top:8px;border:1px solid #3a5848;border-radius:8px;background:#071710;color:#fff;padding:13px;font:inherit}form p{font-size:13px}footer{margin-top:30px;color:#8da798;font-size:12px;line-height:1.8}#message{color:#f1cc84}#message:empty{display:none}[hidden]{display:none!important}@media(max-width:650px){.wrap{padding:20px 16px 50px}.forms{grid-template-columns:1fr}.panel{padding:20px}.row{align-items:flex-start}.intro{padding-top:34px}header button{padding:10px 12px}}

/* Shared mobile presentation; does not change trading or account state. */
@media(max-width:1100px){
  .shell>.desktop-nav{display:none}
  .shell>main{margin-left:0;padding-bottom:calc(112px + env(safe-area-inset-bottom,0px))}
  .shell>.mobile-nav{position:fixed;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));left:max(7px,env(safe-area-inset-left,0px));right:max(7px,env(safe-area-inset-right,0px));bottom:calc(8px + env(safe-area-inset-bottom,0px));background:rgba(255,255,255,.97);backdrop-filter:blur(16px);border:1px solid #d3e1d9;border-radius:15px;padding:6px;z-index:30;box-shadow:0 6px 24px #163b2926}
  .shell>.mobile-nav .nav-item{min-width:0;min-height:48px;margin:0;padding:6px 2px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:2px;font-size:11px;line-height:1.4;color:#526b60;text-align:center}
  .shell>.mobile-nav .nav-item span{font-size:17px}
  .shell>.mobile-nav .nav-item.active{color:#075c42;background:#eaf6f0}
  .shell>.mobile-nav .emergency-link{color:#9c3732}
  .shell .topbar~main .connection-warning{position:relative;top:auto}
  .shell .topbar.topbar-unified .nas-panel,
  .shell .topbar.topbar-unified .currency-info>p{max-height:calc(100dvh - 340px);overscroll-behavior:contain}
  .shell .toast{bottom:calc(100px + env(safe-area-inset-bottom,0px));left:14px;right:14px;overflow-wrap:anywhere}
  main button,main select,main summary,main input:not([type=checkbox]):not([type=radio]),
  .wrap header button,.wrap header>a,.wrap nav.actions>a{min-height:44px}
  main button{min-width:44px}
  main summary{align-content:center;cursor:pointer}
  main input:not([type=checkbox]):not([type=radio]),main select{font-size:16px}
  main .text-button,main .reset-demo{font-size:13px;line-height:1.5}
  main .help{width:44px;height:44px;flex-shrink:0}
  .wrap header>a,.wrap nav.actions>a{display:inline-flex;align-items:center;padding:8px 4px}
  .wrap{padding-bottom:calc(50px + env(safe-area-inset-bottom,0px))}
  .wrap header,.wrap .actions{gap:12px}
  main :focus-visible{outline:3px solid #3079be;outline-offset:3px}
}
@media(max-width:620px){
  .shell .goal-cards{display:grid!important;grid-template-columns:minmax(0,1fr)!important;overflow:visible}
  .shell .goal-cards .goal-card{min-width:0}
  .shell .goal-card p{min-height:0}
  .shell .card-head,.shell .board-head{flex-wrap:wrap}
  .shell .card-head>*,.shell .board-head>*,.shell .page-head>*{min-width:0;max-width:100%}
  .shell .page-head{flex-wrap:wrap;gap:10px}
  .shell .performance{flex-wrap:wrap}
  .shell .goal-stat,.shell .capital-number{flex-wrap:wrap}
  .shell .allocation-legend span{font-size:12px;overflow-wrap:anywhere}
  .shell .risk-explain,.shell .wealth-limits-note,.shell .wealth-actual-note{font-size:13px;line-height:1.6}
  .wrap .row>*{min-width:0;max-width:100%;overflow-wrap:anywhere}
  .wrap .panel{padding:18px}
}
@media(max-width:1100px) and (max-height:550px){
  .shell .topbar.topbar-unified .nas-panel,
  .shell .topbar.topbar-unified .currency-info>p{position:fixed;top:12px;left:12px;width:min(420px,calc(100vw - 24px));max-height:calc(100dvh - 112px);overflow:auto}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.page.active{animation:none}}