/* CTGM V72: original visual assets and responsive full-screen interface.
   The real Supabase, points, order, scratch and consultation widgets stay intact. */
:root{--v72-ink:#111820;--v72-blue:#1a9bdb;--v72-paper:#f5f8fa;--v72-round:24px}
html{scroll-behavior:smooth}
html body.ctgm-ui{background:#f5f8fa!important;color:#14202c!important;--ct-bg:#f5f8fa;--ct-ink:#17212a;--ct-muted:#506372;--ct-faint:#6d7c88;--ct-surface:#fff;--ct-raised:#f0f7fa;--ct-input:#edf5f7;--ct-line:#dce8ec;--ct-accent:#168dc8;--ct-shadow:0 12px 26px #11304912;color-scheme:light;padding-bottom:calc(104px + env(safe-area-inset-bottom,0px))}
html body.ctgm-ui::before,html body.ctgm-ui::after{display:none!important}
html body.ctgm-ui :is(h1,h2,h3,h4,strong,b,.name,.big,.v,.pageTitle,.clientInfoValue){color:inherit!important}
html body.ctgm-ui :is(.card,.panel,.section,.box,.account-stat){background:#fff!important;border-color:#dfe7ea!important;color:#19252f!important;box-shadow:0 14px 36px #0c233012!important}
html body.ctgm-ui :is(input:not([type=checkbox]):not([type=radio]):not([type=range]),select,textarea){background:#f8fafb!important;color:#15232c!important;-webkit-text-fill-color:#15232c!important;border:1px solid #cedfe8!important}
html body.ctgm-ui .note,html body.ctgm-ui p,html body.ctgm-ui .lead,html body.ctgm-ui small{color:inherit}
html body.ctgm-ui :is(.note,.lead,.muted,.meta,.sub){color:#536777!important}
html body.ctgm-ui .eyebrow{color:#188ac7!important}
html body.ctgm-ui .btn.primary{background:#131b22!important;color:#fff!important;border-color:#131b22!important}
html body.ctgm-ui .btn.secondary{color:#17242e!important;background:#e8f1f4!important;border:1px solid #d0dfe6!important}
html body.ctgm-ui a{color:#0879ba!important}
html body.ctgm-ui .app-header.v72-brandbar{position:relative;inset:auto;background:#fff!important;border:0!important;box-shadow:none!important;min-height:76px;max-width:1100px;margin:auto;padding:12px 22px;display:flex;align-items:center;justify-content:space-between}
html body.ctgm-ui .v72-brand-image{width:110px;height:auto;max-height:48px;object-fit:contain}
html body.ctgm-ui .v72-brandbar .header-note{color:#5e7582!important;font-size:10px;letter-spacing:.17em}
html body.ctgm-ui .shell{width:min(100%,1100px);max-width:1100px!important;padding:0 18px 32px!important;margin:0 auto!important}
html body.ctgm-ui .bottom-nav{display:none!important}
html body.ctgm-ui .view{padding:0!important;min-width:0}
html body.ctgm-ui .v72-view[hidden]{display:none!important}
html body.ctgm-ui .v72-view{display:block}
.v72-topbar{display:flex;align-items:center;gap:12px;padding:12px 0 8px}
.v72-bell,.v72-home-avatar{border:1px solid #dcecf1;border-radius:50%;width:51px;height:51px;min-width:51px;background:#fff;display:grid;place-items:center;box-shadow:0 6px 18px #0c445414;cursor:pointer}
.v72-bell span{font-size:28px;color:#20272b}
.v72-home-avatar{margin-left:auto;overflow:hidden}
.v72-home-avatar img{width:100%;height:100%;object-fit:cover;object-position:center}
.v72-welcome{display:flex;flex-direction:column;line-height:1.2;gap:5px;min-width:0}
.v72-welcome small{font-size:9px;letter-spacing:.16em;font-weight:800;color:#6d8592!important}
.v72-welcome strong{font-weight:900;font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#15202a!important}
.v72-home-content{width:100%;padding:16px 0 24px}
.v72-intro small{font-size:10px;font-weight:900;letter-spacing:.16em;color:#168dc8!important}
.v72-intro h1{font-size:clamp(30px,6.2vw,54px);line-height:1.08;letter-spacing:-.06em;margin:8px 0 18px;font-weight:900;color:#14212c!important}
.v72-intro h1 em{color:#0d91ce;font-style:normal}
.v72-loyalty{position:relative;display:block;width:100%;border:0;background:#edfd43;border-radius:22px;overflow:hidden;padding:0;box-shadow:0 12px 25px #8095002a;cursor:pointer;text-align:left}
.v72-loyalty img{display:block;width:100%;height:auto;max-height:360px;object-fit:contain}
.v72-loyalty>span{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:34px;background:#e6f42c;padding:7px 16px;font-weight:800;font-size:12px;color:#233522!important}
.v72-loyalty>span span{font-size:19px}
.v72-modules-title{display:flex;justify-content:space-between;align-items:baseline;gap:8px;margin:22px 0 12px}
.v72-modules-title h2{font-size:21px;font-weight:900;letter-spacing:-.04em;margin:0;color:#17232c!important}
.v72-modules-title small{font-size:10px;font-weight:800;letter-spacing:.18em;color:#7c939f!important}
.v72-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
html body.ctgm-ui a.v72-tile{position:relative;display:block;height:clamp(195px,46vw,300px);max-height:300px;padding:16px;overflow:hidden;border-radius:22px;text-decoration:none!important;isolation:isolate;box-shadow:0 14px 25px #152c311e;color:#fff!important}
html body.ctgm-ui .v72-tile strong{position:relative;z-index:2;display:block;color:#fff!important;font-size:clamp(20px,4vw,30px);font-weight:1000;line-height:.95;letter-spacing:-.055em;text-shadow:0 2px 4px #0004}
html body.ctgm-ui .v72-tile small{position:relative;z-index:2;display:block;color:#fff!important;opacity:.9;font-size:11px;font-weight:650;margin-top:10px}
.v72-tile-rewards{background:linear-gradient(140deg,#f71322,#aa0410)}
.v72-tile-rewards img{position:absolute;bottom:-25%;right:-17%;width:122%;max-width:none;max-height:84%;object-fit:contain;filter:drop-shadow(0 10px 12px #6400005e);z-index:1}
.v72-tile-rewards>span{position:absolute;right:14px;top:18px;z-index:3;border-radius:50%;width:32px;height:32px;display:grid;place-items:center;background:#ffe48a;color:#222;font-weight:900}
.v72-tile-scratch{background:#16050d url('./v72-assets/rasca.webp') center 53%/cover no-repeat}
.v72-tile-scratch:after{content:"";position:absolute;inset:0;background:linear-gradient(#08000460 0%,transparent 42%,#0a000ba8 100%);z-index:-1}
.v72-tile-scratch .v72-play{position:absolute;bottom:15px;right:13px;left:13px;background:#ffbf0d;color:#15110a;font-weight:950;font-size:14px;padding:11px 5px;text-align:center;border-radius:12px}
.v72-calc-tile{display:block;position:relative;margin-top:14px;background:#050606;border-radius:20px;padding:10px 12px 24px;text-decoration:none;min-height:125px;box-shadow:0 12px 20px #0002}
html body.ctgm-ui a.v72-calc-tile{color:#fff!important}
.v72-calc-tile img{width:100%;height:auto;max-height:210px;object-fit:contain;display:block}
.v72-calc-tile>span{position:absolute;top:12px;right:15px;color:#d5edf3;font-size:9px;font-weight:800;letter-spacing:.1em}
.v72-calc-tile>b{position:absolute;bottom:17px;right:19px;background:#fff;color:#181e22!important;border-radius:50%;font-size:19px;width:35px;height:35px;display:grid;place-items:center}
.v72-home-links{display:flex;justify-content:space-between;gap:8px;margin:20px 2px 5px}
html body.ctgm-ui .v72-home-links a{font-size:13px;font-weight:800;color:#254b60!important;text-decoration:none}
.v72-page-header{display:flex;align-items:center;gap:13px;padding:12px 0 18px}
html body.ctgm-ui .v72-page-header>a{width:42px;height:42px;display:grid;place-items:center;background:#fff;border:1px solid #dfecf1;color:#18222a!important;border-radius:50%;font-size:30px;text-decoration:none}
.v72-page-header h1{font-size:24px;margin:0;line-height:1.15;flex:1;letter-spacing:-.04em;font-weight:900;color:#141d25!important}
.v72-page-header>span{font-size:10px;font-weight:900;letter-spacing:.13em;color:#768c98}
.v72-reward-banner{display:flex;align-items:center;gap:4px;justify-content:space-between;background:linear-gradient(120deg,#f8152e,#ad0020);border-radius:25px;padding:26px 19px;min-height:170px;overflow:hidden;margin-bottom:16px;color:#fff}
.v72-reward-banner>div{flex:1;min-width:0;position:relative;z-index:1}
.v72-reward-banner small{font-size:10px;font-weight:900;letter-spacing:.13em;color:#ffe5e9!important}
.v72-reward-banner h2{font-size:clamp(20px,4vw,31px);font-weight:950;line-height:1.1;letter-spacing:-.05em;color:#fff!important;margin:12px 0}
.v72-reward-banner p{font-size:12px;color:#fff!important;max-width:240px}
.v72-reward-banner img{width:39%;max-width:180px;filter:drop-shadow(0 12px 16px #0003)}
html body.ctgm-ui #v72RewardsContent{display:grid;gap:15px}
html body.ctgm-ui #v72RewardsContent[hidden]{display:none!important}
html body.ctgm-ui #v72RewardsContent>section{min-width:0}
.v72-rewards-note{font-size:12px;color:#667784;text-align:center;padding:8px}
html body.ctgm-ui .v72-profile{background:linear-gradient(#ff9a06,#feaf24);border-radius:26px;padding:16px!important}
html body.ctgm-ui .v72-profile .v72-profile-intro{background:transparent!important;margin:0 0 12px}
html body.ctgm-ui .v72-profile .v72-profile-intro h1{color:#101010!important;font-size:clamp(30px,7vw,48px);letter-spacing:-.05em}
html body.ctgm-ui .v72-profile .v72-profile-intro .eyebrow{color:#1e1200!important}
html body.ctgm-ui .v72-profile .member-dossier{background:#ffaf29!important;border-color:#f0a91a!important;box-shadow:none!important;border-radius:24px;padding:18px}
html body.ctgm-ui .v72-profile .member-dossier :is(.member-role,.eyebrow){color:#251906!important}
html body.ctgm-ui .v72-profile .profile-avatar{background:#0d0d0d;border:4px solid #fff;border-radius:50%}
html body.ctgm-ui .v72-profile .profile-name{color:#0a1015!important}
html body.ctgm-ui .v72-profile :is(.member-contact,.member-photo-note){color:#33230e!important}
html body.ctgm-ui .v72-profile .member-id-row{background:#121212!important;color:#fff!important;border-radius:18px;padding:16px}
html body.ctgm-ui .v72-profile .member-id-row :is(small,strong){color:#fff!important;overflow-wrap:anywhere}
html body.ctgm-ui .v72-profile-menu{display:grid;gap:9px;margin:16px 0}
html body.ctgm-ui .v72-profile-menu button{width:100%;display:flex;align-items:center;justify-content:space-between;gap:15px;border:0;border-radius:15px;padding:18px 20px;background:#101010;color:#fff!important;font-size:17px;font-weight:850;text-align:left;cursor:pointer}
.v72-profile-menu button span{font-size:26px;font-weight:400}
html body.ctgm-ui .v72-profile .card:not(#authCard){box-shadow:0 8px 18px #0a0a0a15!important}
html body.ctgm-ui .v72-profile:has(#authCard:not([hidden])){background:linear-gradient(170deg,#a7eaff,#37baf4 58%,#1195d9);min-height:calc(100dvh - 160px);position:relative;overflow:hidden}
html body.ctgm-ui .v72-profile:has(#authCard:not([hidden])):after{content:"";background:url('./v72-assets/calavera.webp') center/contain no-repeat;position:absolute;width:min(70%,480px);height:52%;right:-9%;bottom:-6%;pointer-events:none;opacity:.78}
html body.ctgm-ui .v72-profile:has(#authCard:not([hidden])) .v72-profile-intro h1{color:#0a1a22!important}
html body.ctgm-ui .v72-profile #authCard{background:#ffffffef!important;position:relative;z-index:1;padding:24px;border-radius:25px;max-width:550px;margin:12px auto 65px}
html body.ctgm-ui .v72-profile #authCard h2{font-size:28px;letter-spacing:-.04em}
html body.ctgm-ui .v72-profile #authCard .btn.primary{background:#111b22!important;border-radius:14px}
html body.ctgm-ui #view-calculadora .intro,html body.ctgm-ui #view-ayuda .intro{margin-bottom:18px}
html body.ctgm-ui #view-calculadora,html body.ctgm-ui #view-ayuda{background:#fff;border-radius:24px;padding:24px!important}
html body.ctgm-ui #view-juegos{border-radius:24px;padding:14px!important;background:#12080b}
html body.ctgm-ui #view-juegos h1{color:#fff!important;font-size:24px}
html body.ctgm-ui .v72-promo-shade{position:fixed;inset:0;z-index:10050;background:#0009}
html body.ctgm-ui .v72-promo-sheet{position:fixed;bottom:0;left:50%;z-index:10051;width:min(100%,650px);height:min(83dvh,790px);max-height:calc(100dvh - 24px);transform:translate(-50%,calc(100% - 77px + var(--v72-drag,0px)));transition:transform .24s cubic-bezier(.19,.8,.3,1);border-radius:25px 25px 0 0;background:linear-gradient(160deg,#ffe35d,#ffca02);box-shadow:0 -6px 36px #805d0060;border:2px solid #ffb902;display:flex;flex-direction:column;overflow:hidden;touch-action:pan-x}
html body.ctgm-ui .v72-promo-sheet.is-open{transform:translate(-50%,var(--v72-drag,0px))}
html body.ctgm-ui #v72PromoHandle{touch-action:none;display:block;width:100%;height:76px;min-height:76px;border:0;background:transparent;cursor:grab;padding:7px 20px 15px;color:#171008;font-weight:950}
.v72-grab{width:55px;height:5px;display:block;margin:0 auto 7px;border-radius:10px;background:#523904}
.v72-promo-bar-title{display:flex;gap:10px;align-items:center;justify-content:center;font-size:23px;letter-spacing:-.04em}
.v72-promo-bar-title b{font-size:30px;line-height:1;transition:transform .25s}
.v72-promo-sheet.is-open .v72-promo-bar-title b{transform:rotate(180deg)}
html body.ctgm-ui .v72-promo-content{background:#fffae4;min-height:0;overflow-y:auto;overscroll-behavior:contain;flex:1;padding:22px 15px calc(28px + env(safe-area-inset-bottom,0px));touch-action:pan-y}
html body.ctgm-ui #view-promociones{padding:0!important}
html body.ctgm-ui #view-promociones .intro h1{color:#15212d!important;font-size:29px}
html body.ctgm-ui #view-promociones .card{background:#fff!important}
html body.ctgm-ui .v72-promo-content .promo-feature-image{max-height:280px;object-fit:cover}
html body.ctgm-ui .v72-promo-content .promo-card{margin-bottom:14px}
@media(min-width:700px){html body.ctgm-ui .v72-home-content{max-width:830px;margin:auto}.v72-topbar{max-width:830px;margin:auto}.v72-grid{gap:22px}.v72-loyalty{max-width:830px}.v72-tile-rewards img{width:105%;max-height:100%}.v72-profile{max-width:840px;margin:auto}.v72-rewards{max-width:840px;margin:auto}}
@media(max-width:380px){html body.ctgm-ui .shell{padding:0 12px 25px!important}.v72-tile{padding:12px!important}.v72-tile strong{font-size:19px!important}.v72-grid{gap:9px}.v72-intro h1{font-size:30px}.v72-promo-bar-title{font-size:20px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.v72-promo-sheet,.v72-promo-bar-title b{transition:none}}

/* Keep the immersive Rasca y Gana background only while the real game is visible. */
html body.ctgm-ui[data-v72-screen='juegos']::before{display:block!important}

html body.ctgm-ui .v72-promo-sheet.is-dragging{transition:none!important}

/* WCAG AA contrast for real customer information and promotion content. */
html body.ctgm-ui .v72-profile #profilePhotoAction{color:#142a37!important;font-weight:800;text-decoration:underline}
html body.ctgm-ui .v72-profile :is(#accountEmail,#profilePhone){color:#19150f!important;opacity:1!important;font-weight:700}
html body.ctgm-ui .v72-profile #profileLinkCard>.eyebrow{color:#075b85!important}
html body.ctgm-ui .v72-profile :is(#copyReferralCode,#enablePush){background:#101920!important;color:#fff!important;-webkit-text-fill-color:#fff!important;border:1px solid #101920!important}
html body.ctgm-ui .v72-profile #ordersList article a{color:#064566!important;font-weight:850;text-decoration:underline}
html body.ctgm-ui .v72-promo-content .eyebrow{color:#064c62!important;font-weight:850}

/* Photo action gets a solid surface for reliable small-text contrast on all devices. */
html body.ctgm-ui .v72-profile #profilePhotoAction{display:inline-flex;align-items:center;justify-content:center;background:#101920!important;color:#fff!important;-webkit-text-fill-color:#fff!important;border:1px solid #101920!important;border-radius:999px;padding:8px 12px;font-size:12px;font-weight:900}
