/* Brintage Web R92 — Create Post mobile design sheets.
   Bottom sheet inmediato: primero pinta fantasmas, luego monta el contenido real. */
@media (max-width:768px){
  #createpost.mobile-createpost.cp-editor-step{--cp-sheet-gap:15px;}

  #createpost.mobile-createpost.cp-editor-step > .cp-free-entry,
  #createpost.mobile-createpost.cp-editor-step > .cp-designs-nav,
  #createpost.mobile-createpost.cp-editor-step > .cp-emotive-categories{display:none!important;}

  #createpost.mobile-createpost.cp-editor-step > .cp-collage-tabs{
    width:calc(100% - 24px)!important;margin:0 12px!important;flex:0 0 44px!important;min-height:44px!important;
  }
  #createpost.mobile-createpost.cp-editor-step > .cp-collage-tabs .cp-collage-bank-switch{display:none!important;}
  #createpost.mobile-createpost.cp-editor-step > .cp-collage-tabs .cp-collage-tools{flex:1 1 auto!important;width:100%!important;height:44px!important;}
  #createpost.mobile-createpost.cp-editor-step.cp-free-mode > .cp-free-controls{display:none!important;}

  #createpost .cp-mobile-design-launcher{
    position:relative;z-index:22;width:calc(100% - 24px);min-height:48px;flex:0 0 48px;margin:0 12px;
    display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;box-sizing:border-box;
  }
  #createpost .cp-mobile-design-launcher button{
    min-width:0;height:48px;padding:0 8px;border:1px solid #d8e3f0;border-radius:12px;background:rgba(255,255,255,.96);
    color:#41536a;box-shadow:0 3px 11px rgba(31,72,116,.055);font:700 10.5px/1.15 Arial,sans-serif;
    white-space:normal;text-align:center;cursor:pointer;-webkit-tap-highlight-color:transparent;
  }
  #createpost .cp-mobile-design-launcher button.is-active{
    border-color:#80b6fb;background:#f2f7ff;color:#247df0;box-shadow:inset 0 -3px 0 #2f84f6,0 3px 11px rgba(31,72,116,.05);
  }
  #createpost .cp-mobile-design-launcher button:focus-visible{outline:2px solid rgba(47,132,246,.38);outline-offset:2px;}

  #createpost .cp-mobile-design-sheet{
    position:fixed;left:0;right:0;bottom:0;z-index:2147481500;display:flex;justify-content:flex-end;flex-direction:column;
    width:100%;max-height:var(--cp-mobile-sheet-max-height,55dvh);padding:0;box-sizing:border-box;background:transparent;
    pointer-events:none;visibility:hidden;transform:translate3d(0,110%,0);
    transition:transform 180ms cubic-bezier(.22,.82,.25,1),visibility 0s linear 180ms;will-change:transform;
  }
  #createpost .cp-mobile-design-sheet.is-open{
    visibility:visible;transform:translate3d(0,0,0);transition:transform 180ms cubic-bezier(.22,.82,.25,1),visibility 0s linear 0s;pointer-events:auto;
  }
  #createpost .cp-mobile-design-sheet.is-dragging{transition:none!important;}
  #createpost .cp-mobile-design-sheet[data-mode="free"]{height:var(--cp-mobile-sheet-max-height,55dvh);}

  #createpost .cp-mobile-design-sheet-shell{
    min-height:0;max-height:100%;width:100%;display:flex;flex-direction:column;background:#fff;border:1px solid #dbe6f2;border-bottom:0;
    border-radius:22px 22px 0 0;box-shadow:0 -12px 34px rgba(15,31,52,.16);overflow:hidden;box-sizing:border-box;
  }
  #createpost .cp-mobile-design-sheet[data-mode="free"] .cp-mobile-design-sheet-shell{height:100%;}
  #createpost .cp-mobile-design-sheet-head{
    position:relative;flex:0 0 58px;min-height:58px;display:flex;align-items:flex-end;justify-content:center;margin:0;padding:22px 50px 13px;
    box-sizing:border-box;border:0;border-bottom:1px solid #e8eef6;border-radius:0;background:#fff;box-shadow:none;touch-action:none;
  }
  #createpost .cp-mobile-design-sheet-handle{position:absolute;left:50%;top:9px;width:42px;height:4px;margin-left:-21px;border-radius:9px;background:#cbd5e1;}
  #createpost .cp-mobile-design-sheet-title{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#1f2b3d;font:700 16px/1 Arial,sans-serif;}
  #createpost .cp-mobile-design-sheet-close{
    position:absolute;right:15px;bottom:9px;width:34px;height:34px;padding:0;border:0;border-radius:50%;background:#f1f5fa;color:#718095;
    font:400 24px/32px Arial,sans-serif;cursor:pointer;
  }
  #createpost .cp-mobile-design-sheet-body{
    min-height:0;max-height:100%;overflow:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;background:#fff;
    padding-bottom:max(0px,env(safe-area-inset-bottom));box-sizing:border-box;scrollbar-width:none;
  }
  #createpost .cp-mobile-design-sheet-body::-webkit-scrollbar{display:none;}
  #createpost .cp-mobile-design-sheet[data-mode="free"] .cp-mobile-design-sheet-body{flex:1 1 auto;}


  /* R86 — contenido fantasma visible en el MISMO frame del tap. */
  #createpost .cp-mobile-preflight{width:100%;box-sizing:border-box;background:#fff;}
  #createpost .cp-mobile-preflight-free{padding:12px;display:grid;grid-template-columns:1fr 1fr;gap:9px;}
  #createpost .cp-mobile-preflight-free span,
  #createpost .cp-mobile-preflight-categories span,
  #createpost .br-mobile-rail-ghost{
    display:block;border-radius:10px;background:linear-gradient(100deg,#edf2f7 30%,#f8fafc 50%,#edf2f7 70%);
    background-size:220% 100%;animation:brCpSheetSkeleton 1.05s linear infinite;
  }
  #createpost .cp-mobile-preflight-free span{height:38px;}
  #createpost .cp-mobile-preflight-free span.wide{grid-column:1/-1;}
  #createpost .cp-mobile-preflight-categories{margin:8px 10px 2px;padding:6px;display:grid;grid-template-columns:1fr 1fr;gap:7px;border:1px solid #d8e3f0;border-radius:14px;background:#f8fbff;}
  #createpost .cp-mobile-preflight-categories span{height:36px;}
  #createpost .cp-mobile-preflight-rail{margin:0!important;}
  #createpost .cp-mobile-design-sheet .cp-desings > .br-mobile-rail-ghost{
    position:relative;flex:0 0 calc((100% - (3 * var(--cp-gap))) / 4)!important;width:calc((100% - (3 * var(--cp-gap))) / 4)!important;
    aspect-ratio:1/1;scroll-snap-align:start;scroll-snap-stop:always;box-sizing:border-box;
  }

  /* R84 error 1: Diseño libre uses the sheet itself as its only card. */
  #createpost .cp-mobile-design-sheet[data-mode="free"] .cp-free-controls{
    display:block!important;width:100%!important;max-width:none!important;margin:0!important;padding:10px 12px 12px!important;
    box-sizing:border-box!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;
  }
  #createpost .cp-mobile-design-sheet[data-mode="free"] .cp-free-head{justify-content:flex-end!important;margin:0 0 6px!important;}
  #createpost .cp-mobile-design-sheet[data-mode="free"] .cp-free-head > strong{display:none!important;}

  /* R84 errors 2/4: only the requested bank can be visible inside the sheet. */
  #createpost .cp-mobile-design-sheet .cp-designs-nav{
    position:relative!important;display:flex!important;align-items:center!important;justify-content:center!important;width:100%!important;
    height:auto!important;min-height:0!important;max-height:none!important;margin:0!important;padding:7px 0 11px!important;
    box-sizing:border-box!important;overflow:hidden!important;background:#fff!important;border-radius:0!important;
  }
  #createpost .cp-mobile-design-sheet .cp-designs-nav > .cp-desings{display:none!important;}
  #createpost .cp-mobile-design-sheet[data-mode="classic"] .cp-designs-nav > .cp-design-bank.br-mobile-sheet-active,
  #createpost .cp-mobile-design-sheet[data-mode="thematic"] .cp-designs-nav > .cp-emotive-section.br-mobile-sheet-active{
    --cp-gap:8px;width:100%!important;height:auto!important;min-height:0!important;max-height:none!important;margin:0!important;
    padding:6px 10px!important;display:flex!important;align-items:center!important;gap:var(--cp-gap)!important;overflow-x:auto!important;
    overflow-y:hidden!important;scroll-snap-type:x mandatory;scroll-padding-inline:10px;overscroll-behavior-x:contain;
    -webkit-overflow-scrolling:touch;touch-action:pan-x;box-sizing:border-box!important;transform:none!important;scrollbar-width:none;
  }
  #createpost .cp-mobile-design-sheet .cp-designs-nav > .cp-desings::-webkit-scrollbar{display:none;}
  #createpost .cp-mobile-design-sheet .cp-designs-nav > .cp-desings .sC{
    flex:0 0 calc((100% - (3 * var(--cp-gap))) / 4)!important;width:calc((100% - (3 * var(--cp-gap))) / 4)!important;
    height:auto!important;aspect-ratio:1/1!important;margin:0!important;scroll-snap-align:start;scroll-snap-stop:always;box-sizing:border-box!important;
  }
  #createpost .cp-mobile-design-sheet .cp-designs-nav .cp-arrow{display:none!important;}

  /* Progressive independent tile reveal: first tile is ready immediately; the
     rest appear in small batches without blocking the sheet animation. */
  #createpost .cp-mobile-design-sheet .cp-desings .sC{transition:opacity 150ms ease,transform 150ms ease;}
  #createpost .cp-mobile-design-sheet .cp-desings .sC.br-mobile-tile-pending{opacity:.18;transform:scale(.965);pointer-events:none;}
  #createpost .cp-mobile-design-sheet .cp-desings .sC.br-mobile-tile-pending > *{visibility:hidden!important;}
  #createpost .cp-mobile-design-sheet .cp-desings .sC.br-mobile-tile-pending::before{
    content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(100deg,#edf2f7 30%,#f8fafc 50%,#edf2f7 70%);
    background-size:220% 100%;animation:brCpSheetSkeleton 1.05s linear infinite;
  }
  #createpost .cp-mobile-bank-placeholder{
    width:100%;padding:6px 10px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;box-sizing:border-box;
  }
  #createpost .cp-mobile-bank-placeholder span{
    display:block;aspect-ratio:1/1;border-radius:10px;background:linear-gradient(100deg,#edf2f7 30%,#f8fafc 50%,#edf2f7 70%);
    background-size:220% 100%;animation:brCpSheetSkeleton 1.05s linear infinite;
  }
  @keyframes brCpSheetSkeleton{0%{background-position:100% 0}100%{background-position:-120% 0}}

  /* R84 error 4: thematic categories are one independent horizontal rail above
     the design rail. Two readable category pills are visible at a time. */
  #createpost .cp-mobile-design-sheet[data-mode="thematic"] .cp-emotive-categories{
    position:relative!important;left:auto!important;right:auto!important;top:auto!important;bottom:auto!important;
    width:calc(100% - 20px)!important;height:auto!important;min-height:48px!important;max-height:none!important;margin:8px 10px 2px!important;
    padding:6px!important;display:flex!important;flex-wrap:nowrap!important;align-items:center!important;gap:7px!important;box-sizing:border-box!important;
    border:1px solid #d8e3f0!important;border-radius:14px!important;background:#f8fbff!important;box-shadow:0 4px 13px rgba(27,65,105,.055)!important;
    visibility:visible!important;transform:none!important;overflow-x:auto!important;overflow-y:hidden!important;scroll-snap-type:x mandatory;
    overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;touch-action:pan-x;scrollbar-width:none;
  }
  #createpost .cp-mobile-design-sheet[data-mode="thematic"] .cp-emotive-categories::-webkit-scrollbar{display:none;}
  #createpost .cp-mobile-design-sheet[data-mode="thematic"] .cp-emotive-category{
    flex:0 0 calc((100% - 7px)/2)!important;width:calc((100% - 7px)/2)!important;min-width:0!important;min-height:36px!important;
    padding:0 8px!important;scroll-snap-align:start;scroll-snap-stop:always;white-space:nowrap!important;box-sizing:border-box!important;
  }

  #createpost.mobile-createpost.cp-editor-step > .mobile-cpnav.cp-designs-nav{
    flex:0 0 0!important;width:0!important;height:0!important;min-height:0!important;margin:0!important;padding:0!important;overflow:hidden!important;
  }
}

@media (max-width:380px){
  #createpost .cp-mobile-design-launcher button{font-size:9.7px;padding:0 5px;}
  #createpost .cp-mobile-design-sheet[data-mode="thematic"] .cp-emotive-category{font-size:9px!important;padding:0 5px!important;}
}
