/* PerriWeb 2.0 · Corrección 04: solo Usuarios / Inventario / Tienda.
   No modifica portada, Mi Perfil, Historial, Perrilogos ni minijuegos. */
.pw04-panel{min-width:0;color:#54331e;font-family:Georgia,'Times New Roman',serif}
.pw04-inventory-slot>span:not(.pw04-quantity){font:11px/1.2 system-ui,sans-serif;overflow-wrap:anywhere;max-width:100%;padding:4px}
.pw04-shop-section code{overflow-wrap:anywhere}
.content-board:has(.pw04-panel) .content-scroll{padding:16px}
.pw04-panel h2{margin:2px 0 3px!important;color:#59321b;font-size:clamp(22px,2.3vw,29px)!important}
.pw04-panel h3{font-size:clamp(17px,2vw,23px);margin:0 0 6px;color:#55301b}
.pw04-panel p{font-size:13px!important;line-height:1.4!important;margin:6px 0 10px!important}
.pw04-kicker{font:800 9px/1.3 system-ui,sans-serif;letter-spacing:.12em;color:#945c2f}
.pw04-intro,.pw04-inventory-top{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.pw04-explainer{color:#76533b;max-width:100%!important}
/* Usuarios: tabla compacta con paginación del backend y desplazamiento interior. */
.pw04-user-table{margin-top:10px;min-width:0;border:2px solid #ab814f;border-radius:9px;background:#fff4df50;overflow:hidden}
.pw04-user-head,.pw04-user-row{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(75px,.62fr) minmax(0,1.7fr);gap:12px;align-items:center;padding:8px 12px}
.pw04-user-head{background:linear-gradient(180deg,#a87845,#86542f);color:#ffedc9;font:800 10px/1.3 system-ui,sans-serif;letter-spacing:.06em;text-transform:uppercase}
.pw04-user-rows{max-height:clamp(185px,42dvh,400px);overflow:auto;overscroll-behavior:contain;scrollbar-color:#9e6430 #efcb92}
.pw04-user-row{border-bottom:1px solid #b98f653b;min-height:48px;font-size:12px;background:#fff4e52b}
.pw04-user-row:nth-child(even){background:#b3793e16}
.pw04-user-row:last-child{border-bottom:0}
.pw04-user-name{display:flex;align-items:center;gap:8px;min-width:0}
.pw04-user-name img{width:35px;height:35px;object-fit:contain;border-radius:50%;flex:none;filter:drop-shadow(0 1px 2px #0004)}
.pw04-user-name strong{overflow-wrap:anywhere;line-height:1.3}
.pw04-user-points{white-space:nowrap;font-weight:700;font-variant-numeric:tabular-nums}
.pw04-user-points small{font-size:10px}
.pw04-user-achievements{font-size:11px;line-height:1.35;color:#72563e;overflow-wrap:anywhere}
/* Inventario: información al mínimo, cuadrícula protagonista */
.pw04-inventory-balances{display:flex;gap:9px;margin:10px 0 13px;flex-wrap:wrap}
.pw04-inventory-balances>div{display:flex;align-items:center;gap:6px;min-width:130px;padding:5px 11px;background:#e7b77c6e;border:1px solid #a97942;border-radius:8px;color:#58371d;font:700 12px system-ui,sans-serif}
.pw04-inventory-balances img{width:25px;height:25px;object-fit:contain}
.pw04-inventory-balances strong{margin-left:auto;font-size:15px}
.pw04-inventory-main{min-width:0}
.pw04-inventory-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px;min-width:0;padding:12px;border:5px ridge #80532f;border-radius:12px;background:linear-gradient(#64402b,#382217);box-shadow:inset 0 0 15px #130804a8;max-height:min(52dvh,350px);overflow-y:auto;overscroll-behavior:contain;scrollbar-color:#bb8347 #543322}
.pw04-inventory-slot{position:relative;display:grid;place-items:center;aspect-ratio:1/1;border:2px inset #996d48;border-radius:7px;background:radial-gradient(ellipse at center,#563a29,#241611);min-width:0;min-height:0;box-shadow:inset 0 2px 6px #0008}
button.pw04-inventory-slot{cursor:pointer;padding:8%;color:#ffe4a9}
button.pw04-inventory-slot:hover{filter:brightness(1.25)}
.pw04-inventory-slot img{width:90%;height:90%;object-fit:contain}
.pw04-quantity{position:absolute;bottom:2px;right:3px;font:800 11px/1 system-ui,sans-serif;text-shadow:1px 1px 2px #000,0 0 5px #000;color:#fff0c5}
.pw04-grid-note{color:#f3d3a8!important;font:600 11px/1.4 system-ui,sans-serif!important;padding:8px 12px 0;margin:0!important;background:linear-gradient(#55331e,#55331e);border-radius:0 0 6px 6px;text-align:center}
/* Tienda: solo Random Key y Sorteos, operaciones bloqueadas */
.pw04-shop-tabs{margin-top:0;display:flex;gap:8px;border-bottom:2px solid #aa7849;padding-bottom:9px}
.pw04-shop-tabs button{padding:11px 17px;border:2px solid #926238;background:linear-gradient(#d5ac77,#a87649);border-radius:9px;color:#4c2b1d;font:700 15px Georgia,serif;flex:1;min-height:44px;box-shadow:0 2px 3px #673d1a4a}
.pw04-shop-tabs button[aria-selected=true]{background:linear-gradient(#805031,#4a2919);color:#ffe7b8;border-color:#d0a160}
.pw04-shop-section{padding:12px 0 5px}
.pw04-shop-feature{display:flex;align-items:center;gap:16px}
.pw04-shop-feature>img{width:65px;height:65px;object-fit:contain;flex:none;filter:drop-shadow(0 2px 4px #0005)}
.pw04-shop-feature p{margin-bottom:0!important}
.pw04-shop-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin-top:13px}
.pw04-shop-stats>div{padding:11px;border:1px solid #af804e;border-radius:9px;background:#fff1cf7e;display:grid;gap:7px}
.pw04-shop-stats small{font:700 11px system-ui,sans-serif;color:#845737}
.pw04-shop-stats strong{font-size:22px}
.pw04-shop-cta{margin-top:14px;padding:11px 15px;max-width:100%;font-size:14px}
.pw04-shop-disclaimer{color:#84634a!important;font-size:11px!important}
/* El CSS para móvil de esta corrección afecta SOLO estas tres pantallas */
@media(max-width:700px){
  .pw04-user-head,.pw04-user-row{grid-template-columns:minmax(0,1fr) 80px;gap:6px 10px;padding:8px}
  .pw04-user-head>span:last-child{display:none}
  .pw04-user-achievements{grid-column:1/-1;padding-left:44px}
  .pw04-user-rows{max-height:min(60dvh,440px)}
  .pw04-inventory-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;padding:8px;max-height:430px}
  .pw04-inventory-slot{min-width:0}
  .pw04-shop-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pw04-shop-feature>img{width:50px;height:50px}
  .pw04-shop-tabs button{font-size:13px;padding:10px}
}
@media(max-width:380px){
  .pw04-inventory-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .pw04-user-name img{width:30px;height:30px}
  .pw04-user-achievements{padding-left:39px}
}
.pw04-inventory-slot.pw04-filled img { max-width: 100%; max-height: 70%; width: auto; height: auto; object-fit: contain; }
.pw04-inventory-slot.pw04-filled:has(img) > span:not(.pw04-quantity) { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }

/* Inventario: un único scroll y una altura útil definida en todos los tamaños. */
html:has(.pw04-inventory),body:has(.pw04-inventory) {height:100%;min-height:0;overflow:hidden}
.app-frame:has(.pw04-inventory) {height:100dvh;min-height:0;overflow:hidden}
.content-board:has(.pw04-inventory) {--inventory-panel-max:900px;height:auto;min-height:0;max-height:100%;max-width:100%;align-self:start}
.content-board:has(.pw04-inventory) .content-scroll {display:flex;flex:0 1 auto;flex-direction:column;min-height:0;overflow:clip}
.pw04-inventory {display:flex;flex-direction:column;flex:0 1 auto;min-height:0;min-width:0}
.pw04-inventory-balances {flex:none;margin-top:0}
.pw04-inventory-main {display:flex;flex:0 1 auto;min-height:0;min-width:0;overflow:clip;container:inventory-space / inline-size;justify-content:center}
.pw04-inventory-grid {
 --inventory-columns:6;--inventory-gap:8px;--inventory-pad:12px;
 flex:none;min-height:0;height:auto;max-height:none;max-width:100%;
 width:100%;
 grid-template-columns:repeat(var(--inventory-columns),minmax(0,1fr));gap:var(--inventory-gap);padding:var(--inventory-pad);
 overflow-y:auto;overflow-x:hidden;scrollbar-gutter:stable;align-content:start;grid-auto-rows:max-content;overscroll-behavior:contain;
}
@container inventory-space (max-width:399px){.pw04-inventory-grid {--inventory-columns:4;--inventory-gap:6px;--inventory-pad:8px}}
@container inventory-space (max-width:299px){.pw04-inventory-grid {--inventory-columns:3}}
@media(min-width:701px) and (min-height:501px){
 .stage-content:has(.pw04-inventory) {position:absolute;inset:max(136px,14%) 4% max(160px,16%);height:auto;min-height:0;padding:0;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr);place-items:center}
 .content-board:has(.pw04-inventory) {width:min(100%,900px)}
}
@media(min-width:701px) and (max-height:620px){
 .scene:has(.pw04-inventory) {min-height:0;overflow:hidden}
 .stage-content:has(.pw04-inventory) {position:absolute;inset:88px 3% 20px;height:auto;min-height:0;padding:0;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr);place-items:center}
 .scene:has(.pw04-inventory) .profile-badge {width:64px;height:64px}
 .scene:has(.pw04-inventory) .scene-footer {display:none}
 .content-board:has(.pw04-inventory) {width:min(100%,900px)}
 .content-board:has(.pw04-inventory) .content-header {min-height:56px;padding:6px 12px}
 .content-board:has(.pw04-inventory) .back-button {width:44px;height:44px}
 .content-board:has(.pw04-inventory) .content-scroll {padding:12px}
}
@media(min-width:701px) and (max-height:500px){
 .scene:has(.pw04-inventory) {height:100dvh;min-height:0}
 .stage-content:has(.pw04-inventory) {top:calc(58px + env(safe-area-inset-top));bottom:calc(20px + env(safe-area-inset-bottom))}
 .scene:has(.pw04-inventory) .profile-badge {width:44px;height:44px}
}

/* Fichas de objetos y recompensas confirmadas por el servidor. */
.container-detail>img {width:156px;height:156px;margin:18px auto;object-fit:contain;filter:drop-shadow(0 5px 5px #56341444)}
.item-quantity {font-size:16px}
.container-consumption {font-size:13px!important;color:#704c30}
.container-open {min-width:180px;max-width:100%;min-height:44px}
.container-status:empty {display:none}
.container-status {font-size:14px!important;margin-bottom:0!important}
.reward-confirmation {font-weight:700;color:#5c371b}
.container-rewards {list-style:none;display:grid;gap:10px;margin:16px 0 0;padding:0;text-align:left}
.container-rewards li {display:flex;align-items:center;gap:14px;padding:12px;border:1px solid #ad7a3e;border-radius:9px;background:#ffe7b65c;box-shadow:inset 0 1px #fff0cb80;min-width:0}
.container-rewards li img {flex:none;width:52px;height:52px;margin:0;object-fit:contain}
.container-rewards strong {display:block;font-size:16px;line-height:1.4;overflow-wrap:anywhere}
.container-rewards small {display:block;margin-top:4px;color:#704c30;line-height:1.4}
.inventory-recovery {flex:none;display:grid;gap:8px;margin-bottom:12px}
.inventory-recovery button {font-size:13px;overflow-wrap:anywhere}
@media(max-width:700px), (pointer:coarse) and (max-height:500px) {
 .container-detail>img {width:112px;height:112px;margin:12px auto}
 .container-rewards li {padding:10px;gap:10px}
 .container-rewards li img {width:44px;height:44px}
 .info-card .modal-head h2 {font-size:23px;line-height:1.15}
}

@media(max-width:700px) and (orientation:landscape) and (max-height:500px), (pointer:coarse) and (orientation:landscape) and (max-height:500px) {
 .container-detail:has(.container-rewards) {display:grid;grid-template-columns:96px minmax(0,1fr);column-gap:16px;align-items:center}
 .container-detail:has(.container-rewards)>img {grid-column:1;grid-row:1 / span 2;width:96px;height:96px;margin:0}
 .container-detail .reward-confirmation {grid-column:2;margin:8px 0;font-size:14px}
 .container-detail .container-rewards {grid-column:2;margin:8px 0;gap:6px}
 .container-detail .container-rewards li {gap:8px;padding:6px}
 .container-detail .container-rewards li img {width:32px;height:32px}
 .container-detail .container-rewards strong {font-size:14px;line-height:1.25}
 .container-detail .container-status {grid-column:1 / -1}
}

.container-detail [data-next-container] {margin-top:14px}
@media(max-width:700px) and (orientation:portrait) and (max-height:700px){
 .container-detail:has(.container-rewards) {display:grid;grid-template-columns:64px minmax(0,1fr);gap:10px;margin-top:14px}
 .container-detail:has(.container-rewards)>img {grid-column:1;grid-row:1;width:64px;height:64px;margin:0}
 .container-detail .reward-confirmation {grid-column:2;grid-row:1;margin:0;font-size:14px;line-height:1.3;align-self:center}
 .container-detail .container-rewards {grid-column:1 / -1;margin:0;gap:6px}
 .container-detail .container-rewards li {padding:6px;gap:8px}
 .container-detail .container-rewards li img {width:36px;height:36px}
 .container-detail .container-rewards strong {font-size:14px;line-height:1.3}
 .container-detail [data-next-container],.container-detail .container-status {grid-column:1 / -1;margin:0}
}
@media(max-width:700px) and (orientation:landscape) and (max-height:500px), (pointer:coarse) and (orientation:landscape) and (max-height:500px){
 .container-detail:has(.container-rewards) {gap:8px;margin-top:8px}
 .container-detail:has(.container-rewards)>img {grid-row:1;width:80px;height:80px;align-self:center;justify-self:center}
 .container-detail .reward-confirmation {grid-row:1;margin:0;align-self:center}
 .container-detail .container-rewards {grid-row:2;margin:0}
 .container-detail [data-next-container] {grid-column:1;grid-row:2;align-self:end;min-width:0;width:100%;padding:10px 4px;font-size:14px;margin:0}
}

@media(max-height:360px){
 .stage-content:has(.pw04-inventory) {top:calc(52px + env(safe-area-inset-top));bottom:calc(12px + env(safe-area-inset-bottom))}
 .scene:has(.pw04-inventory) .profile-badge {width:36px;height:36px}
 .content-board:has(.pw04-inventory) .content-header {min-height:44px;padding:4px 10px}
 .content-board:has(.pw04-inventory) .content-header h1 {font-size:24px}
 .content-board:has(.pw04-inventory) .back-button {width:36px;height:36px}
 .content-board:has(.pw04-inventory) .content-scroll {padding:8px}
 .pw04-inventory-balances {margin-bottom:8px}
 .pw04-inventory-balances>div {padding:3px 6px;min-width:110px}
 .pw04-inventory-balances img {width:20px;height:20px}
 .pw04-inventory-grid {--inventory-pad:6px;--inventory-gap:6px}
}

/* Separar el marco del área desplazable evita asomar fragmentos de otra fila. */
.pw04-inventory-main {padding-block:8px}
.pw04-inventory-grid {padding-block:0}
.pw04-inventory-slot:focus-visible {outline:2px solid var(--focus);outline-offset:-2px}

@media(max-width:700px), (pointer:coarse) and (max-height:500px){
 .content-board:has(.pw04-inventory) {--inventory-panel-max:540px}
}
.content-board:has(.pw04-inventory) .content-header {flex:none}