.teads-slot-wrap{width:100%;box-sizing:border-box;display:flex;justify-content:center;align-items:center;padding:14px 18px;clear:both}
.teads-slot-wrap--top{padding-top:18px;padding-bottom:8px}.teads-slot-wrap--content{padding-top:16px;padding-bottom:18px}.teads-slot-wrap--bottom{padding-top:22px;padding-bottom:28px}
.teads-slot-wrap--home-intro{padding:6px 18px 26px}.teads-slot-wrap--home-portals{padding:26px 18px 32px}
.teads-slot{width:min(100%,970px);min-height:90px;display:flex;justify-content:center;align-items:center;box-sizing:border-box;overflow:hidden}
.teads-direct{display:block;width:100%;text-decoration:none;text-align:center}.teads-direct__label{display:block;margin:0 0 5px;font:600 10px/1.2 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;letter-spacing:.12em;text-transform:uppercase;opacity:.62}
.teads-direct img{display:block;width:auto;max-width:100%;max-height:280px;height:auto;margin:0 auto;object-fit:contain}
.teads-preview{width:100%;min-height:90px;display:flex;align-items:center;justify-content:center;gap:10px;padding:18px;box-sizing:border-box;border:1px dashed rgba(182,151,88,.62);background:rgba(7,25,35,.72);color:#eadbb7;font:600 12px/1.4 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;letter-spacing:.08em;text-transform:uppercase;text-align:center}
.teads-preview small{font-size:10px;opacity:.7;letter-spacing:.04em}
.tlv1411__ad-slot .teads-slot{width:100%;min-height:600px;padding:0}.tlv1411__ad-slot .teads-preview{min-height:600px;padding:14px 8px;writing-mode:vertical-rl}.tlv1411__ad-slot .teads-direct img{max-height:600px}
.teads-side-rail{display:none;position:fixed;top:50%;transform:translateY(-50%);width:120px;height:600px;z-index:24;box-sizing:border-box}
.teads-side-rail--left{left:12px}.teads-side-rail--right{right:12px}
.teads-side-rail .teads-slot,.teads-side-rail .teads-preview,.teads-side-rail .teads-direct{width:120px;height:600px;min-height:600px;max-height:600px}
.teads-side-rail .teads-slot{padding:0}.teads-side-rail .teads-preview{padding:18px 8px;writing-mode:vertical-rl;text-orientation:mixed}.teads-side-rail .teads-direct img{width:120px;height:600px;max-width:120px;max-height:600px;object-fit:contain}.teads-side-rail .adsbygoogle{width:120px!important;height:600px!important}
@media(min-width:1480px) and (min-height:720px){.teads-side-rail:not(.teads-side-rail--home),.teads-side-rail--home.is-active{display:block}}
@media(min-width:1680px) and (min-height:720px){.teads-side-rail{width:160px}.teads-side-rail .teads-slot,.teads-side-rail .teads-preview,.teads-side-rail .teads-direct,.teads-side-rail .teads-direct img,.teads-side-rail .adsbygoogle{width:160px!important;max-width:160px}}
@media(max-width:1479px),(max-height:719px){.teads-side-rail{display:none!important}}
@media(max-width:760px){.teads-slot-wrap{padding-left:10px;padding-right:10px}.teads-slot{min-height:76px}.teads-preview{min-height:76px;padding:12px;font-size:11px}}

/* Stage27 — Home vertical rails sit ~200px below their previous centered position on tall screens. */
.teads-side-rail--home{top:min(calc(50% + 200px),calc(100vh - 310px))}

/* Stage29B — numbered ad-map QA mode. Controlled from Settings > TAROTEYES Ad Map. */
.teads-slot--debug{overflow:visible!important}
.teads-preview--debug{
  position:relative;
  flex-direction:column;
  gap:5px;
  min-height:96px;
  border:2px dashed rgba(245,198,94,.95);
  background:rgba(24,10,36,.92);
  box-shadow:0 0 0 1px rgba(255,255,255,.06) inset,0 10px 28px rgba(0,0,0,.28);
  color:#fff4cf;
  writing-mode:horizontal-tb!important;
  text-orientation:mixed!important;
}
.teads-debug-number{
  display:block;
  font:800 42px/1 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  letter-spacing:.02em;
  color:#ffd66d;
}
.teads-debug-context{
  display:block;
  font:800 11px/1.25 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  letter-spacing:.08em;
  text-transform:uppercase;
  text-align:center;
}
.teads-preview--debug small{font-size:9px;opacity:.66;letter-spacing:.04em;text-transform:none}
.teads-side-rail .teads-preview--debug{
  writing-mode:horizontal-tb!important;
  text-orientation:mixed!important;
  padding:14px 8px;
}
.teads-side-rail .teads-preview--debug .teads-debug-number{font-size:44px}
.teads-side-rail .teads-preview--debug .teads-debug-context{font-size:10px;line-height:1.35;max-width:110px}
@media(min-width:1200px){
  html body .teads-side-rail--debug:not(.teads-side-rail--home),
  html body .teads-side-rail--debug.teads-side-rail--home.is-active{display:block!important}
}


/* Stage29C — dedicated visible map for the TAROT question intake. */
html[data-teads-debug="1"] .teads-intake-map-rail{
  top:50%;
  transform:translateY(-50%);
  z-index:2147483000;
}
@media(min-width:1200px){
  html[data-teads-debug="1"] body .teads-intake-map-rail.is-active{display:block!important}
}
@media(max-width:1199px){
  html[data-teads-debug="1"] body .teads-intake-map-rail{display:none!important}
}

/* Stage29F — Home/TAROT intake side rails begin 72px below the first viewport.
   On a 1920×1080 display this means the rails start after the first 1080px,
   keeping the opening screen visually clean. 100vh keeps the rule adaptive
   on other display heights. */
@media (min-width:1200px){
  html body .teads-side-rail--home,
  html[data-teads-debug="1"] body .teads-intake-map-rail{
    position:absolute!important;
    top:calc(100vh + 72px)!important;
    transform:none!important;
  }
}

/* Production device contract: side rails never render on phones. */
@media(max-width:720px){
  .teads-side-rail,.teads-intake-map-rail{display:none!important}
}


/* FINAL UPLOAD — selectable ad sizes in the existing placements. */
.teads-slot[data-teads-format]:not([data-teads-format="auto"]){
  width:min(100%,var(--teads-width,970px))!important;
  min-height:var(--teads-height,90px)!important;
  height:auto;
}
.teads-slot[data-teads-format]:not([data-teads-format="auto"]) .teads-direct,
.teads-slot[data-teads-format]:not([data-teads-format="auto"]) .teads-preview{
  width:min(100%,var(--teads-width,970px))!important;
  min-height:var(--teads-height,90px)!important;
}
.teads-slot[data-teads-format]:not([data-teads-format="auto"]) .teads-direct img{
  width:min(100%,var(--teads-width,970px))!important;
  height:auto!important;
  max-height:var(--teads-height,280px)!important;
  object-fit:contain!important;
}
.teads-side-rail[data-teads-format]:not([data-teads-format="auto"]){width:var(--teads-width,120px)!important;height:var(--teads-height,600px)!important}
.teads-side-rail[data-teads-format]:not([data-teads-format="auto"]) .teads-slot,
.teads-side-rail[data-teads-format]:not([data-teads-format="auto"]) .teads-preview,
.teads-side-rail[data-teads-format]:not([data-teads-format="auto"]) .teads-direct,
.teads-side-rail[data-teads-format]:not([data-teads-format="auto"]) .teads-direct img,
.teads-side-rail[data-teads-format]:not([data-teads-format="auto"]) .adsbygoogle{
  width:var(--teads-width,120px)!important;max-width:var(--teads-width,120px)!important;
  height:var(--teads-height,600px)!important;min-height:var(--teads-height,600px)!important;max-height:var(--teads-height,600px)!important
}
@media(max-width:1899px){.teads-side-rail.teads-format--300x600{display:none!important}}

/* ========================================================================== 
   ADS V3 — EL/EN stacked inventory + square/rectangle rail formats
   Up to three creatives can live inside one logical placement. Device
   visibility is resolved in JS; side inventory is converted to inline blocks
   on tablet/mobile only when the creative itself is enabled for that device.
   ========================================================================== */
.teads-slot-stack{
  width:100%;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-start;
  gap:18px;
  box-sizing:border-box;
}
.teads-slot-stack>.teads-slot{flex:0 0 auto}

/* Reader ad hooks used to assume one 600px skyscraper. V3 lets each hook hold
   square/rectangle stacks as well, so the actual creative controls the height. */
.tlv1411__ad-slot .teads-slot-stack{width:100%;gap:18px}
.tlv1411__ad-slot .teads-slot{
  min-height:0!important;
  height:auto;
  padding:0!important;
}
.tlv1411__ad-slot .teads-slot[data-teads-format="auto"]{min-height:90px!important}
.tlv1411__ad-slot .teads-preview{writing-mode:horizontal-tb!important;text-orientation:mixed!important}

/* The rail follows the widest configured creative instead of being hard-coded
   to 120/160px. 300px is the normal large-desktop TAROTEYES rail. */
.teads-side-rail{
  width:var(--teads-rail-width,160px)!important;
  height:auto!important;
  min-height:0!important;
  max-height:calc(100vh - 106px);
  overflow:auto;
  scrollbar-width:thin;
}
.teads-side-rail:not(.teads-side-rail--home){top:86px!important;transform:none!important}
.teads-side-rail .teads-slot-stack{width:100%;gap:18px}
.teads-side-rail .teads-slot,
.teads-side-rail .teads-preview,
.teads-side-rail .teads-direct{
  width:min(100%,var(--teads-width,var(--teads-rail-width,160px)))!important;
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
}
.teads-side-rail .teads-slot[data-teads-format="auto"],
.teads-side-rail .teads-slot[data-teads-format="auto"] .teads-preview,
.teads-side-rail .teads-slot[data-teads-format="auto"] .teads-direct{
  width:100%!important;
  min-height:250px!important;
}
.teads-side-rail .teads-direct img{
  width:min(100%,var(--teads-width,var(--teads-rail-width,160px)))!important;
  height:auto!important;
  max-width:100%!important;
  max-height:var(--teads-height,600px)!important;
  object-fit:contain!important;
}
.teads-side-rail .adsbygoogle{max-width:100%!important}

/* At wide desktop widths the Reader itself reserves a true 300px ad rail on
   both sides. This still leaves the reading as the visual priority. */
@media(min-width:1720px){
  .tlv1411__wide-frame{
    width:min(1768px,calc(100vw - 24px))!important;
    grid-template-columns:300px minmax(0,1fr) 300px!important;
    gap:16px!important;
  }
  .tlv1411__ad-slot{width:300px!important;min-height:0!important}
}

/* 336px creatives need a little more room than the normal 300px rail. */
@media(max-width:1819px){
  .teads-side-rail .teads-slot[data-teads-format="336x280"]{display:none!important}
}
/* 250/300px rectangles and half-page units are held back on narrower desktop
   layouts where they could crowd the reading. 120/160px and AUTO still work. */
@media(min-width:1200px) and (max-width:1719px){
  .teads-side-rail .teads-slot[data-teads-format="250x250"],
  .teads-side-rail .teads-slot[data-teads-format="300x250"],
  .teads-side-rail .teads-slot[data-teads-format="336x280"],
  .teads-side-rail .teads-slot[data-teads-format="300x600"]{display:none!important}
}

/* Tablet/mobile rendering for creatives explicitly enabled on those devices.
   Side rails never float over content on small screens; eligible side creatives
   are injected as ordinary inline inventory instead. */
.teads-mobile-side-inventory{display:none}
@media(max-width:1199px){
  .teads-mobile-side-inventory{
    display:grid;
    width:min(100%,720px);
    margin:22px auto;
    padding:0 12px;
    box-sizing:border-box;
    gap:18px;
    justify-items:center;
    clear:both;
  }
  .teads-mobile-side-inventory .teads-slot-stack{gap:16px}
  .teads-mobile-side-inventory .teads-slot{
    width:min(100%,var(--teads-width,336px))!important;
    min-height:0!important;
    height:auto!important;
  }
  .teads-mobile-side-inventory .teads-direct img{
    width:auto!important;
    max-width:100%!important;
    height:auto!important;
    max-height:var(--teads-height,280px)!important;
  }
}
@media(max-width:720px){
  .teads-mobile-side-inventory{margin:16px auto;padding:0 10px;gap:14px}
  .teads-mobile-side-inventory .teads-slot-stack{gap:14px}
  .teads-mobile-side-inventory .teads-slot[data-teads-format="336x280"]{
    width:min(100%,336px)!important;
  }
}