/* ================= Partner offers (2026-11-04) — public Offers page, partner fiche block, partner offers manager.
   Loaded once per page by <x-offers.styles /> (no build step). Tokens only (--mn-*): dark mode is automatic.
   Vocabulary: .of-card (uniform card, extends .mn-card-u/.mc-tile) · .of-ticket (coupon value) · .of-valid (validity)
   .of-hero (Offers page header) · .of-steps/.of-step (partner step form) · .of-tl (status timeline) · .of-preview ================= */

/* ---------- uniform offer card ---------- */
.of-card{--of-tone:var(--mn-brand);--of-on:var(--mn-on-brand,#fff)}
.of-card--free_item{--of-tone:var(--mn-accent);--of-on:var(--mn-accent-ink,#1b1b1b)}
.of-card--club_benefit{--of-tone:var(--mn-night);--of-on:var(--mn-on-night,#fff)}
.of-card--event{--of-tone:var(--mn-info);--of-on:#fff}
.of-card .mc-cover{position:relative;overflow:hidden}
.of-card .mc-cover::after{content:"";position:absolute;inset:auto 0 0 0;height:45%;background:linear-gradient(0deg,rgba(0,0,0,.28),transparent);pointer-events:none}
.of-card .mc-cover>img:not(.mc-tile__logo){transition:transform .6s var(--mn-ease-out)}
.of-card .mc-meta{display:flex;gap:.5rem;font-size:.82rem;color:var(--mn-mute)}
.of-card .mc-meta .mc-k{font-weight:600;color:var(--mn-ink)}
.of-card .mc-meta>span+span::before{content:"·";margin-right:.5rem;color:var(--mn-line-2)}
.of-card__cond{display:flex;align-items:flex-start;gap:.4rem;margin:.55rem 0 0;font-size:.82rem;line-height:1.45;color:var(--mn-mute);min-height:1.2em}
.of-card__cond>span{display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere}
.of-card__cond svg{flex:none;width:.95rem;height:.95rem;margin-top:.12rem;stroke:currentColor;fill:none;stroke-width:1.8}
.of-card__foot{display:flex;align-items:center;justify-content:space-between;gap:.75rem;margin-top:auto;padding-top:.85rem;border-top:1px solid var(--mn-line)}
.of-card .mc-tile__p+.of-card__cond,.mn-body main .of-card>.mc-tile__p+.of-card__cond{margin-top:.55rem;padding-top:0}
.of-card__cta{display:inline-flex;align-items:center;gap:.3rem;font-size:.85rem;font-weight:600;color:var(--mn-brand-ink);white-space:nowrap}
.of-card__cta i{font-style:normal;transition:transform .25s var(--mn-ease-out)}
.of-card:hover .of-card__cta i{transform:translateX(3px)}
.of-card__more{margin-top:.6rem;font-size:.84rem}
.of-card__more summary{cursor:pointer;color:var(--mn-brand-ink);font-weight:600;list-style:none;display:inline-flex;align-items:center;gap:.3rem;min-height:2rem}
.of-card__more summary::-webkit-details-marker{display:none}
.of-card__more summary::after{content:"";width:.45rem;height:.45rem;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg) translateY(-2px);transition:transform .2s}
.of-card__more[open] summary::after{transform:rotate(-135deg)}
.of-card__more dl{display:grid;gap:.55rem;margin:.5rem 0 0}
.of-card__more dt{font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--mn-mute)}
.of-card__more dd{margin:.1rem 0 0;color:var(--mn-text);white-space:pre-line;overflow-wrap:anywhere}
.of-card--preview{pointer-events:none}

/* ---------- validity ---------- */
.of-valid{display:inline-flex;align-items:center;gap:.35rem;min-width:0;font-size:.8rem;font-weight:500;color:var(--mn-mute);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.of-valid svg{flex:none;width:.95rem;height:.95rem;stroke:currentColor;fill:none;stroke-width:1.8}
.of-valid--soon{color:var(--mn-red,var(--mn-danger))}
.of-valid--soon svg{animation:none}

/* ---------- coupon ticket (CSS-only notches + perforation) ---------- */
.of-ticket{position:absolute;top:.7rem;right:.7rem;z-index:2;display:inline-flex;align-items:center;gap:.45rem;max-width:calc(100% - 1.4rem);padding:.42rem .8rem .42rem .7rem;border-radius:7px;background:var(--of-tone,var(--mn-brand));color:var(--of-on,#fff);font-weight:700;font-size:.86rem;line-height:1.1;letter-spacing:-.01em;box-shadow:0 6px 16px -8px rgba(0,0,0,.45);
  -webkit-mask:radial-gradient(circle at 0 50%,#0000 .36rem,#000 .38rem) left/51% 100% no-repeat,radial-gradient(circle at 100% 50%,#0000 .36rem,#000 .38rem) right/51% 100% no-repeat;
          mask:radial-gradient(circle at 0 50%,#0000 .36rem,#000 .38rem) left/51% 100% no-repeat,radial-gradient(circle at 100% 50%,#0000 .36rem,#000 .38rem) right/51% 100% no-repeat;
  transform-origin:85% 50%}
.of-ticket svg{flex:none;width:1rem;height:1rem;stroke:currentColor;fill:none;stroke-width:1.9}
.of-ticket__v{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.of-ticket::before{content:"";align-self:stretch;margin:-.1rem 0;border-left:1.5px dashed color-mix(in srgb,currentColor 55%,transparent);order:1}
.of-ticket svg{order:0}.of-ticket__v{order:2}
.of-ticket--lg{position:static;font-size:1.05rem;padding:.6rem 1.05rem .6rem .9rem}

/* ---------- grid + reveal (works on the public layout too, where viz.css is not loaded) ---------- */
.of-grid{margin-top:.5rem}
@media(prefers-reduced-motion:no-preference){
  .vz-js .of-grid[data-vz-reveal]:not(.is-in)>*{opacity:0;transform:translateY(16px)}
  .of-grid[data-vz-reveal]>*{transition:opacity .7s var(--mn-ease-out),transform .7s var(--mn-ease-out);transition-delay:calc(var(--vz-i,0)*70ms)}
  .of-grid.is-in .of-ticket,.of-preview .of-ticket{animation:of-swing 1.1s var(--mn-ease-out) both;animation-delay:calc(var(--vz-i,0)*70ms + .25s)}
  .of-card:hover .of-ticket{transform:rotate(-4deg) translateY(-2px);transition:transform .35s var(--mn-ease-out)}
  .of-card:hover .mc-cover>img:not(.mc-tile__logo){transform:scale(1.04)}
  .of-hero__tickets span{animation:of-float 9s ease-in-out infinite}
  .of-hero__tickets span:nth-child(2){animation-delay:-3s;animation-duration:11s}
  .of-hero__tickets span:nth-child(3){animation-delay:-6s;animation-duration:10s}
  .of-tl__s--current .of-tl__dot{animation:of-pulse 2.4s ease-in-out infinite}
  .of-empty .mn-empty__img{animation:of-float 8s ease-in-out infinite}
}
@keyframes of-swing{0%{transform:rotate(9deg) translateY(-6px);opacity:0}55%{transform:rotate(-4deg);opacity:1}100%{transform:rotate(0)}}
@keyframes of-float{0%,100%{transform:translateY(0) rotate(var(--r,0deg))}50%{transform:translateY(-8px) rotate(calc(var(--r,0deg) + 2deg))}}
@keyframes of-pulse{0%,100%{box-shadow:0 0 0 0 color-mix(in srgb,var(--mn-gold) 45%,transparent)}50%{box-shadow:0 0 0 6px color-mix(in srgb,var(--mn-gold) 0%,transparent)}}

/* ---------- Offers page hero ---------- */
.of-hero .mn-ph__img img{width:100%;height:100%;object-fit:cover}
.of-hero__stats{display:flex;flex-wrap:wrap;gap:.5rem 1.5rem;margin:0;padding:0;list-style:none}
.of-hero__stats li{display:flex;align-items:baseline;gap:.4rem;font-size:.9rem;color:var(--mn-mute)}
.of-hero__stats b{font-size:1.35rem;font-weight:700;color:var(--mn-ink);font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.of-hero__tickets{display:none}
@media(min-width:1024px){
  .of-hero__tickets{display:block;position:absolute;right:clamp(2rem,6vw,6rem);bottom:1.75rem;z-index:1;width:15rem;height:9rem;pointer-events:none}
  .of-hero__tickets span{position:absolute;display:inline-flex;align-items:center;gap:.45rem;padding:.5rem .95rem;border-radius:8px;font-weight:700;font-size:.95rem;box-shadow:0 10px 24px -12px rgba(0,0,0,.45);
    -webkit-mask:radial-gradient(circle at 0 50%,#0000 .38rem,#000 .4rem) left/51% 100% no-repeat,radial-gradient(circle at 100% 50%,#0000 .38rem,#000 .4rem) right/51% 100% no-repeat;
            mask:radial-gradient(circle at 0 50%,#0000 .38rem,#000 .4rem) left/51% 100% no-repeat,radial-gradient(circle at 100% 50%,#0000 .38rem,#000 .4rem) right/51% 100% no-repeat;transform:rotate(var(--r,0deg))}
  .of-hero__tickets span:nth-child(1){--r:-6deg;right:0;top:0;background:var(--mn-brand);color:var(--mn-on-brand,#fff)}
  .of-hero__tickets span:nth-child(2){--r:5deg;right:4.5rem;top:3.1rem;background:var(--mn-accent);color:var(--mn-accent-ink,#1b1b1b)}
  .of-hero__tickets span:nth-child(3){--r:-2deg;right:1.2rem;top:6rem;background:var(--mn-night);color:var(--mn-on-night,#fff)}
}

/* ---------- partner fiche block ---------- */
.of-fiche .mc-tiles{grid-template-columns:repeat(2,minmax(0,1fr));gap:2rem 1.5rem}
@media(max-width:639.98px){.of-fiche .mc-tiles{grid-template-columns:minmax(0,1fr)}}
.of-fiche__note{margin:.35rem 0 1.1rem;font-size:.88rem;color:var(--mn-mute)}

/* ---------- partner manager: step form ---------- */
.of-steps{display:flex;gap:.35rem;margin:0 0 1.5rem;padding:0;list-style:none;overflow-x:auto;scrollbar-width:none}
.of-steps::-webkit-scrollbar{display:none}
.of-steps li{flex:1 1 0;min-width:6.5rem}
.of-steps button{display:grid;gap:.45rem;width:100%;padding:0 0 .2rem;border:0;background:none;color:var(--mn-mute);font:inherit;font-size:.82rem;font-weight:600;text-align:left;cursor:pointer;min-height:44px}
.of-steps button::before{content:"";height:3px;border-radius:3px;background:var(--mn-line);transition:background-color .3s}
.of-steps button[aria-current="step"]{color:var(--mn-ink)}
.of-steps button[aria-current="step"]::before,.of-steps button.is-done::before{background:var(--mn-brand)}
.of-steps button.is-done{color:var(--mn-brand-ink)}
.of-steps b{font-variant-numeric:tabular-nums;margin-right:.3rem;color:inherit}
.of-layout{display:grid;gap:2rem}
@media(min-width:1100px){.of-layout{grid-template-columns:minmax(0,1fr) 20rem;gap:3rem;align-items:start}.of-preview{position:sticky;top:5.5rem}}
.of-step{display:grid;gap:1.25rem}
.of-step__h{display:grid;gap:.25rem}
.of-step__h p{margin:0;color:var(--mn-mute);font-size:.92rem}
.of-step__nav{display:flex;flex-wrap:wrap;gap:.6rem;justify-content:space-between;padding-top:.5rem}
.of-types{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem}
@media(min-width:640px){.of-types{grid-template-columns:repeat(4,minmax(0,1fr))}}
.of-type{position:relative;display:grid;gap:.35rem;padding:.85rem .9rem;border:1px solid var(--mn-line);border-radius:var(--mn-r);cursor:pointer;min-height:44px;transition:border-color .2s,background-color .2s}
.of-type input{position:absolute;opacity:0;pointer-events:none}
.of-type svg{width:1.3rem;height:1.3rem;stroke:var(--mn-brand-ink);fill:none;stroke-width:1.7}
.of-type b{font-size:.9rem}
.of-type small{font-size:.76rem;color:var(--mn-mute);line-height:1.35}
.of-type:has(input:checked){border-color:var(--mn-brand);background:color-mix(in srgb,var(--mn-brand) 7%,transparent);box-shadow:inset 0 0 0 1px var(--mn-brand)}
.of-type:has(input:focus-visible){outline:2px solid var(--mn-brand);outline-offset:2px}
.of-preview{display:grid;gap:.85rem}
.of-preview__k{display:flex;align-items:center;justify-content:space-between;gap:.5rem;font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--mn-mute)}
.of-preview .mn-card-u{padding:0}
.of-langs{display:flex;flex-wrap:wrap;gap:.35rem}
.of-editing{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.75rem;margin:0 0 1.25rem;padding:.75rem 1rem;border:1px solid color-mix(in srgb,var(--mn-gold) 45%,transparent);border-radius:var(--mn-r);background:color-mix(in srgb,var(--mn-gold) 8%,transparent);font-size:.9rem}

/* ---------- partner manager: list + status timeline ---------- */
.of-list{display:grid;gap:0;margin:1rem 0 0;padding:0;list-style:none}
.of-row{display:grid;grid-template-columns:4.5rem minmax(0,1fr);gap:.4rem 1rem;padding:1.1rem 0;border-top:1px solid var(--mn-line)}
.of-row:first-child{border-top:0}
.of-row__img{grid-row:span 3;width:4.5rem;aspect-ratio:1;border-radius:12px;object-fit:cover;background:var(--mn-soft)}
.of-row__h{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem .75rem;min-width:0}
.of-row__t{margin:0;font-weight:600;color:var(--mn-ink);overflow-wrap:anywhere}
.of-row__s{margin:0;font-size:.84rem;color:var(--mn-mute)}
.of-row__acts{display:flex;flex-wrap:wrap;gap:.4rem;grid-column:2}
.of-row__acts .mn-btn{min-height:2.5rem;padding:.45rem .9rem;font-size:.85rem}
.of-row__why{grid-column:2;margin:0;padding:.55rem .8rem;border-left:3px solid var(--mn-red,var(--mn-danger));background:color-mix(in srgb,var(--mn-red,var(--mn-danger)) 6%,transparent);border-radius:0 8px 8px 0;font-size:.86rem}
@media(min-width:768px){.of-row{grid-template-columns:5rem minmax(0,1fr) auto}.of-row__img{width:5rem}.of-row__acts{grid-column:3;grid-row:1 / span 2;align-self:center;justify-content:flex-end}.of-row__why{grid-column:2 / span 2}}
.of-tl{display:flex;align-items:center;gap:0;margin:.3rem 0 0;padding:0;list-style:none;font-size:.74rem;color:var(--mn-mute);grid-column:2;min-width:0;overflow-x:auto;scrollbar-width:none}
.of-tl::-webkit-scrollbar{display:none}
.of-tl__s{display:flex;align-items:center;gap:.35rem;white-space:nowrap}
.of-tl__s+.of-tl__s::before{content:"";width:1.4rem;height:1.5px;margin:0 .45rem;background:var(--mn-line-2)}
.of-tl__dot{width:.6rem;height:.6rem;border-radius:50%;border:1.5px solid var(--mn-line-2);background:var(--mn-bg)}
.of-tl__s--done{color:var(--mn-ink)}
.of-tl__s--done .of-tl__dot{background:var(--mn-brand);border-color:var(--mn-brand)}
.of-tl__s--done+.of-tl__s::before{background:var(--mn-brand)}
.of-tl__s--current{color:var(--mn-ink);font-weight:600}
.of-tl__s--current .of-tl__dot{border-color:var(--mn-gold);background:var(--mn-gold)}
.of-tl__s--bad{color:var(--mn-red,var(--mn-danger));font-weight:600}
.of-tl__s--bad .of-tl__dot{border-color:currentColor;background:currentColor}
.of-tl__s--ok{color:var(--mn-ok);font-weight:600}
.of-tl__s--ok .of-tl__dot{border-color:var(--mn-ok);background:var(--mn-ok)}

@media(prefers-reduced-motion:reduce){.of-card .mc-cover>img,.of-ticket,.of-card__cta i{transition:none!important;animation:none!important}}