/* rtly-hdrline-css */
html body header.cs-header{border-bottom:0!important;box-shadow:none!important}html body header.cs-header::after{display:none!important}html body header.cs-header .cs-header__inner-desktop{border-bottom:2px solid #0C0E12!important}html.rtly-dark body header.cs-header .cs-header__inner-desktop{border-bottom-color:#E5EAF1!important}div[id^=\"aswift_\"]:has(> ins[data-ad-status=\"unfilled\"]),ins.adsbygoogle[data-ad-status=\"unfilled\"]{display:none!important;height:0!important;min-height:0!important}
/* rtly-hlwide2-css */
html body.single .cs-site-content .cs-container{max-width:min(1500px,90vw)!important}html body.single .cs-main-content{max-width:none!important}html body.single article{max-width:none!important;width:100%!important}html body.single .cs-entry__header,html body.single .cs-entry__header .cs-container{max-width:min(1500px,90vw)!important;margin-left:auto!important;margin-right:auto!important}
/* rtly-hovcss-css */
@media(min-width:601px){html body .cs-header:has(.rtly-icon-btn--menu:hover) #rtly-menu,#rtly-menu:hover{display:block!important}#rtly-menu.rtly-docked{position:absolute!important;top:100%!important;right:0!important;left:auto!important}}
/* rtly-inner-modal-css */
.rtly-modal{position:fixed;inset:0;z-index:100000;display:none;align-items:center;justify-content:center;background:rgba(16,18,24,.55);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);padding:20px}
.rtly-modal.open{display:flex;animation:rtlyMfade .18s ease}
@keyframes rtlyMfade{from{opacity:0}to{opacity:1}}
.rtly-modal-card{position:relative;background:#fff;border-radius:20px;width:100%;max-width:440px;box-shadow:0 24px 60px rgba(0,0,0,.28);font-family:'Noto Sans',sans-serif;animation:rtlyMpop .2s cubic-bezier(.2,.8,.2,1)}
@keyframes rtlyMpop{from{transform:translateY(10px) scale(.98);opacity:0}to{transform:none;opacity:1}}
html:not(.rtly-light) .rtly-modal-card{background:#0f1318;box-shadow:0 24px 60px rgba(0,0,0,.6)}
.rtly-modal-x{position:absolute;top:14px;right:14px;width:30px;height:30px;border:0;border-radius:50%;background:rgba(0,0,0,.05);color:#5c626c;font-size:19px;line-height:1;cursor:pointer;z-index:2;transition:background .15s}
.rtly-modal-x:hover{background:rgba(0,0,0,.1)}
html:not(.rtly-light) .rtly-modal-x{background:rgba(255,255,255,.08);color:#aeb6c2}
.rtly-modal-body{padding:30px 30px 26px}
.rtly-hiw-ill{height:210px;border-radius:14px;background:linear-gradient(160deg,#f3f7f5,#eef1ff);display:flex;align-items:center;justify-content:center;margin-bottom:22px;overflow:hidden}
html:not(.rtly-light) .rtly-hiw-ill{background:linear-gradient(160deg,#11201a,#141a2b)}
.rtly-hiw-t{font-size:21px;font-weight:700;color:#16181d;margin:0 0 8px}
html:not(.rtly-light) .rtly-hiw-t{color:#f0f2f5}
.rtly-hiw-d{font-size:14.5px;line-height:1.55;color:#5c626c;margin:0 0 20px}
html:not(.rtly-light) .rtly-hiw-d{color:#aeb6c2}
.rtly-hiw-dots{display:flex;gap:7px;justify-content:center;margin:0 0 18px}
.rtly-hiw-dots span{width:7px;height:7px;border-radius:50%;background:#d4d8de;transition:all .2s}
.rtly-hiw-dots span.on{background:var(--rtly-gold);width:22px;border-radius:4px}
html:not(.rtly-light) .rtly-hiw-dots span{background:#2a3038}
.rtly-hiw-next{width:100%;height:50px;border:0;border-radius:12px;font-family:'Noto Sans',sans-serif;font-weight:600;font-size:15px;cursor:pointer;background:#16181d;color:#fff;transition:filter .15s,background .15s}
html:not(.rtly-light) .rtly-hiw-next{background:#fff;color:#0a0a0a}
.rtly-hiw-next:hover{filter:brightness(1.07)}
.rtly-ill-card{background:#fff;border-radius:12px;box-shadow:0 8px 22px rgba(20,30,40,.14);padding:16px 18px;width:230px}
html:not(.rtly-light) .rtly-ill-card{background:#161c24;box-shadow:0 8px 22px rgba(0,0,0,.4)}
.rtly-ill-row{display:flex;align-items:center;gap:10px}
.rtly-ill-av{width:38px;height:38px;border-radius:50%;background:linear-gradient(135deg,#e0bd66,#9c7b34);flex:0 0 auto}
.rtly-ill-nm{font-size:13.5px;font-weight:700;color:#16181d}
html:not(.rtly-light) .rtly-ill-nm{color:#eef1f5}
.rtly-ill-badge{display:inline-flex;align-items:center;gap:4px;font-size:10.5px;font-weight:700;color:#0B8F3A;background:#E8FCEE;padding:3px 8px;border-radius:20px;margin-top:4px}
.rtly-ill-line{height:9px;border-radius:5px;background:#eceff2;margin-top:9px}
html:not(.rtly-light) .rtly-ill-line{background:#222933}
.rtly-ill-img{height:78px;border-radius:9px;background:linear-gradient(135deg,#cfe9dd,#bcd0f5);margin-bottom:10px}
.rtly-ill-pill{display:inline-block;margin-top:11px;font-size:11px;font-weight:700;color:#fff;background:#16181d;padding:5px 12px;border-radius:20px}
.rtly-wel h2{font-size:22px;font-weight:700;text-align:center;color:#16181d;margin:6px 0 6px}
html:not(.rtly-light) .rtly-wel h2{color:#f0f2f5}
.rtly-wel-sub{text-align:center;font-size:13.5px;color:#7c828c;margin:0 0 22px}
.rtly-wel-google{position:relative;display:flex;align-items:center;justify-content:center;width:100%;height:52px;border-radius:12px;background:#fff;border:1px solid #dadce0;color:#3c4043;font-weight:600;font-size:15px;text-decoration:none;transition:background .15s,box-shadow .15s,border-color .15s}
.rtly-wel-google:hover{background:#f7faff;border-color:#c9d3e6;box-shadow:0 1px 4px rgba(60,64,67,.16)}
.rtly-wel-google .g-ic{position:absolute;left:15px;top:50%;transform:translateY(-50%);width:20px;height:20px;display:flex;align-items:center;justify-content:center}
html:not(.rtly-light) .rtly-wel-google{background:#1f1f25;border-color:#34373d;color:#e8eaed}
html:not(.rtly-light) .rtly-wel-google:hover{background:#26262d;border-color:#43464d}
.rtly-wel-or{display:flex;align-items:center;gap:12px;margin:18px 0;color:#9aa0a8;font-size:12px;font-weight:600}
.rtly-wel-or:before,.rtly-wel-or:after{content:"";flex:1;height:1px;background:#e6e8ec}
html:not(.rtly-light) .rtly-wel-or:before,html:not(.rtly-light) .rtly-wel-or:after{background:#252b33}
.rtly-wel-email{display:flex;gap:8px}
.rtly-wel-email input{flex:1;height:50px;border:1px solid #dfe2e7;border-radius:12px;padding:0 14px;font-size:14.5px;font-family:'Noto Sans',sans-serif;outline:none}
.rtly-wel-email input:focus{border-color:var(--rtly-gold)}
html:not(.rtly-light) .rtly-wel-email input{background:#11161f;border-color:#2a3340;color:#e7eaf0}
.rtly-wel-email button{border:0;height:50px;padding:0 20px;border-radius:12px;font-family:'Noto Sans',sans-serif;font-weight:600;font-size:14.5px;cursor:pointer;background:#eef0f2;color:#16181d;transition:background .15s,color .15s}
.rtly-wel-email button:hover{background:#33373f;color:#fff}
html:not(.rtly-light) .rtly-wel-email button{background:#1b222c;color:#e7eaf0}
.rtly-wel-foot{text-align:center;margin-top:20px;font-size:12.5px;color:#9aa0a8}
.rtly-wel-foot a{color:#9aa0a8;text-decoration:none}
.rtly-wel-foot a:hover{color:var(--rtly-gold)}
/* style */
a.cld-like-dislike-trigger {color: #0a0101;}span.cld-count-wrap {color: #0a0a0a;}a.cld-prevent.cld-undo-trigger {color: #0a0a0a;}
/* rtly-strip-align */
#rtly-brief{padding-left:3px;box-sizing:border-box}.retirely-grid > .retirely-card:last-child:nth-child(even){grid-column:1/-1}#rtly-area a.it.jin{background-color:#eef1ff!important;box-shadow:inset 3px 0 0 #2E5CFF!important}html:not(.rtly-light) #rtly-area a.it.jin{background-color:#151d33!important;box-shadow:inset 3px 0 0 #2E5CFF!important}.rtly-wire{box-shadow:inset 0 1px 0 #e6e9ef}html:not(.rtly-light) .rtly-wire{box-shadow:inset 0 1px 0 #1e232b}.rtly-wire{border:1px solid #e6e9ef;border-radius:14px}html:not(.rtly-light) .rtly-wire{border-color:#1e232b}header.cs-header::after{content:\"\";position:absolute;left:calc(50% - 50vw);width:100vw;bottom:-1px;height:1px;background:#E6E9EF;pointer-events:none;z-index:1}html:not(.rtly-light) header.cs-header::after{background:#1A1D22}
/* rtly-avatarme */
#rtly-avatar{overflow:hidden}#rtly-avatar img{width:100%;height:100%;object-fit:cover;object-position:50% 30%;border-radius:50%;display:block}
/* rtly-welmodal-css */
/* The panel is three nested boxes: .rtly-modal-card (the white shell) > .rtly-modal-body
(padding) > .rtly-wel (content). Skinning .rtly-wel put a card inside a card - a visible
double frame. The gold goes on the SHELL, and .rtly-wel goes flat. .rw-skin is added by
our JS so we only touch this modal, not the desk ones that reuse .rtly-modal-card. */
.rtly-modal-card.rw-skin{border-radius:18px!important;background:#fff!important;border:0!important;
box-shadow:inset 0 0 0 1px rgba(201,162,39,.42),0 24px 60px rgba(16,24,40,.18)!important}
html.rtly-dark .rtly-modal-card.rw-skin{background:#07080A!important;
box-shadow:inset 0 0 0 1px rgba(201,162,39,.34),0 24px 60px rgba(0,0,0,.6)!important}
.rtly-modal-card.rw-skin .rtly-modal-body{padding:28px 30px 24px!important}
.rtly-modal-card.rw-skin .rtly-wel{background:transparent!important;box-shadow:none!important;
border:0!important;border-radius:0!important;padding:0!important}
/* HIW-X2 2026-09-01: base close-button style for the shared modal shell (it was never
styled - the theme default painted a squashed grey pill on the desk modals that reuse
this shell), then the WIZARD hides its X entirely to match the sign-in popup - scrim
click and Escape close it. Kept in the DOM for programmatic close; browsers without
:has simply keep the styled circle. */
.rtly-modal-card{position:relative}
.rtly-modal-x{position:absolute;top:14px;right:14px;width:36px;height:36px;display:flex;
align-items:center;justify-content:center;padding:0;border:1px solid #E6E9EF;
border-radius:50%;background:#fff;color:#5C626C;font-size:20px;line-height:1;cursor:pointer;
box-shadow:0 1px 2px rgba(16,24,40,.06);transition:background .15s,color .15s;z-index:5}
.rtly-modal-x:hover{background:#F6F7F9;color:#16181D}
html.rtly-dark .rtly-modal-x{background:#101214;border-color:#2A2F37;color:#8A93A0}
html.rtly-dark .rtly-modal-x:hover{background:#161A20;color:#E7EAEE}
.rtly-modal-card:has(.rtly-hiw) .rtly-modal-x{position:absolute!important;width:1px!important;
height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;
clip:rect(0 0 0 0)!important;white-space:nowrap!important;border:0!important;
box-shadow:none!important}
/* No close button at all - Polymarket pattern. Clicking the scrim or pressing Escape
closes it (wired in JS below). The button stays in the DOM, only visually removed, so
our JS can trigger the site's own close logic through it rather than reimplementing it. */
.rtly-modal-card.rw-skin .rtly-modal-x{position:absolute!important;width:1px!important;height:1px!important;
padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;
white-space:nowrap!important;border:0!important}
/* Email sign-in is not wired up, so it is not offered. Google is the only path. */
.rtly-modal-card.rw-skin .rtly-wel-or,
.rtly-modal-card.rw-skin .rtly-wel-email{display:none!important}
.rtly-modal-card.rw-skin .rtly-wel-foot{margin-top:14px!important}
/* HIW-ANIM2 2026-09-01: slide-through between the wizard steps. */
.rtly-hiw{transition:transform .26s cubic-bezier(.22,.61,.36,1),opacity .26s ease}
.rtly-hiw.hiw-out{transform:translateX(-28px);opacity:0}
.rtly-hiw.hiw-in{transform:translateX(28px);opacity:0;transition:none}
@media(prefers-reduced-motion:reduce){.rtly-hiw{transition:none}
.rtly-hiw.hiw-out,.rtly-hiw.hiw-in{transform:none;opacity:1}}
/* tab bar */
.rw-tabs{display:flex;gap:4px;padding:4px;margin:0 0 20px;border-radius:9999px;background:#F4F5F7}
html.rtly-dark .rw-tabs{background:#12151A}
.rw-tab{flex:1;height:36px;border:0;border-radius:9999px;background:transparent;cursor:pointer;
font:600 13.5px/1 "Noto Sans",sans-serif;color:#5C626C;transition:background .15s,color .15s}
.rw-tab[aria-selected="true"]{background:#fff;color:#16181D;box-shadow:0 1px 2px rgba(16,24,40,.10)}
html.rtly-dark .rw-tab{color:#8A93A0}
html.rtly-dark .rw-tab[aria-selected="true"]{background:#1B2028;color:#fff}
.rtly-wel h2::before{content:"Live newsroom";display:block;margin:0 0 11px;
font:700 10px/1 "Noto Sans",sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#C9A227}
.rtly-wel.rw-join h2::before{content:"Free membership"}
.rtly-wel h2{font:700 26px/1.2 "Noto Sans",sans-serif!important;letter-spacing:-.8px!important;
color:#16181D!important;margin:0 0 8px!important}
html.rtly-dark .rtly-wel h2{color:#fff!important}
.rtly-wel-sub{font:400 14.5px/1.55 Inter,system-ui,sans-serif!important;color:#5C626C!important;margin:0 0 20px!important}
html.rtly-dark .rtly-wel-sub{color:#8A93A0!important}
/* benefits, only on the join tab */
.rw-bens{display:none;margin:0 0 20px}
.rtly-wel.rw-join .rw-bens{display:block}
.rw-ben{display:flex;gap:10px;align-items:flex-start;margin:0 0 10px;
font:400 13.5px/1.45 Inter,system-ui,sans-serif;color:#3C4450;text-align:left}
html.rtly-dark .rw-ben{color:#AEB6C2}
.rw-ben b{font-weight:600;color:#16181D}
html.rtly-dark .rw-ben b{color:#fff}
.rw-tick{flex:0 0 17px;height:17px;border-radius:50%;background:#FAF3DF;color:#8A6D14;
display:flex;align-items:center;justify-content:center;font-size:10px;margin-top:1px}
html.rtly-dark .rw-tick{background:#2A2412;color:#E0C55F}
.rtly-wel .rtly-wel-google{display:flex!important;align-items:center!important;justify-content:center!important;
gap:12px!important;width:100%!important;height:50px!important;padding:0 24px!important;
border:1.5px solid #C9A227!important;border-radius:9999px!important;background:#fff!important;color:#16181D!important;
font:600 15px/1 "Noto Sans",sans-serif!important;box-shadow:none!important;
transition:background .15s,transform .12s!important}
.rtly-wel .rtly-wel-google:hover{background:#FFFDF6!important;transform:translateY(-1px)!important;color:#16181D!important}
.rtly-wel-or{font:400 11.5px/1 "Noto Sans",sans-serif!important;letter-spacing:.1em!important;
text-transform:uppercase!important;color:#9AA1AA!important;margin:18px 0!important}
.rtly-wel-email input[type=email],.rtly-wel-email input[type=text]{height:46px!important;border-radius:9999px!important;
border:1px solid #E6E9EF!important;padding:0 18px!important;font:400 14.5px/1 Inter,system-ui,sans-serif!important}
.rtly-wel-email input:focus{border-color:#C9A227!important;outline:none!important;
box-shadow:0 0 0 3px rgba(201,162,39,.16)!important}
.rtly-wel-email button{height:46px!important;border-radius:9999px!important;padding:0 22px!important;
font:600 14.5px/1 "Noto Sans",sans-serif!important}
.rtly-wel-foot{font:400 11.5px/1.6 Inter,system-ui,sans-serif!important;color:#98A1AD!important;margin-top:16px!important}
.rtly-wel-foot a{color:#2E5CFF!important;text-decoration:none!important}
html.rtly-dark .rtly-wel-foot a{color:#8FA8FF!important}
/* wp-custom-css */
.entry-content a,
.wp-block-post-content a {
color: #1b6ef3 !important;
text-decoration: underline !important;
}
.entry-content a:hover,
.wp-block-post-content a:hover {
color: #0a52c2 !important;
}
.entry-content a,
.wp-block-post-content a {
color: #1b6ef3;
text-decoration: underline;
}
.entry-content a:hover,
.wp-block-post-content a:hover {
color: #0a52c2;
}
.widget_categories {display:none;}
.single-post .entry-content .image {
display: none;
}
.fool-key-points h2 {
font-size: 20px;
font-weight: bold;
}
article.retirely-article-card {
gap: 0px !important;
}
.retirely-card-left {
width: 60px!important;
}
.retirely-card-right {
width: 100%!important;
}
.cnvs-block-section-sidebar-inner {
margin-top: 0 !important;
}
article.retirely-article-card {
border: none !important;
background: none !important;
}
.retirely-card-right {
padding: 0 !important;
}
.fool-key-points {
padding: 20px;
background: #ffffff;
box-shadow: 0px 4px 14px #0000001c;
margin:0 0 20px 0px;
}
/* Force hide the Elementor device detection helper */
#elementor-device-mode {
position: absolute !important;
top: -9999px !important;
left: -9999px !important;
visibility: hidden !important;
width: 0 !important;
height: 0 !important;
}
.cs-entry__post-related .cs-entry__excerpt {
display: none;
}
.fool-pitch.fool-pitch-incontent {
margin: 20px 0px;
padding: 20px;
background: #ffffff;
box-shadow: 0px 4px 14px #0000001c;
}
.fool-pitch.fool-pitch-bottom {
margin: 20px 0px;
padding: 20px;
background: #ffffff;
box-shadow: 0px 4px 14px #0000001c;
}
.fool-pitch.fool-pitch-incontent a, .fool-pitch.fool-pitch-bottom a{
display: inline;
color: #0B8F3A;
}
.fool-pitch.fool-pitch-incontent {
margin: 20px 0px;
padding: 20px;
background: #ffffff;
box-shadow: 0px 4px 14px #0000001c;
}
.cs-header__logo, a:where(:not(.wp-element-button)) {
text-decoration:none!important;
}
/* Widget Container */
.retirely-side-panel-widget {
max-width: 100%;
font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; /* Adjust to match your theme */
}
.cs-header__inner.cs-header__inner-desktop a {
text-decoration: none !important;
}
/* Individual Article Card */
.retirely-article-card {
display: flex;
align-items: stretch;
background: #fff;
border: 1px solid #e1e1e1;
overflow: hidden;
transition: transform 0.2s ease;
margin:0px 20px 20px;
}
.retirely-article-card:hover {
transform: translateY(-2px);
}
/* LEFT SIDE: Thumbnail */
.retirely-card-left {
width: 35%; /* Adjust width of image column */
min-width: 90px;
flex-shrink: 0;
position: relative;
overflow: hidden;
}
.retirely-thumb-img {
width: 100%;
height: 100%;
object-fit: cover; /* Ensures image fills the box without stretching */
display: block;
}
/* Fallback gray box if no image */
.retirely-no-thumb {
width: 100%;
height: 100%;
background-color: #f0f0f0;
}
/* RIGHT SIDE: Content */
.retirely-card-right {
padding: 12px;
display: flex;
flex-direction: column;
justify-content: space-between; /* Pushes button to bottom */
width: 65%;
}
/* Title Styling */
.retirely-card-title {
margin: 0 0 10px 0;
font-size: 13px;
line-height: 1.4;
font-weight: 500;
}
.retirely-card-title a {
text-decoration: none;
color: #333;
}
.retirely-card-title a:hover {
color: #0073aa; /* Change to your brand color */
}
/* Read More Button */
.retirely-read-more-btn {
align-self: flex-start;
font-size: 10px;
font-weight: 700;
color: #fff;
background-color: #111; /* Button color */
padding: 4px 8px;
text-decoration: none;
transition: background 0.2s;
}
.retirely-read-more-btn:hover {
background-color: #555;
text-decoration: none;
color: #fff;
}
div#cookie-law-info-bar {
max-width: 37%;
}
.cs-footer__col.cs-col-center {
display: flex;
flex-wrap: wrap;
gap: 10px;
}
.footerqrcontainer {
width: 100%;
display: flex;
align-items: center;
justify-content: center;
gap: 15px;
}
.footerqr img {
width:120px;
}
.entry-content p:nth-child(3), .entry-content h2:nth-child(3) {
margin-top: 0!important;
}
.qr img {width:45px;}
.cs-offcanvas__inner .qr img {width:125px;}
p:empty {
display: none!important;
margin: 0!important;
}
.wp-block-post-template.is-flex-container {
display: flex;
flex-direction: row;
flex-wrap: wrap;
gap: 0;
}
.special li.wp-block-post {
border: 1px solid #e9ecef;
border-bottom: none;
}
.special .wp-block-post-featured-image img {
height: 520px;
object-fit: cover;
}
li.wp-block-post {
border: 1px solid #e9ecef;
}
li.wp-block-post:nth-child(even) {
border-left:none;
border-bottom:none;
}
.wp-block-post-template.is-flex-container.is-flex-container.columns-2>li {
width: 50%;
}
.page-id-100235 .wp-block-group.is-layout-constrained {
margin-top: 0!important;
margin-bottom: 0!important;
}
li.wp-block-post:nth-child(odd) {
border-left:none;
border-bottom:none;
}
.cnvs-block-section-sidebar-1588321112924 {
border:0px !important;
}
figure.wp-block-post-featured-image, figure.wp-block-post-featured-image a, figure.wp-block-post-featured-image a img {
height: 100%;
}
.wp-block-post {
position: relative;
}
.wp-block-post h2:hover a, .wp-block-query .wp-block-post-title a:hover {
background:#DFDFFF;
color:#000!important;
}
.columns2 .wp-block-post h2 {
}
.wp-block-query .wp-block-post-featured-image {
margin-bottom: 0;
}
.wp-block-post h2 {
position: absolute;
bottom: 27px;
left: 0;
color: #fff;
width: calc(100% - 40px);
margin: 0 20px;
}
.wp-block-query .wp-block-post-title a {
color: inherit;
text-decoration: none;
background: #000;
display: inline!important;
line-height: 2;
text-align: left;
padding: 0;
line-height: calc(var(--cs-font-styled-heading-line-height) + (var(--cs-padding-title-line) * 2));
padding: 10px;
line-height: 180%;
background-color: var(--cs-color-styled-heading);
color: var(--cs-color-styled-heading-contrast);
box-decoration-break: clone;
-webkit-box-decoration-break: clone;
transition: 0.75s;
}
.wp-block-post h2 a {
padding:10px;
line-height:1.4;
}
.cnvs-block-section-content-1588321112889{
border-color: #e9ecef;
}
.cnvs-block-section-heading .cnvs-section-title > span {
z-index: 1 !important;
}
.is-style-cnvs-block-bg-light {
background: rgb(0 0 0 / 0%) !important;
}
#ff-stream-1 {
background-color: rgb(0 0 0 / 0%) !important;
}
body[data-scheme="dark"] .cnvs-block-section-sidebar{
background-color:#232323 !important;
}
body[data-scheme="dark"] .cnvs-block-section-content-1588321112889{
border-color:#323233 !important;
}
body[data-scheme="dark"] #ff-stream-1 .picture-item__inner {
background: #000;
}
body[data-scheme="dark"] #ff-stream-1 h4 a{
color: #eee !important;
}
body[data-scheme="dark"] #ff-stream-1 .ff-upic-timestamp .ff-item-meta h6 a{
color: white !important;
}
body[data-scheme="default"] #crypto-widget-CoinList[data-theme="dark"]{
display: none !important;
}
body[data-scheme="dark"] #crypto-widget-CoinList:not([data-theme]){
display: none !important;
}
body[data-scheme="dark"] .light-mode-dianomi{
display:none !important;
}
body[data-scheme="default"] .dark-mode-dianomi{
display:none !important;
}
.dark-mode-dianomi iframe, .light-mode-dianomi iframe {
max-height:300px !important
}
.ff-item-cont > .ff-img-holder[data-media*="fool"] ~ .ff-item-meta{
display: none !important;
}
.ff-item-cont > .ff-img-holder[data-media*="fool"] + h4{
padding-bottom: 20px !important;
}
@media (max-width:1024px) {
.special .wp-block-post-featured-image img {
height: 450px!important;
object-fit: cover;
}
div#cookie-law-info-bar {
max-width: 100%;
}
}
@media (max-width:767px) {
figure.wp-block-post-featured-image img, .special .wp-block-post-featured-image img {
height: 100% !important;
object-fit: cover;
}
.wp-block-post h2 a {
font-size:16px!important;
padding:10px!important;
line-height:2!important;
}
.wp-block-post h2 {
line-height: 0;
}
.wp-block-post h2 {
padding:0!important;
}
.wp-block-post-template.is-flex-container.is-flex-container.columns-2>li {
width: 100%;
}
li.wp-block-post:nth-child(even), li.wp-block-post:nth-child(odd) {
border-left:1px solid #e9ecef;
border-bottom:none;
}
}
@media(max-width: 478px){
.cnvs-block-core-group-1588339799709{
padding-left:0px !important;
padding-right: 0px !important;
}
}
/* Donna boxed news cards - v2: framed by default, brighten on hover */
.retirely-card{background-color:#fff !important;border:1px solid #000 !important;border-radius:0 !important;overflow:hidden !important;box-shadow:0 0 0 1px #000,0 6px 18px rgba(0,0,0,.14);transition:background-color .15s ease,box-shadow .2s ease,transform .15s ease;}
.retirely-card:hover{background-color:#f3f4f6 !important;box-shadow:0 0 0 1px #000,0 10px 26px rgba(0,0,0,.20);transform:translateY(-2px);}
.retirely-card__media,.retirely-card__media img{border-radius:0 !important;}
.retirely-card__body{padding:14px 16px 8px !important;display:flex !important;flex-direction:column !important;}
.retirely-card{position:relative !important;}
.retirely-card__title{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden;}
.retirely-card__excerpt{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;}
.retirely-card__meta{margin-top:auto !important;padding-top:8px;}
.retirely-card__title a{text-decoration:none !important;}
.retirely-card:hover .retirely-card__title a,.retirely-card__title a:hover{text-decoration:none !important;}
.retirely-card__title,.retirely-card:hover .retirely-card__title,.retirely-card:hover .retirely-card__body{text-decoration:none !important;}
.retirely-card__title a::after{content:"";position:absolute;inset:0;z-index:1;}
/* Donna card widen - cards fill the center column more */
@media (min-width:1181px){
.retirely-news__main{padding:0 10px !important;}
}
@media (min-width:981px){
.retirely-grid{column-gap:12px !important;}
}
/* Donna sidebar hover - soft tint, no motion */
.custom-widget .article,.retirely-side-item{border-radius:8px;transition:background-color .15s ease;margin-left:-8px !important;margin-right:-8px !important;padding-left:8px !important;padding-right:8px !important;}
.custom-widget .article:hover,.retirely-side-item:hover{background-color:#f3f4f6;}
/* Donna fresh ticker accents - newest items get a green edge; first item glows once on load */
.custom-widget .article:nth-child(-n+2){position:relative;}
.custom-widget .article:nth-child(-n+2)::before{content:"";position:absolute;left:-2px;top:10px;bottom:12px;width:3px;border-radius:2px;background:#00D451;}
@keyframes rtlyFreshIn{0%{background-color:rgba(0,212,81,.16);}100%{background-color:transparent;}}
.custom-widget .article:first-child{animation:rtlyFreshIn 2.6s ease-out 1;}
@media (prefers-reduced-motion: reduce){.custom-widget .article:first-child{animation:none;}}
/* Donna live pulse - What's Happening */
@keyframes rtlyPulse{0%,100%{opacity:1}50%{opacity:.3}}
.retirely-rss-card__h2::before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:#00D451;margin-right:8px;vertical-align:1px;animation:rtlyPulse 2s ease-in-out infinite;}
@media (prefers-reduced-motion: reduce){.retirely-rss-card__h2::before{animation:none;}}
/* Donna dark mode v3 + Polymarket menu panel (2026-06-05) - class-driven via the menu switch; replaces the old prefers-color-scheme blocks */
.rtly-pm{position:absolute;z-index:99999;width:228px;background:#fff;border:1px solid #e5e7eb;border-radius:11px;box-shadow:0 8px 24px rgba(0,0,0,.12);padding:6px 0;opacity:0;visibility:hidden;transform:translateY(4px);transition:opacity .12s ease,transform .12s ease,visibility .12s;}
.rtly-pm.rtly-pm--open{opacity:1;visibility:visible;transform:translateY(0);}
.rtly-pm__row{display:flex;align-items:center;gap:10px;height:38px;padding:0 16px;font-size:14px;font-weight:500;color:#1f2937;cursor:pointer;text-decoration:none !important;background:none;border:0;width:100%;box-sizing:border-box;font-family:inherit;}
.rtly-pm__row:hover{background:#f3f4f6;}
.rtly-pm__row:hover,.rtly-pm__row:hover .rtly-pm__label{color:#111 !important;}
.rtly-pm__row svg{width:20px;height:20px;flex:0 0 20px;stroke:#000 !important;}
.rtly-pm__label{flex:1;text-align:left;}
.rtly-pm__divider{height:1px;background:#ececef;margin:6px 0;}
.rtly-pm__row--muted{font-weight:400;color:#6b7280;height:36px;}
.rtly-pm__row--muted:hover{color:#1f2937;background:#f6f7f8;}
.rtly-pm__pill{position:relative;width:40px;height:24px;border-radius:12px;background:#d3d7dd;transition:background .18s;flex:0 0 40px;}
.rtly-pm__pill::after{content:"";position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#fff;transition:transform .18s;box-shadow:0 1px 2px rgba(0,0,0,.25);}
.rtly-pm__foot{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 16px 8px;}
.rtly-pm__appicon{width:44px;height:44px;border-radius:10px;display:block;box-shadow:0 1px 4px rgba(0,0,0,.18);}
.rtly-pm__qr{width:64px;height:64px;display:block;border-radius:4px;}
html.rtly-dark .rtly-pm{background:#15191d;border-color:#242b32;box-shadow:0 8px 24px rgba(0,0,0,.5);}
html.rtly-dark .rtly-pm__row{color:#e5e5e5;}
html.rtly-dark .rtly-pm__row svg{stroke:#e5e5e5 !important;}
html.rtly-dark .rtly-pm__row:hover{background:rgba(255,255,255,.05);}
html.rtly-dark .rtly-pm__row:hover,html.rtly-dark .rtly-pm__row:hover .rtly-pm__label{color:#fff !important;}
html.rtly-dark .rtly-pm__divider{background:#242b32;}
html.rtly-dark .rtly-pm__row--muted{color:#8a94a0;}
html.rtly-dark .rtly-pm__row--muted:hover{color:#e5e5e5;background:rgba(255,255,255,.04);}
html.rtly-dark .rtly-pm__pill{background:#2d9cdb;}
html.rtly-dark .rtly-pm__pill::after{transform:translateX(16px);}
html.rtly-dark .rtly-pm__qr{background:#fff;padding:3px;box-sizing:border-box;}
html.rtly-dark body,html.rtly-dark .cs-site,html.rtly-dark .cs-site-inner,html.rtly-dark .cs-site-content,html.rtly-dark main{background:#0b0b0c !important;color:#e8e8e8 !important;}
html.rtly-dark header.cs-header,html.rtly-dark header.cs-header .cs-container,html.rtly-dark header.cs-header .rtly-search{background-color:#0b0b0c !important;}
html.rtly-dark footer.cs-footer,html.rtly-dark footer.cs-footer .cs-container{background-color:#0b0b0c !important;}
html.rtly-dark header.cs-header,html.rtly-dark header.cs-header a,html.rtly-dark footer.cs-footer,html.rtly-dark footer.cs-footer a{color:#e8e8e8 !important;}
html.rtly-dark .rtly-search input,html.rtly-dark .rtly-search select,html.rtly-dark .rtly-search button,html.rtly-dark .rtly-search textarea{background-color:#1e2023 !important;color:#e8e8e8 !important;border:1px solid #3d3d3d !important;}
html.rtly-dark .rtly-search input::placeholder{color:#9a9a9a !important;}
html.rtly-dark .rtly-icon-btn{color:#e8e8e8;}
html.rtly-dark .rtly-icon-btn svg path,html.rtly-dark .rtly-icon-btn svg line,html.rtly-dark .rtly-icon-btn svg polyline,html.rtly-dark .rtly-icon-btn svg rect,html.rtly-dark .rtly-icon-btn svg circle{stroke:#e8e8e8 !important;}
html.rtly-dark footer.cs-footer{--cs-color-secondary:#b0b0b0 !important;}
html.rtly-dark footer.cs-footer .cs-footer__desc{color:#b0b0b0 !important;}
html.rtly-dark .retirely-news__shell{background:#1a1b1e !important;border-radius:6px;}
html.rtly-dark .retirely-card,html.rtly-dark .retirely-card__body,html.rtly-dark .retirely-card__media{background-color:#242629 !important;}
html.rtly-dark .retirely-card{border-color:#3a3d42 !important;box-shadow:0 0 0 1px #3a3d42,0 6px 18px rgba(0,0,0,.5) !important;}
html.rtly-dark .retirely-card:hover,html.rtly-dark .retirely-card:hover .retirely-card__body,html.rtly-dark .retirely-card:hover .retirely-card__media{background-color:#2e3134 !important;}
html.rtly-dark .retirely-card__title a{color:#f0f0f0 !important;}
html.rtly-dark .retirely-card__excerpt,html.rtly-dark .retirely-card__meta,html.rtly-dark .retirely-card__meta *{color:#b8bcc4 !important;}
html.rtly-dark .retirely-rss-card,html.rtly-dark .custom-widget{background:transparent !important;color:#e8e8e8 !important;}
html.rtly-dark .retirely-rss-card a,html.rtly-dark .custom-widget a,html.rtly-dark .custom-widget .article *,html.rtly-dark .retirely-side-item *{color:#dcdcdc !important;}
html.rtly-dark .retirely-rss-card__h2,html.rtly-dark .retirely-news h2{color:#e8e8e8 !important;}
html.rtly-dark .custom-widget .article:hover,html.rtly-dark .retirely-side-item:hover{background-color:rgba(255,255,255,.06) !important;}
html.rtly-dark .custom-widget .article:hover *,html.rtly-dark .retirely-side-item:hover *{color:#fff !important;}
html.rtly-dark .retirely-rss-card a:hover{color:#fff !important;}
/* Donna OS-dark card repair (2026-06-05) - the homepage template ships its own @media(prefers-color-scheme:dark) chrome (#0f1115/#16181d/#1d2026). Tonight's framed-card rule used !important and overrode the template's dark cards, leaving light cards w/ invisible titles on OS-dark. This re-darkens the new cards in the TEMPLATE's palette so OS-dark stays coherent until the manual switch JS ships. */
@media (prefers-color-scheme: dark){
html:not(.rtly-light) .retirely-card,html:not(.rtly-light) .retirely-card__body,html:not(.rtly-light) .retirely-card__media{background-color:#1d2026 !important;}
html:not(.rtly-light) .retirely-card{border-color:#3a3f48 !important;box-shadow:0 0 0 1px #3a3f48,0 6px 18px rgba(0,0,0,.5) !important;}
html:not(.rtly-light) .retirely-card:hover,html:not(.rtly-light) .retirely-card:hover .retirely-card__body,html:not(.rtly-light) .retirely-card:hover .retirely-card__media{background-color:#262a31 !important;}
html:not(.rtly-light) .retirely-card__title a{color:#e8eaed !important;}
html:not(.rtly-light) .retirely-card__excerpt,html:not(.rtly-light) .retirely-card__meta,html:not(.rtly-light) .retirely-card__meta *{color:#9aa0a6 !important;}
html:not(.rtly-light) .custom-widget .article:hover,html:not(.rtly-light) .retirely-side-item:hover{background-color:rgba(255,255,255,.06) !important;}
}
/* Donna OS-dark chrome restore (2026-06-05) - header/footer dark lived in the blocks removed tonight; the template's own dark CSS covers search/drawer/icons but NOT the header bar or footer. Palette matched to template (#16181d family). */
@media (prefers-color-scheme: dark){
html:not(.rtly-light) :is(body.home,body.page-id-100235) header.cs-header,html:not(.rtly-light) :is(body.home,body.page-id-100235) header.cs-header .cs-container{background-color:#000 !important;}
html:not(.rtly-light) :is(body.home,body.page-id-100235) header.cs-header,html:not(.rtly-light) :is(body.home,body.page-id-100235) header.cs-header a{color:#e8eaed !important;}
html:not(.rtly-light) :is(body.home,body.page-id-100235) footer.cs-footer,html:not(.rtly-light) :is(body.home,body.page-id-100235) footer.cs-footer .cs-container{background-color:#000 !important;}
html:not(.rtly-light) :is(body.home,body.page-id-100235) footer.cs-footer,html:not(.rtly-light) :is(body.home,body.page-id-100235) footer.cs-footer a{color:#e8eaed !important;}
html:not(.rtly-light) :is(body.home,body.page-id-100235) footer.cs-footer{--cs-color-secondary:#9aa0a6 !important;}
html:not(.rtly-light) :is(body.home,body.page-id-100235) footer.cs-footer .cs-footer__desc{color:#9aa0a6 !important;}
}
/* Donna force-light override (2026-06-05): when the user explicitly picks Light in the menu switch (html.rtly-light, set by JS), re-assert the template's own LIGHT values over its baked-in @media dark. Values copied from the template base CSS. */
@media (prefers-color-scheme: dark){
html.rtly-light .retirely-news{--rn-fg:#000;--rn-fg-2:#818181;--rn-bg:#fff;--rn-line:#ebebeb;--rn-bg-2:initial;--rn-line-strong:initial;}
html.rtly-light .retirely-news__shell{background:#fff !important;border-color:#ebebeb !important;box-shadow:0 1px 3px rgba(0,0,0,.04),0 8px 24px rgba(0,0,0,.04) !important;}
html.rtly-light .rtly-icon-btn{color:#111 !important;}
html.rtly-light .rtly-icon-btn svg *{stroke:#111 !important;}
html.rtly-light .rtly-search{background:#fff !important;border-bottom-color:#ebebeb !important;}
html.rtly-light .rtly-search__input{background:#fff !important;color:#111 !important;border-color:#ddd !important;}
html.rtly-light body{background:#fff !important;color:#111 !important;}
}
/* Donna mobile panel layout (2026-06-05): on touch-size screens the menu panel becomes a full-width sheet under the header; stylesheet !important beats the JS inline coords. */
@media (max-width: 600px){
.rtly-pm{width:280px !important;max-width:calc(100vw - 16px) !important;max-height:75vh;overflow-y:auto;-webkit-overflow-scrolling:touch;}
.rtly-pm__row{height:46px;}
.rtly-pm__row--muted{height:44px;}
}
/* Donna retire old drawers (2026-06-05): the menu panel replaces both legacy drawers; their trigger listeners are stripped in JS (clone), this hides the shells as backup so nothing can ever slide in. */
.rtly-drawer{display:none !important;}
.rtly-drawer-backdrop{display:none !important;opacity:0 !important;visibility:hidden !important;pointer-events:none !important;}
.cs-offcanvas{display:none !important;}
/* Donna mobile dim-killer (2026-06-05): neutralize every visual side-effect of the legacy drawer system (delegated handlers can still toggle its classes on touch) and guarantee the panel renders above everything; widen the fixed-sheet layout to cover iPads. */
.rtly-drawer,.rtly-drawer.is-open{display:none !important;}
.rtly-drawer::before,.rtly-drawer::after,.rtly-drawer.is-open::before,.rtly-drawer.is-open::after{display:none !important;content:none !important;}
body.rtly-no-scroll{overflow:auto !important;position:static !important;}
body.rtly-no-scroll::before,body.rtly-no-scroll::after{display:none !important;content:none !important;}
.cs-site-overlay{display:none !important;}
.rtly-pm{z-index:2147483000 !important;}
/* Donna fullscreen panel (2026-06-05): touch devices get the Polymarket-style takeover; desktop dropdown untouched. */
.rtly-pm--fs{position:fixed !important;top:0 !important;left:0 !important;right:0 !important;bottom:0 !important;width:auto !important;height:100% !important;border-radius:0 !important;border:0 !important;box-shadow:none !important;padding:0 0 24px !important;transform:translateX(-100%);transition:transform .22s ease,opacity .15s ease,visibility .22s;overflow-y:auto;-webkit-overflow-scrolling:touch;}
.rtly-pm--fs.rtly-pm--open{transform:translateX(0);}
.rtly-pm__head{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;border-bottom:1px solid #ececef;}
.rtly-pm__brand{font-size:18px;font-weight:700;color:#111;}
.rtly-pm__close{background:none;border:0;padding:8px;cursor:pointer;color:#111;}
.rtly-pm__close svg{width:22px;height:22px;display:block;}
.rtly-pm--fs .rtly-pm__row{height:52px;font-size:17px;padding:0 20px;}
.rtly-pm--fs .rtly-pm__row--muted{height:50px;}
.rtly-pm--fs .rtly-pm__foot{padding:16px 20px;}
.rtly-pm--fs .rtly-pm__appicon{width:52px;height:52px;}
.rtly-pm--fs .rtly-pm__qr{width:76px;height:76px;}
html.rtly-pm-lock,html.rtly-pm-lock body{overflow:hidden !important;}
html.rtly-dark .rtly-pm__head{border-bottom-color:#242b32;}
html.rtly-dark .rtly-pm__brand,html.rtly-dark .rtly-pm__close{color:#e5e5e5;}
/* Donna card contrast fix (2026-06-05): excerpt/meta grey failed WCAG contrast on the new #f3f4f6 card surface (Lighthouse flag). #565d68 = ~5.6:1 on #f3f4f6. Dark mode already passes. */
.retirely-card__excerpt{color:#565d68 !important;}
.retirely-card__meta,.retirely-card__meta *{color:#565d68 !important;}
/* Donna dark date contrast (2026-06-05): ticker timestamps kept light-mode grey in dark renders (Lighthouse contrast flag). #a7adb6 = ~5.9:1 on the dark shell. Applies to both dark triggers. */
@media (prefers-color-scheme: dark){
html:not(.rtly-light) .retirely-news .date,html:not(.rtly-light) .retirely-rss-card .date{color:#a7adb6 !important;}
}
html.rtly-dark .retirely-news .date,html.rtly-dark .retirely-rss-card .date{color:#a7adb6 !important;}
/* Donna QR aspect fix (2026-06-05): drawer QR is a 314x400 image in a square slot - object-fit keeps it undistorted and clears the Lighthouse aspect-ratio flag. */
.rtly-drawer__qr img,.rtly-pm__qr{object-fit:contain;}
/* Donna dark parity pass (2026-06-05): system-dark (media) renders lacked the text colors the switch-dark (class) had - audits render via media. Mirror them, brighten timestamps for the green fresh-tint rows, and fix light-mode dates on the tint. */
@media (prefers-color-scheme: dark){
html:not(.rtly-light) .retirely-rss-card a,html:not(.rtly-light) .custom-widget a,html:not(.rtly-light) .custom-widget .article *,html:not(.rtly-light) .retirely-side-item *{color:#dcdcdc !important;}
html:not(.rtly-light) .retirely-rss-card__h2,html:not(.rtly-light) .retirely-news h2{color:#e8eaed !important;}
html:not(.rtly-light) .retirely-news .date,html:not(.rtly-light) .custom-widget .article .date,html:not(.rtly-light) .retirely-rss-card .date{color:#c2c7cf !important;}
}
html.rtly-dark .retirely-news .date,html.rtly-dark .custom-widget .article .date,html.rtly-dark .retirely-rss-card .date{color:#c2c7cf !important;}
.custom-widget .article .date{color:#565d68;}
/* Donna heavy-page panel fix (2026-06-05): on full-theme pages (/news, articles) a plugin/theme stylesheet overrides the panel's show rule, so the menu opened but stayed invisible. Force it. */
html .rtly-pm.rtly-pm--open{opacity:1 !important;visibility:visible !important;transform:translateY(0) !important;pointer-events:auto !important;}
/* Donna heavy-page panel solidify (2026-06-05): /news + articles plugin CSS makes the panel background transparent; force the solid surface + shadow + opaque rows so page content can't bleed through. */
html .rtly-pm{background:#fff !important;border:1px solid #e5e7eb !important;box-shadow:0 8px 24px rgba(0,0,0,.12) !important;}
html.rtly-dark .rtly-pm{background:#15191d !important;border-color:#242b32 !important;}
html .rtly-pm__row{background:transparent !important;}
html .rtly-pm__row:hover{background:#f3f4f6 !important;}
html.rtly-dark .rtly-pm__row:hover{background:rgba(255,255,255,.05) !important;}
/* Donna hide dark toggle everywhere except home + /news (dark is only built there) (2026-06-05): article dark mode isn't built yet (different structure); show only the nav menu on single posts, hide the dark switch + its divider so it can't half-apply. Remove when proper article dark ships. */
body:not(.home):not(.page-id-100235) .rtly-pm__row[role="switch"]{display:none !important;}
body:not(.home):not(.page-id-100235) .rtly-pm__row[role="switch"] + .rtly-pm__divider{display:none !important;}
/* Donna search focus black (2026-06-06): search bar focus ring was template green #0ee6b0; Alex wants black. Dark mode gets light ring so it stays visible. */
.rtly-search__input:focus,.rtly-search__input:focus-visible{border-color:#000 !important;}
html.rtly-dark .rtly-search__input:focus,html.rtly-dark .rtly-search__input:focus-visible{border-color:#e8eaed !important;}
/* Donna logo hover + small trademark (shipped 2026-06-07, Alex-approved) */
.cs-header__logo{transition:opacity .15s ease;}
.cs-header__logo:hover{opacity:.72;}
html.rtly-dark .cs-header__logo:hover{opacity:.82;}
.rtly-tm{font-size:.45em;vertical-align:.7em;letter-spacing:0;font-weight:600;}
/* Donna 2026-06-08: match home header hamburger-to-logo gap on news + article pages */
@media (min-width:1025px){body:not(.home) .cs-header__offcanvas-toggle{margin-right:-4px}} /* rtly-blackout */ html.rtly-dark, html.rtly-dark body{background-color:#000 !important} html.rtly-dark .retirely-card, html.rtly-dark .retirely-card__media, html.rtly-dark .retirely-card__body{background-color:#121212 !important} html.rtly-dark .retirely-card{border-color:#181818 !important}
/* Eve 2026-07-04: mobile hamburger align right (Alex-approved). Logo left, burger pinned right on phones. */
@media(max-width:980px){
.cs-header__inner > div:has(> .rtly-icon-btn--menu){width:100%;display:flex;justify-content:space-between;align-items:center}
.rtly-icon-btn--menu{margin-left:auto;order:99}
}
@media(max-width:980px){#rtly-menu{top:104px!important}} /* Eve: dropdown clears header card (was overlapping at 58px) */
/* Eve 2026-07-06 v3: Tier pages = in-app clone. Card geometry exact; Elementor lays itself out (no clamp); no curtain flash on pages; no title gap. */
body.rtly-newart-page .cs-container{max-width:1200px!important;width:100%!important}
body.rtly-newart-page main#primary{max-width:1160px!important;width:100%!important;margin:15px auto 34px!important;background:#fff;border-radius:20px!important;box-shadow:0 20px 55px rgba(20,24,33,.08);padding:6px 0 44px!important;overflow:hidden}
body.rtly-newart-page main#primary>header.cs-header{margin:0!important;border-radius:20px 20px 0 0!important}
body.rtly-newart-page .cs-entry__header,body.rtly-newart-page h1.cs-entry__title{display:none!important}
body.rtly-newart-page .cs-entry__content{padding-top:0!important;margin-top:0!important}
body.rtly-newart-page article,body.rtly-newart-page .cs-entry{margin-top:0!important;padding-top:0!important}
html.rtly-loading body.rtly-newart-page::before,html.rtly-loading body.rtly-newart-page::after{display:none!important;content:none!important}
body.rtly-newart-page{overflow:auto!important}
html.rtly-dark body.rtly-newart-page main#primary{background:#121212;box-shadow:0 20px 55px rgba(0,0,0,.5)}
/* Eve 2026-07-07: tier pages (direct) sit on the homepage canvas */
body.rtly-newart-page{background:#f0efe9!important}
html.rtly-dark body.rtly-newart-page{background:#000!important}
/* ===== RTLY-PULSE-TABS start (2026-08-01) — white Advisor Pulse + neutral category tabs ===== */
html.rtly-light #eve-pulse#eve-pulse,
html.rtly-light main#primary#primary#primary #eve-pulse#eve-pulse{
background:#fff !important;
background-image:none !important;
border-color:#e6e8ec !important;
}
html.rtly-light #eve-pulse#eve-pulse .tapewrap::before{
background:linear-gradient(90deg,#fff,rgba(255,255,255,0)) !important;
}
html.rtly-light #eve-pulse#eve-pulse .tapewrap::after{
background:linear-gradient(270deg,#fff,rgba(255,255,255,0)) !important;
}
/* label + CTA de-gold */
html.rtly-light main#primary#primary#primary #eve-pulse#eve-pulse .lbl{
color:#5f6368 !important;
}
html.rtly-light main#primary#primary#primary #eve-pulse#eve-pulse .cta{
background:#16181d !important;
background-image:none !important;
border-color:#16181d !important;
color:#fff !important;
}
html.rtly-light main#primary#primary#primary #eve-pulse#eve-pulse .cta:hover{
background:#2b2f36 !important;
background-image:none !important;
color:#fff !important;
}
/* category tabs */
html.rtly-light main#primary#primary#primary #rtly-cats#rtly-cats .c{
background:#fff !important;
border-color:#e4e7ec !important;
color:#3c4148 !important;
}
html.rtly-light main#primary#primary#primary #rtly-cats#rtly-cats .c:hover{
background:#f3f4f1 !important;
border-color:#cfd0c7 !important;
color:#16181d !important;
}
html.rtly-light main#primary#primary#primary #rtly-cats#rtly-cats .c.on{
background:#16181d !important;
border-color:#16181d !important;
color:#fff !important;
}
/* ===== RTLY-PULSE-TABS end ===== */
/* style */
html.rtly-vision body{background:#fff!important}@media(min-width:720px){html.rtly-vision main#primary#primary#primary{width:100%!important;max-width:1500px!important;margin:0 auto!important;border:0!important;border-radius:0!important;box-shadow:none!important}}@media(min-width:1240px){html.rtly-vision main#primary .retirely-news__shell{grid-template-columns:260px 1fr 280px!important}}
/* style */
html.rtly-vision, html.rtly-vision body, html.rtly-vision .cs-site, html.rtly-vision .cs-site-inner, html.rtly-vision .cs-site-primary, html.rtly-vision .cs-site-content, html.rtly-vision .cs-container, html.rtly-vision .cs-main-content{background:#fff!important}
/* style */
html.rtly-vision .cs-main-content{padding-top:0!important}html.rtly-vision main#primary#primary#primary{padding-top:0!important}html.rtly-vision main#primary#primary#primary .cs-header__inner-desktop{transition:none!important;padding-top:5px!important;padding-bottom:5px!important;min-height:0!important}html.rtly-vision main#primary#primary#primary #rtly-hbar{padding-top:4px!important;padding-bottom:4px!important}html.rtly-vision main#primary#primary#primary #rtly-brief{min-height:0!important}html.rtly-vision main#primary#primary#primary #rtly-brief .rtly-row{padding-top:3px!important;padding-bottom:3px!important}html.rtly-vision main#primary#primary#primary #eve-pulse{min-height:0!important;padding-top:2px!important;padding-bottom:2px!important;margin-top:6px!important;margin-bottom:2px!important}html.rtly-vision main#primary#primary#primary #eve-pulse .tapewrap{height:32px!important}html.rtly-vision main#primary#primary#primary #eve-pulse .advfaces img{width:23px!important;height:23px!important}html.rtly-vision main#primary#primary#primary #rtly-cats{padding-top:8px!important;padding-bottom:6px!important}
/* style */
html.rtly-vision main#primary#primary#primary .retirely-card{transition:border-color .2s,box-shadow .2s,background .2s!important;border:1px solid #E6E9EF!important;border-radius:14px!important;box-shadow:none!important;background:#fff!important;overflow:hidden!important}html.rtly-vision main#primary#primary#primary .retirely-card:hover{box-shadow:0 14px 34px -18px rgba(30,40,90,.22),0 0 24px rgba(201,162,39,.14)!important;border-color:rgba(201,162,39,.7)!important}html.rtly-vision main#primary#primary#primary .retirely-news__main{background:#fff!important}html.rtly-vision main#primary#primary#primary .rtly-wire,html.rtly-vision main#primary#primary#primary .retirely-rss-card,html.rtly-vision main#primary#primary#primary .retirely-side-card{border:1px solid #E6E9EF!important;border-radius:14px!important;background:#fff!important;padding:10px 14px!important;box-shadow:none!important}html.rtly-vision main#primary#primary#primary .retirely-news__rss > * + *,html.rtly-vision main#primary#primary#primary .retirely-news__side > * + *{margin-top:14px!important}html.rtly-vision main#primary#primary#primary header.cs-header{position:relative!important;border-bottom:0!important}html.rtly-vision main#primary#primary#primary header.cs-header::after{content:"";position:absolute;left:calc(50% - 50vw);bottom:0;width:100vw;height:1px;background:#E6E9EF}html.rtly-vision main#primary#primary#primary #rtly-brief{position:relative!important;border-bottom:0!important}html.rtly-vision main#primary#primary#primary #rtly-brief::after{content:"";position:absolute;left:calc(50% - 50vw);bottom:0;width:100vw;height:1px;background:#E6E9EF}html.rtly-vision main#primary#primary#primary #eve-pulse{border:1px solid #EDE9DD!important;border-radius:12px!important;background:#FDFBF6!important;margin-top:8px!important;margin-bottom:4px!important}
/* style */
html.rtly-vision main#primary#primary#primary #rtly-brief::after{display:none!important}html.rtly-vision main#primary#primary#primary .rtly-wire .it:last-of-type{border-bottom:0!important}html.rtly-vision main#primary#primary#primary .retirely-rss-card .it:last-of-type,html.rtly-vision main#primary#primary#primary .retirely-side-card .it:last-of-type{border-bottom:0!important}
/* style */
html.rtly-vision{overflow-x:clip!important}html.rtly-vision body{overflow-x:clip!important}html.rtly-vision main#primary#primary#primary{overflow:visible!important}html.rtly-vision .cs-main-content{overflow:visible!important}html.rtly-vision .cs-container{overflow:visible!important;max-width:1400px!important;padding-left:12px!important;padding-right:12px!important}html.rtly-vision main#primary#primary#primary #rtly-cats .c{font-size:12px!important;padding:5px 9px!important}html.rtly-vision main#primary#primary#primary #rtly-cats{gap:6px!important}
/* style */
html.rtly-vision main#primary#primary#primary .cs-header__inner-desktop{max-width:none!important;padding-left:9px!important;padding-right:13px!important}html.rtly-vision main#primary#primary#primary #rtly-brief{margin-left:0!important;margin-right:0!important}/* rtly-datealign 2026-08-16: the date row sat 3px right of the logo. #rtly-brief adds 3px of
padding-left of its own, so 19 here produced 22 while the logo sits at 19. 16+3=19 puts
the date on the same line as the logo. Only padding-LEFT changes; right stays 7.
NOTE: no apostrophes in comments here - this CSS lives inside a PHP single-quoted
echo, and an apostrophe closes the string and fatals the file. */
html.rtly-vision main#primary#primary#primary #rtly-brief .rtly-row{max-width:none!important;margin:0!important;padding-left:16px!important;padding-right:7px!important}
/* style */
html.rtly-vision .cs-container{max-width:1200px!important}html.rtly-vision main#primary .retirely-news__shell{grid-template-columns:280px minmax(0,1fr) 280px!important;column-gap:12px!important;max-width:none!important;width:auto!important;margin:0 12px!important}html.rtly-vision main#primary#primary#primary #rtly-cats{gap:5px!important}html.rtly-vision main#primary#primary#primary #rtly-cats .c{font-size:11.5px!important;padding:5px 8px!important}html.rtly-vision main#primary#primary#primary .rtly-wire,html.rtly-vision main#primary#primary#primary .retirely-rss-card,html.rtly-vision main#primary#primary#primary .retirely-side-card{border:0!important;border-radius:0!important;background:transparent!important;padding:0 2px!important;box-shadow:none!important}
/* style */
html.rtly-vision main#primary#primary#primary .retirely-news__shell{padding-left:0!important;padding-right:0!important;margin-left:0!important;margin-right:0!important;width:100%!important;max-width:none!important;box-sizing:border-box!important}html.rtly-vision main#primary#primary#primary #eve-pulse{margin-left:0!important;margin-right:0!important}html.rtly-vision main#primary#primary#primary .rtly-wire,html.rtly-vision main#primary#primary#primary .retirely-rss-card,html.rtly-vision main#primary#primary#primary .retirely-side-card{margin-left:0!important;margin-right:0!important;width:100%!important;box-sizing:border-box!important}
/* style */
html.rtly-vision main#primary#primary#primary .retirely-news__shell{transition:none!important;box-shadow:none!important;border:0!important;background:transparent!important;padding-left:19px!important;padding-right:25px!important;margin-left:0!important;margin-right:0!important;width:100%!important;max-width:none!important;box-sizing:border-box!important}html.rtly-vision main#primary#primary#primary #eve-pulse{margin-left:19px!important;margin-right:25px!important}html.rtly-vision main#primary#primary#primary .rtly-wire,html.rtly-vision main#primary#primary#primary .retirely-rss-card,html.rtly-vision main#primary#primary#primary .retirely-side-card{border:1px solid #E6E9EF!important;border-radius:14px!important;background:#fff!important;padding:10px 14px!important;box-shadow:none!important;margin-left:0!important;margin-right:0!important;width:100%!important;box-sizing:border-box!important}
/* style */
html.rtly-vision.rtly-dark body,html.rtly-vision.rtly-dark .cs-site,html.rtly-vision.rtly-dark .cs-site-inner,html.rtly-vision.rtly-dark .cs-site-primary,html.rtly-vision.rtly-dark .cs-site-content,html.rtly-vision.rtly-dark .cs-container,html.rtly-vision.rtly-dark .cs-main-content{background:#0F1216!important}html.rtly-vision.rtly-dark main#primary#primary#primary .retirely-news__main{background:transparent!important}html.rtly-vision.rtly-dark main#primary#primary#primary .retirely-card{background:#161A20!important;border-color:#262C35!important}html.rtly-vision.rtly-dark main#primary#primary#primary .retirely-card:hover{border-color:rgba(212,175,55,.5)!important;box-shadow:0 4px 14px rgba(0,0,0,.45)!important}html.rtly-vision.rtly-dark main#primary#primary#primary .rtly-wire,html.rtly-vision.rtly-dark main#primary#primary#primary .retirely-rss-card,html.rtly-vision.rtly-dark main#primary#primary#primary .retirely-side-card{background:#161A20!important;border-color:#262C35!important}html.rtly-vision.rtly-dark main#primary#primary#primary header.cs-header::after{background:#232933!important}html.rtly-vision.rtly-dark main#primary#primary#primary #eve-pulse{background:#1A1915!important;border-color:#383325!important}html.rtly-vision.rtly-dark main#primary#primary#primary #rtly-cats .c{background:#1B2027!important;color:#C9D1DB!important;border-color:#2A313B!important}html.rtly-vision.rtly-dark main#primary#primary#primary #rtly-hbar{background:#1B2027!important;border-color:#2A313B!important;color:#C9D1DB!important}html.rtly-vision.rtly-dark main#primary#primary#primary #rtly-hbar input{background:transparent!important;color:#E5EAF1!important}html.rtly-vision.rtly-dark main#primary#primary#primary #rtly-cats .c.on{background:#E8ECF2!important;color:#14171C!important;border-color:#E8ECF2!important}html.rtly-vision.rtly-dark main#primary#primary#primary .rtly-wire .rtly-whead{background:transparent!important;color:#E5EAF1!important}html.rtly-vision.rtly-dark main#primary#primary#primary .rtly-whead *{color:inherit!important}html.rtly-vision.rtly-dark main#primary#primary#primary .retirely-rss-card__h2,html.rtly-vision.rtly-dark main#primary#primary#primary .retirely-side-card__h2{color:#E5EAF1!important;background:transparent!important}
/* style */
html.rtly-vision.rtly-dark body,html.rtly-vision.rtly-dark .cs-site,html.rtly-vision.rtly-dark .cs-site-inner,html.rtly-vision.rtly-dark .cs-site-primary,html.rtly-vision.rtly-dark .cs-site-content,html.rtly-vision.rtly-dark .cs-container,html.rtly-vision.rtly-dark .cs-main-content{background:#000!important}html.rtly-vision.rtly-dark main#primary#primary#primary .retirely-news__main{background:transparent!important}html.rtly-vision.rtly-dark main#primary#primary#primary .retirely-card{background:#0A0A0A!important;border-color:#1E2126!important}html.rtly-vision.rtly-dark main#primary#primary#primary .retirely-card:hover{border-color:rgba(212,175,55,.5)!important;box-shadow:0 4px 16px rgba(0,0,0,.6)!important}html.rtly-vision.rtly-dark main#primary#primary#primary .rtly-wire,html.rtly-vision.rtly-dark main#primary#primary#primary .retirely-rss-card,html.rtly-vision.rtly-dark main#primary#primary#primary .retirely-side-card{background:#0A0A0A!important;border-color:#1E2126!important}html.rtly-vision.rtly-dark main#primary#primary#primary header.cs-header::after{background:#1A1D22!important}html.rtly-vision.rtly-dark main#primary#primary#primary #eve-pulse{background:#0F0D08!important;border-color:#2E2A1C!important}html.rtly-vision.rtly-dark main#primary#primary#primary #rtly-cats .c{background:#101214!important;color:#C9D1DB!important;border-color:#22262C!important}html.rtly-vision.rtly-dark main#primary#primary#primary #rtly-hbar{background:#0C0C0C!important;border-color:#22262C!important;color:#C9D1DB!important}html.rtly-vision.rtly-dark main#primary#primary#primary #rtly-hbar input{background:transparent!important;color:#E5EAF1!important}html.rtly-vision.rtly-dark main#primary#primary#primary #rtly-cats .c.on{background:#E8ECF2!important;color:#0A0A0A!important;border-color:#E8ECF2!important}html.rtly-vision.rtly-dark main#primary#primary#primary .rtly-wire .rtly-whead{background:transparent!important;color:#E5EAF1!important}html.rtly-vision.rtly-dark main#primary#primary#primary .rtly-whead *{color:inherit!important}html.rtly-vision.rtly-dark main#primary#primary#primary .retirely-rss-card__h2,html.rtly-vision.rtly-dark main#primary#primary#primary .retirely-side-card__h2{color:#E5EAF1!important;background:transparent!important}
/* style */
html.rtly-vision main#primary#primary#primary #rtly-hbar{transition:none!important;flex:0 1 440px!important;width:440px!important;max-width:100%!important;height:40px!important;border-radius:9.2px!important;padding:4px 12px 4px 14px!important;gap:12px!important;box-shadow:none!important}html.rtly-vision main#primary#primary#primary #rtly-hbar > svg{width:16px!important;height:16px!important;flex:0 0 16px!important}html.rtly-vision main#primary#primary#primary #rtly-hbar input{font-size:14px!important;font-weight:400!important;font-family:Inter,system-ui,-apple-system,sans-serif!important}html.rtly-vision main#primary#primary#primary #rtly-hbar .kbd{background:transparent!important;border:0!important;box-shadow:none!important;padding:0!important;font-size:16px!important;color:#AEB4BC!important;border-radius:0!important}html.rtly-vision:not(.rtly-dark) main#primary#primary#primary #rtly-hbar{background:#F4F5F6!important;border:1px solid transparent!important}html.rtly-vision:not(.rtly-dark) main#primary#primary#primary #rtly-hbar:focus-within{background:#F4F5F6!important;border-color:transparent!important;box-shadow:none!important}html.rtly-vision:not(.rtly-dark) main#primary#primary#primary #rtly-hbar input{color:#18181B!important}html.rtly-vision:not(.rtly-dark) main#primary#primary#primary #rtly-hbar input::placeholder{color:#9AA1AA!important}html.rtly-vision:not(.rtly-dark) main#primary#primary#primary #rtly-hbar > svg{color:#0E0F11!important;stroke:#0E0F11!important}
/* style */
html.rtly-vision main#primary#primary#primary .retirely-news__main{border-left:0!important;border-right:0!important}html.rtly-vision main#primary#primary#primary .cs-header__inner-desktop{transition:none!important;padding-top:9px!important;padding-bottom:9px!important}html.rtly-vision main#primary#primary#primary #rtly-signup{transition:background-color .16s ease,border-color .16s ease,color .16s ease,box-shadow .16s ease,filter .16s ease!important;border-radius:9999px!important;padding:0 15px!important;height:34px!important;display:inline-flex!important;align-items:center!important;gap:7px!important;font-size:13.5px!important;box-sizing:border-box!important;background:linear-gradient(92deg,#c99e1a,#e0bb50 48%,#ad7f10)!important;color:#17191E!important;border:1px solid transparent!important;font-weight:700!important;box-shadow:none!important}html.rtly-vision main#primary#primary#primary #rtly-hiw{transition:background-color .16s ease,border-color .16s ease,color .16s ease,box-shadow .16s ease,filter .16s ease!important;border-radius:9999px!important;padding:0 15px!important;height:34px!important;display:inline-flex!important;align-items:center!important;gap:7px!important;font-size:13.5px!important;box-sizing:border-box!important;background:#F1F2F5!important;color:#4B5361!important;border:1px solid transparent!important;font-weight:500!important}html.rtly-vision main#primary#primary#primary #rtly-hiw:hover{background:#E6E8ED!important;color:#272C35!important}html.rtly-vision main#primary#primary#primary #rtly-hiw .i{border-color:#A6ADB9!important;color:#69707C!important}html.rtly-vision main#primary#primary#primary #rtly-signup:hover{background:linear-gradient(92deg,#c99e1a,#e0bb50 48%,#ad7f10)!important;border-color:transparent!important;color:#17191E!important;opacity:1!important;box-shadow:0 3px 12px rgba(169,123,14,.38)!important;filter:brightness(1.06)!important}html.rtly-vision main#primary#primary#primary #rtly-login{transition:background-color .16s ease,border-color .16s ease,color .16s ease,box-shadow .16s ease,filter .16s ease!important;border-radius:9999px!important;padding:0 15px!important;height:34px!important;display:inline-flex!important;align-items:center!important;gap:7px!important;font-size:13.5px!important;box-sizing:border-box!important;background:#fff!important;color:#20242C!important;border:1px solid #E0E3E9!important;font-weight:600!important}html.rtly-vision main#primary#primary#primary #rtly-login:hover{background:#EDEFF3!important;color:#0E0F11!important;border-color:#C8CEd8!important}html.rtly-vision.rtly-dark main#primary#primary#primary #rtly-signup{background:linear-gradient(135deg,#C9A227,#EBD48A)!important;color:#1a1400!important;border:1.5px solid transparent!important}html.rtly-vision.rtly-dark main#primary#primary#primary #rtly-signup:hover{background:linear-gradient(135deg,#E8C46A,#F5DC9A)!important;border-color:transparent!important;color:#1a1400!important}html.rtly-vision.rtly-dark main#primary#primary#primary #rtly-login{background:transparent!important;color:#E5EAF1!important;border-color:#2A313B!important}html.rtly-vision.rtly-dark main#primary#primary#primary #rtly-login:hover{background:#161A20!important;border-color:#323A45!important;color:#E5EAF1!important}
/* style */
html.rtly-vision main#primary#primary#primary #rtly-hiw{transition:background-color .16s ease,color .16s ease!important;background:#F1F2F5!important;border:0!important;border-radius:999px!important;padding:7px 12px!important;box-shadow:none!important;text-decoration:none!important;display:inline-flex!important;align-items:center!important;gap:6px!important}html.rtly-vision main#primary#primary#primary #rtly-hiw .i{background-image:none!important;background:#fff!important;color:#8a6d1f!important;border:1.5px solid #c9a227!important;border-radius:50%!important;width:18px!important;height:18px!important;min-width:18px!important;box-sizing:border-box!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;font-size:11px!important;font-weight:700!important;font-style:normal!important;line-height:1!important}html.rtly-vision main#primary#primary#primary #rtly-hiw:hover .i{background:#c9a227!important;color:#fff!important}html.rtly-vision main#primary#primary#primary #rtly-hiw:hover{background:#E6E8ED!important;color:#13171d!important;text-decoration:none!important}html.rtly-vision.rtly-dark main#primary#primary#primary #rtly-hiw:hover{background:#1b212b!important;color:#e5eaf1!important}html.rtly-vision main#primary#primary#primary #rtly-signup{margin-left:-6px!important}html.rtly-vision.rtly-dark main#primary#primary#primary #rtly-hiw{background:transparent!important;border:0!important}html.rtly-vision.rtly-dark main#primary#primary#primary #rtly-hiw .i{background:transparent!important;color:#ffdf7e!important;border-color:#d4af37!important}
/* style */
html.rtly-vision main#primary#primary#primary .cs-header__logo .rtly-dot{display:none!important}html.rtly-vision main#primary#primary#primary #rtly-cats .c{font-size:12.5px!important;padding:6px 10px!important;font-weight:500!important}html.rtly-vision main#primary#primary#primary #rtly-cats{gap:8px!important}html.rtly-vision main#primary#primary#primary #rtly-hiw{margin-left:auto!important;margin-right:0!important}html.rtly-vision main#primary#primary#primary #rtly-hbar{margin-right:8px!important}html.rtly-vision main#primary#primary#primary #rtly-login{margin-left:10px!important}html.rtly-vision main#primary#primary#primary .retirely-card:hover{transform:none!important;box-shadow:0 14px 34px -18px rgba(30,40,90,.22),0 0 24px rgba(201,162,39,.14)!important;border-color:rgba(201,162,39,.7)!important}html.rtly-vision main#primary#primary#primary .retirely-card:hover img{transform:none!important}html.rtly-vision main#primary#primary#primary .retirely-card:hover .retirely-card__title{text-decoration:none!important}
/* style */
html.rtly-vision main#primary#primary#primary .cs-header__inner-desktop{align-items:center!important}html.rtly-vision main#primary#primary#primary #rtly-login,html.rtly-vision main#primary#primary#primary #rtly-signup{padding-top:7px!important;padding-bottom:7px!important;padding-left:15px!important;padding-right:15px!important;line-height:1!important;box-sizing:border-box!important;letter-spacing:0!important}
/* style */
html.rtly-vision .cs-header__logo .rtly-tm{margin-left:2px!important}
/* style */
html.rtly-vision main#primary#primary#primary .cs-header__inner-desktop .rtly-icon-btn--menu,html.rtly-vision main#primary#primary#primary .cs-header__inner-desktop .rtly-drawer-open{display:inline-flex!important;align-items:center!important;justify-content:center!important}
/* style */
html.rtly-vision main#primary#primary#primary .rtly-wire,html.rtly-vision main#primary#primary#primary .retirely-rss-card,html.rtly-vision main#primary#primary#primary .retirely-side-card{padding-top:4px!important}html.rtly-vision main#primary#primary#primary .rtly-whead,html.rtly-vision main#primary#primary#primary .retirely-rss-card__h2,html.rtly-vision main#primary#primary#primary .retirely-side-card__h2{padding-top:8px!important;margin-top:0!important}html.rtly-vision main#primary#primary#primary .cs-header__inner-desktop{min-height:60px!important;padding-top:0!important;padding-bottom:0!important}html.rtly-vision body.home .cs-main-content{padding-top:0!important}html.rtly-vision main#primary#primary#primary #rtly-brief .rtly-row{transform:translateY(3px)!important}html.rtly-authed.rtly-vision main#primary#primary#primary #rtly-login,html.rtly-authed.rtly-vision main#primary#primary#primary #rtly-signup,html.rtly-authed.rtly-vision main#primary#primary#primary #rtly-hiw,html.rtly-authed.rtly-vision main#primary#primary#primary .cs-header__inner-desktop .rtly-icon-btn--menu{display:none!important}
/* rtly-adtable-css */
html body .ad-scroll th.fees,html body .ad-scroll td.fees{text-align:center!important}html body .ad-scroll th.flag,html body .ad-scroll td.flag{text-align:center!important;padding-right:10px!important}html body .ad-scroll th.rank,html body .ad-scroll td.rank{text-align:center!important;padding-left:10px!important}html body #ad-body td.aum{--rtly-p:0%;position:relative;background-image:none}html body #ad-body td.aum::after{content:"";position:absolute;left:10px;right:10px;bottom:7px;height:3px;border-radius:2px;pointer-events:none;background:linear-gradient(90deg,rgba(201,162,39,.95) 0 var(--rtly-p),rgba(201,162,39,.16) var(--rtly-p) 100%)}html:not(.rtly-light) body #ad-body td.aum::after{background:linear-gradient(90deg,rgba(232,199,102,.95) 0 var(--rtly-p),rgba(232,199,102,.22) var(--rtly-p) 100%)}html body #ad-body td.aum[data-rtly-nobar]::after{display:none}
/* rtly-briefpin-css */
html body #rtly-brief .rtly-row{min-height:40px}@media(min-width:761px){html body #rtly-brief #rtly-wx-ico{min-width:34px;min-height:34px}}
/* rtly-cardbyline-css */
html body .retirely-card__meta>time{order:1}html body .retirely-card__meta>.retirely-card__meta-sep{order:2}html body .retirely-card__meta>.rtly-cmark{order:3;margin-right:-2px}html body .retirely-card__meta>.retirely-card__source{order:4}html body .retirely-card__meta .retirely-card__source img{margin-right:4px}
/* rtly-goldlogo-css */
/* wordmark gold - LIGHT mode: deeper golds, easy on the eyes */
html body .cs-header__logo,
html body .cs-header__logo a,
html body #rtly-ph .ph-logo,
html body .ph-logo a{
background:linear-gradient(94deg,#a87c10,#d1a92e 50%,#8f6a08)!important;
-webkit-background-clip:text!important;
background-clip:text!important;
-webkit-text-fill-color:transparent!important;
color:transparent!important;
display:inline-block!important;
line-height:1.18!important;
padding:0 .06em .14em 0!important;
margin-bottom:-.14em!important;
overflow:visible!important;
}
/* DARK mode: the bright CHS4LIFE gradient */
html.rtly-dark body .cs-header__logo,
html.rtly-dark body .cs-header__logo a,
html.rtly-dark body #rtly-ph .ph-logo,
html.rtly-dark body .ph-logo a{
background:linear-gradient(92deg,#f5c518,#ffdf7e 45%,#d4af37)!important;
-webkit-background-clip:text!important;
background-clip:text!important;
}
/* gold header buttons, animated */
html body #rtly-signup{background:linear-gradient(92deg,#c99e1a,#e2be55 45%,#a97b0e)!important;color:#141821!important;font-weight:800!important;border:0!important;position:relative!important;overflow:hidden!important;transition:transform .18s, box-shadow .18s!important}
html body #rtly-signup::after{content:"";position:absolute;top:-40%;left:0;width:45%;height:180%;background:linear-gradient(90deg,transparent,rgba(255,250,230,.5),transparent);transform:translateX(-130%) rotate(18deg);animation:rtlyBtnShine 3.8s ease-in-out infinite}
@keyframes rtlyBtnShine{0%,55%{transform:translateX(-130%) rotate(18deg)}100%{transform:translateX(300%) rotate(18deg)}}
html body #rtly-signup:hover{transform:translateY(-1px);box-shadow:0 6px 16px rgba(169,123,14,.35)!important}
html body #rtly-login{color:#8a6d1f!important;font-weight:700!important}
html body #rtly-login:hover{color:#a97b0e!important}
html body #rtly-hiw .i,html body #rtly-hiw span{border-color:#a97b0e!important;color:#8a6d1f!important}
html body #rtly-hiw{color:#5d6472!important}
@media (prefers-reduced-motion:reduce){html body #rtly-signup::after{animation:none}}
/* header underline: soft hairline like the pulse card, not a black bar */
html body header.cs-header.cs-header{border-bottom:0!important;box-shadow:none!important}
html body header.cs-header .cs-header__inner-desktop{border-bottom:0!important}
html body header.cs-header::after{display:none!important}
/* wider header + page containers */
html body header.cs-header .cs-container,
html body .cs-header__inner-desktop,
html body .rtly-lean-bar{max-width:1320px!important}
/* rtly-hdrbtn-css */
html:not(.rtly-authed) body #rtly-hiw#rtly-hiw#rtly-hiw,html:not(.rtly-authed) body #rtly-login#rtly-login#rtly-login,html:not(.rtly-authed) body #rtly-signup#rtly-signup#rtly-signup{height:34px!important;padding:0 15px!important;border-radius:999px!important;font-size:13.5px!important;font-weight:600!important;line-height:1!important;box-sizing:border-box!important;align-items:center!important;gap:7px!important;white-space:nowrap!important;text-decoration:none!important;transition:background-color .16s ease,border-color .16s ease,color .16s ease,box-shadow .16s ease,filter .16s ease!important}html:not(.rtly-authed) body #rtly-hiw#rtly-hiw#rtly-hiw{margin-left:auto!important;margin-right:6px!important;order:5!important}html:not(.rtly-authed) body #rtly-login#rtly-login#rtly-login{order:6!important}html:not(.rtly-authed) body #rtly-signup#rtly-signup#rtly-signup{order:7!important}html:not(.rtly-authed) body #rtly-hiw#rtly-hiw#rtly-hiw{background:#F1F2F5!important;border:1px solid transparent!important;color:#4B5361!important;font-weight:500!important}html:not(.rtly-authed) body #rtly-hiw#rtly-hiw#rtly-hiw:hover{background:#E6E8ED!important;color:#272C35!important}html:not(.rtly-authed) body #rtly-hiw#rtly-hiw#rtly-hiw .i{border-color:#A6ADB9!important;color:#69707C!important}html:not(.rtly-authed) body #rtly-hiw#rtly-hiw#rtly-hiw:hover .i{border-color:#7C8492!important;color:#4B5361!important}html:not(.rtly-authed) body #rtly-login#rtly-login#rtly-login{background:#fff!important;border:1px solid #E0E3E9!important;color:#20242C!important}html:not(.rtly-authed) body #rtly-login#rtly-login#rtly-login:hover{background:#F4F5F8!important;border-color:#CFD4DC!important;color:#0E0F11!important}html:not(.rtly-authed) body #rtly-signup#rtly-signup#rtly-signup{background:linear-gradient(92deg,#c99e1a,#e0bb50 48%,#ad7f10)!important;border:1px solid transparent!important;color:#17191E!important;font-weight:700!important}html:not(.rtly-authed) body #rtly-signup#rtly-signup#rtly-signup:hover{box-shadow:0 3px 12px rgba(169,123,14,.38)!important;filter:brightness(1.06)!important}html:not(.rtly-light) body #rtly-hiw#rtly-hiw#rtly-hiw{background:#16181E!important;color:#B7BEC9!important}html:not(.rtly-light) body #rtly-hiw#rtly-hiw#rtly-hiw:hover{background:#1F232B!important;color:#EDEFF3!important}html:not(.rtly-light) body #rtly-hiw#rtly-hiw#rtly-hiw .i{border-color:#6C7482!important;color:#98A0AD!important}html:not(.rtly-light) body #rtly-login#rtly-login#rtly-login{background:transparent!important;border-color:#2B303A!important;color:#E8EAED!important}html:not(.rtly-light) body #rtly-login#rtly-login#rtly-login:hover{background:#1A1D24!important;border-color:#3C434F!important;color:#fff!important}
/* rtly-hdrlayer-css */
html body header.cs-header{will-change:transform}html body #rtly-brief,html body #eve-pulse{will-change:transform}html body #rtly-brief .rtly-row{will-change:transform}
/* rtly-lightmode-css */
html.rtly-light #rtly-goldpromo{background-image:linear-gradient(160deg,#FFFDF6,#F7EFD9 60%)!important;border-color:rgba(201,162,39,.55)!important;box-shadow:0 6px 20px -12px rgba(138,109,31,.45)!important}html.rtly-light #rtly-goldpromo .st{color:#8A6D1F!important}html.rtly-light #rtly-goldpromo .tt{color:#2B230E!important}html.rtly-light #rtly-goldpromo .ar{color:#8A6D1F!important}html.rtly-light #rtly-goldpromo::after{background-image:linear-gradient(90deg,rgba(201,162,39,0) 0%,rgba(201,162,39,.18) 42%,rgba(255,208,92,.46) 50%,rgba(201,162,39,.18) 58%,rgba(201,162,39,0) 100%)!important}.retirely-loadmore{background:#fff!important;border:1.5px solid #C9A227!important;color:#8A6D1F!important;font-weight:700!important;transition:background .16s,transform .16s}.retirely-loadmore:hover{background:#FDFBF3!important;transform:translateY(-1px)}html:not(.rtly-light) .retirely-loadmore{background:#121417!important;border-color:#8a6d1f!important;color:#e8c766!important}html:not(.rtly-light) .retirely-loadmore:hover{background:#15130C!important}@media(prefers-reduced-motion:reduce){.retirely-loadmore{transition:none}}
/* rtly-pulsehover-css */
html body #eve-pulse .rqi a:hover .rqt{opacity:.6}
/* rtly-ra2img-css */
html body .ra2 img{margin-top:0!important;margin-bottom:0!important}
/* rtly-railpulse-css */
html body #eve-pulse .rqi a .rqt,html body #eve-pulse .rqi a .rqs{transition:color .15s}html.rtly-light body #eve-pulse .rqi a:hover .rqt{color:#000000!important}html.rtly-light body #eve-pulse .rqi a:hover .rqs{color:#5C626C!important}html:not(.rtly-light) body #eve-pulse .rqi a:hover .rqt{color:#FFFFFF!important}html:not(.rtly-light) body #eve-pulse .rqi a:hover .rqs{color:#B6BCC4!important}@media(prefers-reduced-motion:reduce){html body #eve-pulse .rqi a .rqt,html body #eve-pulse .rqi a .rqs{transition:none}}html body #rtly-wh .it .t,html body #rtly-area .it .t{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;line-height:1.32;height:auto;max-height:3.96em}html body #rtly-wh .list .it,html body #rtly-area .list .it,html body #rtly-wh .more .it,html body #rtly-area .more .it{min-height:94px}html body #rtly-wh .rtly-whead,html body #rtly-area .rtly-whead{margin-left:-14px;margin-right:-14px;padding-left:14px;padding-right:14px;border-radius:13px 13px 0 0}html body #rtly-wh .rtly-whead::before,html body #rtly-area .rtly-whead::before{content:"";position:absolute;left:0;right:0;top:-6px;height:6px;background:inherit;pointer-events:none}
/* rtly-cardmark-css */
html body .retirely-card__meta img.rtly-cmark{width:16px!important;height:16px!important;max-width:16px!important;max-height:16px!important;min-width:0!important;min-height:0!important;flex:0 0 16px!important;border-radius:3px!important;margin:0!important;padding:0!important;border:0!important;display:block!important;aspect-ratio:auto!important}html body .retirely-card__meta img.rtly-cmark.rtly-cmark{object-fit:contain!important}html body .retirely-card__meta .rtly-cmark-mono{display:inline-flex!important;align-items:center;justify-content:center;width:16px!important;height:16px!important;border-radius:50%!important;flex:0 0 16px!important;border:1.5px solid #C9A227!important;color:#8A6D1F;background:#FFFDF6;margin:0!important;padding:0!important;font-size:6.5px;font-weight:800;letter-spacing:.02em;line-height:1}html:not(.rtly-light) body .retirely-card__meta .rtly-cmark-mono{border-color:#8a6d1f!important;color:#e8c766;background:#121417}
/* rtly-bars-css */
/* RTLY-BARS-V18 — the Bars look, live (approved 2026-08-30: "let's roll with this one for live").
v1.1: the strip and pulse edges sit flush with the card columns (the wires sit 4px inside their
grid tracks at every width — Alex flagged the right-edge overhang on 2026-08-31).
v1.2: the strip and pulse are the same 46px height (strip was 50, pulse 40 — Alex flagged it):
row padding 7→5, both bars min-height 46, pulse flex-centers its content in the taller box.
v1.3: flat — tile shadows off in both themes (--brl-sh:none), borders alone define the tiles.
v1.7 (2026-09-04): shadow OFF the date bar too - Alex asked for it flat. --brl-sh-strip:none
in both themes; borders alone define all three tiles now.
v1.4: a little shadow back on the date bar only (--brl-sh-strip, ~half the old presence);
pulse and chips stay flat.
v1.6: printed SITE-WIDE (was front-page only — Alex flagged /contact-us/ still showing the old
strip): the rules only touch the strip/pulse/chips/hiw where they exist, so other pages are
inert; the hiw override is structure-free because that button sits outside main#primary on
secondary routes.
v1.8 (2026-09-06): the date sits 5px further left - row padding-left 16 -> 11, so "Sunday" starts
flush with "What's happening" in the rail below (both 15px inside their tile: 1px border + 14px),
1px shy of the pulse beacon ring. Alex: "the Saturday date should be moved to the left a bit."
Desktop only (min-width 941px): phones and small tablets keep the standard homepage untouched.
Theme-aware: white tiles on the light theme; on dark, the vision skin's card surface (#0A0A0A tile,
#1E2126 line) so the three bars match the cards' dark tile language on the #000 canvas.
Steps aside whenever a ?look= preview stamps data-rtly-look on the html element. */
@media (min-width:941px){
html:not([data-rtly-look]){--brl-tile:#FFFFFF;--brl-line:#E8EAEF;--brl-sh:none;--brl-sh-strip:none}
html:not([data-rtly-look]):not(.rtly-light){--brl-tile:#0A0A0A;--brl-line:#1E2126;--brl-sh:none;--brl-sh-strip:none}
/* bar 1: the briefing strip */
html:not([data-rtly-look]) body main#primary#primary#primary#primary#primary #rtly-brief{background:var(--brl-tile)!important;border:1px solid var(--brl-line)!important;border-radius:14px!important;box-shadow:var(--brl-sh-strip)!important;margin:10px 29px 0 23px!important;max-width:none!important;width:auto!important;box-sizing:border-box!important;min-height:46px!important}
html:not([data-rtly-look]) body main#primary#primary#primary#primary#primary #rtly-brief .rtly-row{padding-top:5px!important;padding-bottom:5px!important;padding-left:11px!important;padding-right:14px!important;transform:none!important}
html:not([data-rtly-look]) body main#primary#primary#primary#primary#primary #rtly-brief::after{display:none!important}
/* bar 2: the advisor pulse (same tile language; it already sits 19/25 inside the frame) */
html:not([data-rtly-look]) body main#primary#primary#primary#primary#primary #eve-pulse{background:var(--brl-tile)!important;border:1px solid var(--brl-line)!important;border-radius:14px!important;box-shadow:var(--brl-sh)!important;margin:8px 29px 10px 23px!important;min-height:46px!important}
/* bar 3: the category chips in their own pill bar */
html:not([data-rtly-look]) body main#primary#primary#primary#primary#primary #rtly-cats#rtly-cats{background:var(--brl-tile)!important;border:1px solid var(--brl-line)!important;border-radius:999px!important;box-shadow:var(--brl-sh)!important;padding:6px 10px!important;margin-top:2px!important;margin-bottom:12px!important;justify-content:space-between!important;--cmsz:44px!important;box-sizing:border-box!important}
html:not([data-rtly-look]) body main#primary#primary#primary#primary#primary #rtly-cats#rtly-cats::after{display:none!important}
html:not([data-rtly-look]) body main#primary#primary#primary#primary#primary #rtly-cats#rtly-cats .c{margin-right:0!important}
/* the masthead keeps its full-bleed hairline; give the bars a touch of air under it */
html:not([data-rtly-look]) body main#primary#primary#primary#primary#primary .retirely-news__shell{padding-top:2px!important}
/* v1.5/v1.6: the How-it-works pill loses its grey (Alex 2026-08-31) - quiet text+icon; hover keeps
a whisper. Structure-free id-repetition so it wins on every route, inside main#primary or not. */
html:not([data-rtly-look]) body #rtly-hiw#rtly-hiw#rtly-hiw#rtly-hiw#rtly-hiw#rtly-hiw{background:transparent!important}
html.rtly-light:not([data-rtly-look]) body #rtly-hiw#rtly-hiw#rtly-hiw#rtly-hiw#rtly-hiw#rtly-hiw:hover{background:#EEF0F3!important}
html:not(.rtly-light):not([data-rtly-look]) body #rtly-hiw#rtly-hiw#rtly-hiw#rtly-hiw#rtly-hiw#rtly-hiw:hover{background:#1B212B!important}
}
/* centre-feed fix: release the 941-1099px viewport-tall scrollbox (applies to every theme and flag) */
@media (min-width:941px){
html body main#primary#primary#primary .retirely-news__main{max-height:none!important;overflow:visible!important}
}
/* rtly-avatarring-css */
#rtly-avatar,#rtly-bm .bm-av{background-color:#F2F5F9!important;box-shadow:0 0 0 1.5px rgba(16,20,26,.14)}html:not(.rtly-light) #rtly-avatar,html:not(.rtly-light) #rtly-bm .bm-av{background-color:#F2F5F9!important;box-shadow:0 0 0 1.5px rgba(255,255,255,.30)}
/* rtly-mono-css */
/* Component-level desaturation. Each selector is a self-contained block that holds no ad unit and no
position:fixed child (a filter would become their containing block). Ads are iframes in their own
documents and are never inside these blocks - the top billboard is a sibling of .rtly-house. */
html.rtly-mono header.cs-header,
html.rtly-mono #rtly-brief,
html.rtly-mono #eve-pulse,
html.rtly-mono #rtly-cats,
html.rtly-mono .rtly-wire,
html.rtly-mono .retirely-news__side,
html.rtly-mono .retirely-grid > *,
html.rtly-mono #rtly-topad .rtly-house,
html.rtly-mono #rtly-pageskel,
html.rtly-mono #rtly-cx,
html.rtly-mono #rtly-ad,
html.rtly-mono #rtly-bm,
html.rtly-mono footer,
html.rtly-mono .site-footer,
html.rtly-mono #colophon{filter:grayscale(1)}
/* photos and video everywhere (article bodies included - their in-content ads are iframes, untouched) */
html.rtly-mono img,
html.rtly-mono video,
html.rtly-mono picture{filter:grayscale(1)}
/* article bodies are not filtered as a block (Auto ads live inside them) - so ink the accents by hand */
html.rtly-mono .entry-content a,
html.rtly-mono .rtly-art a,
html.rtly-mono article .entry-content a:hover{color:inherit;text-decoration:underline}
/* v1.1 (Alex): the wordmark goes FULL black in mono (white on dark), not the grey the gradient desaturates to */
html.rtly-mono .cs-header__logo,html.rtly-mono .cs-header__logo .rtly-tm,html.rtly-mono .cs-header__logo .rtly-dot{background-image:none!important;-webkit-text-fill-color:#16181D!important;color:#16181D!important}
html.rtly-mono:not(.rtly-light) .cs-header__logo,html.rtly-mono:not(.rtly-light) .cs-header__logo .rtly-tm,html.rtly-mono:not(.rtly-light) .cs-header__logo .rtly-dot{-webkit-text-fill-color:#F2F5F9!important;color:#F2F5F9!important}
/* v1.2 (Alex, 2026-09-09): "more blacked out / matte black in places, not this grey - it's hard on the eyes".
grayscale() turns the site's gold (#C9A227) into a washed-out #A1A1A1 and its greens/reds into mid greys, so every
accent read as disabled. In mono the accent family is now flat ink - black on light, white on dark - and photos keep
plain grayscale. Selectors were taken from a live scan of the desaturated blocks; the #rtly-cats rules stack ids on
purpose because rtly-catmotion colours those icons with a 4/5-id !important selector. */
html.rtly-mono{--mink:#16181D}
html.rtly-mono:not(.rtly-light){--mink:#F2F5F9}
/* header: Publish */
html.rtly-mono #rtly-publish,html.rtly-mono #rtly-publish svg{color:var(--mink)!important;border-color:var(--mink)!important}
/* briefing strip: up/down figures and the chip rings */
html.rtly-mono #rtly-brief [id^="rtly-chip-"]{color:var(--mink)!important}
html.rtly-mono #rtly-brief .rtly-chiplink svg circle{stroke:var(--mink)!important}
/* advisor pulse: gold bar, gradient label, EKG line + dot, LIVE beacon */
html.rtly-mono #eve-pulse::before{background-image:none!important;background-color:var(--mink)!important}
html.rtly-mono #eve-pulse .lbl{background-image:none!important;-webkit-text-fill-color:var(--mink)!important;color:var(--mink)!important}
html.rtly-mono #eve-pulse .ekg path.wv,html.rtly-mono #eve-pulse .rqb svg path{stroke:var(--mink)!important}
html.rtly-mono #eve-pulse .ekgdot{border-color:var(--mink)!important}
html.rtly-mono #eve-pulse .ekgdot::before,html.rtly-mono #eve-pulse .ekgdot::after{background-image:none!important;background-color:var(--mink)!important;border-color:var(--mink)!important}
html.rtly-mono #eve-pulse .bcn i{background-color:var(--mink)!important}
html.rtly-mono #eve-pulse .bcn b{border-color:var(--mink)!important}
/* category icons: one ink (their per-category hue comes from a 5-id !important rule) */
html.rtly-mono body #rtly-cats#rtly-cats#rtly-cats#rtly-cats#rtly-cats .c[data-cat][data-cat],html.rtly-mono body #rtly-cats#rtly-cats#rtly-cats#rtly-cats#rtly-cats .c[data-cat][data-cat] svg{color:var(--mink)!important;stroke:var(--mink)!important}
/* wires + side rails: fresh timestamps and the LIVE dot; card meta time */
html.rtly-mono .rtly-wire .m b,html.rtly-mono .retirely-news__side .m b,html.rtly-mono .rtly-wire .lv,html.rtly-mono .retirely-news__side .lv,html.rtly-mono .retirely-card__meta time{color:var(--mink)!important}
html.rtly-mono .rtly-wire .lv i,html.rtly-mono .retirely-news__side .lv i{background-color:var(--mink)!important}
/* partner cards: bar, avatar ring, pills, CTA, stars, chart dot (the CTA shimmer is just switched off) */
html.rtly-mono .rtly-feat2__bar,html.rtly-mono .rtly-feat2__ring::before,html.rtly-mono .rtly-feat2__spk i,html.rtly-mono .rtly-feat2__pill i{background-image:none!important;background-color:var(--mink)!important}
html.rtly-mono .rtly-feat2__cta::after{background-image:none!important}
html.rtly-mono .rtly-feat2__pill,html.rtly-mono .rtly-feat2__stars u,html.rtly-mono .rtly-feat2__delta,html.rtly-mono .rtly-feat2__cta{color:var(--mink)!important}
html.rtly-mono .rtly-feat2__pill,html.rtly-mono .rtly-feat2__cta,html.rtly-mono .rtly-feat2__rvpop{border-color:var(--mink)!important}
html.rtly-mono .rtly-feat2__chart svg circle{fill:var(--mink)!important}
/* v1.3 (Alex, 2026-09-10): "make even the borders black - less grey more black". Every hairline the skin used to
leave as a pale grey is now a 1px ink rule: the strip, pulse and category containers, the wires and their item
dividers, story and partner cards (and their left accent bar, which was gold), the header and strip hairlines, the
footer rules and social/badge pills, the burger panel. Category icons become white discs with an ink ring.
--mbd is the border ink: black on light, near-white on dark. The doubled .rtly-mono class outranks the site's own
!important border rules (dark-mode card borders etc.) regardless of source order. */
html.rtly-mono{--mbd:#16181D}
html.rtly-mono:not(.rtly-light){--mbd:#E5EAF1}
html.rtly-mono.rtly-mono #rtly-brief,html.rtly-mono.rtly-mono #eve-pulse,html.rtly-mono.rtly-mono #rtly-cats,html.rtly-mono.rtly-mono .rtly-wire,html.rtly-mono.rtly-mono .retirely-card,html.rtly-mono.rtly-mono .rtly-feat2__tip,html.rtly-mono.rtly-mono #rtly-bm,html.rtly-mono.rtly-mono #rtly-bm .bm-av,html.rtly-mono.rtly-mono #rtly-bm .bm-qr,html.rtly-mono.rtly-mono footer .ft-s,html.rtly-mono.rtly-mono footer .ft-badge{border-color:var(--mbd)!important}
html.rtly-mono.rtly-mono .rtly-feat2__hd,html.rtly-mono.rtly-mono #rtly-bm .bm-top{border-bottom-color:var(--mbd)!important}
html.rtly-mono.rtly-mono footer#rtly-foot,html.rtly-mono.rtly-mono footer .ft-mid,html.rtly-mono.rtly-mono #rtly-bm .bm-sec,html.rtly-mono.rtly-mono #rtly-bm .bm-app{border-top-color:var(--mbd)!important}
html.rtly-mono.rtly-mono header.cs-header::after,html.rtly-mono.rtly-mono #rtly-brief::after{background-color:var(--mbd)!important}
html.rtly-mono.rtly-mono .rtly-wire a.it,html.rtly-mono.rtly-mono .retirely-news__side a.it{border-bottom-color:var(--mbd)!important}
html.rtly-mono.rtly-mono .retirely-card{box-shadow:inset 3px 0 0 0 var(--mbd)!important}
html.rtly-mono.rtly-mono .rtly-wire a.it.jin,html.rtly-mono.rtly-mono .rtly-wire a.it.en,html.rtly-mono.rtly-mono .retirely-news__side a.it.jin,html.rtly-mono.rtly-mono .retirely-news__side a.it.en{box-shadow:inset 3px 0 0 0 var(--mbd)!important}
html.rtly-mono.rtly-mono body #rtly-cats#rtly-cats#rtly-cats#rtly-cats#rtly-cats .c[data-cat][data-cat]{background:#fff!important;border-color:var(--mbd)!important}
html.rtly-mono.rtly-mono:not(.rtly-light) body #rtly-cats#rtly-cats#rtly-cats#rtly-cats#rtly-cats .c[data-cat][data-cat]{background:transparent!important}
/* the switch row in the burger, mirroring the Dark mode row */
#rtly-bm .bm-r.bm-mono{justify-content:space-between!important}
#rtly-bm .bm-mono .bm-lab{display:flex;align-items:center;gap:10px}
#rtly-bm .bm-mono .bm-tg{position:relative;width:38px;height:22px;border-radius:999px;background:#DDE1E7;flex:0 0 38px;transition:background .2s cubic-bezier(.2,.7,.2,1)}
#rtly-bm .bm-mono .bm-tg:after{content:"";position:absolute;top:2px;left:2px;width:18px;height:18px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(16,20,26,.3);transition:transform .2s cubic-bezier(.2,.7,.2,1)}
#rtly-bm .bm-mono.on .bm-tg{background:#16181D}
#rtly-bm .bm-mono.on .bm-tg:after{transform:translateX(16px)}
html:not(.rtly-light) #rtly-bm .bm-mono .bm-tg{background:#2A2F37}
html:not(.rtly-light) #rtly-bm .bm-mono.on .bm-tg{background:#E8ECF2}
html:not(.rtly-light) #rtly-bm .bm-mono.on .bm-tg:after{background:#16181D}
@media (prefers-reduced-motion:reduce){#rtly-bm .bm-mono .bm-tg,#rtly-bm .bm-mono .bm-tg:after{transition:none}}
/* style */
.perfmatters-lazy-video{position:relative;width:100%;max-width:100%;height:0;padding-bottom:56.23%;overflow:hidden}.perfmatters-lazy-video img{position:absolute;top:0;right:0;bottom:0;left:0;display:block;width:100%;height:100%;max-width:none;margin:0;object-fit:cover;object-position:center;border:none;cursor:pointer;transition:.5s all;-webkit-transition:.5s all;-moz-transition:.5s all}.perfmatters-lazy-video img:hover{-webkit-filter:brightness(75%)}.perfmatters-lazy-video .play{position:absolute;top:50%;left:50%;right:auto;width:68px;height:48px;margin-left:-34px;margin-top:-24px;background:url(https://retire.ly/wp-content/plugins/perfmatters/img/youtube.svg) no-repeat;background-position:center;background-size:cover;pointer-events:none;filter:grayscale(1)}.perfmatters-lazy-video:hover .play{filter:grayscale(0)}.perfmatters-lazy-video iframe{position:absolute;top:0;left:0;width:100%;height:100%;z-index:99}.wp-block-embed.wp-has-aspect-ratio .wp-block-embed__wrapper:has(.perfmatters-lazy-video)::before{display:none;}.perfmatters-lazy.pmloaded,.perfmatters-lazy.pmloaded>img,.perfmatters-lazy>img.pmloaded,.perfmatters-lazy[data-ll-status=entered]{animation:500ms pmFadeIn}@keyframes pmFadeIn{0%{opacity:0}100%{opacity:1}}
/* rtly-topad-css */
#rtly-topad{display:none;width:100%;box-sizing:border-box;background:#0C0C0C;padding:12px 0 0;min-height:138px;flex-direction:column;align-items:center;justify-content:flex-start;position:relative;z-index:1;font-family:"Noto Sans",system-ui,-apple-system,sans-serif}
#rtly-topad.rtly-topad--on{display:flex}
#rtly-topad.rtly-topad--empty{display:none!important}
#rtly-topad .rtly-topad__slot{position:relative;width:320px;height:100px}
#rtly-topad .rtly-topad__ins{display:inline-block;width:320px;height:100px;vertical-align:top}
#rtly-topad.rtly-topad--house .rtly-topad__ins{display:none!important}
#rtly-topad .rtly-topad__cap{display:flex;width:320px;justify-content:space-between;align-items:center;height:26px;font-size:11px;font-weight:500;line-height:1;letter-spacing:.06em;text-transform:uppercase;color:#8B909A}
#rtly-topad .rtly-topad__cap a{color:#8B909A;text-decoration:none;display:inline-flex;align-items:center;gap:6px}
#rtly-topad .rtly-topad__cap a:hover{color:#D4AF37}
#rtly-topad .rtly-house{display:none;position:absolute;inset:0;box-sizing:border-box;align-items:center;justify-content:space-between;gap:16px;padding:0 14px 0 16px;background:linear-gradient(100deg,#15171C 0%,#0F1014 60%,#121316 100%);border:1px solid #23262D;border-radius:6px;overflow:hidden;text-decoration:none;color:#F2F5F9}
#rtly-topad .rtly-house::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:linear-gradient(#F5C518,#FFDF7E,#D4AF37)}
#rtly-topad.rtly-topad--house .rtly-house{display:flex}
#rtly-topad .rtly-house__txt{display:flex;flex-direction:column;min-width:0}
#rtly-topad .rtly-house__k{display:none;font-size:11px;font-weight:700;line-height:1;letter-spacing:.14em;color:#D4AF37;text-transform:uppercase;margin-bottom:14px}
#rtly-topad .rtly-house__h{font-size:15px;font-weight:600;line-height:1.2;letter-spacing:-.01em;color:#F2F5F9}
#rtly-topad .rtly-house__s{display:none;font-size:15px;font-weight:400;line-height:1.45;color:#9AA1AA;margin-top:12px;max-width:560px}
#rtly-topad .rtly-house__cta{flex:none;display:inline-flex;align-items:center;gap:8px;height:32px;padding:0 12px;border-radius:999px;background:#D4AF37;color:#111;font-size:12px;font-weight:700;line-height:1;white-space:nowrap;box-shadow:0 8px 24px -10px rgba(212,175,55,.6)}
#rtly-topad .rtly-house__cta i{font-style:normal}
#rtly-topad .rtly-house__cta b{display:none;font-weight:inherit}
@media (min-width:760px){
#rtly-topad{min-height:128px}
#rtly-topad .rtly-topad__slot,#rtly-topad .rtly-topad__cap{width:728px}
#rtly-topad .rtly-topad__slot,#rtly-topad .rtly-topad__ins{height:90px}
#rtly-topad .rtly-topad__ins{width:728px}
#rtly-topad .rtly-house{padding:0 20px 0 24px}
#rtly-topad .rtly-house__h{font-size:20px}
#rtly-topad .rtly-house__cta{height:38px;padding:0 16px;font-size:13px}
#rtly-topad .rtly-house__cta b{display:inline}
}
@media (min-width:1010px){
#rtly-topad{min-height:288px}
#rtly-topad .rtly-topad__slot,#rtly-topad .rtly-topad__cap{width:970px}
#rtly-topad .rtly-topad__slot,#rtly-topad .rtly-topad__ins{height:250px}
#rtly-topad .rtly-topad__ins{width:970px}
#rtly-topad .rtly-house{padding:0 48px 0 44px}
#rtly-topad .rtly-house__k,#rtly-topad .rtly-house__s{display:block}
#rtly-topad .rtly-house__h{font-size:34px;line-height:1.12}
#rtly-topad .rtly-house__cta{height:48px;padding:0 22px;font-size:15px;gap:10px}
}
/* rtly-chrome-css */
.rtly-icon-btn{appearance:none;background:transparent;border:0;cursor:pointer;color:#000;padding:8px;display:inline-flex;align-items:center;justify-content:center;line-height:0}
.rtly-icon-btn:hover{opacity:.7}
/* rtly-burgerserve 2026-08-15: the burger is now a DIRECT child of the inner row,
printed last, so order:99 reaches it and it lands at the right edge AT FIRST PAINT.
It used to be nested inside .cs-col-left, which is why it had to be moved by JS after
paint on every route. These values match what rtly-colpin stamps, so colpin is a no-op. */
.cs-header__inner-desktop{justify-content:flex-start!important}
.cs-header__inner-desktop .cs-header__col{flex:0 1 auto!important;min-width:0!important;transition:none!important}
.cs-header__inner-desktop .rtly-icon-btn--menu{order:99!important;margin-right:-8px!important}
.cs-header__inner-desktop #rtly-hiw,.cs-header__inner-desktop #rtly-publish{margin-left:auto!important}
.cs-header__inner-desktop #rtly-login{margin-left:0!important}
@media(min-width:981px){.cs-header__inner-desktop .rtly-icon-btn--menu{margin-left:2px!important}}
@media(max-width:980px){.cs-header__inner-desktop .rtly-icon-btn--menu{margin-left:auto!important}}
.cs-header__inner-desktop .cs-logo{margin-left:-2px}
.cs-header__inner-desktop .cs-header__logo{padding-left:0}
.cs-header__inner-desktop .rtly-icon-btn--search{margin-left:8px}
/* rtly-searchpin 2026-08-15: #rtly-hbar is `flex:1 1 auto;max-width:540px`, so it GROWS
into spare room. Logged in the account cluster is ~100px narrower than the logged-out
one, so the bar inflates to 540 and sits wrong until rtly-newsroom's setTimeout(_harm,
8000) stamps the canonical layout - a visibly wrong header for EIGHT SECONDS (measured
on /ticker/NVDA/ and /ticker/AMD/, logged in). 440 is the canonical width; pinning it
makes the 8s stamp a no-op. Anonymous was never affected - the wider guest cluster left
no room to grow, which is why this only ever showed up logged in. */
@media(min-width:1176px){
header.cs-header .cs-header__inner-desktop #rtly-hbar{flex:0 0 440px!important;width:440px!important;max-width:440px!important}
}
/* rtly-heightpin 2026-08-19: logged in, rtly-newsroom rebuilds #rtly-hbar after paint
and the bar transiently renders 46px tall; the header row grows 60 -> 69 with it and
the briefing strip below rides the header bottom - a visible down-then-up nudge on
every authed load (fast machines settle in ms; slower ones show it for real time).
Canonical desktop heights are 60 (inner row) and 40 (search bar) on every route in
BOTH auth states, so pinning them makes the rebuild layout-inert. No overflow:hidden
here - the typeahead panel must stay free to extend below the bar. */
@media(min-width:1176px){
header.cs-header .cs-header__inner-desktop{height:60px!important;min-height:60px!important;max-height:60px!important}
header.cs-header .cs-header__inner-desktop #rtly-hbar{height:40px!important;min-height:40px!important;max-height:40px!important}
}
body.rtly-no-scroll{overflow:hidden}
/* rtly-ap-css */
/* GRIDFIX 2026-08-09: posts saved with the theme SIDEBAR layout make #content a grid
with a 320px sidebar track - the empty track squeezed #rtly-ap to 841px (Alex: "why
is this article not wide enough"). This page renders its own layout; the theme grid
has no business here. */
body.single #content.cs-main-content{display:block!important}
/* ⚑ SIMPLEHDR 2026-08-10 (Alex): articles get a MINIMAL top bar - wordmark, search and
the menu, nothing else. No How-it-works / Log In / Sign Up, no date-tickers-weather
strip, no Advisor Pulse. Everything here is 4x-ID so it beats rtly-shell's vision
block (`html.rtly-vision main#primary#primary#primary #rtly-hiw{display:inline-flex
!important}` = 3 IDs + a class) and the chrome layer's own `body.rtly-chrome
#eve-pulse{display:flex!important}`. Delete this block to restore the full chrome. */
html body.single #rtly-hiw#rtly-hiw#rtly-hiw#rtly-hiw,
html body.single #rtly-login#rtly-login#rtly-login#rtly-login,
html body.single #rtly-signup#rtly-signup#rtly-signup#rtly-signup,
html body.single #rtly-brief#rtly-brief#rtly-brief#rtly-brief,
html body.single #eve-pulse#eve-pulse#eve-pulse#eve-pulse{display:none!important}
/* ⚑ HDRALIGN 2026-08-10 (Alex: "on logged out the rtly chrome header thing need
alignment help" on an article). display:none removed the guest cluster from the FLEX
LINE, so nothing bounded the logo column and the header's free space split evenly into
two gaps - the search pill landed 108px right of home (x680 vs x572 @1717; same skew at
1440/1280). Home is dead consistent: the pill starts exactly 163px after the wordmark
at every width.
Fix: keep the three guest buttons IN the layout and merely make them invisible, so an
article's masthead is geometrically IDENTICAL to home's by construction, at every
width, instead of being hand-tuned to a magic number that drifts. visibility:hidden
also kills pointer events, so nothing is clickable - Alex still sees no
How-it-works / Log In / Sign Up.
GUESTS ONLY: logged in, PPH already display:nones these and home-in measures col126 /
pill x301, so authed articles must keep display:none to match. This also feeds
COLTRANS's `bounded` test in rtly-chrome (it reads display, not visibility), which is
what lets the column grow exactly like home's here and not on authed pages. */
html:not(.rtly-authed) body.single #rtly-hiw#rtly-hiw#rtly-hiw#rtly-hiw,
html:not(.rtly-authed) body.single #rtly-login#rtly-login#rtly-login#rtly-login,
html:not(.rtly-authed) body.single #rtly-signup#rtly-signup#rtly-signup#rtly-signup{display:inline-flex!important;visibility:hidden!important}
/* the strip/pulse are gone, so nothing should reserve their height either */
html body.single #rtly-brief#rtly-brief#rtly-brief#rtly-brief,
html body.single #eve-pulse#eve-pulse#eve-pulse#eve-pulse{height:0!important;min-height:0!important;margin:0!important;padding:0!important}
#rtly-ap{--ink:#16181D;--body:#3A414B;--mut:#5C626C;--faint:#8A919C;--f2:#9AA1AA;--line:#E6E9EF;--hair:#F0F2F5;--gold:#B8860B;--goldbg:#FDFBF3;--goldbd:#EBD9A6;--goldink:#7A5B0B;--green:#0B8F3A;
font-family:"Noto Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);max-width:1104px;margin:0 auto;padding:14px 0 60px}
#rtly-ap *{box-sizing:border-box}
#rtly-ap a{color:inherit;text-decoration:none}
#rtly-ap img{max-width:100%;height:auto}
/* breadcrumb */
#rtly-ap .ap-crumb{font-size:12.5px;color:var(--faint);margin:0 0 12px;display:flex;gap:7px;align-items:center;flex-wrap:wrap}
#rtly-ap .ap-crumb a{color:#77808D}
#rtly-ap .ap-crumb a:hover{color:var(--gold)}
#rtly-ap .ap-crumb em{font-style:normal;color:var(--f2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:46ch}
/* ---------- ONE FRAME, NOT THREE ----------
The hero, the lead image and the body were each a bordered card, so the story read as
boxes stacked inside boxes - three nested frames before a word of copy. News pages do
not do this: the story sits ON the page and the CARDS are reserved for things that are
genuinely separate objects (the rail, the comment thread, the related grid).
Borders and card backgrounds come off the reading column; spacing and a hairline
divider carry the structure instead. */
/* ⚑ ONE hairline under the byline row, not two. .ap-actions already draws it; this
header drew a second one 19px above it - that is the "double bar below the google
and share". */
#rtly-ap .ap-hero{border:0;border-radius:0;padding:0;background:transparent;margin:0 0 18px}
#rtly-ap .ap-eyebrow{font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--gold);margin-bottom:9px}
#rtly-ap .ap-hero h1{font-size:34px;line-height:1.16;font-weight:800;letter-spacing:-.9px;margin:0 0 10px;color:var(--ink)}
#rtly-ap .ap-dek{font-size:15.5px;line-height:1.6;color:var(--mut);margin:0 0 16px;max-width:76ch;font-weight:500}
/* ---------- byline + action row, Fool's shape ---------- */
#rtly-ap .ap-byline{display:flex;align-items:center;gap:9px;margin:16px 0 0;flex-wrap:wrap}
#rtly-ap .ap-avimg{width:26px;height:26px;border-radius:50%;object-fit:cover;flex:0 0 26px;background:var(--goldbg)}
#rtly-ap .ap-bytext{font-size:14.5px;color:var(--mut);line-height:1.5}
#rtly-ap .ap-bytext a{color:var(--goldink);font-weight:700;text-decoration:none}
#rtly-ap .ap-bytext a:hover{text-decoration:underline}
#rtly-ap .ap-dash,#rtly-ap .ap-dot{color:var(--faint)}
#rtly-ap .ap-read{color:var(--faint)}
#rtly-ap .ap-upd{color:var(--goldink);font-weight:600}
#rtly-ap .ap-byline time{font-style:normal}
/* both controls are 32px tall and centred on the same line - the misalignment was a
43px pill next to a 37px button, each with its own padding. */
#rtly-ap .ap-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:14px 0 0;
padding:0 0 16px;border-bottom:1px solid var(--hair);line-height:1}
#rtly-ap .ap-actions > *{align-self:center}
/* the Google pill: compact, real G mark, exactly the affordance Fool uses */
#rtly-ap .ap-gpill{display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 12px;
border:1px solid var(--line);border-radius:999px;background:#fff;
font-size:12.5px;font-weight:600;color:var(--ink);text-decoration:none;white-space:nowrap;
transition:border-color .16s,background .16s,transform .16s,box-shadow .2s}
#rtly-ap .ap-gpill svg,#rtly-ap .ap-gpill img{width:14px;height:14px;flex:0 0 14px}
#rtly-ap .ap-gpill:hover{border-color:var(--gold);background:var(--goldbg);transform:translateY(-1px);box-shadow:0 8px 20px rgba(201,162,39,.18)}
#rtly-ap .ap-gpill .plus{font-weight:800;color:var(--goldink);font-size:15px;line-height:1}
#rtly-ap .ap-gpill i{font-style:normal;color:var(--faint);margin-left:1px}
/* one Share control, not six circles - the icons live behind it */
/* the popover is centred on this wrapper, so the wrapper must hug the button - left
as a block it was 38px taller and the menu sat low. */
#rtly-ap .ap-sharewrap{position:relative;display:inline-flex;align-items:center}
/* ⚑ .ap-cmtjump is styled by these rules but is NOT .ap-sharebtn. Giving it that class
for styling broke the share menu: the share script binds with
querySelector('#rtly-ap .ap-sharebtn'), which then matched MY button - it sits
earlier in the DOM - so Share stopped opening. Share the styling, never the hook. */
#rtly-ap .ap-sharebtn,#rtly-ap .ap-cmtjump{display:inline-flex;align-items:center;gap:7px;height:32px;padding:0 4px;
border:0;background:transparent;cursor:pointer;
font:600 13.5px "Noto Sans",sans-serif;color:var(--mut);-webkit-text-fill-color:currentColor;
transition:color .16s}
#rtly-ap .ap-sharebtn:hover,#rtly-ap .ap-cmtjump:hover,#rtly-ap .ap-sharebtn[aria-expanded=true]{color:var(--goldink)}
/* the jump sits immediately left of Share and reads as its sibling */
#rtly-ap .ap-cmtjump{margin-right:14px}
/* ⚑ COMMENT REACTIONS 2026-08-10 (Alex: "can we fix up the happy and sad faces so it looks
normal and nice in the comments?"). The Comments Like Dislike plugin ships both states as
smileys that render as the same vague grey circle, so a reader cannot tell agree
from disagree at a glance. Swap them for thumbs drawn as CSS masks: one shape each, tinted
with currentColor, so they follow the pill's colour in both modes and add no requests.
Hiding the img rather than deleting it keeps the plugin's own click handling intact. */
#rtly-ap .cld-like-dislike-wrap{display:flex;gap:8px;align-items:center;margin:10px 0 0}
#rtly-ap .cld-like-dislike-wrap img{display:none!important}
#rtly-ap .cld-common-wrap{display:inline-flex;align-items:center;gap:6px;padding:4px 11px;border:1px solid var(--line);border-radius:999px;font:600 12.5px "Noto Sans",sans-serif;font-variant-numeric:tabular-nums;transition:border-color .16s,color .16s,background .16s}
#rtly-ap .cld-like-wrap{color:#0B8F3A}
#rtly-ap .cld-dislike-wrap{color:var(--mut)}
#rtly-ap .cld-like-wrap:hover{border-color:#0B8F3A;background:rgba(11,143,58,.07)}
#rtly-ap .cld-dislike-wrap:hover{border-color:#a32d2d;color:#a32d2d;background:rgba(163,45,45,.06)}
#rtly-ap .cld-like-dislike-trigger{display:inline-block;width:14px;height:14px;flex:0 0 14px;background-color:currentColor;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:contain;mask-size:contain;-webkit-mask-position:center;mask-position:center}
#rtly-ap .cld-like-trigger{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'%3E%3Cpath d='M2 21h3V9H2v12zm19.7-9.7c.2-.2.3-.5.3-.8v-1c0-.8-.7-1.5-1.5-1.5h-5.1l.8-3.7v-.3c0-.4-.2-.7-.4-1L14.9 2 8.6 8.3c-.4.4-.6.9-.6 1.4v9.8c0 1 .8 1.5 1.5 1.5h8c.6 0 1.2-.4 1.4-.9l2.8-6.6v-.2z'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'%3E%3Cpath d='M2 21h3V9H2v12zm19.7-9.7c.2-.2.3-.5.3-.8v-1c0-.8-.7-1.5-1.5-1.5h-5.1l.8-3.7v-.3c0-.4-.2-.7-.4-1L14.9 2 8.6 8.3c-.4.4-.6.9-.6 1.4v9.8c0 1 .8 1.5 1.5 1.5h8c.6 0 1.2-.4 1.4-.9l2.8-6.6v-.2z'/%3E%3C/svg%3E")}
#rtly-ap .cld-dislike-trigger{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'%3E%3Cpath d='M22 3h-3v12h3V3zM2.3 12.7c-.2.2-.3.5-.3.8v1c0 .8.7 1.5 1.5 1.5h5.1l-.8 3.7v.3c0 .4.2.7.4 1l.9.9 6.3-6.3c.4-.4.6-.9.6-1.4V4.4c0-1-.8-1.5-1.5-1.5h-8c-.6 0-1.2.4-1.4.9L2.3 10.4v2.3z'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'%3E%3Cpath d='M22 3h-3v12h3V3zM2.3 12.7c-.2.2-.3.5-.3.8v1c0 .8.7 1.5 1.5 1.5h5.1l-.8 3.7v.3c0 .4.2.7.4 1l.9.9 6.3-6.3c.4-.4.6-.9.6-1.4V4.4c0-1-.8-1.5-1.5-1.5h-8c-.6 0-1.2.4-1.4.9L2.3 10.4v2.3z'/%3E%3C/svg%3E");position:relative;top:2px}
html:not(.rtly-light) #rtly-ap .cld-like-wrap{color:#00D451}
html:not(.rtly-light) #rtly-ap .cld-common-wrap{border-color:#2A2F36}
/* ⚑ WIDTH 2026-08-10 (Alex: "why is it less wide than the usual?" on the 2022 Biden piece).
Not a sidebar - I checked every sibling and they are all zero-width. `.cs-site-inner` is
display:flex, so `main#primary` is a FLEX ITEM sized by its own content: an older post
with a narrower hero settled at 923px while a current one reaches 1104px, and the whole
article inherited the difference. Make the column own the row on single posts, and
#rtly-ap's own max-width:1104 keeps the measure right. min-width:0 so a long unbroken
string in the body can never push it wider than the row. */
html body.single .cs-site-inner > main#primary{flex:1 1 100%!important;width:100%!important;min-width:0!important}
/* SHARERIGHT 2026-08-10 (Alex): the popover opened BELOW the Share button and sat on
top of the lead image. Open it to the RIGHT of the button instead, vertically
centred on it - nothing below to collide with. Falls back to below-left on phones,
where there is no room to the right. */
/* ⚑ centring must NOT use transform here: the `apin` entrance animation animates
transform with fill:both, so its final `transform:none` wipes translateY(-50%)
and the menu lands 38px low. Centre with a margin instead (menu is a fixed 52px). */
#rtly-ap .ap-sharemenu{position:absolute;top:50%;margin-top:-26px;left:calc(100% + 10px);z-index:90;display:flex;gap:8px;
background:#fff;border:1px solid var(--line);border-radius:999px;padding:8px 10px;
box-shadow:0 14px 34px rgba(16,24,40,.14);animation:apin .22s cubic-bezier(.2,.7,.2,1) both}
#rtly-ap .ap-sharemenu[hidden]{display:none}
@media (max-width:760px){
/* no horizontal room on a phone - keep the original below-left placement */
#rtly-ap .ap-sharemenu{top:calc(100% + 8px);margin-top:0;left:-8px}
}
/* SHAREZ 2026-08-09 (Alex: share bar misaligned when clicked): the entrance animations
create stacking contexts, so the popover sat BEHIND the lead image that follows in
the DOM. Elevate the whole actions row above subsequent content. */
/* ZFIX 2026-08-09: this z-index:80 on the WHOLE hero (added to lift the share popover) made the header block paint above content that follows it - Auto ads units injected after the hero ended up UNDERNEATH the byline/headline. Alex: 'our ads scroll under other ads and our text scrolling under ads'. An ad must never be overlapped: it is a viewability AND policy problem. Hero back to the normal stacking order. */#rtly-ap .ap-hero{position:relative} /* the hero's own filled entrance animation wraps everything in a z-auto context that lost to the figure by tree order - elevate the WHOLE hero context */
#rtly-ap .ap-actions{position:relative;z-index:80}
#rtly-ap .ap-fig{position:relative;z-index:1} /* the filled entrance animation keeps an ambiguous stacking context alive - pin it explicitly BELOW the actions row */
#rtly-ap .ap-share{position:relative}
#rtly-ap .ap-s{width:34px;height:34px;border-radius:50%;border:1px solid var(--line);background:#fff;display:flex;
align-items:center;justify-content:center;color:var(--mut);cursor:pointer;padding:0;
transition:border-color .14s,color .14s,transform .14s,background .14s}
#rtly-ap .ap-s:hover{border-color:var(--goldbd);color:var(--goldink);background:var(--goldbg);transform:translateY(-1px)}
/* 2026-08-21: the share marks take their own brand colour on hover, matching what the
footer socials do. Ring, wash and lift above are untouched - only the mark repaints.
Targeted by aria-label because these buttons are generated from the $ic array and
carry no per-brand class; the labels are already there and already unique.
Every icon is fill:currentColor, so setting `color` is the whole job. Instagram is not
in this menu; X inverts with the theme because its mark is black-on-white by design. */
#rtly-ap .ap-s[aria-label="Share on X"]:hover{color:#000}
#rtly-ap .ap-s[aria-label="Share on Bluesky"]:hover{color:#0285FF}
#rtly-ap .ap-s[aria-label="Share on Facebook"]:hover{color:#1877F2}
#rtly-ap .ap-s[aria-label="Share on LinkedIn"]:hover{color:#0A66C2}
#rtly-ap .ap-s[aria-label="Share on Reddit"]:hover{color:#FF4500}
html:not(.rtly-light) #rtly-ap .ap-s[aria-label="Share on X"]:hover{color:#fff}
#rtly-ap .ap-copy.done{border-color:#BFE5CE;background:#F2FBF5;color:#0B6B33}
html:not(.rtly-light) #rtly-ap .ap-gpill,html:not(.rtly-light) #rtly-ap .ap-sharemenu,
html:not(.rtly-light) #rtly-ap .ap-s{background:#0F1115;border-color:#22262C}
html:not(.rtly-light) #rtly-ap .ap-gpill{color:#E5EAF1}
html:not(.rtly-light) #rtly-ap .ap-copy.done{background:#0F1A12;border-color:#1E4A2C;color:#7BD69B}
/* ---------- ADVISOR PULSE: OFF ON ARTICLES ----------
The pulse is a partner-traffic bar. It earns its place on the homepage and the tools
pages, where sending a reader onward is the job. On an article the job is the article
and the ad stack next to it. One line to bring back; the strip stays. */
/* The Advisor Pulse renders exactly as it does on /crypto. It was hidden here,
then stripped from the DOM, and Alex's read is that doing so is what left the
band behind. The chrome layer owns it; this file does not touch it. */
/* ---------------------------------------------------------------------------
MOBILE: ONE MASTHEAD, AND A STRIP THAT DOES NOT EAT THE SCREEN.
Alex sent a phone screenshot with the Retirely wordmark TWICE and a ticker
block 129px tall - the headline did not start until y=650.
Cause: the theme HAS the right rule (@media max-width:980 hides
.cs-header__inner-desktop), but the OLD article CSS - rtly-artpage5.php:64 and
rtly-article-header.php:43 - re-shows it with `html body.single header ...
display:flex!important` at EVERY width. Media queries carry no specificity of
their own, so the responsive rule loses. Repeating .single out-specifies it
(0,3,3 against 0,2,3).
--------------------------------------------------------------------------- */
/* 2026-08-09 REMOVED (moved to rtly-chrome.php MASTFLIP): the <=980 inner-desktop hide.
The chrome layer now forces the HOME masthead (desktop inner) at every width; hiding it
here would fight the layer. Double-logo protection = the layer's inner-mobile none. */
/* 2026-08-09 - REMOVED: an article-only phone treatment of the briefing strip (one
scrollable line, weather hidden). Alex: "its not same advisor pulse design like we have
on the home page". He was right - this file had no business restyling the shared strip.
The chrome layer now carries the HOMEPAGE's own phone rules for #rtly-brief and
#eve-pulse, so an article inherits them instead of getting a lookalike. If the strip
needs to change on phones, change it there, once, for every page. */
/* ⚑ .rtly-row carries `padding-left:19px`, which put the date 22px right of the
headline. The Advisor Pulse used to sit underneath and disguise it; with the pulse
gone the strip is the last chrome bar and the misalignment is the first thing you
see. Zero it on articles only. */
/* ⚑ The strip's own 3px padding stays. Stripping it is what left the article on 197
while the homepage and /crypto sit on 200 - Alex: "sitll not the same as home page
or others". The chrome layer owns this element on every page; leave it alone. */
/* ---------- MOTION ----------
Entrances only, and deliberately NOTHING on or around an ad slot: no transforms on
containers Auto ads might place into, no opacity on ancestors of an . An ad that
animates in can read as below-the-fold to viewability measurement and moves the page
under a filled unit. The reading column gets the polish; the ad stack is left alone. */
@keyframes apin{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@keyframes apsh{from{background-position:100% 0}to{background-position:0 0}}
#rtly-ap .ap-hero{animation:apin .55s cubic-bezier(.2,.7,.2,1) .04s both}
#rtly-ap .ap-fig{animation:apin .55s cubic-bezier(.2,.7,.2,1) .1s both}
#rtly-ap .ap-rail > *{animation:apin .55s cubic-bezier(.2,.7,.2,1) both}
#rtly-ap .ap-rail > *:nth-child(1){animation-delay:.14s}
#rtly-ap .ap-rail > *:nth-child(2){animation-delay:.2s}
#rtly-ap .ap-rail > *:nth-child(3){animation-delay:.26s}
/* gold rule under the headline - the signature that ties the article to the account
pages and the footer */
#rtly-ap .ap-hero h1:after{content:"";display:block;width:52px;height:3px;border-radius:3px;margin-top:14px;
background:linear-gradient(90deg,#C9A227,#EBD48A 55%,rgba(201,162,39,0))}
/* reading progress: fixed, width-only, so it can never disturb an ad or the flow */
#rtly-ap-prog{position:fixed;top:0;left:0;height:3px;width:0;z-index:70;pointer-events:none;
background:linear-gradient(90deg,#8f6a08,#d1a92e 45%,#EBD48A);transition:width .1s linear}
@media(prefers-reduced-motion:reduce){
#rtly-ap *,#rtly-ap *:after{animation:none!important}
#rtly-ap-prog{display:none}
}
/* lead image */
#rtly-ap .ap-fig{margin:0 0 22px;border:0;border-radius:0;background:transparent;padding:0;overflow:visible}
#rtly-ap .ap-fig img{width:100%;display:block;border-radius:10px;max-height:430px;object-fit:cover;object-position:50% 35%}
#rtly-ap .ap-fig figcaption{font-size:12px;color:var(--f2);padding:9px 0 0}
/* columns */
#rtly-ap .ap-cols{display:block} /* APRAIL 2026-08-09: was grid 1fr/320px - the rail column cost 4 Auto-ads units */
#rtly-ap .ap-main{min-width:0;max-width:800px;margin:0 auto}
/* COLWIDTH 2026-08-09 (Alex): the comments card, the Dianomi unit and the featured-advisor
band sat at the column width (800) while the story text is 700 - so everything below the
article looked wider than the article. One reading measure for all of them. */
#rtly-ap#rtly-ap .ap-comments,#rtly-ap#rtly-ap .ap-dia,#rtly-ap#rtly-ap .ap-rail{max-width:700px!important;margin-left:auto!important;margin-right:auto!important}
#rtly-ap .ap-card{border:1px solid var(--line);border-radius:14px;background:#fff;padding:18px 20px}
#rtly-ap .ap-bodycard{padding:0;border:0;background:transparent;border-radius:0}
/* SIBSPLIT seams: continuation sections must read as one continuous story - no extra
top margin, and the first element inside a continuation keeps its own rhythm. */
#rtly-ap .ap-prose-cont{margin-top:0!important}
#rtly-ap .ap-prose-cont > *:first-child{margin-top:0!important}
/* GAM300: centred under the lead photo, collapses to nothing when unfilled
(googletag collapseEmptyDivs is on), so it can never leave a grey band. */
/* ⚑ CLS 2026-08-11. Field Core Web Vitals were FAILING on CLS 0.25 while lab reported 0 - the
giveaway that it only happens with real ad fill. This slot was min-height:0, so it occupied
NO height until the ad arrived and then snapped to 250px, shoving the article text down
mid-read. Reserving the space up front removes the jump entirely.
The cost, and it is a real one: on articles where the slot does not fill, readers now see a
gap instead of the text closing up. That trade was Alex's call.
Reserved at 250 (the creative height) + 2px so the flex box does not hairline-shift.
Mobile keeps the same 250 because the 300x250 renders at the same size there.
TO REVERT: set both back to min-height:0. */
#rtly-ap .rtly-midad{display:flex;justify-content:center;align-items:center;margin:18px 0 6px;min-height:252px}
#rtly-ap .rtly-midad #rtly-gpt-300x250{margin:0 auto;min-height:250px}
/* ENTRYINNER: the theme owns .cs-entry__inner/.cs-entry__content (unreadable cross-origin
sheet). Doubled id + every box property pinned, so it stays a pure structural hook. */
#rtly-ap#rtly-ap .cs-entry__wrap,#rtly-ap#rtly-ap .cs-entry__container,#rtly-ap#rtly-ap .cs-entry__content-wrap{max-width:none!important;width:auto!important;margin:0!important;padding:0!important;background:transparent!important;border:0!important;box-shadow:none!important;border-radius:0!important;color:inherit!important;display:block!important;float:none!important;position:static!important;min-height:0!important}
#rtly-ap#rtly-ap .cs-entry__inner.cs-entry__content{max-width:none!important;width:auto!important;margin:0!important;padding:0!important;background:transparent!important;border:0!important;box-shadow:none!important;border-radius:0!important;color:inherit!important;font-size:inherit!important;line-height:inherit!important;display:block!important;float:none!important;position:static!important}
/* prose */
/* `.entry-content` is on this element for the Auto ads parser (see the note in the
markup). An unreadable legacy sheet sets `color` on it, which painted the body copy
ink-on-ink in dark mode - so re-assert ours, doubled ID to out-specify. */
#rtly-ap#rtly-ap .ap-prose{font-size:17.5px;line-height:1.75;color:var(--body)!important}
html:not(.rtly-light) #rtly-ap#rtly-ap .ap-prose{color:#C3CAD4!important}
#rtly-ap .ap-prose > *{max-width:none}
#rtly-ap .ap-prose p{margin:0 0 20px}
#rtly-ap .ap-prose h2{font-size:22px;font-weight:800;letter-spacing:-.4px;color:var(--ink);margin:32px 0 12px;line-height:1.3}
#rtly-ap .ap-prose h3{font-size:18px;font-weight:800;color:var(--ink);margin:26px 0 10px;line-height:1.35}
#rtly-ap .ap-prose a{color:#155E75;text-decoration:underline;text-underline-offset:2px}
#rtly-ap .ap-prose a:hover{color:var(--goldink)}
#rtly-ap .ap-prose ul,#rtly-ap .ap-prose ol{margin:0 0 20px;padding-left:22px}
#rtly-ap .ap-prose li{margin:0 0 9px}
#rtly-ap .ap-prose ul li::marker{color:var(--gold)}
#rtly-ap .ap-prose img{border-radius:10px}
#rtly-ap .ap-prose figure{margin:24px 0}
#rtly-ap .ap-prose figcaption{font-size:12px;color:var(--f2);margin-top:7px}
#rtly-ap .ap-prose blockquote{margin:24px 0;padding:2px 0 2px 18px;border-left:3px solid var(--gold);color:var(--ink);font-size:18px;line-height:1.6}
#rtly-ap .ap-prose table{width:100%;border-collapse:collapse;font-size:14.5px;margin:0 0 22px}
#rtly-ap .ap-prose th{text-align:left;font-size:11.5px;letter-spacing:.04em;text-transform:uppercase;color:#77808D;font-weight:700;padding:11px 10px;border-bottom:1px solid var(--line)}
#rtly-ap .ap-prose td{padding:12px 10px;border-bottom:1px solid var(--hair);font-variant-numeric:tabular-nums}
/* Fool key-points block rides in on the_content */
#rtly-ap .ap-prose .fool-key-points{border:1px solid var(--goldbd);background:var(--goldbg);border-radius:12px;padding:18px 20px;margin:0 0 26px}
#rtly-ap .ap-prose .fool-key-points h2,#rtly-ap .ap-prose .fool-key-points h3,#rtly-ap .ap-prose .fool-key-points strong:first-child{
font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--gold);margin:0 0 10px;display:block}
#rtly-ap .ap-prose .fool-key-points ul{margin:0;padding-left:20px}
#rtly-ap .ap-prose .fool-key-points li{font-size:15.5px;line-height:1.6;color:var(--ink);margin:0 0 8px}
#rtly-ap .ap-prose .fool-key-points li::marker{color:var(--gold)}
/* key-points card in dark; ID repeated to out-specify the feed stack */
/* the white here comes from a cross-origin sheet we cannot read, so !important
is the only lever; it is scoped to this page's namespace and nothing else. */
html:not(.rtly-light) #rtly-ap#rtly-ap .ap-prose .fool-key-points{background:#15130C!important;border-color:#3A3320!important}
html:not(.rtly-light) #rtly-ap#rtly-ap .ap-prose .fool-key-points *{background:transparent!important}
html:not(.rtly-light) #rtly-ap#rtly-ap .ap-prose .fool-key-points,
html:not(.rtly-light) #rtly-ap#rtly-ap .ap-prose .fool-key-points li,
html:not(.rtly-light) #rtly-ap#rtly-ap .ap-prose .fool-key-points p,
html:not(.rtly-light) #rtly-ap#rtly-ap .ap-prose .fool-key-points span,
html:not(.rtly-light) #rtly-ap#rtly-ap .ap-prose .fool-key-points strong{color:#E5EAF1!important}
html:not(.rtly-light) #rtly-ap#rtly-ap .ap-prose .fool-key-points h2,
html:not(.rtly-light) #rtly-ap#rtly-ap .ap-prose .fool-key-points h3,
html:not(.rtly-light) #rtly-ap#rtly-ap .ap-prose .fool-key-points h4{color:#D9B44A!important}
html:not(.rtly-light) #rtly-ap#rtly-ap .ap-prose .fool-key-points a{color:#E6C55C!important}
html:not(.rtly-light) #rtly-ap#rtly-ap .ap-prose .fool-key-points li::marker{color:#D9B44A}
/* Fool pitch blocks ride in on the_content too */
#rtly-ap .ap-prose .fool-pitch{border:1px solid var(--line);border-radius:12px;padding:16px 18px;margin:0 0 24px;background:#FAFBFC;font-size:15px;line-height:1.65}
#rtly-ap .ap-prose .fool-pitch a{font-weight:700}
html:not(.rtly-light) #rtly-ap#rtly-ap .ap-prose .fool-pitch{background:#121417!important;border-color:#22262C!important}
html:not(.rtly-light) #rtly-ap#rtly-ap .ap-prose .fool-pitch *{background:transparent!important;color:#B7BFCA!important;border-color:#22262C!important}
html:not(.rtly-light) #rtly-ap#rtly-ap .ap-prose .fool-pitch a,
html:not(.rtly-light) #rtly-ap#rtly-ap .ap-prose .fool-pitch b,
html:not(.rtly-light) #rtly-ap#rtly-ap .ap-prose .fool-pitch strong{color:#E6C55C!important}
/* (the old boxy .ap-gpill block lived here. It was a LEFTOVER from the first build,
printed AFTER the canonical rules above, so it won on document order and made the
pill 163x43 with an 11px radius while Share sat 8px higher. Deleted 2026-08-08 -
Alex: "the share button need to be aligned properly and maybe the google button is
a bit too big? not like fool.com". Search for duplicate class blocks before
re-styling anything in this file.) */
/* rail */
#rtly-ap .ap-rail{position:static;display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:14px;min-width:0;max-width:800px;margin:34px auto 0}
#rtly-ap .ap-ch{font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--faint);padding-bottom:11px;margin-bottom:4px;border-bottom:1px solid var(--hair)}
#rtly-ap .ap-ch.gold{color:var(--gold);border-bottom-color:var(--goldbd)}
#rtly-ap .ap-advcard{display:block;border-color:var(--goldbd);background:linear-gradient(180deg,#FFFDF7,#fff 60%)}
#rtly-ap .ap-advcard:hover{box-shadow:0 6px 18px rgba(184,134,11,.13)}
#rtly-ap .ap-advcard h4{font-size:16px;font-weight:800;margin:10px 0 3px;letter-spacing:-.2px;color:var(--ink);line-height:1.3}
#rtly-ap .ap-advcard .loc{font-size:12.5px;color:var(--faint);margin-bottom:10px}
#rtly-ap .ap-rows{font-size:13px}
#rtly-ap .ap-rows div{display:flex;justify-content:space-between;gap:12px;padding:7px 0;border-bottom:1px solid var(--hair)}
#rtly-ap .ap-rows div:last-child{border-bottom:0}
#rtly-ap .ap-rows span{color:var(--mut)}
#rtly-ap .ap-rows b{font-weight:700;font-variant-numeric:tabular-nums;white-space:nowrap}
#rtly-ap .ap-rows b.money{color:var(--green)}
#rtly-ap .ap-see{display:inline-block;margin-top:11px;font-size:12.5px;font-weight:700;color:var(--goldink)}
/* ADVBAND 2026-08-09 - the rail is ONE horizontal advisor band now (Alex's call; the
More-from-Retirely card was redundant with the related grid below). Chip on its own
line, then: name - location ... AUM | Clients | profile link. Wraps on phones. */
#rtly-ap .ap-rail .ap-advcard{display:flex;flex-wrap:wrap;align-items:center;column-gap:22px;row-gap:2px}
#rtly-ap .ap-rail .ap-advcard .ap-ch{flex:1 1 100%;margin:0 0 4px}
#rtly-ap .ap-rail .ap-advcard h4{margin:0;flex:0 0 auto}
#rtly-ap .ap-rail .ap-advcard .loc{margin:0 auto 0 0;flex:0 0 auto}
#rtly-ap .ap-rail .ap-advcard .ap-rows{display:flex;gap:26px}
#rtly-ap .ap-rail .ap-advcard .ap-rows div{display:flex;flex-direction:column-reverse;align-items:flex-start;gap:1px;padding:0;border:0}
#rtly-ap .ap-rail .ap-advcard .ap-rows b{font-size:15px}
#rtly-ap .ap-rail .ap-advcard .ap-rows span{font-size:11px}
#rtly-ap .ap-rail .ap-advcard .ap-see{margin:0}
@media (max-width:700px){
#rtly-ap .ap-rail .ap-advcard .ap-rows{width:100%;justify-content:flex-start;margin-top:6px}
#rtly-ap .ap-rail .ap-advcard .ap-see{margin-top:8px}
}
#rtly-ap .ap-item{display:flex;gap:11px;align-items:flex-start;padding:11px 0;border-bottom:1px solid var(--hair)}
#rtly-ap .ap-item:last-child{border-bottom:0;padding-bottom:2px}
#rtly-ap .ap-item .num{font-size:12px;font-weight:800;color:var(--faint);font-variant-numeric:tabular-nums;flex:0 0 16px;padding-top:1px}
#rtly-ap .ap-item .tx{display:flex;flex-direction:column;min-width:0}
#rtly-ap .ap-item .t{font-size:13.5px;font-weight:600;line-height:1.4;color:var(--ink)}
#rtly-ap .ap-item:hover .t{color:var(--goldink)}
#rtly-ap .ap-item .d{font-size:11.5px;color:var(--f2);margin-top:3px}
#rtly-ap .ap-tool{display:flex;align-items:center;gap:10px;padding:11px 0;border-bottom:1px solid var(--hair)}
#rtly-ap .ap-tool:last-child{border-bottom:0;padding-bottom:2px}
#rtly-ap .ap-tool span{display:flex;flex-direction:column;min-width:0}
#rtly-ap .ap-tool b{font-size:13.5px;font-weight:700;color:var(--ink)}
#rtly-ap .ap-tool em{font-style:normal;font-size:11.5px;color:var(--f2);margin-top:2px}
#rtly-ap .ap-tool i{font-style:normal;margin-left:auto;color:var(--faint)}
#rtly-ap .ap-tool:hover b{color:var(--goldink)}
/* below the fold */
#rtly-ap .ap-below{margin-top:22px;display:flex;flex-direction:column;gap:18px}
#rtly-ap .ap-dia{border:1px solid var(--line);border-radius:14px;background:#fff;padding:8px;overflow:hidden;margin-top:18px}
#rtly-ap .ap-relhead{display:flex;align-items:baseline;gap:14px;margin:0 0 12px}
#rtly-ap .ap-relhead h2{font-size:20px;font-weight:800;letter-spacing:-.4px;margin:0}
#rtly-ap .ap-relhead a{font-size:12.5px;font-weight:700;color:var(--goldink);margin-left:auto}
#rtly-ap .ap-relgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(224px,1fr));gap:12px}
#rtly-ap .ap-relcard{border:1px solid var(--line);border-radius:14px;background:#fff;overflow:hidden;display:flex;flex-direction:column;transition:box-shadow .16s,transform .16s}
#rtly-ap .ap-relcard:hover{box-shadow:0 8px 22px rgba(16,24,40,.08);transform:translateY(-2px)}
#rtly-ap .ap-relcard .im{display:block;aspect-ratio:16/9;background:#F4F5F6;overflow:hidden}
#rtly-ap .ap-relcard .im img{width:100%;height:100%;object-fit:cover;display:block}
#rtly-ap .ap-relcard .bd{padding:13px 15px 15px;display:flex;flex-direction:column;gap:6px}
#rtly-ap .ap-relcard .t{font-size:14.5px;font-weight:700;line-height:1.4;color:var(--ink)}
#rtly-ap .ap-relcard .d{font-size:11.5px;color:var(--f2)}
/* RELCARD: the card is block-level now (article > a.im + div.bd > h3.t + div.d).
The theme owns .cs-entry__title/.cs-entry__excerpt, so pin them inert here. */
#rtly-ap#rtly-ap .ap-relcard .t{margin:0!important;padding:0!important;font-size:14.5px!important;font-weight:700!important;line-height:1.4!important;color:var(--ink)!important;letter-spacing:0!important;text-transform:none!important;font-family:inherit!important}
#rtly-ap#rtly-ap .ap-relcard .t a{color:inherit!important;text-decoration:none!important}
#rtly-ap#rtly-ap .ap-relcard .d{margin:0!important;padding:0!important;font-size:11.5px!important;color:var(--f2)!important;line-height:1.4!important}
#rtly-ap#rtly-ap .ap-relcard .bd{padding:13px 15px 15px!important;display:flex!important;flex-direction:column!important;gap:6px!important;background:transparent!important;border:0!important;max-width:none!important;margin:0!important}
#rtly-ap .ap-relcard .im{display:block}
/* an Auto-ads unit landing inside a card must not blow the grid out */
#rtly-ap .ap-relcard ins.adsbygoogle{max-width:100%!important}
#rtly-ap .ap-comments{padding:0;overflow:hidden;margin-top:26px}
#rtly-ap .ap-cmt-head{display:flex;align-items:center;gap:14px;width:100%;border:0;background:transparent;cursor:pointer;
padding:18px 22px;text-align:left;font-family:inherit;color:var(--ink);-webkit-text-fill-color:currentColor;
transition:background .16s}
#rtly-ap .ap-cmt-head:hover{background:var(--goldbg)}
#rtly-ap .ap-cmt-ic{width:38px;height:38px;border-radius:50%;flex:0 0 38px;display:flex;align-items:center;justify-content:center;
background:var(--goldbg);border:1px solid var(--goldbd);color:var(--goldink)}
#rtly-ap .ap-cmt-t{display:flex;flex-direction:column;min-width:0;flex:1 1 auto}
#rtly-ap .ap-cmt-t b{font-size:15.5px;font-weight:800;letter-spacing:-.2px;line-height:1.25}
#rtly-ap .ap-cmt-t em{font-style:normal;font-size:12.5px;color:var(--faint);margin-top:3px}
#rtly-ap .ap-cmt-chev{color:var(--faint);display:flex;transition:transform .28s cubic-bezier(.2,.7,.2,1),color .16s}
#rtly-ap .ap-cmt-head:hover .ap-cmt-chev{color:var(--goldink)}
#rtly-ap .ap-cmt-head[aria-expanded=true] .ap-cmt-chev{transform:rotate(180deg)}
/* grid-template-rows 0fr -> 1fr animates to CONTENT height without hard-coding a
max-height, so a long thread never gets clipped and a short one never leaves a gap */
#rtly-ap .ap-cmt-wrap{display:grid;grid-template-rows:0fr;transition:grid-template-rows .34s cubic-bezier(.2,.7,.2,1);overflow:hidden}/* CMTCLIP 2026-08-09 (Alex: "Leave a Reply" bleeding out of the closed accordion): grid-template-rows:0fr collapses the ROW, but a child with padding still paints unless the wrapper clips. overflow:hidden on the wrapper + min-height:0 on the child is the complete pattern - and it must be released when open or a long thread gets cut. */#rtly-ap .ap-comments.open .ap-cmt-wrap{overflow:visible}/* ...and the child PADDING survives a 0fr collapse too (wrapper measured 22px = 4+18), which is exactly the sliver of "Leave a Reply" Alex saw. Zero it while closed. */#rtly-ap .ap-comments:not(.open) .ap-cmt-wrap > div{padding-top:0!important;padding-bottom:0!important}/* CMTFIX2 2026-08-09: the 0fr/1fr grid collapse could not be made to measure correctly (open state reported a 25px row around a 317px form, so the form spilled over the card while closed it leaked a sliver). Replaced with a plain show/hide - deterministic in both states. The easing is not worth a broken box. */#rtly-ap#rtly-ap .ap-cmt-wrap{display:none!important}#rtly-ap#rtly-ap .ap-comments.open .ap-cmt-wrap{display:block!important;overflow:visible!important}#rtly-ap#rtly-ap .ap-comments.open .ap-cmt-wrap > div{padding:4px 16px 18px!important}@media(max-width:760px){#rtly-ap#rtly-ap .ap-comments.open .ap-cmt-wrap > div{padding:2px 10px 14px!important}}
#rtly-ap .ap-comments.open .ap-cmt-wrap{grid-template-rows:1fr}
/* ---- CMTCLEAN 2026-08-09: the thread itself ---- */
#rtly-ap .ap-cmt-wrap > div{min-height:0;padding:4px 16px 18px}
#rtly-ap .ap-comments :is(h2,h3).comments-title,
#rtly-ap .ap-comments .cs-comments__title{display:none}
#rtly-ap .ap-comments ol.cs-comments__list,
#rtly-ap .ap-comments ol.children{list-style:none;margin:0;padding:0}
#rtly-ap .ap-comments ol.children{margin:10px 0 0 20px;padding-left:14px;border-left:2px solid var(--hair)}
#rtly-ap .ap-comments li.comment{margin:0 0 10px}
#rtly-ap .ap-comments .comment-body{padding:12px 14px 11px;border:1px solid var(--hair);border-radius:12px;background:#fff}
html:not(.rtly-light) #rtly-ap .ap-comments .comment-body{background:#12161C;border-color:#1C222B}
#rtly-ap .ap-comments .comment-meta{display:flex;align-items:center;flex-wrap:wrap;gap:4px 10px;margin:0 0 7px;border:0;padding:0}
#rtly-ap .ap-comments .comment-author{display:flex;align-items:center;gap:9px;font-size:13.5px;margin:0}
#rtly-ap .ap-comments .comment-author .avatar{width:30px;height:30px;border-radius:50%;flex:0 0 30px}
#rtly-ap .ap-comments .fn{font-weight:700;font-style:normal;color:var(--ink)}
#rtly-ap .ap-comments .fn a{color:var(--ink);text-decoration:none}
#rtly-ap .ap-comments .says{display:none}
#rtly-ap .ap-comments .comment-metadata{font-size:12px;color:var(--faint)}
#rtly-ap .ap-comments .comment-metadata a{color:var(--faint);text-decoration:none}
#rtly-ap .ap-comments .comment-content{font-size:14.5px;line-height:1.62;color:var(--body)}
#rtly-ap .ap-comments .comment-content p{margin:0 0 8px}
/* the like/dislike plugin: giant naked SVG faces -> two quiet pill chips */
#rtly-ap .ap-comments .cld-like-dislike-wrap{display:flex;align-items:center;gap:8px;margin:6px 0 0;float:none}
#rtly-ap .ap-comments .cld-common-wrap{display:inline-flex;align-items:center;gap:6px;margin:0;padding:3px 11px;border:1px solid var(--line);border-radius:999px;font-size:12.5px;font-weight:600;color:var(--mut);background:transparent;cursor:pointer;line-height:1}
#rtly-ap .ap-comments .cld-common-wrap:hover{border-color:var(--goldbd);color:var(--goldink)}
#rtly-ap .ap-comments .cld-common-wrap svg,
#rtly-ap .ap-comments .cld-common-wrap img{width:15px!important;height:15px!important;max-width:15px!important;min-width:0!important;display:block}
#rtly-ap .ap-comments .cld-common-wrap span{font-size:12.5px;color:inherit}
#rtly-ap .ap-comments .reply{margin:8px 0 0}
#rtly-ap .ap-comments a.comment-reply-link{display:inline-block;font-size:12.5px;font-weight:700;color:var(--goldink);background:var(--goldbg);border:1px solid var(--goldbd);border-radius:999px;padding:4px 13px;text-decoration:none}
#rtly-ap .ap-comments a.comment-reply-link:hover{background:var(--goldbd)}
html:not(.rtly-light) #rtly-ap .ap-comments a.comment-reply-link{background:transparent}
/* no red asterisks (Alex): required is enforced on submit anyway - drop the markers,
the required-fields boilerplate, and mark the one OPTIONAL field instead */
#rtly-ap .comment-form .required,
#rtly-ap .comment-form .required-field-message{display:none}
#rtly-ap .comment-form-url label::after{content:" (optional)";color:var(--faint);font-weight:400;font-size:12.5px}
@media (max-width:760px){
#rtly-ap .ap-cmt-wrap > div{padding:2px 10px 14px}
#rtly-ap .ap-comments ol.children{margin-left:10px;padding-left:10px}
}
#rtly-ap .ap-cmt-in{overflow:hidden;min-height:0}
#rtly-ap .ap-comments.open .ap-cmt-in{padding:2px 22px 22px;border-top:1px solid var(--hair)}
/* smooth out WordPress's default comment furniture */
#rtly-ap .ap-cmt-in .comment-respond{margin-top:6px}
#rtly-ap .ap-cmt-in h2,#rtly-ap .ap-cmt-in h3{font-size:14px;font-weight:800;letter-spacing:.02em}
#rtly-ap .ap-cmt-in input[type=text],#rtly-ap .ap-cmt-in input[type=email],
#rtly-ap .ap-cmt-in input[type=url],#rtly-ap .ap-cmt-in textarea{
width:100%;border:1px solid var(--line);border-radius:11px;padding:11px 13px;font:400 15px "Noto Sans",sans-serif;
background:#fff;color:var(--ink);outline:0;transition:border-color .16s,box-shadow .2s}
#rtly-ap .ap-cmt-in input:focus,#rtly-ap .ap-cmt-in textarea:focus{border-color:var(--gold);box-shadow:0 0 0 4px rgba(201,162,39,.13)}
#rtly-ap .ap-cmt-in .submit,#rtly-ap .ap-cmt-in input[type=submit]{
border:1.5px solid var(--gold);border-radius:999px;background:#fff;color:var(--ink);-webkit-text-fill-color:currentColor;
font:700 14.5px "Noto Sans",sans-serif;padding:11px 26px;cursor:pointer;transition:transform .16s,box-shadow .2s,color .16s}
#rtly-ap .ap-cmt-in .submit:hover,#rtly-ap .ap-cmt-in input[type=submit]:hover{transform:translateY(-1px);box-shadow:0 10px 24px rgba(201,162,39,.22);color:var(--goldink)}
#rtly-ap .ap-cmt-in .comment-list{list-style:none;margin:0;padding:0}
#rtly-ap .ap-cmt-in .comment-list li{border-top:1px solid var(--hair);padding:16px 0}
#rtly-ap .ap-cmt-in .comment-list li:first-child{border-top:0}
html:not(.rtly-light) #rtly-ap .ap-cmt-in .submit,html:not(.rtly-light) #rtly-ap .ap-cmt-in input[type=submit]{background:#121417;color:#E5EAF1}
@media(max-width:1000px){
#rtly-ap .ap-cols{grid-template-columns:minmax(0,1fr)}
#rtly-ap .ap-rail{position:static;flex-direction:row;flex-wrap:wrap}
#rtly-ap .ap-rail > *{flex:1 1 280px}
}
@media(max-width:760px){
#rtly-ap{padding:10px 0 44px}
#rtly-ap .ap-hero{padding:18px 16px 16px;border-radius:14px}
#rtly-ap .ap-hero h1{font-size:26px;letter-spacing:-.6px}
#rtly-ap .ap-dek{font-size:14.5px}
#rtly-ap .ap-share{margin-left:0;width:100%}
#rtly-ap .ap-bodycard{padding:18px 16px}
#rtly-ap .ap-prose{font-size:17px}
#rtly-ap .ap-comments{padding:18px 16px}
#rtly-ap .ap-crumb em{display:none}
}
/* ---------------- dark ----------------
FLIP THE TOKENS, don't chase selectors. Every rule in this file reads from these
custom properties, so redefining them here fixes the gold links, the "See the full
profile" line, the section links and the money figure in one move instead of ten
individual overrides. */
html:not(.rtly-light) #rtly-ap{
--ink:#E5EAF1;--body:#C3CAD4;--mut:#9AA1AA;--faint:#7A828E;--line:#22262C;--hair:#1B1F25;
--goldink:#E6C55C;--goldbd:#3A3320;--goldbg:#15130C;--green:#4ADE80;
color:#E5EAF1}
/* ⚑ The story's own
/
/ carry `color:#000` from the feed's markup and a
legacy sheet - a colour on the .ap-prose container never reaches them. This is the
one place descendants have to be named. Links and the Fool blocks keep their own
colours, set after this. */
html:not(.rtly-light) #rtly-ap#rtly-ap .ap-prose p,
html:not(.rtly-light) #rtly-ap#rtly-ap .ap-prose li,
html:not(.rtly-light) #rtly-ap#rtly-ap .ap-prose em,
html:not(.rtly-light) #rtly-ap#rtly-ap .ap-prose strong,
html:not(.rtly-light) #rtly-ap#rtly-ap .ap-prose span,
html:not(.rtly-light) #rtly-ap#rtly-ap .ap-prose td,
html:not(.rtly-light) #rtly-ap#rtly-ap .ap-prose blockquote{color:#C3CAD4!important;-webkit-text-fill-color:#C3CAD4!important}
html:not(.rtly-light) #rtly-ap#rtly-ap .ap-prose h2,
html:not(.rtly-light) #rtly-ap#rtly-ap .ap-prose h3{color:#E5EAF1!important;-webkit-text-fill-color:#E5EAF1!important}
html:not(.rtly-light) #rtly-ap#rtly-ap .ap-prose a,
html:not(.rtly-light) #rtly-ap#rtly-ap .ap-prose a *{color:#7FC7DC!important;-webkit-text-fill-color:#7FC7DC!important}
/* the comment thread's own text and labels */
html:not(.rtly-light) #rtly-ap .ap-comments,
html:not(.rtly-light) #rtly-ap .ap-comments p,
html:not(.rtly-light) #rtly-ap .ap-comments li,
html:not(.rtly-light) #rtly-ap .ap-comments label,
html:not(.rtly-light) #rtly-ap .ap-comments cite,
html:not(.rtly-light) #rtly-ap .ap-comments b{color:#C3CAD4!important;-webkit-text-fill-color:#C3CAD4!important}
html:not(.rtly-light) #rtly-ap{color:#E5EAF1}
html:not(.rtly-light) #rtly-ap .ap-hero,html:not(.rtly-light) #rtly-ap .ap-card,
html:not(.rtly-light) #rtly-ap .ap-fig,html:not(.rtly-light) #rtly-ap .ap-dia,html:not(.rtly-light) #rtly-ap .ap-relcard{background:#0F1115;border-color:#22262C}
html:not(.rtly-light) #rtly-ap .ap-hero h1,html:not(.rtly-light) #rtly-ap .ap-prose h2,html:not(.rtly-light) #rtly-ap .ap-prose h3,
html:not(.rtly-light) #rtly-ap .ap-item .t,html:not(.rtly-light) #rtly-ap .ap-relcard .t,html:not(.rtly-light) #rtly-ap .ap-advcard h4,
html:not(.rtly-light) #rtly-ap .ap-tool b,html:not(.rtly-light) #rtly-ap .ap-relhead h2{color:#E5EAF1}
html:not(.rtly-light) #rtly-ap .ap-prose{color:#C3CAD4}
html:not(.rtly-light) #rtly-ap .ap-dek{color:#9AA1AA}
html:not(.rtly-light) #rtly-ap .ap-metarow,html:not(.rtly-light) #rtly-ap .ap-ch,html:not(.rtly-light) #rtly-ap .ap-rows div,
html:not(.rtly-light) #rtly-ap .ap-item,html:not(.rtly-light) #rtly-ap .ap-tool,html:not(.rtly-light) #rtly-ap .ap-prose td{border-color:#1B1F25}
html:not(.rtly-light) #rtly-ap .ap-copy.done{background:#0F1A12!important;border-color:#1E4A2C!important;color:#7BD69B!important}
html:not(.rtly-light) #rtly-ap .ap-s,html:not(.rtly-light) #rtly-ap .pill,html:not(.rtly-light) #rtly-ap .ap-gpill{background:#121417;border-color:#22262C;color:#9AA1AA}
html:not(.rtly-light) #rtly-ap .ap-advcard{background:linear-gradient(180deg,#15130C,#0F1115 60%);border-color:#3A3320}
html:not(.rtly-light) #rtly-ap .ap-prose a{color:#7FC7DC}
/* Measured in dark mode and found still light: the Google source pill, the related-card
image placeholder, and every field in the comment form (the comments template brings
its own white inputs). !important because each has a light base rule of its own. */
html:not(.rtly-light) #rtly-ap .ap-gpill{background:#121417!important;border-color:#22262C!important;color:#9AA1AA!important}
html:not(.rtly-light) #rtly-ap .ap-gpill b{background:#0F1115!important;border-color:#22262C!important}
html:not(.rtly-light) #rtly-ap .ap-relcard .im{background:#121417!important}
html:not(.rtly-light) #rtly-ap .ap-comments input[type=text],
html:not(.rtly-light) #rtly-ap .ap-comments input[type=email],
html:not(.rtly-light) #rtly-ap .ap-comments input[type=url],
html:not(.rtly-light) #rtly-ap .ap-comments textarea,
html:not(.rtly-light) #rtly-ap .ap-comments select{background:#121417!important;border-color:#22262C!important;color:#E5EAF1!important;
-webkit-text-fill-color:#E5EAF1!important;border-radius:10px}
html:not(.rtly-light) #rtly-ap .ap-comments input::placeholder,
html:not(.rtly-light) #rtly-ap .ap-comments textarea::placeholder{color:#6E7681!important}
html:not(.rtly-light) #rtly-ap .ap-comments{color:#C3CAD4}
html:not(.rtly-light) #rtly-ap .ap-comments a{color:#7FC7DC}
html:not(.rtly-light) #rtly-ap .ap-byt b{color:#E5EAF1}
html:not(.rtly-light) #rtly-ap .ap-crumb em{color:#6E7681}
html:not(.rtly-light) #rtly-ap .ap-fig figcaption,html:not(.rtly-light) #rtly-ap .ap-relcard .d{color:#6E7681}
/* rtly-chromelayer-css */
/* ---------- THE CHROME. Measured off /crypto/ 2026-08-08 (vw2183):
header sticky/top0/z60 496/1176 - inner 508/1152 - logo 517/126 - hbar 683/440
main#primary 496/1176 - #content 496/1176 - #rtly-brief 496/1176 - #eve-pulse 515/1132
A single post ships a WIDER container (1320/1296) and main at 1500, which is what
makes the strip sit ~160px left of every other page. Pin all of it. ---------- */
/* NO background forcing anywhere in this block. artx forces #fff (it inherited the old
"white everywhere" article rule) and that is exactly what made this page read as wrong:
in dark mode home and /crypto/ paint their chrome DARK, and a white masthead + white
briefing strip floating in a dark page is visible from across the room. Let the theme
paint. Same for the bar width: the masthead is FULL-BLEED, only .cs-container is 1176. */
/* â FHEADSTICK 2026-08-16 (Alex: "/contact-us/ still has a different header?").
Measured: every element on that page is at home's exact pixel EXCEPT the header computes
`relative` instead of `sticky`, so it scrolls away. Cause: the body carries BOTH rtly-chrome
and rtly-fhead, and THREE rtly-fhead rules set position:relative!important at the same
specificity as the chrome rule below (body.X header.cs-header = 0,2,2) - printed later, so
they win. One extra class beats them regardless of print order, on every chrome+fhead page. */
body.rtly-chrome.rtly-fhead header.cs-header{position:sticky!important;top:0!important;z-index:60!important}
/* â PARITY 2026-08-16 (Alex, comparing an article and home side by side: "the notification
bell smaller on article pages and a subtle difference to the search"). Both pages ship the SAME
markup - the bell svg carries width/height 19 and stroke-width 1.9 as ATTRIBUTES, and the "/"
badge is a bare span. Home upsizes them in the `rtly-news` stylesheet, which articles never
load. Measured: bell svg 22x22 stroke 1.7 on home vs 19x19 stroke 1.9 on an article; .kbd
inline-flex/min-width 20px on home vs block/auto on an article (which also handed the input
10px more width). Re-stated here so every chrome-layer page matches home.
ROUND 2: two declarations were not enough - the badge still sat 1px low with a 18.4px box
instead of 21px, because home's rtly-news rule ALSO carries flex/align-items/justify-content/
height. Copied those verbatim; the vision sheets still strip its border/background on top,
which is why the visible badge is a bare glyph on both. */
#rtly-bell svg{width:22px;height:22px;stroke-width:1.7}
#rtly-hbar .kbd{display:inline-flex;flex:0 0 auto;align-items:center;justify-content:center;min-width:20px;height:21px}
body.rtly-chrome header.cs-header{position:sticky!important;top:0!important;z-index:60!important;
max-width:1176px!important;margin-left:auto!important;margin-right:auto!important;
border-bottom:0!important;box-shadow:none!important}
body.rtly-chrome header.cs-header .cs-container{max-width:1176px!important;margin:0 auto!important;padding:0!important}
body.rtly-chrome header.cs-header .cs-header__inner-desktop{max-width:1152px!important;margin:0 auto!important;
padding:0 13px 0 9px!important;min-height:60px!important;transition:none!important}
body.rtly-chrome header.cs-header .cs-header__col.cs-col-left{flex:0 0 auto!important;order:0!important}
body.rtly-chrome header.cs-header .cs-header__col.cs-col-right{display:none!important}
body.rtly-chrome header.cs-header #rtly-hbar{order:5!important;flex:0 0 440px!important;width:440px!important;max-width:440px!important;height:40px!important;margin-left:28px!important}
body.rtly-chrome header.cs-header #rtly-hiw{order:5!important;display:flex!important;align-items:center!important;gap:6px!important;
margin:0 0 0 auto!important;padding:7px 12px!important;height:32px!important;border-radius:999px!important;
font-size:13.5px!important;font-weight:500!important;line-height:13.5px!important;color:#5C626C!important;background:transparent!important}
body.rtly-chrome header.cs-header #rtly-login{order:6!important;display:flex!important;align-items:center!important;
margin:0 0 0 10px!important;padding:7px 15px!important;height:30px!important;border:1px solid #E4E7EB!important;
border-radius:9999px!important;background:#fff!important;font-size:14px!important;font-weight:600!important;line-height:14px!important}
body.rtly-chrome header.cs-header #rtly-signup{order:7!important;display:flex!important;align-items:center!important;
margin:0 0 0 -6px!important;padding:7px 15px!important;height:31px!important;border:1.5px solid #C9A227!important;
border-radius:9999px!important;background:#fff!important;color:#8A6D1F!important;font-size:14px!important;font-weight:600!important;line-height:14px!important}
body.rtly-chrome header.cs-header .rtly-icon-btn--menu{order:99!important;margin:0 -8px 0 14px!important;padding:8px!important;
width:38px!important;height:38px!important;border-radius:8px!important;background:transparent!important}
/* `#rtly-lite` is rtly-own's lightweight header/pulse band for non-front pages. Where
this layer is on it is a SECOND Advisor Pulse stacked above the real one. */
body.rtly-chrome #rtly-lite{display:none!important}
/* the theme zeroes the header's margins with a more specific rule; repeat the class to
out-specify it, or the 1176 bar sits hard against the left edge instead of centred */
html body.rtly-chrome header.cs-header.cs-header{margin-left:auto!important;margin-right:auto!important}
/* everything below the masthead has to line up with it */
body.rtly-chrome main#primary{max-width:1176px!important;width:100%!important;margin-left:auto!important;margin-right:auto!important}
body.rtly-chrome main#primary > .cs-site-content > .cs-container,
body.rtly-chrome main#primary .cs-container,
body.rtly-chrome #content{max-width:1176px!important;width:100%!important;margin-left:auto!important;margin-right:auto!important;padding-left:0!important;padding-right:0!important}
body.rtly-chrome #rtly-chrome-anchor{height:0!important;min-height:0!important;margin:0!important;padding:0!important}
body.rtly-chrome #rtly-brief{display:block!important;max-width:none!important;margin:0!important;padding:0 0 0 3px!important}
body.rtly-chrome #eve-pulse{display:flex!important}
/* ---------- PHONES ----------
TWO SEPARATE THINGS LIVE HERE. Keep them separate.
(1) THE WIDTH CAP. The 1176 measure above is a DESKTOP CENTRING device. Applied below
the chrome's own breakpoint it pins main#primary to 1176px inside a ~390px viewport,
and because html/body are overflow-x:clip the right two thirds are CUT OFF rather than
scrollable. main#primary is also a flex item of .cs-site-inner (a COLUMN flex box), so
with min-width:auto it cannot shrink below the min-content of its widest child. Both
halves are needed or it springs back.
(2) THE STRIP AND THE PULSE. Alex, 2026-08-09: "its not same advisor pulse design like
we have on the home page... so why are u using our universal header everywhere?" The
universal header is right - what was wrong is that I invented a phone treatment for it
(a scrolling one-line pulse) instead of using the homepage's. The declarations below
are COPIED VERBATIM from rtly-home-live.php's #rtly-home-strip, which is the spec.
Do not restyle these here; if the homepage's changes, copy them again. */
@media (min-width:981px) and (max-width:1175px){
body.rtly-chrome main#primary,
body.rtly-chrome #content{max-width:calc(100% - 24px)!important;width:100%!important;margin-left:auto!important;margin-right:auto!important;min-width:0!important}
}
@media (max-width:980px){
body.rtly-chrome main#primary,
body.rtly-chrome main#primary > .cs-site-content > .cs-container,
body.rtly-chrome main#primary .cs-container,
body.rtly-chrome #content{max-width:100%!important;width:auto!important;min-width:0!important}
/* BELT 2026-08-09: Alex's iPhone showed the 401k article at desktop width while Blink
at 390 was clean - if the pin JS ever dies (engine quirk, extension, error), the
plain rules above can lose a specificity war to the theme's 1500px sheet. Triple-id
repetition (site doctrine) makes the CSS release unbeatable WITHOUT JS. */
html body.rtly-chrome main#primary#primary#primary,
html body.rtly-chrome #content#content#content{max-width:100%!important;width:auto!important;min-width:0!important;margin-left:0!important;margin-right:0!important}
html body.rtly-chrome #rtly-ap,
html body.rtly-chrome #rtly-ap .ap-main,
html body.rtly-chrome #rtly-ap .ap-prose{max-width:100%!important;min-width:0!important}
}
/* the homepage stacks the strip into a left-aligned column and drops the market chips */
@media (max-width:768px){
body.rtly-chrome #rtly-brief{overflow:visible!important;min-width:0!important;-webkit-mask-image:none!important;mask-image:none!important}
body.rtly-chrome #rtly-brief .rtly-row{display:flex!important;flex-direction:column!important;align-items:flex-start!important;text-align:left!important;gap:3px!important;grid-template-columns:none!important;column-gap:0!important;overflow:visible!important;padding-left:16px!important;width:auto!important;max-width:none!important}
body.rtly-chrome #rtly-brief .rtly-z1,
body.rtly-chrome #rtly-brief .rtly-z3{align-self:flex-start!important;justify-content:flex-start!important;text-align:left!important;margin:0!important}
body.rtly-chrome #rtly-brief .rtly-z3 #rtly-wx-ico{margin-left:0!important}
body.rtly-chrome #rtly-brief .rtly-z2{display:none!important}
}
/* and it HIDES the Advisor Pulse on phones - rtly-shell's #rtly-mobstrip-css already says
`@media(max-width:680px){#eve-pulse{display:none}}` on every page, but this layer's own
unconditional `body.rtly-chrome #eve-pulse{display:flex!important}` was beating it. That
single !important is the whole reason an article showed a pulse the homepage does not. */
@media (max-width:680px){
body.rtly-chrome #eve-pulse{display:none!important}
}
/* ---------- PHONE MASTHEAD = HOME (2026-08-09, Alex: identical to home page) ----------
The homepage serves the DESKTOP inner at every width (wordmark left, burger right);
single posts served the theme's mobile inner (burger left + centred wordmark) - that
mismatch is what Alex kept seeing, and yesterday's double-logo was both inners visible
at once. The layer now forces home's choice on every chrome page; the artpro block
that hid inner-desktop <=980 is REMOVED so nothing fights this. */
@media (max-width:980px){
html body.rtly-chrome header.cs-header .cs-header__inner-desktop{display:flex!important}
html body.rtly-chrome header.cs-header .cs-header__inner-mobile{display:none!important}
/* home <=980 logged out: wordmark + burger ONLY (search/login live in the menu) */
html body.rtly-chrome header.cs-header #rtly-hbar,
html body.rtly-chrome header.cs-header #rtly-hiw,
html body.rtly-chrome header.cs-header #rtly-login,
html body.rtly-chrome header.cs-header #rtly-signup{display:none!important}
html body.rtly-chrome header.cs-header .cs-header__inner-desktop .rtly-icon-btn--menu{margin-left:auto!important;margin-right:0!important}
html body.rtly-chrome header.cs-header .cs-header__col.cs-col-left{flex-grow:0!important}
}
/* AUTHFIX 2026-08-09: canonical col-left is grow:0 (measured on /crypto/: w126). The
theme gives singles grow:1, which logged-in absorbed ~300px of slack and pushed the
search pill to x612 while home sits at x301. Pin at every width. */
body.rtly-chrome header.cs-header .cs-header__col{flex-grow:0!important;width:auto!important;flex-shrink:1!important;min-width:0!important;transition:none!important}
/* home's authed cluster at small widths (values copied from rtly-shell hdrband/hdrband2) */
@media (min-width:601px) and (max-width:940px){
html.rtly-authed body.rtly-chrome #rtly-publish{font-size:0!important;padding:9px!important;gap:0!important}
html.rtly-authed body.rtly-chrome #rtly-publish svg{width:16px!important;height:16px!important;margin:0!important}
}
/* home authed 601-940 keeps a SMALL search pill (hdrband sizes) - mirror it */
@media (min-width:601px) and (max-width:940px){
html.rtly-authed body.rtly-chrome header.cs-header #rtly-hbar{display:flex!important;flex:0 1 220px!important;max-width:220px!important;min-width:120px!important}
}
@media (max-width:600px){
html.rtly-authed body.rtly-chrome #rtly-publish{display:none!important}
html.rtly-authed body.rtly-chrome #rtly-bell{margin-left:auto!important}
html.rtly-authed body.rtly-chrome #rtly-avatar{margin-left:10px!important}
}
/* ---------- LIGHTER ARTICLE HEADER ON PHONES (Alex chose this, 2026-08-09) ----------
On phone ARTICLES the date/weather strip is gone entirely: masthead, then headline.
The homepage keeps its strip - this is .single only. Hidden from first paint (wp_head)
so nothing flashes; the builder writing into a hidden div is the accepted cost - do
NOT gate the shared builder by width. */
@media (max-width:760px){
html body.rtly-chrome.single #rtly-brief{display:none!important;height:0!important;min-height:0!important;padding:0!important;margin:0!important}
html body.rtly-chrome.single #eve-pulse{display:none!important}
}
/* ---------- CHROME COLOURS, copied from /crypto/'s computed styles ----------
Several dark treatments for the strip, the pulse label and the Publish button live
in blocks that bail on `is_singular('post')`, so on an article the strip builder's
own light inline colours (#16181d) survive and you get ink-dark text on a black bar.
Match the reference values here rather than un-gating shared files. */
html:not(.rtly-light) body.rtly-chrome #rtly-brief{background:#000!important}
/* ⚑ THE GREY BAR, from Alex's screenshot of an ARTICLE: the strip row itself sat on a
grey band. The dark rule above existed; there was never a LIGHT one, so in light
mode #rtly-brief inherited whatever its wrapper happened to be - white for me,
#eef0f3 for him. Pin both ends, and the row + its immediate wrapper with it. */
html.rtly-light body.rtly-chrome #rtly-brief,
html.rtly-light body.rtly-chrome #rtly-brief .rtly-row,
html.rtly-light body.rtly-chrome #rtly-brief *{background-color:transparent!important}
html.rtly-light body.rtly-chrome #rtly-brief{background-color:#fff!important}
html.rtly-light body.rtly-chrome #eve-pulse{background-color:#fff!important}
html:not(.rtly-light) body.rtly-chrome #rtly-brief .rtly-z1,
html:not(.rtly-light) body.rtly-chrome #rtly-brief .rtly-vdate,
html:not(.rtly-light) body.rtly-chrome #rtly-brief .rtly-z2 b{color:#EEF1F5!important}
/* NO rule on `.rtly-z2 span` - the ticker VALUES are spans carrying an inline
`color:#0B8F3A`, and an !important here paints the green numbers white. Only the
`b` labels need overriding; the wrapper spans already inherit the right colour. */
html:not(.rtly-light) body.rtly-chrome #rtly-wx-txt{color:#fff!important}
html:not(.rtly-light) body.rtly-chrome #rtly-publish{background:#0A0A0A!important;color:#E8E8E8!important}
body.rtly-chrome #eve-pulse .lbl{background-image:linear-gradient(92deg,#a87c10,#d1a92e 50%,#8f6a08)!important;
-webkit-background-clip:text!important;background-clip:text!important;-webkit-text-fill-color:transparent!important;color:transparent!important;font-weight:800!important}
/* PULSEGOLD 2026-08-09 - homegold's gold NOTCH, copied verbatim (rtly-homegold.php is
front-page-gated so articles never got it; Alex: "they should all be unified").
NOTE: a ::before is INVISIBLE to computed-style element diffs - diff pseudo-elements
too, or eyeball, before declaring two bars identical. */
body.rtly-chrome #eve-pulse{position:relative!important;overflow:hidden!important}
body.rtly-chrome #eve-pulse::before{content:"";position:absolute;left:0;top:18%;height:64%;width:3px;border-radius:3px;background:linear-gradient(180deg,#f5c518,#ffdf7e 45%,#d4af37)}
body.rtly-chrome #eve-pulse .cta{font-weight:700!important}
/* ---------- CHROME FONTS + THE TWO DROPDOWNS ----------
Copied from rtly-newsroom.php's own stylesheet rather than re-invented, so this is
the same UI, not a lookalike. Without it #rtly-acct is position:static and renders
as a bare list below the footer - which is what "the mouse over doesn't work" is. */
body.rtly-chrome #eve-pulse,body.rtly-chrome #eve-pulse *,
body.rtly-chrome #rtly-brief,body.rtly-chrome #rtly-brief *{font-family:"Noto Sans",system-ui,-apple-system,sans-serif}
body.rtly-chrome #rtly-acct{position:fixed;min-width:212px;background:#fff;border-radius:14px;box-shadow:0 16px 44px rgba(0,0,0,.18);padding:8px;z-index:100001;display:none;font-family:'Noto Sans',sans-serif}
body.rtly-chrome #rtly-acct.open{display:block;animation:rtlyMfade .14s ease}
html:not(.rtly-light) body.rtly-chrome #rtly-acct{background:#0f1318;box-shadow:0 16px 44px rgba(0,0,0,.6)}
body.rtly-chrome #rtly-acct a,body.rtly-chrome #rtly-acct .dm{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:9px;color:#16181d;text-decoration:none;font-size:14px;font-weight:500;cursor:pointer}
body.rtly-chrome #rtly-acct a:hover,body.rtly-chrome #rtly-acct .dm:hover{background:#f2f4f1}
html:not(.rtly-light) body.rtly-chrome #rtly-acct a,html:not(.rtly-light) body.rtly-chrome #rtly-acct .dm{color:#e7eaf0}
html:not(.rtly-light) body.rtly-chrome #rtly-acct a:hover,html:not(.rtly-light) body.rtly-chrome #rtly-acct .dm:hover{background:#171d26}
body.rtly-chrome #rtly-acct .sep{height:1px;background:#ececec;margin:6px 8px}
html:not(.rtly-light) body.rtly-chrome #rtly-acct .sep{background:#23262c}
body.rtly-chrome #rtly-acct .lo{color:#e5484d}
body.rtly-chrome #rtly-acct .dm{justify-content:space-between}
body.rtly-chrome #rtly-acct .dm .dm-l{display:flex;align-items:center;gap:10px}
body.rtly-chrome #rtly-acct .tg{width:36px;height:20px;border-radius:20px;background:#d4d8de;position:relative;transition:background .15s;flex:0 0 auto}
body.rtly-chrome #rtly-acct .tg:after{content:"";position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:#fff;transition:transform .15s}
html:not(.rtly-light) body.rtly-chrome #rtly-acct .tg{background:#d4af37}
html:not(.rtly-light) body.rtly-chrome #rtly-acct .tg:after{transform:translateX(16px)}
body.rtly-chrome #rtly-menu{position:absolute;z-index:99999;background:#fff;border:1px solid #e6e5de;border-radius:14px;box-shadow:0 14px 40px rgba(20,24,33,.14);padding:7px;min-width:208px;font-family:'Noto Sans',sans-serif;display:none}
body.rtly-chrome #rtly-menu.open{display:block}
body.rtly-chrome #rtly-menu a{display:block;padding:9px 12px;font-size:14px;color:#3d434d;text-decoration:none;border-radius:9px}
body.rtly-chrome #rtly-menu a:hover{background:#f3f7f5;color:#101319}
body.rtly-chrome #rtly-menu .rtly-menu-sep{height:1px;background:#eef0ec;margin:5px 6px}
body.rtly-chrome #rtly-menu .dm{display:flex;align-items:center;justify-content:space-between;padding:9px 12px;font-size:14px;color:#3d434d;cursor:pointer;border-radius:9px}
body.rtly-chrome #rtly-menu .dm:hover{background:#f3f7f5}
body.rtly-chrome #rtly-menu .dm .dm-l{display:flex;align-items:center;gap:10px}
body.rtly-chrome #rtly-menu .dm .dm-l svg{color:#5c626c}
html:not(.rtly-light) body.rtly-chrome #rtly-menu{background:#0f1318;border-color:#222c3b;box-shadow:0 14px 40px rgba(0,0,0,.6)}
html:not(.rtly-light) body.rtly-chrome #rtly-menu a{color:#c7cedb}
html:not(.rtly-light) body.rtly-chrome #rtly-menu a:hover{background:#1f2937;color:#eef1f5}
html:not(.rtly-light) body.rtly-chrome #rtly-menu .rtly-menu-sep{background:#222c3b}
html:not(.rtly-light) body.rtly-chrome #rtly-menu .dm{color:#c7cedb}
html:not(.rtly-light) body.rtly-chrome #rtly-menu .dm:hover{background:#1f2937}
html:not(.rtly-light) body.rtly-chrome #rtly-menu .dm .dm-l svg{color:#c7cedb}
@keyframes rtlyMfade{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
/* nothing may clip a sticky header or an ad */
body.rtly-chrome,body.rtly-chrome #page,body.rtly-chrome .cs-site-inner,body.rtly-chrome main#primary,
body.rtly-chrome .cs-site-content,body.rtly-chrome .cs-container,body.rtly-chrome #content{overflow:visible!important}
/* rtly-fb-bridge-css */
#rtly-publish.rtly-fadein,#rtly-bell.rtly-fadein,#rtly-avatar.rtly-fadein{animation:rtlyFbIn .4s cubic-bezier(.2,.8,.2,1) both}
#rtly-bell.rtly-fadein{animation-delay:.06s}
#rtly-avatar.rtly-fadein{animation-delay:.12s}
@keyframes rtlyFbIn{from{opacity:0;transform:translateY(-6px) scale(.9)}to{opacity:1;transform:none}}
html.rtly-authing #rtly-login,html.rtly-authing #rtly-signup,html.rtly-authing #rtly-hiw,html.rtly-authing header .rtly-icon-btn--menu,html.rtly-authing #rtly-menu{display:none!important}
#rtly-auth-spin{margin-left:auto;align-self:center;width:22px;height:22px;border:2.5px solid rgba(120,120,120,.25);border-top-color:#00D451;border-radius:50%;animation:rtlyAuthSpin .7s linear infinite}
html:not(.rtly-light) #rtly-auth-spin{border-color:rgba(255,255,255,.18);border-top-color:#00D451}
@keyframes rtlyAuthSpin{to{transform:rotate(360deg)}}
#rtly-auth-toast{position:fixed;left:50%;bottom:26px;transform:translateX(-50%) translateY(14px);max-width:460px;width:calc(100% - 32px);z-index:2147483647;background:#12151b;color:#fff;border:1px solid rgba(255,255,255,.12);border-left:3px solid #00D451;border-radius:12px;padding:13px 16px;font:500 14px/1.45 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;box-shadow:0 12px 40px rgba(0,0,0,.32);opacity:0;pointer-events:none;transition:opacity .28s ease,transform .28s ease}
#rtly-auth-toast.show{opacity:1;transform:translateX(-50%) translateY(0);pointer-events:auto}
#rtly-auth-toast.rtly-at-err{border-left-color:#e5484d}
html.rtly-light #rtly-auth-toast{background:#fff;color:#1a1f28;border-color:rgba(0,0,0,.1);box-shadow:0 12px 40px rgba(0,0,0,.18)}
/* rtly-artbar-css */
#rtly-artbar{position:fixed;top:0;left:0;height:2px;width:0;background:var(--rtly-gold,#C9A227);z-index:2147483647;pointer-events:none;opacity:0}html.rtly-dark #rtly-artbar{background:#D4AF37}
/* rtly-adseam-css */
/* zero-height until Google puts something in them - an empty seam must never add space */
body.rtly-chrome .rtly-adseam{display:block;width:100%;min-height:0;margin:0;padding:0;clear:both}
body.rtly-chrome .rtly-adseam:empty{height:0;overflow:hidden}
/* rtly-burgerdom-css */
@media (max-width:980px){
html body header.cs-header .cs-header__inner-desktop > .rtly-icon-btn--menu,
html body header.cs-header .cs-header__inner > .rtly-icon-btn--menu,
html body header.cs-header .cs-header__inner-desktop > .rtly-drawer-open,
html body header.cs-header .cs-header__inner > .rtly-drawer-open{
order:99!important;margin-left:auto!important;margin-right:0!important;
}
/* rtly-shell's vision block styles these as `html.rtly-vision main#primary#primary#primary #rtly-hiw{display:inline-flex!important}`
(3 IDs + a class) because on those routes the header is relocated INSIDE main#primary.
Repeat the ID four times to out-specify it - the site's own doctrine. */
html body #rtly-hbar#rtly-hbar#rtly-hbar#rtly-hbar,
html body #rtly-hiw#rtly-hiw#rtly-hiw#rtly-hiw,
html body #rtly-login#rtly-login#rtly-login#rtly-login,
html body #rtly-signup#rtly-signup#rtly-signup#rtly-signup{display:none!important}
}
/* rtly-foot-css */
/* the theme's minimal footer stands down wherever this one is on */
body.rtly-newfoot footer.cs-footer.rtly-footer-min{display:none!important}
#rtly-foot{--ink:#16181D;--mut:#5C626C;--faint:#8A919C;--line:#E6E9EF;--hair:#F0F2F5;
--gold:#C9A227;--gold-d:#8A6D1F;--gold-bg:#FDFBF3;--gold-bd:#EBD9A6;
font-family:"Noto Sans",system-ui,-apple-system,sans-serif;color:var(--ink);
border-top:1px solid var(--line);margin-top:56px;padding:0 0 34px}
#rtly-foot *{box-sizing:border-box}
#rtly-foot a{text-decoration:none;color:inherit}
/* 19px, not 12: puts the footer wordmark on 197px - the exact left edge of the masthead
logo above it, so the brand mark lines up top and bottom. Measured, not guessed. */
#rtly-foot .ft-in{max-width:1176px;margin:0 auto;padding:44px 19px 0}
/* a hairline of brand gold across the very top - the whole "nice company" signal in 3px */
#rtly-foot .ft-rule{height:3px;background:linear-gradient(90deg,#8f6a08,#d1a92e 22%,#EBD48A 50%,#d1a92e 78%,#8f6a08);opacity:.85}
#rtly-foot .ft-top{display:grid;grid-template-columns:1.5fr repeat(3,1fr);gap:34px}
/* THE WORDMARK. Metrics and both gradients are copied from the masthead
(mu-plugins/rtly-goldlogo.php) so the mark at the bottom of the page is the same mark
as the one at the top: weight 700, -.05em tracking, and the trademark as its own
half-size superscript span - NOT a full-size character sitting on the baseline. */
#rtly-foot .ft-brand .ft-mark{font-size:23px;font-weight:700;letter-spacing:-.05em;
background-image:linear-gradient(94deg,#a87c10,#d1a92e 50%,#8f6a08);-webkit-background-clip:text;background-clip:text;
-webkit-text-fill-color:transparent;color:transparent;display:inline-block;line-height:1.2;padding-bottom:.1em}
#rtly-foot .ft-brand .ft-tm{font-size:.5em;font-weight:700;letter-spacing:normal;vertical-align:super}
/* dark mode: the masthead switches to a brighter gold, so this does too */
html:not(.rtly-light) #rtly-foot .ft-brand .ft-mark{background-image:linear-gradient(92deg,#f5c518,#ffdf7e 45%,#d4af37)}
#rtly-foot .ft-brand p{font-size:13.5px;line-height:1.65;color:var(--mut);margin:12px 0 18px;max-width:34ch}
#rtly-foot h4{font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--faint);margin:0 0 14px}
#rtly-foot ul{list-style:none;margin:0;padding:0}
#rtly-foot li{margin:0 0 10px}
#rtly-foot li a{font-size:13.5px;color:var(--mut);transition:color .15s,padding-left .15s;display:inline-block}
#rtly-foot li a:hover{color:var(--gold-d);padding-left:3px}
#rtly-foot .ft-badges{display:flex;gap:9px;flex-wrap:wrap}
#rtly-foot .ft-badge{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:11px;
background:#fff;padding:7px 13px 7px 11px;transition:border-color .18s,transform .16s,box-shadow .2s}
#rtly-foot .ft-badge:hover{border-color:var(--gold);transform:translateY(-1px);box-shadow:0 8px 20px rgba(201,162,39,.18)}
#rtly-foot .ft-badge span{display:flex;flex-direction:column;line-height:1.1}
#rtly-foot .ft-badge em{font-style:normal;font-size:9.5px;font-weight:600;color:var(--faint)}
#rtly-foot .ft-badge b{font-size:13px;font-weight:800;letter-spacing:-.2px}
#rtly-foot .ft-mid{display:flex;align-items:center;gap:16px;flex-wrap:wrap;
margin-top:38px;padding-top:22px;border-top:1px solid var(--hair)}
#rtly-foot .ft-social{display:flex;gap:8px;margin-left:auto}
#rtly-foot .ft-s{width:34px;height:34px;border-radius:50%;border:1px solid var(--line);display:flex;align-items:center;
justify-content:center;color:var(--mut);transition:all .16s}
#rtly-foot .ft-s:hover{border-color:var(--gold-bd);background:var(--gold-bg);color:var(--gold-d);transform:translateY(-1px)}
/* 2026-08-21, Alex: "on mouse over they could have that gold border circle but have the
logos load in their logo color". The ring, wash and lift above are untouched - these
only repaint the mark itself, and .ft-s already carries transition:all .16s so the
colour eases in with the rest of the hover.
The SVGs are all fill/stroke:currentColor, so setting `color` is the whole job.
Instagram's real brand is a gradient, which currentColor cannot express; #E1306C is
the pink at the centre of it and is what reads as Instagram at 15px.
Targeted by aria-label, NOT by added classes. The first cut tagged the anchors
.ft-x/.ft-bs/.ft-ig/.ft-in - and .ft-in was ALREADY this file's footer inner wrapper
(max-width:1176px;padding:44px 19px 0, line ~108). The LinkedIn anchor inherited that
padding, blew out to 40x46 instead of 34x34, and pushed its mark clean out of the
circle. .ft-in is also what the footer's own JS querySelector's at the bottom of this
file, so a second element carrying it was a live trap as well. The aria-labels were
already on these anchors, are unique, and cannot collide with anything. */
#rtly-foot .ft-s[aria-label="Retirely on X"]:hover{color:#000}
#rtly-foot .ft-s[aria-label="Retirely on Bluesky"]:hover{color:#0285FF}
#rtly-foot .ft-s[aria-label="Retirely on Instagram"]:hover{color:#E1306C}
#rtly-foot .ft-s[aria-label="Retirely on LinkedIn"]:hover{color:#0A66C2}
/* X's mark is black-on-white by design, so it inverts with the theme. The others are
brand colours that hold on either background. */
html:not(.rtly-light) #rtly-foot .ft-s[aria-label="Retirely on X"]:hover{color:#fff}
#rtly-foot .ft-legalnav{display:flex;gap:18px;flex-wrap:wrap;font-size:13px}
#rtly-foot .ft-legalnav a{color:var(--mut)}
#rtly-foot .ft-legalnav a:hover{color:var(--gold-d)}
#rtly-foot .ft-fine{margin-top:20px;font-size:11.5px;line-height:1.7;color:var(--faint);max-width:96ch}
#rtly-foot .ft-fine strong{color:var(--mut);font-weight:700}
#rtly-foot .ft-copy{margin-top:14px;font-size:12.5px;color:var(--faint)}
@media(max-width:1000px){#rtly-foot .ft-top{grid-template-columns:1fr 1fr 1fr}
#rtly-foot .ft-brand{grid-column:1/-1}}
@media(max-width:640px){#rtly-foot .ft-top{grid-template-columns:1fr 1fr;gap:26px}
#rtly-foot .ft-social{margin-left:0}}
@media(prefers-reduced-motion:reduce){#rtly-foot *{transition:none!important}}
html:not(.rtly-light) #rtly-foot{color:#E5EAF1;border-top-color:#22262C}
html:not(.rtly-light) #rtly-foot .ft-badge,html:not(.rtly-light) #rtly-foot .ft-s{background:#0F1115;border-color:#22262C}
html:not(.rtly-light) #rtly-foot .ft-badge b{color:#E5EAF1}
html:not(.rtly-light) #rtly-foot li a,html:not(.rtly-light) #rtly-foot .ft-brand p,
html:not(.rtly-light) #rtly-foot .ft-legalnav a{color:#9AA1AA}
html:not(.rtly-light) #rtly-foot .ft-mid{border-top-color:#1B1F25}
/* rtly-bm-css */
#rtly-bm{--ink:#16181D;--mut:#5C626C;--faint:#8A919C;--line:#E6E9EF;--hair:#F0F2F5;--card:#fff;
--gold:#C9A227;--gold-d:#8A6D1F;--gold-bg:#FDFBF3;--gold-bd:#EBD9A6;--hov:#F2F3F6;
position:fixed;z-index:2147483000;width:288px;max-width:calc(100vw - 20px);
background:var(--card);border:1px solid var(--line);border-radius:14px;
box-shadow:0 18px 50px rgba(16,20,26,.18),0 2px 6px rgba(16,20,26,.05);
font-family:"Noto Sans",system-ui,-apple-system,sans-serif;color:var(--ink);
overflow:hidden;opacity:0;transform:translateY(-6px);pointer-events:none;visibility:hidden;
transition:opacity .15s ease,transform .17s cubic-bezier(.2,.7,.2,1)}
#rtly-bm.on{opacity:1;transform:none;pointer-events:auto;visibility:visible}
#rtly-bm *{box-sizing:border-box}
#rtly-bm a{text-decoration:none;color:inherit}
/* the bridge: covers the gap to the trigger so moving the mouse never leaves the menu */
#rtly-bm:before{content:"";position:absolute;left:0;right:0;top:-10px;height:10px}
#rtly-bm .bm-rule{height:3px;background:linear-gradient(90deg,#8f6a08,#d1a92e 22%,#EBD48A 50%,#d1a92e 78%,#8f6a08)}
/* who you are */
#rtly-bm .bm-top{display:flex;align-items:center;gap:10px;padding:13px 14px;border-bottom:1px solid var(--hair)}
#rtly-bm .bm-av{width:32px;height:32px;border-radius:50%;border:1px solid var(--line);background:var(--hair) center/cover;flex:0 0 32px}
#rtly-bm .bm-nm{font-size:13.5px;font-weight:800;line-height:1.25;min-width:0}
#rtly-bm .bm-nm em{display:block;font-style:normal;font-size:11.5px;font-weight:600;color:var(--faint)}
/* rows */
#rtly-bm .bm-sec{padding:6px}
#rtly-bm .bm-sec + .bm-sec{border-top:1px solid var(--hair)}
/* justify-content is spelled out because the Dark mode row is a