.sub-box{border:1px solid var(--border);border-radius:var(--r-card,0);background:var(--cream);flex-direction:column;gap:10px;margin-block:18px;padding:16px 18px;display:flex}.sub-box-head h2{font-family:var(--font-body);font-size:var(--t-body-size,15px);font-weight:600}.sub-basis,.sub-perks{font-size:var(--t-small-size,13px);color:var(--muted);line-height:1.55}.sub-cadences{flex-wrap:wrap;gap:8px;display:flex}.sub-chip{font:inherit;font-size:var(--t-chip-size,13px);border:1px solid var(--border);background:var(--white);min-height:40px;color:var(--black);cursor:pointer;border-radius:999px;align-items:center;gap:6px;padding:6px 14px;display:inline-flex}.sub-chip[aria-checked=true]{border-color:var(--black);box-shadow:inset 0 0 0 1px var(--black);font-weight:600}.sub-chip:disabled{opacity:.6;cursor:default}.sub-sugg{font-size:var(--t-micro-size,11px);color:var(--gold);font-weight:600}.sub-check{font-size:var(--t-small-size,13px);align-items:center;gap:8px;min-height:40px;display:flex}.sub-go{width:100%}.sub-err{font-size:var(--t-small-size,13px);color:var(--red)}.sub-list{flex-direction:column;gap:16px;display:flex}.sub-card{border:1px solid var(--border);border-radius:var(--r-card,0);flex-direction:column;gap:12px;padding:16px;display:flex}.sub-card[data-status=cancelled]{opacity:.75}.sub-card-head{justify-content:space-between;align-items:flex-start;gap:12px;display:flex}.sub-items{flex-direction:column;gap:8px;min-width:0;display:flex}.sub-item{color:inherit;align-items:center;gap:12px;min-width:0;display:flex}.sub-item img,.sub-ph{object-fit:cover;background:var(--cream);border:1px solid var(--border);border-radius:min(var(--r-card,0px), 12px);flex-shrink:0;width:64px;height:64px}.sub-item>span{min-width:0;font-size:var(--t-body-size,14px);flex-direction:column;gap:2px;display:flex}.sub-qty{font-size:var(--t-small-size,13px);align-items:center;gap:8px;display:inline-flex}.sub-qty .field{width:auto;min-width:72px}.sub-next{font-size:var(--t-body-size,14px);flex-wrap:wrap;align-items:baseline;gap:8px 12px;display:flex}.sub-next strong{font-family:var(--font-heading);font-size:var(--t-lead-size,1.25rem);font-weight:400}.sub-unpaid{background:var(--cream);border-radius:var(--r-card,0);font-size:var(--t-body-size,14px);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;padding:10px 12px;display:flex}.sub-acts .btn{min-height:44px}.sub-cad{font-size:var(--t-small-size,13px);flex-direction:column;gap:6px;display:flex}.sub-panel{border:1px dashed var(--border);border-radius:var(--r-card,0);flex-direction:column;gap:10px;padding:12px;display:flex}.sub-save{background:var(--cream);border-style:solid}.sub-cancel{align-self:flex-start}.sub-swap{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px;margin:0;padding:0;list-style:none;display:grid}.sub-swap-btn{font:inherit;border:1px solid var(--border);border-radius:var(--r-card,0);background:var(--white);width:100%;color:var(--black);cursor:pointer;text-align:start;font-size:var(--t-button-size,13px);flex-direction:column;align-items:flex-start;gap:4px;padding:8px;display:flex}.sub-swap-btn:hover{border-color:var(--black)}.sub-swap-btn img{object-fit:cover;width:56px;height:56px}.sub-history summary{cursor:pointer;font-size:var(--t-small-size,13px);color:var(--muted);align-items:center;min-height:40px;display:flex}.sub-history ul{margin:0;padding:0;list-style:none}.sub-history li{border-top:1px solid var(--border);font-size:var(--t-small-size,13px);grid-template-columns:1fr auto auto;align-items:center;gap:12px;padding:8px 0;display:grid}.sub-machines,.sub-mlist{flex-direction:column;gap:10px;display:flex}.sub-mcard{border:1px solid var(--border);border-radius:var(--r-card,0);flex-direction:column;gap:10px;padding:12px;display:flex}.sub-mhead{align-items:center;gap:12px;display:flex}.sub-mhead img{object-fit:cover;border-radius:min(var(--r-card,0px), 12px);width:56px;height:56px}.sub-mtext{min-width:0;font-size:var(--t-body-size,14px);flex-direction:column;flex:1;gap:2px;display:flex}.sub-mform{grid-template-columns:repeat(auto-fit,minmax(140px,1fr));align-items:end;gap:10px;display:grid}.sub-mform label{font-size:var(--t-label-size,13px);flex-direction:column;gap:4px;display:flex}.sub-mform .acc-actions{grid-column:1/-1}.sub-h3{font-family:var(--font-body);font-size:var(--t-body-size,14px);margin-top:8px;font-weight:600}.sub-oils{grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px;display:grid}.sub-oil{border:1px solid var(--border);border-radius:var(--r-card,0);align-items:center;gap:14px;padding:12px;display:flex}.sub-oil-text{min-width:0;font-size:var(--t-small-size,13px);flex-direction:column;gap:3px;display:flex}.sub-bottle{--lvl:50%;border:1.5px solid var(--black);background:var(--white);border-radius:10px 10px 8px 8px;flex-shrink:0;width:30px;height:54px;position:relative;overflow:hidden}.sub-bottle:before{content:"";top:-1px;background:var(--black);border-radius:0 0 2px 2px;width:9px;height:6px;position:absolute;inset-inline-start:9px}.sub-bottle>span{height:var(--lvl);background:var(--gold);animation:1.1s cubic-bezier(.2,.8,.2,1) both sub-fill;position:absolute;inset:auto 0 0}.sub-bottle[data-low=true]>span{background:var(--red)}@keyframes sub-fill{0%{height:0}}.refill-banner{background:var(--cream);border-bottom:1px solid var(--border)}.refill-banner-in{align-items:center;gap:12px;padding-block:10px;display:flex}.refill-drop{border:1.5px solid var(--black);border-radius:50% 50% 45% 45%/60% 60% 40% 40%;flex-shrink:0;width:16px;height:26px;position:relative;overflow:hidden}.refill-drop>span{background:var(--gold);animation:1.2s both sub-fill;position:absolute;inset:auto 0 0}.refill-text{font-size:var(--t-small-size,13px);flex-direction:column;flex:auto;gap:2px;min-width:0;display:flex}.refill-text strong{font-size:var(--t-body-size,14px)}.refill-cta{min-height:40px;padding-inline:16px}.refill-close{font:inherit;font-size:var(--t-small-size,13px);color:var(--muted);cursor:pointer;background:0 0;border:0;min-height:40px;text-decoration:underline}.refill-err{font-size:var(--t-small-size,13px);color:var(--red);flex-basis:100%}@media (prefers-reduced-motion:reduce){.sub-bottle>span,.refill-drop>span{animation:none}}@media (max-width:560px){.sub-card-head{flex-direction:column}.refill-banner-in{flex-wrap:wrap}.refill-text{flex-basis:calc(100% - 30px)}.refill-cta{flex:1}}.sub-pick{border:1px solid var(--border);border-radius:min(var(--r-card,0px), 12px);background:var(--cream);align-items:center;gap:12px;padding:10px 12px;display:flex}.sub-pick img,.sub-ph--sm{object-fit:cover;border-radius:min(var(--r-card,0px), 10px);flex-shrink:0;width:48px;height:48px}.sub-pick>span{min-width:0;font-size:var(--t-body-size,14px);flex-direction:column;gap:2px;display:flex}.sub-pick strong{font-weight:500}
