.gt-brc { --brc-navy: #0F1C2E; --brc-navy-deep: #0D1A2D; --brc-gold: #C9A84C; --brc-gold2: #D4AF37; --brc-ink: #1A2333; --brc-ink-soft: #4A5468; --brc-rule: #E5E8EE; --brc-blue: #EAF3FB; --brc-blue-ink: #1d6fb3; --brc-goldbg: #FFFBEB; --brc-green: #F0FAF3; --brc-green-ink: #1f8a5b; --brc-red: #FFF0F0; --brc-red-ink: #b3402e; --brc-gray: #F7F9FB; font-family: "DM Sans", system-ui, sans-serif; color: var(--brc-ink); line-height: 1.6; max-width: 680px; margin: 1.5rem auto; }
.gt-brc * { box-sizing: border-box; }
.gt-brc-tool { background: rgb(255, 255, 255); border: 1px solid var(--brc-rule); border-radius: 16px; overflow: hidden; box-shadow: rgba(15, 28, 46, 0.06) 0px 1px 3px, rgba(15, 28, 46, 0.05) 0px 12px 32px; }
.gt-brc-head { background: linear-gradient(135deg,var(--brc-navy-deep) 0%,var(--brc-gold) 200%); color: rgb(255, 255, 255); padding: 1.6rem 1.6rem 1.4rem; }
.gt-brc-eyebrow { font-size:0.7rem; letter-spacing: 0.16em; text-transform: uppercase; color: var(--brc-gold); font-weight: 600; margin-bottom: 0.5rem; }
.gt-brc-h { font-family: "Cormorant Garamond", Georgia, serif; font-weight: 600; font-size:1.6rem; line-height: 1.15; margin: 0px 0px 0.4rem; color: rgb(255, 255, 255); }
.gt-brc-sub { margin: 0px; font-size:0.9rem; color: rgba(255, 255, 255, 0.82); max-width: 48ch; }
.gt-brc-body { padding: 1.6rem; }
.gt-brc-group { margin-bottom: 1.5rem; }
.gt-brc-glabel { display: flex; align-items: center; gap: 0.55rem; font-size:0.72rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--brc-gold2); font-weight: 700; margin-bottom: 0.9rem; }
.gt-brc-gnum { width: 20px; height: 20px; border-radius: 50%; background: var(--brc-navy-deep); color: var(--brc-gold); display: flex; align-items: center; justify-content: center; font-size:0.68rem; flex-shrink: 0; }
.gt-brc-field { margin-bottom: 1.05rem; }
.gt-brc-field:last-child { margin-bottom: 0px; }
.gt-brc-flabel { display: flex; justify-content: space-between; align-items: baseline; font-size:0.88rem; color: var(--brc-ink); font-weight: 500; margin-bottom: 0.45rem; gap: 0.6rem; flex-wrap: wrap; }
.gt-brc-flabel > span:first-child { flex: 0 0 auto; white-space: nowrap; }
.gt-brc-fhelp { font-size:0.76rem; color: var(--brc-ink-soft); font-weight: 400; text-align: right; flex: 1 1 auto; min-width: 0px; }
.gt-brc-row { display: flex; align-items: center; gap: 0.7rem; }
.gt-brc-inwrap { position: relative; flex: 0 0 auto; }
.gt-brc-inwrap.gt-brc-money::before { content: "$"; position: absolute; left: 0.7rem; top: 50%; transform: translateY(-50%); color: var(--brc-ink-soft); font-size:0.92rem; font-weight: 500; }
.gt-brc-inwrap.gt-brc-pct::after { content: "%"; position: absolute; right: 0.7rem; top: 50%; transform: translateY(-50%); color: var(--brc-ink-soft); font-size:0.92rem; font-weight: 500; }
.gt-brc-inwrap.gt-brc-yr::after { content: "yrs"; position: absolute; right: 0.7rem; top: 50%; transform: translateY(-50%); color: var(--brc-ink-soft); font-size:0.78rem; font-weight: 500; }
.gt-brc input[type="number"] { font-family: inherit; font-size:1rem; font-weight: 600; color: var(--brc-navy); background: rgb(255, 255, 255); border: 1.5px solid var(--brc-rule); border-radius: 10px; padding: 0.7rem 0.9rem; width: 140px; }
.gt-brc-inwrap.gt-brc-money input { padding-left: 1.5rem; width: 150px; }
.gt-brc-inwrap.gt-brc-pct input, .gt-brc-inwrap.gt-brc-yr input { padding-right: 2.1rem; width: 110px; }
.gt-brc input[type="number"]::-webkit-inner-spin-button, .gt-brc input[type="number"]::-webkit-outer-spin-button { appearance: none; margin: 0px; }
.gt-brc input[type="number"]:focus { outline: 0px; border-color: var(--brc-gold); }
.gt-brc input[type="range"] { flex: 1 1 0%; min-width: 0px; appearance: none; height: 5px; border-radius: 5px; background: var(--brc-rule); outline: 0px; cursor: pointer; accent-color: var(--brc-gold); }
.gt-brc input[type="range"]::-webkit-slider-thumb { appearance: none; width: 20px; height: 20px; border-radius: 50%; background: var(--brc-gold); border: 3px solid rgb(255, 255, 255); box-shadow: rgba(15, 28, 46, 0.25) 0px 1px 4px; cursor: pointer; }
.gt-brc-pill { font-size:0.74rem; font-weight: 600; color: var(--brc-blue-ink); background: var(--brc-blue); border-radius: 7px; padding: 0.3rem 0.6rem; white-space: nowrap; }
.gt-brc-pill.gt-brc-warn { color: var(--brc-gold2); background: var(--brc-goldbg); }
.gt-brc-pill.gt-brc-bad { color: var(--brc-red-ink); background: var(--brc-red); }
.gt-brc-divider { height: 1px; background: var(--brc-rule); margin: 1.6rem 0px; }
.gt-brc-compare { display: grid; grid-template-columns: 1fr 1fr; gap: 0.9rem; margin-bottom: 1.3rem; }
.gt-brc-card { border: 1.5px solid var(--brc-rule); border-radius: 13px; padding: 1.2rem 1.3rem; background: rgb(255, 255, 255); position: relative; transition: 0.2s; }
.gt-brc-card.gt-brc-winner { border-color: var(--brc-green-ink); background: var(--brc-green); }
.gt-brc-badge { position: absolute; top: -10px; left: 1.2rem; font-size:0.64rem; letter-spacing: 0.1em; text-transform: uppercase; font-weight: 700; color: rgb(255, 255, 255); background: var(--brc-green-ink); border-radius: 6px; padding: 0.2rem 0.55rem; opacity: 0; transition: opacity 0.2s; }
.gt-brc-card.gt-brc-winner .gt-brc-badge { opacity: 1; }
.gt-brc-card h4 { font-family: "Cormorant Garamond", Georgia, serif; font-size:1.18rem; font-weight: 600; color: var(--brc-navy); margin: 0px 0px 0.9rem; line-height: 1.2; }
.gt-brc-stat { margin-bottom: 0.75rem; }
.gt-brc-stat:last-child { margin-bottom: 0px; }
.gt-brc-sl { font-size:0.74rem; color: var(--brc-ink-soft); text-transform: uppercase; letter-spacing: 0.06em; font-weight: 600; margin-bottom: 0.1rem; }
.gt-brc-sv { font-family: "Cormorant Garamond", Georgia, serif; font-size:1.7rem; font-weight: 700; color: var(--brc-navy); line-height: 1.05; }
.gt-brc-snote { font-size:0.74rem; color: var(--brc-ink-soft); margin-top: 0.1rem; }
.gt-brc-verdict { border-radius: 13px; padding: 1.4rem 1.5rem; margin-bottom: 1.3rem; border: 1.5px solid rgb(240, 226, 182); background: var(--brc-goldbg); }
.gt-brc-vtag { font-size:0.7rem; letter-spacing: 0.12em; text-transform: uppercase; font-weight: 700; margin-bottom: 0.45rem; color: var(--brc-gold2); }
.gt-brc-verdict.gt-brc-save { background: var(--brc-green); border-color: rgb(191, 224, 204); }
.gt-brc-verdict.gt-brc-save .gt-brc-vtag { color: var(--brc-green-ink); }
.gt-brc-verdict.gt-brc-refi { background: var(--brc-blue); border-color: rgb(191, 220, 239); }
.gt-brc-verdict.gt-brc-refi .gt-brc-vtag { color: var(--brc-blue-ink); }
.gt-brc-vtitle { font-family: "Cormorant Garamond", Georgia, serif; font-size:1.4rem; font-weight: 600; margin: 0px 0px 0.4rem; line-height: 1.22; color: var(--brc-navy); }
.gt-brc-vtitle b { color: var(--brc-navy); }
.gt-brc-vdesc { margin: 0px; font-size:0.88rem; color: var(--brc-ink-soft); }
.gt-brc-blend { background: var(--brc-gray); border-radius: 13px; padding: 1.2rem 1.3rem; margin-bottom: 1.3rem; }
.gt-brc-blend h4 { font-size:0.74rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--brc-ink-soft); font-weight: 700; margin: 0px 0px 0.85rem; }
.gt-brc-blendbar { display: flex; height: 38px; border-radius: 8px; overflow: hidden; margin-bottom: 0.7rem; border: 1px solid var(--brc-rule); }
.gt-brc-blendseg { display: flex; align-items: center; justify-content: center; font-size:0.74rem; font-weight: 600; color: rgb(255, 255, 255); min-width: 0px; overflow: hidden; white-space: nowrap; }
.gt-brc-blendseg.gt-brc-first { background: var(--brc-navy); }
.gt-brc-blendseg.gt-brc-second { background: var(--brc-gold); }
.gt-brc-legend { display: flex; gap: 1.3rem; font-size:0.78rem; color: var(--brc-ink-soft); }
.gt-brc-legend span { display: flex; align-items: center; gap: 0.4rem; }
.gt-brc-sw { width: 11px; height: 11px; border-radius: 3px; }
.gt-brc-sw.gt-brc-first { background: var(--brc-navy); }
.gt-brc-sw.gt-brc-second { background: var(--brc-gold); }
.gt-brc-disc { font-size:0.74rem; color: var(--brc-ink-soft); line-height: 1.5; margin: 1.3rem 0px 0px; padding-top: 1.1rem; border-top: 1px solid var(--brc-rule); }
.gt-brc-disc strong { color: var(--brc-navy); }
@media (max-width: 560px) {.gt-brc-compare { grid-template-columns: 1fr; }}