/* ORR uses neutral UI chrome; merchant and card artwork keep their own colors. */
:root{--ink:#171717;--accent:#171717;--green:#171717;--selected:#f2f2f2;--muted:#666;--line:#e5e5e5;--soft:#f6f6f6;--success:#23855c}
html{overscroll-behavior:none;scroll-padding-block:24px}
body{overscroll-behavior:none;min-width:0}
.page,.wizard,.results{min-width:0;max-width:100%}
input,select,textarea{accent-color:var(--ink)}
/* A full-height hit area around a slim track, shared by every range control. */
body input[type=range]{appearance:none;-webkit-appearance:none;display:block;width:100%;min-width:0;height:48px;min-height:48px;margin:12px 0;padding:0 12px;border:0;border-radius:0;background:transparent;box-shadow:none;cursor:pointer;touch-action:pan-y pinch-zoom}
input[type=range]::-webkit-slider-runnable-track{height:4px;border-radius:99px;background:#d4d4d4}
input[type=range]::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:26px;height:26px;margin-top:-11px;border:3px solid white;border-radius:50%;background:#171717;box-shadow:0 0 0 1px #171717,0 2px 5px #0002}
input[type=range]::-moz-range-track{height:4px;border-radius:99px;background:#d4d4d4}
input[type=range]::-moz-range-thumb{width:20px;height:20px;border:3px solid white;border-radius:50%;background:#171717;box-shadow:0 0 0 1px #171717}
input[type=range]:focus-visible{outline:2px solid #171717;outline-offset:3px;border-radius:10px}
.range-question output{font-weight:650;font-variant-numeric:tabular-nums}
.value-area{fill:url(#value-wash)}.value-line{stroke:var(--success)}
/* Success accents cover both result layouts and the card comparison list. */
.value-results .result-value strong,.value-results .score-value,
.plan-card-total strong,.plan-value-reason li strong,.plan-value-equation strong,
.plan-route>strong,.comparison-value strong,.plan-index-heading strong,
.score-value,.score-index strong{color:var(--success)}
.value-meter,.value-meter.tone-yellow{--bar-fill:var(--success);--bar-track:#e3efe9}
.value-meter:not(.is-unrated) .value-pointer{background:var(--success)}
.is-matched .reel-selection{border-color:#171717}.reel-check{background:#171717}
@media(max-width:700px){
 .page{padding-inline:20px;padding-bottom:calc(32px + env(safe-area-inset-bottom));width:100%}
 .progress{width:calc(100% - 40px)}
 .wizard,.results,.question-group,.personal-section,.inline-followup{min-width:0}
 .wizard .question{font-size:clamp(26px,7vw,32px);line-height:1.18;text-wrap:pretty;overflow-wrap:anywhere}
 .wizard .nav{position:static;margin:28px 0 0;padding:18px 0 0;gap:12px;background:#fff;z-index:auto;width:100%;min-width:0}
 .wizard .nav .btn{min-width:0;flex:1;min-height:50px;padding:10px 14px;white-space:normal}
 .wizard .nav .back{flex:none;min-width:56px}
 .wizard :is(input:not([type=range]),select,textarea){font-size:16px}
 .wizard .segmented{max-width:100%;min-width:0;flex-wrap:wrap;overflow:visible}
 .wizard .segmented button{min-width:0;flex:1 1 0;padding:10px 8px;font-size:14px;white-space:normal;overflow-wrap:anywhere}
 .wizard .chip-options{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
 .wizard .store-chip,.wizard .store-chip:has(.brand-logo){min-width:0;font-size:13px;padding:10px 8px;gap:6px}
 .wizard .store-chip>span:not(.small-check){overflow-wrap:anywhere}
 .wizard .store-chip .small-check{display:none}
 .wizard .store-chip.selected{box-shadow:inset 0 0 0 1px #171717}
 .personal-tiles{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
 .personal-tile{min-width:0;padding:14px 10px;overflow-wrap:anywhere}
 .wizard .spending-section-body .spend-row{grid-template-columns:minmax(0,1fr) minmax(100px,42%);gap:12px}
 .wizard .inline-total .money,.wizard .review-category .money{width:42%;max-width:150px;min-width:100px}
 .wizard .inline-total label{min-width:0;overflow-wrap:anywhere}
 .money{min-width:0}.money input{width:100%;min-width:0}
 .inline-followup{margin:24px 0;padding-top:24px}
 .inline-followup h3,.inline-followup .personal-heading h2{font-size:18px}
 .upload{padding:30px 16px}.upload strong{font-size:21px}
 .card-picker{max-height:none;overflow:visible;padding:0}
 .filter-row{flex-wrap:wrap}.filter{min-height:44px}
 .owned-card{grid-template-columns:72px minmax(0,1fr) 20px;gap:12px;padding:12px}
 .wallet-style-options{grid-template-columns:repeat(2,minmax(0,1fr))}
 .wallet-style-options button{padding:12px 10px;gap:8px}
 .wallet-style-options button strong{font-size:14px}
 .wallet-styles{padding:20px 16px}
 .comparison-tools{grid-template-columns:repeat(2,minmax(0,1fr))}.comparison-tools>div:first-child{grid-column:1/-1}
 .comparison-tools input,.comparison-tools select,.plan-controls select{font-size:16px}
 .value-results .value-hero{padding:28px 16px 20px;min-height:250px}
 .value-results .result-value strong{font-size:clamp(30px,10vw,64px);letter-spacing:-.055em;max-width:100%}
 .value-results .value-hero h1{max-width:100%}
 .plan-card-heading{display:grid;grid-template-columns:76px minmax(0,1fr);gap:12px;padding:20px 16px}
 .plan-card-art{width:76px;height:48px}.plan-card-heading h2{font-size:17px}
 .plan-card-total{grid-column:1/-1;margin:0;text-align:left;padding-top:12px;border-top:1px solid var(--line)}
 .plan-card-total strong{font-size:26px}.plan-card-total small{display:inline;margin-left:8px}
 .plan-index,.plan-routes,.plan-value-reason{padding-left:16px;padding-right:16px}
 .plan-usage>summary,.plan-apply{padding-inline:16px}
 .plan-route{gap:12px}.plan-route>strong{font-size:16px;flex:none}
 .plan-route-name{font-size:14px;gap:8px}
 .catalog-dialog{overscroll-behavior:contain;max-width:100%;max-height:100dvh}
 .transaction-scroll{overscroll-behavior:contain;max-width:100%}
 button,a,summary,input,select{scroll-margin-block:20px}
}
@media(max-width:360px){
 .page{padding-inline:16px}.progress{width:calc(100% - 32px)}
 .wizard .nav{margin-inline:0;padding-inline:0}
 .wizard .choice-grid .option{grid-template-columns:minmax(0,1fr) 20px;gap:8px}.wizard .choice-grid .option .icon{display:none}
 .birthday{gap:7px;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr) minmax(0,1.2fr)}
 .birthday input,.birthday select{padding-inline:8px}
 .wallet-style-options{grid-template-columns:1fr}
 .plan-route{flex-wrap:wrap}.plan-route>strong{margin-left:44px}
}
@media(hover:none){.btn:hover{transform:none}}

/* Size content to its container; the page never hides excess form content. */
@media(max-width:700px){
 .wizard :is(.fields,.birthday,.choice-grid,.personal-pair,.draft-fields,.picker-tools,.question-group,.personal-fold-body,.income-fields,.progressive-section){min-width:0;max-width:100%}
 .wizard :is(.fields,.birthday,.choice-grid,.personal-pair,.draft-fields)>*{min-width:0}
 .wizard .personal-segments{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,90px),1fr));gap:6px;max-width:100%}
 .wizard .personal-segments button{min-width:0;height:auto;white-space:normal;overflow-wrap:anywhere;padding:11px 8px;line-height:1.4}
 .wizard .spending-section{overflow:visible}
 .wizard .spending-section-name{min-width:0;overflow-wrap:anywhere}
 .wizard .spending-section>summary{flex-wrap:wrap;column-gap:8px;row-gap:6px}
 .wizard .spending-subtotal{white-space:normal;margin-left:auto}
 .wizard .spending-edit{flex:none}
 .wizard .personal-merchant-detail>summary{flex-wrap:wrap}
 .wizard .personal-merchant-detail>summary strong{white-space:normal}
 .wizard .custom-card-entry{display:grid;grid-template-columns:minmax(0,1fr);gap:10px}
 .wizard .custom-card-entry .btn{width:100%;min-width:0;white-space:normal}
 .wizard .selected-card-chip{max-width:100%;white-space:normal;overflow-wrap:anywhere}
 .wizard .filter-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,100px),1fr));gap:8px}
 .wizard .filter-row .filter{min-width:0;white-space:normal;overflow-wrap:anywhere;padding-inline:8px}
 .wizard .upload{min-width:0;max-width:100%}.wizard .upload .btn{min-width:0;max-width:100%;white-space:normal}
 .wizard .statement-file{min-width:0;flex-wrap:wrap}.wizard .statement-file>div{min-width:0}
 .wallet-style-heading{display:grid;grid-template-columns:minmax(0,1fr);gap:16px}
 .wallet-summary{min-width:0;max-width:100%;align-items:flex-start}
 .wallet-card-fan{max-width:100%;align-self:center}
 .wallet-style-heading h2{overflow-wrap:anywhere}
 .plan-card,.value-results{overflow:visible}
 .plan-card{border-radius:16px}
 .plan-card-heading>*,.plan-card-details dl>*,.comparison-row dl>*{min-width:0}
 .plan-card-total{display:block;max-width:100%}.plan-card-total strong{overflow-wrap:anywhere}.plan-card-total small{display:block;margin:4px 0 0}
 .plan-card-details dl>div,.comparison-row dl>div{display:grid;grid-template-columns:minmax(0,1fr);gap:5px}
 .plan-card-details dd,.comparison-row dd{margin:0;overflow-wrap:anywhere}
 .browse-intro{grid-template-columns:minmax(0,1fr);gap:16px}.browse-cards-button{width:100%;white-space:normal;overflow-wrap:anywhere}
 .comparison-value{padding-left:0}.comparison-identity{align-items:flex-start}
 .plan-routes-heading{flex-wrap:wrap;gap:8px}.plan-route{display:grid;grid-template-columns:minmax(0,1fr);gap:8px}
 .plan-route>strong{margin:0 0 0 44px;text-align:left}.plan-route>strong small{text-align:left}
 .plan-value-reason li{display:grid;grid-template-columns:minmax(0,1fr);gap:4px;padding:8px 0}
 .plan-value-reason li strong{white-space:normal}
 .plan-index-scale{gap:12px;line-height:1.4}.plan-index-scale>span{min-width:0;flex:1}.plan-index-scale>span:last-child{text-align:right}
 .results .result-actions{display:grid;grid-template-columns:minmax(0,1fr);gap:10px}.results .result-actions .btn{min-width:0;white-space:normal;height:auto;padding:14px}
 .value-results .value-hero{min-height:0}.value-results .result-value{white-space:normal;width:100%}.value-results .result-value strong{white-space:normal;overflow-wrap:anywhere}
 .wizard .review-category>.inline-total{display:grid;grid-template-columns:minmax(0,1fr);gap:10px}
 .wizard .review-category .money{width:100%;max-width:none}
}
@media(max-width:400px){
 .wizard .spending-section-body .spend-row{grid-template-columns:minmax(0,1fr);gap:10px}
 .wizard .spending-section-body .money{width:100%}
 .wizard .inline-total{display:grid;grid-template-columns:minmax(0,1fr);gap:10px}
 .wizard .inline-total .money{width:100%;max-width:none}
 .wizard .choice-grid{grid-template-columns:minmax(0,1fr)}
 .wizard .spending-progress{flex-wrap:wrap;gap:10px}
 .wizard .split-toolbar{flex-wrap:wrap}.wizard .split-monthly{text-align:left}
}
@media(max-width:700px){
 .home{min-height:0;justify-content:flex-start;padding-top:12px}
 .home h1{font-size:clamp(29px,8vw,40px);line-height:1.12;margin-bottom:22px}
 .home .hero-stage{margin:0 0 20px}
 .home-carousel{height:140px;overflow:visible}
 .home-carousel .carousel-card{width:48%;max-width:180px;height:auto;aspect-ratio:1.586}
 .home-carousel .carousel-card.previous{transform:translateX(-45%) scale(.78) rotate(-8deg)}
 .home-carousel .carousel-card.next{transform:translateX(45%) scale(.78) rotate(8deg)}
 .home .btn{min-width:0;max-width:100%;white-space:normal}
}
@media(max-width:700px){
 .home-carousel .carousel-card{transform:scale(.75)}
 .home-carousel .carousel-card.active{transform:none}
 .home-carousel .carousel-card.previous{transform:translateX(-45%) scale(.78) rotate(-8deg)}
 .home-carousel .carousel-card.next{transform:translateX(45%) scale(.78) rotate(8deg)}
}
@media(max-width:900px){
 .orr-wordmark{position:absolute}
 .progress{margin-top:64px;width:min(600px,calc(100% - 40px))}
 .progress.on~.page{padding-top:22px}
}

/* Compact setup summary; optional controls use a native keyboard-accessible disclosure. */
.wallet-styles{padding:18px 22px}
.wallet-styles .wallet-style-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:4px}
.wallet-styles .wallet-style-heading .eyebrow{margin:0 0 4px;font-size:11px}
.wallet-styles .wallet-style-heading h2{margin:0;font-size:21px}
.wallet-styles .wallet-summary{min-width:90px;gap:2px}
.wallet-styles .wallet-summary>strong{font-size:13px}
.wallet-styles .wallet-card-fan{width:100px;height:45px}
.wallet-styles .wallet-fan-card{width:48px;height:31px;bottom:3px;transform:translateX(calc(-50% + var(--fan-x)*.45)) rotate(var(--fan-angle))}
.wallet-styles .wallet-art-fallback{width:48px;height:31px}
.wallet-options>summary{display:flex;align-items:center;gap:8px;width:fit-content;min-height:44px;cursor:pointer;list-style:none;font-size:14px;font-weight:550;color:#4c4c4c}
.wallet-options>summary::-webkit-details-marker{display:none}
.wallet-options>summary:focus-visible{outline:3px solid #636363;outline-offset:3px;border-radius:4px}
.wallet-options-hide,.wallet-options[open] .wallet-options-show{display:none}
.wallet-options[open] .wallet-options-hide{display:inline}
.wallet-options-chevron{font-size:20px;line-height:1}
.wallet-options[open] .wallet-options-chevron{transform:rotate(180deg)}
.wallet-options-body{padding-top:14px;border-top:1px solid #e8e8e8;margin-top:6px}
@media(max-width:700px){.wallet-styles{padding:14px 16px}.wallet-styles .wallet-style-heading h2{font-size:20px}}
@media print{.wallet-options{display:none}}

.card-art-reference{display:inline-flex;flex-direction:column;max-width:100%;gap:4px}.card-art-reference-note{display:block;font-size:10px;line-height:1.3;color:var(--muted,#66736b);max-width:240px;white-space:normal;font-weight:400}.score-art:has(.card-art-reference-note){display:flex;flex-direction:column}