/* Layout: a candy-shop storefront. Striped awning on top of a navy facade with confetti and lollipops, a scalloped sticky toolbar, then sticker-style product cards (colored stage, starburst price tag, hard shadows) on a sprinkle-dotted lilac page. */
:root{
  --font-display:'Lilita One','Baloo 2','Arial Rounded MT Bold',system-ui,sans-serif;
  --font-body:'Figtree',system-ui,-apple-system,'Segoe UI',Roboto,'Helvetica Neue',sans-serif;
  --font-script:'Caveat Brush','Segoe Script','Bradley Hand',cursive;
  --navy:#213A7B; --navy-deep:#16275A; --yellow:#FFD800; --purple:#6B2F94; --lilac:#C9A0F0; --lime:#9CC93B;
  --bg:#F6F1FD; --surface:#FFFFFF; --surface-2:#EDE4FA; --ink:#16275A; --ink-soft:#5A5690; --line:#DCD3EE;
  --accent:#6B2F94; --accent-soft:#EFE4FB; --pop:#16275A; --hl:#FFD800;
  --danger:#B3261E; --ok:#17794B; --warn-bg:#FFF1B3; --warn-ink:#5E4A00;
  --star:polygon(50.0% 0.0%,58.1% 9.3%,69.1% 3.8%,73.1% 15.5%,85.4% 14.6%,84.5% 26.9%,96.2% 30.9%,90.7% 41.9%,100.0% 50.0%,90.7% 58.1%,96.2% 69.1%,84.5% 73.1%,85.4% 85.4%,73.1% 84.5%,69.1% 96.2%,58.1% 90.7%,50.0% 100.0%,41.9% 90.7%,30.9% 96.2%,26.9% 84.5%,14.6% 85.4%,15.5% 73.1%,3.8% 69.1%,9.3% 58.1%,0.0% 50.0%,9.3% 41.9%,3.8% 30.9%,15.5% 26.9%,14.6% 14.6%,26.9% 15.5%,30.9% 3.8%,41.9% 9.3%);
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#0C1330; --surface:#16204A; --surface-2:#222E64; --ink:#F2EFFF; --ink-soft:#B6B2E0; --line:#2B3670;
    --accent:#DCC2FF; --accent-soft:#2D2366; --pop:#7B5CC4; --hl:#6B2F94;
    --danger:#FF8A80; --ok:#5FD39B; --warn-bg:#3B3200; --warn-ink:#FFE680;
    color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --bg:#0C1330; --surface:#16204A; --surface-2:#222E64; --ink:#F2EFFF; --ink-soft:#B6B2E0; --line:#2B3670;
  --accent:#DCC2FF; --accent-soft:#2D2366; --pop:#7B5CC4; --hl:#6B2F94;
  --danger:#FF8A80; --ok:#5FD39B; --warn-bg:#3B3200; --warn-ink:#FFE680;
  color-scheme:dark;
}
*,*::before,*::after{box-sizing:border-box}
body{background-color:var(--bg);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cg stroke-linecap='round' stroke-width='6' opacity='.17'%3E%3Cpath d='M22 34l10-6' stroke='%23FFD800'/%3E%3Cpath d='M120 24l4 12' stroke='%23C9A0F0'/%3E%3Cpath d='M168 88l12-3' stroke='%236B2F94'/%3E%3Cpath d='M66 112l-9 7' stroke='%236B2F94'/%3E%3Cpath d='M134 156l10 5' stroke='%23FFD800'/%3E%3Cpath d='M30 178l3-11' stroke='%23C9A0F0'/%3E%3Cpath d='M92 60l9 2' stroke='%23FFD800'/%3E%3C/g%3E%3C/svg%3E");color:var(--ink);font-family:var(--font-body);font-size:16px;line-height:1.45;-webkit-text-size-adjust:100%}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:60;background:var(--navy)}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
img{display:block}
h1,h2,h3,p,ul{margin:0}
ul{padding:0;list-style:none}
:focus-visible{outline:3px solid var(--accent);outline-offset:2px;border-radius:8px}
.hero :focus-visible,.toolbar :focus-visible,.dock :focus-visible,.foot :focus-visible{outline-color:var(--yellow)}
.wrap{max-width:1120px;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* storefront */
.awning{height:40px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64' height='40'%3E%3Crect width='32' height='24' fill='%23FFD800'/%3E%3Crect x='32' width='32' height='24' fill='%236B2F94'/%3E%3Ccircle cx='16' cy='24' r='16' fill='%23FFD800'/%3E%3Ccircle cx='48' cy='24' r='16' fill='%236B2F94'/%3E%3C/svg%3E") repeat-x 0 0/64px 40px;filter:drop-shadow(0 3px 0 rgba(4,7,27,.35));position:relative;z-index:3}
.hero{background:var(--navy);color:#fff;position:relative;overflow:hidden}
.hero::before{content:"";position:absolute;inset:0;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cg stroke-linecap='round' stroke-width='6'%3E%3Cpath d='M20 30l9-5' stroke='%23FFD800' opacity='.5'/%3E%3Cpath d='M100 20l4 11' stroke='%23C9A0F0' opacity='.5'/%3E%3Cpath d='M138 70l10-3' stroke='%23fff' opacity='.28'/%3E%3Cpath d='M54 96l-8 6' stroke='%23C9A0F0' opacity='.45'/%3E%3Cpath d='M112 130l9 4' stroke='%23FFD800' opacity='.45'/%3E%3Cpath d='M26 140l3-10' stroke='%23fff' opacity='.28'/%3E%3C/g%3E%3C/svg%3E");pointer-events:none}
.hero-in{display:flex;flex-wrap:wrap;align-items:center;gap:18px 44px;padding-block:30px 40px;position:relative;z-index:1}
.hero-logo{width:min(250px,66vw);height:auto;order:0;transform:rotate(-3deg);filter:drop-shadow(5px 6px 0 rgba(4,7,27,.45))}
.hero-copy{flex:1 1 300px;min-width:0;order:1;position:relative}
.eyebrow{display:inline-block;font-size:.76rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--navy-deep);background:var(--yellow);border-radius:8px;padding:3px 10px;transform:rotate(-1.5deg)}
.hero h1{font-family:var(--font-display);font-weight:400;font-size:clamp(2.5rem,11vw,4.4rem);line-height:.98;margin-top:12px;text-wrap:balance;text-shadow:3px 4px 0 rgba(4,7,27,.4)}
.hero h1 mark{background:var(--yellow);color:var(--navy-deep);padding:0 .18em;border-radius:.2em;display:inline-block;transform:rotate(-2deg);text-shadow:none;box-shadow:4px 4px 0 var(--purple)}
.note{font-family:var(--font-script);font-size:clamp(1.5rem,6vw,2rem);color:var(--yellow);transform:rotate(-1.5deg);margin-top:14px;line-height:1.1}
.lead{margin-top:6px;max-width:44ch;color:#E3E8FF;font-size:1.02rem}
.perks{display:flex;flex-wrap:wrap;gap:10px 10px;margin-top:18px;align-items:center}
.perks li{background:#fff;color:var(--navy-deep);border:3px solid var(--navy-deep);border-radius:999px;padding:5px 13px;font-size:.84rem;font-weight:800;box-shadow:3px 3px 0 var(--yellow);transform:rotate(-1.5deg)}
.perks li:nth-child(2){background:var(--lilac);transform:rotate(1.5deg)}
.perks li.act{background:none;border:0;padding:0;box-shadow:none;transform:none}
.perks .btn{min-height:42px;padding:0 15px;font-size:.86rem;background:var(--yellow);color:var(--navy-deep);border:3px solid var(--navy-deep);box-shadow:3px 3px 0 var(--purple)}
.perks .btn svg{width:18px;height:18px}
.lolli{position:absolute;pointer-events:none;width:64px;height:128px;z-index:0}
.lolli.l1{right:-8px;top:14px;color:var(--lilac);transform:rotate(18deg)}
.lolli.l2{right:56px;top:30px;color:var(--yellow);transform:rotate(-14deg);width:48px;height:96px}
.lolli.l3{right:-14px;bottom:-30px;color:var(--lime);transform:rotate(-28deg);width:56px;height:112px}
@media (min-width:760px){
  .hero-logo{order:2;width:320px}
  .hero-in{padding-block:44px 52px;justify-content:space-between}
  .lolli{width:92px;height:184px}.lolli.l1{right:30px}.lolli.l2{right:170px;width:70px;height:140px;top:-40px}.lolli.l3{right:-6px;bottom:-50px;width:80px;height:160px}
}

/* toolbar */
.toolbar{position:sticky;top:env(safe-area-inset-top,0px);z-index:40;background:var(--navy)}
.toolbar::after{content:"";position:absolute;left:0;right:0;top:100%;height:16px;background:radial-gradient(circle at 16px 0,var(--navy) 15px,transparent 16px) 0 0/32px 16px repeat-x;filter:drop-shadow(0 3px 0 rgba(4,7,27,.3));pointer-events:none}
.toolbar-in{display:flex;flex-direction:column;gap:8px;padding-block:2px 12px}
.search{position:relative}
.search svg{position:absolute;left:14px;top:50%;transform:translateY(-50%);width:20px;height:20px;color:var(--navy);pointer-events:none}
.search input{width:100%;height:48px;border-radius:999px;border:3px solid var(--navy-deep);background:#fff;color:#16275A;padding:0 16px 0 44px;font-size:16px;font-weight:600;box-shadow:0 3px 0 var(--purple)}
.search input::placeholder{color:#6A74A0;font-weight:500}
.search input:focus{outline:none;border-color:var(--yellow);box-shadow:0 3px 0 var(--yellow)}
.chips{display:flex;gap:8px;overflow-x:auto;padding:2px 2px 4px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.chips::-webkit-scrollbar{display:none}
.chip{flex:0 0 auto;height:38px;padding:0 15px;border-radius:999px;border:2.5px solid rgba(255,255,255,.55);background:transparent;color:#fff;font-weight:800;font-size:.92rem;display:inline-flex;align-items:center;gap:6px}
.chip small{font-weight:700;opacity:.85}
.chip[aria-pressed="true"]{background:var(--yellow);border-color:var(--navy-deep);color:var(--navy-deep);box-shadow:0 3px 0 var(--purple)}

/* catalog (estilo de tarjetas anterior: ya no se usa en la página, solo lo usa el PDF; el diseño actual está al final, bajo .sk) */
main{padding-block:34px 40px}
.cat{margin-bottom:44px}
.cat+.cat{padding-top:28px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='14'%3E%3Cpath d='M0 7 Q10 -1 20 7 T40 7' fill='none' stroke='%236B2F94' stroke-width='3.5' stroke-linecap='round' opacity='.4'/%3E%3C/svg%3E") repeat-x 0 0/40px 14px}
.cat-head{display:flex;align-items:center;gap:14px;margin-bottom:20px;flex-wrap:wrap}
.cat-head h2{font-family:var(--font-display);font-weight:400;font-size:clamp(2.1rem,8vw,3.2rem);line-height:1;color:var(--ink);text-shadow:3px 3px 0 var(--hl)}
.cat-head span{background:var(--navy);color:#fff;border:3px solid var(--pop);border-radius:999px;padding:2px 12px;transform:rotate(-3deg);font-weight:800;font-size:.8rem;box-shadow:2px 2px 0 var(--yellow)}
.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:34px 14px}
@media (min-width:640px){.grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:44px 26px}}
@media (min-width:980px){.grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:50px 30px}}
/* products sit directly on the page: no box, no border. A colored blob behind each photo; the photo pops out of it. */
.card{position:relative;display:flex;flex-direction:column;align-items:center;min-width:0;text-align:center}
.card.c0{--stage:#FFE459}.card.c1{--stage:#D8BAF4}.card.c2{--stage:#BBD2FF}.card.c3{--stage:#D3EB93}
.stage{position:relative;width:100%;aspect-ratio:1/1}
.stage::before{content:"";position:absolute;inset:10% 3% 1%;border-radius:42% 58% 55% 45%/52% 44% 56% 48%;background:radial-gradient(circle at 50% 56%,rgba(255,255,255,.6) 0 28%,transparent 29%),repeating-conic-gradient(from 0deg at 50% 56%,rgba(255,255,255,.22) 0 9deg,transparent 9deg 18deg),var(--stage)}
.card.c1 .stage::before{border-radius:58% 42% 45% 55%/46% 50% 50% 50%}
.card.c2 .stage::before{border-radius:50% 50% 60% 40%/44% 52% 48% 52%}
.card.c3 .stage::before{border-radius:45% 55% 50% 50%/56% 44% 46% 44%}
.stage img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;padding:0 1% 4%;transform-origin:50% 90%;filter:drop-shadow(3px 5px 0 rgba(22,39,90,.3))}
.stage .noimg{position:absolute;inset:0;display:grid;place-content:center;justify-items:center;gap:6px;color:var(--navy-deep);opacity:.7;font-size:.78rem;font-weight:700;text-align:center;padding:12px}
.stage .noimg svg{width:46px;height:46px}
.badge{position:absolute;left:6px;top:4px;background:var(--navy-deep);color:#fff;border:2px solid #fff;border-radius:999px;padding:2px 10px;font-weight:800;font-size:.74rem;transform:rotate(-5deg);box-shadow:2px 2px 0 rgba(4,7,27,.35);z-index:2}
.tag{position:absolute;right:0;bottom:0;width:86px;height:86px;display:grid;place-content:center;justify-items:center;text-align:center;transform:rotate(9deg);z-index:2;color:var(--navy-deep);filter:drop-shadow(2px 3px 0 rgba(22,39,90,.4))}
.tag::before,.tag::after{content:"";position:absolute;inset:0;clip-path:var(--star)}
.tag::before{background:var(--navy-deep)}
.tag::after{background:var(--yellow);transform:scale(.88)}
.tag>*{position:relative;z-index:1}
.tag .l{font-size:.58rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;line-height:1}
.tag b{font-family:var(--font-display);font-weight:400;font-size:1.28rem;line-height:1.05;font-variant-numeric:tabular-nums;white-space:nowrap}
.tag.long b{font-size:1.04rem}.tag.xlong b{font-size:.86rem}
@media (min-width:760px){.tag{width:100px;height:100px}.tag .l{font-size:.64rem}.tag b{font-size:1.5rem}.tag.long b{font-size:1.2rem}.tag.xlong b{font-size:1rem}}
.soldout{position:absolute;left:-4px;right:-4px;top:46%;background:var(--navy-deep);color:#fff;text-align:center;font-family:var(--font-display);font-size:1.3rem;letter-spacing:.06em;text-transform:uppercase;padding:4px;transform:rotate(-8deg);border-block:3px solid var(--yellow);z-index:3}
.card.off .stage img{opacity:.5;filter:grayscale(.7)}
.edit-btn{position:absolute;right:6px;top:4px;width:40px;height:40px;border-radius:50%;border:3px solid var(--pop);background:var(--yellow);color:var(--navy-deep);display:grid;place-items:center;box-shadow:2px 2px 0 var(--pop);z-index:4}
.edit-btn svg{width:18px;height:18px}
.body{display:flex;flex-direction:column;align-items:center;gap:6px;padding:14px 2px 0;flex:1;width:100%}
.brand{align-self:center;background:var(--accent-soft);color:var(--accent);border-radius:8px;padding:2px 9px;font-size:.68rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;overflow-wrap:anywhere}
.card h3{font-family:var(--font-display);font-weight:400;font-size:1.55rem;line-height:1.05;overflow-wrap:anywhere;text-wrap:balance}
.pack{font-size:.92rem;color:var(--ink-soft);overflow-wrap:anywhere}
.ref{font-size:.76rem;color:var(--ink-soft)}
.pill{align-self:center;margin-top:4px;display:inline-flex;flex-wrap:wrap;justify-content:center;gap:0 8px;align-items:baseline;border:2.5px solid var(--pop);border-radius:999px;padding:3px 14px;font-size:.88rem;font-weight:700;background:var(--surface-2);color:var(--ink)}
.pill b{font-weight:800;font-variant-numeric:tabular-nums;white-space:nowrap}
.pill.ask{border-style:dashed;color:var(--ink-soft)}
.pill.warn{background:var(--warn-bg);color:var(--warn-ink);border-style:solid;text-align:left;cursor:pointer;border-radius:16px;padding:6px 12px;line-height:1.2}
.buy{margin-top:auto;padding-top:14px;width:100%;max-width:240px}
.btn{min-height:46px;border-radius:999px;border:3px solid var(--pop);padding:0 18px;font-weight:800;font-size:.95rem;display:inline-flex;align-items:center;justify-content:center;gap:8px;text-decoration:none;text-align:center;line-height:1.1;background:var(--surface);color:var(--ink);box-shadow:0 4px 0 var(--pop)}
.btn svg{width:20px;height:20px;flex:0 0 auto}
.btn-cta,.add{background:var(--yellow);color:var(--navy-deep)}
.btn-navy{background:var(--navy);color:#fff}
.btn-ghost{background:var(--surface);color:var(--ink)}
.btn-light{background:var(--lilac);color:var(--navy-deep)}
.btn-outline{background:transparent;color:#fff}
.btn-danger{background:var(--surface);color:var(--danger);border-color:var(--danger);box-shadow:0 4px 0 var(--danger)}
.btn[disabled]{opacity:.55;cursor:not-allowed;box-shadow:none;transform:translateY(4px)}
.btn.block{width:100%}
.add{width:100%}
.stepper{display:grid;grid-template-columns:44px 1fr 44px;align-items:center;background:var(--surface);border:3px solid var(--pop);border-radius:999px;height:46px;box-shadow:0 4px 0 var(--pop)}
.stepper button{width:40px;height:40px;border:0;background:var(--yellow);font-size:1.35rem;font-weight:800;color:var(--navy-deep);border-radius:50%;margin:0 auto;display:grid;place-items:center;line-height:1}
.stepper output{text-align:center;font-weight:800;font-size:1.05rem;font-variant-numeric:tabular-nums}
.empty{padding:36px 16px;text-align:center;color:var(--ink-soft);background:var(--surface);border:3px solid var(--pop);border-radius:24px;box-shadow:5px 5px 0 var(--pop)}
.empty h3{font-family:var(--font-display);font-weight:400;font-size:1.5rem;color:var(--ink);margin-bottom:6px}

/* shop base */
.foot{position:relative;background:var(--navy);color:#DCE3FA;margin-top:30px;padding-block:46px calc(40px + var(--dock-h,0px));font-size:.92rem}
.foot::before{content:"";position:absolute;left:0;right:0;bottom:100%;height:16px;background:radial-gradient(circle at 16px 100%,var(--navy) 15px,transparent 16px) 0 0/32px 16px repeat-x}
.foot-in{display:flex;flex-wrap:wrap;gap:16px 36px;align-items:center}
.foot img{width:150px;height:auto;transform:rotate(-2deg)}
.foot ul{display:flex;flex-direction:column;gap:6px;min-width:0}
.foot a{color:var(--yellow);font-weight:800}
.foot small{display:block;margin-top:14px;opacity:.8;font-size:.8rem}

/* dock */
.dock{position:fixed;left:0;right:0;bottom:0;z-index:50;display:flex;flex-direction:column;gap:8px;padding:8px max(16px,env(safe-area-inset-left,0px)) calc(10px + env(safe-area-inset-bottom,0px));pointer-events:none;max-width:640px;margin:0 auto}
.dock>*{pointer-events:auto}
.dock-card{background:var(--navy-deep);color:#fff;border:3px solid var(--yellow);border-radius:24px;padding:8px;box-shadow:0 8px 0 rgba(4,7,27,.35);display:flex;gap:8px;align-items:center}
.dock-card .btn{flex:1 1 0;min-width:0;padding:0 10px;font-size:.9rem}
.dock-card p{flex:1;font-size:.9rem;font-weight:700;padding:0 8px;line-height:1.25}
.dock-card.dirty{background:var(--purple)}
.dock-card.dirty .btn{flex:0 0 auto}
.cartbar{width:100%;border:3px solid var(--navy-deep);border-radius:999px;background:var(--yellow);color:var(--navy-deep);min-height:62px;padding:0 20px;display:flex;align-items:center;gap:12px;box-shadow:0 5px 0 var(--navy-deep),0 12px 24px rgba(4,7,27,.35);text-align:left}
.cartbar svg{width:26px;height:26px;flex:0 0 auto}
.cartbar .t{flex:1;min-width:0;font-weight:800;font-size:1.02rem}
.cartbar .t small{display:block;font-weight:700;font-size:.78rem;opacity:.85}
.cartbar .go{font-family:var(--font-display);font-size:1.15rem}
.toast{position:fixed;left:0;right:0;margin:0 auto;width:max-content;bottom:calc(max(var(--dock-h,0px),env(safe-area-inset-bottom,0px)) + 10px);z-index:90;background:var(--navy-deep);color:#fff;border:3px solid var(--yellow);padding:10px 16px;border-radius:16px;font-weight:700;font-size:.92rem;max-width:min(92vw,460px)}

/* sheet */
.overlay{position:fixed;inset:0;z-index:80;display:flex;align-items:flex-end;justify-content:center}
.scrim{position:absolute;inset:0;background:rgba(8,12,32,.66)}
.sheet{position:relative;background:var(--surface);color:var(--ink);width:100%;max-width:560px;max-height:94%;display:flex;flex-direction:column;border:3px solid var(--pop);border-bottom:0;border-radius:26px 26px 0 0;box-shadow:0 -8px 0 var(--yellow)}
@media (min-width:700px){.overlay{align-items:center}.sheet{border-radius:26px;border-bottom:3px solid var(--pop);max-height:90%;box-shadow:8px 8px 0 var(--yellow)}}
.sheet-head{display:flex;align-items:center;gap:12px;padding:16px max(18px,env(safe-area-inset-left,0px)) 8px}
.sheet-head h2{flex:1;font-family:var(--font-display);font-weight:400;font-size:1.7rem;line-height:1.1;text-shadow:2px 2px 0 var(--hl)}
.icon-btn{width:46px;height:46px;border-radius:50%;border:3px solid var(--pop);background:var(--lilac);color:var(--navy-deep);display:grid;place-items:center;box-shadow:0 3px 0 var(--pop)}
.icon-btn svg{width:20px;height:20px}
.sheet-body{overflow-y:auto;padding:8px max(18px,env(safe-area-inset-left,0px)) 16px;display:flex;flex-direction:column;gap:14px;min-height:0}
.sheet-foot{display:flex;flex-wrap:wrap;gap:12px;padding:14px max(18px,env(safe-area-inset-left,0px)) calc(16px + env(safe-area-inset-bottom,0px));border-top:3px solid var(--pop);background:var(--surface-2)}
.sheet-foot .btn{flex:1 1 auto}
.field{display:flex;flex-direction:column;gap:6px;min-width:0}
.field>label,.lbl{font-size:.84rem;font-weight:800;color:var(--ink-soft)}
.field input,.field textarea,.field select{width:100%;min-height:48px;border-radius:14px;border:2.5px solid var(--line);background:var(--bg);padding:10px 12px;font-size:16px;font-weight:600}
.field textarea{resize:vertical;min-height:72px}
.field input:focus,.field textarea:focus{outline:none;border-color:var(--purple);box-shadow:0 0 0 4px var(--accent-soft)}
.field .hint{font-size:.78rem;color:var(--ink-soft)}
.field .err{font-size:.8rem;color:var(--danger);font-weight:700}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.check{display:flex;align-items:center;gap:10px;font-weight:700;min-height:44px}
.check input{width:22px;height:22px;accent-color:var(--purple)}
.photo-row{display:flex;gap:14px;align-items:center}
.photo-prev{width:96px;height:96px;border-radius:18px;border:3px solid var(--pop);background:#FFE459;display:grid;place-items:center;overflow:hidden;flex:0 0 auto}
.photo-prev img{width:100%;height:100%;object-fit:contain;padding:8px}
.photo-prev svg{width:36px;height:36px;color:var(--navy-deep)}
.photo-btns{display:flex;flex-direction:column;gap:10px;min-width:0}
.photo-btns .btn{min-height:42px;font-size:.88rem}
.seg{display:grid;grid-template-columns:1fr 1fr;background:var(--surface-2);border:3px solid var(--pop);border-radius:999px;padding:3px;gap:3px}
.seg button{min-height:42px;border:0;border-radius:999px;background:transparent;font-weight:800;color:var(--ink-soft)}
.seg button[aria-pressed="true"]{background:var(--navy);color:#fff}
.lines{display:flex;flex-direction:column;gap:12px}
.line{display:grid;grid-template-columns:58px minmax(0,1fr) auto;gap:10px;align-items:center}
.line .th{width:58px;height:58px;border-radius:14px;border:2.5px solid var(--pop);background:#FFE459;display:grid;place-items:center;overflow:hidden}
.line .th img{width:100%;height:100%;object-fit:contain;padding:4px}
.line .nm{font-weight:800;line-height:1.2;overflow-wrap:anywhere}
.line .sub{font-size:.8rem;color:var(--ink-soft);font-variant-numeric:tabular-nums}
.line .stepper{grid-template-columns:34px 28px 34px;height:40px;width:auto;box-shadow:0 3px 0 var(--pop)}
.line .stepper button{width:30px;height:30px;font-size:1.1rem}
.total{display:flex;justify-content:space-between;align-items:baseline;font-weight:800;border-top:3px dashed var(--line);padding-top:12px}
.total b{font-family:var(--font-display);font-weight:400;font-size:1.9rem;font-variant-numeric:tabular-nums}
.total b.txt{font-family:var(--font-body);font-weight:800;font-size:1rem;color:var(--ink-soft)}
.note-s{font-size:.84rem;color:var(--ink-soft)}
.copybox{width:100%;min-height:120px;border-radius:14px;border:2.5px solid var(--line);background:var(--bg);padding:10px;font-size:14px}
@media (prefers-reduced-motion:no-preference){
  .btn,.chip,.add{transition:transform .12s ease,box-shadow .12s ease}
  .btn:active,.chip:active{transform:translateY(3px);box-shadow:0 1px 0 var(--pop)}
  .stage{transition:transform .4s cubic-bezier(.3,1.5,.5,1)}
  .card.rv{opacity:0;transform:translateY(40px) scale(.92)}
  .card.rv.in{opacity:1;transform:none;transition:opacity .5s ease var(--d,0s),transform .75s cubic-bezier(.2,1.1,.3,1.3) var(--d,0s)}
  .stage::before{animation:blob 8s ease-in-out infinite;animation-delay:calc(var(--i,0)*-1.9s)}
  .stage img{animation:bob 6s ease-in-out infinite;animation-delay:calc(var(--i,0)*-1.3s)}
  .stage.hop{animation:hop .65s cubic-bezier(.3,1.4,.5,1)}
  .card:active .stage{transform:scale(.97)}
  @media (hover:hover){.card:hover .stage{transform:translateY(-8px) rotate(-1.5deg) scale(1.04)}}
  .sheet{animation:up .22s ease-out}
  @keyframes up{from{transform:translateY(24px);opacity:.6}to{transform:none;opacity:1}}
  @keyframes bob{0%,100%{transform:translateY(0) rotate(-1.2deg)}50%{transform:translateY(-6px) rotate(1.2deg)}}
  @keyframes blob{0%,100%{transform:rotate(0) scale(1)}50%{transform:rotate(3deg) scale(1.035)}}
  @keyframes hop{0%{transform:none}28%{transform:translateY(-16px) scale(1.07) rotate(-3deg)}58%{transform:translateY(0) scale(.96) rotate(1.5deg)}80%{transform:translateY(-4px) scale(1.02)}100%{transform:none}}
}

/* ---- phase 1: cart lines (remove button, typed quantity) and test-mode banner ---- */
.line .stepper{grid-template-columns:34px 46px 34px}
.stepper input.qty{width:100%;min-width:0;border:0;background:transparent;text-align:center;font:800 16px/1 var(--font-body);color:var(--ink);padding:0;margin:0;-moz-appearance:textfield;appearance:textfield;border-radius:8px}
.stepper input.qty::-webkit-outer-spin-button,.stepper input.qty::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.stepper input.qty:focus-visible{outline:3px solid var(--yellow);outline-offset:1px;background:var(--surface-2)}
.line .rm{border:0;background:transparent;padding:6px 0 0;margin:0;font:700 .8rem/1 var(--font-body);color:var(--accent);text-decoration:underline;text-underline-offset:3px;min-height:32px;cursor:pointer}
.demo-bar{background:#B3261E;color:#fff;text-align:center;font-weight:800;font-size:.8rem;letter-spacing:.04em;padding:8px 12px}

/* ---- ofertas, descripción y etiqueta "Agotado" en las tarjetas ---- */
:root{--promo:#E0245E;--promo-ink:#C81E52}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--promo-ink:#FF9DBA}}
:root[data-theme="dark"]{--promo-ink:#FF9DBA}
.flag{position:absolute;right:2px;top:2px;z-index:3;background:var(--promo);color:#fff;border:2px solid #fff;border-radius:10px;padding:3px 10px;font-weight:800;font-size:.76rem;letter-spacing:.05em;text-transform:uppercase;transform:rotate(6deg);box-shadow:2px 2px 0 rgba(4,7,27,.35);max-width:70%}
.tag.sale{color:#fff}
.tag.sale::after{background:var(--promo)}
.tag .was{font-size:.62rem;font-weight:700;text-decoration:line-through;opacity:.92;line-height:1.1;white-space:nowrap}
.pill s{opacity:.7;font-weight:600;font-size:.8rem}
.pill.sale{border-color:var(--promo)}
.pill.sale b{color:var(--promo-ink)}
.desc{font-size:.84rem;color:var(--ink-soft);line-height:1.3;overflow-wrap:anywhere}
.until{font-size:.74rem;font-weight:800;color:var(--promo-ink)}
.chip-sale[aria-pressed="false"]{border-color:#fff;background:var(--promo)}
.chip-sale[aria-pressed="true"]{background:#fff;color:var(--promo);border-color:var(--promo);box-shadow:0 3px 0 var(--promo)}
.foot .owner-link a{font-weight:600;font-size:.82rem;opacity:.85;color:#DCE3FA}

/* ---- panel del dueño ---- */
#panel-host{display:none}
body.in-panel #panel-host{display:block}
body.in-panel .hero,body.in-panel .toolbar,body.in-panel #catalog,body.in-panel .foot,body.in-panel .dock{display:none}
.pn{min-height:100vh;min-height:100dvh;padding-bottom:calc(110px + env(safe-area-inset-bottom,0px))}
.pn-top{position:sticky;top:env(safe-area-inset-top,0px);z-index:40;background:var(--navy);color:#fff;border-bottom:4px solid var(--yellow)}
.pn-top-in{display:flex;align-items:center;justify-content:space-between;gap:10px;padding-block:10px}
.pn-title{min-width:0;display:flex;flex-direction:column}
.pn-kicker{font-size:.68rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--yellow)}
.pn-title b{font-family:var(--font-display);font-weight:400;font-size:1.35rem;line-height:1.1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pn-top-btns{display:flex;gap:8px;flex:0 0 auto}
.btn.sm{min-height:38px;padding:0 13px;font-size:.84rem;border-width:2.5px;box-shadow:0 3px 0 var(--pop)}
.pn-top .btn-outline{border-color:#fff;box-shadow:none}
.pn-demo{background:var(--warn-bg);color:var(--warn-ink);font-size:.8rem;font-weight:700;padding:7px 0;text-align:center;line-height:1.3}
.pn-tabs{display:flex;gap:4px;padding-block:14px 4px}
.pn-tabs button{flex:1 1 0;min-width:0;min-height:44px;border-radius:999px;border:2.5px solid var(--pop);background:var(--surface);font-weight:800;font-size:.8rem;color:var(--ink);padding:0 2px}
.pn-tabs button[aria-selected="true"]{background:var(--navy);color:#fff;box-shadow:0 3px 0 var(--yellow)}
.pn .wrap:not(.pn-top-in){max-width:760px}
.pn-body{padding-block:10px 20px;display:flex;flex-direction:column;gap:14px}
.pn-tools{display:grid;gap:10px}
@media (min-width:560px){.pn-tools{grid-template-columns:1fr 240px}}
.pn-search svg{color:var(--navy)}
.pn-catsel select{min-height:48px;border-radius:999px;border:3px solid var(--navy-deep);background:#fff;color:#16275A;font-weight:700;padding:0 14px}
.pn-stats{font-size:.84rem;font-weight:700;color:var(--ink-soft)}
.plist{display:flex;flex-direction:column;gap:12px}
.pgroup{font-family:var(--font-display);font-size:1.25rem;color:var(--ink);margin-top:8px;display:flex;gap:8px;align-items:baseline}
.pgroup small{font-family:var(--font-body);font-size:.78rem;font-weight:800;color:var(--ink-soft)}
.pn-empty{padding:26px 16px;text-align:center;color:var(--ink-soft);background:var(--surface);border:3px dashed var(--line);border-radius:20px;font-weight:600}
.prow{background:var(--surface);border:3px solid var(--pop);border-radius:20px;box-shadow:0 4px 0 var(--pop);overflow:hidden}
.prow.is-hidden{border-style:dashed}
.prow.is-hidden .prow-main{opacity:.7}
.prow-main{display:grid;grid-template-columns:64px minmax(0,1fr) 22px;gap:12px;align-items:center;width:100%;text-align:left;background:none;border:0;padding:10px 12px 8px 10px;color:inherit}
.pth{width:64px;height:64px;border-radius:16px;border:2.5px solid var(--pop);background:#FFE459;display:grid;place-items:center;overflow:hidden}
.pth img{width:100%;height:100%;object-fit:contain;padding:4px}
.pth svg{width:30px;height:30px;color:var(--navy-deep)}
.ptxt{display:flex;flex-direction:column;gap:2px;min-width:0}
.ptxt b{font-weight:800;font-size:1rem;line-height:1.2;overflow-wrap:anywhere}
.ptxt small{color:var(--ink-soft);font-size:.8rem;overflow-wrap:anywhere}
.ptxt .pp{font-variant-numeric:tabular-nums;font-weight:700;color:var(--ink)}
.pch{display:flex;flex-wrap:wrap;gap:5px;margin-top:3px}
.pc{font-size:.68rem;font-weight:800;border-radius:999px;padding:2px 9px;background:var(--surface-2);color:var(--ink)}
.pc.off{background:var(--navy-deep);color:#fff}
.pc.hid{background:var(--warn-bg);color:var(--warn-ink)}
.pc.sale{background:var(--promo);color:#fff}
.chev{color:var(--ink-soft)}
.chev svg{width:20px;height:20px}
.prow-act{display:flex;gap:8px;padding:8px 10px 10px;border-top:2px dashed var(--line)}
.sw{flex:1 1 0;display:flex;align-items:center;gap:8px;min-height:42px;padding:0 10px;border-radius:999px;border:2.5px solid var(--line);background:var(--bg);font-weight:700;font-size:.82rem;color:var(--ink-soft)}
.sw i{width:34px;height:20px;border-radius:999px;background:var(--line);position:relative;flex:0 0 auto}
.sw i::after{content:"";position:absolute;left:2px;top:2px;width:16px;height:16px;border-radius:50%;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.25)}
.sw[aria-checked="true"]{border-color:var(--ok);color:var(--ink)}
.sw[aria-checked="true"] i{background:var(--ok)}
.sw[aria-checked="true"] i::after{left:16px}
.pn-fab{position:fixed;left:0;right:0;bottom:0;display:flex;justify-content:center;padding:0 16px calc(14px + env(safe-area-inset-bottom,0px));pointer-events:none;z-index:45}
.pn-fab .btn{pointer-events:auto;min-height:56px;padding:0 28px;font-size:1.05rem;box-shadow:0 5px 0 var(--navy-deep),0 12px 24px rgba(4,7,27,.3)}
.pn-card{background:var(--surface);border:3px solid var(--pop);border-radius:22px;padding:16px;box-shadow:0 4px 0 var(--pop);display:flex;flex-direction:column;gap:12px}
.pn-h{font-family:var(--font-display);font-weight:400;font-size:1.4rem;line-height:1.1;text-shadow:2px 2px 0 var(--hl)}
.pn-card .two{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.photo-prev.dark{background:var(--navy)}
.cat-add{display:flex;gap:10px;align-items:flex-end}
.cat-add .field{flex:1}
.cat-add .btn{min-height:48px}
.clist{display:flex;flex-direction:column;gap:10px}
.crow{background:var(--surface);border:3px solid var(--pop);border-radius:18px;box-shadow:0 4px 0 var(--pop);padding:12px;display:flex;flex-direction:column;gap:10px}
.cname{display:flex;gap:10px;align-items:baseline;flex-wrap:wrap}
.cname b{font-family:var(--font-display);font-weight:400;font-size:1.3rem}
.cname small{color:var(--ink-soft);font-weight:700;font-size:.8rem}
.cbtn{display:flex;gap:8px;flex-wrap:wrap}
.icon-btn.sm{width:42px;height:42px;font-size:1.1rem;font-weight:800}
.icon-btn[disabled]{opacity:.4}
.cbtn .btn.sm{min-height:42px}
.promo-box{border:3px dashed var(--promo);border-radius:18px;padding:12px;display:flex;flex-direction:column;gap:12px;background:var(--bg)}
.promo-box>.check{color:var(--promo-ink)}
.promo-box #f-promo-fields{display:flex;flex-direction:column;gap:12px}
.err{font-size:.8rem;color:var(--danger);font-weight:700}
.field input[aria-invalid="true"],.field select[aria-invalid="true"]{border-color:var(--danger)}
/* inicio de sesión */
.pn-login{display:grid;place-items:start center;padding:26px 16px 40px}
.login-card{width:100%;max-width:430px;background:var(--surface);border:3px solid var(--pop);border-radius:26px;box-shadow:6px 6px 0 var(--yellow);padding:22px;display:flex;flex-direction:column;gap:14px}
.login-card form{display:flex;flex-direction:column;gap:12px}
.login-card h1{font-family:var(--font-display);font-weight:400;font-size:2rem;line-height:1.05;text-shadow:2px 2px 0 var(--hl)}
.login-logo{background:var(--navy);border-radius:18px;padding:14px;display:grid;place-items:center}
.login-logo img{width:150px;height:auto}
.demo-note{background:var(--warn-bg);color:var(--warn-ink);border-radius:16px;padding:12px 14px;display:flex;flex-direction:column;gap:8px;font-size:.88rem}
.demo-note b{font-size:.95rem}
.demo-note code{font:700 .9rem ui-monospace,Menlo,Consolas,monospace;background:rgba(255,255,255,.55);border-radius:6px;padding:1px 6px;user-select:all}
.demo-note .btn{min-height:42px}
.login-card .back{font-weight:800;color:var(--accent);text-decoration:underline;text-underline-offset:3px;align-self:flex-start;padding:6px 0}

/* botón compacto del dueño sobre el catálogo */
.dock-owner{display:flex;justify-content:flex-start}
.dock-owner .btn{min-height:40px;padding:0 16px;font-size:.86rem;border-width:2.5px;box-shadow:0 3px 0 var(--pop),0 8px 18px rgba(4,7,27,.3)}

/* aviso de la demostración */
.demo-bar.demo{background:var(--purple);font-size:.78rem;line-height:1.35}
.demo-bar.demo a{color:var(--yellow);font-weight:800;text-underline-offset:3px;white-space:nowrap}

/* ---------- monedas ---------- */
.eq{margin:2px 0 0;font-size:.74rem;line-height:1.4;color:var(--ink-soft);font-variant-numeric:tabular-nums;text-align:center;text-wrap:balance}
@media (max-width:430px){.eq{font-size:.68rem}}
.eq span{display:block}
.eq b{font-weight:800}
.eq i{font-style:normal;white-space:nowrap}
.line .sub .eq-sub{display:block;margin-top:1px}
.total-eq{display:flex;flex-direction:column;align-items:flex-end;gap:2px;margin-top:-6px;font-weight:800;font-size:1rem;color:var(--ink-soft);font-variant-numeric:tabular-nums}
.cartbar .t small.eqb{margin-top:1px}
.cur-sw{flex:none;width:100%}

/* =====================================================================================================
   DISEÑO "STICKER" — solo la página en pantalla (todo cuelga de .sk).
   El PDF arma su propia página sin .sk, así que conserva el estilo de tarjetas de arriba.
   Bordes gruesos oscuros, sombras duras, etiquetas inclinadas, puntos de semitono y fotos que saltan del panel.
   ===================================================================================================== */
.sk{--green:#1F7A3A;--rule:rgba(22,39,90,.22);--dot:rgba(22,39,90,.3);--price:#6B2F94}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .sk{--rule:rgba(255,255,255,.22);--dot:rgba(255,255,255,.2);--price:#DCC2FF}}
:root[data-theme="dark"] .sk{--rule:rgba(255,255,255,.22);--dot:rgba(255,255,255,.2);--price:#DCC2FF}

.sk main{padding-block:58px 36px}
.sk .trio{display:grid;grid-template-columns:minmax(0,1fr);gap:62px 36px;margin-bottom:62px}

/* the block: its own color, thick dark border, hard offset shadow, halftone dots in the corner */
.sk .blk{display:flex;flex-direction:column;--lab:#1F7A3A;--labink:#fff;--sh:var(--yellow);--panel:#EAF5E0;position:relative;isolation:isolate;background:var(--panel);border:4px solid var(--pop);border-radius:26px;padding:14px 14px 20px;box-shadow:8px 8px 0 var(--sh)}
@supports (color:color-mix(in srgb,red,blue)){.sk .blk{--panel:color-mix(in srgb,var(--lab) 13%,var(--surface))}}
.sk .b1{--lab:#6B2F94;--labink:#fff;--sh:var(--lime)}
.sk .b2{--lab:#213A7B;--labink:var(--yellow);--sh:var(--lilac)}
.sk .b3{--lab:#A3125F;--labink:#fff;--sh:var(--yellow)}
.sk .blk::before{content:"";position:absolute;right:0;bottom:0;width:62%;height:42%;z-index:-1;border-radius:0 0 22px 0;background:radial-gradient(circle,var(--dot) 1.7px,transparent 2.1px) 0 0/12px 12px;-webkit-mask:linear-gradient(135deg,transparent 35%,#000);mask:linear-gradient(135deg,transparent 35%,#000);opacity:.55}

/* tilted name label, half over the block's top border */
.sk .blk-head{position:relative;z-index:2;display:flex;flex-direction:column;align-items:flex-start;gap:10px;margin:-36px 0 14px -10px;padding-right:104px}
.sk .blk-tag{font-family:var(--font-display);font-weight:400;font-size:clamp(1.7rem,8.6vw,2.4rem);line-height:1;text-transform:uppercase;letter-spacing:.01em;background:var(--lab);color:var(--labink);border:4px solid var(--pop);border-radius:14px;padding:6px 16px 8px;transform:rotate(-3deg);box-shadow:5px 5px 0 var(--pop);text-wrap:balance;overflow-wrap:break-word;text-shadow:2px 2px 0 rgba(4,7,27,.35)}
.sk .blk-tag.lg{font-size:clamp(1.35rem,6.8vw,2rem)}
.sk .blk-tag.xl{font-size:clamp(1.15rem,5.6vw,1.65rem)}
.sk .blk-n{margin-left:16px;background:var(--yellow);color:var(--navy-deep);border:3px solid var(--pop);border-radius:999px;padding:1px 13px;font-weight:800;font-size:.78rem;transform:rotate(2.5deg);box-shadow:2px 2px 0 var(--pop)}

/* the real photo that jumps out of the panel, with a white sticker outline and little sparkles */
.sk .pop{position:absolute;z-index:3;right:6px;top:-52px;width:min(33%,132px);aspect-ratio:1;transform:rotate(8deg);pointer-events:none}
.sk .pop img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(3px 0 0 #fff) drop-shadow(-3px 0 0 #fff) drop-shadow(0 3px 0 #fff) drop-shadow(0 -3px 0 #fff) drop-shadow(5px 8px 0 rgba(22,39,90,.38))}
.sk .sp{position:absolute;width:24px;height:24px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 1.5l2.5 8 8 2.5-8 2.5-2.5 8-2.5-8-8-2.5 8-2.5z' fill='%23FFD800' stroke='%2316275A' stroke-width='1.5' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat}
.sk .sp.s1{left:-10px;top:20%}
.sk .sp.s2{right:-6px;top:6%;width:16px;height:16px}

/* numbered list */
.sk .its{display:flex;flex-direction:column;list-style:none;margin:18px 0 0;padding:0}
.sk .it{--stage:#FFE459;position:relative;display:grid;grid-template-columns:34px minmax(0,1fr) 88px;grid-template-areas:"num main thumb" ". buy buy";gap:6px 12px;padding:16px 0 18px;border-top:3px dashed var(--rule)}
.sk .it:first-child{border-top:0;padding-top:6px}
.sk .it.c1{--stage:#D8BAF4}.sk .it.c2{--stage:#BBD2FF}.sk .it.c3{--stage:#D3EB93}
.sk .num{grid-area:num;align-self:start;width:34px;height:34px;display:grid;place-items:center;border-radius:50%;background:var(--lab);color:var(--labink);border:3px solid var(--pop);font-family:var(--font-display);font-size:1.05rem;line-height:1}
.sk .it-main{grid-area:main;display:flex;flex-direction:column;gap:3px;min-width:0;padding-top:2px}
.sk .it-main .brand{align-self:flex-start}
.sk .it h3{font-family:var(--font-display);font-weight:400;font-size:1.32rem;line-height:1.06;text-transform:uppercase;overflow-wrap:anywhere;text-wrap:balance}
.sk .it .pack{font-size:.92rem;color:var(--ink-soft);font-weight:600}
.sk .it .desc{font-size:.84rem;color:var(--ink-soft)}

/* product photo: sits on a colored blob and spills over it */
.sk .thumb{grid-area:thumb;width:88px;height:88px;aspect-ratio:auto;overflow:visible}
.sk .thumb img{inset:-8px;width:calc(100% + 16px);height:calc(100% + 12px);padding:0;filter:drop-shadow(2px 0 0 #fff) drop-shadow(-2px 0 0 #fff) drop-shadow(0 2px 0 #fff) drop-shadow(0 -2px 0 #fff) drop-shadow(3px 5px 0 rgba(22,39,90,.34))}
.sk .thumb .noimg{font-size:0}
.sk .thumb .flag{right:-6px;top:-8px;max-width:none;white-space:nowrap;font-size:.62rem;padding:2px 7px;border-width:1.5px;border-radius:8px}
.sk .thumb .soldout{font-size:.78rem;left:-6px;right:-6px;top:40%;padding:2px;border-block-width:2px}
.sk .it.off .thumb img{opacity:.5;filter:grayscale(.7)}
.sk .it.off .pr{opacity:.6}

/* prices (mayor / detal) + currency lines + buy button */
.sk .it-buy{grid-area:buy;display:flex;flex-direction:column;align-items:flex-start;gap:8px;min-width:0}
.sk .prs{display:flex;flex-wrap:wrap;gap:8px 10px}
.sk .pr{display:flex;flex-direction:column;align-items:flex-start;gap:0;min-width:0;background:var(--surface);color:var(--ink);border:3px solid var(--pop);border-radius:16px;padding:3px 11px 5px;box-shadow:3px 3px 0 var(--pop)}
.sk .pr .pl{font-size:.64rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft);line-height:1.3}
.sk .pr .pv{display:flex;align-items:baseline;gap:3px}
.sk .pr b{font-family:var(--font-display);font-weight:400;font-size:1.5rem;line-height:1.05;color:var(--price);font-variant-numeric:tabular-nums;white-space:nowrap}
.sk .pr i{font-style:normal;font-weight:800;font-size:.8rem;color:var(--ink-soft)}
.sk .pr s{font-size:.78rem;font-weight:700;color:var(--ink-soft);line-height:1.1}
.sk .pr.sale{border-color:var(--promo)}
.sk .pr.sale b{color:var(--promo-ink)}
.sk .pr.ask{border-style:dashed;box-shadow:none}
.sk .pr.ask b{font-family:var(--font-body);font-size:.95rem;font-weight:800;color:var(--ink-soft)}
.sk .it .eq{text-align:left;font-size:.76rem}
.sk .it .until{font-size:.76rem}
.sk .it .buy{margin-top:0;padding-top:4px;width:100%;max-width:none}
.sk .it .buy .btn,.sk .it .buy .stepper{width:100%;max-width:260px}

@media (hover:hover) and (prefers-reduced-motion:no-preference){.sk .it:hover .stage{transform:translateY(-5px) rotate(-2deg) scale(1.05)}}
@media (prefers-reduced-motion:no-preference){
  .sk .blk.rv{opacity:0;transform:translateY(38px) scale(.97)}
  .sk .blk.rv.in{opacity:1;transform:none;transition:opacity .5s ease,transform .7s cubic-bezier(.2,1.1,.3,1.25)}
  .sk .pop{animation:popin 6s ease-in-out infinite}
  @keyframes popin{0%,100%{transform:rotate(8deg) translateY(0)}50%{transform:rotate(5deg) translateY(-5px)}}
}

/* computer: groups of three = one tall block on the left, two stacked on the right */
@media (min-width:900px){
  .sk .trio.t2,.sk .trio.t3{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}
  .sk .trio.t3>.blk:first-child{grid-row:1/span 2;align-self:stretch}
  .sk .trio.t1 .its{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:44px}
  .sk .trio.t1 .it:nth-child(2){border-top:0;padding-top:6px}
  .sk .blk{padding:16px 22px 24px}
  .sk .pop{width:min(30%,170px);top:-56px}
  .sk .blk-head{padding-right:min(34%,190px)}
}

/* logo sticker at the bottom of the tall block (computer only) */
.sk .blk-foot{display:none}
@media (min-width:900px){
  .sk .tall .blk-foot{display:block;margin-top:auto;padding-top:36px;text-align:center}
  .sk .tall .blk-foot img{display:inline-block;width:min(210px,62%);height:auto;transform:rotate(-4deg);filter:drop-shadow(4px 5px 0 rgba(22,39,90,.4))}
}

/* ===== PÓSTER: portada, fondo y cierre al estilo de las referencias (solo la página, no el PDF) ===== */
.sk{min-height:100vh;color:var(--ink);background:
 radial-gradient(circle at 88% 0,rgba(107,47,148,.75),transparent 46%),
 radial-gradient(circle,rgba(255,216,0,.2) 1.7px,transparent 2.2px) 0 0/17px 17px,
 linear-gradient(180deg,#1E3577 0,#14224F 55%,#101B43 100%);background-color:#14224F}
.sk .hero{background:transparent;overflow:visible;z-index:2}
.sk .hero::before,.sk .lolli{display:none}
.sk .awning{filter:drop-shadow(0 4px 0 rgba(4,7,27,.5))}
.sk .hero-in{display:grid;grid-template-columns:minmax(0,1fr) 124px;grid-template-areas:"logo burst" "copy copy" "cta cta" "pics pics";gap:6px 12px;align-items:center;padding-block:22px 0;justify-content:stretch}
.sk .hero-logo{grid-area:logo;width:min(230px,58vw);order:0;justify-self:start}
.sk .hero-copy{grid-area:copy;flex:none;order:0}
.sk .eyebrow{background:var(--purple);color:#fff;border:3px solid #fff;box-shadow:3px 3px 0 rgba(0,0,0,.4);font-size:.7rem}
.sk .hero h1{font-size:clamp(3.7rem,22vw,6.2rem);line-height:.86;text-transform:uppercase;letter-spacing:.01em;margin-top:14px;color:#fff;-webkit-text-stroke:7px var(--navy-deep);paint-order:stroke fill;text-shadow:5px 6px 0 var(--purple);text-wrap:balance;overflow-wrap:anywhere}
.sk .hero h1 mark{background:none;box-shadow:none;transform:none;padding:0;color:var(--yellow);display:inline;text-shadow:5px 6px 0 var(--purple)}
.sk .note{font-size:clamp(1.45rem,6vw,2.1rem);margin-top:16px;color:var(--yellow);text-shadow:2px 2px 0 rgba(0,0,0,.45)}
.sk .lead{color:#fff;font-weight:600}
.sk .perks li:not(.act){display:none}
.sk .perks{margin-top:12px}
.sk .burst{grid-area:burst;position:relative;width:124px;aspect-ratio:1;transform:rotate(9deg);justify-self:end;filter:drop-shadow(4px 5px 0 rgba(0,0,0,.45))}
.sk .burst::before,.sk .burst span{content:"";position:absolute;clip-path:var(--star)}
.sk .burst::before{inset:0;background:var(--navy-deep)}
.sk .burst span{inset:5px;background:var(--yellow);display:flex;align-items:center;justify-content:center;text-align:center;font-family:var(--font-display);text-transform:uppercase;font-size:.9rem;line-height:1.05;color:var(--navy-deep)}
.sk .wa-cta{grid-area:cta;justify-self:start;margin-top:10px;display:inline-flex;align-items:center;gap:10px;background:#0F5A2D;color:#fff;border:4px solid #FFF4D6;border-radius:20px;padding:8px 18px 8px 12px;font-family:var(--font-display);text-transform:uppercase;line-height:1;font-size:1.08rem;box-shadow:5px 5px 0 rgba(0,0,0,.45);transform:rotate(-1.5deg);text-decoration:none;min-height:56px}
.sk .wa-cta svg{width:34px;height:34px;flex:none}
.sk .wa-cta[hidden]{display:none}
.sk .hero-pics{grid-area:pics;display:flex;justify-content:center;align-items:flex-end;margin:14px 0 34px;position:relative;z-index:3;pointer-events:none}
.sk .hp{width:min(30vw,128px);height:auto;object-fit:contain;filter:drop-shadow(3px 0 0 #fff) drop-shadow(-3px 0 0 #fff) drop-shadow(0 3px 0 #fff) drop-shadow(0 -3px 0 #fff) drop-shadow(5px 7px 0 rgba(0,0,0,.4))}
.sk .hp1{transform:rotate(-9deg) translateY(10px);margin-right:-14px}
.sk .hp2{transform:rotate(4deg) scale(1.18);z-index:1}
.sk .hp3{transform:rotate(11deg) translateY(8px);margin-left:-14px}
.sk #catalog{padding-top:44px;position:relative;z-index:1}
.sk .wa-ban{display:flex;align-items:center;justify-content:center;gap:12px;width:calc(100% - 32px);max-width:1088px;margin:48px auto 0;padding:12px 16px;background:#0F5A2D;color:#fff;border:4px solid #FFF4D6;border-radius:22px;box-shadow:6px 6px 0 rgba(0,0,0,.45);font-family:var(--font-display);text-transform:uppercase;font-size:clamp(1.25rem,5.6vw,2.6rem);line-height:1;text-align:left;text-decoration:none}
.sk .wa-ban em{font-style:normal;color:var(--yellow)}
.sk .wa-ban-ic svg{width:clamp(36px,9vw,64px);height:auto;display:block}
.sk .foot{margin-top:46px;background:transparent}
.sk .foot::before{display:none}
.sk .toolbar{background:var(--navy-deep)}
.sk .toolbar::after{display:none}
.sk .toolbar{border-bottom:4px solid var(--yellow)}
@media (min-width:900px){
 .sk .hero-in{grid-template-columns:270px minmax(0,1fr) 250px;grid-template-areas:"logo copy burst" "pics copy cta";gap:10px 28px;padding-block:34px 0;align-items:start}
 .sk .hero-logo{width:270px}
 .sk .hero h1{font-size:clamp(5rem,8.4vw,8rem);-webkit-text-stroke:9px var(--navy-deep);margin-top:6px}
 .sk .burst{width:220px}
 .sk .burst span{font-size:1.45rem}
 .sk .wa-cta{align-self:start;justify-self:end;font-size:1.3rem}
 .sk .hero-pics{justify-content:flex-start;margin:0;align-self:end}
 .sk .hp{width:104px}
 .sk .hp2{transform:rotate(4deg) scale(1.3)}
 .sk .hero-pics{padding-left:8px}
 .sk #catalog{padding-top:60px}
}
@media (prefers-reduced-motion:no-preference){
 .sk .burst{animation:burstPulse 3.2s ease-in-out infinite}
 @keyframes burstPulse{50%{transform:rotate(5deg) scale(1.05)}}
}

/* ===== más fuerza: títulos gigantes y segunda foto que salta ===== */
.sk .blk{padding-bottom:58px}
.sk .blk-tag{font-size:clamp(2.1rem,11.5vw,3.1rem);-webkit-text-stroke:5px var(--pop);paint-order:stroke fill;color:#fff;background:var(--lab);text-shadow:3px 3px 0 var(--pop)}
.sk .blk-tag.lg{font-size:clamp(1.6rem,8.4vw,2.4rem)}
.sk .blk-tag.xl{font-size:clamp(1.3rem,6.6vw,1.9rem)}
.sk .pop{width:min(40%,168px);top:-64px}
.sk .pop2{top:auto;bottom:-30px;right:-12px;left:auto;width:min(30%,118px);transform:rotate(-10deg);z-index:4}
.sk .blk-n{font-size:.84rem}
@media (min-width:900px){
 .sk .blk-tag{font-size:clamp(2.6rem,4.2vw,3.7rem)}
 .sk .blk-tag.lg{font-size:clamp(2rem,3.2vw,2.8rem)}
 .sk .blk-tag.xl{font-size:clamp(1.6rem,2.4vw,2.1rem)}
 .sk .pop{width:min(34%,230px);top:-78px}
 .sk .pop2{top:auto;width:min(22%,150px);bottom:-36px}
}

/* ===== PASO 2: OFERTAS en columnas (morado / magenta / rosa neón) ===== */
.sk{--o0:#5B2A9A;--o1:#A3125F;--o2:#E0197D}
.sk .ofr{display:flex;align-items:stretch;margin:0 0 70px;border:4px solid #0B0F25;border-radius:26px;background:#0B0F25;box-shadow:8px 8px 0 rgba(0,0,0,.5);position:relative}
.sk .ofr-side{flex:0 0 58px;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;background:#0B0F25;color:#fff;border-radius:22px 0 0 22px;padding:14px 0}
.sk .ofr-side h2{font-family:var(--font-display);font-weight:400;text-transform:uppercase;font-size:2.6rem;line-height:1;letter-spacing:.06em;writing-mode:vertical-rl;transform:rotate(180deg);color:#fff;-webkit-text-stroke:0;text-shadow:3px 3px 0 var(--o2)}
.sk .ofr-lab{position:absolute;left:50%;top:50%;width:max-content;max-width:200px;transform:translate(-50%,-50%) rotate(-90deg);transform-origin:center;background:var(--yellow);color:var(--navy-deep);border:3px solid #fff;border-radius:10px;padding:3px 10px;font-weight:800;font-size:.8rem;line-height:1.15;text-align:center;box-shadow:3px 3px 0 var(--o2);z-index:3;display:none}
.sk .ofr-lab b{font-family:var(--font-display);font-weight:400;font-size:1.15em}
.sk .ofr-cols{flex:1;min-width:0;display:flex;gap:0;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;border-radius:0 22px 22px 0}
.sk .ofr-cols::-webkit-scrollbar{display:none}
.sk .oc{flex:0 0 min(74%,250px);scroll-snap-align:start;display:flex;flex-direction:column;align-items:center;text-align:center;gap:4px;padding:16px 12px 16px;color:#fff;position:relative;background:var(--oc);border-left:3px solid #0B0F25}
.sk .oc::before{content:"";position:absolute;inset:0;background:radial-gradient(circle,rgba(255,255,255,.16) 1.4px,transparent 1.9px) 0 0/12px 12px;pointer-events:none;-webkit-mask:linear-gradient(180deg,#000,transparent 70%);mask:linear-gradient(180deg,#000,transparent 70%)}
.sk .oc>*{position:relative}
.sk .oc.o0{--oc:var(--o0)}.sk .oc.o1{--oc:var(--o1)}.sk .oc.o2{--oc:var(--o2)}
.sk .oc-t{font-family:var(--font-display);font-weight:400;text-transform:uppercase;font-size:1.65rem;line-height:.95;color:#fff;-webkit-text-stroke:5px #0B0F25;paint-order:stroke fill;text-shadow:3px 3px 0 #0B0F25;text-wrap:balance;overflow-wrap:anywhere;transform:rotate(-2deg);min-height:2.6em;display:flex;align-items:center;justify-content:center}
.sk .oc-pk{font-size:.78rem;font-weight:700;opacity:.95}
.sk .oc-pic{width:100%;aspect-ratio:1;max-height:200px;display:grid;place-items:center;position:relative;margin:4px 0 0;overflow:visible}
.sk .oc-pic img{position:static;width:100%;height:100%;max-width:190px;object-fit:contain;transform:rotate(-4deg) scale(1.08);filter:drop-shadow(3px 0 0 #fff) drop-shadow(-3px 0 0 #fff) drop-shadow(0 3px 0 #fff) drop-shadow(0 -3px 0 #fff) drop-shadow(5px 8px 0 rgba(0,0,0,.38))}
.sk .oc-pic .noimg{width:120px;height:120px;color:#fff}
.sk .oc-pct{position:absolute;right:0;top:-4px;z-index:2;width:62px;aspect-ratio:1;display:grid;place-items:center;background:var(--yellow);color:var(--navy-deep);clip-path:var(--star);font-family:var(--font-display);font-size:.95rem;transform:rotate(10deg)}
.sk .oc-pct b{font-weight:400;line-height:1}
.sk .oc-was{font-weight:800;font-size:.86rem;margin-top:6px}
.sk .oc-was s{font-size:1.05rem;opacity:.92;text-decoration-thickness:2.5px}
.sk .oc-new{font-family:var(--font-display);font-size:2.7rem;line-height:1;color:var(--yellow);text-shadow:3px 3px 0 #0B0F25;-webkit-text-stroke:4px #0B0F25;paint-order:stroke fill;font-variant-numeric:tabular-nums}
.sk .oc-new i{font-style:normal;font-size:.9rem;margin-left:3px;-webkit-text-stroke:0;text-shadow:none;color:#fff;font-family:var(--font-body);font-weight:800}
.sk .oc-o{font-size:.86rem;font-weight:700}
.sk .oc-o s{opacity:.85}
.sk .oc-until{font-size:.78rem;font-weight:800;background:#0B0F25;border-radius:999px;padding:2px 10px}
.sk .oc .buy{width:100%;margin-top:8px}
.sk .oc .buy .btn.add{width:100%;background:var(--yellow);color:var(--navy-deep);border:3px solid #0B0F25;box-shadow:3px 3px 0 #0B0F25}
.sk .oc .stepper{margin-inline:auto}
.sk .ofr-side .ofr-lab{display:block}
@media (min-width:900px){
 .sk .ofr-side{flex-basis:92px}
 .sk .ofr-side h2{font-size:4.2rem}
 .sk .ofr-lab{max-width:260px;font-size:.95rem}
 .sk .oc{flex:1 0 0;min-width:240px;padding:20px 16px 20px}
 .sk .oc-t{font-size:2.1rem}
 .sk .oc-new{font-size:3.3rem}
 .sk .oc-pic{max-height:230px}
 .sk .oc-pic img{max-width:230px}
}
/* ajustes de las ofertas */
.sk .ofr-side{gap:16px;justify-content:flex-start;padding-top:22px}
.sk .ofr-lab{position:static;transform:rotate(180deg);writing-mode:vertical-rl;max-width:none;width:auto;padding:10px 4px;font-size:.78rem;display:block}
.sk .oc-pic{aspect-ratio:auto;height:176px;max-height:none;width:100%}
.sk .oc-pic img{width:auto;height:100%;max-width:100%;max-height:100%}
@media (min-width:900px){
 .sk .oc-pic{height:236px}
 .sk .oc-pic img{max-width:100%}
 .sk .ofr-lab{font-size:.92rem;padding:12px 6px}
}
.sk .oc-pic{margin-bottom:16px}
.sk .oc-pic img{transform:rotate(-4deg) scale(.96)}

/* ===== PASO 3: DETALLE DEL PRODUCTO ===== */
.sk .nm{all:unset;cursor:pointer;display:inline;color:inherit;font:inherit;text-transform:inherit;text-shadow:inherit;-webkit-text-stroke:inherit;paint-order:stroke fill;text-align:inherit;overflow-wrap:anywhere}
.sk .nm:hover{text-decoration:underline;text-decoration-thickness:3px;text-underline-offset:3px}
.sk .nm:focus-visible{outline:3px solid var(--yellow);outline-offset:3px;border-radius:6px}
.sk .oc .nm:focus-visible{outline-color:#fff}
.sk [data-act="detail"].stage,.sk [data-act="detail"].thumb{cursor:pointer}
.sheet-dt{max-width:640px}
.sheet-dt .sheet-head h2{font-family:var(--font-display);font-weight:400;text-transform:uppercase;font-size:1.5rem;line-height:1.05}
.dt{display:flex;flex-direction:column;gap:14px}
.dt-hero{--stage:#FFE459;position:relative;margin:4px 0 0;border:3px solid var(--pop);border-radius:22px;background:color-mix(in srgb,var(--stage) 70%,#fff);box-shadow:5px 5px 0 var(--pop);padding:40px 14px 14px;overflow:visible;background-image:radial-gradient(circle,rgba(22,39,90,.12) 1.4px,transparent 1.9px);background-size:12px 12px}
.dt-hero.c0{--stage:#FFE459}.dt-hero.c1{--stage:#D8BAF4}.dt-hero.c2{--stage:#BBD2FF}.dt-hero.c3{--stage:#D3EB93}
.dt-pic{width:min(100%,320px);height:260px;aspect-ratio:auto;margin:-72px auto 0;display:grid;place-items:center}
.dt-pic img{position:static;width:auto;height:100%;max-width:100%;padding:0;transform:rotate(-4deg);animation:none;filter:drop-shadow(4px 0 0 #fff) drop-shadow(-4px 0 0 #fff) drop-shadow(0 4px 0 #fff) drop-shadow(0 -4px 0 #fff) drop-shadow(6px 9px 0 rgba(22,39,90,.35))}
.dt-pic .noimg{width:140px;height:140px;color:var(--navy)}
.dt-pic .flag{right:6px;top:-2px;font-size:.9rem}
.dt-pic .soldout{left:0;right:0;top:44%}
.dt-brand{align-self:flex-start;background:var(--accent-soft);color:var(--accent);border-radius:8px;padding:2px 10px;font-size:.76rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase}
.dt-desc{font-size:1.02rem;color:var(--ink)}
.dt-facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.dt-facts li{display:flex;flex-direction:column;gap:1px;border:3px solid var(--pop);border-radius:14px;padding:6px 12px;background:var(--surface);box-shadow:3px 3px 0 var(--pop);min-width:0}
.dt-facts li:nth-child(odd){transform:rotate(-.6deg)}.dt-facts li:nth-child(even){transform:rotate(.6deg)}
.dt-facts span{font-size:.68rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft)}
.dt-facts b{font-family:var(--font-display);font-weight:400;font-size:1.15rem;line-height:1.1;overflow-wrap:anywhere}
.dt-box{border:4px solid var(--pop);border-radius:22px;background:linear-gradient(180deg,var(--accent-soft),var(--surface));box-shadow:6px 6px 0 var(--purple);padding:14px;display:flex;flex-direction:column;gap:10px}
.dt-prices{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.dt-p{display:flex;flex-direction:column;align-items:center;text-align:center;gap:0;background:var(--surface);border:3px solid var(--pop);border-radius:16px;padding:8px 6px 8px;box-shadow:3px 3px 0 var(--pop);min-width:0}
.dt-p.sale{border-color:var(--promo)}
.dt-l{font-family:var(--font-display);font-size:1rem;text-transform:uppercase;letter-spacing:.03em;background:var(--navy);color:#fff;border-radius:8px;padding:1px 10px;transform:rotate(-2deg)}
.dt-p:nth-child(2) .dt-l{background:var(--purple)}
.dt-p s{font-size:.9rem;font-weight:700;color:var(--ink-soft);margin-top:4px}
.dt-v{font-family:var(--font-display);font-weight:400;font-size:clamp(1.9rem,9vw,2.6rem);line-height:1.05;color:var(--price);font-variant-numeric:tabular-nums;white-space:nowrap}
.dt-p.sale .dt-v{color:var(--promo-ink)}
.dt-s{font-size:.78rem;font-weight:800;color:var(--ink-soft)}
.dt-box .eq{text-align:center}
.dt-box .until{text-align:center;font-weight:800;color:var(--promo-ink);font-size:.86rem}
.dt-box .buy{width:100%}
.dt-box .buy .btn.add{width:100%;min-height:56px;font-size:1.1rem;background:var(--yellow);color:var(--navy-deep);border:3px solid var(--pop);box-shadow:4px 4px 0 var(--pop);font-family:var(--font-display);text-transform:uppercase;letter-spacing:.03em}
.dt-box .stepper{margin-inline:auto}
@media (min-width:700px){
 .sheet-dt{max-width:860px}
 .dt{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:14px 22px;align-items:start}
 .dt-hero{grid-row:1/span 3;padding-top:50px}
 .dt-pic{height:340px;width:100%}
 .dt-brand,.dt-desc,.dt-facts{grid-column:2}
 .dt-box{grid-column:2}
}
.sk .dt-pic,.dt-pic{margin-top:0}
.dt-hero{padding-top:22px}
.sk .dt-box .buy .btn.add,.sk .dt-box .buy{width:100%;max-width:none}
.sk .dt-box .buy .btn.add{display:flex;justify-content:center}
@media (min-width:700px){.dt-hero{align-self:start;padding-top:26px}.dt-pic{height:320px}}
@media (min-width:700px){.dt{align-content:start;grid-auto-rows:min-content}.dt-hero{grid-row:1/span 4}}

/* ===== PASO 4: PRODUCTO ESTRELLA con sabores y tamaños ===== */
.sk .star{position:relative;margin:0 0 70px;border:4px solid #0B0F25;border-radius:28px;background:var(--yellow);color:var(--navy-deep);box-shadow:8px 8px 0 rgba(0,0,0,.5);padding:0 14px 20px;overflow:visible}
.sk .star::before{content:"";position:absolute;inset:0;border-radius:24px;background:radial-gradient(circle,rgba(107,47,148,.2) 1.7px,transparent 2.2px) 0 0/15px 15px;-webkit-mask:linear-gradient(180deg,#000,transparent 55%);mask:linear-gradient(180deg,#000,transparent 55%);pointer-events:none}
.sk .star>*{position:relative}
.sk .star-top{display:flex;flex-direction:column;align-items:center;text-align:center;padding-top:6px}
.sk .star-pic{position:relative;width:min(70%,250px);aspect-ratio:1;margin-top:-52px;z-index:3}
.sk .star-pic img{width:100%;height:100%;object-fit:contain;transform:rotate(-5deg);filter:drop-shadow(4px 0 0 #fff) drop-shadow(-4px 0 0 #fff) drop-shadow(0 4px 0 #fff) drop-shadow(0 -4px 0 #fff) drop-shadow(7px 10px 0 rgba(22,39,90,.4))}
.sk .star-pic .s1{left:-6px;top:16%}.sk .star-pic .s2{right:-4px;top:2%;width:18px;height:18px}
.sk .star-t{font-family:var(--font-display);font-weight:400;text-transform:uppercase;font-size:clamp(4.4rem,26vw,7.5rem);line-height:.84;color:#fff;-webkit-text-stroke:9px var(--purple);paint-order:stroke fill;text-shadow:6px 7px 0 var(--navy-deep);margin-top:-6px;overflow-wrap:anywhere;transform:rotate(-2deg)}
.sk .star-sub{margin-top:14px;font-weight:800;background:var(--navy-deep);color:#fff;border-radius:999px;padding:3px 14px;font-size:.88rem}
.sk .star-h{font-family:var(--font-script);font-weight:400;font-size:2rem;line-height:1;margin:22px 0 10px;color:var(--purple);transform:rotate(-1.5deg);text-shadow:2px 2px 0 rgba(255,255,255,.6)}
.sk .star-grid{display:grid;grid-template-columns:1fr;gap:12px;list-style:none;padding:0;margin:0}
.sk .sv{--stage:#fff;display:flex;flex-direction:column;gap:6px;background:var(--surface);color:var(--ink);border:3.5px solid #0B0F25;border-radius:20px;padding:10px 12px 12px 54px;box-shadow:4px 4px 0 #0B0F25;position:relative;min-width:0}
.sk .sv .num{position:absolute;left:10px;top:10px;grid-area:auto}
.sk .sv h4{font-family:var(--font-display);font-weight:400;font-size:1.4rem;line-height:1.05;text-transform:uppercase;overflow-wrap:anywhere}
.sk .sv-ref{font-size:.76rem;font-weight:800;color:var(--ink-soft);letter-spacing:.06em}
.sk .sv .prs,.sk .sa .prs{display:flex;gap:8px;flex-wrap:wrap}
.sk .sv .buy{width:100%}
.sk .sv .buy .btn.add,.sk .sa .buy .btn.add{width:100%}
.sk .sv.off{opacity:.8}
.sk .star-h2{margin-top:26px}
.sk .star-also{display:flex;flex-direction:column;gap:10px;list-style:none;padding:0;margin:0}
.sk .sa{display:grid;grid-template-columns:1fr;gap:6px;background:#fff;color:var(--ink);border:3.5px dashed var(--purple);border-radius:18px;padding:10px 12px;min-width:0}
.sk .sa-i{display:flex;flex-direction:column;gap:1px;min-width:0}
.sk .sa .nm{font-family:var(--font-display);font-size:1.25rem;text-transform:uppercase;line-height:1.05}
.sk .sa-pk{font-size:.84rem;font-weight:700;color:var(--ink-soft)}
.sk .star .btn.add{background:var(--navy);color:#fff;border:3px solid #0B0F25;box-shadow:3px 3px 0 #0B0F25}
.sk .star .stepper{margin-inline:auto}
@media (min-width:900px){
 .sk .star{padding:0 28px 28px;display:grid;grid-template-columns:minmax(260px,.9fr) minmax(0,1.5fr);column-gap:34px;align-items:start}
 .sk .star-top{grid-row:1/span 4;position:sticky;top:130px;padding-top:30px}
 .sk .star-pic{width:min(100%,320px);margin-top:-70px}
 .sk .star-h,.sk .star-grid,.sk .star-also{grid-column:2}
 .sk .star-h:first-of-type{margin-top:26px}
 .sk .star-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .sk .sa{grid-template-columns:1fr auto auto;align-items:center}
 .sk .sa .buy{width:150px}
}
.sk .star-t{z-index:4}
.sk .star-pic{margin-bottom:-18px}
.sk .sv .prs,.sk .sv .it-buy{margin:0}
.sk .sv h4{min-height:0;padding-top:4px}
.sk .sv .num{top:12px}

/* =====================================================================
   TIENDA (clase .st): oscuro elegante, estilo tienda en línea (Nike / Adidas / Shein).
   El estilo afiche de arriba (.sk) queda guardado para el PDF; la tienda ya no lo usa.
   ===================================================================== */
.st{--bg:#0C1330;--surface:#16204A;--surface-2:#1E2A5E;--ink:#F2EFFF;--ink-soft:#B6B2E0;--line:#2B3670;--accent:#DCC2FF;--accent-soft:#2D2366;--pop:#7B5CC4;--hl:#6B2F94;--price:#fff;--sale:#FF5FA2;--photo:linear-gradient(160deg,#FFFFFF 0,#E9EDF9 100%);
 color:var(--ink);min-height:100vh;background:radial-gradient(900px 480px at 85% -80px,rgba(107,47,148,.55),transparent 70%),radial-gradient(700px 420px at -10% 8%,rgba(33,58,123,.7),transparent 70%),#0C1330;color-scheme:dark}
.st .awning,.st .lolli,.st .burst,.st .hero-pics,.st .wa-ban,.st .hero::before{display:none}
/* encabezado */
.st .hero{background:transparent;overflow:visible}
.st .hero-in{display:flex;flex-direction:column;align-items:flex-start;gap:14px;padding-block:26px 22px}
.st .hero-logo{width:min(180px,46vw);transform:none;filter:drop-shadow(0 4px 14px rgba(0,0,0,.45));order:0}
.st .hero-copy{order:1;flex:none;width:100%}
.st .eyebrow{background:transparent;color:var(--yellow);border:0;padding:0;letter-spacing:.22em;font-size:.72rem;transform:none;box-shadow:none}
.st .hero h1{font-size:clamp(2.3rem,9.5vw,4rem);line-height:1;text-transform:none;margin-top:8px;color:#fff;-webkit-text-stroke:0;text-shadow:none;letter-spacing:.005em}
.st .hero h1 mark{background:none;color:var(--yellow);padding:0;transform:none;box-shadow:none;display:inline;text-shadow:none}
.st .note{font-family:var(--font-body);font-weight:700;font-size:1.02rem;color:var(--yellow);transform:none;margin-top:10px;text-shadow:none}
.st .lead{color:var(--ink-soft);font-weight:500;max-width:52ch}
.st .perks{margin-top:14px;gap:8px}
.st .perks li:not(.act){display:inline-flex;background:rgba(255,255,255,.07);color:#fff;border:1px solid rgba(255,255,255,.22);box-shadow:none;transform:none;border-radius:999px;padding:6px 14px;font-weight:700;font-size:.82rem}
.st .perks li:nth-child(2){background:rgba(255,255,255,.07);transform:none}
.st .perks .btn{background:transparent;color:#fff;border:1px solid rgba(255,255,255,.35);box-shadow:none;border-radius:999px;min-height:36px;font-size:.82rem}
.st .wa-cta{display:inline-flex;margin-top:0;align-items:center;gap:10px;background:#1FA855;color:#fff;border:0;border-radius:999px;padding:10px 20px 10px 14px;font-family:var(--font-body);font-weight:800;text-transform:none;font-size:.95rem;line-height:1.1;box-shadow:0 6px 18px rgba(31,168,85,.35);transform:none;min-height:46px;text-decoration:none;order:2}
.st .wa-cta br{display:none}
.st .wa-cta svg{width:24px;height:24px}
@media (min-width:900px){.st .hero-in{flex-direction:row;align-items:center;justify-content:space-between;padding-block:44px 34px;gap:40px}.st .hero-logo{width:230px;order:2}.st .hero-copy{order:1;width:auto;flex:1}.st .wa-cta{order:3}}
/* barra fija */
.st .toolbar{background:rgba(12,19,48,.86);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-bottom:1px solid rgba(255,255,255,.1)}
.st .toolbar::after{display:none}
.st .toolbar-in{padding-block:10px}
.st .search input{height:46px;border-radius:12px;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.08);color:#fff;box-shadow:none;font-weight:500}
.st .search input::placeholder{color:#9FA6D6}
.st .search svg{color:#B6B2E0}
.st .search input:focus{border-color:var(--yellow);box-shadow:0 0 0 3px rgba(255,216,0,.25)}
.st .chip{height:36px;border-radius:999px;border:1px solid rgba(255,255,255,.25);background:transparent;color:#fff;font-weight:700;font-size:.86rem}
.st .chip[aria-pressed="true"]{background:#fff;color:#0C1330;border-color:#fff;box-shadow:none}
.st .chip-sale[aria-pressed="false"]{background:transparent;border-color:var(--sale);color:#FFB3D2}
.st .chip-sale[aria-pressed="true"]{background:var(--sale);color:#fff;border-color:var(--sale);box-shadow:none}
/* contenido */
.st #catalog{padding-top:26px;padding-bottom:20px}
.st .cs{margin:0 0 46px}
.st .cs-h{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:16px;padding-bottom:10px;border-bottom:1px solid rgba(255,255,255,.14);position:relative}
.st .cs-h::after{content:"";position:absolute;left:0;bottom:-1px;width:64px;height:3px;background:var(--yellow);border-radius:3px}
.st .cs-h h2{font-family:var(--font-display);font-weight:400;font-size:clamp(1.7rem,6vw,2.4rem);text-transform:uppercase;letter-spacing:.02em;color:#fff;line-height:1}
.st .cs-h span{font-size:.84rem;font-weight:700;color:var(--ink-soft);white-space:nowrap}
.st .pg{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
@media (min-width:700px){.st .pg{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}}
@media (min-width:1000px){.st .pg{grid-template-columns:repeat(4,minmax(0,1fr))}}
.st .tc{display:flex;flex-direction:column;background:var(--surface);border:1px solid rgba(255,255,255,.1);border-radius:18px;overflow:hidden;box-shadow:0 8px 24px rgba(0,0,0,.28);transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;min-width:0}
.st .pc-img{position:relative;width:100%;aspect-ratio:1;background:var(--photo);display:grid;place-items:center;cursor:pointer;overflow:hidden}
.st .pc-img img{position:static;width:86%;height:86%;object-fit:contain;padding:0;filter:drop-shadow(0 8px 10px rgba(22,39,90,.22));transition:transform .35s cubic-bezier(.2,1.2,.3,1)}
.st .pc-img .noimg{width:46%;height:46%;color:#B7C0E6}
.st .pc-flag{position:absolute;left:10px;top:10px;background:var(--sale);color:#fff;font-weight:800;font-size:.78rem;border-radius:8px;padding:3px 9px;letter-spacing:.02em;z-index:2}
.st .pc-img .soldout{left:0;right:0;top:44%;font-size:.8rem}
.st .tc.off .pc-img img{opacity:.45;filter:grayscale(.7)}
.st .pc-b{display:flex;flex-direction:column;gap:3px;padding:12px 12px 14px;flex:1}
.st .pc-br{font-size:.68rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--accent)}
.st .tc h3{font-family:var(--font-body);font-weight:800;font-size:1rem;line-height:1.2;color:#fff;text-transform:none}
.st .pc-pk{font-size:.8rem;color:var(--ink-soft);font-weight:500}
.st .pcp{display:flex;flex-direction:column;gap:2px;margin-top:8px}
.st .pcp-r{display:flex;align-items:baseline;gap:6px;flex-wrap:wrap}
.st .pcp-r span{font-size:.7rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft);min-width:48px}
.st .pcp-r b{font-size:1.18rem;font-weight:800;color:#fff;font-variant-numeric:tabular-nums;font-family:var(--font-body)}
.st .pcp-r s{font-size:.8rem;color:#8A91C4;font-weight:600}
.st .pcp-r.sale b{color:var(--sale)}
.st .pcp-r.ask b{font-size:.92rem;color:var(--ink-soft)}
.st .tc .eq{font-size:.72rem;color:#9AA2D4;margin-top:4px;display:flex;flex-direction:column;gap:0}
.st .tc .until{font-size:.74rem;font-weight:700;color:#FFB3D2;margin-top:4px}
.st .tc .buy{margin-top:auto;padding-top:10px}
.st .tc .btn.add,.st .oc .btn.add,.st .sv .btn.add,.st .sa .btn.add{width:100%;min-height:44px;border-radius:12px;background:var(--yellow);color:#0C1330;border:0;box-shadow:none;font-weight:800;font-size:.92rem;font-family:var(--font-body);text-transform:none;letter-spacing:0}
.st .btn.add:disabled{background:rgba(255,255,255,.12);color:#9AA2D4}
.st .stepper{margin-inline:auto;border-radius:12px}
@media (hover:hover) and (prefers-reduced-motion:no-preference){
 .st .tc:hover{transform:translateY(-6px);box-shadow:0 16px 34px rgba(0,0,0,.4);border-color:rgba(255,216,0,.55)}
 .st .tc:hover .pc-img img{transform:scale(1.08) rotate(-2deg)}
 .st .btn.add:hover{filter:brightness(1.06)}
}
@media (prefers-reduced-motion:no-preference){
 .st .tc.rv{opacity:0;transform:translateY(30px)}
 .st .tc.rv.in{opacity:1;transform:none;transition:opacity .5s ease var(--d,0s),transform .6s cubic-bezier(.2,1,.3,1) var(--d,0s)}
 .st .ofr.rv,.st .star.rv{opacity:0;transform:translateY(30px)}
 .st .ofr.rv.in,.st .star.rv.in{opacity:1;transform:none;transition:opacity .5s ease,transform .6s cubic-bezier(.2,1,.3,1)}
}
.st .nm{all:unset;cursor:pointer;color:inherit;font:inherit;text-transform:inherit;overflow-wrap:anywhere}
.st .nm:hover{text-decoration:underline;text-underline-offset:3px}
.st .nm:focus-visible{outline:3px solid var(--yellow);outline-offset:3px;border-radius:6px}
.st .foot{margin-top:30px;background:transparent;border-top:1px solid rgba(255,255,255,.12)}
.st .foot::before{display:none}
/* ofertas */
.st .ofr{display:flex;margin:0 0 44px;border-radius:22px;overflow:hidden;background:linear-gradient(135deg,#3A1670,#A3125F);border:1px solid rgba(255,255,255,.18);box-shadow:0 14px 34px rgba(0,0,0,.4)}
.st .ofr-side{flex:0 0 54px;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:14px;padding:18px 0;background:rgba(0,0,0,.35)}
.st .ofr-side h2{font-family:var(--font-display);font-weight:400;text-transform:uppercase;font-size:2.2rem;letter-spacing:.08em;line-height:1;writing-mode:vertical-rl;transform:rotate(180deg);color:#fff}
.st .ofr-lab{writing-mode:vertical-rl;transform:rotate(180deg);background:var(--yellow);color:#0C1330;border-radius:999px;padding:10px 5px;font-weight:800;font-size:.76rem;line-height:1.1;text-align:center}
.st .ofr-lab b{font-family:var(--font-display);font-weight:400;font-size:1.15em}
.st .ofr-cols{flex:1;min-width:0;display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding:16px 14px;-webkit-overflow-scrolling:touch}
.st .ofr-cols::-webkit-scrollbar{display:none}
.st .oc{flex:0 0 min(72%,240px);scroll-snap-align:start;display:flex;flex-direction:column;align-items:center;text-align:center;gap:4px;padding:14px 12px 14px;background:rgba(10,14,40,.55);border:1px solid rgba(255,255,255,.16);border-radius:18px;color:#fff}
.st .oc-t{font-family:var(--font-display);font-weight:400;text-transform:uppercase;font-size:1.3rem;line-height:1;min-height:2.4em;display:flex;align-items:center;justify-content:center}
.st .oc-pk{font-size:.76rem;color:#D9D4F5}
.st .oc-pic{position:relative;width:100%;height:160px;display:grid;place-items:center;background:var(--photo);border-radius:14px;overflow:hidden;cursor:pointer;margin-top:4px}
.st .oc-pic img{position:static;height:88%;width:auto;max-width:88%;object-fit:contain;padding:0}
.st .oc-pct{position:absolute;left:8px;top:8px;background:var(--sale);color:#fff;border-radius:8px;padding:2px 9px;font-weight:800;font-size:.8rem;clip-path:none;width:auto;aspect-ratio:auto}
.st .oc-pct b{font-weight:800}
.st .oc-was{font-size:.82rem;font-weight:700;margin-top:6px;color:#D9D4F5}
.st .oc-was s{color:#B8B2DC}
.st .oc-new{font-weight:800;font-size:2rem;line-height:1.05;color:#fff;font-variant-numeric:tabular-nums}
.st .oc-new i{font-style:normal;font-size:.8rem;margin-left:3px;color:#D9D4F5;font-weight:700}
.st .oc-o{font-size:.8rem;color:#D9D4F5}
.st .oc-until{font-size:.74rem;font-weight:800;color:#FFD2E5}
.st .oc .buy{width:100%;margin-top:8px}
@media (min-width:900px){.st .ofr-side{flex-basis:76px}.st .ofr-side h2{font-size:3rem}.st .oc{flex:1 0 0;min-width:230px}.st .oc-pic{height:210px}}
/* producto estrella */
.st .star{position:relative;margin:0 0 46px;border-radius:24px;padding:18px 14px 20px;background:linear-gradient(150deg,#2B1B66 0,#1B2A6B 60%,#16204A 100%);border:1px solid rgba(255,255,255,.16);box-shadow:0 14px 34px rgba(0,0,0,.4)}
.st .star-top{display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px}
.st .star-pic{position:relative;width:min(60%,230px);aspect-ratio:1;background:var(--photo);border-radius:22px;display:grid;place-items:center;overflow:hidden}
.st .star-pic img{width:90%;height:90%;object-fit:contain;filter:drop-shadow(0 10px 12px rgba(22,39,90,.3))}
.st .star-pic .sp{display:none}
.st .star-t{font-family:var(--font-display);font-weight:400;font-size:clamp(3.4rem,17vw,5.6rem);line-height:.9;text-transform:uppercase;color:#fff;letter-spacing:.02em;margin-top:8px}
.st .star-sub{font-size:.82rem;font-weight:800;color:var(--yellow);letter-spacing:.1em;text-transform:uppercase}
.st .star-h{font-family:var(--font-body);font-weight:800;font-size:.8rem;letter-spacing:.2em;text-transform:uppercase;color:var(--accent);margin:22px 0 10px}
.st .star-grid{display:grid;grid-template-columns:1fr;gap:10px;list-style:none;padding:0;margin:0}
.st .sv{display:flex;flex-direction:column;gap:6px;background:rgba(10,14,40,.55);border:1px solid rgba(255,255,255,.14);border-radius:16px;padding:12px 12px 12px 52px;position:relative}
.st .sv .num{position:absolute;left:12px;top:12px;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:var(--yellow);color:#0C1330;font-weight:800;font-size:.9rem;border:0}
.st .sv h4{font-family:var(--font-display);font-weight:400;font-size:1.3rem;text-transform:uppercase;line-height:1.05;color:#fff}
.st .sv-ref{font-size:.74rem;font-weight:700;color:var(--ink-soft)}
.st .sv .prs,.st .sa .prs{display:flex;gap:14px;flex-wrap:wrap}
.st .sv .pr,.st .sa .pr{background:none;border:0;box-shadow:none;padding:0;border-radius:0;color:#fff;display:flex;flex-direction:column}
.st .sv .pr .pl,.st .sa .pr .pl{font-size:.68rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft)}
.st .sv .pr b,.st .sa .pr b{font-family:var(--font-body);font-weight:800;font-size:1.15rem;color:#fff}
.st .sv .pr s,.st .sa .pr s{font-size:.78rem;color:#8A91C4}
.st .sv .pr.sale b,.st .sa .pr.sale b{color:var(--sale)}
.st .sv .pr i,.st .sa .pr i{font-style:normal;font-size:.72rem;color:var(--ink-soft);margin-left:2px}
.st .sv .buy{width:100%}
.st .star-also{display:flex;flex-direction:column;gap:8px;list-style:none;padding:0;margin:0}
.st .sa{display:grid;grid-template-columns:1fr;gap:6px;background:rgba(10,14,40,.4);border:1px dashed rgba(255,255,255,.25);border-radius:14px;padding:10px 12px}
.st .sa .nm{font-family:var(--font-display);font-size:1.15rem;text-transform:uppercase;color:#fff}
.st .sa-pk{display:block;font-size:.8rem;color:var(--ink-soft)}
@media (min-width:900px){
 .st .star{display:grid;grid-template-columns:minmax(260px,.9fr) minmax(0,1.6fr);column-gap:34px;align-items:start;padding:28px}
 .st .star-top{grid-row:1/span 4;position:sticky;top:130px}
 .st .star-pic{width:min(100%,300px)}
 .st .star-h,.st .star-grid,.st .star-also{grid-column:2}
 .st .star-h:first-of-type{margin-top:0}
 .st .star-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .st .sa{grid-template-columns:1fr auto 150px;align-items:center}
}
.st .wa-cta span{display:inline-flex;gap:.3em;flex-wrap:wrap}
.st .toolbar{background:rgba(12,19,48,.94)}
.st .oc-pic img{height:144px;width:auto;max-width:90%}
@media (min-width:900px){.st .oc-pic img{height:190px}}
.st .star-pic{height:auto}
.st .star-pic img{width:auto;height:auto;max-width:88%;max-height:88%;padding:14px 0}
.st .pc-img img{position:absolute;inset:7%;width:86%;height:86%}
.st .pcp-r{flex-wrap:nowrap;gap:5px}
.st .pcp-r span{font-size:.62rem;min-width:40px}
.st .pcp-r b{font-size:1.08rem}
.st .pcp-r s{font-size:.74rem}
.st .tc .eq{text-align:left;align-items:flex-start}
@media (min-width:700px){.st .pcp-r span{font-size:.7rem;min-width:48px}.st .pcp-r b{font-size:1.2rem}}
/* detalle del producto en la tienda: mismo lenguaje limpio */
.st .sheet{border:1px solid rgba(255,255,255,.14);box-shadow:0 -10px 40px rgba(0,0,0,.5);background:#121A40}
@media (min-width:700px){.st .sheet{box-shadow:0 20px 60px rgba(0,0,0,.6);border-bottom:1px solid rgba(255,255,255,.14)}}
.st .sheet-dt .sheet-head h2{font-family:var(--font-display);color:#fff;text-shadow:none}
.st .dt-hero{border:0;border-radius:18px;background:var(--photo);box-shadow:none;padding:18px 14px}
.st .dt-pic img{filter:drop-shadow(0 10px 14px rgba(22,39,90,.3));transform:none}
.st .dt-brand{background:rgba(220,194,255,.14);color:var(--accent)}
.st .dt-desc{color:var(--ink)}
.st .dt-facts li{border:1px solid rgba(255,255,255,.14);border-radius:12px;box-shadow:none;transform:none;background:rgba(255,255,255,.05)}
.st .dt-facts b{font-family:var(--font-body);font-weight:800;font-size:1rem}
.st .dt-box{border:1px solid rgba(255,255,255,.16);border-radius:18px;background:linear-gradient(160deg,rgba(107,47,148,.35),rgba(22,32,74,.9));box-shadow:none}
.st .dt-p{border:1px solid rgba(255,255,255,.18);border-radius:14px;box-shadow:none;background:rgba(10,14,40,.5)}
.st .dt-p.sale{border-color:var(--sale)}
.st .dt-l{background:transparent;color:var(--ink-soft);transform:none;font-family:var(--font-body);font-weight:800;font-size:.72rem;letter-spacing:.14em}
.st .dt-p:nth-child(2) .dt-l{background:transparent;color:var(--yellow)}
.st .dt-v{font-family:var(--font-body);font-weight:800;color:#fff}
.st .dt-p.sale .dt-v{color:var(--sale)}
.st .dt-p s{color:#8A91C4}
.st .dt-s{color:var(--ink-soft)}
.st .dt-box .buy .btn.add{background:var(--yellow);color:#0C1330;border:0;box-shadow:none;border-radius:14px;font-family:var(--font-body);text-transform:none;font-weight:800;letter-spacing:0}
.st .dt-box .until{color:#FFB3D2}
.st .sheet-head h2{text-shadow:none}
.st .stepper{border:1px solid rgba(255,255,255,.22);box-shadow:none;background:rgba(255,255,255,.06)}
.st .seg{border-color:rgba(255,255,255,.2);box-shadow:none}
.st .cartbar{border:0;box-shadow:0 10px 30px rgba(0,0,0,.5)}

/* =====================================================================
   PDF (clase .pdfk): afiche llamativo. Solo vive dentro del marco oculto con el que se arma el PDF.
   ===================================================================== */
.pdfk{--lab:#1F7A3A;color:#fff;background:radial-gradient(circle at 90% 0,rgba(107,47,148,.8),transparent 45%),radial-gradient(circle,rgba(255,216,0,.22) 2px,transparent 2.6px) 0 0/20px 20px,linear-gradient(180deg,#1E3577,#14224F 60%,#101B43);background-color:#14224F}
.pdfk .wrap{max-width:none;padding:0 34px}
.pdfk main{padding:0 0 10px}
.pdfk .hero{background:none;color:#fff;overflow:visible;padding:30px 34px 26px;position:relative}
.pdfk .hero::before,.pdfk .lolli{display:none}
.pdfk .ph-top{display:flex;justify-content:space-between;align-items:flex-start}
.pdfk .ph-logo{width:230px;height:auto;transform:rotate(-3deg);filter:drop-shadow(5px 6px 0 rgba(0,0,0,.4))}
.pdfk .ph-burst{position:relative;width:170px;aspect-ratio:1;transform:rotate(9deg);filter:drop-shadow(5px 6px 0 rgba(0,0,0,.4))}
.pdfk .ph-burst::before,.pdfk .ph-burst span{content:"";position:absolute;clip-path:var(--star)}
.pdfk .ph-burst::before{inset:0;background:#0B0F25}
.pdfk .ph-burst span{inset:6px;background:var(--yellow);display:flex;align-items:center;justify-content:center;text-align:center;font-family:var(--font-display);text-transform:uppercase;font-size:1.12rem;line-height:1.05;color:#16275A}
.pdfk .ph-t{font-family:var(--font-display);font-weight:400;text-transform:uppercase;font-size:5.6rem;line-height:.86;color:#fff;-webkit-text-stroke:9px #6B2F94;paint-order:stroke fill;text-shadow:6px 7px 0 #0B0F25;margin:6px 0 0;transform:rotate(-2deg);text-align:left}
.pdfk .ph-t mark{background:none;color:var(--yellow);padding:0;display:inline;box-shadow:none;transform:none}
.pdfk .ph-sub{font-family:var(--font-script);font-size:1.9rem;color:var(--yellow);margin:16px 0 0;text-shadow:2px 2px 0 rgba(0,0,0,.45);transform:rotate(-1deg)}
.pdfk .ph-wa{display:inline-flex;align-items:center;gap:12px;margin-top:16px;background:#0F5A2D;border:4px solid #FFF4D6;border-radius:22px;padding:10px 20px 10px 14px;font-family:var(--font-display);text-transform:uppercase;font-size:1.15rem;line-height:1.1;box-shadow:5px 5px 0 rgba(0,0,0,.45);transform:rotate(-1deg)}
.pdfk .ph-wa svg{width:36px;height:36px}
.pdfk .ph-wa b{color:var(--yellow);font-weight:400}
.pdfk .cat{margin:0 0 30px;padding:0!important;background:none!important}
.pdfk .cat-head{display:flex;align-items:center;gap:14px;margin:0 0 30px;flex-wrap:nowrap}
.pdfk .cat-head h2{font-family:var(--font-display);font-weight:400;text-transform:uppercase;font-size:2.7rem;line-height:1;color:#fff;background:var(--lab);border:4px solid #0B0F25;border-radius:14px;padding:6px 20px 8px;transform:rotate(-2.5deg);box-shadow:5px 5px 0 #0B0F25;-webkit-text-stroke:5px #0B0F25;paint-order:stroke fill;text-shadow:3px 3px 0 #0B0F25;margin-left:-6px}
.pdfk .cat-head span{background:var(--yellow);color:#16275A;border:3px solid #0B0F25;border-radius:999px;padding:2px 14px;font-weight:800;font-size:.9rem;transform:rotate(3deg);box-shadow:2px 2px 0 #0B0F25}
.pdfk .cv0{--lab:#1F7A3A}.pdfk .cv1{--lab:#6B2F94}.pdfk .cv2{--lab:#2F5BD0}.pdfk .cv3{--lab:#A3125F}
.pdfk .grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:48px 20px}
.pdfk .card{position:relative;display:flex;flex-direction:column;align-items:stretch;text-align:center;background:#fff;color:#16275A;border:4px solid #0B0F25;border-radius:22px;box-shadow:6px 6px 0 rgba(0,0,0,.5);padding:0 12px 14px;min-width:0}
.pdfk .pk-img{position:relative;height:150px;margin:-30px -4px 6px;display:grid;place-items:center;z-index:2}
.pdfk .pk-img::before{content:"";position:absolute;inset:26px 14% 0;border-radius:50%;background:color-mix(in srgb,var(--lab) 22%,#fff)}
.pdfk .pk-img img{position:relative;height:100%;width:auto;max-width:100%;object-fit:contain;transform:rotate(-4deg);filter:drop-shadow(3px 0 0 #fff) drop-shadow(-3px 0 0 #fff) drop-shadow(0 3px 0 #fff) drop-shadow(0 -3px 0 #fff) drop-shadow(4px 7px 0 rgba(22,39,90,.35))}
.pdfk .pk-img .noimg{position:relative;width:70px;height:70px;color:var(--lab)}
.pdfk .pk-flag{position:absolute;right:-6px;top:30px;background:#E0197D;color:#fff;border:2px solid #fff;border-radius:10px;padding:3px 10px;font-weight:800;font-size:.72rem;transform:rotate(7deg);z-index:3;white-space:nowrap;box-shadow:2px 2px 0 rgba(0,0,0,.35)}
.pdfk .pk-un{position:absolute;left:-4px;top:34px;background:#16275A;color:#fff;border:2px solid #fff;border-radius:999px;padding:1px 10px;font-weight:800;font-size:.7rem;transform:rotate(-6deg);z-index:3;white-space:nowrap}
.pdfk .soldout{left:-6px;right:-6px;top:50%;z-index:4}
.pdfk .card.off .pk-img img{opacity:.5;filter:grayscale(.7)}
.pdfk .pk-b{display:flex;flex-direction:column;align-items:center;gap:3px}
.pdfk .pk-br{font-size:.62rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--lab)}
.pdfk .card h3{font-family:var(--font-display);font-weight:400;font-size:1.3rem;line-height:1.02;text-transform:uppercase;color:#16275A}
.pdfk .pk-pk{font-size:.78rem;font-weight:700;color:#5A5690}
.pdfk .pk-pr{display:flex;gap:8px;justify-content:center;width:100%;margin-top:8px}
.pdfk .pk-t{flex:1;display:flex;flex-direction:column;align-items:center;border:3px solid #0B0F25;border-radius:14px;padding:3px 4px 5px;background:#FFF4B8;box-shadow:3px 3px 0 #0B0F25;min-width:0}
.pdfk .pk-t:nth-child(2){background:color-mix(in srgb,var(--lab) 18%,#fff)}
.pdfk .pk-t span{font-size:.58rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:#16275A}
.pdfk .pk-t b{font-family:var(--font-display);font-weight:400;font-size:1.5rem;line-height:1.05;color:#16275A;white-space:nowrap}
.pdfk .pk-t s{font-size:.7rem;font-weight:700;color:#5A5690;line-height:1}
.pdfk .pk-t.sale{border-color:#E0197D}
.pdfk .pk-t.sale b{color:#C81E52}
.pdfk .pk-t.ask b{font-family:var(--font-body);font-size:.85rem;font-weight:800}
.pdfk .card .eq{font-size:.6rem;color:#5A5690;margin-top:4px;display:flex;flex-direction:column;align-items:center}
.pdfk .card .until{font-size:.66rem;font-weight:800;color:#C81E52;margin-top:2px}
.pdfk .foot{background:none;color:#fff;margin:0;padding:10px 34px 30px;position:relative}
.pdfk .foot::before{display:none}
.pdfk .pf-ban{display:flex;align-items:center;justify-content:center;gap:14px;background:#0F5A2D;border:4px solid #FFF4D6;border-radius:24px;padding:14px 20px;font-family:var(--font-display);text-transform:uppercase;font-size:2rem;line-height:1;box-shadow:6px 6px 0 rgba(0,0,0,.45)}
.pdfk .pf-ban svg{width:52px;height:52px;flex:none}
.pdfk .pf-ban em{font-style:normal;color:var(--yellow)}
.pdfk .pf-num{text-align:center;font-family:var(--font-display);font-size:1.6rem;margin-top:12px;color:var(--yellow);letter-spacing:.04em}
.pdfk .pf-li{display:flex;flex-direction:column;align-items:center;gap:2px;margin-top:10px;font-size:.8rem;font-weight:600;color:#DCE3FA}
.pdfk .pk-img{display:flex;align-items:center;justify-content:center}
.pdfk .pk-img img{height:150px;width:auto;max-width:100%}
.pdfk .pk-img::before{inset:30px 16% 0}
.pdfk .card[data-out]{background:none!important;border-color:transparent!important;box-shadow:none!important}
.pdfk .pk-img{margin:-30px -4px 12px;height:140px}
.pdfk .pk-img img{height:140px}
.pdfk .hero{padding:22px 34px 18px}
.pdfk .ph-logo{width:200px}
.pdfk .ph-burst{width:150px}
.pdfk .ph-burst span{font-size:1rem}
.pdfk .ph-t{font-size:5rem}
.pdfk .ph-sub{font-size:1.7rem;margin-top:12px}
.pdfk .ph-wa{margin-top:12px}
.pdfk .cat-head{margin-bottom:26px}
.pdfk .grid{gap:42px 20px}
body:has(.pdfk){background:#101B43}
.pdfk .pk-img{height:122px;margin-bottom:8px}
.pdfk .pk-img img{height:122px}
.pdfk .pk-img::before{inset:24px 16% 0}
.pdfk .card{padding-bottom:12px}
.pdfk .grid{gap:38px 20px}
.pdfk .cat-head{margin-bottom:22px}
.pdfk .cat{margin-bottom:24px}
.pdfk .hero{padding:18px 34px 10px}
.pdfk .ph-t{font-size:4.8rem}
.pdfk .ph-sub{margin-top:8px}
.pdfk .grid{gap:34px 20px}
.pdfk .cat-head{margin-bottom:20px}

/* =====================================================================
   TIENDA v2 — sin tarjetas: los productos flotan sobre la página, más grandes, sin cajas anidadas
   ===================================================================== */
.st{background:#0C1330}
/* portada: banda con degradado que se funde con la página (sin bordes duros) */
.st .hero{background:radial-gradient(700px 360px at 88% 0,rgba(107,47,148,.6),transparent 70%),radial-gradient(600px 360px at 0 20%,rgba(47,91,208,.35),transparent 70%)}
.st .hero-in{display:grid;grid-template-columns:minmax(0,1fr);grid-template-areas:"logo" "copy" "cta";gap:14px;align-items:start;padding-block:24px 8px;position:relative}
.st .hero-logo{grid-area:logo;width:min(170px,44vw)}
.st .hero-copy{grid-area:copy}
.st .wa-cta{grid-area:cta;justify-self:start}
.st .hero-pics{display:flex;grid-area:pics;justify-content:center;align-items:flex-end;gap:6px;margin:6px 0 0;padding:0;pointer-events:none}
.st .hp{width:31%;max-width:150px;height:auto;margin:0;object-fit:contain;transform:none;filter:drop-shadow(0 12px 14px rgba(0,0,0,.45))}
.st .hp1{transform:rotate(-7deg) translateY(6px)}.st .hp2{transform:scale(1.12) translateY(-4px)}.st .hp3{transform:rotate(8deg) translateY(6px)}
@media (min-width:900px){
 .st .hero-in{grid-template-columns:minmax(0,1fr);grid-template-areas:"logo" "copy" "cta";gap:16px;padding-block:40px 28px;align-items:center}
 .st .hero-logo{width:210px}
 .st .hero-pics{justify-content:flex-end;gap:0}
 .st .hp{width:34%;max-width:230px}
}
/* barra fija: lisa, sin franjas */
.st .toolbar{background:#0C1330;border-bottom:1px solid rgba(255,255,255,.1);-webkit-backdrop-filter:none;backdrop-filter:none}
/* ofertas: un solo contenedor, columnas separadas por líneas finas */
.st .ofr{background:linear-gradient(120deg,#3A1670,#7A1458 60%,#A3125F);border:0;box-shadow:0 14px 34px rgba(0,0,0,.35)}
.st .ofr-side{background:rgba(0,0,0,.28)}
.st .ofr-cols{gap:0;padding:0}
.st .oc{background:none;border:0;border-left:1px solid rgba(255,255,255,.16);border-radius:0;padding:18px 14px 18px}
.st .oc:first-child{border-left:0}
.st .oc-pic{background:radial-gradient(circle at 50% 58%,rgba(255,255,255,.3),rgba(255,255,255,0) 66%);border-radius:0;height:190px;overflow:visible}
.st .oc-pic img{position:absolute;inset:0;width:100%;height:100%;max-width:100%;object-fit:contain;filter:drop-shadow(0 12px 14px rgba(0,0,0,.45))}
.st .oc-pct{left:4px;top:4px}
@media (min-width:900px){.st .oc-pic{height:250px}}
/* productos: sin tarjeta */
.st .cs{margin-bottom:56px}
.st .cs.g0{--glow:rgba(255,216,0,.34)}.st .cs.g1{--glow:rgba(150,86,215,.5)}.st .cs.g2{--glow:rgba(76,121,224,.5)}.st .cs.g3{--glow:rgba(224,25,125,.4)}
.st .pg{grid-template-columns:repeat(2,minmax(0,1fr));gap:30px 14px}
@media (min-width:700px){.st .pg{grid-template-columns:repeat(3,minmax(0,1fr));gap:44px 28px}}
@media (min-width:1500px){.st .pg{grid-template-columns:repeat(4,minmax(0,1fr))}}
.st .tc{background:none;border:0;box-shadow:none;border-radius:0;overflow:visible}
.st .tc-img,.st .pc-img{background:radial-gradient(circle at 50% 56%,var(--glow,rgba(255,255,255,.25)),rgba(255,255,255,0) 68%);aspect-ratio:1/1;overflow:visible;border-radius:0}
.st .pc-img img{inset:0;width:100%;height:100%;filter:drop-shadow(0 14px 14px rgba(0,0,0,.5))}
.st .pc-img .noimg{color:rgba(255,255,255,.35)}
.st .pc-flag{left:4px;top:4px}
.st .tc.off .pc-img img{opacity:.5}
.st .pc-b{padding:10px 2px 0}
.st .tc h3{font-size:1.08rem}
.st .tc .buy{padding-top:12px}
@media (hover:hover) and (prefers-reduced-motion:no-preference){
 .st .tc:hover{transform:none;box-shadow:none;border-color:transparent}
 .st .tc:hover .pc-img img{transform:translateY(-8px) scale(1.06) rotate(-2deg)}
}
@media (min-width:1000px){.st .pg{grid-template-columns:repeat(4,minmax(0,1fr));gap:48px 30px}}
.st .oc-pic{margin-bottom:20px}
.st .tc .buy .btn.add{width:100%}
.st .tc .pc-b{padding-inline:0}
.st .tc .buy{width:100%}

/* ===== PDF v2: un producto grande por fila, alternando izquierda y derecha (3–4 por página) ===== */
.pdfk .grid{grid-template-columns:1fr;gap:34px}
.pdfk .card{flex-direction:row;align-items:center;height:236px;padding:0 26px 0 0;text-align:left;background:var(--lab);color:#fff;border:4px solid #0B0F25;border-radius:26px;box-shadow:7px 7px 0 rgba(0,0,0,.5);overflow:visible;position:relative}
.pdfk .card::before{content:"";position:absolute;inset:0;border-radius:22px;background:radial-gradient(circle,rgba(255,255,255,.14) 1.6px,transparent 2.1px) 0 0/14px 14px;pointer-events:none}
.pdfk .card:nth-child(even){flex-direction:row-reverse;padding:0 0 0 26px}
.pdfk .pk-img{flex:0 0 300px;height:100%;margin:0;display:flex;align-items:center;justify-content:center;position:relative}
.pdfk .pk-img::before{inset:14px 20px;border-radius:50%;background:rgba(255,255,255,.26)}
.pdfk .pk-img img{height:260px;width:auto;max-width:290px;margin-block:-12px;transform:rotate(-5deg);filter:drop-shadow(4px 0 0 #fff) drop-shadow(-4px 0 0 #fff) drop-shadow(0 4px 0 #fff) drop-shadow(0 -4px 0 #fff) drop-shadow(7px 10px 0 rgba(0,0,0,.35))}
.pdfk .card:nth-child(even) .pk-img img{transform:rotate(5deg)}
.pdfk .pk-flag{right:auto;left:18px;top:14px;transform:rotate(-7deg);font-size:.9rem}
.pdfk .pk-un{left:auto;right:22px;top:auto;bottom:16px;font-size:.8rem;transform:rotate(5deg)}
.pdfk .soldout{left:10px;right:10px;top:46%}
.pdfk .pk-b{flex:1;min-width:0;align-items:flex-start;gap:5px;padding:0 6px 0 4px}
.pdfk .pk-br{font-size:.78rem;color:var(--yellow);background:rgba(0,0,0,.28);border-radius:999px;padding:1px 12px;letter-spacing:.16em}
.pdfk .card h3{font-size:2.15rem;line-height:.98;color:#fff;text-shadow:3px 3px 0 rgba(0,0,0,.4);-webkit-text-stroke:4px #0B0F25;paint-order:stroke fill}
.pdfk .pk-pk{font-size:1rem;color:#fff;font-weight:800}
.pdfk .pk-d{font-size:.9rem;color:#fff;opacity:.95;font-weight:600}
.pdfk .pk-pr{justify-content:flex-start;gap:12px;margin-top:8px}
.pdfk .pk-t{flex:0 0 auto;min-width:150px;padding:4px 14px 6px;background:#fff;box-shadow:4px 4px 0 #0B0F25;align-items:flex-start}
.pdfk .pk-t:nth-child(2){background:var(--yellow)}
.pdfk .pk-t span{font-size:.7rem}
.pdfk .pk-t b{font-size:2.3rem;color:#16275A}
.pdfk .pk-t s{font-size:.86rem;color:#5A5690}
.pdfk .pk-t.sale{border-color:#E0197D}
.pdfk .pk-t.sale b{color:#C81E52}
.pdfk .card .eq{font-size:.78rem;color:#fff;align-items:flex-start;margin-top:6px;opacity:.95}
.pdfk .card .until{font-size:.8rem;color:var(--yellow);background:rgba(0,0,0,.3);border-radius:999px;padding:1px 10px}
.pdfk .card[data-out]::before{display:none}
.pdfk .card[data-out]{background:none!important}
.pdfk .grid{gap:30px}
.pdfk .card{height:226px}
.pdfk .pk-img img{height:246px}
.pdfk .pk-t b{font-size:2.1rem}
.pdfk .card h3{font-size:2rem}

/* cinta de frases que se mueve (reemplaza las galletas de adorno) */
.marq{display:none}
.st .marq{display:block;overflow:hidden;background:#FFD800;color:#213A7B;border-block:3px solid #0B0F25;padding:9px 0;white-space:nowrap}
.st .marq-t{display:inline-flex;align-items:center;will-change:transform;animation:marq 38s linear infinite}
.st .marq span{font-family:'Lilita One',sans-serif;font-size:1.05rem;letter-spacing:.06em;text-transform:uppercase;padding:0 18px}
.st .marq i{width:9px;height:9px;border-radius:50%;background:#6B2F94;flex:none}
@keyframes marq{to{transform:translateX(-25%)}}
@media (prefers-reduced-motion:reduce){.st .marq-t{animation:none}}

/* =====================================================================
   UNIFICACIÓN — panel del dueño, acceso, pedido y formularios con el mismo
   estilo de la tienda (sin bordes gruesos ni sombras de pegatina)
   ===================================================================== */
body.in-panel .marq{display:none}
.st .btn{border-width:1px;border-color:var(--line);box-shadow:none;font-family:var(--font-body)}
.st .btn-cta,.st .add{border-color:transparent}
.st .btn-navy{background:#2F5BD0;border-color:transparent;color:#fff}
.st .btn-light{background:rgba(255,255,255,.1);color:var(--ink);border-color:var(--line)}
.st .btn-outline{color:var(--ink);border-color:var(--line)}
.st .btn-ghost{background:transparent;color:var(--ink);border-color:var(--line)}
.st .btn-danger{background:transparent;color:#FF7A9C;border-color:rgba(255,122,156,.55);box-shadow:none}
.st .btn.sm{border-width:1px;box-shadow:none}
.st .btn[disabled]{transform:none}
.st .icon-btn{border-width:1px;border-color:var(--line);background:rgba(255,255,255,.08);color:var(--ink);box-shadow:none}
.st .stepper{border-width:1px;border-color:var(--line);box-shadow:none;background:transparent}
.st .seg{border-width:1px}
.st .seg button[aria-pressed="true"]{background:var(--yellow);color:#0C1330}
.st .sheet-foot{border-top:1px solid var(--line);background:rgba(255,255,255,.03)}
.st .field input,.st .field textarea,.st .field select{border-width:1px;border-color:var(--line);background:rgba(255,255,255,.05);color:var(--ink)}
.st .field input:focus,.st .field textarea:focus,.st .field select:focus{border-color:var(--yellow);box-shadow:0 0 0 3px rgba(255,216,0,.18)}
.st .pn-top{background:#0C1330;border-bottom:1px solid var(--line)}
.st .pn-title b,.st .pn-h,.st .pgroup,.st .cname b,.st .login-card h1{font-family:var(--font-display);text-shadow:none;color:var(--ink)}
.st .pn-tabs button{border-width:1px;border-color:var(--line);background:transparent;color:var(--ink-soft)}
.st .pn-tabs button[aria-selected="true"]{background:var(--yellow);color:#0C1330;border-color:var(--yellow);box-shadow:none}
.st .pn-catsel select{border-width:1px;border-color:var(--line);background:rgba(255,255,255,.05);color:var(--ink)}
.st .prow,.st .pn-card,.st .crow,.st .login-card{border-width:1px;border-color:var(--line);box-shadow:none;border-radius:18px}
.st .pn-card,.st .crow{background:rgba(255,255,255,.04)}
.st .prow{background:rgba(255,255,255,.04)}
.st .prow-act{border-top:1px solid var(--line)}
.st .pth{border-width:1px;border-color:var(--line)}
.st .sw{border-width:1px;background:rgba(255,255,255,.04)}
.st .pn-fab .btn{box-shadow:0 10px 26px rgba(0,0,0,.45)}
.st .promo-box{border-width:1px}
.st .pn-empty{border-width:1px}
.st .pn-demo{background:rgba(255,216,0,.12);color:#FFE98A}
.st .login-card{box-shadow:0 18px 40px rgba(0,0,0,.35)}
.st.lt .pn-top{background:#fff}
.st.lt .pn-tabs button[aria-selected="true"]{background:#213A7B;color:#fff;border-color:#213A7B}
.st.lt .field input,.st.lt .field textarea,.st.lt .field select,.st.lt .pn-catsel select{background:#fff;color:#0B1330}
.st.lt .prow,.st.lt .pn-card,.st.lt .crow{background:#fff}
.st.lt .btn-navy{background:#213A7B}
.st.lt .seg button[aria-pressed="true"]{background:#213A7B;color:#fff}
.st .demo-note{background:rgba(255,216,0,.12);color:#FFE98A;border:1px solid rgba(255,216,0,.3)}
.st .demo-note code{background:rgba(255,255,255,.12);color:#fff}
.st .demo-note .btn{background:var(--yellow);color:#0C1330;border-color:transparent}

/* páginas legales */
.linkbtn{background:none;border:0;padding:0;color:inherit;font:inherit;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.foot .legal-links{opacity:.9}
.lg{display:flex;flex-direction:column;gap:6px;font-size:.95rem;line-height:1.55}
.lg h3{font-family:var(--font-body);font-weight:800;font-size:1rem;margin-top:10px;color:var(--ink)}
.lg p{color:var(--ink-soft)}
.lg-up{font-size:.8rem;font-weight:700}
.lg-list{list-style:none;padding:0;display:flex;flex-direction:column;gap:3px;color:var(--ink-soft)}

/* =====================================================================
   PULIDO (rama mejoras-ui) — cada bloque es un commit aparte para poder quitarlo solo.
   ===================================================================== */
/* 1) Toques cómodos para el pulgar (mínimo 44 px) */
.st .line .stepper{grid-template-columns:44px 40px 44px;height:44px}
.st .line .stepper button{width:44px;height:44px;font-size:1.25rem}
.st .line .rm{min-height:44px;padding:0 10px 0 0}
.st .chip{height:40px}
.st .perks .btn{min-height:44px}
.st .pn-top .btn.sm{min-height:44px}
.st .icon-btn.sm,.st .cbtn .btn.sm{min-width:44px;min-height:44px}
.st .sw{min-height:44px}
.st .foot ul{gap:2px}
.st .foot a,.st .foot .linkbtn{display:inline-block;padding-block:10px}
.st .login-card .back{min-height:44px;display:inline-flex;align-items:center}
/* 2) Precios largos (ofertas, precios grandes) sin salirse de la tarjeta ni del detalle */
.st .pcp-r{flex-wrap:wrap;row-gap:0}
.st .pcp-r span{font-size:.66rem}
.st .pcp-r b{overflow-wrap:anywhere}
.st .dt-v.long{font-size:clamp(1.35rem,6.4vw,2.2rem)}
@media (min-width:700px){.st .pcp-r span{font-size:.7rem}}
/* 3) Fondo oscuro también detrás de la tienda: sin franja lila al estirar la página en iPhone ni al cargar */
html:has(#root.st),body:has(#root.st){background:#0C1330}
body:has(#root.st)::before{background:#0C1330}
html:has(#root .boot),body:has(#root .boot){background:#0C1330}
#root .boot{color:#B6B2E0}
/* 4) Producto sin foto: el dibujo del caramelo queda centrado (antes se iba a la esquina) */
.st .stage .noimg{margin:auto}
.st .pc-img .noimg svg{width:56px;height:56px}
/* 5) Táctil: el subrayado de "pasar el mouse" no se queda pegado al tocar, y al deslizar dentro del pedido o de las ofertas no se mueve la página de atrás */
@media (hover:none){.st .nm:hover{text-decoration:none}}
.sheet-body{overscroll-behavior:contain}
.st .ofr-cols{overscroll-behavior-x:contain}
/* 6) Animaciones: se detiene una animación que corría detrás de cada foto sin verse (ahorra batería en celulares modestos).
      En computador, al pasar el mouse la foto ya sí se levanta (antes el vaivén lo tapaba). */
.st .stage::before{animation:none}
@media (hover:hover) and (prefers-reduced-motion:no-preference){.st .tc:hover .pc-img img{animation:none}}
/* 7) Contraste de etiquetas de oferta: texto blanco sobre el rosa de la marca (#E0245E, ya en config.json) en vez del rosa claro (2,8 → 4,6 a 1) */
.st .pc-flag,.st .oc-pct,.st .chip-sale[aria-pressed="true"]{background:var(--promo)}
.st .chip-sale[aria-pressed="true"]{border-color:var(--promo)}
/* 8) Vaivén de fotos solo en la sección Ofertas (decisión de Carlos, 2-nov-2026): las tarjetas normales quedan quietas */
.st .pc-img img{animation:none}
/* 9) Dulzura — tono crema cálido (decisión de Carlos): los textos secundarios pasan de gris lila (frío) a crema; los precios siguen blancos y el amarillo sigue en botones.
      Contraste sobre el azul noche: crema 11,3 a 1; crema suave 7,5 a 1; tachado 6,6 a 1 (todos legibles). */
.st{--ink-soft:#D9CAB2;--cream:#D9CAB2;--cream-dim:#B3A58F;--caramel:#F2B65A}
.st .pc-br,.st .dt-brand{color:var(--caramel)}
.st .dt-brand{background:rgba(242,182,90,.14)}
.st .tc .eq{color:var(--cream-dim)}
.st .pcp-r s,.st .dt-p s{color:#A8998A}
.st .search input::placeholder{color:var(--cream-dim)}
.st .search svg{color:var(--cream)}
.st .foot{color:#E6D9C4}
.st .foot .owner-link a{color:#E6D9C4}
/* 10) Dulzura — brillo caramelo: una sola luz cálida detrás de todas las fotos, como una vitrina iluminada (antes amarillo, morado, azul o rosa según la categoría) */
.st .cs.g0,.st .cs.g1,.st .cs.g2,.st .cs.g3{--glow:rgba(242,170,70,.34)}
/* 11) Dulzura — ofertas en forma de ticket: la etiqueta (-15 %, Oferta…) tiene muescas a los lados, igual en tarjeta, columna de ofertas y detalle */
.st .pc-flag,.st .oc-pct,.st .dt-pic .flag{border:0;border-radius:5px;padding:4px 13px;box-shadow:none;transform:none;letter-spacing:.03em;
 -webkit-mask:radial-gradient(circle 5px at 0 50%,#0000 95%,#000) left/51% 100% no-repeat,radial-gradient(circle 5px at 100% 50%,#0000 95%,#000) right/51% 100% no-repeat;
 mask:radial-gradient(circle 5px at 0 50%,#0000 95%,#000) left/51% 100% no-repeat,radial-gradient(circle 5px at 100% 50%,#0000 95%,#000) right/51% 100% no-repeat}
.st .dt-pic .flag{top:6px;right:8px;background:var(--promo)}
/* 12) Limpieza de restos del estilo afiche (decisión de Carlos: se quedan los rayos del detalle como toque dulce; lo demás se alinea con la tienda) */
.st .empty{border:1px solid var(--line);box-shadow:none;border-radius:18px;background:rgba(255,255,255,.04)}
.st .line .th{border:1px solid var(--line);border-radius:14px;background:radial-gradient(circle at 50% 56%,rgba(242,170,70,.34),rgba(255,255,255,.03) 72%)}
.st .soldout{transform:none;border:0;left:0;right:0;font-family:var(--font-body);font-weight:800;font-size:.78rem;letter-spacing:.16em;padding:7px 4px;background:rgba(12,19,48,.88);color:#fff;backdrop-filter:none}
.st .dt-box .buy{max-width:none}
.st .dt-box .stepper{width:100%;max-width:none}
/* 13) Detalle: AL MAYOR primero, igual que las tarjetas (el amarillo sigue marcando el precio al mayor) */
.st .dt-p:nth-child(1) .dt-l{color:var(--yellow)}
.st .dt-p:nth-child(2) .dt-l{color:var(--ink-soft)}
/* 14) Panel: interruptor ocupado mientras se guarda */
.sw[disabled]{opacity:.6;cursor:progress}
/* 15) PDF (decisiones de Carlos): agotados con precios en gris, «Hasta el…» dentro de la tarjeta (la tarjeta crece si hace falta), Bs y COP más grandes, y WhatsApp como enlace */
.pdfk .card{height:auto;min-height:226px;padding-top:16px;padding-bottom:16px}
.pdfk .card .eq{font-size:.92rem;line-height:1.35}
.pdfk .card.off .pk-t,.pdfk .card.off .pk-t:nth-child(2){background:#DAD7E6;border-color:#8E8AAE;box-shadow:none}
.pdfk .card.off .pk-t b,.pdfk .card.off .pk-t span,.pdfk .card.off .pk-t s{color:#7B7898}
.pdfk .card.off .eq{opacity:.55}
.pdfk a.ph-wa,.pdfk a.pf-ban{color:#fff;text-decoration:none}
.pdfk .pf-num a{color:var(--yellow);text-decoration:none;font-weight:inherit}
/* 16) Campos de fecha en iPhone: Safari les da un ancho propio que ignora el 100 % y se salían del cuadro, montándose uno sobre otro.
       Se les quita el estilo nativo (el calendario sigue abriendo igual) y las columnas no se dejan estirar por su contenido. */
.row2{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.field input,.field select,.field textarea{min-width:0;max-width:100%}
.field input[type="date"]{-webkit-appearance:none;appearance:none;display:block;width:100%;min-height:48px;line-height:1.3;text-align:left}
.field input[type="date"]::-webkit-date-and-time-value{text-align:left;min-height:1.3em}
.field input[type="date"]::-webkit-calendar-picker-indicator{filter:invert(.85)}
/* 17) Cinta de frases discreta (decisión de Carlos, 2-nov-2026): fina, sin fondo amarillo, letras crema pequeñas y movimiento muy lento.
       Con «reducir movimiento» en el celular queda quieta (regla de más arriba). Las frases salen de config.json (shop.frases). */
.st .marq{background:transparent;border-block:1px solid rgba(255,255,255,.12);padding:8px 0}
.st .marq span{font-family:var(--font-body);font-weight:700;font-size:.8rem;letter-spacing:.14em;color:var(--cream);padding:0 18px}
.st .marq i{width:5px;height:5px;background:var(--caramel)}
.st .marq-t{animation-duration:70s}
/* 18) Precio al mayor automático: «al mayor desde N», barrita de lo que falta y aviso cuando ya aplica */
.st .mm-from{font-size:.72rem;font-weight:700;color:var(--cream-dim);margin-top:2px}
.st .mm{margin:0 0 8px}
.st .mm-bar{height:6px;border-radius:6px;background:rgba(255,255,255,.1);overflow:hidden}
.st .mm-bar i{display:block;height:100%;background:var(--caramel);border-radius:6px}
@media (prefers-reduced-motion:no-preference){.st .mm-bar i{transition:width .25s cubic-bezier(.2,.8,.2,1)}}
.st .mm p{font-size:.74rem;color:var(--cream);margin-top:4px;line-height:1.3}
.st .mm p b{color:var(--caramel)}
.st .mm-ok{display:inline-block;margin:0 0 8px;font-size:.74rem;font-weight:800;color:#5FD39B;background:rgba(95,211,155,.14);border-radius:6px;padding:2px 8px}
.st .line .mm-s{display:block;font-size:.74rem;font-weight:700;color:var(--caramel);margin-top:1px}
.st .mm-info{margin-top:-4px}
/* 19) Panel del dueño: inicio, menú «Más» y precios rápidos */
.hm-hi{font-family:var(--font-display);font-size:1.5rem;color:var(--ink)}
.hm-rate{margin-top:4px}
.hm-row{display:flex;gap:8px}
.hm-row input{flex:1;font-size:1.1rem!important}
.hm-row .btn{flex:0 0 auto;min-height:48px;border-radius:14px}
.hm-tiles{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px}
.hm-tile{display:flex;flex-direction:column;align-items:flex-start;gap:2px;text-align:left;min-height:84px;padding:12px 14px;border-radius:16px;border:1px solid var(--line);background:rgba(255,255,255,.04);color:var(--ink)}
.hm-tile b{font-family:var(--font-display);font-weight:400;font-size:1.9rem;line-height:1}
.hm-tile span{font-size:.84rem;color:var(--ink-soft);font-weight:600}
.hm-tile.warn b{color:#FFB3D2}
.hm-two{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px}
.more-list{display:flex;flex-direction:column;gap:10px}
.more-it{display:grid;grid-template-columns:1fr 22px;grid-template-areas:"t c" "s c";align-items:center;text-align:left;min-height:68px;padding:12px 14px;border-radius:16px;border:1px solid var(--line);background:rgba(255,255,255,.04);color:var(--ink)}
.more-it b{grid-area:t;font-size:1.02rem}.more-it small{grid-area:s;color:var(--ink-soft);font-size:.82rem}.more-it .chev{grid-area:c}
.pn-back{align-self:flex-start;min-height:44px;font-weight:800;color:var(--ink)}
.pf-chip{align-self:flex-start;min-height:40px;border-radius:999px;border:1px solid var(--yellow);background:rgba(255,216,0,.12);color:var(--ink);font-weight:700;padding:0 14px}
.qlist{display:flex;flex-direction:column}
.qp{display:grid;grid-template-columns:44px minmax(0,1fr) 76px 76px;gap:8px;align-items:center;padding:10px 0;border-bottom:1px solid var(--line)}
.qp .pth{width:44px;height:44px;border-radius:12px}
.qn{all:unset;cursor:pointer;display:flex;flex-direction:column;min-width:0;min-height:44px;justify-content:center}
.qn b{font-weight:800;font-size:.95rem;line-height:1.2;overflow-wrap:anywhere}.qn small{font-size:.76rem;color:var(--ink-soft)}
.qn:focus-visible{outline:3px solid var(--yellow);outline-offset:2px;border-radius:6px}
.qs{font-size:.74rem;font-weight:800}.qs.ok{color:#5FD39B}.qs.bad{color:#FF8A9C}
.qf{display:flex;flex-direction:column;gap:2px}
.qf small{font-size:.62rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft)}
.qpi{width:100%;min-width:0;min-height:44px;border-radius:12px;border:1px solid var(--line);background:rgba(255,255,255,.05);color:var(--ink);font:700 16px var(--font-body);padding:0 8px;font-variant-numeric:tabular-nums}
.qpi:focus{outline:none;border-color:var(--yellow);box-shadow:0 0 0 3px rgba(255,216,0,.18)}
.qpi[aria-invalid="true"]{border-color:#FF8A9C}

/* logo del pie: 3 toques abren el acceso del dueño; sin selección ni zoom por doble toque */
.foot-logo{touch-action:manipulation;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;cursor:default}