/* Graphics are paired with readable amounts and condition text. */
.result-card-visual { position:relative; height:158px; margin:-24px -24px 22px; border-bottom:1px solid #526f77; overflow:hidden; background:#29434d; }
.result-scene { display:block; width:100%; height:100%; object-fit:cover; }
.result-logo { position:absolute; left:16px; top:14px; display:grid; place-items:center; width:126px; height:45px; background:#f2f4ed; padding:9px 12px; border:1px solid #d3ded6; border-radius:7px; box-shadow:0 4px 15px #0002; }
.result-logo.dark { background:#203f51; border-color:#6d8a95; }
.result-broker-logo { display:block; width:100%; height:100%; object-fit:contain; }
.bonus-result { overflow:hidden; }
.bonus-result>.eyebrow { font-size:.65rem; }
.bonus-result h3 { margin-bottom:12px; }
.bonus-result-badge { margin-bottom:16px; }
.bonus-metric-grid { display:grid; grid-template-columns:1fr 1fr; align-items:start; gap:15px; margin-bottom:20px; }
.bonus-metric-grid .bonus-result-label,.bonus-metric-grid .bonus-scheduled>span { font-size:.68rem; line-height:1.5; min-height:2.8em; }
.bonus-metric-grid .bonus-result-amount { font-size:2.3rem; }
.bonus-metric-grid .bonus-scheduled { padding:0 0 0 15px; margin:0; border:0; border-left:1px solid #57727a; }
.bonus-metric-grid .bonus-scheduled strong { margin-top:7px; font:400 2rem/1.1 Georgia,serif; overflow-wrap:anywhere; }
.bonus-metric-grid .bonus-scheduled .uncertain-credit { font:600 1rem/1.5 var(--font-reading); }
.reward-diagram { margin:2px 0 20px; border:1px solid #5c7780; border-radius:10px; padding:17px 14px; background:#142b35; }
.graphic-caption { font-size:.72rem; line-height:1.5; color:#d2dfdb; margin-bottom:15px; font-weight:600; }
.graphic-note { font-size:.68rem; color:#aebfc6; line-height:1.65; margin:12px 0 0; }
.reward-tier-ladder { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); align-items:end; list-style:none; gap:7px; padding:0; margin:0 0 22px; height:116px; }
.reward-tier { position:relative; display:flex; flex-direction:column; justify-content:flex-end; align-items:center; gap:7px; height:calc(42px + var(--step)*15px); padding:10px 3px; border:1px solid #58727d; border-radius:6px 6px 0 0; background:#2d4853; }
.reward-tier.chosen { color:#e5f59d; border-color:#d8f074; background:#58704445; box-shadow:inset 0 3px #d8f074; }
.tier-reward { font-size:.8rem; white-space:nowrap; font-variant-numeric:tabular-nums; }
.tier-threshold { font-size:.62rem; color:#b5c9cb; white-space:nowrap; }
.reward-tier.chosen .tier-threshold { color:#d3e2c4; }
.reward-tier>.ui-icon { position:absolute; width:13px; height:13px; right:3px; top:4px; color:#d8f074; }
.cash-lock-timeline { border-top:1px solid #455f6a; padding-top:13px; }
.lock-caption { display:flex; flex-wrap:wrap; align-items:center; gap:7px; font-size:.66rem; }
.lock-caption>.ui-icon { color:#efb193; width:16px; height:16px; }
.lock-caption>strong { font-weight:600; }
.lock-caption>span { flex-basis:100%; color:#acd4e3; margin-left:23px; }
.lock-rail { position:relative; height:8px; margin:15px 10px 10px 0; border-radius:7px; background:#4e6670; }
.lock-horizon { display:block; height:100%; background:#90cfdf; border-radius:7px; }
.lock-end { position:absolute; width:18px; height:18px; right:-9px; top:-5px; fill:none; stroke:#efb193; stroke-width:2; background:#142b35; }
.lock-labels { display:flex; justify-content:space-between; gap:10px; font-size:.6rem; color:#aebfc6; }
.share-source { display:flex; align-items:center; justify-content:center; gap:9px; background:#294650; padding:10px; border:1px solid #5c7c87; border-radius:8px; font-size:.65rem; }
.share-source>.ui-icon { color:#9cd8e7; width:21px; height:21px; }
.share-source>strong { color:#bce8ed; font-size:1.1rem; }
.share-branches { height:24px; width:78%; margin:auto; border-top:0; position:relative; background:linear-gradient(#73949f,#73949f) center top/1px 12px no-repeat,linear-gradient(#73949f,#73949f) center 12px/100% 1px no-repeat; }
.share-basket { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); list-style:none; gap:5px; padding:0; margin:0; }
.share-basket>li { display:flex; flex-direction:column; align-items:center; padding:12px 2px 9px; border:1px solid #638591; border-radius:6px; background:#263f4b; min-width:0; position:relative; }
.share-basket>li::before { content:""; height:12px; width:1px; background:#73949f; position:absolute; top:-13px; }
.share-basket .ui-icon { color:#90cfdf; width:20px; height:20px; margin-bottom:7px; }
.share-basket strong { font-size:.72rem; color:#cee7e9; white-space:nowrap; }
.share-basket span { color:#acc2ca; font-size:.53rem; margin-top:5px; }
.payment-years { display:grid; gap:9px; }
.payment-year { display:flex; align-items:center; gap:9px; }
.payment-year>span:first-child { font-size:.62rem; color:#b6c9cf; width:18px; flex:0 0 18px; }
.payment-dots { display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); width:100%; gap:5px; }
.payment-dot { display:block; width:100%; aspect-ratio:1; border:1px solid #6c8792; border-radius:3px; background:#263f4a; }
.payment-dot.within { background:#90cfdf; border-color:#b6e3e9; }
.payment-dot.final { border-color:#d9c6ef; box-shadow:0 0 0 1px #d9c6ef44; }
.payment-chart-key { display:flex; flex-wrap:wrap; gap:10px; margin-top:13px; font-size:.6rem; color:#adcfda; }
.payment-chart-key span+span { color:#b4bdcb; }
.payment-amounts { display:flex; flex-wrap:wrap; justify-content:space-between; gap:7px; font-size:.62rem; color:#ccd8dc; margin-top:12px; padding-top:10px; border-top:1px solid #46616d; }
.funding-route { display:grid; grid-template-columns:1fr .7fr 1fr; align-items:center; gap:8px; margin-block:24px; }
.funding-route>span { display:flex; align-items:center; flex-direction:column; gap:12px; text-align:center; }
.funding-route .ui-icon { width:39px; height:39px; }
.funding-route strong { font-size:.68rem; }
.route-bank { color:#a7bac2; }
.route-broker { color:#cbbdea; }
.route-arrow { color:#eeb395; }
.route-arrow>.ui-icon { width:25px; height:25px; }
.route-arrow small { font-size:.55rem; line-height:1.5; }
.use-transfer-scenario { width:100%; padding:11px!important; font-size:.7rem!important; color:#d2e1e0!important; min-height:44px; }
.minimum-gate { display:grid; grid-template-columns:auto 1fr; align-items:center; gap:15px; padding:15px; background:#263f48; border-radius:8px; }
.minimum-gate .ui-icon { width:26px; height:26px; color:#ecbc9d; }
.minimum-gate strong { font-size:1.1rem; }
.minimum-gate span { font-size:.72rem; }
.unavailable-symbol { display:grid; place-items:center; width:88px; height:88px; margin:24px auto; background:#314a55; border:1px dashed #8ea4ad; border-radius:50%; color:#c8d6d7; }
.unavailable-symbol .ui-icon { width:46px; height:46px; }
.bonus-support-details { border-top:1px solid #516974; margin-top:2px; padding-top:5px; }
.bonus-support-details>summary { cursor:pointer; font-size:.72rem; color:#b9ced0; padding-block:10px; min-height:38px; }
.bonus-result-exclusions { margin-bottom:13px; font-size:.64rem; }
.bonus-offer-art { display:block; width:calc(100% + 50px); max-width:none; margin:-25px -25px 22px; height:176px; object-fit:cover; border-bottom:1px solid #506c78; }
.bonus-card { overflow:hidden; }
.bonus-card-top { margin-bottom:18px; }
.bonus-detail-scene { float:right; width:45%; max-width:440px; margin:15px 0 25px 30px; border:1px solid #506d78; border-radius:12px; overflow:hidden; }
.bonus-detail-scene>img { display:block; width:100%; height:auto; }
.bonus-detail-header::after { content:""; display:block; clear:both; }
.bonus-rule h2 { display:flex; align-items:center; gap:13px; }
.bonus-rule h2 .ui-icon { width:27px; height:27px; color:#a5d6de; }
.bonus-rule { border-top:1px solid #3e5965; padding-top:25px; }
.bonus-guide-steps>article { border:1px solid #496772; border-radius:10px; overflow:hidden; padding:0 20px 22px; background:#1b323b; }
.bonus-guide-art { display:block; width:calc(100% + 40px); max-width:none; height:148px; object-fit:cover; margin:0 -20px 20px; border-bottom:1px solid #496772; }
.bonus-principles .ui-icon { width:43px; height:43px; background:#90cfdf12; padding:9px; border:1px solid #90cfdf40; border-radius:11px; }
.bonus-principles>div { grid-template-columns:48px 1fr; }
.bonus-tier-table td:first-child::before { content:""; display:inline-block; width:9px; height:9px; margin-right:12px; border-radius:3px; background:#90cfdf; }
.bonus-facts dt { display:flex; align-items:center; gap:7px; }
.bonus-facts dt .ui-icon { width:15px; height:15px; color:#9dbfc7; }
.bonus-inputs label>span { display:flex; align-items:center; gap:8px; }
.bonus-inputs label>span .ui-icon { width:19px; height:19px; color:#a5d6de; }
.plan-facts dt { display:flex; gap:7px; align-items:center; }
.plan-facts dt .ui-icon { width:17px; height:17px; color:#9bbec8; flex:0 0 17px; }
.fee-composition { margin:22px 0; padding:18px; border:1px solid #5b7580; border-radius:10px; background:#172e38; }
.fee-stack { display:flex; overflow:hidden; height:27px; border-radius:6px; background:repeating-linear-gradient(135deg,#45616b 0 2px,#2c4652 2px 8px); }
.fee-stack>span { display:block; border-right:2px solid #172e38; }
.fee-stack-key { margin:15px 0 0; padding:0; list-style:none; display:grid; gap:8px; }
.fee-stack-key>li { display:flex; align-items:center; gap:8px; font-size:.68rem; color:#b8cdd0; }
.fee-stack-key i { width:9px; height:9px; border-radius:2px; flex:0 0 9px; }
.fee-stack-key strong { margin-left:auto; color:#dce7df; font-size:.75rem; white-space:nowrap; }
.payout-money-flow { margin:0 0 24px; padding:20px 16px; border:1px solid #63818a; border-radius:11px; background:#152e39; }
.payout-ledger-flow { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.payout-ledger-flow>div { position:relative; display:flex; flex-direction:column; align-items:center; text-align:center; min-width:0; padding:12px 5px; background:#2a4550; border-radius:7px; }
.payout-ledger-flow>div+div::before { content:"→"; color:#9cbcc8; position:absolute; left:-11px; top:36px; z-index:1; }
.payout-ledger-flow .ui-icon { width:27px; height:27px; color:#afd9e0; }
.payout-ledger-flow span { font-size:.6rem; color:#b5cbd2; margin-top:9px; }
.payout-ledger-flow strong { font-size:.85rem; color:#e1eade; margin-top:6px; overflow-wrap:anywhere; }
.payout-share-flow { margin-top:18px; padding-top:18px; border-top:1px solid #466570; display:flex; align-items:center; gap:17px; }
.payout-share-ring { --share:0%; flex:0 0 82px; height:82px; border-radius:50%; display:grid; place-items:center; background:conic-gradient(#90cfdf var(--share),#496671 var(--share)); position:relative; }
.payout-share-ring::before { content:""; position:absolute; inset:9px; border-radius:50%; background:#152e39; }
.payout-share-ring strong { position:relative; color:#c2e2e7; font-size:1rem; }
.payout-share-flow>div+div { min-width:0; }
.payout-share-flow span { display:block; color:#b9ced1; font-size:.7rem; }
.payout-share-flow>div+div strong { display:block; color:var(--accent); font-size:1.8rem; font-family:Georgia,serif; line-height:1.3; overflow-wrap:anywhere; }
.payout-share-flow small { display:block; color:#aabfc8; font-size:.62rem; margin-top:6px; line-height:1.6; }
.payout-money-flow.unmet { border-color:#bf967e; }
@media(max-width:1050px) { .result-card-visual { margin:-20px -20px 20px; }.bonus-offer-art { width:calc(100% + 40px); margin:-20px -20px 22px; }.bonus-metric-grid .bonus-result-amount { font-size:1.8rem; }.bonus-metric-grid .bonus-scheduled strong { font-size:1.55rem; }.tier-reward { font-size:.65rem; }.tier-threshold { font-size:.54rem; }.reward-diagram { padding:15px 11px; }.payment-dots { gap:4px; } }
@media(max-width:850px) { .bonus-offer-art { grid-column:1/-1; width:calc(100% + 40px); height:190px; }.result-card-visual { height:185px; }.result-scene { object-fit:contain; }.bonus-metric-grid .bonus-result-amount { font-size:2.6rem; }.bonus-metric-grid .bonus-scheduled strong { font-size:2.2rem; }.tier-reward { font-size:1rem; }.tier-threshold { font-size:.7rem; }.reward-diagram { padding:20px; }.payment-dots { gap:8px; max-width:450px; }.payment-year { gap:15px; }.share-basket { gap:12px; }.share-basket strong { font-size:1rem; }.share-basket span { font-size:.7rem; }.funding-route { max-width:390px; margin-inline:auto; }.bonus-result.unavailable>.bonus-result-amount { font-size:1.4rem; } }
@media(max-width:700px) {
 .result-card-visual { margin:-24px -24px 20px; height:168px; }.result-scene { object-fit:cover; }.result-logo { width:123px; height:44px; }
 .bonus-metric-grid .bonus-result-amount { font-size:2rem; }.bonus-metric-grid .bonus-scheduled strong { font-size:1.8rem; }.bonus-metric-grid { gap:12px; }.bonus-metric-grid .bonus-scheduled { padding-left:12px; }
 .reward-diagram { padding:16px 12px; }.reward-tier-ladder { gap:6px; }.tier-reward { font-size:.75rem; }.tier-threshold { font-size:.58rem; }.graphic-caption { font-size:.7rem; }.share-basket { gap:5px; }.share-basket strong { font-size:.72rem; }.share-basket span { font-size:.53rem; }.payment-dots { gap:5px; }.payment-year { gap:9px; }
 .bonus-offer-art { width:calc(100% + 44px); height:170px; margin:-22px -22px 22px; }.bonus-detail-scene { float:none; width:100%; max-width:none; margin:0 0 26px; }.bonus-rule h2 { gap:11px; }.bonus-rule h2 .ui-icon { flex:0 0 24px; width:24px; height:24px; }.bonus-guide-art { height:160px; }.bonus-principles .ui-icon { width:42px; height:42px; }
 .fee-composition { padding:15px; }.payout-money-flow { padding:17px 12px; }.payout-ledger-flow { grid-template-columns:1fr; gap:14px; }.payout-ledger-flow>div { display:grid; grid-template-columns:24px 1fr auto; gap:9px; padding:10px; text-align:left; align-items:center; }.payout-ledger-flow .ui-icon { width:24px; height:24px; }.payout-ledger-flow strong { font-size:.77rem; margin:0; white-space:nowrap; }.payout-ledger-flow span { font-size:.58rem; margin:0; }.payout-ledger-flow>div+div::before { content:"↓"; left:50%; top:-16px; }.payout-share-ring { flex-basis:72px; height:72px; }
}
@media(max-width:370px) { .tier-reward { font-size:.63rem; }.tier-threshold { font-size:.51rem; }.reward-tier { padding-inline:1px; }.reward-tier>.ui-icon { width:10px; height:10px; top:3px; }.share-source { flex-wrap:wrap; gap:5px 9px; }.share-source>span { flex-basis:100%; text-align:center; }.share-basket strong { font-size:.6rem; }.share-basket .ui-icon { width:16px; height:16px; }.reward-diagram { padding:14px 10px; }.bonus-metric-grid .bonus-result-amount { font-size:1.75rem; }.bonus-metric-grid .bonus-scheduled strong { font-size:1.5rem; }.payment-dots { gap:4px; }.lock-caption { font-size:.6rem; }.funding-route { gap:5px; }.funding-route strong { font-size:.58rem; }.route-arrow small { font-size:.5rem; }.use-transfer-scenario { font-size:.65rem!important; } }
@media(forced-colors:active) { .payment-dot.within { background:Highlight; }.payout-share-ring { background:Canvas; border:2px solid CanvasText; }.fee-stack>span { border:2px solid CanvasText; }.reward-tier.chosen { border:2px solid Highlight; } }