/* Approved member dashboard: compact portrait composition at every width. */
.dashboard {
  --nav-height: 62px;
  width: min(100%, 480px);
  height: min(100dvh, 960px);
  margin: 0 auto;
  padding: 16px 17px calc(var(--nav-height) + 14px + env(safe-area-inset-bottom));
  display: grid;
  grid-template-rows: clamp(42px, 7dvh, 56px) clamp(140px, 22dvh, 198px) clamp(62px, 11dvh, 88px) minmax(0, 1fr);
  gap: 12px;
  overflow: hidden;
}
.dashboard-grid, .wallet-column, .market-column { display: contents; }
.dashboard .topbar { margin: 0; min-width: 0; }
.dashboard .welcome { gap: 10px; min-width: 0; }
.dashboard .avatar { width: 43px; height: 43px; background: linear-gradient(145deg,#00dded24,#701ad858); border-color:#00d4e1; }
.dashboard .avatar .icon { width: 27px; height: 27px; color: #d2b7ed; }
.dashboard .welcome small { font-size: 11px; color: #f2f1ff; }
.dashboard .welcome h1 { font-size: 19px; line-height: 1.25; max-width: 130px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dashboard .header-right { gap: 9px; }
.dashboard .header-right .brand { gap: 5px; font-size: 13px; letter-spacing: 1px; }
.dashboard .header-right .brand img { width: 23px; height: 23px; }
.notification-button { position: relative; border-left: 1px solid #595374; padding: 3px 0 3px 12px; color: #d3d4ee; }
.notification-button i { position:absolute;right:0;top:0;width:6px;height:6px;border-radius:50%;background:var(--cyan); }
.dashboard .asset-card {
  padding: 12px 16px;
  border-radius: 16px;
  border: 1px solid #a33cdb;
  background: url('/assets/asset-wave.svg') right bottom / 62% 60% no-repeat, linear-gradient(120deg,#10132d,#080a20);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-height: 0;
}
.dashboard .asset-card:after { display:none; }
.dashboard .asset-top { margin: 0; min-height: 25px; }
.dashboard .asset-label { font-size: 12px; gap: 7px; }
.dashboard .asset-label .icon-button { padding: 3px; }
.dashboard .currency-switch { padding: 2px; border-radius: 10px; }
.dashboard .currency-switch button { font-size: 10px; padding: 5px 12px; }
.dashboard .balance { font-size: clamp(27px,4.4dvh,36px); line-height: 1.05; letter-spacing: -1px; }
.dashboard .equivalent { font-size: 12px; margin: 0; }
.dashboard .pnl { font-size: 11px; margin: 0; gap: 7px; }
.dashboard .rate-info { font-size: 8px; line-height: 1.2; margin: 0; white-space: nowrap; }
.dashboard .action-row { margin: 0; align-items: center; gap: 7px; }
.dashboard .action { font-size: 11px; gap: 8px; }
.dashboard .action-circle { width: 45px; height: 45px; border-color: #8842bb; }
.dashboard .action-circle .icon { width: 24px; height: 24px; }
.dashboard .market-panel { min-height: 0; height: 100%; padding: 0; border:1px solid #8540cd; border-radius:16px; display:flex;flex-direction:column; }
.dashboard .market-header { padding: 12px 13px 0; flex-shrink:0; align-items:start; }
.dashboard .market-header h2 { font-size: 16px; letter-spacing: -.2px; }
.dashboard .market-header p { font-size: 11px; margin-top: 3px; }
.market-quote { text-align:right; line-height:1.2; }
.market-quote strong { font-size:16px; letter-spacing:-.3px; }
.market-quote small { font-size:9px;color:#b7b8d7; }
.market-quote > span { display:block; font-size:12px; font-weight:600; margin-top:4px; }
.negative { color:var(--red); }
.chart-controls { display:flex; align-items:center; margin:9px 12px 6px; gap:3px; flex-shrink:0; }
.chart-controls button { border:0;background:#171a35;border-radius:7px;font-size:10px;padding:6px 10px;color:#c1c5e1; }
.chart-controls button.active { background:var(--cyan);color:#001b26;font-weight:700;box-shadow:0 0 10px #00e4ed22; }
.market-status { margin-left:auto; font-size:8px; color:#b3a7d3; white-space:nowrap; }
.market-status.is-live { color:var(--cyan); }
.market-status.is-live:before { content:'';display:inline-block;margin-right:4px;width:4px;height:4px;background:var(--cyan);border-radius:50%; }
.dashboard .chart-container { flex:1;min-height:0;height:auto;margin:0 5px; }
.dashboard .chart-container iframe { display:block; width:100%; height:100%; }
.dashboard .market-footer { padding:5px 11px 7px; font-size:7px; line-height:1.2; display:flex;justify-content:space-between;gap:6px;flex-shrink:0;border:0; }
body:has(.dashboard) .bottomnav { width:min(100%,480px);left:50%;right:auto;transform:translateX(-50%);height:calc(62px + env(safe-area-inset-bottom));padding:7px 10px calc(9px + env(safe-area-inset-bottom));gap:0;justify-content:space-around; }
body:has(.dashboard) .nav-item { flex:1;min-width:0;max-width:80px;font-size:10px;padding:3px 0;gap:5px; }
body:has(.dashboard) .nav-item .icon { width:21px;height:21px; }
body:has(.dashboard) .nav-item.active:after { bottom:-4px;width:34px; }
@media(max-width:350px){
 .dashboard { padding-left:12px;padding-right:12px;gap:10px; }
 .dashboard .header-right .brand{font-size:11px;}
 .dashboard .welcome h1{font-size:17px;max-width:100px;}
 .dashboard .asset-card{padding-left:12px;padding-right:12px;}
 .dashboard .pnl{font-size:10px;}
 .chart-controls button{padding:5px 8px;}
}
@media(max-height:600px){
 .dashboard { height:auto;min-height:100dvh;overflow:visible;grid-template-rows:42px 140px 62px 280px; }
}

.dashboard .avatar img { width:100%;height:100%;border-radius:50%; }

.dashboard .chart-container { overflow:hidden; }
.dashboard .market-footer a { color:#9098b5; text-decoration:none; }

/* Profile avatar choices share the illustrated dashboard avatar system. */
.dashboard button.avatar { padding:0;cursor:pointer;flex-shrink:0; }
.profile-identity { font-size:13px;line-height:1.6;margin-bottom:18px;overflow-wrap:anywhere; }
.avatar-fieldset { padding:0;border:0;margin:0 0 12px;min-width:0; }
.avatar-fieldset legend { font-size:13px;font-weight:600;margin-bottom:13px; }
.avatar-grid { display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px 8px; }
.avatar-choice { display:flex;flex-direction:column;align-items:center;gap:5px;cursor:pointer;font-size:9px;color:#b8b9d9;position:relative; }
.avatar-choice input { position:absolute;opacity:0;width:100%;height:100%;margin:0;cursor:pointer; }
.avatar-choice img { width:100%;max-width:55px;aspect-ratio:1;border-radius:50%;border:2px solid transparent;padding:2px; }
.avatar-choice:has(input:checked) img { border-color:var(--cyan);background:#00e4ed15;box-shadow:0 0 13px #00e4ed22; }
.avatar-choice:has(input:checked) { color:var(--cyan); }
.avatar-choice:has(input:focus-visible) img { outline:2px solid var(--cyan);outline-offset:3px; }
#avatar-feedback { min-height:17px;font-size:12px;margin:0 0 10px;line-height:1.4; }
#avatar-form .primary { min-height:44px; }

/* Holdings destinations in the compact member navigation. */
.bottomnav .nav-item span{white-space:nowrap}.holdings-modal .holdings-heading{display:flex;align-items:center;gap:10px;margin-bottom:18px}.holdings-heading>.icon{width:25px;height:25px;color:var(--cyan)}.holdings-modal h2{font-size:21px;margin:0}.holdings-empty{text-align:center;padding:12px 0 4px}.holdings-empty-icon{display:inline-flex;align-items:center;justify-content:center;width:72px;height:72px;border:1px solid #8b47bf;border-radius:22px;background:linear-gradient(145deg,#00dbe51a,#8723b82a);margin-bottom:15px}.holdings-empty-icon .icon{width:37px;height:37px;color:var(--cyan)}.holdings-empty h3{font-size:17px;margin:0 0 10px}.holdings-empty p{font-size:12px;line-height:1.7;margin-bottom:20px}.holdings-empty .primary{font-size:13px;min-height:42px}

/* Approved rounded menu icon system. */
.dashboard .action-circle{background:radial-gradient(circle at 50% 25%,#211536,#101126);border-color:#a866ee;color:#ddd5fa}
.dashboard .action:first-child .action-circle{background:radial-gradient(circle at 50% 25%,#211536,#101126);border-color:#a866ee;color:#ddd5fa}
.dashboard .action-circle .icon{width:25px;height:25px;stroke-width:1.8}
.bottomnav .nav-item{border-radius:12px;color:#c5bddf;position:relative;gap:5px}
.bottomnav .nav-item .icon{width:25px;height:25px;stroke-width:1.8}
.bottomnav .nav-item.active{background:linear-gradient(145deg,#00e4ed18,#00e4ed08);color:var(--cyan)}
.bottomnav .nav-item.active:after{height:3px;width:22px;bottom:-4px;border-radius:3px}

/* Cinematic ribbon artwork stays behind real account data and controls. */
.dashboard .asset-card{background:#05071b;box-shadow:0 0 18px #9633df16}
.dashboard .asset-card>.balance-art{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden;border-radius:inherit}
.balance-art img,.balance-art video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:right bottom}
.balance-art video{opacity:0}.balance-art.video-ready video{opacity:1}
.balance-art:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#05071b40,transparent 72%);pointer-events:none}
.dashboard .asset-card>:not(.balance-art){position:relative;z-index:1}
@keyframes home-enter{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
@keyframes home-live{50%{opacity:.4}}
@media(prefers-reduced-motion:no-preference){
 .dashboard .asset-card,.dashboard .action-row,.dashboard .market-panel{animation:home-enter .4s ease both}
 .dashboard .action-row{animation-delay:.06s}.dashboard .market-panel{animation-delay:.12s}
 .dashboard .action-circle{transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease}
 .dashboard .action:active .action-circle{transform:translateY(-2px) scale(.94);border-color:var(--cyan);box-shadow:0 0 12px #00e4ed30}
 .dashboard .market-status.is-live:before{animation:home-live 2.6s ease-in-out infinite}
 .dashboard.home-motion-paused *{animation-play-state:paused!important}
 .bottomnav .nav-item{transition:background .18s ease,color .18s ease}
}