/* Three sectors, one shared floating detail surface. */
#savings .shop-heading{margin-bottom:12px}
.savings-stage{position:relative;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:64px;min-height:620px;align-items:center}
.savings-orbit{grid-area:1/1;min-width:0;position:relative;padding:12px 0 28px}
.savings-wheel{display:block;width:100%;max-width:600px;margin:auto;overflow:visible}
.orbit-guide{fill:none;stroke:#333;stroke-width:1;stroke-dasharray:2 11}
.savings-sector{cursor:pointer;outline:none}
.sector-surface{fill:#181818;stroke:#414141;stroke-width:1;transition:fill .2s,stroke .2s}
.sector-index{fill:#8c8c8c;font:11px var(--body);letter-spacing:2px;pointer-events:none}
.sector-title{fill:#eee;font:600 15px var(--body);letter-spacing:.5px;pointer-events:none}
.sector-plus{fill:#888;font:24px var(--body);pointer-events:none}
.savings-sector:hover .sector-surface,.savings-sector.active .sector-surface{fill:#eee;stroke:#fff}
.savings-sector:hover .sector-title,.savings-sector.active .sector-title{fill:#111}
.savings-sector:hover .sector-index,.savings-sector.active .sector-index,.savings-sector:hover .sector-plus,.savings-sector.active .sector-plus{fill:#555}
.savings-sector:focus-visible .sector-surface{stroke:#fff;stroke-width:4;stroke-dasharray:5 4}
.center-kicker{fill:#777;font:9px var(--body);letter-spacing:1.6px}
.center-title{fill:#fff;font:700 48px var(--display);letter-spacing:1px}
.orbit-center circle{fill:#666}
.ring-gesture{display:flex;align-items:center;justify-content:center;gap:20px;font-size:10px;letter-spacing:.15em;color:#888;margin-top:-12px}
.ring-gesture>span:last-child{font-size:22px;color:#ddd}
.touch-gesture{display:none}
.savings-idle{grid-area:1/2;align-self:center;padding-left:16px;color:#777}
.savings-idle>span:first-child{display:block;font-size:11px;letter-spacing:.2em;margin-bottom:24px}
.savings-idle p{font:600 clamp(36px,4vw,56px)/1 var(--display);color:#bbb;letter-spacing:-.01em}
.savings-idle small{display:block;font-size:13px;margin-top:22px}
.savings-idle .idle-arrow{font-size:64px;font-weight:300;display:block;margin-top:20px;color:#444}
.has-savings-card .savings-idle{visibility:hidden}
.savings-popover{grid-area:1/2;position:relative;align-self:center;background:#191919;border:1px solid #555;border-radius:12px;box-shadow:0 25px 70px #0009;max-height:530px;overflow:auto;scrollbar-width:thin;scrollbar-color:#666 #191919;animation:reveal-savings .22s ease-out;z-index:2}
.savings-popover:before{content:'';display:block;position:sticky;top:0;height:3px;background:#fff;z-index:2}
.ring-card-close{position:sticky;float:right;top:12px;margin:8px 8px 0 0;width:40px;height:40px;font-size:26px;line-height:1;background:#191919;border-radius:50%;z-index:3;color:#bbb}
.ring-card-close:hover{background:#333;color:white}
.savings-ring-panel{padding:30px}
.savings-ring-panel>.small-label{font-size:9px;letter-spacing:.13em;max-width:calc(100% - 36px)}
.savings-ring-panel>h3{font:600 34px/1.1 var(--display);letter-spacing:0;margin:20px 0 12px;color:#fff;max-width:95%}
.ring-panel-intro{font-size:13px;color:#aaa;margin-bottom:24px}
.savings-ring-panel .saving-detail{padding:22px 0 0;font-size:13px;border-top:1px solid #3b3b3b}
.savings-ring-panel .saving-detail .small-label{font-size:9px;letter-spacing:.06em}
.savings-ring-panel .rule-pair{gap:10px;margin:16px 0}
.savings-ring-panel .rule-pair p{padding:12px;font-size:12px}
.savings-ring-panel .rule-pair strong{line-height:1.5;display:inline-block;margin-bottom:6px}
.savings-ring-panel .saving-detail h4{font-size:21px}
.savings-ring-panel .rule-links{gap:12px}
.savings-ring-panel .action{font-size:12px}
@keyframes reveal-savings{from{opacity:0;transform:translateY(16px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}
@media(max-width:1000px){
 .savings-stage{grid-template-columns:minmax(0,1fr);gap:0;min-height:0}
 .savings-orbit{grid-area:1/1;width:min(560px,100%);margin:auto;padding-bottom:22px}
 .savings-idle{display:none}
 .savings-popover{grid-area:2/1;width:min(560px,100%);margin:20px auto 0;max-height:480px}
 .savings-ring-panel{padding:26px}
}
@media(hover:none),(pointer:coarse){.desktop-gesture{display:none}.touch-gesture{display:inline}}
@media(max-width:700px){
 #savings .shop-heading h2{font-size:38px;max-width:290px}
 .savings-orbit{padding:14px 0 12px}
 .savings-wheel{width:100%}
 .sector-title{font-size:17px;letter-spacing:.1px}
 .sector-index{font-size:13px}
 .center-kicker{font-size:11px;letter-spacing:1px}
 .center-title{font-size:50px}
 .ring-gesture{margin-top:2px;font-size:9px;gap:16px}
 .savings-popover{width:100%;margin-top:24px;max-height:65svh}
 .savings-ring-panel{padding:24px 20px}
 .savings-ring-panel>h3{font-size:32px}
 .savings-ring-panel .rule-pair{grid-template-columns:1fr}
 .savings-ring-panel .rule-pair p{padding:14px}
}
@media(prefers-reduced-motion:reduce){.savings-popover{animation:none}.sector-surface{transition:none}}
@media(min-width:1001px){#savings{padding-top:48px}.savings-stage{min-height:550px}.savings-orbit{max-width:500px;margin:auto}}
.savings-orbit{width:100%}
.savings-wheel{user-select:none;-webkit-user-select:none}
@media(max-width:700px){.ring-gesture .desktop-gesture{display:none}.ring-gesture .touch-gesture{display:inline}}

