/* Strip Poker — hentaionlinegames.com */
:root{--fond:#0d0509;--fond2:#1a0a14;--velours:#2a0d1f;--tapis:#0f3b33;--tapis2:#0a2a24;--or:#e8c170;--or2:#b8893a;--rose:#ff2e88;--rose2:#c41a63;--bleu:#3aa7ff;--txt:#f6eef2;--mut:#bfa7b4;
  --cw:clamp(52px,16.5vw,92px)}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{font-family:"Outfit",system-ui,sans-serif;color:var(--txt);background:radial-gradient(ellipse at 50% -10%,#4a1030 0%,transparent 55%),radial-gradient(ellipse at 100% 100%,#2a0b3a 0%,transparent 50%),var(--fond);min-height:100vh;line-height:1.5}
body.bloque{overflow:hidden}
a{color:inherit}
button{font:inherit;cursor:pointer}
[hidden]{display:none!important}
.btn{border:0;border-radius:999px;padding:12px 22px;font-weight:700;font-size:.95rem;transition:transform .15s,filter .15s;color:#fff;white-space:nowrap}
.btn:active{transform:scale(.96)}
.btn.rose{background:linear-gradient(135deg,var(--rose),var(--rose2));box-shadow:0 6px 24px -6px rgba(255,46,136,.8)}
.btn.bleu{background:linear-gradient(135deg,#3aa7ff,#2463d6)}
.btn.sombre{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16)}
.btn:hover{filter:brightness(1.12)}
.r18{display:inline-grid;place-items:center;width:34px;height:34px;border:2px solid var(--rose);border-radius:50%;color:var(--rose);font-weight:800;font-size:.75rem;margin-right:8px;vertical-align:middle;flex:none}

/* barre */
.barre{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 16px;background:rgba(13,5,9,.82);backdrop-filter:blur(12px);border-bottom:1px solid rgba(232,193,112,.18)}
.logo{display:flex;align-items:center;gap:8px;text-decoration:none;font-weight:800;font-size:.9rem}
.logo b{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;background:linear-gradient(135deg,var(--rose),#8a4dff)}
.logo em{font-style:normal;color:var(--rose)}
.nom-jeu{font-family:"Playfair Display",serif;font-style:italic;color:var(--or);font-size:1.15rem;letter-spacing:.02em}
.outils{display:flex;gap:8px;align-items:center}
select,.icone{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.15);color:var(--txt);border-radius:10px;padding:7px 9px;font:inherit;font-size:.85rem}
select option{background:#1a0a14}
.icone{width:38px;padding:6px 0}

/* écran de choix */
.ecran{max-width:1180px;margin:0 auto;padding:26px 16px 30px}
#ecran-choix h1{font-family:"Playfair Display",serif;font-size:clamp(1.5rem,4.2vw,2.6rem);text-align:center;color:var(--or);text-shadow:0 2px 30px rgba(232,193,112,.35);line-height:1.2}
.sous{text-align:center;font-size:1.05rem;margin-top:14px;letter-spacing:.14em;text-transform:uppercase;color:var(--rose)}
.intro{text-align:center;color:var(--mut);max-width:620px;margin:6px auto 26px}
.liste{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.adv{background:linear-gradient(180deg,var(--velours),#150711);border:1px solid rgba(232,193,112,.25);border-radius:20px;overflow:hidden;transition:transform .3s,box-shadow .3s}
.adv:hover{transform:translateY(-6px);box-shadow:0 20px 50px -20px rgba(255,46,136,.6)}
.adv-img{position:relative;aspect-ratio:4/5;overflow:hidden;background:#12060f}
.adv-img img{width:100%;height:100%;object-fit:cover;object-position:50% 15%;transition:transform .6s}
.adv:hover .adv-img img{transform:scale(1.05)}
.adv.verrou .adv-img img{filter:brightness(.7) saturate(.85)}
.cadenas{position:absolute;right:10px;bottom:10px;width:46px;height:46px;border-radius:50%;display:grid;place-items:center;font-size:1.4rem;background:rgba(13,5,9,.78);border:1px solid var(--or2);box-shadow:0 4px 14px rgba(0,0,0,.5)}
.badge-v{position:absolute;top:10px;left:10px;background:rgba(13,5,9,.8);border:1px solid var(--or);color:var(--or);font-size:.72rem;font-weight:700;padding:4px 10px;border-radius:999px}
.adv-txt{padding:14px 16px 18px}
.adv-txt h3{font-family:"Playfair Display",serif;font-size:1.3rem}
.adv-txt h3 small{font-family:"Outfit",sans-serif;font-size:.8rem;color:var(--mut);font-weight:400;margin-left:6px}
.adv-txt p{color:var(--mut);font-size:.9rem}
.niv b{color:var(--or);letter-spacing:2px}
.adv-btns{display:flex;gap:8px;margin-top:12px;flex-wrap:wrap}
.adv-btns .btn{padding:10px 18px;font-size:.88rem}
.msg-verrou{margin-top:10px;font-size:.82rem!important;font-style:italic}

/* partie */
#ecran-jeu{padding-top:14px;max-width:1240px}
.jeu{display:grid;grid-template-columns:minmax(280px,42%) 1fr;gap:22px;align-items:start}
.portrait{position:relative;border-radius:22px;overflow:hidden;aspect-ratio:2/3;max-height:calc(100vh - 110px);background:#12060f;border:2px solid var(--or2);box-shadow:0 0 0 5px rgba(232,193,112,.08),0 30px 80px -30px rgba(255,46,136,.6);transition:box-shadow .5s}
.portrait img{width:100%;height:100%;object-fit:cover;object-position:50% 15%;display:block;transition:filter .45s,opacity .45s,transform .9s}
.portrait.change img{filter:brightness(2.4) blur(14px);opacity:.25;transform:scale(1.06)}
.portrait.revele{box-shadow:0 0 0 5px var(--rose),0 0 80px 10px rgba(255,46,136,.7)}
.etiq{position:absolute;left:0;right:0;bottom:0;padding:40px 16px 14px;background:linear-gradient(transparent,rgba(13,5,9,.92))}
.etiq b{font-family:"Playfair Display",serif;font-size:1.5rem;display:block;line-height:1.1}
.etiq small{color:var(--mut);font-size:.85rem}
.bulle{position:absolute;top:14px;left:14px;right:14px;background:#fff;color:#2a0d1f;font-weight:600;font-size:.92rem;padding:10px 14px;border-radius:16px 16px 16px 4px;box-shadow:0 10px 30px rgba(0,0,0,.4);opacity:0;transform:translateY(-8px) scale(.95);transition:opacity .3s,transform .3s;pointer-events:none}
.bulle.vu{opacity:1;transform:none}

.table{position:relative;background:radial-gradient(ellipse at 50% 40%,#13584b 0%,var(--tapis) 45%,var(--tapis2) 100%);border:10px solid #3b1a0e;border-radius:34px;box-shadow:inset 0 0 0 2px var(--or2),inset 0 0 60px rgba(0,0,0,.55),0 30px 80px -30px #000;padding:18px 16px 16px;display:flex;flex-direction:column;gap:10px;transition:box-shadow .4s}
.table.flash-v{box-shadow:inset 0 0 0 2px var(--or2),inset 0 0 80px rgba(80,255,170,.35),0 0 60px -10px rgba(80,255,170,.6)}
.table.flash-r{box-shadow:inset 0 0 0 2px var(--or2),inset 0 0 80px rgba(255,60,90,.35),0 0 60px -10px rgba(255,60,90,.6)}
.ligne-adv,.ligne-j{display:flex;justify-content:space-between;align-items:center;gap:10px}
.stat{display:flex;flex-direction:column;gap:2px}
.stat span{font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.6)}
.stat:last-child{align-items:flex-end}
.jet{font-size:1.25rem;color:var(--or);display:flex;align-items:center;gap:6px}
.jet::before{content:"";width:16px;height:16px;border-radius:50%;background:radial-gradient(circle,#fff 0 22%,var(--rose) 23% 60%,#fff 61% 66%,var(--rose) 67%);box-shadow:0 1px 0 #7a0c3a}
.habits{display:flex;gap:5px}
.habits i{width:14px;height:14px;border-radius:4px;border:1.5px solid var(--rose);transform:rotate(45deg);transition:background .4s}
.habits i.on{background:var(--rose);box-shadow:0 0 10px var(--rose)}
.vies{color:var(--rose);font-size:1.25rem;letter-spacing:3px}

.main{display:flex;justify-content:center;gap:8px;min-height:calc(var(--cw)*1.4)}
.main.ia{--cw:clamp(40px,11vw,66px);min-height:calc(var(--cw)*1.4)}
.slot{background:none;border:0;padding:0;position:relative;transition:transform .2s}
.slot.jete{transform:translateY(-16px)}
.slot.jete .carte{filter:brightness(.55)}
.slot .lbl{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) rotate(-12deg);background:var(--rose);color:#fff;font-size:.62rem;font-weight:800;letter-spacing:.08em;padding:3px 6px;border-radius:5px;opacity:0;transition:opacity .2s;pointer-events:none}
.slot.jete .lbl{opacity:1}

.carte{width:var(--cw);aspect-ratio:5/7;background:linear-gradient(160deg,#fff,#f1ece4);border-radius:calc(var(--cw)*.1);box-shadow:0 4px 10px rgba(0,0,0,.4),inset 0 0 0 1px rgba(0,0,0,.08);position:relative;color:#1b1b22;font-weight:800;user-select:none}
.carte.rouge{color:#d01848}
.carte .coin{position:absolute;top:5%;left:9%;font-size:calc(var(--cw)*.24);line-height:1;display:flex;flex-direction:column;align-items:center}
.carte .coin i{font-style:normal;font-size:.8em}
.carte .coin.bas{top:auto;left:auto;bottom:5%;right:9%;transform:rotate(180deg)}
.carte .milieu{position:absolute;inset:0;display:grid;place-items:center;font-size:calc(var(--cw)*.5)}
.carte.dos{background:repeating-linear-gradient(45deg,#7a0c3a 0 5px,#5c0a2c 5px 10px);box-shadow:0 4px 10px rgba(0,0,0,.4),inset 0 0 0 3px #fff,inset 0 0 0 5px var(--or2)}
.carte.dos::after{content:"♥";position:absolute;inset:0;display:grid;place-items:center;color:var(--or);font-size:calc(var(--cw)*.4)}
.carte.donne{animation:donne .45s backwards cubic-bezier(.2,.8,.3,1.2)}
@keyframes donne{from{transform:translateY(-60px) rotate(-14deg) scale(.7);opacity:0}}
.carte.retourne{animation:retourne .55s backwards}
@keyframes retourne{0%{transform:rotateY(90deg)}100%{transform:none}}

.nom-main{text-align:center;font-size:.82rem;font-weight:700;color:var(--or);min-height:1.2em;letter-spacing:.06em;text-transform:uppercase}
.centre{display:flex;align-items:center;justify-content:center;gap:14px;flex-wrap:wrap;padding:6px 0}
.pot{background:rgba(0,0,0,.35);border:1px solid rgba(232,193,112,.5);border-radius:999px;padding:6px 16px;display:flex;gap:8px;align-items:center}
.pot span{font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.7)}
.pot b{color:var(--or);font-size:1.1rem}
.msg{font-weight:600;text-align:center;min-height:1.5em;text-shadow:0 1px 4px rgba(0,0,0,.6)}
.actions{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;min-height:48px}
.actions .btn{min-width:120px}
.lien{background:none;border:0;color:rgba(255,255,255,.7);font-size:.85rem;align-self:center;margin-top:2px}
.lien:hover{color:#fff}

/* modal */
.modal{position:fixed;inset:0;z-index:50;background:rgba(8,2,6,.82);backdrop-filter:blur(8px);display:none;place-items:center;padding:18px}
.modal.ouvert{display:grid}
.boite{background:linear-gradient(180deg,var(--velours),#12060f);border:1px solid var(--or2);border-radius:22px;padding:30px 24px;max-width:560px;width:100%;text-align:center;box-shadow:0 30px 100px -20px rgba(255,46,136,.5);animation:monte .4s;max-height:92vh;overflow:auto}
@keyframes monte{from{transform:translateY(24px) scale(.96);opacity:0}}
.boite h2{font-family:"Playfair Display",serif;color:var(--or);font-size:1.7rem}
.boite p{color:var(--mut);margin:10px 0 18px}
.m-btns{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.galerie{display:grid;grid-template-columns:repeat(auto-fit,minmax(70px,1fr));gap:8px;margin-bottom:18px}
.galerie img,.g-verrou{width:100%;aspect-ratio:2/3;object-fit:cover;object-position:50% 15%;border-radius:10px;border:1px solid var(--or2);cursor:zoom-in}
.g-verrou{display:grid;place-items:center;background:#12060f;font-size:1.4rem}
.galerie img.zoom{position:fixed;inset:4vh 4vw;width:auto;height:92vh;margin:auto;z-index:60;cursor:zoom-out;object-fit:contain;background:#000}

/* 18+ */
#porte{position:fixed;inset:0;z-index:100;background:rgba(8,2,6,.96);backdrop-filter:blur(16px);display:grid;place-items:center;padding:18px}
#porte .boite{display:flex;flex-direction:column;gap:10px;align-items:center}
#porte .r18{width:64px;height:64px;font-size:1.2rem;margin:0 0 6px}
#porte .btn{width:100%}

/* SEO */
.seo{max-width:860px;margin:10px auto 0;padding:10px 18px 40px;color:var(--mut)}
.seo h2{font-family:"Playfair Display",serif;color:var(--txt);font-size:1.4rem;margin:28px 0 10px}
.seo p{margin-bottom:10px}
.classement{list-style:none;display:grid;gap:8px}
.classement li{display:flex;justify-content:space-between;align-items:center;gap:12px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);border-radius:12px;padding:8px 12px;flex-wrap:wrap}
.classement b{color:var(--txt)}
.mini{display:flex;gap:4px;--cw:34px}
.mini .carte{box-shadow:0 1px 3px rgba(0,0,0,.4)}
.seo details{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);border-radius:12px;padding:12px 16px;margin-bottom:8px}
.seo summary{cursor:pointer;color:var(--txt);font-weight:600}
.seo details p{margin:8px 0 0}
.retour-site{margin-top:26px;text-align:center}
.pied{display:flex;align-items:center;justify-content:center;gap:4px;padding:18px;border-top:1px solid rgba(255,255,255,.08);color:var(--mut);font-size:.78rem;text-align:center}

/* mobile */
@media (max-width:860px){
  .liste{grid-template-columns:repeat(2,1fr);gap:12px}
  .jeu{grid-template-columns:1fr;gap:12px}
  #ecran-jeu{padding:8px 10px 10px}
  .portrait{aspect-ratio:auto;height:min(36vh,330px);max-height:none;border-radius:18px}
  .main.ia{--cw:34px;gap:4px}
  .stat span{font-size:.62rem}
  .jet{font-size:1.05rem}
  .centre{padding:2px 0;gap:8px}
  .msg{font-size:.88rem}
  .bulle{font-size:.82rem;padding:8px 12px;top:10px;left:10px;right:10px}
  .etiq{padding:30px 12px 10px}.etiq b{font-size:1.2rem}
  .table{border-width:6px;border-radius:22px;padding:10px 10px 8px;gap:5px}
  .main{gap:5px}
  .actions .btn{min-width:0;flex:1;padding:12px 10px;font-size:.88rem}
  .logo span{display:none}
  .nom-jeu{font-size:1rem}
  .adv-txt{padding:10px 12px 14px}.adv-txt h3{font-size:1.1rem}
  .adv-btns .btn{flex:1;padding:9px 10px}
  .galerie{grid-template-columns:repeat(3,1fr)}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
.nom-main:empty{display:none}
@media (max-width:860px) and (max-height:740px){
  .portrait{height:27vh}
  .main.ia{--cw:30px}
  .main{--cw:clamp(48px,15vw,70px)}
  .actions{min-height:44px}.actions .btn{padding:10px}
}
.recompense{display:block;max-height:52vh;max-width:100%;margin:0 auto 18px;border-radius:14px;border:2px solid var(--or);box-shadow:0 0 40px rgba(255,46,136,.5)}
.jeu>*{min-width:0}
.vies{flex-wrap:wrap;word-break:break-all}
video.recompense{width:auto;max-width:100%;max-height:58vh;background:#000}
.g-video{grid-column:1/-1;width:100%;max-height:60vh;border-radius:12px;border:1px solid var(--or2);background:#000}

.badge-u{position:absolute;top:14px;right:-34px;transform:rotate(38deg);background:linear-gradient(90deg,#ff2e4d,var(--rose));color:#fff;font-size:.68rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;padding:5px 40px;box-shadow:0 4px 14px rgba(255,46,77,.6);animation:pulseU 2s infinite}
@keyframes pulseU{50%{filter:brightness(1.25)}}
@media (max-width:860px){.badge-u{font-size:.56rem;top:10px;right:-38px;padding:4px 40px}.cadenas{width:38px;height:38px;font-size:1.1rem}}
.btn.live{background:linear-gradient(135deg,#ff2e4d,#ff2e88);text-decoration:none;display:inline-flex;align-items:center;box-shadow:0 6px 24px -6px rgba(255,46,77,.8);animation:camPulse 1.8s infinite}
@keyframes camPulse{50%{box-shadow:0 6px 30px -2px rgba(255,46,77,1)}}
.m-btns .btn.live{order:-1;flex-basis:100%;justify-content:center}

/* liste des adversaires (texte SEO) */
.liens-adv{list-style:none;display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:10px}
.liens-adv a{display:flex;gap:12px;align-items:center;text-decoration:none;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);border-radius:12px;padding:8px}
.liens-adv a:hover{border-color:var(--rose)}
.liens-adv img{width:46px;height:69px;object-fit:cover;object-position:50% 15%;border-radius:8px}
.liens-adv b{display:block;color:var(--txt)}
.liens-adv small{color:var(--mut);font-size:.82rem}

/* pages adversaires */
.perso-page .barre{grid-template-columns:1fr auto 1fr}
.perso-page .nom-jeu{text-decoration:none}
.perso{max-width:1100px;margin:0 auto;padding:18px 18px 40px}
.ariane{font-size:.85rem;color:var(--mut);margin-bottom:16px}
.ariane a{color:var(--mut)}
.perso-fiche{display:grid;grid-template-columns:minmax(260px,420px) 1fr;gap:34px;align-items:start}
.perso-img{position:relative;border-radius:20px;overflow:hidden;border:2px solid var(--or2);box-shadow:0 30px 80px -30px rgba(255,46,136,.6)}
.perso-img img{width:100%;height:auto;display:block}
.pbadge{position:absolute;left:12px;bottom:12px;background:rgba(13,5,9,.8);border:1px solid var(--or);color:var(--or);font-size:.75rem;font-weight:700;padding:5px 10px;border-radius:999px}
.pbadge.u{bottom:auto;top:12px;left:auto;right:12px;background:linear-gradient(90deg,#ff2e4d,var(--rose));color:#fff;border:0;text-transform:uppercase;letter-spacing:.08em}
.perso-txt h1{font-family:"Playfair Display",serif;color:var(--or);font-size:clamp(1.7rem,4vw,2.6rem);line-height:1.15;margin-bottom:14px}
.perso-meta{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin-bottom:18px}
.perso-meta li{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);border-radius:999px;padding:5px 12px;font-size:.88rem}
.perso-meta b{color:var(--or)}
.perso-txt>p{color:var(--mut);font-size:1.05rem;margin-bottom:22px;max-width:60ch}
.perso-txt .note{font-size:.85rem;margin-top:12px}
.btn.gros{display:inline-block;padding:15px 30px;font-size:1.05rem;text-decoration:none}
.perso h2{font-family:"Playfair Display",serif;margin:44px 0 14px}
.autres{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:14px}
.adv-mini{text-decoration:none;color:var(--txt);background:var(--velours);border:1px solid rgba(232,193,112,.25);border-radius:14px;overflow:hidden}
.adv-mini img{width:100%;aspect-ratio:2/3;height:auto;object-fit:cover;object-position:50% 15%;display:block}
.adv-mini b{display:block;padding:8px 10px 0;font-family:"Playfair Display",serif}
.adv-mini small{display:block;padding:0 10px 10px;color:var(--mut);font-size:.8rem}
.langs{margin-top:30px;text-align:center;color:var(--mut);font-size:.85rem}
.langs a{color:var(--mut)}
@media (max-width:760px){.perso-fiche{grid-template-columns:1fr}.perso-img{max-width:420px;margin:0 auto}}