:root{font-family:Inter,"Segoe UI",Roboto,Arial,sans-serif;color:#172033;background:#fff;font-synthesis:none;text-rendering:optimizeLegibility}*{box-sizing:border-box}body{margin:0;min-width:320px}.topbar{height:56px;background:#102e55;color:#fff;display:flex;align-items:stretch;padding:0 max(24px,calc((100vw - 1600px)/2));gap:34px;box-shadow:0 2px 8px #102e5526}.brand{display:flex;align-items:center;color:#fff;text-decoration:none;font-weight:700;white-space:nowrap}.topbar nav{display:flex;gap:4px}.topbar nav a{display:flex;align-items:center;padding:0 18px;color:#d9e4f2;text-decoration:none;font-size:14px}.topbar nav a:hover,.topbar nav a.active{color:#fff;background:#ffffff18}.topbar nav a.active{box-shadow:inset 0 -3px #66aaf7}.container{max-width:1600px;margin:36px auto;padding:0 24px}.page-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}.page-heading h1,.login-card h1{font-size:28px;letter-spacing:-.03em;margin:0 0 6px}.muted{color:#697589;margin:0;font-size:14px}.cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin:24px 0 34px}.card{border:1px solid #e3e8ef;border-radius:8px;padding:18px 20px;min-height:105px;box-shadow:0 2px 8px #102e5508}.card span,.card small{display:block;color:#697589;font-size:13px}.card strong{display:block;margin:11px 0 4px;font-size:21px;font-weight:650;letter-spacing:-.02em}.card small{margin-top:-1px}.positive{color:#13814a}.negative{color:#c43e42}.table-section{border:1px solid #e3e8ef;border-radius:8px;overflow:hidden}.section-heading{display:flex;align-items:center;justify-content:space-between;padding:17px 20px;border-bottom:1px solid #e3e8ef}.section-heading h2{font-size:18px;margin:0}.section-heading span{font-size:13px;color:#697589}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;white-space:nowrap}th,td{text-align:right;padding:11px 12px;border-bottom:1px solid #edf0f4;font-size:14px}th{background:#f7f9fc;color:#59677a;font-weight:600;font-size:12px;letter-spacing:.02em}th:first-child,td:first-child{text-align:left}tbody tr:last-child td{border-bottom:0}tbody tr:hover{background:#fafbfd}td small{display:block;color:#7c8798;font-size:11px;margin-top:3px}.stock-name{font-weight:600}.footnote{font-size:12px;color:#7c8798;margin-top:14px}.login-card{max-width:420px;margin:8vh auto;border:1px solid #e3e8ef;border-radius:10px;padding:28px;box-shadow:0 8px 30px #102e5510}.login-card form{display:grid;gap:16px;margin-top:24px}.login-card label{display:grid;gap:7px;color:#425067;font-size:13px}.login-card input{height:42px;border:1px solid #cfd7e2;border-radius:6px;padding:0 11px;font:inherit}.login-card button,.secondary{border:0;border-radius:6px;background:#1559a6;color:#fff;font:inherit;font-weight:600;padding:11px 16px;cursor:pointer}.secondary{background:#eef3f8;color:#24456e;padding:9px 13px}.error{color:#9e242d;background:#fff1f1;border:1px solid #f0c9cb;border-radius:6px;padding:11px 13px;font-size:13px}.notice{background:#fff8e7;border:1px solid #f0dfad;padding:12px;border-radius:6px;color:#5f5128;font-size:13px;line-height:1.5}.notice code{overflow-wrap:anywhere}@media(max-width:760px){.topbar{padding:0 16px;gap:14px}.topbar nav a{padding:0 12px}.container{margin:24px auto;padding:0 16px}.cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.card{padding:14px;min-height:96px}.card strong{font-size:18px}th,td{padding:12px 13px}}

/* Two-level, sticky navigation */
.site-header{position:sticky;top:0;z-index:30;box-shadow:0 2px 8px #102e5518}.topbar{height:48px;gap:24px;padding:0 max(24px,calc((100vw - 1600px)/2))}.brand{font-size:15px}.topbar nav a{font-size:14px;padding:0 14px}.subbar{height:40px;display:flex;align-items:stretch;gap:0;overflow-x:auto;white-space:nowrap;padding:0 max(24px,calc((100vw - 1600px)/2));background:#f7f9fc;border-bottom:1px solid #dfe5ec}.subbar a{display:flex;align-items:center;padding:0 14px;color:#425067;text-decoration:none;font-size:14px;font-weight:600}.subbar a:hover,.subbar a.active{color:#1559a6}.subbar a.active{box-shadow:inset 0 -2px #1559a6}@media(max-width:760px){.topbar{height:46px;padding:0 16px;gap:14px}.topbar nav a{font-size:14px;padding:0 12px}.subbar{height:38px;padding:0 16px}.subbar a{font-size:14px;padding:0 12px}}

/* Fixed two-row header aligned like the reference navigation */
body{padding-top:88px;scroll-padding-top:88px}.site-header{position:fixed;top:0;left:0;right:0;z-index:100;background:#fff;box-shadow:0 2px 8px #102e5518}.topbar{display:grid;grid-template-columns:max-content minmax(0,1fr);column-gap:24px;height:48px;padding:0 max(24px,calc((100vw - 1600px)/2));align-items:stretch}.topbar nav{min-width:0}.subnav-line{display:grid;grid-template-columns:max-content minmax(0,1fr);column-gap:24px;min-height:40px;padding:0 max(24px,calc((100vw - 1600px)/2));background:#f7f9fc;border-top:1px solid #dfe5ec;border-bottom:1px solid #dfe5ec}.subnav-spacer{display:block}.subbar{display:flex;align-items:stretch;gap:0;min-width:0;overflow-x:auto;white-space:nowrap;padding:0;background:transparent;border:0}.subbar a{display:flex;align-items:center;padding:0 14px;color:#425067;text-decoration:none;font-size:14px;font-weight:600;border:1px solid #dfe5ec;margin-right:-1px;background:#f7f9fc}.subbar a:first-child{border-left-color:#dfe5ec}.subbar a:hover,.subbar a.active{color:#1559a6;background:#fff}.subbar a.active{box-shadow:inset 0 -2px #1559a6}@media(max-width:760px){body{padding-top:84px;scroll-padding-top:84px}.topbar{height:46px;padding:0 16px;column-gap:14px}.topbar nav a{font-size:14px;padding:0 12px}.subnav-line{min-height:38px;padding:0 16px;column-gap:14px}.subbar a{font-size:14px;padding:0 12px}}

/* Lightly separate the historical snapshot from the delayed quote section. */
.group-row th{font-size:12px;text-align:center;padding:10px 12px;border-bottom:1px solid #dfe5ec}
.group-row .stock-col{text-align:left;background:#f7f9fc}
.snapshot-group,.snapshot-col{background:#fbfcfe}
.latest-group,.latest-col{background:#f4f8fc}
thead .snapshot-col,thead .latest-col{font-size:11px}
tbody tr:hover .snapshot-col{background:#f4f7fb}
tbody tr:hover .latest-col{background:#eaf2fb}
@media(max-width:760px){.group-row th{padding:9px 10px}}
.tracking-status{font-size:11px}.tracking-available{color:#13814a}.tracking-unavailable{color:#9e242d}.tracking-unknown{color:#7c8798}

/* Keep all portfolio columns visible on wide screens, including Time passed. */
.container{max-width:1600px}
.table-wrap{overflow-x:auto}
.table-wrap table{width:100%;min-width:0;table-layout:fixed;white-space:normal}
.table-wrap col.stock-column{width:23%}
.table-wrap col.snapshot-column{width:7%}
.table-wrap col.latest-price-column{width:8%}
.table-wrap col.latest-value-column{width:7%}
.table-wrap col.latest-return-column{width:6%}
.table-wrap col.latest-profit-column{width:8%}
.table-wrap col.latest-time-column{width:13%}
.table-wrap th,.table-wrap td{padding:10px 8px;font-size:13px}
.table-wrap td:not(:first-child),.table-wrap th:not(:first-child){white-space:nowrap}
.table-wrap .stock-name{white-space:normal;overflow-wrap:anywhere}
.table-wrap .time-cell{white-space:normal!important;line-height:1.3}
.table-wrap .time-cell small{white-space:normal;overflow-wrap:anywhere}
@media(max-width:760px){.table-wrap th,.table-wrap td{padding:9px 6px;font-size:12px}}
