.lo-mystery-section { --reel-paper:#e8e4d9; --reel-height:clamp(360px,42vw,620px); padding:88px 24px; background:var(--reel-paper); color:#091808; font-family:'LO Poppins',sans-serif; }
.lo-mystery-section > .brxe-container { width:100%; max-width:1592px; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:center; gap:clamp(40px,6vw,96px); }
.lo-mystery-copy { gap:36px; }
.lo-mystery-copy h2 { font:700 clamp(54px,6.2vw,96px)/1.02 'LO Playfair',serif; letter-spacing:-.045em; }
.lo-mystery-copy h2 em { color:#344e24; }
.lo-mystery-copy .brxe-text-basic { width:100%; font-size:20px; line-height:1.75; }
.lo-mystery-section .lo-mystery-kicker { font-size:20px; line-height:1.5; }
.lo-mystery-section .lo-cta { color:#091808; font-family:'LO Playfair',serif; }
.lo-mystery-machine { min-width:0; gap:0; }
.lo-mystery-window { height:var(--reel-height); width:100%; overflow:hidden; position:relative; background:var(--reel-paper); }
.lo-mystery-window::before { content:''; position:absolute; left:0; top:50%; width:24px; height:2px; background:#091808; z-index:1; }
.lo-mystery-window::after { content:''; position:absolute; right:0; top:50%; width:24px; height:2px; background:#091808; z-index:1; }
.lo-mystery-track { display:flex; flex-direction:column; width:100%; gap:0; }
.lo-mystery-card { height:var(--reel-height); flex:0 0 var(--reel-height); width:100%; padding:36px 32px; display:flex; justify-content:center; align-items:center; background:var(--product-paper,var(--reel-paper)); }
.lo-mystery-card img { width:100%; height:100%; object-fit:contain; }
.lo-mystery-card__name { display:none; }
.lo-mystery-result { padding:28px 0; min-height:180px; justify-content:center; border-top:1px solid #09180830; }
.lo-mystery-name { display:block; font:700 clamp(32px,3vw,46px)/1.12 'LO Playfair',serif; letter-spacing:-.025em; text-decoration:none; color:#091808; }
.lo-mystery-name::after { content:' ↗'; font-family:Arial,sans-serif; font-weight:400; }
.lo-mystery-name:hover { text-decoration:underline; text-underline-offset:7px; }
.lo-mystery-controls { display:flex; flex-direction:row; gap:24px; align-items:center; justify-content:space-between; }
.lo-mystery-controls .lo-mystery-note { font-size:16px; line-height:1.5; width:auto; }
.lo-mystery-toggle.brxe-button { flex-shrink:0; padding:8px 0; border:0; border-bottom:1px solid #091808; border-radius:0; background:transparent; color:#091808; font:400 16px/1.5 'LO Poppins',sans-serif; cursor:pointer; }
.lo-mystery-section :focus-visible { outline:2px solid #091808; outline-offset:5px; }
.lo-mystery-section + .lo-member-saving { padding-top:96px; }
@media(prefers-reduced-motion:no-preference){ .lo-mystery-section { transition:background-color 1s ease; } }
@media(max-width:767px){
 .lo-mystery-section { --reel-height:400px; padding:64px 24px; }
 .lo-mystery-section > .brxe-container { grid-template-columns:minmax(0,1fr); gap:40px; }
 .lo-mystery-copy { gap:28px; }
 .lo-mystery-copy h2 { font-size:clamp(48px,12vw,64px); }
 .lo-mystery-copy .brxe-text-basic { font-size:18px; }
 .lo-mystery-result { min-height:168px; padding:24px 0; }
 .lo-mystery-controls { flex-wrap:wrap; gap:16px; }
 .lo-mystery-section + .lo-member-saving { padding-top:56px; }
}

/* The reel fades at its boundaries instead of cutting product silhouettes sharply. */
.lo-mystery-window { mask-image:linear-gradient(to bottom,transparent,#000 9%,#000 91%,transparent); }
@media(max-width:767px){ .lo-mystery-card { padding:32px 24px; } }
.lo-mystery-name[aria-disabled=true] { pointer-events:none; cursor:default; text-decoration:none; }
.lo-mystery-name[aria-disabled=true]::after { content:none; }
/* A floating product capsule anchors each reveal. */
.lo-mystery-machine { position:relative; padding-bottom:16px; }
.lo-mystery-window::before,.lo-mystery-window::after { content:none; }
.lo-mystery-result { min-height:112px; padding:12px 0 0; border:0; width:100%; }
.lo-mystery-name { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; column-gap:24px; row-gap:8px; width:100%; padding:24px 30px; border:1px solid #09180814; border-radius:48px; background:#FFF7E8; box-shadow:0 12px 36px #09180808; color:#091808; text-decoration:none; transition:background .3s ease,box-shadow .3s ease,opacity .25s ease; }
.lo-mystery-name__title { font:700 clamp(22px,2.2vw,34px)/1.15 'LO Playfair',serif; letter-spacing:-.025em; overflow-wrap:anywhere; }
.lo-mystery-name__price { grid-column:1; display:flex; flex-wrap:wrap; align-items:baseline; column-gap:10px; row-gap:2px; font:400 13px/1.4 'LO Poppins',sans-serif; letter-spacing:0; }
.lo-mystery-name__member { font:700 16px/1.4 'LO Poppins',sans-serif; color:#091808; }
.lo-mystery-name__was { font-size:13px; color:#091808; opacity:.55; text-decoration-thickness:1px; text-underline-offset:0; }
.lo-mystery-name::after { content:'↗'; grid-column:2; grid-row:1 / 3; display:grid; place-items:center; width:48px; height:48px; border-radius:50%; background:#fde739; font:400 27px/1 Arial,sans-serif; transition:transform .3s ease; }
.lo-mystery-name:hover { background:#fffbee; color:#091808; text-decoration:none; box-shadow:0 16px 42px #09180812; }
.lo-mystery-name:hover::after { transform:rotate(45deg); }
.lo-mystery-name[aria-disabled=true]::after { content:'↗'; }
.is-spinning .lo-mystery-name { opacity:.35; }
.lo-mystery-controls { display:none; }
@media(max-width:767px){
 .lo-mystery-section { --reel-height:350px; }
 .lo-mystery-result { min-height:112px; padding-top:8px; }
 .lo-mystery-name { padding:20px 22px; column-gap:12px; border-radius:32px; }
 .lo-mystery-name::after { width:40px; height:40px; font-size:24px; }
}
@media(prefers-reduced-motion:reduce){.lo-mystery-name,.lo-mystery-name::after{transition:none;}}
.lo-mystery-copy .lo-cta { width:100%; max-width:100%; }
.lo-mystery-copy .lo-cta > .brxe-text-basic { width:auto; overflow:visible; }
.lo-mystery-label { position:absolute; top:12px; left:0; z-index:2; width:auto; padding:12px 20px; background:#fde739; color:#091808; border-radius:40px; font:500 14px/1.3 'LO Poppins',sans-serif; transform:rotate(-5deg); }
.lo-mystery-spin.brxe-button { align-self:center; margin-top:24px; padding:12px 24px; border:1px solid #09180835; border-radius:40px; background:transparent; color:#091808; font:500 14px/1.4 'LO Poppins',sans-serif; cursor:pointer; transition:background .2s,opacity .2s; }
.lo-mystery-spin.brxe-button:hover { background:#fde739; }
.lo-mystery-spin.brxe-button:disabled { opacity:.45; cursor:wait; }
/* A compact product card with one stretched product link and a separate spin action. */
body.bricks-is-frontend .lo-mystery-section { background:#FFF7E8; }
.lo-mystery-machine {
 --reel-height:420px;
 width:100%; max-width:600px; justify-self:center; align-self:center;
 padding:24px; border:1px solid #09180814; border-radius:32px;
 background:var(--reel-paper); box-shadow:0 12px 32px #09180808;
 transition:transform .4s cubic-bezier(.22,1,.36,1),box-shadow .4s ease,background-color .8s ease;
}
.lo-mystery-machine:hover { transform:translateY(-4px); box-shadow:0 24px 52px #09180812; }
.lo-mystery-machine .lo-mystery-window { background:transparent; border-radius:20px; }
.lo-mystery-machine .lo-mystery-card { padding:44px 28px 20px; }
.lo-mystery-machine .lo-mystery-label { top:24px; left:24px; pointer-events:none; }
.lo-mystery-machine .lo-mystery-result { min-height:104px; padding-top:8px; }
.lo-mystery-machine .lo-mystery-name { padding:20px 24px; border-radius:28px; box-shadow:none; }
.lo-mystery-machine .lo-mystery-name__title { font-size:clamp(22px,2vw,30px); }
.lo-mystery-name::before { content:''; position:absolute; inset:0; z-index:2; border-radius:32px; }
.lo-mystery-machine .lo-mystery-spin { position:relative; z-index:3; margin-top:20px; }
.lo-mystery-machine:has(.lo-mystery-name:focus-visible) { outline:2px solid #091808; outline-offset:5px; }
@media(max-width:767px){
 .lo-mystery-machine { --reel-height:310px; padding:16px; border-radius:24px; }
 .lo-mystery-machine .lo-mystery-label { top:20px; left:20px; padding:10px 16px; font-size:12px; }
 .lo-mystery-machine .lo-mystery-name { padding:18px; border-radius:24px; }
 .lo-mystery-machine .lo-mystery-card { padding:40px 16px 12px; }
}
@media(prefers-reduced-motion:reduce){.lo-mystery-machine{transition:none;}.lo-mystery-machine:hover{transform:none;}}
body.bricks-is-frontend #brx-content .lo-mystery-copy .lo-cta { width:100%; max-width:100%; }
body.bricks-is-frontend #brx-content .lo-mystery-copy .lo-cta__text { width:auto; flex:1; min-width:0; white-space:normal; }