/*
Theme Name: ETFs Rock
Theme URI: https://etfsrock.com
Author: Mikael Heroux
Author URI: https://etfsrock.com
Description: Dark membership theme for ETFs Rock. Landing page, pricing, ETF cards with the Rock Score out of 100, peer-group screener, and the member tools (portfolio, income, targets and rebalance, updates, compare). Gated with WishList Member.
Version: 0.1.2
Requires at least: 6.4
Tested up to: 6.7
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: etfsrock
Tags: dark, one-column, two-columns, custom-menu, custom-logo, editor-style, block-styles, wide-blocks
*/

/* ---------- tokens ---------- */
:root{
  --bg:#0b0b0d; --bg2:#121215; --panel:#17171b; --panel2:#1d1d22; --line:#26262c; --line2:#32323a;
  --text:#f2f1ec; --body2:#dcdbd5; --muted:#a7a7ae; --dim:#6f6f78;
  --gold:#f0c23c; --gold2:#d9a92a; --gold-ink:#f0c23c; --gold-dim:#4a3f14; --gold-soft:#2a2410; --on-gold:#1a1200;
  --teal:#2fc4a8; --teal-ink:#2fc4a8; --red:#ef5f55; --red-ink:#ff8a80; --blue:#5b8def; --plum:#c77dff; --plum-line:#4a2a66;
  --s-hi-bg:#163c33; --s-hi-fg:#4fe0c1; --s-md-bg:#3b3214; --s-md-fg:#f0c23c; --s-lo-bg:#3f1f1c; --s-lo-fg:#ff8a80;
  --warn-bg:#2a1715; --warn-line:#5a2a26; --warn-fg:#ff8a80; --ok-line:#1f4a42;
  --hero-glow:#241f0e; --tile-gold:#1d1a10; --founder-bg:#1f1a0c; --founder-line:#6a5a1f; --chip-on-line:#6a5a1f;
  --demo-bg:#2a2410; --demo-fg:#f0c23c; --demo-line:#4a3f14; --demo-b:#fff;
  --serif:"Playfair Display",Georgia,"Times New Roman",serif;
  --sans:"DM Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --r:14px; --maxw:1240px; --gutter:32px;
  color-scheme:dark;
}
/* Light scheme: data-theme="light" on <html>, or "auto" following the OS. */
:root[data-theme="light"]{
  --bg:#f7f6f2; --bg2:#efede7; --panel:#ffffff; --panel2:#f3f1ea; --line:#e4e1d8; --line2:#d3cfc3;
  --text:#1a1a1f; --body2:#2b2b31; --muted:#5c5c66; --dim:#8a8a94;
  --gold:#f0c23c; --gold2:#e0b22c; --gold-ink:#8a6400; --gold-dim:#e6d08a; --gold-soft:#fbf3d6; --on-gold:#1a1200;
  --teal:#1f9c84; --teal-ink:#0f7a66; --red:#d9433a; --red-ink:#b3261e; --blue:#3a6fd8; --plum:#8a3fc9; --plum-line:#d7bff0;
  --s-hi-bg:#dcf4ec; --s-hi-fg:#0f6b58; --s-md-bg:#fbefc8; --s-md-fg:#7a5600; --s-lo-bg:#fde3e0; --s-lo-fg:#a3271c;
  --warn-bg:#fde3e0; --warn-line:#f3b3ac; --warn-fg:#a3271c; --ok-line:#9ad8c8;
  --hero-glow:#f6ecc9; --tile-gold:#fff8e1; --founder-bg:#fff8e3; --founder-line:#e2c66a; --chip-on-line:#e2c66a;
  --demo-bg:#fff3c4; --demo-fg:#6b4e00; --demo-line:#ecd68a; --demo-b:#1a1200;
  color-scheme:light;
}
@media (prefers-color-scheme:light){
  :root[data-theme="auto"]{
    --bg:#f7f6f2; --bg2:#efede7; --panel:#ffffff; --panel2:#f3f1ea; --line:#e4e1d8; --line2:#d3cfc3;
    --text:#1a1a1f; --body2:#2b2b31; --muted:#5c5c66; --dim:#8a8a94;
    --gold:#f0c23c; --gold2:#e0b22c; --gold-ink:#8a6400; --gold-dim:#e6d08a; --gold-soft:#fbf3d6; --on-gold:#1a1200;
    --teal:#1f9c84; --teal-ink:#0f7a66; --red:#d9433a; --red-ink:#b3261e; --blue:#3a6fd8; --plum:#8a3fc9; --plum-line:#d7bff0;
    --s-hi-bg:#dcf4ec; --s-hi-fg:#0f6b58; --s-md-bg:#fbefc8; --s-md-fg:#7a5600; --s-lo-bg:#fde3e0; --s-lo-fg:#a3271c;
    --warn-bg:#fde3e0; --warn-line:#f3b3ac; --warn-fg:#a3271c; --ok-line:#9ad8c8;
    --hero-glow:#f6ecc9; --tile-gold:#fff8e1; --founder-bg:#fff8e3; --founder-line:#e2c66a; --chip-on-line:#e2c66a;
    --demo-bg:#fff3c4; --demo-fg:#6b4e00; --demo-line:#ecd68a; --demo-b:#1a1200;
    color-scheme:light;
  }
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--text);font-family:var(--sans);font-size:15px;line-height:1.55}
a{color:inherit;text-decoration:none}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
img{max-width:100%;height:auto}
button,input,select,textarea{font-family:inherit;font-size:inherit}
h1,h2,h3,h4{margin:0 0 .4em;line-height:1.2}
p{margin:0 0 1em}
.screen-reader-text{position:absolute!important;clip:rect(1px,1px,1px,1px);clip-path:inset(50%);width:1px;height:1px;overflow:hidden;word-wrap:normal!important}
.skip-link{position:absolute;left:-9999px;top:0;background:var(--gold);color:#1a1200;padding:8px 14px;z-index:1000;border-radius:0 0 8px 0}
.skip-link:focus{left:0}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 var(--gutter)}
.narrow{max-width:760px}

/* ---------- demo banner ---------- */
.demo-bar{position:sticky;top:0;z-index:60;background:var(--demo-bg);color:var(--demo-fg);border-bottom:1px solid var(--demo-line);font-size:12.5px;padding:6px 20px;letter-spacing:.02em;text-align:center}
.demo-bar b{color:var(--demo-b)}
.admin-bar .demo-bar{top:32px}
@media (max-width:782px){.admin-bar .demo-bar{top:46px}}

/* ---------- top nav ---------- */
.topnav{display:flex;align-items:center;gap:24px;padding:14px var(--gutter);border-bottom:1px solid var(--line);background:var(--bg);position:relative;z-index:40}
.logo{display:flex;align-items:center;gap:10px;font-weight:700;font-size:19px;letter-spacing:-.01em;white-space:nowrap}
.logo .mark{width:30px;height:30px;border-radius:8px;background:linear-gradient(135deg,var(--gold),#b8821a);display:grid;place-items:center;color:#1a1200;font-weight:800;font-size:15px}
.logo .rock{color:var(--gold-ink)}
.theme-toggle{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:10px;border:1px solid var(--line2);background:var(--panel);color:var(--text);cursor:pointer;padding:0}
.theme-toggle svg{width:18px;height:18px}
.theme-toggle .sun{display:none}
:root[data-theme="light"] .theme-toggle .sun{display:block}
:root[data-theme="light"] .theme-toggle .moon{display:none}
@media (prefers-color-scheme:light){:root[data-theme="auto"] .theme-toggle .sun{display:block}:root[data-theme="auto"] .theme-toggle .moon{display:none}}
.logo img{height:32px;width:auto;max-width:min(240px,16vw);object-fit:contain;object-position:left center;display:block}
@media (max-width:980px){.logo img{max-width:46vw}}
.logo .logo-on-light{display:none}
:root[data-theme="light"] .logo .logo-on-dark{display:none}
:root[data-theme="light"] .logo .logo-on-light{display:block}
@media (prefers-color-scheme:light){:root[data-theme="auto"] .logo .logo-on-dark{display:none}:root[data-theme="auto"] .logo .logo-on-light{display:block}}
.topnav .menu{display:flex;gap:4px;margin:0 0 0 8px;padding:0;list-style:none}
.topnav .menu li{position:relative}
.topnav .menu a{display:block;color:var(--muted);font-weight:500;font-size:14.5px;padding:7px 10px;border-radius:8px}
.topnav .menu a:hover,.topnav .menu .current-menu-item>a,.topnav .menu .current-menu-ancestor>a,.topnav .menu .current_page_parent>a{color:var(--text);background:var(--panel)}
.topnav .menu .sub-menu{display:none;position:absolute;top:100%;left:0;background:var(--panel);border:1px solid var(--line2);border-radius:10px;padding:6px;min-width:200px;list-style:none;margin:4px 0 0}
.topnav .menu li:hover>.sub-menu,.topnav .menu li:focus-within>.sub-menu{display:block}
.topnav .spacer{flex:1}
.topnav .actions{display:flex;gap:8px;align-items:center}
.nav-toggle{display:none;background:var(--panel);border:1px solid var(--line2);color:var(--text);border-radius:8px;padding:8px 10px;cursor:pointer}
@media (max-width:980px){
  .topnav{flex-wrap:wrap;gap:10px;padding:12px 16px}
  .nav-toggle{display:inline-flex;margin-left:auto;min-height:40px}
  .topnav .theme-toggle{order:1}
  .topnav .menu,.topnav .actions{display:none;width:100%;flex-direction:column;align-items:stretch;gap:2px;margin:0;order:2}
  .topnav.open .menu,.topnav.open .actions{display:flex}
  .topnav .menu a{padding:11px 10px;font-size:15px}
  .topnav .actions .btn{justify-content:center;min-height:42px}
  .topnav .menu .sub-menu{position:static;display:block;border:0;background:transparent;padding-left:14px}
  .topnav .spacer{display:none}
}

/* ---------- buttons ---------- */
.btn,.wp-block-button__link,input[type=submit],button.button{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 18px;border-radius:10px;border:1px solid var(--line2);background:var(--panel);color:var(--text);font-weight:600;font-size:14px;cursor:pointer;line-height:1.2;text-decoration:none}
.btn:hover{border-color:var(--dim)}
.btn.gold,.wp-block-button__link,input[type=submit],button.button{background:var(--gold);border-color:var(--gold);color:var(--on-gold)}
.btn.gold:hover,.wp-block-button__link:hover,input[type=submit]:hover{background:var(--gold2)}
.btn.sm{padding:7px 12px;font-size:13px;border-radius:8px}
.btn.ghost{background:transparent}
.btn.block{width:100%}
.is-style-outline .wp-block-button__link{background:transparent;color:var(--text);border-color:var(--line2)}

/* ---------- member shell ---------- */
.shell{display:grid;grid-template-columns:232px 1fr;min-height:70vh}
.side{border-right:1px solid var(--line);padding:18px 14px;background:var(--bg2)}
.side .acct{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:12px;margin-bottom:16px}
.side .acct small{color:var(--dim);font-size:11.5px;text-transform:uppercase;letter-spacing:.08em}
.side .acct b{display:block;font-size:14.5px;margin-top:2px}
.side .acct .lvl{margin-top:6px;font-size:12.5px;color:var(--muted)}
.side h6{margin:16px 10px 6px;color:var(--dim);font-size:11px;text-transform:uppercase;letter-spacing:.1em;font-weight:600}
.side ul{list-style:none;margin:0;padding:0}
.side a{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:9px;color:var(--muted);font-weight:500;font-size:14px}
.side a:hover{background:var(--panel);color:var(--text)}
.side li.current a,.side a.active{background:var(--panel2);color:var(--text);box-shadow:inset 3px 0 0 var(--gold)}
.side .ico{width:18px;height:18px;opacity:.8;flex:none}
.side .count{margin-left:auto}
.main{padding:26px var(--gutter) 60px;max-width:var(--maxw);min-width:0}
.pagehead{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:18px;flex-wrap:wrap}
.pagehead h1{font-family:var(--serif);font-weight:500;font-size:30px;margin:0;letter-spacing:-.01em}
.pagehead p{margin:4px 0 0;color:var(--muted)}
.pagehead .asof{color:var(--dim);font-size:12.5px;text-align:right}
@media (max-width:980px){
  :root{--gutter:16px}
  .shell{grid-template-columns:1fr}
  .side{border-right:0;border-bottom:1px solid var(--line);padding:12px 16px;display:flex;gap:10px;overflow-x:auto;-webkit-overflow-scrolling:touch;align-items:center;scrollbar-width:none}
  .side::-webkit-scrollbar{display:none}
  .side .acct{margin:0;flex:none;padding:8px 12px;display:flex;gap:8px;align-items:baseline}
  .side .acct small{display:none}
  .side .acct b{font-size:13.5px;margin:0;white-space:nowrap}
  .side .acct .lvl{margin:0;font-size:12px;white-space:nowrap}
  .side h6{display:none}
  .side ul{display:flex;gap:4px;flex:none}
  .side a{padding:9px 12px;white-space:nowrap;border:1px solid var(--line);border-radius:999px;font-size:13.5px;min-height:40px}
  .side li.current a{box-shadow:none;border-color:var(--gold);color:var(--text)}
  .side .ico{display:none}
  .pagehead .asof{text-align:left}
  .pagehead h1{font-size:26px}
  .main{padding-top:18px}
}

/* ---------- tiles, cards, grids ---------- */
.tiles{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:18px}
.tile{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:16px 18px;min-width:0}
.tile small{color:var(--muted);font-size:12.5px;display:flex;justify-content:space-between}
.tile .v{font-size:26px;font-weight:600;margin-top:4px;letter-spacing:-.01em}
.tile .d{font-size:12.5px;color:var(--dim);margin-top:2px}
.tile.gold{border-color:var(--gold-dim);background:linear-gradient(180deg,var(--tile-gold),var(--panel))}
.tile .v.teal{color:var(--teal-ink)} .tile .v.gold{color:var(--gold-ink)} .tile .v.red{color:var(--red)} .tile .v.dim{color:var(--dim)}
.grid2{display:grid;grid-template-columns:1.4fr 1fr;gap:14px}
.grid2.even{grid-template-columns:1fr 1fr}
.grid3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:14px}
.card{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:18px 20px;margin-bottom:14px;min-width:0}
.card h3{margin:0 0 4px;font-size:15.5px;font-weight:600}
.card .sub{color:var(--muted);font-size:13px;margin-bottom:12px}
.card .head{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;gap:10px;flex-wrap:wrap}
.card.locked{border-color:var(--gold-dim);text-align:center;padding:30px}
.card.locked p{color:var(--muted);max-width:480px;margin:6px auto 14px}
.note{color:var(--dim);font-size:12.5px;margin-top:10px}
.empty{padding:40px 20px;text-align:center;color:var(--muted)}
.empty h3{font-family:var(--serif);font-weight:500;font-size:22px;color:var(--text)}
@media (max-width:980px){.tiles{grid-template-columns:1fr 1fr;gap:10px}.grid2,.grid2.even,.grid3{grid-template-columns:1fr}.card{padding:14px 14px}.tile{padding:12px 14px}.tile .v{font-size:22px}}
@media (max-width:520px){.tiles{grid-template-columns:1fr 1fr}.tile .v{font-size:20px}}
@media (max-width:620px){
  #sheet-screener:not(.sc-wide) .sc-col-type,#sheet-screener:not(.sc-wide) .sc-col-group{display:none}
  #sheet-screener:not(.sc-wide) th{white-space:normal;padding:8px 6px}
  #sheet-screener:not(.sc-wide) td{padding:10px 6px}
  #sheet-screener:not(.sc-wide) .sc-detail td{padding:14px 8px}
  .sc-select{flex:1 1 140px;max-width:none}
  #sc-filters{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;padding-bottom:4px;scrollbar-width:thin}
  #sc-filters .chip{flex:0 0 auto;white-space:nowrap}
}

/* ---------- target vs actual bars ---------- */
.tva{display:grid;grid-template-columns:110px 1fr 110px;gap:12px;align-items:center;padding:9px 0;border-bottom:1px solid var(--line)}
@media (max-width:600px){.tva{grid-template-columns:72px 1fr 90px;gap:8px}.tva .n{font-size:12px}}
.tva:last-child{border-bottom:0}
.pill{display:inline-block;padding:2px 9px;border-radius:999px;border:1px solid var(--line2);background:var(--bg2);font-weight:600;font-size:12.5px;letter-spacing:.02em;white-space:nowrap}
.bar{position:relative;height:12px;background:var(--bg2);border-radius:6px;border:1px solid var(--line)}
.bar .fill{position:absolute;left:0;top:0;bottom:0;background:var(--teal);border-radius:6px;opacity:.85}
.bar .tick{position:absolute;top:-4px;bottom:-4px;width:2px;background:var(--gold)}
.tva .n{font-size:13px;text-align:right;color:var(--muted);font-variant-numeric:tabular-nums}
.tva .n b{color:var(--text)}
.legend{display:flex;gap:16px;color:var(--muted);font-size:12.5px;flex-wrap:wrap}
.legend i{display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:6px;vertical-align:-1px}

/* ---------- tables ---------- */
.tablewrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
@media (max-width:980px){
  .tablewrap table{min-width:720px}
  .tablewrap #screener{min-width:1080px}
  .tablewrap #sheet-screener.sc-wide{min-width:900px}
  .tablewrap #sheet-screener:not(.sc-wide){min-width:0}
  .tablewrap .compare-grid{min-width:560px}
  .tablewrap::after{content:"";display:block;height:2px}
  .tablewrap .nm{white-space:normal;max-width:240px}
  .scroll-hint{display:block;color:var(--dim);font-size:12px;margin:6px 0 0}
}
.scroll-hint{display:none}
table{width:100%;border-collapse:collapse;font-size:13.5px}
th{color:var(--dim);font-weight:600;font-size:11.5px;text-transform:uppercase;letter-spacing:.07em;text-align:left;padding:8px 10px;border-bottom:1px solid var(--line2);white-space:nowrap}
th.sortable{cursor:pointer}
th.sortable:hover{color:var(--text)}
td{padding:10px;border-bottom:1px solid var(--line);vertical-align:middle;font-variant-numeric:tabular-nums}
tr:last-child td{border-bottom:0}
td.num,th.num{text-align:right}
tr.clickable{cursor:pointer}
tr.clickable:hover td{background:var(--panel2)}
.tk{font-weight:700;letter-spacing:.02em}
.nm{color:var(--muted);font-size:12.5px}
.score{display:inline-grid;place-items:center;min-width:44px;height:28px;border-radius:8px;font-weight:700;font-size:13.5px;padding:0 8px}
.s-hi{background:var(--s-hi-bg);color:var(--s-hi-fg)} .s-md{background:var(--s-md-bg);color:var(--s-md-fg)} .s-lo{background:var(--s-lo-bg);color:var(--s-lo-fg)} .s-na{background:var(--bg2);color:var(--dim);font-weight:500}
.s-lock{background:var(--bg2);color:var(--dim);font-weight:500;font-size:12px}
.tag{display:inline-block;padding:2px 8px;border-radius:6px;font-size:11.5px;font-weight:600;background:var(--bg2);border:1px solid var(--line2);color:var(--muted);white-space:nowrap}
.tag.prov{color:var(--gold-ink);border-color:var(--gold-dim)}
.tag.ok{color:var(--teal-ink);border-color:var(--ok-line)}
.tag.sell{color:var(--s-lo-fg);border-color:var(--warn-line);background:var(--s-lo-bg)}
.tag.buy{color:var(--s-hi-fg);border-color:var(--ok-line);background:var(--s-hi-bg)}
.tag.hold{color:var(--muted)}
.tag.demo{color:var(--plum);border-color:var(--plum-line)}
.pos{color:var(--teal-ink)} .neg{color:var(--red-ink)}

/* ---------- filters, search ---------- */
.filters{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px}
.chip{padding:8px 12px;border-radius:999px;border:1px solid var(--line2);background:var(--panel);color:var(--muted);font-size:13px;cursor:pointer;min-height:36px}
.chip.on{background:var(--gold-soft);border-color:var(--chip-on-line);color:var(--gold-ink)}
.search{display:flex;align-items:center;gap:10px;background:var(--panel);border:1px solid var(--line2);border-radius:10px;padding:0 14px;color:var(--dim);min-width:260px}
.search input{flex:1;background:transparent;border:0;color:var(--text);padding:10px 0;min-width:0}
.search input:focus{outline:none}
.toolbar{display:flex;gap:12px;align-items:center;margin-bottom:12px;flex-wrap:wrap}
button.chip{font-family:inherit}
.chip .sc-n{opacity:.65;font-size:12px;margin-left:2px}
.sc-select{background:var(--panel);border:1px solid var(--line2);border-radius:10px;color:var(--text);font:inherit;font-size:14px;min-height:42px;padding:0 10px;max-width:220px}
.sc-admin-note{margin-bottom:14px;border-color:var(--plum-line)}
.sc-open{display:block;width:100%;background:none;border:0;padding:0;color:inherit;font:inherit;text-align:left;cursor:pointer}
.sc-name{display:block;font-weight:400}
.sc-w{color:var(--text);font-weight:600;font-variant-numeric:tabular-nums}
.sc-foot{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-top:12px}
.sc-foot [hidden]{display:none}
#sheet-screener.sc-wide th[data-sort="ticker"]{min-width:180px}
#sheet-screener.sc-wide .sc-col-type{display:none}
#sheet-screener.sc-wide th,#sheet-screener.sc-wide td{padding-left:8px;padding-right:8px}
@media (max-width:1500px){#sheet-screener.sc-wide .sc-col-aum,#sheet-screener.sc-wide .sc-col-freq{display:none}}
.sc-detail td{background:var(--bg2);padding:16px 14px}
.sc-detail h4{margin:0 0 8px;font-size:12px;letter-spacing:.07em;text-transform:uppercase;color:var(--dim);font-family:var(--sans);font-weight:600}
.sc-detail-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:24px}
.sc-factor{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:4px 0;border-bottom:1px solid var(--line)}
.sc-factor:last-child{border-bottom:0}
.sc-date{margin:8px 0 0}
.sc-cta{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:0}
th[aria-sort="ascending"]::after{content:" \25B2";font-size:9px}
th[aria-sort="descending"]::after{content:" \25BC";font-size:9px}

/* ---------- ETF card ---------- */
.etfhead{display:grid;grid-template-columns:1fr 300px;gap:14px;margin-bottom:14px}
.etfhead .id h1{font-family:var(--serif);font-weight:500;font-size:34px;margin:0 0 2px}
.etfhead .id .meta{color:var(--muted);display:flex;gap:14px;flex-wrap:wrap;font-size:13.5px}
.etfhead .id .meta a{color:var(--gold-ink)}
.etfhead .objective{margin:14px 0 0;padding:6px 14px;border-left:3px solid var(--gold);color:var(--body2);font-size:14.5px;line-height:1.55;font-style:italic;max-width:760px}
.etfhead .objective small{display:block;margin-top:6px;font-style:normal;font-size:12px;color:var(--dim)}
.etfhead .objective small a{color:var(--gold-ink)}
.ring-track{stroke:var(--line)} .ring-fill{stroke:var(--gold)} .ring-text{fill:var(--text)}
.chart-bar{fill:var(--gold)} .chart-label{fill:var(--muted)} .chart-grid{stroke:var(--line)}
.tagrow{display:flex;gap:8px;align-items:center;margin-bottom:8px;flex-wrap:wrap}
.ring{display:grid;grid-template-columns:120px 1fr;gap:14px;align-items:center}
.ring svg{width:120px;height:120px}
.ring .big{font-size:38px;font-weight:700;line-height:1;letter-spacing:-.02em}
.ring .big small{font-size:16px;color:var(--muted);font-weight:500}
.ring .lbl{color:var(--muted);font-size:12.5px}
.factors{display:grid;grid-template-columns:1fr 1fr;gap:0 26px}
.f{display:grid;grid-template-columns:1fr 100px 28px;gap:10px;align-items:center;padding:7px 0;border-bottom:1px solid var(--line)}
.f .fn{font-size:13.5px}
.f .fn small{display:block;color:var(--dim);font-size:11.5px}
.f .fb{height:8px;background:var(--bg2);border-radius:4px;border:1px solid var(--line);overflow:hidden}
.f .fb i{display:block;height:100%;background:var(--gold)}
.f .fb i.hi{background:var(--teal)} .f .fb i.lo{background:var(--red)}
.f .fv{font-weight:700;text-align:right;font-size:13.5px}
.f .fv.na{color:var(--dim);font-weight:500}
.kv{display:grid;grid-template-columns:1fr 1fr;gap:6px 18px;font-size:13.5px}
.kv div{display:flex;justify-content:space-between;gap:10px;padding:6px 0;border-bottom:1px solid var(--line)}
.kv span{color:var(--muted)} .kv b{font-weight:600;text-align:right}
.kv b small{color:var(--dim);font-weight:400;margin-left:4px}
.take .entry-content p{margin:0 0 10px;color:var(--body2)}
.take h4,.take .entry-content h2,.take .entry-content h3{margin:12px 0 4px;font-size:13px;text-transform:uppercase;letter-spacing:.08em;color:var(--gold-ink);font-family:var(--sans);font-weight:600}
.take ul,.take .entry-content ul{margin:0 0 8px;padding-left:18px;color:var(--body2)}
.take li{margin:3px 0}
.obs{margin:0;padding-left:18px;color:var(--body2);font-size:14px;line-height:1.7}
.sectors .sector{display:grid;grid-template-columns:minmax(120px,1.2fr) 2fr 52px;gap:10px;align-items:center;padding:6px 0;border-bottom:1px solid var(--line);font-size:13.5px}
.sectors .sector:last-child{border-bottom:0}
.sectors .n{color:var(--body2)}
.sectors .w{text-align:right;font-weight:600;font-variant-numeric:tabular-nums}
.sectors .bar{height:10px}
.sectors .fill{background:var(--gold)}
.proscons{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:14px 0 6px}
.proscons>div{background:var(--bg2);border:1px solid var(--line);border-radius:10px;padding:12px 14px}
.proscons h4{margin:0 0 6px!important;font-size:12px!important;letter-spacing:.1em;text-transform:uppercase}
.proscons .pros h4{color:var(--teal-ink)!important}
.proscons .cons h4{color:var(--red-ink)!important}
.proscons ul{list-style:none;margin:0!important;padding:0!important}
.proscons li{position:relative;padding-left:20px;margin:6px 0!important;font-size:14px;line-height:1.5;color:var(--body2)}
.proscons li::before{position:absolute;left:0;top:0;font-weight:700}
.proscons .pros li::before{content:"+";color:var(--teal-ink)}
.proscons .cons li::before{content:"\2212";color:var(--red-ink)}
@media (max-width:700px){.proscons{grid-template-columns:1fr}}
.taxgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.taxbox{background:var(--bg2);border:1px solid var(--line);border-radius:10px;padding:12px}
.taxbox b{display:block;font-size:14px}
.taxbox small{color:var(--muted);display:block;margin-top:4px;line-height:1.4}
.lvl{font-size:12px;font-weight:700;margin-top:6px;display:inline-block;padding:2px 8px;border-radius:6px}
.lvl.good{background:var(--s-hi-bg);color:var(--s-hi-fg)}.lvl.mid{background:var(--s-md-bg);color:var(--s-md-fg)}.lvl.bad{background:var(--s-lo-bg);color:var(--s-lo-fg)}
@media (max-width:980px){.etfhead,.factors,.taxgrid,.kv{grid-template-columns:1fr}.etfhead .id h1{font-size:24px}.ring{grid-template-columns:96px 1fr}.ring svg{width:96px;height:96px}.ring .big{font-size:30px}}

/* ---------- income ---------- */
.months{display:grid;grid-template-columns:repeat(12,1fr);gap:6px;align-items:end;height:150px;padding-top:10px}
.mo{display:flex;flex-direction:column;align-items:center;gap:6px;height:100%;justify-content:flex-end}
.mo .stack{width:100%;display:flex;flex-direction:column-reverse;border-radius:4px 4px 0 0;overflow:hidden}
.mo .stack i{display:block;width:100%}
.mo small{color:var(--dim);font-size:11px}
.conc{display:grid;grid-template-columns:90px 1fr 70px;gap:10px;align-items:center;padding:7px 0;border-bottom:1px solid var(--line);font-size:13.5px}
.conc:last-child{border-bottom:0}
.conc .n{text-align:right;font-weight:600}
.scen{display:flex;align-items:center;gap:14px;margin-top:8px;flex-wrap:wrap}
input[type=range]{accent-color:var(--gold);width:220px;max-width:100%}
input.tw,.app input[type=number],.app input[type=text],.app select{background:var(--bg2);border:1px solid var(--line2);color:var(--text);border-radius:7px;padding:6px 8px;font-size:13.5px;max-width:100%}
input.tw{width:72px;text-align:right}
input.tw:focus{outline:none;border-color:var(--gold)}
.app select{min-width:0}
.warn{background:var(--warn-bg);border:1px solid var(--warn-line);color:var(--warn-fg);border-radius:10px;padding:10px 14px;font-size:13.5px;margin-bottom:12px}
@media (max-width:600px){
  input.tw,.app input[type=number],.app input[type=text],.app select,.search input{font-size:16px}
  .months{height:120px;gap:3px}
  .conc{grid-template-columns:72px 1fr 54px;gap:8px}
  .app .toolbar{flex-direction:column;align-items:stretch}
  .app .toolbar select{width:100%}
}

/* ---------- updates ---------- */
.ev{display:grid;grid-template-columns:92px 1fr auto;gap:14px;padding:12px 0;border-bottom:1px solid var(--line)}
.ev:last-child{border-bottom:0}
.ev .d{color:var(--dim);font-size:12.5px;padding-top:2px}
.ev b{display:block;font-size:14.5px}
.ev p{margin:3px 0 0;color:var(--muted);font-size:13.5px}
.ev a{color:var(--gold-ink)}
@media (max-width:600px){.ev{grid-template-columns:1fr}}

/* ---------- landing ---------- */
.hero{position:relative;padding:80px var(--gutter) 60px;text-align:center;overflow:hidden;border-bottom:1px solid var(--line);background:radial-gradient(1200px 500px at 50% -10%,var(--hero-glow) 0%,transparent 60%)}
.hero .kick{color:var(--gold-ink);font-size:12.5px;letter-spacing:.18em;text-transform:uppercase;font-weight:600;margin-bottom:16px}
.hero h1{font-family:var(--serif);font-weight:500;font-size:54px;line-height:1.1;margin:0 auto 18px;max-width:900px;letter-spacing:-.01em}
.hero h1 em{color:var(--gold-ink);font-style:italic}
.hero p{color:var(--muted);font-size:18px;max-width:640px;margin:0 auto 26px}
.hero .srch{display:flex;gap:10px;max-width:640px;margin:0 auto;background:var(--panel);border:1px solid var(--line2);border-radius:14px;padding:8px}
.hero .srch .search{flex:1;border:1px solid var(--line);min-width:0}
.hero .pop{margin-top:14px;color:var(--dim);font-size:13px}
.hero .pop .pill{margin:0 3px}
.feat{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;padding:36px var(--gutter);max-width:var(--maxw);margin:0 auto}
.feat .card h3{font-size:16px}
.feat .card p{color:var(--muted);margin:6px 0 0;font-size:14px}
.section-title{font-family:var(--serif);font-size:30px;text-align:center;margin:40px 0 6px;font-weight:500}
.section-sub{text-align:center;color:var(--muted);margin:0 0 20px}
.sample{max-width:var(--maxw);margin:0 auto;padding:0 var(--gutter) 30px}
.pricing{display:grid;grid-template-columns:1fr 1fr;gap:14px;max-width:760px;margin:0 auto 50px;padding:0 var(--gutter)}
.price{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:22px}
.price.founder{border-color:var(--founder-line);background:linear-gradient(180deg,var(--founder-bg),var(--panel))}
.price small{color:var(--muted)} .price.founder>small{color:var(--gold-ink)}
.price .amt{font-size:36px;font-weight:700;margin:6px 0}
.price .amt small{font-size:14px;color:var(--muted);font-weight:500}
.price ul{padding-left:18px;color:var(--muted);margin:10px 0 16px;font-size:14px}
.price li{margin:4px 0}
.foot{border-top:1px solid var(--line);padding:22px var(--gutter);color:var(--dim);font-size:12.5px;text-align:center}
.foot .menu{list-style:none;display:flex;justify-content:center;gap:18px;padding:0;margin:0 0 12px;flex-wrap:wrap}
.foot .menu a{color:var(--muted)}
@media (max-width:980px){.hero{padding:44px var(--gutter) 36px}.hero h1{font-size:34px}.hero p{font-size:16px}.hero .srch{flex-direction:column}.hero .srch .search{padding:4px 12px}.feat{padding:24px var(--gutter)}.feat,.pricing{grid-template-columns:1fr}.section-title{font-size:26px;margin-top:28px}.pricing{margin-bottom:30px}}
@media (max-width:420px){.hero h1{font-size:30px}}

/* ---------- content pages, posts ---------- */
.page-wrap{padding:40px var(--gutter) 70px;max-width:var(--maxw);margin:0 auto}
.page-wrap.narrow{max-width:800px}
.entry-title{font-family:var(--serif);font-weight:500;font-size:38px;letter-spacing:-.01em;margin:0 0 8px}
.entry-meta{color:var(--dim);font-size:13px;margin-bottom:24px}
.entry-content{font-size:16.5px;line-height:1.7;color:var(--body2)}
.entry-content h2{font-family:var(--serif);font-weight:500;font-size:28px;color:var(--text);margin:1.4em 0 .4em}
.entry-content h3{font-size:19px;color:var(--text);margin:1.2em 0 .4em}
.entry-content a{color:var(--gold-ink);text-decoration:underline;text-decoration-color:var(--gold-dim)}
.entry-content blockquote{border-left:3px solid var(--gold);margin:1.2em 0;padding:4px 18px;color:var(--muted)}
.entry-content pre,.entry-content code{background:var(--bg2);border:1px solid var(--line);border-radius:6px}
.entry-content code{padding:1px 5px;font-size:.92em}
.entry-content pre{padding:14px;overflow:auto}
.entry-content table{font-size:14.5px}
.entry-content figure{margin:1.4em 0}
.entry-content figcaption{color:var(--dim);font-size:13px;text-align:center}
.entry-content .wp-block-table td,.entry-content .wp-block-table th{border:1px solid var(--line)}
.entry-content .has-gold-color{color:var(--gold-ink)} .entry-content .has-gold-background-color{background:var(--gold);color:var(--on-gold)}
.alignwide{max-width:var(--maxw)} .alignfull{width:100vw;margin-left:calc(50% - 50vw)}
.post-list{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.post-card{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:18px 20px;display:flex;flex-direction:column;gap:6px}
.post-card h2{font-size:18px;font-weight:600;margin:0}
.post-card .excerpt{color:var(--muted);font-size:14px}
.post-card .date{color:var(--dim);font-size:12.5px;margin-top:auto}
.post-card img{border-radius:8px;margin-bottom:6px}
.pagination{display:flex;gap:6px;justify-content:center;margin-top:24px}
.pagination .page-numbers{padding:7px 12px;border:1px solid var(--line2);border-radius:8px;color:var(--muted)}
.pagination .page-numbers.current{background:var(--gold);color:var(--on-gold);border-color:var(--gold)}
@media (max-width:980px){.post-list{grid-template-columns:1fr}.entry-title{font-size:30px}.page-wrap{padding:24px var(--gutter) 50px}}

/* ---------- forms (WishList Member login and registration, WP forms) ---------- */
.entry-content form,.wlm-form,form.wlm-login,#wlm_registration_form,.page-wrap form{color:var(--text)}
.entry-content label,.page-wrap label{display:block;font-size:13.5px;color:var(--muted);margin:10px 0 4px}
.entry-content input[type=text],.entry-content input[type=email],.entry-content input[type=password],.entry-content input[type=number],.entry-content textarea,.entry-content select,
.page-wrap input[type=text],.page-wrap input[type=email],.page-wrap input[type=password],.page-wrap textarea,.page-wrap select{width:100%;max-width:480px;background:var(--bg2);border:1px solid var(--line2);color:var(--text);border-radius:8px;padding:10px 12px}
.entry-content input:focus,.page-wrap input:focus,.page-wrap textarea:focus{outline:none;border-color:var(--gold)}
.wlm-error,.entry-content .error{color:var(--red)}

/* ---------- methodology page ---------- */
.methodology-wrap{display:grid;grid-template-columns:250px minmax(0,1fr);gap:36px;max-width:var(--maxw);margin:0 auto;padding:36px var(--gutter) 70px}
.method-menu{position:sticky;top:24px;align-self:start;max-height:calc(100vh - 48px);overflow:auto;background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:14px 8px}
.method-menu-title{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--dim);font-weight:600;padding:0 10px 8px}
.method-menu ul{list-style:none;margin:0;padding:0}
.method-menu a{display:block;padding:6px 10px;border-radius:8px;color:var(--muted);font-size:13.5px;line-height:1.35}
.method-menu a:hover{background:var(--panel2);color:var(--text)}
.method-menu li.lvl2{margin-top:6px}
.method-menu li.lvl2 a{font-weight:600;color:var(--text)}
.method-menu li.lvl3 a{padding-left:22px}
.method-menu a.current{background:var(--gold-soft);color:var(--gold-ink)}
.method-main{min-width:0}
.method-lede{font-size:17px;color:var(--muted);max-width:720px;margin:0 0 20px}
.method-content h2{font-family:var(--serif);font-weight:500;font-size:30px;margin:2em 0 .5em;padding-top:1em;border-top:1px solid var(--line);scroll-margin-top:24px}
.method-content h2:first-child{border-top:0;padding-top:0;margin-top:0}
.method-content h3{font-size:19px;color:var(--gold-ink);margin:1.6em 0 .4em;scroll-margin-top:24px}
.method-content table{width:auto;min-width:320px;max-width:100%;margin:12px 0 18px;background:var(--panel);border:1px solid var(--line);border-radius:10px;border-collapse:separate;border-spacing:0;overflow:hidden;font-size:14px}
.method-content table th{background:var(--bg2);color:var(--muted);font-size:11.5px}
.method-content table td,.method-content table th{padding:8px 14px;border-bottom:1px solid var(--line)}
.method-content table tr:last-child td{border-bottom:0}
.method-content table td:last-child{font-weight:600;font-variant-numeric:tabular-nums}
.method-content .scale{display:inline-block;background:var(--gold-soft);color:var(--gold-ink);border:1px solid var(--gold-dim);border-radius:6px;padding:1px 8px;font-size:12px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;margin-left:8px;vertical-align:middle}
.method-content .pillar{display:inline-block;color:var(--dim);font-size:12px;letter-spacing:.08em;text-transform:uppercase;font-weight:600;margin-left:6px}
.method-content ul{padding-left:20px}
.method-content li{margin:4px 0}
.method-content .question{background:var(--panel);border-left:3px solid var(--gold);padding:8px 14px;border-radius:0 10px 10px 0;margin:8px 0 12px;color:var(--body2);font-style:italic}
@media (max-width:980px){.methodology-wrap{grid-template-columns:1fr;gap:16px;padding-top:20px}.method-menu{position:static;max-height:none}.method-menu ul{display:flex;flex-wrap:wrap;gap:4px}.method-menu li.lvl2{margin-top:0}.method-menu li.lvl3 a{padding-left:10px}.method-menu a{border:1px solid var(--line);border-radius:999px;padding:6px 11px;font-size:12.5px}.method-content h2{font-size:24px}.method-content table{display:block;width:100%;min-width:0;overflow-x:auto;-webkit-overflow-scrolling:touch}.method-content table td,.method-content table th{white-space:nowrap}}

/* ---------- misc ---------- */
.hint{color:var(--dim);font-size:12.5px}
.sep{height:1px;background:var(--line);margin:18px 0}
.compare-grid th:first-child{width:180px}
.compare-grid td{text-align:center}
.compare-grid td:first-child{text-align:left;color:var(--muted)}
.err404{padding:80px var(--gutter);text-align:center}
.err404 h1{font-family:var(--serif);font-weight:500;font-size:44px}
.compare-grid .pill{white-space:nowrap}
@media print{body{background:#fff;color:#000}.topnav,.side,.demo-bar,.foot,.btn{display:none!important}.card,.tile{border-color:#ccc;background:#fff}}