/* ChaseTCG · tunnel (/resultat/ et /debloquer/) : aperçu verrouillé, réassurance, conseils, barre collée, paywall.
   Surcharge site.css sans le modifier. */
:root{--ok:#1C7A44;--acc:#B5620E}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--ok:#62D597;--acc:#F7A030}}
:root[data-theme="dark"]{--ok:#62D597;--acc:#F7A030}

.ic{width:18px;height:18px;flex:0 0 auto}

/* ===== Ce qui est gratuit ===== */
.kick{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin:0 0 10px}
.t-free{display:inline-flex;align-items:center;gap:7px;padding:4px 11px 4px 9px;border-radius:999px;font-size:.76rem;font-weight:700;line-height:1.3;
  color:var(--text);background:color-mix(in srgb,var(--ok) 14%,var(--surface))}
.t-free i{width:7px;height:7px;border-radius:50%;background:var(--ok)}
.free .found{font-size:1.06rem;line-height:1.35;font-weight:600}
.free .from{display:flex;align-items:baseline;flex-wrap:wrap;gap:0 8px;margin-top:2px;color:var(--muted);font-weight:600}
.free .px,.crange .px{font-family:"Anton",Impact,"Arial Narrow Bold",sans-serif;font-weight:400;font-size:2.3rem;line-height:1.05;letter-spacing:.01em;color:var(--text);white-space:nowrap}
.src{display:flex;align-items:flex-start;gap:8px;margin:10px 0 0;font-size:.86rem;line-height:1.4;color:var(--muted)}
.src .ic{width:16px;height:16px;margin-top:1px;color:var(--acc)}
/* fiche de la carte */
.fiche{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 16px;margin:0}
.fiche div{min-width:0}
.fiche dt{font-size:.7rem;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--muted)}
.fiche dd{margin:1px 0 0;font-size:.95rem;font-weight:700;line-height:1.3;overflow-wrap:anywhere}
.crange{display:flex;align-items:baseline;flex-wrap:wrap;gap:0 10px;margin:14px 0 0}
.crange>span{font-weight:600;color:var(--muted)}
.crange .px{font-size:1.9rem}
/* prix le plus bas verrouillé : un cadenas et un « xx,xx € » flouté, jamais un vrai chiffre */
.pxlock{display:inline-flex;align-items:center;gap:8px}
.pxlock .lock{width:.62em;height:.62em;flex:none;color:var(--muted)}
.pxlock>span[aria-hidden]{filter:blur(8px);-webkit-user-select:none;user-select:none}
.crange small{font-size:.84rem;color:var(--muted)}
/* compte à rebours (Préco) */
.countrow{display:flex;align-items:center;gap:14px}
.count{flex:0 0 auto;display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:86px;margin:0;padding:10px 12px 9px;border-radius:18px;
  background:var(--ground);text-align:center}
.count b{font-family:"Anton",Impact,sans-serif;font-weight:400;font-size:2.1rem;line-height:1;white-space:nowrap}
.count span{margin-top:3px;font-size:.72rem;font-weight:650;color:var(--muted);line-height:1.2}
.countrow .found{font-size:1rem;font-weight:500}

/* ===== Aperçu verrouillé ===== */
.lockbox{margin-top:20px}
.offer{margin:18px 0 12px;font-family:inherit;font-weight:750;font-size:1.14rem;line-height:1.25;letter-spacing:-.005em;max-width:none;text-wrap:balance}
.lockbox h2{margin:0 0 4px;font-family:inherit;font-weight:750;font-size:1.14rem;line-height:1.25;letter-spacing:-.005em;max-width:none;text-wrap:balance}
.lockbox .sub{margin:0 0 12px;color:var(--muted);font-size:.9rem;line-height:1.45}
.ltable{width:100%;border-collapse:separate;border-spacing:0;table-layout:fixed;border-radius:16px;overflow:hidden;font-size:.88rem;
  background:var(--ground);box-shadow:inset 0 0 0 1px var(--line)}
.ltable th,.ltable td{padding:0 10px;text-align:left;vertical-align:middle;white-space:nowrap;overflow:hidden}
.ltable thead th{height:34px;font-size:.68rem;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--muted)}
.ltable tbody td,.ltable tbody th{height:46px;border-top:1px solid var(--line)}
.ltable th:first-child,.ltable td:first-child{padding-left:14px}
.ltable th:last-child,.ltable td:last-child{padding-right:10px}
.ltable .c-px{width:36%}
.ltable .c-st{width:17%}
.ltable .c-ln{width:58px;text-align:right}
.ltable .c-no{width:46px}
.ltable td.ln{text-align:right}
.ltable .bar{display:inline-block;vertical-align:middle;height:9px;max-width:100%;border-radius:999px;
  background:linear-gradient(90deg,color-mix(in srgb,var(--text) 26%,transparent),color-mix(in srgb,var(--text) 10%,transparent));filter:blur(1.2px)}
.ltable .bt .bar{max-width:calc(100% - 24px)}
.ltable .lock{width:14px;height:14px;color:var(--muted);vertical-align:middle;margin:-2px 8px 0 0}
.ltable .best td{background:color-mix(in srgb,var(--cta) 10%,transparent)}
.ltable .px b{font-weight:750;color:var(--text)}
.ltable .no{font-family:"Anton",Impact,sans-serif;font-size:1.05rem;color:var(--muted)}
.ltable .none{height:auto;padding:16px 14px;white-space:normal;color:var(--muted);font-size:.88rem}
.lkpill{display:inline-grid;place-items:center;width:34px;height:28px;border-radius:10px;background:var(--surface);box-shadow:0 2px 6px -3px var(--shadow-soft)}
.lkpill .lock{margin:0}
.lt-cote .c-g{width:124px}
.lt-cote .c-ln{width:50px}
.lt-cote tbody td,.lt-cote tbody th{height:42px}
.gchip{display:inline-flex;align-items:center;justify-content:center;width:98px;height:30px;border-radius:10px;vertical-align:middle;
  background:linear-gradient(180deg,#1F2B4F,#111933);box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 4px 10px -6px rgba(1,3,10,.5)}
.gchip img{height:15px;width:auto;max-width:80px;object-fit:contain}
.gchip img.g-bgs{height:22px}
.gchip img.g-collectaura{height:19px}
:root[data-theme="dark"] .gchip{box-shadow:inset 0 0 0 1px rgba(242,235,220,.12)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .gchip{box-shadow:inset 0 0 0 1px rgba(242,235,220,.12)}}
.gchip.raw{color:#F2EBDC;font-size:.7rem;font-weight:750;letter-spacing:.12em;text-transform:uppercase}

/* ===== Réassurance et conseils ===== */
.lockbox+.cta{margin-top:16px}
.reass{list-style:none;margin:14px 0 0;padding:0;display:grid;grid-template-columns:minmax(0,1fr);gap:8px;font-size:.84rem;line-height:1.35;color:var(--muted)}
.reass li{display:flex;align-items:flex-start;gap:8px}
.reass b{color:var(--text);font-weight:700}
.reass .ic{width:17px;height:17px;margin-top:1px;color:var(--acc)}
@media (min-width:520px){.reass{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 14px}}
.tips{margin-top:20px;padding:16px 16px 6px;border-radius:18px;background:var(--surface-2)}
.tips-t{display:flex;align-items:center;gap:9px;margin:0 0 10px;font-size:.95rem;font-weight:750}
.tips-t img{width:17px;height:auto}
.tips ul{list-style:none;margin:0;padding:0}
.tips li{position:relative;padding:0 0 10px 16px;font-size:.88rem;line-height:1.45;color:color-mix(in srgb,var(--text) 76%,var(--muted))}
.tips li::before{content:"";position:absolute;left:0;top:.3em;width:4px;height:.95em;border-radius:3px;background:linear-gradient(180deg,#16D9F2,#7A5CFF 45%,#F23DCB 75%,#F7A030)}
.tips li b{color:var(--text);font-weight:700}

/* ===== Barre collée (mobile) : le bouton reste à portée ===== */
.stick{position:fixed;left:0;right:0;bottom:0;z-index:40;padding:10px 12px calc(10px + env(safe-area-inset-bottom,0px));pointer-events:none;
  transform:translateY(115%);visibility:hidden;transition:transform .32s cubic-bezier(.2,.8,.2,1),visibility 0s linear .32s}
.stick.on{transform:none;visibility:visible;transition:transform .32s cubic-bezier(.2,.8,.2,1)}
.stick>*{pointer-events:auto}
.stick.rs .cta{display:flex;align-items:center;justify-content:center;width:100%;max-width:560px;margin:0 auto}
.st-in{display:flex;align-items:center;gap:12px;max-width:560px;margin:0 auto;padding:8px 8px 8px 16px;border-radius:20px;background:var(--surface);
  box-shadow:inset 0 0 0 1px var(--line),0 18px 40px -16px var(--shadow)}
.st-p{margin:0;flex:1 1 auto;min-width:0;line-height:1.15}
.st-p b{display:block;font-family:"Anton",Impact,sans-serif;font-weight:400;font-size:1.5rem}
.st-p small{display:block;font-size:.76rem;color:var(--muted)}
.st-in .cta{flex:0 0 auto;display:inline-flex;align-items:center;height:52px;padding:0 20px;text-decoration:none;font-size:1rem}
@media (min-width:960px){.stick.rs{display:none}}
@media (min-width:900px){.stick.ps{display:none}}

/* ===== Paywall ===== */
/* site.css donne un display aux blocs (.recap, .err) : hidden doit rester plus fort */
.tunnel [hidden]{display:none!important}
.tunnel.page{padding-top:4px}
.tunnel .pay{gap:0}
.pay-head .eyebrow{display:inline-flex;align-items:center;gap:8px;margin:0 0 6px;font-size:.82rem;font-weight:700;color:var(--muted)}
.pay-head .eyebrow i{width:7px;height:7px;border-radius:50%;background:var(--cta)}
.tunnel .pay h1{font-size:clamp(1.8rem,4vw,2.7rem);line-height:1.03;max-width:18ch;margin:0 0 10px}
.pay-head .lead{margin:0 0 18px;max-width:52ch;font-size:.98rem;line-height:1.5;color:var(--muted)}
.pay-head .lead b{color:var(--text);font-weight:700}
.tunnel .recap{margin-bottom:14px;padding:12px 16px 12px 12px}
.tunnel .recap .k{display:block;font-size:.76rem;font-weight:650;color:var(--muted)}
.tunnel .recap b{font-size:1.02rem}
@media (max-width:599px){.tunnel .recap .v{width:60px}.tunnel .recap .v img{max-height:70px}.tunnel .recap .v .mini{width:52px}}
.tunnel .lockbox{margin:0 0 16px;padding:16px;border-radius:20px;background:var(--surface);box-shadow:inset 0 0 0 1px var(--line)}
.lb-top{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 0 12px}
.tunnel .lockbox h2{margin:0;font-size:1.02rem}
.t-lock{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:999px;font-size:.74rem;font-weight:700;color:var(--muted);background:var(--surface-2)}
.t-lock .lock{width:12px;height:12px}
.tunnel .lockbox .src{margin-top:10px}
.incl{margin:22px 0 0}
.incl h2,.tunnel .tips-t{font-family:inherit}
.incl h2{margin:0 0 12px;font-size:1.02rem;font-weight:750;line-height:1.3}
.tunnel .gets{font-size:.95rem}
.tunnel .gets li{line-height:1.4}
.tunnel .gets svg{color:var(--acc)}
/* formulaire */
.tunnel .form{padding:20px 20px 18px;scroll-margin-top:12px;margin-top:6px}
.sum{display:flex;align-items:center;justify-content:space-between;gap:14px;margin:0 0 18px;padding:0 0 16px;border-bottom:1px solid var(--line)}
.sum b{display:block;font-size:1rem;font-weight:750}
.sum small{display:block;font-size:.84rem;line-height:1.35;color:var(--muted)}
.sum-p{flex:0 0 auto;margin:0;text-align:right}
.sum-p b{font-family:"Anton",Impact,sans-serif;font-weight:400;font-size:2.1rem;line-height:1}
.trust{margin:4px 0 12px;padding:12px 14px;border-radius:14px;background:var(--surface-2)}
.secure{display:flex;align-items:center;gap:8px;margin:0;font-size:.9rem;font-weight:700}
.secure .ic{color:var(--ok)}
.paylogos{display:flex;gap:6px;margin-left:auto}
.secure .sl{white-space:nowrap}
.paylogos img{width:36px;height:24px;padding:3px 4px;border-radius:6px;object-fit:contain;background:#fff;box-shadow:0 1px 3px rgba(12,18,38,.18)}
.paylogos img.cb{padding:0;object-fit:cover}
.trust .mini{list-style:none;display:flex;flex-wrap:wrap;gap:4px 16px;margin:9px 0 0;padding:0;font-size:.82rem;color:var(--muted)}
.trust .mini li{display:flex;align-items:center;gap:6px}
.trust .mini .ic{width:15px;height:15px;color:var(--acc)}
.tunnel .form .legal{font-size:.8125rem}
@media (min-width:900px){
  .tunnel.page{padding-top:8px}
  .tunnel .pay{grid-template-columns:minmax(0,1fr) minmax(0,440px);grid-template-rows:repeat(5,auto) 1fr;column-gap:56px;row-gap:0;
    grid-template-areas:"head form" "recap form" "preview form" "incl form" "tips form" ". form"}
  .pay-head{grid-area:head}
  .tunnel #recap{grid-area:recap}
  .tunnel #preview{grid-area:preview}
  .incl{grid-area:incl;margin-top:6px}
  .tunnel .tips{grid-area:tips}
  .tunnel .form{grid-area:form;margin-top:0}
}
/* le formulaire suit le défilement seulement si l’écran le montre en entier */
@media (min-width:900px) and (min-height:780px){.tunnel .form{position:sticky;top:16px}}