@media(max-width:600px){.history-card{grid-template-columns:72px 1fr}.history-card img{width:72px;height:96px}}
@media(max-width:760px){.catalog-toolbar{justify-content:stretch}.catalog-sort{width:100%;min-width:0}}
@media(max-width:760px){#winnerToastStack{right:8px;bottom:8px;width:calc(100vw - 16px)}}
@media(max-width:1100px){.workspace{grid-template-columns:260px 1fr}.right-dock{grid-column:1/-1}.scene{min-height:580px}.scene-inner{min-height:580px}}
@media(max-width:760px){.app{padding:8px}.topbar{grid-template-columns:1fr auto}.live-head{grid-column:1/-1;grid-row:2}.workspace{grid-template-columns:1fr}.left-dock{order:2}.center{order:1}.right-dock{order:3}.scene{min-height:auto}.scene-inner{min-height:560px;padding-inline:10px}.card-image{width:min(310px,94%)}.controls-bar{grid-template-columns:1fr 1fr}.top-actions .viewer-strip{display:none}.card-name{font-size:23px}.price{font-size:32px}}
@media(max-width:760px){
  .live-media{gap:6px}.card-image-secondary{width:46%}.card-image{width:52%}
  .brand-logo{height:38px;max-width:210px}.card-upload-two{grid-template-columns:1fr}
}
/* ===========================
   V5 - CATÁLOGO MÓVIL
=========================== */

@media(max-width:760px){

    /* Dos cartas por fila */
    body.user-only-layout .available-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:8px;
    }

    /* Tarjeta más compacta para que ambas columnas quepan */
    body.user-only-layout .mini-card{
        min-width:0;
        padding:7px;
    }

    /* Espacio vertical con proporción de una carta */
    body.user-only-layout .mini-image-wrap{
        width:100%;
        height:auto;
        aspect-ratio:2.5 / 3.5;
    }

    /* Mostrar siempre la fotografía completa */
    body.user-only-layout .mini-card .mini-image-wrap img{
        width:100%;
        height:100%;
        object-fit:contain;
        object-position:center;
    }
}

/* ==========================================================
   CLAIMS MÓVIL 63/37
   Reconstruido sobre el respaldo estable.
   SOLO PRESENTACIÓN: no modifica temporizadores, cola ni RPC.
   ========================================================== */

.mobile-live-split{display:none}
.chat-title-mobile{display:none!important}

@media(max-width:700px){
  body.mobile-claims-layout{
    --claims-mobile-header:58px;
  }

  body.mobile-claims-layout,
  body.mobile-claims-layout #appView{
    overflow-x:hidden;
  }

  body.mobile-claims-layout .app{
    padding:6px!important;
  }

  /* Encabezado compacto: logo | Claims | historial + inicio */
  body.mobile-claims-layout .topbar{
    position:relative!important;
    z-index:50!important;
    display:grid!important;
    grid-template-columns:92px minmax(74px,1fr) auto!important;
    grid-template-areas:"brand live actions"!important;
    align-items:center!important;
    gap:6px!important;
    min-height:var(--claims-mobile-header)!important;
    margin-bottom:6px!important;
    padding:5px 7px!important;
    border-radius:12px!important;
  }

  body.mobile-claims-layout .brand{
    grid-area:brand!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    min-width:0!important;
  }

  body.mobile-claims-layout .brand-logo{
    display:block!important;
    width:88px!important;
    max-width:100%!important;
    height:auto!important;
    margin:auto!important;
  }

  body.mobile-claims-layout .live-head{
    grid-area:live!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    min-width:0!important;
    text-align:center!important;
  }

  body.mobile-claims-layout .live-head h1{
    width:100%!important;
    margin:0!important;
    overflow:hidden!important;
    font-size:13px!important;
    line-height:1!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
  }

  body.mobile-claims-layout .status-pill{
    min-height:16px!important;
    margin:3px auto 0!important;
    padding:2px 7px!important;
    font-size:7px!important;
    line-height:1!important;
  }

  body.mobile-claims-layout .top-actions{
    grid-area:actions!important;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-end!important;
    gap:5px!important;
  }

  body.mobile-claims-layout .top-actions .viewer-strip{
    display:none!important;
  }

  body.mobile-claims-layout .top-actions .btn{
    min-width:58px!important;
    min-height:34px!important;
    padding:7px 8px!important;
    border-radius:9px!important;
    font-size:8px!important;
    line-height:1!important;
    white-space:nowrap!important;
  }

  body.mobile-claims-layout .workspace{
    display:block!important;
    width:100%!important;
    padding:0!important;
  }

  body.mobile-claims-layout .center{
    display:block!important;
    width:100%!important;
    min-width:0!important;
  }

  /* Dos columnas: Claim 63%, Chat 37%. */
  body.mobile-claims-layout .mobile-live-split{
    display:grid!important;
    grid-template-columns:minmax(0,63fr) minmax(0,37fr)!important;
    align-items:stretch!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    overflow:hidden!important;
    background:#050912!important;
    border:1px solid rgba(148,163,184,.12)!important;
  }

  body.mobile-claims-layout .mobile-claim-mount,
  body.mobile-claims-layout .mobile-chat-mount{
    min-width:0!important;
    min-height:0!important;
  }

  body.mobile-claims-layout .mobile-claim-mount{
    border-right:1px solid rgba(148,163,184,.18)!important;
  }

  body.mobile-claims-layout .mobile-chat-mount{
    display:flex!important;
    align-self:stretch!important;
  }

  /* El bloque de Claim ya no se estira a 650px. */
  body.mobile-claims-layout .mobile-claim-mount>.scene{
    width:100%!important;
    min-height:0!important;
    margin:0!important;
    padding:0!important;
    overflow:hidden!important;
    border:0!important;
    border-radius:0!important;
    background:#05070b!important;
    box-shadow:none!important;
  }

  /* Ocultar PREVIEW DE TRANSMISIÓN sin tocar su lógica/HTML. */
  body.mobile-claims-layout .mobile-claim-mount>.scene::before{
    display:none!important;
    content:none!important;
  }

  body.mobile-claims-layout .scene-inner{
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:flex-start!important;
    width:100%!important;
    min-height:0!important;
    height:auto!important;
    padding:5px!important;
    gap:4px!important;
  }

  /* Sin marco oscuro alrededor de la carta. */
  body.mobile-claims-layout .scene-card{
    display:block!important;
    width:100%!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    border-radius:0!important;
    background:transparent!important;
    box-shadow:none!important;
  }

  body.mobile-claims-layout .live-media{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:100%!important;
    margin:0!important;
    padding:0!important;
    gap:3px!important;
  }

  body.mobile-claims-layout .card-image{
    position:relative!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    margin:0!important;
    padding:0!important;
    aspect-ratio:2.5/3.5!important;
    overflow:hidden!important;
    border:0!important;
    border-radius:0!important;
    background:#080d16!important;
    box-shadow:none!important;
  }

  body.mobile-claims-layout .card-image img:not(.placeholder-logo){
    display:block;
    width:100%!important;
    height:100%!important;
    object-fit:contain!important;
    object-position:center!important;
    background:transparent!important;
  }

  /* Respeta hidden: evita imagen rota / "Carta actual". */
  body.mobile-claims-layout #liveImage.hidden,
  body.mobile-claims-layout #liveImageSecondaryWrap.hidden,
  body.mobile-claims-layout #imagePlaceholder.hidden{
    display:none!important;
  }

  /* Logo de espera realmente centrado dentro del 63%. */
  body.mobile-claims-layout #imagePlaceholder{
    position:absolute!important;
    inset:0!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:100%!important;
    height:100%!important;
    margin:0!important;
  }

  body.mobile-claims-layout #imagePlaceholder .placeholder-logo{
    position:static!important;
    display:block!important;
    width:34%!important;
    max-width:92px!important;
    height:auto!important;
    max-height:42%!important;
    margin:auto!important;
    object-fit:contain!important;
    transform:none!important;
  }

  body.mobile-claims-layout .card-name{
    display:-webkit-box!important;
    width:100%!important;
    margin:5px 2px 0!important;
    overflow:hidden!important;
    font-size:clamp(11px,3.3vw,16px)!important;
    line-height:1.08!important;
    overflow-wrap:anywhere!important;
    -webkit-box-orient:vertical!important;
    -webkit-line-clamp:2!important;
  }

  body.mobile-claims-layout .price{
    margin:3px 0!important;
    font-size:clamp(19px,6vw,30px)!important;
    line-height:1!important;
  }

  body.mobile-claims-layout .points,
  body.mobile-claims-layout .card-note,
  body.mobile-claims-layout .speed-copy,
  body.mobile-claims-layout .speed-score{
    font-size:8px!important;
    line-height:1.15!important;
  }

  body.mobile-claims-layout .timer-wrap{
    width:100%!important;
    margin:4px 0 0!important;
    padding:0 2px!important;
  }

  body.mobile-claims-layout .timer-line{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    width:100%!important;
    gap:4px!important;
    margin-bottom:3px!important;
    font-size:6.5px!important;
    line-height:1.1!important;
    white-space:nowrap!important;
  }

  body.mobile-claims-layout .timer-track{
    width:100%!important;
    height:6px!important;
    margin:0!important;
  }

  body.mobile-claims-layout .phase-badge{
    width:min(78%,190px)!important;
    min-height:20px!important;
    margin:5px auto 2px!important;
    padding:4px 7px!important;
    font-size:7px!important;
  }

  body.mobile-claims-layout .timer-number{
    margin:1px 0 2px!important;
    font-size:clamp(20px,6.5vw,31px)!important;
    line-height:1!important;
  }

  body.mobile-claims-layout .claim-btn{
    width:100%!important;
    min-height:44px!important;
    margin:3px 0 0!important;
    padding:8px 5px!important;
    border-radius:10px!important;
    font-size:clamp(14px,4.7vw,21px)!important;
    line-height:1!important;
  }

  body.mobile-claims-layout .winner{
    min-height:0!important;
    margin:0!important;
    padding:0!important;
    font-size:8px!important;
  }

  /* Catálogo y controles siguen debajo, en su flujo original. */
  body.mobile-claims-layout .controls-bar,
  body.mobile-claims-layout .center>.section{
    width:100%!important;
  }

  body.mobile-claims-layout .center>.section{
    margin-top:0!important;
  }

  body.mobile-claims-layout .left-dock,
  body.mobile-claims-layout .right-dock{
    display:none!important;
  }

  /* Ganador siempre por delante del encabezado. */
  body.mobile-claims-layout #winnerToastStack{
    position:fixed!important;
    top:64px!important;
    right:7px!important;
    z-index:2147483647!important;
  }
}

@media(max-width:380px){
  body.mobile-claims-layout{
    --claims-mobile-header:54px;
  }

  body.mobile-claims-layout .topbar{
    grid-template-columns:78px minmax(64px,1fr) auto!important;
    min-height:54px!important;
    padding:4px 5px!important;
  }

  body.mobile-claims-layout .brand-logo{
    width:75px!important;
  }

  body.mobile-claims-layout .live-head h1{
    font-size:11px!important;
  }

  body.mobile-claims-layout .top-actions .btn{
    min-width:52px!important;
    min-height:31px!important;
    padding:6px!important;
    font-size:7px!important;
  }

  body.mobile-claims-layout #winnerToastStack{
    top:59px!important;
  }
}


/* AJUSTES MÓVILES · CONTEO ÚNICO */
@media(max-width:700px){
  body.mobile-claims-layout #timerLabel{
    display:none!important;
  }

  body.mobile-claims-layout .timer-line{
    justify-content:flex-start!important;
  }
}


/* CHAT MÓVIL · EL CONTENIDO NO PUEDE ESTIRAR EL LAYOUT */
@media(max-width:700px){
  body.mobile-claims-layout .mobile-live-split{
    min-height:0!important;
  }

  body.mobile-claims-layout .mobile-chat-mount{
    min-height:0!important;
    overflow:hidden!important;
  }
}