:root { --riven: #c39ae8; --riven-deep: #372344; --good: #78d9ae; --bad: #e998a1; --warning: #d9b576; --riven-text-scale: 1; }
.riven-content { --riven-text-scale: var(--font-scale); line-height: var(--reading-line-height); }
.riven-content button, .riven-content input, .riven-content select, .riven-sidebar-content input { font-family: inherit; }
.sidebar-links.riven-sidebar-content { display: flex; flex-direction: column; min-height: 0; flex: 1; overflow: hidden; padding: 0; }
.riven-content .svg-defs, .rivens-page > .svg-defs { position: absolute; width: 0; height: 0; overflow: hidden; }
.rivens-page button { cursor: pointer; }
.rivens-page [hidden] { display: none !important; }
.range-heading { padding: 13px 16px 9px; }
.range-title-row { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.range-title-row h2 { min-width: 0; overflow-wrap: anywhere; }
.range-title-row .disposition { column-gap: 5px; }
.range-title-row .disposition > span { font-size: 9px; }
.range-title-row .disposition strong { font-size: 20px; }
.section-kicker { color: var(--accent); font-size: calc(10px * var(--riven-text-scale)); font-weight: 700; letter-spacing: .12em; }
.range-heading h2 { margin: 5px 0 2px; font-size: calc(23px * var(--riven-text-scale)); font-weight: 600; }
.range-heading p { margin: 0; color: var(--muted); font-size: calc(11px * var(--riven-text-scale)); }
.range-search { display: flex; align-items: center; gap: 8px; margin: 0 16px 12px; padding: 7px 9px; background: #0d131c; border: 1px solid var(--border); border-radius: 6px; color: #8494a6; }
.range-search input { width: 100%; min-width: 0; background: transparent; border: 0; outline: 0; color: var(--text); font-size: calc(12px * var(--riven-text-scale)); }
.range-column-head { display: flex; justify-content: space-between; padding: 0 17px 7px; font-size: calc(10px * var(--riven-text-scale)); text-transform: uppercase; letter-spacing: .045em; color: #8293a6; }
.range-list { flex: 1; overflow-y: auto; min-height: 0; padding: 0 14px 10px; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: #3b4657 #121821; }
.range-row { display: grid; grid-template-columns: 1fr auto; gap: 7px; align-items: center; min-height: 55px; border-top: 1px solid rgba(70,89,110,.3); padding: 9px 0; }
.range-row > span { font-size: calc(12px * var(--riven-text-scale)); line-height: 1.25; }
.range-row > div { display: flex; flex-direction: column; text-align: right; font-size: calc(11px * var(--riven-text-scale)); font-variant-numeric: tabular-nums; line-height: 1.8; }
.range-positive { color: #d4dfe9; }
.range-negative { color: #98a8b9; }
.range-row .range-flag { display: block; margin-top: 4px; font-size: calc(9px * var(--riven-text-scale)); text-transform: uppercase; letter-spacing: .04em; }
.unrollable, .range-row .unrollable, .range-row.unrollable > span { color: var(--bad); }
.unverified, .range-row .unverified { color: var(--warning); }
.range-legend { border-top: 1px solid var(--border); padding: 11px 16px 13px; color: var(--muted); font-size: calc(10px * var(--riven-text-scale)); }
.range-legend > span { display: block; margin: 3px 0; }
.legend-dot { display: inline-block; width: 5px; height: 5px; border-radius: 50%; margin: 0 6px 1px 0; }
.legend-dot.red { background: var(--bad); }.legend-dot.amber { background: var(--warning); }
.page-title-row { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-bottom: 22px; }
.page-title-row h1 { margin: 0; font-size: calc(29px * var(--riven-text-scale)); font-weight: 600; letter-spacing: -.035em; line-height: 1.15; }
.text-button { color: var(--muted); background: transparent; border: 0; font-size: calc(11px * var(--riven-text-scale)) !important; padding: 5px; }
.text-button:hover { color: var(--accent); }
.weapon-selectors { display: grid; grid-template-columns: minmax(0,1fr); gap: 11px; margin-bottom: 18px; }
.selector-group { min-width: 0; }
.selector-group label { display: block; margin: 0 0 6px 1px; color: var(--muted); font-size: calc(11px * var(--riven-text-scale)); }
.selector-label-row { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 6px; }
.selector-label-row label { margin-bottom: 0; }
.selector-label-row .text-button { padding: 0; line-height: 1.55; }
.combo { position: relative; min-width: 0; }
.combo-trigger, .combo-input { display: flex; align-items: center; justify-content: space-between; gap: 7px; width: 100%; min-width: 0; height: 44px; border: 1px solid #4989a8; border-radius: 7px; padding: 0 13px; background: #142734; color: #9addff; font-size: calc(14px * var(--riven-text-scale)); font-weight: 600; outline: none; }
.combo-trigger > span { min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; text-align: left; }
.combo-trigger svg { flex: 0 0 auto; opacity: .8; }
.combo-trigger:hover, .combo-trigger:focus-visible, .combo-input:focus { border-color: #94dbff; background: #1a3444; box-shadow: 0 0 0 2px rgba(114,199,255,.09); }
.combo.is-open { z-index: 90; }
.combo-input { padding-right: 30px; font-weight: 400; }
.combo-input::placeholder { color: #80b5cf; opacity: .85; }
.combo-menu { position: absolute; z-index: 95; inset: calc(100% + 5px) 0 auto; min-width: 100%; background: #111c28; color: var(--text); border: 1px solid #406b84; border-radius: 7px; padding: 5px; box-shadow: 0 15px 36px #000a; }
.combo-list { max-height: 290px; overflow-y: auto; scrollbar-width: thin; scrollbar-color: #426077 #111c28; }
.combo-option { display: flex; gap: 7px; align-items: center; justify-content: space-between; width: 100%; border: 0; text-align: left; border-radius: 4px; background: transparent; color: var(--text); padding: 9px 9px; min-height: 34px; line-height: 1.3; font-size: calc(12px * var(--riven-text-scale)); }
.combo-option:hover, .combo-option.is-highlighted { background: #23394b; color: #b7e8ff; outline: 0; }
.combo-option[aria-selected="true"] { color: #9cdbff; background: rgba(114,199,255,.09); }
.combo-option[aria-disabled="true"] { color: var(--bad); opacity: .8; cursor: not-allowed; }
.combo-option .option-description { display: block; font-size: calc(9px * var(--riven-text-scale)); color: var(--muted); margin-top: 3px; }
.combo-option .option-check { border: 1px solid #526273; border-radius: 3px; width: 14px; height: 14px; flex: 0 0 auto; display: grid; place-items: center; }
.combo-option[aria-selected="true"] .option-check { border-color: var(--accent); background: #74c8ff; color: #0b1620; }
.combo-option-label { flex: 1; }
.combo-empty { color: var(--muted); padding: 12px 9px; font-size: calc(12px * var(--riven-text-scale)); }
.combo-divider { height: 1px; background: #304050; margin: 5px; }
.combo-menu-footer { display: flex; justify-content: space-between; align-items: center; border-top: 1px solid var(--border); padding: 8px 5px 3px; color: var(--muted); font-size: calc(10px * var(--riven-text-scale)); }
.combo-done { color: #b2e6ff; border: 1px solid #416276; border-radius: 4px; background: #1b3040; padding: 4px 11px; font-size: calc(11px * var(--riven-text-scale)); }
.disposition { display: grid; grid-template-columns: auto auto; align-items: center; column-gap: 8px; text-align: right; flex: 0 0 auto; }
.disposition > span { grid-column: 1; grid-row: 1; color: var(--muted); font-size: calc(10px * var(--riven-text-scale)); }
.disposition strong { grid-column: 2; grid-row: 1 / 3; color: var(--accent); font-size: calc(25px * var(--riven-text-scale)); font-weight: 500; line-height: 1.2; font-variant-numeric: tabular-nums; letter-spacing: -.02em; }
.disposition-dots { grid-column: 1; grid-row: 2; display: flex; justify-content: flex-end; gap: 3px; }
.disposition-dots i { width: 5px; height: 5px; border-radius: 50%; background: #8ecef3; }.disposition-dots i.dim { background: #304353; }
.pool-line { display: flex; align-items: center; flex-wrap: wrap; gap: 5px 14px; margin: 0 0 14px; color: #8999a9; font-size: calc(11px * var(--riven-text-scale)); }
.model-label { margin-left: auto; color: #8698aa; }
.research-notice { padding: 10px 13px; margin: 0 0 16px; border: 1px solid #5a4932; background: #211c13; border-radius: 6px; font-size: calc(12px * var(--riven-text-scale)); color: #dfc59e; line-height: 1.5; }
.research-notice.is-error { background: #291b20; color: var(--bad); border-color: #6b3f48; }
.calculator-grid { display: grid; grid-template-columns: minmax(260px, calc(330px * var(--font-scale))) minmax(0,1fr); gap: 28px; align-items: start; }
.selection-column, .math-column, .target-section, .results-section, .results-intro { min-width: 0; }
.math-column { container-type: inline-size; container-name: riven-results; }
.results-overview { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); align-items: stretch; gap: 20px; margin-bottom: 22px; }
.strategy-summary { min-width: 0; padding-left: 18px; border-left: 1px solid #273545; }
.section-heading { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; margin: 0 0 16px; }
.section-heading h2 { color: #d3dee9; margin: 0; font-size: calc(15px * var(--riven-text-scale)); font-weight: 600; }
.section-heading > span { color: #8293a4; font-size: calc(10px * var(--riven-text-scale)); }
.target-section .section-heading { align-items: center; margin-bottom: 12px; }
.results-intro > .section-heading { flex-wrap: wrap; row-gap: 3px; margin-bottom: 10px; }
.riven-card { position: relative; width: 100%; max-width: 362px; min-height: 393px; margin: 0 auto; isolation: isolate; }
.riven-card-art { position: absolute; inset: 0; z-index: -1; pointer-events: none; }
.card-backing { position: absolute; left: 4%; top: 3%; width: 92%; height: 95%; object-fit: fill; opacity: .52; }
.riven-card-art::after { content: ""; position: absolute; inset: 28% 5% 4%; background: linear-gradient(180deg,transparent,#1b1322 29%,#100d14 85%); }
.card-illustration { position: absolute; width: 83%; height: 34%; top: 5%; left: 8.5%; object-fit: cover; opacity: .55; mask-image: linear-gradient(#000 60%,transparent); }
.card-top { position: absolute; width: 101%; top: -2px; left: -.5%; z-index: 2; }
.card-bottom { position: absolute; width: 100%; bottom: 0; left: 0; z-index: 2; }
.card-content { padding: 74px 29px 29px; }
.card-type { display: block; text-align: center; color: #d0c1dc; opacity: .8; font-size: calc(8px * var(--riven-text-scale)); letter-spacing: .2em; }
.card-content h3 { margin: 6px 0 19px; text-align: center; font-size: calc(27px * var(--riven-text-scale)); font-weight: 400; color: var(--riven); line-height: 1.12; text-shadow: 0 2px 4px #000; }
.stat-fields { display: flex; flex-direction: column; gap: 8px; }
.stat-row { display: flex; align-items: center; min-width: 0; gap: 4px; }
.stat-sign { width: 13px; flex: 0 0 auto; color: #c8a5e5; font-size: calc(18px * var(--riven-text-scale)); text-align: center; }
.stat-combo { flex: 1; }
.stat-combo .combo-trigger, .stat-combo .combo-input { height: 36px; padding: 0 8px; background: rgba(33,24,42,.9); border: 1px solid #564062; border-radius: 5px; color: #d7b6ed; font-size: calc(12px * var(--riven-text-scale)); font-weight: 400; }
.stat-combo .combo-trigger:hover, .stat-combo .combo-trigger:focus-visible, .stat-combo .combo-input:focus { border-color: #ba8bd4; background: #352440; box-shadow: 0 0 0 2px #ae88c414; }
.stat-combo .combo-menu { min-width: 240px; border-color: #695079; }
.stat-combo .combo-option { font-size: calc(11px * var(--riven-text-scale)); }
.negative-row .stat-sign { color: #cb9bac; }
.lock-button { display: grid; place-items: center; flex: 0 0 auto; width: 28px; height: 34px; padding: 3px; border: 1px solid transparent; border-radius: 5px; color: #8d769b; background: transparent; }
.lock-button:hover { color: #e9cafa; border-color: #6b4f7e; background: #372641; }
.lock-button[aria-pressed="true"] { color: #a0e3ff; background: #1c3545; border-color: #50879e; }
.lock-button:disabled { opacity: .3; cursor: not-allowed; }
.stat-row.is-locked .stat-combo .combo-trigger { border-color: #589bb7; color: #bdeaff; background: #193040; }
.card-footer { color: var(--riven); text-align: center; line-height: 1.3; }
.negative-lock-choice { max-width: 300px; margin: 12px auto 0; }
.negative-lock-choice label { color: var(--muted); font-size: calc(10px * var(--riven-text-scale)); display: block; margin-bottom: 5px; }
.negative-lock-choice select { width: 100%; border: 1px solid var(--border); border-radius: 5px; color: var(--accent); padding: 7px; background: #172532; font-size: calc(12px * var(--riven-text-scale)); }
.strategy-recommendation { border-left: 2px solid var(--good); padding: 11px 15px; margin-bottom: 0; background: linear-gradient(90deg,#142821b3,transparent); }
.recommendation-label { display: block; color: #80aa97; font-size: calc(9px * var(--riven-text-scale)); font-weight: 700; letter-spacing: .12em; margin-bottom: 3px; }
.strategy-recommendation strong { font-size: calc(23px * var(--riven-text-scale)); color: var(--good); font-weight: 500; line-height: 1.3; }
.strategy-recommendation p { color: #9aafa5; font-size: calc(11px * var(--riven-text-scale)); margin: 4px 0 0; }
.strategy-recommendation.is-uncertain { border-color: var(--warning); background: linear-gradient(90deg,#302415a3,transparent); }.strategy-recommendation.is-uncertain strong { color: var(--warning); }
.strategy-table-wrap { overflow-x: auto; }
.strategy-table { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; }
.strategy-table thead th { text-align: right; color: #8294a8; font-size: calc(10px * var(--riven-text-scale)); font-weight: 500; border-bottom: 1px solid #2c3947; padding: 0 8px 9px; white-space: nowrap; }
.strategy-table thead th:first-child { text-align: left; padding-left: 0; }
.strategy-table tbody th { padding: 13px 8px 13px 0; text-align: left; font-size: calc(13px * var(--riven-text-scale)); font-weight: 500; }
.strategy-table tbody th small { display: block; font-size: calc(9px * var(--riven-text-scale)); color: #6e8296; margin-top: 2px; }
.strategy-table tbody td { padding: 13px 8px; text-align: right; color: #dce5ee; font-size: calc(15px * var(--riven-text-scale)); font-weight: 500; white-space: nowrap; }
.strategy-table tbody tr { border-bottom: 1px solid #1c2835; }
.strategy-table tbody tr[data-strategy-row] { cursor: pointer; }
.strategy-table tbody tr[aria-disabled="true"] { cursor: default; }
.strategy-table tbody tr[data-strategy-row]:not([aria-disabled="true"]):hover { background: #17304466; }
.strategy-table .best-row { background: #15251f66; }.strategy-table .best-row th { color: #92d8b7; }
.strategy-table td .probability-range { display: block; font-size: calc(11px * var(--riven-text-scale)); }
.positive-text, .strategy-table .positive-text { color: var(--good); }.negative-text, .strategy-table .negative-text { color: var(--bad); }.muted, .strategy-table .muted { color: #778ba0; }
.cost-caption { color: #8393a5; font-size: calc(10px * var(--riven-text-scale)); line-height: 1.6; margin: 11px 0 0; }.cost-caption strong { color: #a9bbcb; font-weight: 500; }
.active-strategy { margin: 0; padding: 0; }
.active-strategy > span { font-size: calc(9px * var(--riven-text-scale)); letter-spacing: .08em; color: #89a4b7; display: block; }
.active-strategy strong { font-size: clamp(calc(24px * var(--riven-text-scale)),3.5cqw,calc(32px * var(--riven-text-scale))); font-weight: 400; color: #b6e3fc; display: block; line-height: 1.4; margin-top: 2px; letter-spacing: -.035em; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.active-strategy p { font-size: calc(10px * var(--riven-text-scale)); color: #8091a5; margin: 1px 0 0; }
.planning-stats { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); margin-top: 16px; gap: 10px; }
.planning-stats > div + div { border-left: 1px solid #263442; padding-left: 10px; }.planning-stats span { font-size: calc(9px * var(--riven-text-scale)); color: #7c90a5; display: block; }.planning-stats strong { font-size: calc(12px * var(--riven-text-scale)); font-weight: 500; color: #c3d4e2; display: block; margin-top: 4px; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.crossover-section { border-top: 1px solid #273545; margin-top: 20px; padding-top: 16px; }
.crossover-section .section-heading { flex-direction: column; align-items: flex-start; gap: 2px; margin-bottom: 5px; }.crossover-section > p { color: #9bb5c7; font-size: calc(12px * var(--riven-text-scale)); margin: 0 0 13px; }
.crossover-scroll { max-height: 237px; overflow: auto; scrollbar-width: thin; scrollbar-color: #304a5b #0b0d10; }
.crossover-table { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; }
.crossover-table th { text-align: left; font-size: calc(10px * var(--riven-text-scale)); color: #869bad; font-weight: 500; padding: 7px 8px; border-bottom: 1px solid #293b48; position: sticky; top: 0; background: #0b0d10; z-index: 1; }
.crossover-table th:not(:first-child), .crossover-table td:not(:first-child) { text-align: right; }.crossover-table td { padding: 7px 8px; font-size: calc(11px * var(--riven-text-scale)); color: #b4c5d2; border-bottom: 1px solid #1b2732; }.crossover-table .wins { color: var(--good); background: #17302766; }.crossover-table .loses { color: var(--bad); }.crossover-table .selected-count { background: #192b394d; }.crossover-table td:first-child { color: #91a6b9; }
.math-details { margin-top: 24px; border: 1px solid #2e4658; border-radius: 7px; background: #0e1721a8; }
.math-details > summary { display: flex; align-items: center; justify-content: space-between; padding: 13px 16px; color: #9bcfe9; font-size: calc(13px * var(--riven-text-scale)); cursor: pointer; list-style: none; }.math-details > summary::-webkit-details-marker { display: none; }.math-details[open] > summary { border-bottom: 1px solid #2b3a49; }.math-details[open] > summary svg { transform: rotate(180deg); }
.math-content { padding: 4px 24px 24px; font-size: calc(13px * var(--riven-text-scale)); color: #bac9d5; line-height: var(--reading-line-height); }.math-content h3 { color: var(--accent); font-size: calc(17px * var(--riven-text-scale)); margin: 25px 0 8px; }.math-content h4 { color: #d2dfeb; font-size: calc(13px * var(--riven-text-scale)); margin: 19px 0 6px; }.math-content p { margin: 7px 0; }.math-content .formula { padding: 13px 15px; margin: 11px 0; background: #111d2b; border-left: 2px solid #4d88a7; overflow-x: auto; color: #c5e5fa; font-family: Cambria,Georgia,serif; font-size: calc(18px * var(--riven-text-scale)); white-space: nowrap; }.math-content dl { display: grid; grid-template-columns: 60px 1fr; gap: 8px 15px; }.math-content dt { color: #c5e5fa; font-family: Cambria,Georgia,serif; font-style: italic; font-size: calc(17px * var(--riven-text-scale)); }.math-content dd { margin: 0; }.math-content ul { padding-left: 20px; }.math-content li { margin: 7px 0; }.math-content table { width: 100%; border-collapse: collapse; font-size: calc(12px * var(--riven-text-scale)); }.math-content td,.math-content th { padding: 8px; border-bottom: 1px solid #273b4c; text-align: left; }.math-content th { color: var(--accent); }.math-content .math-callout { border: 1px solid #3b4d5e; padding: 11px 14px; border-radius: 5px; background: #152331; }.math-content a { color: var(--accent); }.math-content .selection-formula { color: #a5dec7; }
.riven-footer { display: flex; justify-content: space-between; gap: 16px; margin-top: 17px; color: #586b7e; font-size: calc(9px * var(--riven-text-scale)); }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.rivens-page :focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
@media (min-width: 1650px) { .page-title-row { margin-bottom: 25px; }.section-heading { margin-bottom: 19px; } }
@media (max-width: 1350px) { .strategy-table tbody td { font-size: calc(13px * var(--riven-text-scale)); } }
@media (max-width: 1130px) and (min-width: 901px) { .calculator-grid { grid-template-columns: minmax(240px,285px) minmax(0,1fr); gap: 20px; }.pool-line { gap: 4px 10px; font-size: calc(10px * var(--riven-text-scale)); }.model-label { margin-left: 0; }.strategy-table tbody td { font-size: calc(11px * var(--riven-text-scale)); padding-left: 4px; padding-right: 4px; }.strategy-table tbody th { font-size: calc(11px * var(--riven-text-scale)); }.strategy-table thead th { font-size: calc(9px * var(--riven-text-scale)); white-space: normal; }.crossover-table th,.crossover-table td { padding-left: 6px; padding-right: 6px; font-size: calc(10px * var(--riven-text-scale)); } }
@media (max-width: 900px) { .page-title-row h1 { font-size: calc(27px * var(--riven-text-scale)); }.crossover-section .section-heading > span { display: none; } }
@media (max-width: 700px) { .calculator-grid { display: block; }.selection-column { max-width: calc(330px * var(--font-scale)); margin: 0 auto; }.math-column { margin-top: 26px; } }
@media (max-width: 650px) { .page-title-row { margin-bottom: 17px; }.page-title-row h1 { font-size: calc(25px * var(--riven-text-scale)); }.text-button { font-size: calc(10px * var(--riven-text-scale)) !important; }.pool-line { font-size: calc(10px * var(--riven-text-scale)); }.model-label { margin-left: 0; }.strategy-table tbody td { font-size: calc(14px * var(--riven-text-scale)); }.strategy-recommendation { padding: 12px 14px; }.strategy-recommendation strong { font-size: calc(24px * var(--riven-text-scale)); }.crossover-table th,.crossover-table td { padding-left: 6px; padding-right: 6px; }.crossover-table th { font-size: calc(9px * var(--riven-text-scale)); }.crossover-table td { font-size: calc(10px * var(--riven-text-scale)); }.math-content { padding: 2px 15px 19px; font-size: calc(12px * var(--riven-text-scale)); }.math-content .formula { font-size: calc(16px * var(--riven-text-scale)); }.riven-footer { flex-direction: column; gap: 3px; }.combo-list { max-height: 245px; } }
@media (prefers-reduced-motion: reduce) { .rivens-page *, .rivens-page *::before, .rivens-page *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }.particle-canvas { display: none !important; } }

/* Keep the reference card's 292:380 viewport and its unscaled 292:512 frame. */
.riven-card { width: 100%; max-width: calc(330px * var(--font-scale)); min-height: 0; aspect-ratio: 292 / 380; container-type: inline-size; }
/* Menus cannot escape the card's isolated stacking context on their own.
   Raise the whole card while one is open, above the neighboring sticky table. */
.riven-card:has(.combo.is-open) { z-index: 90; }
.riven-card-art { overflow: hidden; border-radius: 4%; }
.card-frame-space { position: absolute; inset: 0 0 auto; width: 100%; aspect-ratio: 292 / 512; transform: translateY(-12.890625%); }
.card-backing { left: 6.1644%; top: 0; width: 87.6712%; height: 100%; opacity: 1; }
.riven-card-art::after { inset: 39% 7.8% 11%; background: linear-gradient(180deg,transparent,#111019 23%,#111019cc); }
.card-illustration { left: 7.8767%; top: 17%; width: 83.2192%; height: 30%; opacity: .95; mask-image: linear-gradient(#000 78%,transparent); }
.card-top { width: 96.2329%; top: 14%; left: 50%; transform: translateX(-50%); }
.card-side { position: absolute; top: 21%; width: 5.4795%; }
.card-side-right { left: 87.6986%; }.card-side-left { left: 6.1644%; transform: scaleX(-1); }
.card-bottom { top: 65%; bottom: auto; left: 0; width: 100%; }
.card-rank-line { position: absolute; top: 84.6875%; left: 6.1644%; width: 87.6712%; }
.card-content { position: absolute; top: 40%; left: 9.5%; right: 9.5%; bottom: 12%; padding: 0; display: flex; flex-direction: column; }
.card-type { font-size: 2.5cqw; line-height: 1.2; letter-spacing: .16em; }
.card-content h3 { font-size: 6.6cqw; line-height: 1.12; margin: 3px 0 7px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.stat-fields { gap: 1.1cqw; }
.stat-row { gap: 1px; }
.stat-sign { width: 3.5cqw; font-size: 5cqw; }
.stat-combo .combo-trigger, .stat-combo .combo-input { height: 8.6cqw; padding: 0 1.8cqw; border-radius: 3px; font-size: 3.5cqw; background: #21182ae6; }
.stat-combo .combo-trigger svg { width: 11px; height: 11px; }
.lock-button { width: 7.3cqw; height: 8.6cqw; padding: 2px; }
.lock-button svg { width: 5.4cqw; height: 5.4cqw; }
.card-footer { margin: auto 0 0; padding: 4px 0 0; font-size: 3cqw; }
.riven-card { margin-left: 0; margin-right: 0; }
.range-column-head { display: none; }
.range-section h3 { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; margin: 0; padding: 8px 0 5px; color: var(--accent); font-size: calc(14px * var(--riven-text-scale)); font-weight: 500; }
.range-section h3 span { color: var(--muted); font-size: calc(9px * var(--riven-text-scale)); }
.range-section + .range-section { margin-top: 10px; }
.range-row { min-height: 27px; padding: 4px 0; border: 0; grid-template-columns: minmax(85px,1fr) auto; gap: 6px; }
.range-row > span { font-size: calc(11px * var(--riven-text-scale)); }.range-row > div { font-size: calc(10.5px * var(--riven-text-scale)); line-height: 1.4; }.range-row.unverified > span { color: var(--warning); }.range-row .range-flag { font-size: calc(8px * var(--riven-text-scale)); margin-top: 3px; }
.range-empty { color: var(--muted); font-size: calc(11px * var(--riven-text-scale)); }
.strategy-label { display: flex; align-items: center; gap: 8px; }
.strategy-copy { min-width: 0; }
.strategy-pick { color: inherit; background: none; border: 0; padding: 0; text-align: left; font-size: inherit; }
.strategy-pick:hover { color: var(--accent); }.strategy-pick:disabled { cursor: default; opacity: .5; }
.strategy-check { display: inline-grid; place-items: center; flex: 0 0 14px; width: 14px; height: 14px; border: 1px solid #61788b; border-radius: 2px; background: #111c26; box-sizing: border-box; }
.strategy-check[data-checked="true"] { border-color: var(--accent); background: #173548; }
.strategy-check[data-checked="true"]::after { content: ""; display: block; width: 4px; height: 7px; border: solid var(--accent); border-width: 0 2px 2px 0; transform: translateY(-1px) rotate(45deg); }
.strategy-table tr:not([aria-disabled="true"]):hover .strategy-check { border-color: var(--accent); }
.strategy-table tr[aria-disabled="true"] .strategy-check { opacity: .5; }
.strategy-table .has-probability-range { font-size: calc(11px * var(--riven-text-scale)); white-space: normal; max-width: 180px; }
.strategy-table tbody td:last-child { white-space: normal; }.active-strategy .active-range { font-size: calc(24px * var(--riven-text-scale)); }

/* Stack based on the space beside the card, including the Width control. */
@container riven-results (max-width: 520px) {
  .results-overview { grid-template-columns: minmax(0,1fr); gap: 18px; }
  .strategy-summary { padding: 16px 0 0; border-left: 0; border-top: 1px solid #273545; }
  .planning-stats { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; }
  .planning-stats > div + div { padding: 0 0 0 10px; border-top: 0; border-left: 1px solid #263442; }
}
@container riven-results (max-width: 340px) {
  .planning-stats { grid-template-columns: minmax(0,1fr); }
  .planning-stats > div + div { padding: 8px 0 0; border-left: 0; border-top: 1px solid #263442; }
}