/* GRIP Options section + Self-Checks hub (Oct 21, 2026). Loaded only on options*.html and self-checks.html. */
.opt-body{max-width:1000px}
.prose.wide{max-width:860px}
.opt-tags{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:1rem!important}
.badge.lv{background:#E7EAF2;color:var(--navy)}
.badge.lv::before{content:"";display:inline-block;width:.6em;height:.6em;border-radius:50%;margin-right:.4em;vertical-align:.05em;background:var(--muted)}
.badge.lv-b::before{background:#1E7E34}.badge.lv-i::before{background:#C48708}.badge.lv-a::before{background:#B3261E}
.badge.pil{background:var(--navy);color:#fff}
.badge.pil-inc{background:#1E5E36;color:#fff}.badge.pil-pro{background:#12397F;color:#fff}
.page-hero .badge.soon{background:#E7EAF2;color:#26324A}
.opt-risk{border-left:6px solid var(--gold-deep);margin-bottom:1.6rem}
.goal{background:var(--cream);border-left:5px solid var(--gold);border-radius:8px;padding:.8rem 1rem;font-size:1.15rem}
.goal span{display:inline-block;font-weight:700;letter-spacing:.08em;text-transform:uppercase;font-size:.85rem;color:var(--gold-text);margin-right:.5rem}
.xyz-setup{background:#EEF2FA;border:1px solid #C9D3EA;border-radius:10px;padding:.75rem 1rem}
.chart{margin:1.4rem 0;background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:1rem 1rem .9rem;box-shadow:0 2px 10px rgba(2,28,74,.05)}
.chart svg{display:block;width:100%;height:auto}
.chart figcaption{font-size:1rem;color:var(--muted);margin-top:.5rem}
.payoff .tk{font:500 15px var(--body);fill:#4D5A73}
.payoff .ax{font:700 15px var(--body);fill:var(--navy)}
.payoff .tg{font:700 14px var(--body);letter-spacing:.02em}
.payoff .mk{font:700 16px var(--body);fill:var(--navy);paint-order:stroke;stroke:#fff;stroke-width:5px;stroke-linejoin:round}
.payoff .nt{font:italic 500 15px var(--body);fill:#3A4660;paint-order:stroke;stroke:#fff;stroke-width:5px;stroke-linejoin:round}
.legend{list-style:none;display:flex;flex-wrap:wrap;gap:.3rem 1.1rem;padding:0;margin:.6rem 0 0;font-size:.95rem;color:var(--ink)}
.legend li{display:flex;align-items:center;gap:.4rem}
.sw{display:inline-block;width:26px;height:0;border-top:4px solid var(--navy)}
.sw-stock{border-top:3px dashed #5A6680}.sw-zero{border-top-color:var(--gold)}
.sw-g,.sw-r{height:14px;border:0;border-radius:3px;width:18px;background:rgba(30,126,52,.25)}.sw-r{background:rgba(179,38,30,.22)}
table.nums{min-width:520px}
table.nums td:last-child{white-space:nowrap}
.risk-list li{margin:.45rem 0}
.wcgw{border-left:6px solid #B3261E;margin:1.6rem 0;background:#FFF8F6}
.wcgw h3{color:#7A1D16}
.wcgw.danger{background:#FFF3F1}
.analogy{border-top:5px solid var(--gold);margin:1.4rem 0}
.gl-chips{list-style:none;display:flex;flex-wrap:wrap;gap:.5rem;padding:0;margin:.6rem 0 1.6rem}
.gl-chips a{display:inline-flex;align-items:center;min-height:40px;padding:.3rem .9rem;border:2px solid var(--navy);border-radius:999px;text-decoration:none;font-weight:500;color:var(--navy);background:#fff}
.gl-chips a:hover{background:var(--navy);color:#fff}
.opt-eps{margin:1.6rem 0;border-top:5px solid var(--navy)}
.ep-list{list-style:none;padding:0;margin:.8rem 0}
.ep-list li{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;padding:.45rem 0;border-bottom:1px solid var(--line)}
.ep-n{display:inline-grid;place-items:center;min-width:2.6rem;height:2rem;padding:0 .4rem;border-radius:8px;background:var(--navy);color:var(--gold);font-family:var(--head);font-size:1.05rem}
.opt-pn{display:grid;gap:1rem;margin-top:1.6rem}
@media (min-width:640px){.opt-pn{grid-template-columns:1fr 1fr}}
.opt-pn a{display:flex;flex-direction:column;gap:.2rem}
.opt-pn a.nx{text-align:right}
.opt-disc{background:#fff;border:2px solid var(--navy);border-radius:var(--radius);padding:1.4rem 1.5rem}
.quote-svg .qt{font:700 30px var(--body);fill:#fff}.quote-svg .qt.gold{fill:var(--gold)}.quote-svg .qd{font:700 30px var(--body);fill:#9FB4E0}
.quote-svg .ql line{stroke:var(--gold-deep);stroke-width:2.5}.quote-svg .ql text{font:700 17px var(--body);fill:var(--navy)}
.quote-svg .qs{font:500 16px var(--body);fill:#4D5A73}
.prem-svg .bl{font:700 18px var(--body);fill:var(--navy)}.prem-svg .bi{font:700 16px var(--body);fill:#fff}.prem-svg .be{font:700 16px var(--body);fill:var(--gold-text)}
table.chain{min-width:320px;max-width:520px}
table.chain caption{caption-side:top;text-align:left;font-weight:700;color:var(--navy);padding-bottom:.4rem}
table.grid4{min-width:560px}
table.grid4 td.g4-red{background:#FDECEA;color:#7A1D16}
.wheel-fig{max-width:620px;margin-left:auto;margin-right:auto}
.wheel-svg .wc{font:400 24px var(--head);fill:var(--gold)}
.wheel-svg .ws rect{fill:#fff;stroke:var(--navy);stroke-width:2.5}.wheel-svg .ws text{font:700 18px var(--body);fill:var(--navy)}
.two-panel .chart{margin:0}
.two-panel{margin:1.4rem 0}
@media (min-width:980px){.two-panel{grid-template-columns:1fr 1fr}}
@media (max-width:979px){.two-panel{grid-template-columns:1fr}}
.rr-wrap{display:grid;gap:1rem;margin-top:.8rem}
.rr-l{font-weight:700;margin:0 0 .3rem;color:var(--navy)}
.rr-row{display:grid;grid-template-columns:4.2rem 1fr 3.4rem;align-items:center;gap:.5rem;margin:.2rem 0}
.rr-k{font-size:.95rem;color:var(--muted)}.rr-v{font-weight:700;color:var(--ink)}
.rr-track{display:block;height:16px;background:#F1F3F8;border-radius:8px;overflow:hidden}
.rr-b{display:block;height:100%;border-radius:8px}.rr-b.r{background:#B3261E}.rr-b.g{background:#1E7E34}
/* hub */
.opt-hub-hero .opt-art-fig{margin:0;width:100%;max-width:440px}
.opt-art{display:block;width:100%;height:auto}
@media (min-width:860px){.opt-hub-hero .opt-art-fig{justify-self:end}}
@media (max-width:859px){.opt-hub-hero .opt-art-fig{max-width:340px}}
.ready-card{display:block;border:3px solid var(--gold);background:linear-gradient(135deg,#FFF9EA,#fff);padding:1.6rem 1.7rem;margin-bottom:1.6rem}
.ready-card h2{margin:.2rem 0 .5rem}
.ready-card .btn{margin-top:.4rem}
.ready-card .eyebrow{color:var(--gold-text)}
.pillars{margin-top:1rem}
.pillar-inc{border-top:5px solid #1E5E36}.pillar-pro{border-top:5px solid #12397F}
.before-card{margin:1.8rem 0;background:var(--cream)}
.before-card ul{margin-bottom:0}
.path{margin-top:1rem}
.path-card{display:flex;flex-direction:column;gap:.35rem}
.path-card h3{margin:.5rem 0 0}
.path-card .opt-tags{margin-top:.2rem!important}
.path-card p{margin:.2rem 0}
.pc-top{display:flex;align-items:center;gap:.8rem}
.step-n{display:inline-grid;place-items:center;width:44px;height:44px;flex:none;border-radius:50%;background:var(--navy);color:var(--gold);font-family:var(--head);font-size:1.3rem}
.mini{width:120px;height:60px;flex:none}
.checklist li{margin:.5rem 0}
.series{list-style:none;padding:0;margin:1rem 0;border-top:1px solid var(--line)}
/* Oct 28, 2026: topic title on its own line above the level badge on narrow screens (the old "auto 1fr" grid squeezed the title at 320px) */
.series li{display:grid;grid-template-columns:minmax(0,1fr);gap:.3rem .8rem;align-items:center;padding:.6rem 0;border-bottom:1px solid var(--line)}
.series .ep-b{display:flex;flex-wrap:wrap;gap:.35rem}
@media (min-width:760px){.series li{grid-template-columns:minmax(0,1fr) auto}}
/* self-checks hub */
.sc-grid{margin-top:1.6rem}
.sc-card{display:flex;flex-direction:column}
.sc-card p:last-child{margin-top:auto;padding-top:.6rem;margin-bottom:0}
/* home: new row under "Four ways to learn" */
.home-new{margin-top:1.4rem}
