html,body{margin:0;padding:0}
body.oops-body{background:#FBF1E3;min-height:100vh;display:flex;flex-direction:column}
main{flex:1}
img{max-width:100%;height:auto}
.oops-exit{position:fixed;left:16px;bottom:16px;z-index:2147481000;background:#2A0A10;color:#FBF1E3;border:0;border-radius:999px;padding:10px 16px;font:700 13px 'DM Sans',sans-serif;cursor:pointer;box-shadow:0 8px 24px rgba(0,0,0,.25)}
.oops-exit:hover{background:#A10121}
.oops-flash{margin-top:10px;font:600 15px 'DM Sans',sans-serif}
/* páginas de texto (blog, políticas) */
.oops-doc{max-width:760px;margin:0 auto;padding:56px 24px 80px;font-family:'DM Sans',sans-serif;color:#2A0A10;line-height:1.65;font-size:17px}
.oops-doc h1{font-family:'Fraunces',serif;font-weight:800;font-size:clamp(32px,5vw,48px);line-height:1.1;margin:0 0 18px;color:#A10121}
.oops-doc h2{font-family:'Fraunces',serif;font-weight:700;font-size:24px;margin:32px 0 10px}
.oops-doc h3{font-family:'Fraunces',serif;font-weight:700;font-size:19px;margin:24px 0 8px}
.oops-doc a{color:#A10121}
.oops-doc hr{border:0;border-top:1px solid rgba(42,10,16,.15);margin:36px 0}
.oops-doc .meta{color:#5A3A3E;font-size:14px;margin-bottom:24px}
.oops-doc img.cover{border-radius:24px;margin:0 0 28px;width:100%;object-fit:cover;max-height:420px}
.oops-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:20px;max-width:1180px;margin:0 auto;padding:0 24px 80px}
.oops-card{background:#fff;border-radius:24px;overflow:hidden;text-decoration:none;color:#2A0A10;display:flex;flex-direction:column;box-shadow:0 6px 20px rgba(42,10,16,.06);transition:transform .15s}
.oops-card:hover{transform:translateY(-3px)}
.oops-card img{aspect-ratio:4/3;object-fit:cover;width:100%}
.oops-card .ph{aspect-ratio:4/3;background:linear-gradient(135deg,#A10121,#FF4D52);display:grid;place-items:center;color:#FBF1E3;font:800 54px 'Fraunces',serif}
.oops-card .in{padding:18px 20px 22px;display:flex;flex-direction:column;gap:8px}
.oops-card h3{font:700 20px/1.2 'Fraunces',serif;margin:0}
.oops-card p{margin:0;font:400 15px/1.5 'DM Sans',sans-serif;color:#5A3A3E}
.oops-pagehead{max-width:1180px;margin:0 auto;padding:56px 24px 28px;font-family:'DM Sans',sans-serif}
.oops-pagehead h1{font:800 clamp(36px,5vw,56px)/1.05 'Fraunces',serif;color:#A10121;margin:6px 0 10px}
.oops-pagehead p{font-size:18px;color:#5A3A3E;max-width:640px;margin:0}
.oops-footer__brand img{align-self:flex-start;width:auto!important;height:46px!important}
.oops-mundo--dark .oops-mundo__t,.oops-mundo--dark .oops-mundo__d{color:#FBF1E3!important}
.oops-video{background:#6E0016 url(/assets/mia-marco.jpg) center 20%/cover no-repeat!important;color:transparent!important;min-height:340px}
[hidden]{display:none!important}
/* ===== Blog interactivo ===== */
.ob-bar{position:fixed;top:0;left:0;height:4px;background:#A10121;width:0;z-index:999;transition:width .1s}
.ob-score{position:fixed;right:16px;bottom:78px;z-index:998;background:#A10121;color:#FBF1E3;font:700 14px 'DM Sans',sans-serif;padding:10px 16px;border-radius:999px;box-shadow:0 6px 20px rgba(161,1,33,.35);transition:transform .2s}
.ob-score.pop{transform:scale(1.25)}
.oops-doc .ob-photo{margin:26px 0;border-radius:22px;overflow:hidden}
.oops-doc .ob-photo img{width:100%;display:block;object-fit:cover;max-height:440px}
.oops-doc .ob-photo figcaption{font-size:13px;color:#5A3A3E;padding:8px 4px;font-style:italic}
.ob-tip{perspective:900px;margin:22px 0;cursor:pointer;min-height:130px}
.ob-tip .in{position:relative;min-height:130px;transition:transform .6s;transform-style:preserve-3d}
.ob-tip.on .in{transform:rotateY(180deg)}
.ob-tip .f,.ob-tip .b{position:absolute;inset:0;backface-visibility:hidden;border-radius:20px;padding:22px 24px;display:flex;flex-direction:column;justify-content:center}
.ob-tip .f{background:#A10121;color:#FBF1E3;text-align:center;font:700 19px 'Fraunces',serif}
.ob-tip .f small{display:block;font:500 13px 'DM Sans',sans-serif;opacity:.85;margin-top:6px}
.ob-tip .b{background:#2A0A10;color:#FBF1E3;transform:rotateY(180deg);font-size:16px}
.ob-tip .b b{color:#F2A7B5}
.ob-nota{background:#FFF;border-left:5px solid #A10121;border-radius:14px;padding:16px 20px;margin:22px 0;box-shadow:0 4px 18px rgba(42,10,16,.07)}
.ob-nota::before{content:'🌶️ ';}
.ob-box{background:#F6E2D2;border-radius:22px;padding:24px;margin:30px 0}
.ob-box h3{margin-top:0!important;color:#A10121}
.ob-opts{display:grid;gap:10px;margin-top:12px}
.ob-opts button,.ob-btn{font:600 15px 'DM Sans',sans-serif;background:#FBF1E3;color:#2A0A10;border:2px solid #A10121;border-radius:14px;padding:12px 16px;text-align:left;cursor:pointer}
.ob-opts button:hover{background:#fff}
.ob-opts button.sel{background:#A10121;color:#FBF1E3}
.ob-btn{background:#A10121;color:#FBF1E3;text-align:center}
.ob-res{margin-top:16px;font-size:17px}
.ob-res strong{color:#A10121;font-family:'Fraunces',serif;font-size:21px;display:block}
.ob-check label{display:flex;gap:12px;align-items:center;background:#FBF1E3;border-radius:14px;padding:12px 14px;margin:8px 0;cursor:pointer}
.ob-check input{width:22px;height:22px;accent-color:#A10121}
.ob-check label.done span{text-decoration:line-through;opacity:.6}
.ob-meter{height:10px;background:#FBF1E3;border-radius:9px;overflow:hidden;margin-top:12px}
.ob-meter i{display:block;height:100%;width:0;background:#A10121;transition:width .4s}
.ob-ruleta .ob-out{font:700 22px 'Fraunces',serif;color:#2A0A10;min-height:60px;display:flex;align-items:center;justify-content:center;text-align:center;background:#FBF1E3;border-radius:16px;padding:14px;margin:12px 0}
.ob-ruleta .ob-out.spin{animation:obsh .12s infinite}
@keyframes obsh{50%{opacity:.4}}
.ob-hearts{position:fixed;inset:0;pointer-events:none;z-index:1000}
.ob-hearts span{position:absolute;bottom:-30px;font-size:26px;animation:obup 2.2s ease-out forwards}
@keyframes obup{to{transform:translateY(-110vh) rotate(25deg);opacity:0}}
.ob-badge{display:inline-block;background:#2A0A10;color:#FBF1E3;border-radius:999px;padding:8px 16px;font-weight:700;margin-top:12px}
.ob-done{font:700 14px 'DM Sans',sans-serif;background:transparent;color:#A10121;border:2px solid #A10121;border-radius:999px;padding:8px 14px;cursor:pointer;align-self:flex-start}
.ob-done.on{background:#A10121;color:#FBF1E3}
.ob-done .y{display:none}.ob-done.on .y{display:inline}.ob-done.on .n{display:none}
.oops-card.hecho{outline:3px solid #A10121}
.oops-rit__card .ph{aspect-ratio:auto;height:200px;background:#F3DCCB center/cover no-repeat;position:relative;display:flex;align-items:flex-end;justify-content:flex-start;padding:14px;color:#2A0A10;font:700 13px 'DM Sans',sans-serif}
.oops-rit .ob-day.done span{text-decoration:none!important;opacity:1!important}
.oops-rit__card .ob-tip{margin:6px 0 4px;min-height:96px}
.oops-rit__card .ob-tip .in{min-height:96px}
.oops-rit__card .ob-tip .f{font-size:16px;padding:14px}
.oops-rit__card .ob-tip .b{font-size:14px;padding:14px 16px}
.ob-prog{display:flex;align-items:center;gap:14px;flex-wrap:wrap;background:#F6E2D2;border-radius:20px;padding:16px 20px;margin-bottom:22px}
.ob-prog .ob-meter{flex:1 1 200px;margin:0;background:#FBF1E3}
.ob-count{font:800 22px 'Fraunces',serif;color:#A10121}
.oops-rit .ob-day{cursor:pointer;border:2px solid transparent}
.oops-rit .ob-day input{position:absolute;opacity:0}
.oops-rit .ob-day.done{border-color:#A10121;background:#fff!important}
.oops-rit .ob-day.done .tick{display:inline}
.oops-rit .ob-day .tick{display:none;color:#A10121}
.ob-blur{filter:blur(5px);user-select:none;-webkit-user-select:none;background:rgba(161,1,33,.18);border-radius:4px;padding:0 2px}
/* Música para cada ocasión */
.oops-music__btn{position:fixed;left:16px;bottom:64px;z-index:2147481000;display:inline-flex;align-items:center;gap:8px;background:#A10121;color:#FBF1E3;border:0;border-radius:999px;padding:10px 16px;font:700 13px 'DM Sans',sans-serif;cursor:pointer;box-shadow:0 8px 24px rgba(161,1,33,.35)}
.oops-music__btn>span:first-child{font-size:16px;line-height:1}
.oops-music__btn.is-playing>span:first-child{animation:oopsBeat 1.2s ease-in-out infinite}
@keyframes oopsBeat{0%,100%{transform:scale(1)}50%{transform:scale(1.25)}}
.oops-music{position:fixed;left:16px;bottom:112px;z-index:2147481000;width:min(300px,calc(100vw - 32px));background:#FBF1E3;color:#2A0A10;border-radius:20px;padding:16px;box-shadow:0 18px 50px rgba(42,10,16,.3);font-family:'DM Sans',sans-serif}
.oops-music[hidden]{display:none}
.oops-music__k{margin:0 0 10px;font:700 12px/1 'DM Sans',sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#A10121}
.oops-music__list{display:grid;gap:8px}
.oops-music__occ{display:grid;grid-template-columns:28px 1fr auto;align-items:center;gap:10px;width:100%;min-height:48px;padding:0 14px;border:1.5px solid #E6CDB8;border-radius:14px;background:#fff;color:#2A0A10;font:700 15px 'DM Sans',sans-serif;text-align:left;cursor:pointer}
.oops-music__occ:hover{border-color:#A10121}
.oops-music__occ.is-on{background:#A10121;border-color:#A10121;color:#FBF1E3}
.oops-music__ico{font-size:18px}
.oops-music__st{font-size:12px;opacity:.8}
.oops-music__now{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:12px;font-size:13px;color:#6B4A50;min-height:28px}
.oops-music__now-t{font-weight:700;color:#2A0A10}
.oops-music__next{border:0;background:transparent;font-size:18px;cursor:pointer;color:#A10121;min-width:44px;min-height:36px}
.ob-agendar{font:700 14px 'DM Sans',sans-serif;color:#A10121;text-decoration:none;align-self:flex-start}
