/* Scoped to precious-metals pages. Shared article/offer layouts are unchanged. */
.metals-sidebar { min-width:0; align-self:start; display:grid; gap:16px; color:#172b50; }
.metals-card { min-width:0; padding:20px; border:1px solid #dfe6f2; border-radius:14px; background:#fff; box-shadow:0 4px 16px #19335904; }
.fidelity-public .metals-sidebar h2,.fidelity-public .metals-toc h2 { display:flex; align-items:center; gap:9px; margin:0 0 16px; color:#14274b; font-family:inherit; font-size:17px; line-height:1.4; font-weight:700; }
.metals-toc svg { fill:none; stroke:#2453ce; stroke-width:1.8; stroke-linecap:round; flex:none; }
.metals-toc ol,.metals-related ul { padding:0; margin:0; list-style:none; }
.metals-toc li { margin:3px 0; }
.metals-toc a { position:relative; display:flex; align-items:flex-start; gap:10px; padding:9px 8px; border-radius:7px; color:#344969; text-decoration:none; font-size:13px; line-height:1.5; overflow-wrap:anywhere; }
.metals-toc__number { flex:0 0 24px; height:24px; display:grid; place-items:center; border-radius:50%; background:#f0f3f9; color:#5c6c85; font-size:11px; line-height:1; }
.metals-toc a[aria-current="location"] { background:#edf3ff; color:#1851de; }
.metals-toc a[aria-current="location"]::before { content:""; position:absolute; left:0; top:5px; bottom:5px; width:3px; border-radius:3px; background:#245df0; }
.metals-toc a[aria-current="location"] .metals-toc__number { background:#fff; }
.metals-toc a:hover,.metals-related a:hover { background:#f4f7ff; }
.metals-sidebar a:focus-visible,.metals-toc a:focus-visible,.metals-sidebar input:focus-visible,.metals-sidebar button:focus-visible,.metals-sidebar select:focus-visible { outline:2px solid #245df0; outline-offset:3px; }
.metals-card__intro { margin:0 0 18px; color:#596b85; font-size:13px; line-height:1.6; }
.metals-calculator__fields { display:grid; gap:8px; padding:0; margin:0; border:0; min-width:0; }
.metals-calculator label { display:block; color:#23395d; font-size:13px; font-weight:600; }
.metals-calculator input,.metals-calculator select { width:100%; min-width:0; box-sizing:border-box; border:1px solid #cfd9e9; border-radius:8px; padding:10px 12px; background:#fff; color:#14274b; font:inherit; font-size:16px; }
.metals-calculator input[aria-invalid="true"] { border-color:#b42318; }
.metals-presets { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px; }
.metals-presets button { min-height:42px; border:1px solid #d7e0f0; border-radius:8px; background:#fff; color:#243b63; font:inherit; font-size:14px; cursor:pointer; }
.metals-presets button[aria-pressed="true"] { background:#265de8; border-color:#265de8; color:#fff; }
.metals-field-help { margin:0 0 10px; color:#66768d; font-size:11px; line-height:1.5; }
.metals-result { display:grid; gap:7px; margin-top:10px; padding:16px; border-radius:10px; background:#eef4ff; color:#47668e; font-size:12px; overflow-wrap:anywhere; }
.metals-result output { color:#152b52; font-size:28px; line-height:1.25; font-weight:700; }
.metals-disclaimer { margin:14px 0 0; color:#697992; font-size:11px; line-height:1.6; }
.metals-error { color:#a32422; font-size:12px; line-height:1.5; }
.metals-sidebar [hidden] { display:none !important; }
.metals-related li+li { margin-top:12px; padding-top:12px; border-top:1px solid #e7ecf4; }
.metals-related a { display:flex; gap:10px; align-items:center; color:#253e69; font-size:13px; line-height:1.5; text-decoration:none; }
.metals-related img { flex:none; width:56px; height:56px; border-radius:8px; object-fit:cover; }
.metals-related a>span:first-of-type { flex:1; }
.metals-discuss { display:flex; justify-content:center; gap:10px; padding:15px; border:1px solid #dfe6f2; border-radius:12px; background:#fff; color:#2453ce; text-decoration:none; font-size:13px; }
.metals-sr-only { position:absolute; width:1px; height:1px; padding:0; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.metals-toc--inline { display:none; }
@media(min-width:981px) { .metals-sidebar { position:sticky; top:16px; max-height:calc(100dvh - 32px); overflow-y:auto; scrollbar-width:thin; scrollbar-color:#cad5eb transparent; } .metals-toc nav { max-height:300px; overflow-y:auto; scrollbar-width:thin; } }
@media(max-width:980px) { .metals-sidebar { margin-top:24px; } .metals-toc--sidebar { display:none; } .metals-toc--inline { display:block; margin:20px 0 24px; } .metals-card { padding:18px; } }
