#bond .noi-canonical-page:not([data-noi-view="resonance"])>.us-progression-next,
#bond .noi-canonical-page:not([data-noi-view="resonance"])>.us-progression-rewards-section{display:none!important}

/* US Progression — Sintonia, Ritmo, and the Rewards V2 collection.
   Every cosmetic is ONE rule set shared by the real surface and its preview
   tile (selector pairs below), so what you see in the collection is exactly
   what lands in the app. */

.us-progression-rhythm{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:12px;margin-top:13px;padding:11px 12px;border-radius:17px;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.035)}
.us-progression-rhythm-copy{display:flex;flex-direction:column;gap:2px;min-width:0}
.us-progression-rhythm-copy small{font-size:10px;font-weight:800;letter-spacing:.08em;color:var(--us-color-accent-ink)}
.us-progression-rhythm-copy span{font-size:11px;line-height:1.3;color:var(--us-color-text-3)}
.us-progression-rhythm strong{font:500 20px/1 var(--us-font-editorial);white-space:nowrap;color:var(--us-color-text)}

.us-progression-next,.us-progression-rewards-section{flex:0 0 auto;border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.035);border-radius:24px}
.us-progression-next{display:flex;align-items:center;gap:12px;padding:12px 14px}
.us-progression-next-preview{position:relative;flex:0 0 52px;width:52px;height:52px;border-radius:14px;overflow:hidden;border:1px solid rgba(255,255,255,.09);filter:saturate(.75);opacity:.86}
.us-progression-next-copy{display:flex;flex-direction:column;gap:3px;min-width:0}
.us-progression-next small,.us-progression-rewards-head small{font-size:10px;font-weight:800;letter-spacing:.08em;color:var(--us-color-accent-ink)}
.us-progression-next b{font:500 20px/1.15 var(--us-font-editorial);color:var(--us-color-text)}
.us-progression-next span{font-size:11.5px;line-height:1.35;color:var(--us-color-text-2)}

.us-progression-rewards-section{padding:14px 12px 10px 14px;overflow:hidden}
.us-progression-rewards-head{display:flex;align-items:end;justify-content:space-between;gap:12px;margin:0 2px 10px 0}
.us-progression-rewards-head h3{margin:2px 0 0;font:500 20px/1.1 var(--us-font-editorial)}
.us-progression-rewards-meta{display:flex;flex-direction:column;align-items:flex-end;gap:2px;font-size:10px;line-height:1.2;color:var(--us-color-text-3);text-align:right}
.us-progression-rewards-meta b{font-size:12px;font-weight:700;color:var(--us-color-text-2);font-variant-numeric:tabular-nums}
.us-progression-rewards{display:flex;flex-direction:column;gap:14px;max-height:min(440px,56dvh);overflow-y:auto;overscroll-behavior:contain;scrollbar-gutter:stable;padding:0 2px 4px 0;-webkit-overflow-scrolling:touch;
  mask-image:linear-gradient(180deg,#000 calc(100% - 18px),transparent);-webkit-mask-image:linear-gradient(180deg,#000 calc(100% - 18px),transparent)}
.us-reward-group-head{display:flex;align-items:baseline;gap:7px;margin:0 0 7px;min-width:0}
.us-reward-group-head b{font-size:12px;font-weight:750;letter-spacing:.01em;color:var(--us-color-text)}
.us-reward-group-head span{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:10.5px;color:var(--us-color-text-3)}
.us-reward-group-head em{font-style:normal;font-size:10px;font-weight:700;color:var(--us-color-text-3);font-variant-numeric:tabular-nums}
.us-reward-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.us-progression-reward{width:100%;min-width:0;display:flex;flex-direction:column;gap:6px;padding:5px 5px 7px;text-align:left;border-radius:16px;border:1px solid rgba(255,255,255,.06);background:rgba(255,255,255,.025);color:var(--us-color-text);transition:transform var(--us-motion-press,120ms) var(--us-ease-standard,ease),border-color 160ms ease,background-color 160ms ease}
.us-progression-reward.is-unlocked:not(:disabled):active{transform:scale(.97);background:rgba(255,255,255,.05)}
.us-progression-reward.is-equipped{border-color:color-mix(in srgb,var(--us-color-accent-strong) 70%,transparent);background:color-mix(in srgb,var(--us-color-accent-soft) 70%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--us-color-accent-strong) 30%,transparent)}
.us-progression-reward:focus-visible{outline:2px solid var(--us-color-accent-strong);outline-offset:2px}
.us-progression-reward-preview{position:relative;display:block;width:100%;aspect-ratio:1;border-radius:12px;overflow:hidden;background:rgba(255,255,255,.03);box-shadow:inset 0 0 0 1px rgba(255,255,255,.06);isolation:isolate}
.us-progression-reward.is-locked .us-progression-reward-preview>*{filter:saturate(.5) brightness(.72);opacity:.72}
.us-progression-reward-copy{display:flex;flex-direction:column;gap:1px;min-width:0;padding:0 3px}
.us-progression-reward-copy b{font-size:11.5px;font-weight:700;line-height:1.2;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow-wrap:anywhere}
.us-progression-reward-copy small{font-size:9.5px;line-height:1.2;color:var(--us-color-text-3);white-space:nowrap}
.us-progression-reward.is-equipped .us-progression-reward-copy small{color:var(--us-color-accent-ink);font-weight:700}
.us-progression-reward.is-locked .us-progression-reward-copy b{color:var(--us-color-text-2)}
@media(min-width:560px){.us-reward-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}

/* ---------- preview primitives ---------- */
.us-cos-stage,.us-cos-theme,.us-cos-accent{position:absolute;inset:0;display:block}

.us-cos-stage{display:grid;place-items:center;background:radial-gradient(110% 80% at 50% 0%,rgba(255,255,255,.06),transparent 64%),#141018}

/* ---------- FRAMES · #homeHero (full-bleed photo) + preview photo ---------- */
#homeHero{--cos-u:1px}

/* Controluce — warm hairline with a low sun bleeding in. */

/* Aurora — thin-film iridescence, never a thick gradient. */

/* Istantanea — the photo becomes a print: ivory matting, heavier chin. */

/* Negativo — vertical 35mm strip: film base, sprocket holes, edge code. */

/* Cromo — a polished bevel, one pixel of light. */

/* Album di carta — two strips of paper tape over the top corners. */

/* styles.css hides .home-hero-only:before with !important; equipped frames re-enable only their own layer. */

/* ---------- STICKERS · Oggi + newest Ricordi card + preview ---------- */

/* ours — a die-cut vinyl word, lowercase, ink red on cream. */

/* Ingresso per due — a torn manila ticket stub with a perforation. */

/* Francobollo — perforated stamp carrying the approved US symbol. */

/* ---------- BADGES · between the two of you in Noi + preview ---------- */
.noi-couple-link{position:relative}

/* Day One — enamel pin: glossy plum enamel, gold rim. */

/* Still Here — embroidered felt patch with running stitch. */

/* Chaos Together — risograph print, pink and blue out of register. */

/* Us vs Monday — rubber stamp, uneven red ink. */

/* ---------- RINGS · Noi portraits + preview ---------- */

/* Alone — two hairlines with air between them. */

/* Orbita — one point of light circling each of you, out of phase. */

/* Filo d'oro — burnished gold rings, and a gold thread between you. */

/* ---------- THEMES · atmosphere (surfaces, glow, shell aurora, default ink) ---------- */
:root[data-us-theme="rose"],.us-cos-theme[data-theme="rose"]{--us-color-bg:#0e050a;--us-color-surface:#1a0d14;--us-color-surface-2:#21111a;--us-color-elevated:#2a1621;--us-color-sheet:#1a0c13;--us-theme-glow-a:rgba(255,94,146,.2);--us-theme-glow-b:rgba(255,150,120,.1);--us-aurora-a:rgba(255,94,146,.8);--us-aurora-b:rgba(255,154,185,.7);--us-aurora-c:rgba(201,133,255,.6);
  --us-color-rose:#ff5e92;--us-color-rose-2:#ff9ab9;--us-color-violet:#c985ff;--us-color-accent-ink:#f0bfd8;--us-color-accent-soft:rgba(255,94,146,.14);--us-color-accent-line:rgba(255,154,185,.28);--us-color-accent-strong:#ef9bc1;--us-accent-gradient:linear-gradient(135deg,#e8407a 0%,#d9467f 52%,#9a5bd6 128%)}
:root[data-us-theme="midnight"],.us-cos-theme[data-theme="midnight"]{--us-color-bg:#05060f;--us-color-surface:#0d0f1d;--us-color-surface-2:#121528;--us-color-elevated:#181b33;--us-color-sheet:#0d0f1e;--us-theme-glow-a:rgba(119,141,255,.17);--us-theme-glow-b:rgba(166,108,255,.12);--us-aurora-a:rgba(119,141,255,.75);--us-aurora-b:rgba(166,108,255,.7);--us-aurora-c:rgba(93,167,255,.6);
  --us-color-rose:#bd79ff;--us-color-rose-2:#d3a0ff;--us-color-violet:#778dff;--us-color-accent-ink:#c9cfff;--us-color-accent-soft:rgba(119,141,255,.15);--us-color-accent-line:rgba(157,169,255,.28);--us-color-accent-strong:#9da9ff;--us-accent-gradient:linear-gradient(135deg,#8f55f0 0%,#6670e6 58%,#4a7fd6 125%)}
:root[data-us-theme="film"],.us-cos-theme[data-theme="film"]{--us-color-bg:#0d0906;--us-color-surface:#17110c;--us-color-surface-2:#1d1610;--us-color-elevated:#251c14;--us-color-sheet:#16100b;--us-theme-glow-a:rgba(240,166,90,.17);--us-theme-glow-b:rgba(255,214,150,.08);--us-aurora-a:rgba(240,166,90,.75);--us-aurora-b:rgba(214,120,74,.65);--us-aurora-c:rgba(255,214,150,.5);
  --us-color-rose:#f0a65a;--us-color-rose-2:#f6c48a;--us-color-violet:#d9774a;--us-color-accent-ink:#f3c99c;--us-color-accent-soft:rgba(240,166,90,.14);--us-color-accent-line:rgba(243,201,156,.28);--us-color-accent-strong:#eab27a;--us-accent-gradient:linear-gradient(135deg,#f3b46e 0%,#e48d55 55%,#c96a45 120%);--us-color-text-on-accent:#21130a}
:root[data-us-theme="blue_hour"],.us-cos-theme[data-theme="blue_hour"]{--us-color-bg:#050811;--us-color-surface:#0c121e;--us-color-surface-2:#111827;--us-color-elevated:#172033;--us-color-sheet:#0c1220;--us-theme-glow-a:rgba(91,124,240,.18);--us-theme-glow-b:rgba(255,170,140,.08);--us-aurora-a:rgba(91,124,240,.75);--us-aurora-b:rgba(140,170,255,.6);--us-aurora-c:rgba(255,170,140,.38);
  --us-color-rose:#6f8cff;--us-color-rose-2:#a3b6ff;--us-color-violet:#4b63d8;--us-color-accent-ink:#c3cfff;--us-color-accent-soft:rgba(111,140,255,.15);--us-color-accent-line:rgba(163,182,255,.28);--us-color-accent-strong:#9fb2ff;--us-accent-gradient:linear-gradient(135deg,#5b7cf0 0%,#4a66de 60%,#3c55c4 120%)}
:root[data-us-theme="graphite"],.us-cos-theme[data-theme="graphite"]{--us-color-bg:#09090a;--us-color-surface:#121214;--us-color-surface-2:#17171a;--us-color-elevated:#1e1e22;--us-color-sheet:#121214;--us-theme-glow-a:rgba(255,255,255,.06);--us-theme-glow-b:rgba(255,255,255,.03);--us-aurora-a:rgba(255,255,255,.34);--us-aurora-b:rgba(206,206,214,.28);--us-aurora-c:rgba(160,160,170,.28);
  --us-color-rose:#e9e9ee;--us-color-rose-2:#ffffff;--us-color-violet:#a9abb4;--us-color-accent-ink:#e2e3e8;--us-color-accent-soft:rgba(255,255,255,.09);--us-color-accent-line:rgba(255,255,255,.22);--us-color-accent-strong:#d4d5db;--us-accent-gradient:linear-gradient(135deg,#f4f4f6 0%,#d3d4da 55%,#a9abb4 120%);--us-color-text-on-accent:#111114}
:root[data-us-theme],:root[data-us-theme] body{background:radial-gradient(circle at 20% -10%,var(--us-theme-glow-a),transparent 35%),radial-gradient(circle at 90% 10%,var(--us-theme-glow-b),transparent 28%),var(--us-color-bg)}
:root[data-us-theme] .us-aurora::before{background:radial-gradient(36% 86% at 20% 50%,var(--us-aurora-a),transparent 74%),radial-gradient(34% 86% at 52% 44%,var(--us-aurora-b),transparent 74%),radial-gradient(32% 86% at 82% 56%,var(--us-aurora-c),transparent 74%)}

/* ---------- ACCENTS · interactive ink only (declared after themes: accent wins) ---------- */
:root[data-us-accent="cherry"],.us-cos-accent[data-accent="cherry"]{--us-color-rose:#e8364f;--us-color-rose-2:#ff7487;--us-color-violet:#b8295c;--us-color-accent-ink:#ffb4bf;--us-color-accent-soft:rgba(232,54,79,.15);--us-color-accent-line:rgba(255,116,135,.3);--us-color-accent-strong:#ff8a9a;--us-accent-gradient:linear-gradient(135deg,#d92745 0%,#e8364f 50%,#b8295c 125%);--us-accent-shadow:0 8px 22px rgba(217,39,69,.18);--us-color-text-on-accent:#fff}
:root[data-us-accent="champagne"],.us-cos-accent[data-accent="champagne"]{--us-color-rose:#e2c38a;--us-color-rose-2:#f2dcae;--us-color-violet:#b99258;--us-color-accent-ink:#efd9ad;--us-color-accent-soft:rgba(226,195,138,.13);--us-color-accent-line:rgba(239,217,173,.28);--us-color-accent-strong:#e5c893;--us-accent-gradient:linear-gradient(135deg,#f1dcac 0%,#dcbc80 55%,#b99258 125%);--us-accent-shadow:0 8px 22px rgba(220,188,128,.16);--us-color-text-on-accent:#241a0c}
:root[data-us-accent="ice"],.us-cos-accent[data-accent="ice"]{--us-color-rose:#9fd2ff;--us-color-rose-2:#cde8ff;--us-color-violet:#79a9e6;--us-color-accent-ink:#c9e5ff;--us-color-accent-soft:rgba(159,210,255,.13);--us-color-accent-line:rgba(201,229,255,.28);--us-color-accent-strong:#a9d6ff;--us-accent-gradient:linear-gradient(135deg,#d3ecff 0%,#a5d3fb 55%,#79a9e6 125%);--us-accent-shadow:0 8px 22px rgba(121,169,230,.16);--us-color-text-on-accent:#0b1826}
:root[data-us-theme] .us-nav-premium button.active .us-nav-icon-on,:root[data-us-accent] .us-nav-premium button.active .us-nav-icon-on{color:var(--us-color-accent-strong)}
:root[data-us-theme] .us-nav-indicator,:root[data-us-accent] .us-nav-indicator{background:linear-gradient(150deg,color-mix(in srgb,var(--us-color-rose) 22%,transparent),color-mix(in srgb,var(--us-color-violet) 17%,transparent))}

/* theme + accent preview tiles */
.us-cos-theme{overflow:hidden;background:radial-gradient(90% 60% at 20% -10%,var(--us-theme-glow-a),transparent 62%),var(--us-color-bg)}
.us-cos-theme i{position:absolute;display:block}
.us-cos-theme-bar{left:14%;right:14%;top:10%;height:13%;border-radius:999px;border:1px solid rgba(255,255,255,.12);background:radial-gradient(40% 120% at 22% 50%,var(--us-aurora-a),transparent 75%),radial-gradient(40% 120% at 55% 50%,var(--us-aurora-b),transparent 75%),radial-gradient(40% 120% at 85% 50%,var(--us-aurora-c),transparent 75%),rgba(255,255,255,.04);opacity:.85}
.us-cos-theme-card{left:10%;right:10%;top:31%;height:35%;border-radius:9px;border:1px solid rgba(255,255,255,.07);background:linear-gradient(180deg,var(--us-color-surface-2),var(--us-color-surface))}
.us-cos-theme-card::before{content:"";position:absolute;left:12%;top:24%;width:52%;height:12%;border-radius:4px;background:var(--us-color-accent-ink);opacity:.8}
.us-cos-theme-card::after{content:"";position:absolute;left:12%;top:52%;width:70%;height:9%;border-radius:4px;background:rgba(255,255,255,.18)}
.us-cos-theme-pill{left:10%;width:48%;bottom:12%;height:13%;border-radius:999px;background:var(--us-accent-gradient)}
.us-cos-accent{background:radial-gradient(100% 70% at 50% 0%,rgba(255,255,255,.05),transparent 62%),#141018}
.us-cos-accent i{position:absolute;display:block}
.us-cos-accent-track{left:12%;right:12%;top:22%;height:7%;border-radius:999px;background:rgba(255,255,255,.1);overflow:hidden}
.us-cos-accent-track i{left:0;top:0;bottom:0;width:66%;border-radius:inherit;background:var(--us-accent-gradient)}
.us-cos-accent-pill{left:12%;top:41%;width:52%;height:17%;border-radius:999px;background:var(--us-accent-gradient);box-shadow:var(--us-accent-shadow)}
.us-cos-accent-pill::after{content:"";position:absolute;left:20%;top:42%;width:60%;height:16%;border-radius:2px;background:var(--us-color-text-on-accent);opacity:.85}
.us-cos-accent-nav{left:12%;right:12%;bottom:12%;height:17%;display:flex!important;align-items:center;justify-content:space-around;border-radius:999px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.07)}
.us-cos-accent-nav i{position:static;width:12%;aspect-ratio:1;border-radius:50%;background:rgba(220,209,222,.35)}
.us-cos-accent-nav i:nth-child(2){background:var(--us-color-accent-strong);box-shadow:0 0 0 3px color-mix(in srgb,var(--us-color-rose) 20%,transparent)}

/* ---------- EFFECTS · the US symbol (top bar) + preview ---------- */
.us-cos-logo{position:relative;display:block;width:60px;height:60px;overflow:hidden}
.us-cos-logo img{position:absolute;inset:0;width:100%;height:100%;display:block}
:root[data-us-effect="pulse"] .us-top-brand-art{animation:us-progression-pulse 3.2s ease-in-out infinite}
.us-cos-logo[data-effect="pulse"] img{filter:drop-shadow(0 0 7px rgba(190,155,255,.42));transform:scale(1.035)}
/* Costellazione — three tiny stars that light up one after another. */
:root[data-us-effect="constellation"] .us-top-brand::before,:root[data-us-effect="constellation"] .us-top-brand::after,
.us-cos-logo[data-effect="constellation"]::before,.us-cos-logo[data-effect="constellation"]::after{content:"";position:absolute;z-index:2;left:50%;top:50%;width:0;height:0;pointer-events:none}
:root[data-us-effect="constellation"] .us-top-brand::before,.us-cos-logo[data-effect="constellation"]::before{box-shadow:-19px -11px 0 1px #fff,-19px -11px 4px 1.5px rgba(255,214,246,.4),17px 12px 0 .8px rgba(236,226,255,.92),17px 12px 4px 1.5px rgba(214,200,255,.35);animation:us-cos-twinkle 5.2s ease-in-out infinite}
:root[data-us-effect="constellation"] .us-top-brand::after,.us-cos-logo[data-effect="constellation"]::after{box-shadow:19px -9px 0 .9px rgba(255,240,250,.95),19px -9px 4px 1.5px rgba(255,200,230,.35);animation:us-cos-twinkle 5.2s 1.7s ease-in-out infinite}
.us-cos-logo[data-effect="constellation"]::before{box-shadow:-23px -16px 0 1.2px #fff,-23px -16px 5px 2px rgba(255,214,246,.4),21px 17px 0 1px rgba(236,226,255,.92),21px 17px 5px 2px rgba(214,200,255,.35)}
.us-cos-logo[data-effect="constellation"]::after{box-shadow:23px -13px 0 1.1px rgba(255,240,250,.95),23px -13px 5px 2px rgba(255,200,230,.35)}
/* Riflesso — a single glint crossing the mark, clipped to the symbol itself. */
:root[data-us-effect="shimmer"] .us-top-brand::after,.us-cos-logo[data-effect="shimmer"]::after{content:"";position:absolute;z-index:2;left:50%;top:50%;width:58px;height:58px;transform:translate(-50%,-50%);pointer-events:none;
  background:linear-gradient(105deg,transparent 38%,rgba(255,255,255,.92) 50%,transparent 62%) 150% 0/250% 100% no-repeat;
  -webkit-mask:url("/assets/derived/runtime/us-symbol-256-v1.png") center/contain no-repeat;mask:url("/assets/derived/runtime/us-symbol-256-v1.png") center/contain no-repeat;
  animation:us-cos-sheen 7.5s ease-in-out infinite}
.us-cos-logo[data-effect="shimmer"]::after{width:60px;height:60px;background-position:58% 0}

/* ---------- unlock moment ---------- */
.us-progression-unlock{position:fixed;inset:0;z-index:10120;display:none;place-items:center;padding:24px max(18px,var(--us-safe-right)) max(24px,var(--us-safe-bottom));background:rgba(5,2,9,.70);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.us-progression-unlock.open{display:grid}
.us-progression-unlock-card{position:relative;width:min(360px,100%);overflow:hidden;padding:22px 20px 18px;border-radius:30px;border:1px solid rgba(255,255,255,.17);background:radial-gradient(100% 80% at 50% 0%,rgba(255,118,164,.16),transparent 58%),radial-gradient(90% 80% at 100% 100%,rgba(169,133,255,.16),transparent 60%),rgba(18,13,24,.97);box-shadow:0 38px 100px rgba(0,0,0,.62),inset 0 1px 0 rgba(255,255,255,.12);text-align:center;transform:translateY(16px) scale(.96);opacity:0}
.us-progression-unlock.open .us-progression-unlock-card{animation:us-progression-reveal 480ms var(--us-ease-enter) forwards}
.us-progression-unlock-card::after{content:"";position:absolute;z-index:0;top:-20%;left:-70%;width:48%;height:145%;transform:rotate(18deg);background:linear-gradient(90deg,transparent,rgba(255,255,255,.18),transparent)}
.us-progression-unlock.open .us-progression-unlock-card::after{animation:us-progression-swoosh 720ms 120ms var(--us-ease-standard) both}
.us-progression-unlock-card>*{position:relative;z-index:1}
.us-progression-unlock-kicker{font-size:10px;font-weight:850;letter-spacing:.14em;color:var(--us-color-accent-ink)}
.us-progression-unlock-count{display:block;min-height:14px;margin-top:3px;font-size:10px;color:var(--us-color-text-3)}
.us-progression-unlock-preview{position:relative;width:136px;height:136px;margin:14px auto 16px;border-radius:30px;overflow:hidden;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.04);box-shadow:0 18px 44px rgba(0,0,0,.36);isolation:isolate}

.us-progression-unlock-preview .us-cos-logo{width:84px;height:84px}
.us-progression-unlock-preview .us-cos-logo[data-effect="pulse"] img{animation:us-cos-preview-pulse 3.2s ease-in-out infinite;transform:none}
.us-progression-unlock-preview .us-cos-logo[data-effect="constellation"]::before,.us-progression-unlock-preview .us-cos-logo[data-effect="constellation"]::after{scale:1.35}
.us-progression-unlock-preview .us-cos-logo[data-effect="shimmer"]::after{width:84px;height:84px}
.us-progression-unlock h2{margin:4px 0 4px;font:500 30px/1.08 var(--us-font-editorial);letter-spacing:-.02em}
.us-progression-unlock p{margin:0 auto;max-width:280px;color:var(--us-color-text-2);font-size:13px;line-height:1.45}
.us-progression-unlock-actions{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:8px;margin-top:20px}
.us-progression-unlock-actions button{min-height:48px;border-radius:16px}
.us-progression-unlock-later{border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.05);color:var(--us-color-text-2)}
.us-progression-unlock-status{min-height:16px;margin-top:8px;font-size:10.5px;color:var(--us-color-danger-ink)}
/* Unlock moment V2 — a small premium event: the card lands, light blooms behind
   the piece, the piece resolves out of blur, then the words arrive in order.
   One tint per category; everything is one-shot and vanishes under reduced motion. */
.us-progression-unlock{--unlock-tint:255 150 190}

.us-progression-unlock[data-category="theme"]{--unlock-tint:186 160 255}
.us-progression-unlock[data-category="accent"]{--unlock-tint:255 170 190}
.us-progression-unlock[data-category="effect"]{--unlock-tint:196 168 255}
.us-progression-unlock[data-category="oggi_theme"]{--unlock-tint:255 150 190}
.us-progression-unlock[data-category="oggi_effect"]{--unlock-tint:255 214 150}
.us-progression-unlock[data-category="countdown"]{--unlock-tint:214 196 255}
/* V3 — Oggi looks shown inside the unlock card and the next-unlock tile. */
.us-progression-unlock-preview .us-look-phone,.us-progression-next-preview .us-look-phone{position:absolute;inset:0;width:100%;height:100%;aspect-ratio:auto;border-radius:inherit;box-shadow:none}
.us-progression-unlock.open{background:radial-gradient(60% 46% at 50% 44%,rgb(var(--unlock-tint) / .14),transparent 72%),rgba(5,2,9,.74)}
.us-progression-unlock-card{background:radial-gradient(100% 70% at 50% 0%,rgb(var(--unlock-tint) / .17),transparent 60%),radial-gradient(90% 80% at 100% 100%,rgba(169,133,255,.14),transparent 60%),rgba(18,13,24,.97)}
.us-progression-unlock-stage{position:relative;display:grid;place-items:center;width:176px;height:168px;margin:6px auto 8px}
.us-progression-unlock-stage .us-progression-unlock-preview{margin:0;grid-area:1/1}
.us-progression-unlock-burst,.us-progression-unlock-sparks{grid-area:1/1;pointer-events:none}
.us-progression-unlock-burst{width:176px;height:176px;border-radius:50%;background:radial-gradient(closest-side,rgb(var(--unlock-tint) / .42),rgb(var(--unlock-tint) / .10) 58%,transparent),repeating-conic-gradient(from 8deg,rgb(var(--unlock-tint) / .20) 0 4deg,transparent 4deg 22deg);-webkit-mask:radial-gradient(closest-side,#000 40%,transparent);mask:radial-gradient(closest-side,#000 40%,transparent);opacity:.55}
.us-progression-unlock-sparks{position:relative;width:2px;height:2px}
.us-progression-unlock-sparks::before{content:"";position:absolute;inset:0;border-radius:50%;opacity:0;color:rgb(var(--unlock-tint));box-shadow:-84px -22px 0 .5px currentColor,-62px -66px 0 0 #fff,-8px -86px 0 .8px currentColor,58px -70px 0 0 #fff,86px -16px 0 .6px currentColor,74px 46px 0 0 #fff,10px 84px 0 .5px currentColor,-70px 52px 0 0 #fff}
.us-progression-unlock-place{display:inline-flex;align-items:center;gap:7px;margin-top:10px!important;padding:6px 11px;border-radius:999px;border:1px solid rgba(255,255,255,.09);background:rgba(255,255,255,.04);font-size:11.5px!important;color:var(--us-color-text)!important}
.us-progression-unlock-place::before{content:"";width:6px;height:6px;border-radius:50%;background:rgb(var(--unlock-tint));box-shadow:0 0 8px rgb(var(--unlock-tint) / .8)}
.us-progression-unlock-place[hidden],.us-progression-unlock-extra[hidden]{display:none!important}
.us-progression-unlock-extra{display:flex;align-items:center;gap:12px;margin:12px auto 0;max-width:290px;padding:8px 12px 8px 8px;border-radius:18px;border:1px solid rgb(var(--unlock-tint) / .28);background:linear-gradient(120deg,rgb(var(--unlock-tint) / .10),rgba(255,255,255,.02));text-align:left}
.us-progression-unlock-extra-art{position:relative;flex:0 0 64px;width:64px;height:52px;display:grid;place-items:center;overflow:hidden;border-radius:12px;background:radial-gradient(ellipse at 30% 20%,rgba(162,100,151,.22),transparent 70%),linear-gradient(135deg,#25222e,#0d0e16)}
.us-progression-unlock-extra-art .us-countdown-art{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) scale(.3);min-width:170px}
.us-progression-unlock-extra-art [data-countdown-style="orbit"]{width:180px;height:180px}
.us-progression-unlock-extra-copy{display:flex;flex-direction:column;gap:3px;min-width:0}
.us-progression-unlock-extra-copy small{font-size:9px;font-weight:850;letter-spacing:.16em;color:rgb(var(--unlock-tint))}
.us-progression-unlock-extra-copy b{font:500 16px/1.15 var(--us-font-editorial);color:var(--us-color-text)}
.us-progression-unlock.open .us-progression-unlock-burst{animation:us-unlock-bloom 1.25s 160ms cubic-bezier(.2,.8,.2,1) both}
.us-progression-unlock.open .us-progression-unlock-sparks::before{animation:us-unlock-sparks 1.1s 420ms ease-out both}
.us-progression-unlock.open .us-progression-unlock-preview{animation:us-unlock-resolve 680ms 200ms cubic-bezier(.2,.9,.25,1.15) both}
.us-progression-unlock.open .us-progression-unlock-kicker{animation:us-unlock-kicker 700ms 120ms var(--us-ease-enter) both}
.us-progression-unlock.open h2{animation:us-unlock-in 460ms 380ms var(--us-ease-enter) both}
.us-progression-unlock.open #usProgressionUnlockDescription{animation:us-unlock-in 460ms 460ms var(--us-ease-enter) both}
.us-progression-unlock.open .us-progression-unlock-place{animation:us-unlock-in 460ms 540ms var(--us-ease-enter) both}
.us-progression-unlock.open .us-progression-unlock-extra{animation:us-unlock-in 460ms 620ms var(--us-ease-enter) both}
.us-progression-unlock.open .us-progression-unlock-actions{animation:us-unlock-in 460ms 680ms var(--us-ease-enter) both}
@keyframes us-unlock-bloom{0%{opacity:0;transform:scale(.35) rotate(-20deg)}35%{opacity:1}100%{opacity:.55;transform:none}}
@keyframes us-unlock-sparks{0%{opacity:0;transform:scale(.55)}30%{opacity:1}100%{opacity:0;transform:scale(1.12)}}
@keyframes us-unlock-resolve{0%{opacity:0;transform:scale(.8);filter:blur(8px)}100%{opacity:1;transform:none;filter:none}}
@keyframes us-unlock-kicker{0%{opacity:0;letter-spacing:.42em}100%{opacity:1;letter-spacing:.14em}}
@keyframes us-unlock-in{0%{opacity:0;transform:translateY(8px)}100%{opacity:1;transform:none}}
:root[data-us-motion="reduced"] .us-progression-unlock *,:root[data-us-motion="reduced"] .us-progression-unlock *::before{animation:none!important}
@media(prefers-reduced-motion:reduce){.us-progression-unlock *,.us-progression-unlock *::before{animation:none!important}}
@media(max-height:620px){.us-progression-unlock-stage{width:140px;height:132px;margin:2px auto 4px}.us-progression-unlock-stage .us-progression-unlock-preview{width:112px;height:112px}.us-progression-unlock-burst{width:140px;height:140px}.us-progression-unlock-card{max-height:calc(var(--us-viewport-height,100dvh) - 32px);overflow-y:auto}}

/* Collection: rewards that also open a Countdown style say so; the styles
   themselves are a group whose entitlement is the existing reward row. */
.us-progression-reward-plus{position:absolute;z-index:3;right:4px;bottom:4px;padding:2px 5px;border-radius:999px;background:rgba(10,8,14,.72);color:var(--us-color-accent-ink);font:800 7.5px/1.2 var(--us-font-ui);letter-spacing:.04em;font-style:normal}
.us-cos-countdown{overflow:hidden;background:radial-gradient(ellipse at 30% 20%,rgba(162,100,151,.2),transparent 70%),linear-gradient(135deg,#25222e,#0d0e16)}
.us-cos-countdown .us-countdown-art{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) scale(.36);min-width:170px}
.us-cos-countdown [data-countdown-style="orbit"]{width:180px;height:180px}
.us-cos-countdown .us-countdown-art *,.us-cos-countdown .us-countdown-art::after{animation:none!important}

@keyframes us-progression-reveal{to{transform:none;opacity:1}}
@keyframes us-progression-swoosh{0%{left:-70%;opacity:0}20%{opacity:1}100%{left:128%;opacity:0}}
@keyframes us-progression-pulse{0%,100%{filter:drop-shadow(0 0 0 rgba(190,155,255,0));transform:translate(-50%,-50%) scale(1)}50%{filter:drop-shadow(0 0 10px rgba(190,155,255,.35));transform:translate(-50%,-50%) scale(1.035)}}
@keyframes us-cos-preview-pulse{0%,100%{filter:drop-shadow(0 0 0 rgba(190,155,255,0));transform:scale(1)}50%{filter:drop-shadow(0 0 10px rgba(190,155,255,.4));transform:scale(1.04)}}
@keyframes us-cos-twinkle{0%,100%{opacity:.18}12%,46%{opacity:1}60%{opacity:.3}}
@keyframes us-cos-sheen{0%,70%{background-position:150% 0}100%{background-position:-50% 0}}
:root[data-us-visibility="hidden"] .us-top-brand::before,:root[data-us-visibility="hidden"] .us-top-brand::after,:root[data-us-visibility="hidden"] .noi-couple-avatar::after{animation-play-state:paused}
:root[data-us-motion="reduced"] .us-top-brand-art,:root[data-us-motion="reduced"] .us-top-brand::before,:root[data-us-motion="reduced"] .us-top-brand::after,:root[data-us-motion="reduced"] .noi-couple-avatar::after{animation:none!important}
@media(prefers-reduced-motion:reduce){
  .us-progression-unlock.open .us-progression-unlock-card,.us-progression-unlock.open .us-progression-unlock-card::after,:root[data-us-effect="pulse"] .us-top-brand-art{animation:none!important}
  .us-progression-unlock-card{transform:none;opacity:1}
  :root[data-us-effect] .us-top-brand::before,:root[data-us-effect] .us-top-brand::after,.us-cos-logo::before,.us-cos-logo::after,.us-cos-logo img{animation:none!important}
  :root[data-us-effect="shimmer"] .us-top-brand::after{opacity:0}
  .us-progression-reward{transition:none}
}

/* US-SINTONIA-FOCUS-01 — presentation only; the reward RPC and entitlement
   model are unchanged. A visible next milestone, two large preview columns,
   natural page scrolling and native, collapsible secondary categories. */

/* Secondary Sintonia information is available on demand rather than taking
   the first screen away from the next milestone and the collection. */

#bond details:not([open]) > :not(summary){display:none!important}