/* Quiet offer cards: native wordmarks/checks, shared frames, readable prices. */
#mockup :is(.pass-subscriptions,.pass-offer-actions){--offer-face:#e3d3ff;--offer-edge:#a599b7;--offer-ink:#352844;--offer-rim:#d6c3f3;--offer-gold-face:#ffe596;--offer-gold-edge:#bba369;--offer-gold-ink:#805d21}
html[data-ui-theme=dark] #mockup :is(.pass-subscriptions,.pass-offer-actions){--offer-face:#b88af0;--offer-edge:#5e407d;--offer-ink:#261b35;--offer-rim:#d4b5f5;--offer-gold-face:#f4cf65;--offer-gold-edge:#756037;--offer-gold-ink:#302611}
.pass-subscriptions[data-offers-proposal] .pass-offers-scroll{padding-top:4px}
.offer-billing{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:2px 3px 30px}
html body .offer-billing button.style-button{position:relative;height:40px;min-height:40px;min-width:0;width:100%;padding:6px 12px;font:22px/1 PassTiny,sans-serif;--action-face:var(--offer-face);--action-edge:var(--offer-edge);--action-ink:var(--offer-ink)}
html body .offer-billing button.style-button[aria-pressed=true]{--action-face:var(--frame-disabled);--action-edge:var(--frame-disabled-line);--action-ink:var(--frame-disabled-ink)}
/* Subscription actions follow the page theme; the separate Pass stays night blue. */
html body .pass-offer-actions button.style-button{--action-face:var(--offer-face);--action-edge:var(--offer-edge);--action-ink:var(--offer-ink);--reward-action-outline:var(--offer-rim);--reward-action-disabled-outline:var(--frame-disabled-line)}
html body .pass-offer-actions button.style-button.pass-star-button{--action-face:var(--offer-gold-face);--action-edge:var(--offer-gold-edge);--action-ink:var(--offer-gold-ink)}
html body .pass-offer-actions button.style-button:disabled{background:var(--frame-disabled);border-color:var(--frame-disabled-line);color:var(--frame-disabled-ink)}
html:is([data-ui-theme=light],[data-ui-theme=pastel]) body .pass-offer-actions button.pass-star-button:not(:disabled)::after{background-color:var(--offer-gold-edge)}
/* A single track prevents a dissolve or a departing overlay. Its padded viewport
   leaves the existing card dimensions and the protruding recommendation intact. */
.offer-cards-window{overflow:hidden;margin:-16px -4px 0}
.offer-cards-track{display:flex;align-items:flex-start;transform:translateX(0);transition:transform 360ms cubic-bezier(.22,.65,.25,1)}
.offer-cards-track[data-billing=annual]{transform:translateX(-100%)}
.offer-cards-track>.pass-native-offers{flex:0 0 100%;min-width:0;padding:16px 4px 0}
.offer-cards-track>.pass-native-offers[aria-hidden=true]{pointer-events:none}
/* Stickers sit outside layout: prices and benefits retain their monthly positions. */
#mockup .offer-sticker{position:absolute;z-index:2;display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;min-height:24px;padding:5px 9px;--rounded-face:var(--offer-gold-face);--rounded-edge:var(--offer-gold-edge);color:var(--offer-gold-ink);font:700 12px/1.2 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;white-space:nowrap;text-transform:none;pointer-events:none}
#mockup .offer-billing-saving{right:-6px;bottom:-12px;transform:rotate(4deg);font-size:11px;--rounded-face:var(--frame-mint);--rounded-edge:var(--frame-mint-line);color:var(--frame-mint-ink)}
#mockup [data-offer-billing=annual][aria-pressed=true] .offer-billing-saving{--rounded-face:var(--frame-disabled);--rounded-edge:var(--frame-disabled-line);color:var(--frame-disabled-ink)}
.pass-native-offers .offer-proposal{padding:16px;margin-bottom:12px}
/* Native round frame, with the same moving highlights as the University's S.
   Only the selected offer shines; the masked centre preserves its paper colour. */
.pass-native-offers .offer-proposal{position:relative}
#mockup .offer-recommended{position:absolute;top:-14px;left:50%;transform:translateX(-50%);z-index:1;display:inline-flex;align-items:center;min-height:28px;padding:5px 12px;box-sizing:border-box;--rounded-face:var(--offer-gold-face);--rounded-edge:var(--offer-gold-edge);color:var(--offer-gold-ink);font:16px/1 PassTiny,sans-serif;text-transform:uppercase;white-space:nowrap}
.pass-native-offers .offer-proposal[aria-checked=true]::after{
 content:'';position:absolute;inset:-1px;padding:var(--trial-stroke,3px);
 border-radius:inherit;pointer-events:none;
 background:linear-gradient(120deg,transparent 0% 28%,#ffe596 35% 42%,#cbf2df 45% 48%,#fff6cc 51% 56%,#d6c3f3 59% 62%,#ffd46c 67% 73%,transparent 80% 100%) var(--rounded-edge);
 background-size:250% 250%;animation:pass-star-border 3600ms steps(24,end) infinite alternate;
 -webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);
 mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);
 -webkit-mask-composite:xor;mask-composite:exclude;
}
@media(prefers-reduced-motion:reduce){
 .pass-native-offers .offer-proposal[aria-checked=true]::after{animation:none;background-position:50% 50%}
 .offer-cards-track{transition:none}
}
.offer-proposal-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:1px 0 16px}
.pass-native-offers .offer-proposal h3{flex:none;margin:0;line-height:1}
.pass-native-offers .offer-proposal .subscription-wordmark{display:block;height:26px;width:auto;max-width:none}
.offer-proposal-price{position:relative;display:flex;flex-direction:column;align-items:flex-end;flex:none;margin:0;white-space:nowrap;text-transform:none}
.offer-proposal-price strong{font:700 24px/1.1 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-variant-numeric:lining-nums tabular-nums;letter-spacing:-.02em;color:var(--pass-ink)}
.offer-proposal-price>span{font:12px/1.25 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--pass-muted);margin-top:3px}
#mockup .offer-proposal-discount{top:calc(100% + 4px);right:0;margin:0;transform:none;--rounded-face:var(--offer-face);--rounded-edge:var(--offer-edge);color:var(--offer-ink)}
.offer-proposal-benefits{list-style:none;display:grid;gap:12px;margin:0;padding:0}
.offer-proposal-benefits>li{display:flex;align-items:center;gap:8px;font:14px/1.3 PixelUI,monospace;color:var(--pass-ink)}
.offer-proposal-benefits>li>span{white-space:nowrap}
.offer-check{display:block;flex:none;width:14px;height:11px;object-fit:contain;image-rendering:pixelated}
@media(max-width:360px){
 .pass-subscriptions[data-offers-proposal] .pass-offers-scroll{padding-inline:12px}
 .pass-native-offers .offer-proposal{padding:14px}
 .offer-proposal-heading{display:grid;grid-template-columns:1fr;gap:10px 8px}
 .offer-proposal-price{flex-direction:row;align-items:baseline;justify-content:flex-end;gap:5px}
 .offer-proposal-price strong{font-size:22px}
 .offer-proposal-benefits>li{font-size:12px;gap:6px}
}