/* ─── The Jungle Room — AI Tech Stock Tracker ─────────────────────────────── */

/* ── CSS Custom Properties ── */
:root {
  --bg:      #fdf6ee;
  --bg2:     rgba(255,255,255,0.84);
  --bg3:     rgba(212,232,194,0.35);
  --text1:   #3b2a1a;
  --text2:   #6b4e35;
  --text3:   #a08060;
  --border1: #c8a880;
  --border2: #dfc9a8;
  --border3: #ede0cc;
  --accent:  #6b4226;
  --radius:  10px;
  --font:    -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

/* ── Reset ── */
* { box-sizing: border-box; margin: 0; padding: 0; }
body { font-family: var(--font); background: var(--bg); color: var(--text1); font-size: 15px; overflow-x: hidden; min-height: 100vh; position: relative; }
#bg-leaves { position: fixed; inset: 0; width: 100%; height: 100%; pointer-events: none; z-index: 0; opacity: 0.55; }
.wrap { max-width: 900px; margin: 0 auto; padding: 24px 18px 60px; position: relative; z-index: 1; }
html { scroll-behavior: smooth; }

/* ── Last updated ── */
.last-updated { margin-bottom: 20px; padding-bottom: 18px; border-bottom: 1px solid var(--border2); }
.last-updated .label    { font-size: 12px; text-transform: uppercase; letter-spacing: .08em; color: var(--text3); margin-bottom: 4px; }
.last-updated .date     { font-size: 30px; font-weight: 700; color: var(--accent); line-height: 1.1; }
.last-updated .subtitle { font-size: 13px; color: var(--text3); margin-top: 4px; }

/* ── Jungle Book heading ── */
.jungle-heading { position: relative; border-radius: var(--radius); overflow: hidden; background: linear-gradient(135deg,#dff0d8 0%,#fdf6ee 60%,#fff5e0 100%); border: 1px solid var(--border2); margin-bottom: 18px; height: 155px; display: flex; align-items: center; justify-content: center; }
.jh-title { text-align: center; position: relative; z-index: 2; }
.jh-the { font-family: Georgia,serif; font-style: italic; font-size: 19px; color: #6b4226; display: block; margin-bottom: 2px; }
.jh-main { font-size: 54px; font-weight: 900; letter-spacing: 1px; line-height: 1; text-shadow: 1px 2px 6px rgba(0,0,0,.14); }
.jh-sp { display: inline-block; width: 14px; }
.jh-deco { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 1; pointer-events: none; }

/* ── Jungle nav bar ── */
.jungle-nav { position: sticky; top: 0; z-index: 100; background: rgba(253,246,238,0.96); backdrop-filter: blur(10px); border-bottom: 1.5px solid var(--border2); display: flex; align-items: center; justify-content: space-between; padding: 7px 0; margin-bottom: 14px; }
.jnav-brand { font-weight: 700; font-size: 13px; color: var(--accent); font-style: italic; white-space: nowrap; }
.jnav-links { display: flex; gap: 5px; flex-wrap: wrap; }
.jnav-link { font-size: 12px; padding: 8px 11px; border-radius: 0; text-decoration: none; color: var(--text2); border: none; background: none; cursor: pointer; font-family: inherit; transition: color .15s, border-color .15s; white-space: nowrap; border-bottom: 2.5px solid transparent; display: inline-block; }
.jnav-link:hover { color: var(--accent); }
.jnav-link.active { color: var(--accent); border-bottom-color: var(--accent); font-weight: 700; }

/* ── Share button ── */
.jnav-share-wrap { position: relative; }
.jnav-share-btn { background:linear-gradient(135deg,#2d7a2d,#4a8c2a); color:#fff; border:none; border-radius:20px; padding:5px 13px; font-size:12px; font-weight:700; cursor:pointer; display:flex; align-items:center; gap:5px; font-family:var(--font); transition:opacity .15s; white-space:nowrap; }
.jnav-share-btn:hover { opacity:.85; }
.jnav-share-menu { position:absolute; top:calc(100% + 8px); right:0; background:#fff; border:1px solid var(--border2); border-radius:12px; box-shadow:0 6px 24px rgba(0,0,0,.13); padding:6px; z-index:200; min-width:175px; display:none; }
.jnav-share-menu.open { display:block; }
.jnav-share-item { display:flex; align-items:center; gap:9px; padding:9px 12px; border-radius:8px; cursor:pointer; font-size:13px; color:var(--text1); border:none; background:none; width:100%; text-align:left; font-family:var(--font); }
.jnav-share-item:hover { background:var(--bg3); }

/* ── Market clock bar ── */
.market-clock-bar { display:flex; align-items:stretch; background:linear-gradient(135deg, #3d7a22 0%, #2b5e38 100%); border-radius:14px; margin-bottom:10px; padding:18px 28px; gap:0; border:1px solid rgba(120,220,60,.35); box-shadow:inset 0 1px 0 rgba(120,200,80,.06); }
.mc-market { flex:1; display:flex; flex-direction:column; align-items:center; gap:5px; }
.mc-divider { width:1px; background:rgba(74,140,42,.2); margin:0 28px; flex-shrink:0; }
.mc-flag-name { font-size:10px; font-weight:800; color:rgba(160,210,120,.45); letter-spacing:.18em; text-transform:uppercase; }
.mc-status-row { display:flex; align-items:center; gap:7px; }
.mc-status-dot { width:8px; height:8px; border-radius:50%; flex-shrink:0; transition:background .4s; }
.mc-status-label { font-size:11px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; transition:color .4s; }
.mc-until { font-size:10px; color:rgba(160,210,120,.38); letter-spacing:.08em; text-transform:uppercase; min-height:14px; }
.mc-digits { font-family:'Courier New','SF Mono',ui-monospace,monospace; font-size:2.6rem; font-weight:700; letter-spacing:.08em; font-variant-numeric:tabular-nums; line-height:1; transition:color .4s; }
@keyframes mc-glow { 0%,100% { text-shadow:0 0 8px currentColor; opacity:1; } 50% { text-shadow:0 0 20px currentColor; opacity:.85; } }
.mc-digits.mc-open { animation:mc-glow 2s ease-in-out infinite; }
@keyframes mc-dot-pulse { 0%,100% { transform:scale(1); } 50% { transform:scale(1.55); opacity:.6; } }
.mc-status-dot.mc-open { animation:mc-dot-pulse 1.6s ease-in-out infinite; }

/* ── Status bar ── */
.status-bar { display:flex; align-items:center; flex-wrap:wrap; background:var(--bg2); border:0.5px solid var(--border2); border-radius:10px; padding:6px 12px; margin-bottom:16px; }
.sb-item { display:flex; align-items:center; gap:6px; padding:4px 12px; }
.sb-dot { width:7px; height:7px; border-radius:50%; flex-shrink:0; }
.sb-label { font-size:13px; color:var(--text2); }
.sb-val { font-size:13px; font-weight:700; color:var(--text1); }
.sb-div { width:1px; height:16px; background:var(--border2); flex-shrink:0; }

/* ── Dalio explainer ── */
.dalio-box { background: var(--bg2); border-radius: var(--radius); border: .5px solid var(--border2); margin-bottom: 14px; overflow: hidden; backdrop-filter: blur(5px); }
.dalio-toggle { width: 100%; display: flex; justify-content: space-between; align-items: center; padding: 11px 14px; background: none; border: none; cursor: pointer; font-size: 13px; font-weight: 600; color: var(--accent); text-align: left; }
.dalio-toggle .arrow { font-size: 11px; color: var(--text3); transition: transform .2s; }
.dalio-toggle.open .arrow { transform: rotate(180deg); }
.dalio-content { display: none; padding: 0 14px 14px; }
.dalio-content.open { display: block; }
.dalio-metrics { display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; margin-top: 10px; }
.dm { background: var(--bg); border-radius: 6px; border: .5px solid var(--border3); padding: 9px 11px; font-size: 12px; line-height: 1.55; }
.dm-num   { font-size: 11px; font-weight: 700; color: var(--text3); margin-bottom: 2px; }
.dm-title { font-weight: 600; color: var(--text1); margin-bottom: 2px; }
.dm-body  { color: var(--text2); }
.dm.used { border-color: #a5c882; }
.dm.used .dm-num { color: #3a6b40; }
.dalio-legend { font-size: 12px; color: var(--text2); margin-top: 10px; line-height: 1.6; }
.verdict-key { display: flex; gap: 14px; margin-top: 10px; flex-wrap: wrap; }
.vk { display: flex; align-items: center; gap: 5px; font-size: 12px; color: var(--text2); }
.vk-dot { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; }

/* ── Macro boxes ── */
.macro-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; margin-bottom: 14px; }
.macro-box  { border-radius: var(--radius); padding: 12px 14px; font-size: 13px; line-height: 1.6; }
.macro-box.red   { background:rgba(254,242,242,0.90); border:.5px solid #FECACA; color:#7F1D1D; }
.macro-box.amber { background:rgba(255,251,235,0.90); border:.5px solid #FDE68A; color:#78350F; }
.macro-box.green { background:rgba(240,253,244,0.90); border:.5px solid #a5c882; color:#14532D; }
.macro-box strong { font-weight: 600; }
.macro-loading { font-size: 12px; color: var(--text3); font-style: italic; }

/* ── Summary stats ── */
.sg { display: grid; grid-template-columns: repeat(4,1fr); gap: 10px; margin-bottom: 14px; }
.sc { background: var(--bg2); border-radius: var(--radius); padding: 11px 14px; border: .5px solid var(--border3); backdrop-filter: blur(5px); }
.sn { font-size: 22px; font-weight: 500; }
.sl { font-size: 12px; color: var(--text2); margin-bottom: 3px; }

/* ── Filters ── */
.filters { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 12px; }
.fbtn { font-size: 13px; padding: 5px 13px; border-radius: var(--radius); border: .5px solid var(--border2); background: var(--bg2); color: var(--text2); cursor: pointer; backdrop-filter: blur(5px); }
.fbtn:hover:not(.active) { border-color: var(--border1); }
.fbtn.active { background: var(--accent); color: #fdf6ee; border-color: var(--accent); }

/* ── Table headers ── */
.headers { display: grid; grid-template-columns: 72px 1fr 64px 64px 68px 68px 90px 36px; gap: 6px; padding: 0 12px 6px; font-size: 11px; color: var(--text3); text-transform: uppercase; letter-spacing: .05em; }
.hcol { display: flex; align-items: center; gap: 3px; cursor: pointer; user-select: none; white-space: nowrap; }
.hcol:hover { color: var(--accent); }
.hcol.active { color: var(--accent); }
.sort-arrow { font-size: 10px; opacity: .7; }

/* ── Stock rows ── */
.row { display: grid; grid-template-columns: 72px 1fr 64px 64px 68px 68px 90px 36px; gap: 6px; align-items: center; padding: 9px 12px; border-radius: var(--radius); border: .5px solid var(--border3); background: var(--bg2); margin-bottom: 5px; cursor: pointer; transition: border-color .15s, background .15s; backdrop-filter: blur(5px); }
.row:hover { border-color: var(--border1); background: rgba(255,255,255,0.94); }
.ticker  { font-weight: 700; font-size: 14px; color: var(--accent); }
.price   { font-size: 12px; color: var(--text3); margin-top: 1px; }
.co-name { font-size: 12px; color: var(--text2); }
.bar-wrap { height: 3px; background: var(--bg3); border-radius: 2px; margin-top: 5px; }
.bar-fill { height: 3px; border-radius: 2px; }
.val   { font-size: 13px; font-weight: 500; }
.muted { font-size: 13px; color: var(--text3); }

/* ── Badges & chips ── */
.badge { display: inline-block; font-size: 11px; padding: 2px 9px; border-radius: var(--radius); font-weight: 600; white-space: nowrap; }
.badge.red   { background:#FDECEA; color:#A32D2D; border: .5px solid #f5b8b8; }
.badge.amber { background:#FEF3E0; color:#854F0B; border: .5px solid #f0d090; }
.badge.green { background:#EAF5E0; color:#3B6D11; border: .5px solid #a5c882; }
.chip { font-size: 10px; padding: 2px 6px; border-radius: 10px; margin-left: 5px; font-weight: 500; background: rgba(168,210,130,0.28); color: #3a6b40; border: .5px solid #a5c882; }
.chip-mag7  { background:rgba(99,102,241,0.12); color:#4338ca; border-color:#a5b4fc; }
.chip-faang { background:rgba(234,88,12,0.1);   color:#c2410c; border-color:#fdba74; }
.chip-etf   { background:rgba(107,66,38,.14);   color:#6b4226; border-color:#c8a880; }
.chip-rq           { position: relative; cursor: default; }
.chip-rq-recurring { background:rgba(168,210,130,0.22); color:#27500A; border-color:#97C459; }
.chip-rq-mixed     { background:rgba(212,232,194,0.20); color:#3a6b40; border-color:#a5c882; }
.chip-rq-cyclical  { background:rgba(250,199,117,0.25); color:#633806; border-color:#EF9F27; }

/* ── Expanded detail ── */
.detail { margin: -2px 0 6px; padding: 11px 14px; font-size: 13px; color: var(--text2); background: rgba(253,246,238,0.92); border-radius: 0 0 var(--radius) var(--radius); border: .5px solid var(--border3); border-top: none; line-height: 1.7; backdrop-filter: blur(5px); }
.detail-label { font-size: 10px; font-weight: 600; text-transform: uppercase; letter-spacing: .07em; color: var(--text3); margin-bottom: 5px; }
.detail-divider { border: none; border-top: .5px solid var(--border2); margin: 10px 0; }
.rq-header { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; }
.rq-moat { font-size: 11px; color: var(--text3); padding: 2px 7px; background: rgba(160,128,96,.1); border: .5px solid var(--border3); border-radius: 8px; }

/* ── Tooltips ── */
.tip { position: relative; cursor: help; border-bottom: 1px dotted var(--text3); display: inline-block; }
.tip::after, .chip-rq[data-tip]::after { content: attr(data-tip); position: absolute; bottom: calc(100% + 7px); left: 50%; transform: translateX(-50%); background: #3b2a1a; color: #fdf6ee; font-size: 11px; line-height: 1.45; padding: 7px 10px; border-radius: 6px; white-space: nowrap; text-transform: none; letter-spacing: 0; font-weight: 400; opacity: 0; pointer-events: none; transition: opacity .15s; z-index: 200; box-shadow: 0 2px 8px rgba(0,0,0,.15); }
.tip::after { width: 190px; white-space: normal; }
.tip::before, .chip-rq[data-tip]::before { content: ''; position: absolute; bottom: calc(100% + 2px); left: 50%; transform: translateX(-50%); border: 4px solid transparent; border-top-color: #3b2a1a; opacity: 0; pointer-events: none; transition: opacity .15s; z-index: 200; }
.tip:hover::after, .tip:hover::before,
.chip-rq[data-tip]:hover::after, .chip-rq[data-tip]:hover::before { opacity: 1; }

/* ── Glossary box ── */
.gloss-box { background: var(--bg2); border-radius: var(--radius); border: .5px solid var(--border2); margin-bottom: 14px; overflow: hidden; backdrop-filter: blur(5px); scroll-margin-top: 60px; }
.gloss-toggle { width: 100%; display: flex; justify-content: space-between; align-items: center; padding: 11px 14px; background: none; border: none; cursor: pointer; font-size: 13px; font-weight: 600; color: var(--accent); text-align: left; font-family: var(--font); }
.gloss-toggle .garrow { font-size: 11px; color: var(--text3); transition: transform .2s; }
.gloss-toggle.open .garrow { transform: rotate(180deg); }
.gloss-content { display: none; padding: 0 14px 14px; }
.gloss-content.open { display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; }
.gterm { background: var(--bg); border-radius: 8px; border: .5px solid var(--border3); padding: 9px 11px; }
.gterm-word { font-size: 13px; font-weight: 700; color: var(--accent); margin-bottom: 4px; }
.gterm-def  { font-size: 13px; color: var(--text1); line-height: 1.6; }

/* ── Stock search ── */
.search-wrap { margin-bottom: 10px; }
.stock-search { width: 100%; font-size: 14px; padding: 8px 16px; border-radius: 24px; border: .5px solid var(--border2); background: var(--bg2); color: var(--text1); font-family: var(--font); outline: none; backdrop-filter: blur(5px); transition: border-color .15s; }
.stock-search:focus { border-color: var(--border1); }
.search-empty { text-align: center; padding: 24px; font-size: 13px; color: var(--text3); }

/* ── Market reference box (IVV/QQQ) ── */
.mref-box { background: var(--bg2); border-radius: var(--radius); border: .5px solid var(--border2); margin-bottom: 14px; overflow: hidden; backdrop-filter: blur(5px); }
.mref-toggle { width: 100%; display: flex; justify-content: space-between; align-items: center; padding: 11px 14px; background: none; border: none; cursor: pointer; font-size: 13px; font-weight: 600; color: var(--accent); text-align: left; font-family: var(--font); }
.mref-toggle .marrow { font-size: 11px; color: var(--text3); transition: transform .2s; }
.mref-toggle.open .marrow { transform: rotate(180deg); }
.mref-body { padding: 0 14px 14px; }
.mref-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 4px; }
.mref-card { background: var(--bg); border-radius: 8px; padding: 10px 12px; border: .5px solid var(--border3); }
.mref-card-title { font-size: 12px; font-weight: 700; color: var(--text2); text-transform: uppercase; letter-spacing: .06em; margin-bottom: 7px; }
.mref-pe-row { display: flex; gap: 14px; margin-bottom: 7px; }
.mref-pe { font-size: 12px; color: var(--text2); }
.mref-pe strong { font-size: 17px; font-weight: 700; color: var(--text1); display: block; }
.mref-conc-label { font-size: 12px; color: var(--text2); margin-bottom: 4px; }
.mref-conc-bar { height: 5px; background: var(--bg3); border-radius: 3px; margin-bottom: 8px; }
.mref-conc-fill { height: 5px; border-radius: 3px; }
.mref-holdings { font-size: 12px; color: var(--text2); line-height: 1.75; }
.mref-holdings span { color: var(--text1); font-weight: 600; }
.mref-chart-area { display: none; padding-top: 12px; border-top: .5px solid var(--border3); margin-top: 10px; }
.mref-chart-area.open { display: block; }
.mref-chart-note { font-size: 12px; color: var(--text2); margin-bottom: 8px; font-style: italic; }

/* ── ETF Portfolio tracker ── */
.etf-section { margin-top: 32px; padding-top: 24px; border-top: 1.5px solid var(--border2); }
.etf-section-title { font-size: 18px; font-weight: 700; color: var(--accent); margin-bottom: 4px; }
.etf-section-sub { font-size: 13px; color: var(--text3); margin-bottom: 16px; }
.etf-allocation { display: grid; grid-template-columns: repeat(4,1fr); gap: 8px; margin-bottom: 16px; }
.etf-alloc-card { background: var(--bg2); border-radius: var(--radius); padding: 10px 12px; border: .5px solid var(--border3); backdrop-filter: blur(4px); }
.etf-alloc-ticker { font-size: 14px; font-weight: 700; color: var(--accent); }
.etf-alloc-wt { font-size: 22px; font-weight: 700; color: var(--text1); margin: 2px 0; }
.etf-alloc-name { font-size: 12px; color: var(--text2); line-height: 1.4; }
.etf-invest-row { display: flex; align-items: center; gap: 10px; margin-bottom: 16px; flex-wrap: wrap; }
.etf-invest-label { font-size: 13px; color: var(--text2); font-weight: 600; }
.etf-amount-btn { font-size: 13px; padding: 5px 14px; border-radius: 20px; border: 1px solid var(--border2); background: var(--bg2); color: var(--text2); cursor: pointer; font-family: var(--font); }
.etf-amount-btn.active { background: var(--accent); color: #fdf6ee; border-color: var(--accent); }
.etf-amount-input { font-size: 13px; padding: 5px 10px; border-radius: 20px; border: 1px solid var(--border2); background: var(--bg2); color: var(--text1); font-family: var(--font); width: 130px; }
.etf-chart-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-bottom: 16px; }
.etf-chart-box { background: var(--bg2); border-radius: var(--radius); padding: 14px; border: .5px solid var(--border3); backdrop-filter: blur(4px); }
.etf-chart-title { font-size: 13px; font-weight: 600; color: var(--text1); margin-bottom: 4px; }
.etf-chart-sub { font-size: 12px; color: var(--text2); margin-bottom: 10px; }
.etf-note { font-size: 12px; color: var(--text2); font-style: italic; margin-top: 8px; line-height: 1.6; }
.etf-date-row { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; flex-wrap: wrap; }
.etf-date-label { font-size: 13px; color: var(--text2); font-weight: 600; }
.etf-date-input { font-size: 13px; padding: 5px 10px; border-radius: 8px; border: 1px solid var(--border2); background: var(--bg2); color: var(--text1); font-family: var(--font); }
.etf-returns-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; margin-bottom: 12px; }
.etf-ret-card { border-radius: 8px; padding: 10px 12px; text-align: center; }
.etf-ret-card.bear  { background: rgba(254,242,242,.85); border: .5px solid #FECACA; }
.etf-ret-card.base  { background: rgba(255,251,235,.85); border: .5px solid #FDE68A; }
.etf-ret-card.bull  { background: rgba(240,253,244,.85); border: .5px solid #a5c882; }
.etf-ret-label { font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; margin-bottom: 3px; }
.etf-ret-card.bear .etf-ret-label  { color: #A32D2D; }
.etf-ret-card.base .etf-ret-label  { color: #854F0B; }
.etf-ret-card.bull .etf-ret-label  { color: #3B6D11; }
.etf-ret-val { font-size: 20px; font-weight: 700; color: var(--text1); }
.etf-ret-sub { font-size: 12px; color: var(--text2); margin-top: 2px; }

/* ── History tracker ── */
.hist-status { font-size: 12px; color: var(--text2); padding: 10px 0 6px; line-height: 1.65; }
.hist-result-box { background: var(--bg); border-radius: 8px; border: .5px solid var(--border3); padding: 10px 12px; margin: 8px 0; font-size: 13px; }
.hist-val { font-size: 22px; font-weight: 700; color: var(--text1); }
.hist-gain-pos { color: #3B6D11; font-weight: 600; }
.hist-gain-neg { color: #A32D2D; font-weight: 600; }
.hist-period-btns { display: flex; gap: 4px; align-items: center; }
.hist-period-btn { font-size: 12px; font-weight: 600; padding: 4px 11px; border-radius: 14px; border: .5px solid var(--border2); background: var(--bg2); color: var(--text2); cursor: pointer; font-family: var(--font); transition: background .12s, border-color .12s, color .12s; letter-spacing: .02em; }
.hist-period-btn:hover { border-color: var(--border1); color: var(--accent); }
.hist-period-btn.active { background: var(--accent); color: #fff; border-color: var(--accent); }

/* ── Investment thesis ── */
.thesis-section { background: var(--bg2); border-radius: var(--radius); border: .5px solid var(--border2); padding: 16px; margin-top: 20px; backdrop-filter: blur(5px); }
.thesis-hd  { font-size: 15px; font-weight: 700; color: var(--accent); margin-bottom: 3px; }
.thesis-sub { font-size: 12px; color: var(--text3); margin-bottom: 14px; }
.thesis-table-wrap { overflow-x: auto; margin: 14px 0; }
.thesis-table { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.thesis-table th { padding: 8px 10px; text-align: center; background: var(--bg3); color: var(--text2); font-size: 12px; border-bottom: 1.5px solid var(--border2); }
.thesis-table th:first-child { text-align: left; }
.thesis-table td { padding: 7px 10px; text-align: center; border-bottom: .5px solid var(--border3); color: var(--text2); vertical-align: top; }
.thesis-table td:first-child { text-align: left; font-size: 11.5px; color: var(--text3); font-weight: 500; }
.trow-this { font-weight: 600; color: var(--accent) !important; background: rgba(107,66,38,.05); }
.thesis-cards { display: grid; grid-template-columns: repeat(3,1fr); gap: 10px; margin: 14px 0 10px; }
.thesis-card { background: var(--bg); border: .5px solid var(--border3); border-radius: 9px; padding: 12px 13px; display: flex; flex-direction: column; }
.thesis-card-icon  { font-size: 20px; margin-bottom: 5px; }
.thesis-card-title { font-size: 13px; font-weight: 700; color: var(--text1); margin-bottom: 7px; }
.thesis-points { padding-left: 16px; margin: 0; flex: 1; }
.thesis-points li { font-size: 13px; color: var(--text1); margin-bottom: 6px; line-height: 1.6; }
.thesis-refs-inline { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 10px; padding-top: 8px; border-top: .5px solid var(--border3); }
.thesis-ref-link { font-size: 12px; color: var(--accent); text-decoration: none; background: rgba(107,66,38,.08); padding: 3px 10px; border-radius: 10px; border: .5px solid var(--border2); white-space: nowrap; }
.thesis-ref-link:hover { background: rgba(107,66,38,.18); }
.tradeoff-box   { background: rgba(254,243,199,.65); border: .5px solid #FDE68A; border-radius: 9px; padding: 12px 14px; margin-top: 2px; }
.tradeoff-title { font-size: 13px; font-weight: 700; color: #92400E; margin-bottom: 10px; }
.tradeoff-grid  { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.tradeoff-sub   { font-size: 11.5px; font-weight: 600; color: #92400E; margin-bottom: 6px; }

/* ── Tab panels ── */
.tab-panel { display:none; }
.tab-panel.active { display:block; }

/* ── Overview tab ── */
.ov-metrics { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin:16px 0 14px; }
.ov-metric { background:var(--bg2); border-radius:10px; border:0.5px solid var(--border2); padding:12px 14px; }
.ov-metric-label { font-size:11px; color:var(--text2); margin-bottom:4px; text-transform:uppercase; letter-spacing:0.05em; font-weight:600; }
.ov-metric-val { font-size:1.35rem; font-weight:700; color:var(--text1); letter-spacing:-0.01em; line-height:1.2; }
.ov-metric-sub { font-size:12px; color:var(--text2); margin-top:3px; }
.ov-jumps { display:grid; grid-template-columns:repeat(4,1fr); gap:8px; margin-top:12px; }
.ov-jump-btn { background:var(--bg2); border:1px solid var(--border2); border-radius:10px; padding:11px 14px; font-size:12px; color:var(--text2); cursor:pointer; font-family:inherit; text-align:left; transition:border-color .15s, box-shadow .15s, transform .1s; line-height:1.4; display:flex; justify-content:space-between; align-items:center; gap:8px; box-shadow:0 1px 3px rgba(0,0,0,0.06); }
.ov-jump-btn:hover { border-color:var(--accent); box-shadow:0 3px 10px rgba(45,107,45,0.14); transform:translateY(-1px); }
.ov-jump-btn:active { transform:translateY(0); }
.ov-jump-content { flex:1; }
.ov-jump-label { font-weight:600; color:var(--text1); display:block; }
.ov-jump-sub { font-size:11px; color:var(--text3); display:block; margin-top:2px; }
.ov-jump-arrow { font-size:16px; color:var(--border2); flex-shrink:0; transition:color .15s, transform .15s; }
.ov-jump-btn:hover .ov-jump-arrow { color:var(--accent); transform:translateX(2px); }

/* ── Progressive disclosure ── */
.pd-toggle { width:100%; background:none; border:none; border-top:0.5px solid var(--border2); padding:9px 0 0; margin-top:12px; cursor:pointer; font-family:inherit; display:flex; justify-content:space-between; align-items:center; color:var(--text3); font-size:12px; }
.pd-toggle:hover { color:var(--accent); }
.pd-arrow { font-size:11px; transition:transform .2s; }
.pd-arrow.open { transform:rotate(180deg); }
.pd-body { overflow:hidden; }
.pd-body.collapsed { display:none; }

/* ── Probe / quotes section ── */
.probe-section { margin:0 0 20px; }
.probe-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:20px; margin-bottom:18px; }
.probe-card { border:none; border-left:4px solid #C0392B; background:transparent; border-radius:0; padding:4px 0 4px 16px; }
.probe-q { font-size:15px; font-style:italic; font-weight:400; color:var(--text1); line-height:1.7; font-family:Georgia,'Times New Roman',serif; margin-bottom:8px; }
.probe-attr { font-size:12px; font-style:normal; font-weight:600; color:var(--text3); letter-spacing:0.01em; }

/* ── Tweet cards ── */
.tweet-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:10px; margin-bottom:14px; }
.tweet-card { background:#fff; border:1px solid #e2e8f0; border-radius:12px; padding:14px 14px 12px; text-decoration:none; display:block; transition:box-shadow .15s, border-color .15s; }
.tweet-card:hover { border-color:#1d9bf0; box-shadow:0 3px 12px rgba(29,155,240,0.12); }
.tweet-hdr { display:flex; align-items:center; gap:9px; margin-bottom:10px; }
.tweet-avatar { width:34px; height:34px; border-radius:50%; background:#e8f0fe; display:flex; align-items:center; justify-content:center; font-size:13px; font-weight:700; color:#3b5bdb; flex-shrink:0; }
.tweet-name { font-size:13px; font-weight:700; color:#0f1419; line-height:1.2; }
.tweet-handle { font-size:12px; color:#536471; }
.tweet-x { margin-left:auto; color:#000; font-size:16px; flex-shrink:0; }
.tweet-body { font-size:13px; color:#0f1419; line-height:1.55; margin-bottom:10px; }
.tweet-foot { display:flex; justify-content:space-between; align-items:center; }
.tweet-date { font-size:11px; color:#536471; }
.tweet-views { font-size:11px; color:#536471; display:flex; align-items:center; gap:3px; }
.probe-bridge { display:flex; gap:14px; align-items:flex-start; background:rgba(212,232,194,0.45); border:1px solid #b5d9a0; border-left:4px solid #4a8c2a; border-radius:0 10px 10px 0; padding:14px 16px; }
.probe-bridge-icon { font-size:20px; flex-shrink:0; margin-top:1px; }
.probe-bridge-text { font-size:14px; color:var(--text1); line-height:1.7; }
.probe-bridge-text strong { color:#2d6b2d; }

/* ── Section container boxes ── */
.quotes-box { background:linear-gradient(135deg,#fdf6ee,#fffaf4); border:1.5px solid rgba(139,90,43,0.2); border-radius:16px; padding:24px 28px; margin-bottom:14px; }
.tweets-box { background:#fff; border:1.5px solid rgba(29,155,240,0.18); border-radius:16px; padding:24px 28px; margin-bottom:0; }
.overview-box { background:#fff; border:1.5px solid var(--border2); border-radius:16px; padding:20px 22px; margin-bottom:16px; box-shadow:0 2px 10px rgba(0,0,0,.05); }

/* ── Purpose section ── */
.purpose-section { margin:16px 0 20px; border:1.5px solid rgba(45,107,45,0.25); border-radius:14px; padding:20px 22px; background:linear-gradient(135deg,#f0faf0 0%,#fafffb 100%); }
.purpose-hd { font-size:1.0rem; font-weight:700; color:#1a4a1a; margin-bottom:14px; }
.purpose-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
.purpose-card { background:white; border-radius:10px; padding:14px 13px; border:1px solid #d8efd8; }
.purpose-icon { font-size:1.25rem; margin-bottom:6px; }
.purpose-title { font-size:12px; font-weight:700; color:#2d6b2d; margin-bottom:8px; text-transform:uppercase; letter-spacing:0.05em; }
.purpose-body { font-size:13px; color:#444; line-height:1.55; }
.purpose-list { margin:0; padding:0 0 0 16px; list-style:disc; font-size:13px; color:#3a3a3a; line-height:1.7; }
.purpose-list li { margin-bottom:5px; }

/* ── Bubble barometer ── */
.bubble-section { margin:16px 0 20px; border:1.5px solid rgba(180,45,30,0.2); border-radius:14px; background:linear-gradient(135deg,#fff9f9 0%,#fff 100%); padding:20px 22px; }
.bubble-hd { font-size:1.0rem; font-weight:700; color:#7d1a1a; margin-bottom:3px; }
.bubble-hd-sub { font-size:13px; color:#444; margin-bottom:16px; }
.bubble-layout { display:grid; grid-template-columns:290px 1fr; gap:24px; align-items:start; }
.bubble-gauge-wrap { text-align:center; }
.bubble-score-main { font-size:1.5rem; font-weight:800; color:#C43C20; margin-top:4px; letter-spacing:-0.02em; }
.bubble-score-zone { font-size:12px; font-weight:600; color:#C43C20; background:#fef2f2; border:1px solid #fecaca; border-radius:4px; padding:2px 10px; display:inline-block; margin-top:3px; }
.bubble-ci-text { font-size:12px; color:#555; margin-top:4px; }
.bubble-zone-legend { display:flex; gap:8px; flex-wrap:wrap; margin-top:10px; justify-content:center; }
.bzl-item { font-size:12px; color:#444; display:flex; align-items:center; gap:4px; }
.bzl-dot { width:8px; height:8px; border-radius:50%; display:inline-block; flex-shrink:0; }
.bm-hd { font-size:11px; font-weight:700; color:#555; text-transform:uppercase; letter-spacing:0.06em; margin-bottom:12px; }
.bm-row { margin-bottom:12px; }
.bm-row-top { display:flex; justify-content:space-between; margin-bottom:4px; }
.bm-name { font-size:13px; color:#1a1a1a; }
.bm-score { font-size:13px; font-weight:700; }
.bm-bar { height:6px; border-radius:3px; background:#e8e8e8; overflow:hidden; margin-bottom:5px; }
.bm-fill { height:100%; border-radius:3px; }
.bm-evidence { font-size:12px; color:#444; line-height:1.55; }
.bm-composite { margin-top:12px; padding-top:10px; border-top:1.5px solid #e8e8e8; }
.bm-composite .bm-name { font-weight:700; color:#1a1a1a; font-size:14px; }
.bm-composite .bm-score { font-size:14px; color:#C43C20; }
.bubble-footer { margin-top:14px; padding-top:10px; border-top:1px solid #f0e0e0; font-size:12px; color:#666; line-height:1.6; }
.bubble-footer a { color:#c0392b; text-decoration:none; }
.bubble-footer a:hover { text-decoration:underline; }
.dalio-quote { background:#fffbf0; border-left:3px solid #e8a020; border-radius:0 8px 8px 0; padding:9px 14px; margin-top:10px; font-size:13px; color:#5a3a10; line-height:1.6; font-style:italic; }
.dalio-who { background:#f0f7ff; border:1px solid #c0d8f0; border-radius:8px; padding:12px 16px; margin-top:10px; font-size:13px; color:#1a3a5a; line-height:1.65; }
.dalio-who-hd { font-size:13px; font-weight:700; color:#1a3a5a; margin-bottom:0; cursor:pointer; display:flex; justify-content:space-between; align-items:center; user-select:none; }
.dalio-who-body { display:none; margin-top:8px; }
.dalio-who-body.open { display:block; }

/* ── Changelog ── */
.bm-changelog-wrap { margin-top:16px; border:1.5px solid var(--border2); border-radius:12px; overflow:hidden; }
.bm-changelog-hd { padding:12px 18px; font-size:13px; font-weight:700; color:var(--text2); cursor:pointer; display:flex; justify-content:space-between; align-items:center; background:var(--bg2); user-select:none; transition:background .15s; }
.bm-changelog-hd:hover { background:#f0f0f0; }
.bm-changelog-arr { font-size:11px; color:var(--text3); transition:transform .2s; }
.bm-changelog-arr.open { transform:rotate(180deg); }
.bm-changelog-body { display:none; overflow-x:auto; }
.bm-changelog-body.open { display:block; }
.bm-clog-table { width:100%; border-collapse:collapse; font-size:12px; min-width:640px; }
.bm-clog-table th { padding:8px 10px; background:var(--bg2); color:var(--text2); font-weight:700; font-size:11px; text-align:center; border-bottom:1.5px solid var(--border2); white-space:nowrap; }
.bm-clog-table th:first-child, .bm-clog-table td:first-child { text-align:left; }
.bm-clog-table td { padding:8px 10px; border-bottom:1px solid var(--border2); color:var(--text1); text-align:center; vertical-align:middle; font-size:12px; }
.bm-clog-table tr:last-child td { border-bottom:none; }
.bm-clog-table tr:hover td { background:rgba(0,0,0,.025); }
.bm-clog-table td:first-child { text-align:left; min-width:90px; }
.bm-clog-date { font-size:12px; font-weight:600; color:var(--text1); display:block; }
.bm-clog-rowlabel { font-size:10px; color:var(--text3); font-style:italic; display:block; margin-top:1px; }
.bm-clog-zone { display:inline-block; padding:2px 8px; border-radius:10px; color:#fff; font-size:10px; font-weight:700; white-space:nowrap; }
.bm-clog-pct { font-weight:800; }
.bm-clog-up { color:#C43C20; font-size:10px; font-weight:700; margin-left:2px; }
.bm-clog-dn { color:#4A9B5E; font-size:10px; font-weight:700; margin-left:2px; }
.bm-clog-nc { color:var(--text3); font-size:10px; margin-left:2px; }
.bm-changelog-foot { font-size:11px; color:var(--text3); padding:8px 14px 10px; border-top:1px solid var(--border2); line-height:1.5; }

/* ── Giving back footer ── */
.giving-wrapper { margin-top:48px; padding:4px; border-radius:22px; background:linear-gradient(135deg,#e63946,#f4a261,#e9c46a,#2a9d8f,#264653,#845ec2); background-size:300% 300%; animation:rainbow-shift 5s ease-in-out infinite alternate; box-shadow:0 0 48px rgba(130,80,200,.18),0 0 80px rgba(230,57,70,.1); }
@keyframes rainbow-shift { 0%{background-position:0% 50%} 100%{background-position:100% 50%} }
.giving-footer { background:#fdf8f3; border-radius:19px; padding:38px 42px; }
.giving-heading { text-align:center; margin-bottom:28px; }
.giving-title { font-size:40px; font-weight:900; background:linear-gradient(135deg,#e63946,#f4a261,#e9c46a,#2a9d8f,#264653,#845ec2); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; margin-bottom:10px; letter-spacing:-0.02em; line-height:1.1; }
.giving-subtitle { font-size:15px; color:var(--text2); line-height:1.8; max-width:640px; margin:0 auto; }
.giving-quotes { display:grid; grid-template-columns:repeat(2,1fr); gap:18px; margin-bottom:28px; }
.giving-quote { border-left:3px solid #4a8c2a; padding:4px 0 4px 16px; }
.giving-q { font-size:14px; font-style:italic; font-weight:400; color:var(--text1); line-height:1.75; font-family:Georgia,'Times New Roman',serif; margin-bottom:7px; }
.giving-attr { font-size:12px; color:var(--text3); font-weight:600; font-style:normal; letter-spacing:.01em; }
.giving-seasonal { text-align:center; font-size:17px; font-weight:800; color:#c0392b; margin-bottom:14px; letter-spacing:.04em; }
.giving-tax-note { background:linear-gradient(135deg,#e8f5e9,#f1f8e9); border:2px solid #81c784; border-radius:10px; padding:11px 18px; font-size:13px; color:#2e7d32; font-weight:600; margin-bottom:20px; text-align:center; }
.giving-section-label { font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.1em; color:#2a6b10; margin-bottom:12px; }
.giving-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:13px; margin-bottom:14px; }
.giving-card { background:white; border:1.5px solid rgba(74,140,42,.2); border-radius:14px; padding:16px; text-decoration:none; display:block; transition:border-color .2s,box-shadow .2s,transform .15s; }
.giving-card:hover { border-color:#a5c882; box-shadow:0 6px 22px rgba(59,109,17,.18); transform:translateY(-3px); }
.giving-logo { width:38px; height:38px; border-radius:9px; margin-bottom:10px; object-fit:contain; display:block; background:#f0f7e8; padding:2px; }
.giving-cat { font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.08em; color:#3B6D11; margin-bottom:7px; }
.giving-name { font-size:14px; font-weight:700; color:var(--text1); margin-bottom:5px; }
.giving-desc { font-size:12px; color:var(--text2); line-height:1.6; margin-bottom:11px; }
.giving-link-label { font-size:11px; color:white; background:#3B6D11; display:inline-block; padding:4px 12px; border-radius:20px; font-weight:700; letter-spacing:.02em; }
.giving-footnote { font-size:20px; font-weight:800; color:#1a6b1a; line-height:1.6; margin-top:28px; padding:24px 32px; background:linear-gradient(135deg,rgba(74,140,42,.12),rgba(74,140,42,.05)); border-radius:16px; border:2.5px solid #4a8c2a; text-align:center; }
.giving-footnote-sub { font-size:14px; font-weight:500; color:#2e7d32; display:block; margin-top:8px; opacity:.9; }

/* ── Share ticker card ── */
.sc-modal-bg { display:none; position:fixed; inset:0; background:rgba(0,0,0,.55); z-index:9000; align-items:center; justify-content:center; padding:16px; }
.sc-modal-bg.open { display:flex; }
.sc-modal { background:#fff; border-radius:18px; padding:20px; width:460px; max-width:100%; }
.sc-modal-hd { display:flex; justify-content:space-between; align-items:center; margin-bottom:14px; }
.sc-modal-title { font-size:14px; font-weight:700; color:#3b2a1a; }
.sc-close-btn { background:none; border:none; cursor:pointer; font-size:20px; color:#a08060; line-height:1; padding:0 2px; }
.sc-style-toggle { display:flex; gap:6px; margin-bottom:14px; }
.sc-style-btn { flex:1; padding:8px; border-radius:8px; border:1.5px solid #dfc9a8; background:none; font-size:13px; font-weight:600; cursor:pointer; color:#6b4e35; font-family:inherit; transition:all .15s; }
.sc-style-btn.active { border-color:#6b4226; color:#6b4226; background:rgba(107,66,38,.07); }
.sc-card-wrap { display:flex; justify-content:center; overflow:hidden; border-radius:12px; }
.sc-actions { display:flex; gap:8px; margin-top:14px; }
.sc-action-btn { flex:1; padding:9px 6px; border-radius:8px; border:1px solid #dfc9a8; background:none; font-size:12px; font-weight:600; cursor:pointer; font-family:inherit; color:#6b4e35; transition:opacity .15s; white-space:nowrap; }
.sc-action-btn:hover { opacity:.7; }
.sc-action-btn.x-btn { background:#000; color:#fff; border-color:#000; }
.sc-trigger-btn { font-size:11px; font-weight:600; color:var(--accent); background:rgba(107,66,38,.07); border:1px solid var(--border2); border-radius:20px; padding:2px 10px; cursor:pointer; font-family:inherit; transition:opacity .15s; }
.sc-trigger-btn:hover { opacity:.7; }
.sc-row-btn { background:none; border:1px solid transparent; border-radius:6px; padding:5px 6px; cursor:pointer; color:var(--text3); display:flex; align-items:center; justify-content:center; transition:border-color .15s, color .15s; }
.sc-row-btn:hover { border-color:var(--border1); color:var(--accent); }

/* share card — light theme */
.sc-card { width:400px; border-radius:14px; overflow:hidden; font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif; flex-shrink:0; }
.sc-light { background:#fdf6ee; border:1.5px solid #dfc9a8; }
.sc-light .sc-top { background:linear-gradient(135deg,#dff0d8 0%,#fdf6ee 100%); padding:18px 20px 14px; border-bottom:1px solid #dfc9a8; display:flex; justify-content:space-between; align-items:flex-start; }
.sc-light .sc-brand { font-size:10px; font-weight:700; color:#a08060; letter-spacing:.12em; text-transform:uppercase; margin-bottom:4px; }
.sc-light .sc-ticker { font-size:36px; font-weight:900; color:#6b4226; letter-spacing:-1.5px; line-height:1; }
.sc-light .sc-subname { font-size:13px; color:#6b4e35; margin-top:3px; }
.sc-light .sc-verdict-badge { border-radius:8px; padding:5px 14px; text-align:center; flex-shrink:0; }
.sc-light .sc-verdict-lbl { font-size:9px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; }
.sc-light .sc-verdict-val { font-size:16px; font-weight:800; margin-top:1px; }
.sc-light .sc-metrics { display:grid; grid-template-columns:1fr 1fr 1fr; padding:14px 20px; border-bottom:1px solid #ede0cc; }
.sc-light .sc-metric-lbl { font-size:9px; color:#a08060; font-weight:600; text-transform:uppercase; letter-spacing:.06em; margin-bottom:3px; }
.sc-light .sc-metric-val { font-size:20px; font-weight:800; color:#6b4226; line-height:1.15; }
.sc-light .sc-analysis { padding:12px 20px 10px; border-bottom:1px solid #ede0cc; }
.sc-light .sc-analysis-lbl { font-size:9px; font-weight:700; color:#a08060; text-transform:uppercase; letter-spacing:.07em; margin-bottom:5px; }
.sc-light .sc-analysis-txt { font-size:11.5px; color:#6b4e35; line-height:1.65; }
.sc-light .sc-foot { padding:8px 20px; display:flex; justify-content:space-between; }
.sc-light .sc-foot-txt { font-size:10px; color:#a08060; }

/* share card — dark theme */
.sc-dark { background:#0f1a0d; border:1.5px solid rgba(255,255,255,.08); }
.sc-dark .sc-top { background:linear-gradient(135deg,#1a3010 0%,#0f1a0d 100%); padding:18px 20px 14px; border-bottom:1px solid rgba(255,255,255,.07); display:flex; justify-content:space-between; align-items:flex-start; }
.sc-dark .sc-brand { font-size:10px; font-weight:700; color:rgba(160,210,120,.55); letter-spacing:.12em; text-transform:uppercase; margin-bottom:4px; }
.sc-dark .sc-ticker { font-size:36px; font-weight:900; color:#e8d5b0; letter-spacing:-1.5px; line-height:1; }
.sc-dark .sc-subname { font-size:13px; color:rgba(220,200,170,.6); margin-top:3px; }
.sc-dark .sc-verdict-badge { border-radius:8px; padding:5px 14px; text-align:center; flex-shrink:0; }
.sc-dark .sc-verdict-lbl { font-size:9px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; }
.sc-dark .sc-verdict-val { font-size:16px; font-weight:800; margin-top:1px; }
.sc-dark .sc-metrics { display:grid; grid-template-columns:1fr 1fr 1fr; padding:14px 20px; border-bottom:1px solid rgba(255,255,255,.06); }
.sc-dark .sc-metric-lbl { font-size:9px; color:rgba(160,200,120,.5); font-weight:600; text-transform:uppercase; letter-spacing:.06em; margin-bottom:3px; }
.sc-dark .sc-metric-val { font-size:20px; font-weight:800; color:#e8d5b0; line-height:1.15; }
.sc-dark .sc-analysis { padding:12px 20px 10px; border-bottom:1px solid rgba(255,255,255,.06); }
.sc-dark .sc-analysis-lbl { font-size:9px; font-weight:700; color:rgba(160,200,120,.45); text-transform:uppercase; letter-spacing:.07em; margin-bottom:5px; }
.sc-dark .sc-analysis-txt { font-size:11.5px; color:rgba(220,200,170,.7); line-height:1.65; }
.sc-dark .sc-foot { padding:8px 20px; display:flex; justify-content:space-between; }
.sc-dark .sc-foot-txt { font-size:10px; color:rgba(160,200,120,.4); }

/* ── Responsive ── */
@media (max-width: 620px) {
  .macro-grid { grid-template-columns: 1fr; }
  .sg { grid-template-columns: repeat(2,1fr); }
  .headers, .row { grid-template-columns: 62px 1fr 56px 60px 60px 82px 32px; }
  .col-ttm { display: none; }
  .gloss-content.open { grid-template-columns: 1fr 1fr; }
  .jnav-brand { display: none; }
  .jnav-links { gap: 3px; }
  .jnav-link { font-size: 11px; padding: 3px 8px; }
  .thesis-cards { grid-template-columns: 1fr; }
  .tradeoff-grid { grid-template-columns: 1fr; }
}
@media(max-width:700px) {
  .probe-grid { grid-template-columns: 1fr; }
  .tweet-grid { grid-template-columns: 1fr; }
  .purpose-grid { grid-template-columns: 1fr; }
  .bubble-layout { grid-template-columns: 1fr; }
  .ov-metrics { grid-template-columns: repeat(2,1fr); }
  .ov-jumps { grid-template-columns: repeat(2,1fr); }
  .giving-quotes { grid-template-columns: 1fr; }
  .giving-grid { grid-template-columns: 1fr; }
  .giving-title { font-size: 28px; }
  .giving-footnote { font-size: 16px; padding: 18px 20px; }
  .giving-footer { padding: 24px 20px; }
}