/* Amigos: el perfil es un botón amplio; las acciones quedan separadas. */
.friend-card{padding:14px;display:flex;flex-direction:column;gap:12px;min-width:0;}
.friend-card-profile{display:flex;align-items:center;gap:12px;width:100%;min-height:60px;padding:4px;border:0;border-radius:10px;background:transparent;color:var(--ink);text-align:left;font:inherit;cursor:pointer;}
.friend-card-profile:hover{background:var(--pitch-600);}
.friend-card-profile>.avatar{flex-shrink:0;}
.friend-card-info{flex:1;min-width:0;}
.friend-card-info strong{display:block;font-size:15px;overflow-wrap:anywhere;}
.friend-card-info small{display:block;margin-top:4px;font-size:11px;color:var(--stone);}
.friend-card-info b{color:var(--cone);}
.friend-card-profile>i{color:var(--stone);font-size:12px;}
.friend-card-actions{display:flex;flex-wrap:wrap;gap:6px;padding-top:12px;border-top:1px solid var(--line);}
.friend-card-actions .btn{min-height:40px;padding:8px 10px;font-size:11px;margin:0;}
.friend-card-actions .btn:disabled{opacity:.45;cursor:not-allowed;}
:root{
  --pitch-900:#0A0A0A; --pitch-700:#1A1A1A; --pitch-600:#242424; --pitch-100:#1E1E1E;
  --court:#121212; --paper:#1C1C1C; --ink:#FFFFFF; --stone:#A0A0A0; --line:#333333;
  --cone:#FF5722; --cone-600:#E64A19; --cone-100:rgba(255, 87, 34, 0.15); 
  --danger:#F44336; --accent-blue:#00BFFF; --success:#4CAF50; --gold:#FFD700;
  --font-display:'Bebas Neue', system-ui, sans-serif;
  --font-body:'Inter', system-ui, -apple-system, sans-serif;
  --font-brand:'Outfit', var(--font-body);
  --font-mono:'JetBrains Mono','SFMono-Regular',Consolas,monospace;
}
*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{background:var(--court);color:var(--ink);font-family:var(--font-body);-webkit-font-smoothing:antialiased;min-height:100vh;}
img{max-width:100%;display:block;}
button,input,textarea,select{font-family:inherit; color:var(--ink);}
h1,h2,h3,p{margin:0;}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;}
.is-hidden{display:none !important;}
:focus-visible{outline:2px solid var(--cone);outline-offset:2px;}

select {
  background-color: var(--pitch-600); color: var(--ink); border: 1px solid var(--line);
  border-radius: 9px; padding: 10px 12px; width: 100%; font-size: 13px; font-weight: 500;
  -webkit-appearance: none; appearance: none;
  background-image: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%23FFFFFF%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.4-12.8z%22%2F%3E%3C%2Fsvg%3E");
  background-repeat: no-repeat; background-position: right 12px top 50%; background-size: 10px auto;
}
select:focus { outline: none; border-color: var(--cone); box-shadow: 0 0 0 3px var(--cone-100); }
select option { background-color: var(--pitch-700); color: var(--ink); }

input[type="file"] { padding: 8px; background: var(--pitch-600); border: 1px dashed var(--line); cursor: pointer; border-radius:9px; width:100%; color:var(--stone); }
input[type="file"]::file-selector-button { background: var(--pitch-700); color: var(--ink); border: 1px solid var(--line); padding: 6px 12px; border-radius: 6px; margin-right: 10px; font-weight: 600; cursor: pointer; }

.input-cant { width: 70px; padding: 10px; border-radius: 8px; border: 1px solid var(--line); background: var(--pitch-600); color: var(--ink); font-family: var(--font-mono); font-size: 15px; text-align: center; }
.input-cant:focus { border-color: var(--cone); outline: none; box-shadow: 0 0 0 3px var(--cone-100); }

/* Layout */
.loading-screen{position:fixed;inset:0;background:var(--court);display:flex;align-items:center;justify-content:center;color:var(--stone);font-size:14px;z-index:300;}
.topbar{background:rgba(10,10,10,0.85); backdrop-filter:blur(10px); padding:14px clamp(16px,4vw,40px);display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;position:sticky;top:0;z-index:30; border-bottom:1px solid var(--line);}
.brand{display:flex;align-items:center;gap:10px;}
.brand-badge{width:32px;height:32px;border-radius:9px;background:var(--cone);color:#fff;font-family:var(--font-display);font-size:17px;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.brand-word{font-family:var(--font-display);font-size:22px;letter-spacing:.05em;color:var(--cone);}
.tabs{display:flex;gap:4px;overflow-x:auto;}
.tab{white-space:nowrap;background:transparent;border:none;color:var(--stone);font-family:var(--font-body);font-weight:600;font-size:13.5px;padding:8px 14px;border-radius:20px;cursor:pointer;}
.tab:hover{background:var(--pitch-100);}
.tab.active{background:var(--cone-100);color:var(--cone);font-weight:700;}
.container{max-width:1080px;margin:0 auto;padding:22px clamp(16px,4vw,40px) 60px;}
.grid-matches{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:24px;}

/* Cards & UI */
.dark-card{background:var(--paper);border:1px solid var(--line);border-radius:16px;overflow:hidden;box-shadow:0 8px 24px rgba(0,0,0,0.4);}
.dc-hero{background-size:cover;background-position:center;padding:24px 20px 20px;position:relative;}
.dc-hero::before{content:'';position:absolute;inset:0;background:linear-gradient(to bottom, rgba(0,0,0,0.5), var(--paper));}
.dc-hero-content{position:relative;z-index:1;}
.dc-badge{display:inline-block;background:var(--cone);color:#fff;font-family:var(--font-body);font-weight:700;font-size:11px;padding:4px 10px;border-radius:6px;text-transform:uppercase;margin-bottom:8px;}
.dc-title{font-family:var(--font-display);font-size:38px;line-height:1;margin-bottom:8px;text-transform:uppercase;color:#fff;}
.dc-meta{font-size:13px;color:#ccc;margin-bottom:4px;}
.dc-stats{display:flex;background:var(--pitch-600);border-radius:12px;margin:0 20px 20px;padding:16px 0;border:1px solid var(--line);}
.dc-stat{flex:1;text-align:center;border-right:1px solid var(--line);}
.dc-stat:last-child{border-right:none;}
.dc-stat-lbl{font-size:10px;color:var(--stone);font-weight:700;margin-bottom:4px;letter-spacing:1px;}
.dc-stat-val{font-family:var(--font-display);font-size:24px;color:#fff;letter-spacing:1px;}
.dc-teams{padding:0 20px 20px;}
.dc-team-title{font-family:var(--font-display);font-size:22px;margin:16px 0 10px;letter-spacing:1px;}
.dc-player{background:var(--pitch-600);border-radius:12px;padding:12px;display:flex;align-items:center;gap:12px;margin-bottom:8px;border:1px solid transparent;}
.dc-empty{background:var(--pitch-600);border:1px dashed var(--line);border-radius:12px;padding:16px;text-align:center;color:var(--stone);font-size:13px;cursor:pointer;margin-bottom:8px;font-style:italic;}
.dc-empty:hover{background:#2A2A2A;border-color:#666;color:#fff;}

.card{background:var(--paper);border:1px solid var(--line);border-radius:16px;padding:18px 20px;}
.place{font-weight:600;font-size:15.5px;color:var(--ink);}
.meta{color:var(--stone);font-size:12.5px;margin-top:3px;}
.desc{font-size:13px;color:var(--stone);margin-top:8px;line-height:1.5;}

.btn{font-family:var(--font-body);font-weight:600;font-size:13.5px;padding:9px 16px;border-radius:10px;border:1px solid var(--line);background:var(--pitch-600);color:var(--ink);cursor:pointer;transition:transform .12s,background .12s;}
.btn:hover{background:var(--line);}
.btn:active{transform:scale(.97);}
.btn-primary{background:var(--cone);border-color:var(--cone);color:#fff;}
.btn-primary:hover{background:var(--cone-600);}
.btn-secondary{background:var(--pitch-100);border-color:var(--line);color:var(--ink);}
.btn-danger-ghost{background:transparent;border-color:rgba(244,67,54,.35);color:var(--danger);}
.btn-success{background:#4CAF50;border-color:#4CAF50;color:#fff;}

.field{display:flex;flex-direction:column;gap:5px;}
.field label{font-size:12px;color:var(--stone);font-weight:600;}
.field input:not([type="checkbox"]):not([type="radio"]):not(.input-cant),.field textarea{border:1px solid var(--line);border-radius:9px;padding:9px 11px;font-size:14px;background:var(--pitch-600);color:var(--ink);width:100%;}
.field input:focus,.field textarea:focus{border-color:var(--cone);box-shadow:0 0 0 3px var(--cone-100);outline:none;}
.field-row{display:flex;gap:12px;}
.field-row .field{flex:1;}
.form-card{display:flex;flex-direction:column;gap:14px;max-width:560px;}
.error-text{color:var(--danger);font-size:13px;min-height:16px;}
.group-box{background:var(--pitch-600);border-radius:14px;padding:16px;border:1px solid var(--line);}
.segmented{display:flex;gap:6px;}
.seg-btn{flex:1;padding:9px;border-radius:9px;border:1px solid var(--line);background:var(--pitch-600);color:var(--stone);font-weight:600;font-size:13px;cursor:pointer;}
.seg-btn.active{background:var(--cone);border-color:var(--cone);color:#fff;}

/* Profile */
.profile-head{display:flex;gap:18px;align-items:center;flex-wrap:wrap;margin-bottom:18px;}
.profile-stats{display:flex;gap:10px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:16px 0;margin-bottom:22px;}
.stat{text-align:center;flex:1;}
.stat b{display:block;font-family:var(--font-mono);font-size:22px;}
.stat span{font-size:10px;color:var(--stone);text-transform:uppercase;font-weight:700;}
.level-card{background:linear-gradient(135deg, var(--pitch-600), var(--pitch-900));border:1px solid var(--line);border-radius:16px;padding:24px;color:#fff;margin-bottom:26px;}
.level-num{font-family:var(--font-display);font-size:54px;color:var(--cone);line-height:1;}
.block{margin-bottom:28px;}
.block h2{font-family:var(--font-display);font-size:24px;letter-spacing:.02em;margin-bottom:16px;color:var(--ink);}
.history-card{background:var(--paper);border:1px solid var(--line);border-radius:12px;padding:12px 14px;display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;}
.hist-place{font-size:13px;color:var(--stone);flex:1;}
.tag{font-size:10px;font-weight:700;padding:4px 8px;border-radius:20px;margin-left:8px;text-transform:uppercase;}
.tag-win{background:rgba(76,175,80,0.15);color:#4CAF50;}
.tag-draw{background:var(--pitch-600);color:var(--stone);}
.tag-loss{background:rgba(244,67,54,0.15);color:var(--danger);}
.up{color:#4CAF50;font-weight:bold;}
.down{color:var(--danger);font-weight:bold;}

/* Dashboard */
.finance-card { background: linear-gradient(135deg, var(--pitch-600), var(--pitch-900)); border: 1px solid var(--gold); border-radius: 16px; padding: 24px; color: #fff; margin-bottom: 26px; text-align:center; }
.finance-num { font-family: var(--font-display); font-size: 54px; color: var(--gold); line-height: 1; }
.status-tag { display:inline-block; font-size:10px; padding:3px 8px; border-radius:12px; font-weight:bold; margin-bottom:6px; }
.status-pendiente { background: rgba(255, 152, 0, 0.2); color: #FF9800; border: 1px solid #FF9800; }
.status-aprobada { background: rgba(76, 175, 80, 0.2); color: #4CAF50; border: 1px solid #4CAF50; }
.admin-badge { background: #E91E63; color: white; border: 1px solid #E91E63; }

/* Modals */
.modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,0.8);backdrop-filter:blur(5px);display:flex;align-items:center;justify-content:center;padding:20px;z-index:100;}
.modal{background:var(--paper);border:1px solid var(--line);border-radius:20px;padding:24px;max-width:400px;width:100%;max-height:85vh;overflow-y:auto; display:flex; flex-direction:column;}
.modal-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;}
.modal-close{background:none;border:none;font-size:24px;color:var(--stone);cursor:pointer;line-height:1; flex-shrink:0;}
.mvp-option{display:flex;align-items:center;gap:12px;width:100%;padding:10px 12px;border-radius:12px;border:1px solid var(--line);background:var(--pitch-600);color:var(--ink);cursor:pointer;text-align:left;margin-bottom:8px;}
.mvp-option:hover{border-color:var(--cone);}

.chat-bubble { max-width: 80%; padding: 10px 14px; border-radius: 14px; font-size: 13px; margin-bottom: 2px; }
.chat-bubble-me { background: var(--cone); color: #fff; border-bottom-right-radius: 4px; align-self: flex-end; }
.chat-bubble-other { background: var(--pitch-600); color: var(--ink); border: 1px solid var(--line); border-bottom-left-radius: 4px; align-self: flex-start; }
.chat-author { font-size: 10px; color: var(--stone); margin-bottom: 2px; }


.avatar-upload{width:88px;height:88px;border-radius:50%;border:2px dashed var(--stone);display:flex;align-items:center;justify-content:center;overflow:hidden;margin:0 auto 16px;background:var(--pitch-600);color:var(--stone);font-size:12px;cursor:pointer;}
.avatar-upload img{width:100%;height:100%;object-fit:cover;}

/* Animations */
@keyframes fadeIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
@keyframes slideDown{from{opacity:0;transform:translateY(-16px)}to{opacity:1;transform:translateY(0)}}
@keyframes pulse-dot{0%,100%{opacity:1}50%{opacity:0.3}}
@keyframes scaleIn{from{opacity:0;transform:scale(0.92)}to{opacity:1;transform:scale(1)}}
@keyframes shimmer{0%{background-position:-200% 0}100%{background-position:200% 0}}
.anim-fade{animation:fadeIn .35s ease both;}
.anim-scale{animation:scaleIn .25s ease both;}
.anim-slide{animation:slideDown .3s ease both;}
.dark-card{transition:transform .2s, box-shadow .2s;}
.dark-card:hover{transform:translateY(-3px);box-shadow:0 12px 32px rgba(0,0,0,0.5);}
.modal{animation:scaleIn .25s ease both;}
.modal-overlay{animation:fadeIn .2s ease both;}
.skeleton{background:linear-gradient(90deg,var(--pitch-600) 25%,var(--pitch-100) 50%,var(--pitch-600) 75%);background-size:200% 100%;animation:shimmer 1.5s infinite;border-radius:8px;}
.btn:active{transform:scale(.95);}
.tab{transition:background .15s, color .15s;}
.mvp-option{transition:border-color .15s, background .15s;}
.dc-player{transition:border-color .15s, background .15s;}
.dc-player:hover{border-color:var(--stone);}
.countdown-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--success);margin-right:6px;animation:pulse-dot 1.5s infinite;}
@media (max-width:640px){ .field-row{flex-direction:column;} }

/* ==== Móvil: toques más cómodos, safe-area y mejor aprovechamiento ==== */
body{-webkit-tap-highlight-color:transparent;touch-action:manipulation;padding-top:env(safe-area-inset-top);}
@media (max-width:640px){
  .topbar{padding:10px 14px;gap:8px;}
  .brand-word{font-size:16px;}
  .brand-badge{width:28px;height:28px;}
  .tab{padding:7px 10px;font-size:12.5px;}
  .container{padding:16px 14px 70px;padding-bottom:calc(70px + env(safe-area-inset-bottom));}
  .grid-matches{gap:16px;}
  .dc-title{font-size:26px;}
  .dc-hero{padding:18px 16px 16px;}
  .dc-stats{margin:0 14px 14px;padding:12px 0;}
  .dc-teams{padding:0 14px 14px;}
  input,select,textarea{font-size:16px;}
  .form-card{padding:20px;}
  .modal-overlay{padding:10px;align-items:flex-end;}
  .modal{padding:20px;max-height:92vh;overflow-y:auto;width:100%;}
  .chat-bubble{max-width:82%;}
}

/* ==== Barra de navegación inferior (solo móvil) ==== */
#bottomnav{display:none;}
@media (max-width:640px){
  .topbar .tabs{display:none;}
  #bottomnav{display:flex;position:fixed;top:auto;left:0;right:0;bottom:0;width:100%;margin:0;z-index:60;background:rgba(10,10,10,0.94);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-top:1px solid var(--line);padding:6px 4px calc(6px + env(safe-area-inset-bottom));justify-content:space-around;transform:translateZ(0);-webkit-transform:translateZ(0);}

  .bn-item{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;padding:6px 0;color:var(--stone);font-size:10px;font-weight:600;border:none;background:none;cursor:pointer;}
  .bn-item i{font-size:18px;}
  .bn-item.active{color:var(--cone);}
  .container{padding-bottom:calc(90px + env(safe-area-inset-bottom));}
}

/* ==== Pantalla de partido compacta (estilo Playtomic) ==== */
/* El detalle del partido ocupa la pantalla entera y su contenido (campo de
   juego, chat, jugadores) es más alto que el móvil. Sin scroll propio, todo
   lo que caía por debajo del borde quedaba inalcanzable: con Fútbol 11 no se
   llegaba ni al botón de confirmar posición. */
#modal-detalle{overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;}
.pd-screen{max-width:440px;width:100%;margin:0 auto;min-height:100vh;display:flex;flex-direction:column;background:var(--court);}
.pd-top{position:sticky;top:0;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 14px;padding-top:calc(12px + env(safe-area-inset-top));background:rgba(10,10,10,0.92);backdrop-filter:blur(10px);border-bottom:1px solid var(--line);z-index:5;}

.pd-title{font-family:var(--font-display);font-size:20px;letter-spacing:.08em;color:var(--ink);}
.pd-icobtn{width:36px;height:36px;border-radius:50%;border:1px solid var(--line);background:var(--pitch-600);color:var(--ink);font-size:16px;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.pd-hero{padding:14px 16px;display:flex;flex-direction:column;gap:5px;background:var(--paper);border-bottom:1px solid var(--line);}
.pd-hero .t{font-family:var(--font-display);font-size:26px;color:var(--ink);text-transform:uppercase;letter-spacing:.03em;}
.pd-hero .m{font-size:12px;color:var(--stone);}
.pd-team{padding:12px 16px 2px;}
.pd-teamhead{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;font-size:11px;font-weight:800;letter-spacing:1.2px;}
.pd-count{color:var(--stone);}
.pd-card{display:flex;align-items:center;gap:10px;background:var(--pitch-600);border:1px solid var(--line);border-radius:12px;padding:8px 10px;margin-bottom:6px;}
.pd-ava{position:relative;flex-shrink:0;}
.pd-ava .pd-score{position:absolute;right:-5px;bottom:-5px;background:var(--gold);color:#111;font-weight:800;font-size:10px;line-height:1;padding:2px 5px;border-radius:9px;box-shadow:0 1px 3px rgba(0,0,0,0.4);}
.pd-info{flex:1;min-width:0;}
.pd-nombre{font-size:14px;font-weight:600;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.pd-nombre em{color:var(--cone);font-style:normal;font-size:11px;margin-left:4px;font-weight:700;}
.pd-sub{font-size:11px;color:var(--stone);}
.pd-acts{display:flex;gap:4px;flex-shrink:0;}
.pd-acts button{width:32px;height:32px;border-radius:50%;border:1px solid var(--line);background:var(--pitch-700);color:var(--stone);font-size:13px;cursor:pointer;display:flex;align-items:center;justify-content:center;}
.pd-acts .pd-danger{color:var(--danger);border-color:rgba(244,67,54,.4);}
.pd-libres{display:flex;flex-wrap:wrap;gap:8px;padding:6px 16px 8px;}
.pd-libre{width:66px;background:var(--pitch-600);border:1px dashed var(--line);border-radius:12px;padding:10px 0 6px;color:var(--stone);font-size:10px;font-weight:600;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:2px;}
.pd-libre b{font-size:22px;font-weight:400;color:var(--cone);line-height:1;}
.pd-libre i{font-size:16px;color:var(--stone);}
.pd-libre[disabled]{cursor:default;opacity:.5;}
.pd-libre[disabled] b{color:var(--stone);}
/* Solicitudes para unirse a un partido privado (las ve su creador, arriba del detalle). */
.pd-solicitudes{margin:12px 16px 4px;padding:14px;border:1px solid var(--cone);border-radius:14px;background:var(--cone-100);display:flex;flex-direction:column;gap:10px;}
.pd-sol-head h3{margin:0;font-size:16px;font-weight:800;color:var(--ink);display:flex;align-items:center;gap:8px;}
.pd-sol-num{min-width:22px;height:22px;padding:0 6px;border-radius:11px;background:var(--cone);color:#17120f;font-size:12px;font-weight:800;display:inline-flex;align-items:center;justify-content:center;}
.pd-sol-head p{margin:4px 0 0;font-size:13px;color:var(--stone);}
.pd-sol{background:var(--paper);border:1px solid var(--line);border-radius:12px;padding:10px;display:flex;flex-direction:column;gap:10px;}
.pd-sol-persona{display:flex;align-items:center;gap:12px;min-width:0;background:none;border:0;padding:0;font:inherit;color:inherit;text-align:left;cursor:pointer;}
.pd-sol-texto{display:flex;flex-direction:column;min-width:0;}
.pd-sol-texto strong{font-size:15px;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.pd-sol-texto small{font-size:13px;color:var(--stone);}
.pd-sol-acciones{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;}
.pd-sol-acciones .btn{min-height:40px;padding:8px 6px;font-size:13px;display:inline-flex;align-items:center;justify-content:center;gap:6px;white-space:nowrap;}
.pd-sol-destacar{animation:solDestacar 1.6s ease 1;}
@keyframes solDestacar{0%,40%{box-shadow:0 0 0 3px var(--cone);}100%{box-shadow:0 0 0 0 transparent;}}
@media (prefers-reduced-motion:reduce){.pd-sol-destacar{animation:none;}}
/* Perfil abierto desde una solicitud: aceptar o rechazar sin salir. */
.vj-solicitud{position:sticky;bottom:0;z-index:2;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;
  padding:12px max(16px,env(safe-area-inset-right,0px)) calc(12px + env(safe-area-inset-bottom,0px)) max(16px,env(safe-area-inset-left,0px));
  background:var(--paper);border-top:1px solid var(--line);box-shadow:0 -8px 24px rgba(0,0,0,.35);}
.vj-solicitud p{margin:0;font-size:14px;color:var(--stone);min-width:0;}
.vj-solicitud p strong{color:var(--ink);}
.vj-solicitud-botones{display:flex;gap:8px;flex:1 1 220px;justify-content:flex-end;}
.vj-solicitud-botones .btn{flex:1 1 0;min-height:44px;display:inline-flex;align-items:center;justify-content:center;gap:6px;}
.pd-acciones{display:flex;flex-wrap:wrap;gap:8px;padding:14px 16px 40px;margin-top:auto;}
.pd-acciones button{flex:1 1 30%;min-width:0;padding:10px 2px;border-radius:12px;border:1px solid var(--line);background:var(--pitch-600);color:var(--ink);font-size:11px;font-weight:600;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:4px;}
.pd-acciones button i{font-size:16px;}
.pd-acciones button:hover{border-color:var(--cone);}

/* Insignia de versión en la cabecera (visible siempre, también en móvil) */
.app-version{font-size:10px;font-weight:700;color:var(--stone);background:var(--pitch-600);border:1px solid var(--line);border-radius:8px;padding:2px 7px;margin-left:8px;letter-spacing:.05em;display:inline-flex;align-items:center;gap:5px;white-space:nowrap;cursor:pointer;}
.app-version .dot{width:7px;height:7px;border-radius:50%;background:var(--stone);flex-shrink:0;}
.app-version.online .dot{background:var(--success);}
.app-version.offline .dot{background:var(--cone);}

@media (max-width:640px){
  .pd-acciones{padding:10px 12px 36px;}
  .pd-acciones button{flex:1 1 45%;padding:8px 2px;font-size:10px;}
  .pd-acciones button i{font-size:14px;}
  .filter-bar{display:flex;flex-wrap:wrap;gap:8px;}
  #filter-search{flex:1;min-width:0;padding:8px 10px;font-size:13px;}
  #filter-formato,#filter-ciudad{min-width:auto;padding:8px 10px;font-size:13px;}
  #filter-date-from{padding:8px 10px;font-size:13px;}
  #filter-nivel-min,#filter-nivel-max{width:auto;min-width:60px;padding:8px 10px;font-size:13px;}
  .filter-bar .btn{padding:8px 12px;font-size:13px;}
}
/* =========================================================
   PACHANGAPP v29 — PREMIUM SPORTS UI
   ========================================================= */
:root{
  --pitch-900:#07090D;
  --pitch-700:#0D1016;
  --pitch-600:#151923;
  --pitch-100:#1C212C;
  --court:#080A0F;
  --paper:#11151D;
  --ink:#F7F8FA;
  --stone:#8B94A4;
  --line:rgba(255,255,255,.085);
  --line-strong:rgba(255,255,255,.14);
  --cone:#FF6B2C;
  --cone-600:#E9571E;
  --cone-100:rgba(255,107,44,.12);
  --danger:#FF5C62;
  --accent-blue:#4BA3FF;
  --success:#2ED3A5;
  --gold:#F6C85F;
  --teal:#2DD4BF;
  --shadow-lg:0 24px 60px rgba(0,0,0,.32);
  --shadow-md:0 14px 34px rgba(0,0,0,.22);
}
html{background:var(--court);scroll-behavior:smooth;}
body{
  background:
    radial-gradient(circle at 15% 0%, rgba(255,107,44,.08), transparent 26rem),
    radial-gradient(circle at 90% 10%, rgba(75,163,255,.06), transparent 24rem),
    linear-gradient(180deg,#080A0F 0%,#090B10 55%,#07090D 100%);
  color:var(--ink);
}
body::before{
  content:"";
  position:fixed;inset:0;pointer-events:none;z-index:-1;opacity:.35;
  background-image:linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);
  background-size:32px 32px;
  mask-image:linear-gradient(to bottom,rgba(0,0,0,.7),transparent 75%);
}
.topbar{
  background:rgba(7,9,13,.78);
  border-bottom:1px solid rgba(255,255,255,.08);
  box-shadow:0 10px 35px rgba(0,0,0,.15);
  padding:12px clamp(16px,4vw,40px);
}
.brand{gap:11px;}
.brand-badge{width:36px;height:36px;border-radius:11px;box-shadow:0 8px 20px rgba(255,107,44,.18);}
.brand-word{font-size:23px;letter-spacing:.08em;}
.app-version{
  border-radius:999px;padding:4px 8px;margin-left:8px;
  background:rgba(255,255,255,.04);border-color:rgba(255,255,255,.08);
}
.tabs{gap:6px;}
.tab{padding:9px 15px;border-radius:12px;}
.tab.active{box-shadow:inset 0 0 0 1px rgba(255,107,44,.14),0 5px 18px rgba(255,107,44,.08);}
.container{max-width:1160px;padding-top:28px;}
.grid-matches{gap:18px;}
.card,.dark-card,.history-card,.group-box,.level-card,.finance-card,.modal,.form-card{
  border-color:var(--line);
  box-shadow:var(--shadow-md);
}
.card{background:linear-gradient(180deg,rgba(21,25,35,.98),rgba(17,21,29,.98));}
.dark-card{background:linear-gradient(180deg,#141821,#10141B);}
.btn{
  border-color:var(--line);
  background:rgba(255,255,255,.035);
  min-height:40px;
  box-shadow:0 4px 14px rgba(0,0,0,.12);
}
.btn:hover{background:rgba(255,255,255,.07);border-color:var(--line-strong);transform:translateY(-1px);}
.btn-primary{box-shadow:0 10px 25px rgba(255,107,44,.18);}
.btn-primary:hover{box-shadow:0 12px 30px rgba(255,107,44,.24);}
.btn-secondary{background:rgba(255,255,255,.025);}
.field input:not([type="checkbox"]):not([type="radio"]):not(.input-cant),.field textarea,select{
  border-color:var(--line);
  background:rgba(255,255,255,.035);
  min-height:44px;
}
select{background-color:var(--pitch-600);}
.segmented{padding:4px;background:rgba(255,255,255,.025);border:1px solid var(--line);border-radius:13px;}
.seg-btn{border-color:transparent;background:transparent;border-radius:9px;}
.seg-btn.active{box-shadow:0 7px 18px rgba(255,107,44,.12);}

.profile-page{max-width:1020px;margin:0 auto;}
.profile-alert{
  background:linear-gradient(180deg,rgba(255,92,98,.12),rgba(255,92,98,.07));
  border:1px solid rgba(255,92,98,.34);
  color:#ff9b9f;padding:12px 15px;border-radius:16px;
  margin-bottom:16px;display:flex;align-items:center;gap:10px;font-size:13px;font-weight:650;
}
.profile-hero{
  position:relative;overflow:hidden;min-height:320px;border-radius:28px;
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 28px 70px rgba(0,0,0,.32);
  isolation:isolate;margin-bottom:18px;
  background:#10141b;
}
.profile-hero-bg{
  position:absolute;inset:0;
  background:
    radial-gradient(circle at 15% 20%,rgba(255,107,44,.28),transparent 28%),
    linear-gradient(135deg,#1B2230,#0D1118 70%,#0A0D12);
  background-size:cover;background-position:center;
  transform:scale(1.02);
}
.profile-hero-bg::after{
  content:"";position:absolute;inset:0;
  background:
    linear-gradient(120deg,rgba(7,9,13,.15),rgba(7,9,13,.65) 55%,rgba(7,9,13,.94)),
    radial-gradient(circle at 60% 70%,transparent 0,rgba(7,9,13,.22) 55%,rgba(7,9,13,.7) 100%);
}
.profile-hero::before{
  content:"";position:absolute;inset:0;z-index:0;opacity:.22;
  background-image:repeating-linear-gradient(90deg,transparent 0 58px,rgba(255,255,255,.05) 59px 60px),
                   repeating-linear-gradient(0deg,transparent 0 58px,rgba(255,255,255,.03) 59px 60px);
  mask-image:linear-gradient(to right,rgba(0,0,0,.85),transparent 82%);
}
.profile-hero-overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(6,8,11,.12),transparent 30%,rgba(6,8,11,.16) 56%,rgba(6,8,11,.72));}
.profile-hero-top{position:relative;z-index:2;display:flex;justify-content:space-between;padding:18px;}
.profile-hero-actions{display:flex;gap:8px;}
.icon-btn{
  width:42px;height:42px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;
  border:1px solid var(--line);background:rgba(7,9,13,.52);color:var(--ink);
  cursor:pointer;backdrop-filter:blur(12px);transition:.18s ease;box-shadow:0 8px 18px rgba(0,0,0,.18);
}
.icon-btn:hover{background:rgba(255,255,255,.09);border-color:rgba(255,255,255,.16);transform:translateY(-1px);}
.profile-hero-main{
  position:relative;z-index:2;display:flex;align-items:flex-end;gap:20px;
  padding:58px 30px 28px;min-height:245px;
}
.profile-avatar-wrap{
  width:112px;height:112px;border-radius:50%;flex:0 0 112px;
  display:grid;place-items:center;padding:4px;
  background:linear-gradient(145deg,#ff8e59,#ff5d1d 48%,#6d2309);
  box-shadow:0 16px 35px rgba(0,0,0,.3);
}
.profile-avatar-wrap>div{width:100%!important;height:100%!important;}
.profile-avatar-wrap img{width:100%;height:100%;object-fit:cover;border-radius:50%;border:4px solid #0B0E13;}
.profile-avatar-wrap > div:not(:has(img)){
  width:100%!important;height:100%!important;border-radius:50%!important;
}
.profile-identity{min-width:0;padding-bottom:4px;}
.profile-kicker{
  display:inline-flex;align-items:center;gap:7px;font-size:11px;text-transform:uppercase;
  letter-spacing:.12em;font-weight:800;color:#d5d9e0;margin-bottom:7px;
}
.status-dot{width:8px;height:8px;border-radius:50%;background:var(--success);box-shadow:0 0 0 5px rgba(46,211,165,.1);}
.profile-identity h2{
  font-family:var(--font-display);font-size:clamp(36px,6vw,60px);line-height:.95;
  letter-spacing:.015em;color:#fff;text-transform:uppercase;
}
.profile-identity-meta{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin-top:10px;color:#c1c7d0;font-size:12px;}
.profile-identity-meta:empty{display:none;}
.profile-identity-meta span:first-child:empty{display:none;}
.profile-meta-sep{opacity:.35;}
.profile-role-badge{
  display:inline-flex;align-items:center;gap:6px;margin-top:11px;padding:6px 10px;border-radius:999px;
  color:#fff;background:rgba(255,107,44,.18);border:1px solid rgba(255,107,44,.35);
  font-size:10px;font-weight:800;letter-spacing:.12em;
}
.profile-edit-card{
  border:1px solid var(--line);background:linear-gradient(180deg,#151A24,#10141B);
  border-radius:20px;padding:18px;margin-bottom:18px;box-shadow:var(--shadow-md);
}
.profile-edit-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;}
.profile-edit-head h3{font-family:var(--font-display);font-size:25px;letter-spacing:.03em;}
.profile-edit-form{display:grid;grid-template-columns:1fr 1fr;gap:12px;align-items:end;}
.profile-edit-form .btn{grid-column:1/-1;}

.profile-stats-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-bottom:18px;}
.profile-stat-card{
  position:relative;min-height:102px;padding:16px;border-radius:18px;
  background:linear-gradient(180deg,rgba(21,25,35,.96),rgba(16,20,28,.96));
  border:1px solid var(--line);box-shadow:0 10px 28px rgba(0,0,0,.15);
  overflow:hidden;
}
.profile-stat-card::after{content:"";position:absolute;right:-24px;top:-24px;width:80px;height:80px;border-radius:50%;background:rgba(255,255,255,.02);}
.profile-stat-wide{grid-column:span 2;display:grid;grid-template-columns:auto 1fr;align-items:center;column-gap:10px;}
.profile-stat-icon{
  width:32px;height:32px;border-radius:10px;display:grid;place-items:center;font-size:13px;margin-bottom:10px;
  background:rgba(255,255,255,.05);color:var(--ink);
}
.profile-stat-wide .profile-stat-icon{margin:0;}
.icon-orange{color:var(--cone);background:rgba(255,107,44,.12);}
.icon-green{color:var(--success);background:rgba(46,211,165,.1);}
.icon-gold{color:var(--gold);background:rgba(246,200,95,.1);}
.icon-blue{color:var(--accent-blue);background:rgba(75,163,255,.1);}
.icon-teal{color:var(--teal);background:rgba(45,212,191,.1);}
.profile-stat-value{font-family:var(--font-display);font-size:32px;line-height:1;color:#fff;}
.profile-stat-label{font-size:10px;letter-spacing:.09em;text-transform:uppercase;color:var(--stone);font-weight:800;margin-top:5px;}
.fairplay-meter{grid-column:1/-1;height:5px;border-radius:99px;background:rgba(255,255,255,.07);overflow:hidden;margin-top:7px;}
.fairplay-meter span{display:block;height:100%;width:0%;border-radius:99px;background:linear-gradient(90deg,var(--teal),var(--success));transition:width .35s ease;}

.premium-level-card{
  display:flex;align-items:center;justify-content:space-between;gap:24px;position:relative;
  padding:24px 26px;overflow:hidden;margin-bottom:20px;
  background:
    radial-gradient(circle at 84% 50%,rgba(255,107,44,.18),transparent 24%),
    linear-gradient(135deg,#151B27 0%,#11161E 52%,#0F131A 100%);
}
.premium-level-card::before{
  content:"";position:absolute;inset:0;pointer-events:none;opacity:.18;
  background:linear-gradient(120deg,transparent 0 35%,rgba(255,107,44,.12) 36% 42%,transparent 43% 100%);
}
.level-card-copy{position:relative;z-index:2;flex:1;min-width:0;}
.section-eyebrow{font-size:10px;text-transform:uppercase;letter-spacing:.16em;color:var(--stone);font-weight:800;}
.level-main-row{display:flex;align-items:flex-end;gap:12px;margin-top:4px;}
.level-num{font-family:var(--font-display);font-size:66px;color:#fff;line-height:.9;letter-spacing:.01em;}
.level-num #perfil-nivel{color:var(--cone);}
.level-badge{font-size:10px;padding:5px 8px;border-radius:999px;border:1px solid rgba(75,163,255,.25);color:#8ec6ff;background:rgba(75,163,255,.08);margin-bottom:7px;font-weight:800;letter-spacing:.08em;}
.level-copy{color:#9ca6b6;font-size:12px;line-height:1.55;max-width:600px;margin-top:11px;}
.level-track{height:8px;border-radius:99px;background:rgba(255,255,255,.07);overflow:hidden;margin-top:14px;max-width:620px;}
.level-track span{display:block;height:100%;width:0;border-radius:99px;background:linear-gradient(90deg,var(--cone),#ff985f);box-shadow:0 0 18px rgba(255,107,44,.28);}
.level-scale{display:flex;justify-content:space-between;max-width:620px;font-size:9px;color:#646e7e;margin-top:5px;text-transform:uppercase;letter-spacing:.08em;}
.level-orb{
  width:118px;height:118px;border-radius:50%;padding:8px;position:relative;z-index:2;flex:0 0 118px;
  background:conic-gradient(from 210deg,rgba(255,107,44,.15),var(--cone),rgba(255,107,44,.15));
  box-shadow:0 0 35px rgba(255,107,44,.13);
}
.level-orb-inner{
  width:100%;height:100%;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;
  background:#0D1118;border:1px solid rgba(255,255,255,.08);color:#fff;
}
.level-orb-inner i{font-size:17px;color:var(--gold);}
.level-orb-inner span{font-family:var(--font-display);font-size:34px;line-height:1;color:var(--cone);}

.profile-section{margin-bottom:22px;}
.profile-section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:14px;margin-bottom:12px;}
.profile-section-head h2{font-family:var(--font-display);font-size:27px;letter-spacing:.02em;line-height:1;color:#fff;margin-top:2px;}
.trend-pill,.section-counter{
  display:inline-flex;align-items:center;gap:6px;padding:6px 9px;border-radius:999px;
  font-size:10px;font-weight:800;letter-spacing:.03em;background:rgba(46,211,165,.08);color:#7ce0c2;border:1px solid rgba(46,211,165,.16);
}
.section-counter{background:rgba(255,255,255,.04);color:var(--stone);border-color:var(--line);}
.profile-section-copy{font-size:12px;color:var(--stone);line-height:1.5;margin:-3px 0 11px;}
.premium-chart-card{
  position:relative;min-height:180px;padding:15px 16px;border-radius:20px;
  background:linear-gradient(180deg,#141923,#10141B);border:1px solid var(--line);overflow:hidden;box-shadow:var(--shadow-md);
}
.premium-chart-card::before{
  content:"";position:absolute;left:0;right:0;top:0;height:1px;background:linear-gradient(90deg,transparent,var(--cone),transparent);opacity:.7;
}
.premium-chart-card svg{width:100%;height:auto;min-height:145px;}
.premium-chart-card text{font-family:var(--font-body)!important;font-size:9px;fill:#7f8999;}
.profile-list-stack{display:flex;flex-direction:column;gap:9px;}
.profile-page .history-card{
  background:linear-gradient(180deg,#141821,#11151d);
  border-color:var(--line);border-radius:16px;padding:14px 15px;
  box-shadow:0 8px 22px rgba(0,0,0,.12);
}
.profile-page .history-card:hover{border-color:rgba(255,107,44,.18);transform:translateY(-1px);}
.profile-page .hist-place{color:#a8b0bd;font-size:12px;}
.profile-page .tag{margin-left:7px;}
.profile-page .tag-win{background:rgba(46,211,165,.1);color:#6ee0bf;border-color:rgba(46,211,165,.15);}
.profile-page .tag-draw{background:rgba(255,255,255,.04);color:#9ba4b3;}
.profile-page .tag-loss{background:rgba(255,92,98,.09);color:#ff8b90;}
.profile-footer-actions{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px;margin-top:4px;}
.profile-footer-actions .btn{width:100%;display:flex;align-items:center;justify-content:center;gap:7px;}
.profile-footer-actions #btn-delete{grid-column:auto;}
.profile-tech{
  border:1px solid var(--line);border-radius:18px;background:rgba(255,255,255,.02);margin:18px 0 14px;overflow:hidden;
}
.profile-tech summary{list-style:none;display:flex;align-items:center;gap:10px;padding:13px 15px;cursor:pointer;color:#a7b0bf;font-size:12px;font-weight:700;}
.profile-tech summary::-webkit-details-marker{display:none;}
.profile-tech .tech-chevron{margin-left:auto;font-size:10px;transition:transform .2s;}
.profile-tech[open] .tech-chevron{transform:rotate(180deg);}
.profile-tech #diag-box{padding:0 15px 15px;}
.profile-tech #diag-box>div{padding-top:0!important;}
.profile-tech #diag-box b{font-weight:800;}

.modal-overlay{background:rgba(5,7,10,.84);backdrop-filter:blur(14px);}
.modal{background:linear-gradient(180deg,#121720,#0F131A);border-color:var(--line);box-shadow:0 26px 80px rgba(0,0,0,.45);}
.modal-head{border-bottom:1px solid transparent;}
.modal-close{width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,.04);border:1px solid var(--line);}
.mvp-option{background:rgba(255,255,255,.035);border-color:var(--line);}
.mvp-option:hover{background:rgba(255,107,44,.07);}
.pd-top{background:rgba(8,10,15,.9);}
.pd-card,.pd-block,.pd-libre{border-color:var(--line);box-shadow:0 6px 16px rgba(0,0,0,.12);}

#bottomnav{
  background:rgba(8,10,15,.9)!important;
  border-top:1px solid rgba(255,255,255,.09)!important;
  box-shadow:0 -12px 30px rgba(0,0,0,.18);
}
.bn-item{transition:color .16s,transform .16s;}
.bn-item.active{transform:translateY(-1px);text-shadow:0 4px 16px rgba(255,107,44,.18);}

#build-marker{display:none!important;}
/* Make the existing profile modal feel like a compact version of the profile page */
#modal-jugador .modal{max-width:520px;padding:16px;}
#modal-jugador .modal-head{padding:4px 4px 10px;margin-bottom:4px;}
#modal-jugador .modal-head h3{font-size:14px;letter-spacing:.12em;color:var(--stone)!important;}
#jugador-content{padding-top:4px;}
.player-remote-profile .profile-mini-hero{
  position:relative;overflow:hidden;border-radius:18px;padding:22px 18px 18px;margin-bottom:12px;
  background:linear-gradient(135deg,#171D28,#0D1118);border:1px solid var(--line);
}
.player-remote-profile .profile-mini-hero::after{
  content:"";position:absolute;inset:0;background:radial-gradient(circle at 90% 20%,rgba(255,107,44,.12),transparent 35%);
}
.player-remote-profile .profile-mini-content{position:relative;z-index:2;display:flex;gap:13px;align-items:center;}
.player-remote-profile .profile-mini-content img{border-radius:50%;border:3px solid #0b0e13!important;}
.player-remote-profile .mini-name{font-family:var(--font-display);font-size:32px;line-height:.9;color:#fff;text-transform:uppercase;}
.player-remote-profile .mini-meta{font-size:11px;color:var(--stone);margin-top:7px;}
.player-remote-profile .mini-level{margin-top:7px;font-family:var(--font-display);font-size:32px;color:var(--cone);line-height:1;}
.player-remote-profile .mini-pos{font-size:10px;color:#9da6b4;margin-top:4px;}
.player-remote-profile .profile-mini-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:12px 0;}
.player-remote-profile .mini-stat{
  padding:11px 7px;border:1px solid var(--line);border-radius:13px;background:rgba(255,255,255,.03);text-align:center;
}
.player-remote-profile .mini-stat b{display:block;font-family:var(--font-display);font-size:23px;line-height:1;color:#fff;}
.player-remote-profile .mini-stat span{display:block;margin-top:4px;font-size:9px;color:var(--stone);text-transform:uppercase;letter-spacing:.06em;font-weight:800;}
.player-remote-profile .mini-chart-title{font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--stone);font-weight:800;margin:14px 0 7px;}
.player-remote-profile .premium-chart-card{min-height:135px;padding:11px 12px;}
.player-remote-profile .profile-mini-history{display:flex;flex-direction:column;gap:7px;margin-top:9px;}
.player-remote-profile .profile-mini-history .history-card{padding:10px 11px;border-radius:12px;}
.player-remote-profile .profile-mini-note{
  font-size:10px;line-height:1.45;color:#768090;margin-top:12px;padding:10px 11px;
  border-radius:11px;background:rgba(255,255,255,.025);border:1px solid var(--line);
}

@media (max-width: 820px){
  .profile-stats-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
  .profile-stat-wide{grid-column:1/-1;}
  .profile-footer-actions{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media (max-width:640px){
  .container{padding-top:15px;}
  .profile-hero{min-height:360px;border-radius:22px;margin-left:-2px;margin-right:-2px;}
  .profile-hero-top{padding:12px;}
  .profile-hero-main{padding:76px 18px 22px;align-items:center;flex-direction:column;text-align:center;min-height:325px;justify-content:flex-end;}
  .profile-avatar-wrap{width:102px;height:102px;flex-basis:102px;}
  .profile-identity{padding:0;}
  .profile-identity h2{font-size:46px;}
  .profile-identity-meta{justify-content:center;}
  .profile-role-badge{margin-top:9px;}
  .profile-edit-form{grid-template-columns:1fr;}
  .profile-edit-form .btn{grid-column:auto;}
  .profile-stat-card{min-height:95px;padding:13px;}
  .profile-stat-value{font-size:29px;}
  .premium-level-card{padding:20px 18px;gap:14px;}
  .level-orb{width:86px;height:86px;flex-basis:86px;padding:6px;}
  .level-orb-inner span{font-size:26px;}
  .level-num{font-size:57px;}
  .level-copy{font-size:11px;}
  .profile-section-head{align-items:flex-end;}
  .profile-section-head h2{font-size:24px;}
  .trend-pill{font-size:9px;padding:5px 7px;}
  .profile-page .history-card{padding:12px;}
  .profile-footer-actions{grid-template-columns:1fr 1fr;}
  #modal-jugador .modal{width:calc(100% - 8px);padding:12px;border-radius:22px;}
  .player-remote-profile .mini-name{font-size:28px;}
}
@media (max-width:390px){
  .profile-identity h2{font-size:40px;}
  .profile-stats-grid{gap:8px;}
  .premium-level-card{padding:18px 15px;}
  .level-orb{display:none;}
  .trend-pill{display:none;}
  .profile-footer-actions{grid-template-columns:1fr;}
}

/* Fine tuning */
.profile-stats-grid{grid-template-columns:repeat(5,minmax(0,1fr));}
.profile-stat-wide{grid-column:span 1;display:block;}
.profile-stat-wide .profile-stat-icon{margin-bottom:10px;}
@media (max-width:820px){
  .profile-stats-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
  .profile-stat-wide{grid-column:1/-1;}
}

.profile-role-badge.role-admin{background:rgba(180,83,255,.12);border-color:rgba(180,83,255,.35);color:#d8a6ff;}
.profile-role-badge.role-gestor{background:rgba(246,200,95,.12);border-color:rgba(246,200,95,.32);color:#f5d984;}
.profile-role-badge.role-player{background:rgba(255,107,44,.12);border-color:rgba(255,107,44,.32);color:#ffad86;}

.player-remote-profile .profile-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:12px;}
.player-remote-profile .profile-actions .btn{width:100%;}
@media (max-width:420px){.player-remote-profile .profile-actions{grid-template-columns:1fr;}}

/* =====================================================
   V29 — Perfil móvil + campo interactivo
   ===================================================== */
.profile-hero-label{
  display:inline-flex;align-items:center;gap:7px;padding:8px 11px;border-radius:999px;
  background:rgba(7,10,15,.48);border:1px solid rgba(255,255,255,.12);
  color:#fff;font-size:9px;font-weight:900;letter-spacing:.14em;backdrop-filter:blur(12px);
}
.profile-hero-label i{color:var(--cone);font-size:11px;}

.create-field-card{
  padding:16px;border-radius:20px;border:1px solid rgba(255,255,255,.08);
  background:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.015));
  box-shadow:0 16px 40px rgba(0,0,0,.16);
}
.create-field-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:14px;}
.create-field-head h3{font-size:18px;color:var(--ink);margin-top:2px;}
.create-field-head p{font-size:11px;line-height:1.5;color:var(--stone);margin-top:5px;max-width:520px;}
.create-field-badge{flex-shrink:0;display:inline-flex;align-items:center;gap:6px;padding:7px 10px;border:1px solid rgba(255,107,44,.22);background:rgba(255,107,44,.08);color:#ff9a73;border-radius:999px;font-size:9px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;}
.create-formation-preview{padding:12px;border-radius:16px;background:rgba(0,0,0,.14);border:1px solid rgba(255,255,255,.05);}
.create-field-toolbar,.field-picker-formation{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px;}
.picker-kicker{display:block;font-size:8px;font-weight:900;letter-spacing:.14em;color:var(--stone);text-transform:uppercase;margin-bottom:3px;}
.create-field-toolbar strong,.field-picker-formation strong{font-family:var(--font-display);font-size:21px;color:#fff;letter-spacing:.05em;}
.formation-chips{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end;}
.formation-chip{border:1px solid var(--line);background:var(--pitch-600);color:var(--stone);border-radius:999px;padding:7px 10px;font-size:10px;font-weight:800;cursor:pointer;transition:.18s;}
.formation-chip:hover{border-color:rgba(255,107,44,.42);color:#fff;}
.formation-chip.active{background:var(--cone);color:#fff;border-color:var(--cone);box-shadow:0 6px 18px rgba(255,107,44,.18);}

.field-pitch-wrap{width:100%;}
.field-pitch{position:relative;width:100%;aspect-ratio:0.72;border-radius:20px;overflow:hidden;
  background:
   radial-gradient(circle at 50% 12%,rgba(255,255,255,.08),transparent 25%),
   linear-gradient(90deg,rgba(0,0,0,.06),transparent 26%,rgba(255,255,255,.035) 50%,transparent 74%,rgba(0,0,0,.06)),
   repeating-linear-gradient(90deg,#1f7a3a 0 12.5%,#246f39 12.5% 25%);
  border:2px solid rgba(255,255,255,.72);box-shadow:inset 0 0 60px rgba(0,0,0,.16),0 14px 32px rgba(0,0,0,.18);
}
.field-pitch::before,.field-pitch::after{content:"";position:absolute;left:3%;right:3%;height:2px;background:rgba(255,255,255,.68);}
.field-pitch::before{top:3%;}.field-pitch::after{bottom:3%;}
.field-line{position:absolute;border:2px solid rgba(255,255,255,.66);pointer-events:none;}
.field-line.mid{left:3%;right:3%;top:50%;transform:translateY(-1px);}
.field-line.circle{width:24%;aspect-ratio:1;left:50%;top:50%;transform:translate(-50%,-50%);border-radius:50%;}
.field-line.box{left:24%;right:24%;height:17%;}
.field-line.box.top{top:3%;border-top:none;}.field-line.box.bottom{bottom:3%;border-bottom:none;}
.field-line.goal{left:39%;right:39%;height:2.8%;background:rgba(255,255,255,.07);}
.field-line.goal.top{top:1%;}.field-line.goal.bottom{bottom:1%;}
.field-slot{position:absolute;transform:translate(-50%,-50%);width:54px;height:54px;border-radius:50%;border:1px solid rgba(255,255,255,.18);background:rgba(4,8,12,.84);color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 10px 24px rgba(0,0,0,.25);transition:transform .18s,border-color .18s,box-shadow .18s,background .18s;z-index:2;}
.field-slot:hover{transform:translate(-50%,-50%) scale(1.08);border-color:rgba(255,255,255,.7);}
.field-slot.clickable{border-color:rgba(255,255,255,.28);}
.field-slot.free{background:rgba(6,15,10,.72);}
.field-slot.free .field-slot-ball{filter:drop-shadow(0 0 8px rgba(255,255,255,.16));font-size:20px;}
.field-slot.occupied{cursor:default;background:linear-gradient(145deg,#141b22,#080c11);}
.field-slot.occupied .field-slot-avatar{display:flex;align-items:center;justify-content:center;width:31px;height:31px;border-radius:50%;background:linear-gradient(135deg,var(--cone),#ff8d5e);font-size:9px;font-weight:900;border:2px solid rgba(255,255,255,.85);}
.field-slot.disabled{opacity:.82;}
.field-slot.mine{border-color:var(--cone);box-shadow:0 0 0 4px rgba(255,107,44,.18),0 10px 24px rgba(0,0,0,.24);}
.field-slot.selected{border-color:#fff;background:var(--cone);box-shadow:0 0 0 5px rgba(255,255,255,.18),0 12px 30px rgba(255,107,44,.28);}
.field-slot.selected .field-slot-ball{font-size:21px;}.field-slot.selected .field-slot-label{color:#fff;}
.field-slot-label{position:absolute;top:calc(100% + 5px);font-size:8px;font-weight:900;letter-spacing:.06em;color:#fff;text-shadow:0 2px 5px rgba(0,0,0,.75);pointer-events:none;}

.pd-picker{margin:12px 16px 18px;padding:14px;border-radius:20px;border:1px solid rgba(255,255,255,.09);background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.02));box-shadow:0 18px 42px rgba(0,0,0,.2);}
.pd-picker-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:10px;}
.pd-picker-head h3{font-size:18px;color:#fff;margin:0 0 2px;}
.pd-picker-head p{font-size:10px;color:var(--stone);}
.pd-picker-hint{display:inline-flex;align-items:center;gap:6px;padding:7px 9px;border-radius:999px;color:#b9c1cd;background:rgba(255,255,255,.035);border:1px solid var(--line);font-size:8px;font-weight:800;white-space:nowrap;}
.pd-team-switch{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin:10px 0 12px;}
.pd-team-switch-btn{border:1px solid var(--line);background:var(--pitch-700);color:var(--stone);padding:10px 9px;border-radius:12px;font-size:10px;font-weight:800;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:7px;}
.pd-team-switch-btn.active{background:rgba(255,107,44,.11);border-color:rgba(255,107,44,.55);color:#fff;}
.team-dot{width:8px;height:8px;border-radius:50%;display:inline-block;box-shadow:0 0 0 3px rgba(255,255,255,.05);}.team-dot.orange{background:var(--cone);}.team-dot.blue{background:var(--accent-blue);}
.picker-lock{display:block;font-size:9px;color:var(--stone);max-width:190px;text-align:right;line-height:1.4;}
.pd-picker-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:12px;padding-top:12px;border-top:1px solid var(--line);}
.pd-picker-footer strong{font-size:16px;color:#fff;display:block;}
.pd-join-btn{min-width:170px;}
.pd-join-btn:disabled{opacity:.42;cursor:not-allowed;}
.pd-field-cta{width:100%;display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:10px;margin-top:4px;padding:11px 12px;border-radius:12px;background:linear-gradient(180deg,rgba(255,107,44,.06),rgba(255,255,255,.02));border:1px solid rgba(255,107,44,.2);color:var(--ink);cursor:pointer;text-align:left;}
.pd-field-cta>span{display:flex;align-items:center;gap:9px;}.pd-field-cta>span i{color:var(--cone);}.pd-field-cta b{font-size:11px;}.pd-field-cta small{font-size:9px;color:var(--stone);}.pd-field-cta>i{font-size:10px;color:var(--stone);}
.pd-position-full{margin-top:4px;padding:11px 12px;border-radius:12px;border:1px dashed var(--line);color:var(--stone);font-size:10px;display:flex;align-items:center;gap:7px;}
.pd-position-full i{color:var(--stone);}
.dc-alignment-strip{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:0 20px 16px;}
.dc-alignment-copy{display:flex;align-items:center;gap:8px;color:var(--stone);font-size:10px;}.dc-alignment-copy i{color:var(--cone);font-size:12px;}.dc-alignment-copy b{color:var(--ink);}
.dc-position-btn{padding:9px 11px;font-size:10px;white-space:nowrap;}

@media (max-width:640px){
  .profile-hero{min-height:250px;border-radius:22px;margin-left:-2px;margin-right:-2px;overflow:hidden;}
  .profile-hero-top{padding:11px 12px;align-items:center;}
  .profile-hero-main{padding:82px 16px 18px;min-height:250px;align-items:center;flex-direction:row;text-align:left;justify-content:flex-end;gap:14px;}
  .profile-avatar-wrap{width:84px;height:84px;flex-basis:84px;flex-shrink:0;}
  .profile-identity{padding:0;min-width:0;flex:1;}
  .profile-kicker{font-size:9px;}
  .profile-identity h2{font-size:34px;line-height:.95;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
  .profile-identity-meta{justify-content:flex-start;flex-wrap:wrap;gap:4px 8px;font-size:10px;}
  .profile-role-badge{margin-top:7px;}
  .profile-hero-actions .icon-btn{width:34px;height:34px;}
  .create-field-head{flex-direction:column;}.create-field-badge{align-self:flex-start;}
  .create-field-toolbar,.field-picker-formation{align-items:flex-start;flex-direction:column;}
  .formation-chips{justify-content:flex-start;width:100%;}
  .field-slot{width:46px;height:46px;}
  .field-slot-label{font-size:7px;top:calc(100% + 3px);}
  .pd-picker{margin:10px 10px 16px;padding:11px;}
  .pd-picker-head{flex-direction:column;}.pd-picker-hint{align-self:flex-start;}
  .pd-picker-footer{align-items:stretch;flex-direction:column;}.pd-join-btn{width:100%;}
  .pd-team-switch-btn{padding:9px 6px;font-size:9px;}
  .dc-alignment-strip{align-items:stretch;flex-direction:column;padding-top:0;}
  .dc-position-btn{width:100%;}
}
@media (max-width:390px){
  .profile-hero{min-height:236px;}
  .profile-hero-main{min-height:236px;padding-top:76px;gap:10px;}
  .profile-avatar-wrap{width:74px;height:74px;flex-basis:74px;}
  .profile-identity h2{font-size:29px;}
  .profile-hero-label{font-size:8px;padding:7px 9px;}
  .field-slot{width:40px;height:40px;}
  .field-slot-avatar{width:26px!important;height:26px!important;font-size:8px!important;}
}

/* =========================================================
   PACHANGAPP v30 — UI REAL ALINEADA CON EL MOCKUP PREMIUM
   ========================================================= */
:root{
  --brand-orange:#ff6b2c;
  --brand-pink:#ff3f8f;
  --brand-blue:#4ba3ff;
  --surface-0:#06090e;
  --surface-1:#0b1018;
  --surface-2:#101722;
  --surface-3:#151c28;
}
body{
  background:
    radial-gradient(circle at 12% -4%,rgba(255,107,44,.11),transparent 24rem),
    radial-gradient(circle at 92% 7%,rgba(75,163,255,.08),transparent 22rem),
    linear-gradient(180deg,#06090e 0%,#070b11 58%,#05080d 100%);
}
body::before{opacity:.22;background-size:28px 28px;}
.topbar{padding:11px clamp(16px,4vw,38px);background:rgba(5,8,13,.78);border-bottom:1px solid rgba(255,255,255,.07);}
.brand-word{font-family:var(--font-brand);font-weight:700;letter-spacing:-.03em;font-size:23px;color:#fff;text-transform:none;}
/* Crear partido: ciudad de las instalaciones, con el icono dentro del campo. */
.campo-ciudad{position:relative;display:block;}
.campo-ciudad>i{position:absolute;left:14px;top:50%;transform:translateY(-50%);color:var(--cone);font-size:14px;pointer-events:none;}
.campo-ciudad input{width:100%;box-sizing:border-box;}
/* Por id: la regla general de .field input (con varios :not) pesa más. */
#f-ciudad-campos{padding-left:38px;}
/* Botones «Ver en Google Maps» de Crear partido: como bloque (en línea, su
   relleno se montaba sobre el texto de encima y el margen no contaba). El JS
   solo los oculta (display:none) o vuelve a este valor. */
#f-mapa-link,#f-mapa-link-pers{display:flex;align-items:center;justify-content:center;gap:8px;box-sizing:border-box;margin-top:10px;}
/* Colores de los equipos de un partido: hasta 3 por equipo, en orden. */
/* Lo que solo tiene sentido en la web (p. ej. «Instalar la app») no sale en la app de móvil. */
.es-app .solo-web{display:none!important;}
/* «app» del nombre en naranja, en cabecera, acceso y pantalla de carga. */
.marca-app{color:var(--cone);}
.tabs{margin:0 auto;}
.tab{font-size:12px;padding:9px 13px;color:#8994a6;}
.tab.active{color:#fff;background:linear-gradient(180deg,rgba(255,107,44,.18),rgba(255,107,44,.08));box-shadow:inset 0 0 0 1px rgba(255,107,44,.18),0 8px 22px rgba(255,107,44,.08);}
.container{max-width:1180px;padding-top:26px;}

/* Home / explorar */
.home-hero{position:relative;min-height:270px;border-radius:28px;overflow:hidden;border:1px solid rgba(255,255,255,.08);background:
  linear-gradient(110deg,rgba(5,8,12,.94) 0%,rgba(5,8,12,.68) 48%,rgba(5,8,12,.18) 100%),
  url('../img/fotos/1579952363873-27f3bade9f55.jpg') center/cover;box-shadow:0 28px 70px rgba(0,0,0,.28);}
.home-hero::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 85% 15%,rgba(255,107,44,.18),transparent 25%),linear-gradient(0deg,rgba(5,8,12,.55),transparent 45%);pointer-events:none;}
.home-hero-overlay{position:absolute;inset:0;backdrop-filter:saturate(1.05);}
.home-hero-content{position:relative;z-index:2;max-width:560px;padding:38px 34px 32px;}
.home-hero-kicker{display:inline-flex;align-items:center;gap:8px;font-size:9px;letter-spacing:.18em;text-transform:uppercase;font-weight:900;color:#dce2ea;padding:7px 10px;border-radius:999px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.09);}
.home-hero-kicker i{color:var(--brand-orange);font-size:7px;}
.home-hero h1,.create-screen-hero h1{margin:15px 0 12px;font-family:var(--font-body);font-size:clamp(34px,5.2vw,62px);line-height:.95;letter-spacing:-.05em;font-weight:900;color:#fff;}
.home-hero h1 span,.create-screen-hero h1 span{background:linear-gradient(90deg,#ff7a3f,#ff3f8f);-webkit-background-clip:text;background-clip:text;color:transparent;}
.home-hero p,.create-screen-hero p{max-width:520px;color:#acb5c3;font-size:13px;line-height:1.55;}
.home-hero-actions{display:flex;gap:10px;margin-top:18px;flex-wrap:wrap;}
.home-hero-actions .btn{min-width:156px;border-radius:13px;padding:12px 16px;}
.hero-secondary{background:rgba(7,11,17,.56)!important;border-color:rgba(255,255,255,.16)!important;}
.quick-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:14px 0 24px;}
.quick-action-card{display:flex;align-items:center;gap:12px;width:100%;padding:14px 15px;border-radius:18px;border:1px solid var(--line);background:linear-gradient(180deg,#111722,#0d131c);color:#fff;text-align:left;cursor:pointer;box-shadow:0 12px 28px rgba(0,0,0,.18);transition:.18s ease;}
.quick-action-card:hover{transform:translateY(-2px);border-color:rgba(255,107,44,.22);}
.quick-action-card.blue:hover{border-color:rgba(75,163,255,.22);}
.quick-action-icon{width:42px;height:42px;border-radius:13px;display:grid;place-items:center;flex:0 0 42px;background:rgba(255,107,44,.11);color:var(--brand-orange);font-size:17px;}
.quick-action-card.blue .quick-action-icon{background:rgba(75,163,255,.11);color:var(--brand-blue);}
.quick-action-card b{display:block;font-size:13px;font-weight:800;}
.quick-action-card small{display:block;font-size:10px;color:#7f8a9b;margin-top:3px;line-height:1.3;}
.quick-action-card .arrow{margin-left:auto;color:#677181;font-size:11px;}
.section-heading-row{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin:6px 0 11px;}
.section-heading-row h2{font-family:var(--font-body);font-size:21px;letter-spacing:-.03em;font-weight:900;margin-top:3px;}
.link-button{background:none;border:0;color:#ff8c58;font-size:11px;font-weight:800;cursor:pointer;white-space:nowrap;}
.link-button i{margin-left:3px;font-size:9px;}
.filter-shell{padding-top:0;}
.filter-shell .filter-bar{padding:11px;border:1px solid var(--line);background:rgba(255,255,255,.025);border-radius:16px;box-shadow:0 12px 25px rgba(0,0,0,.12);}
.filter-shell #filter-search{min-height:44px;border-radius:12px!important;background:rgba(255,255,255,.035)!important;border-color:var(--line)!important;}
.grid-matches{grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:15px;}
.dark-card{border-radius:20px;background:linear-gradient(180deg,#121923,#0d131c);border-color:rgba(255,255,255,.08);box-shadow:0 18px 42px rgba(0,0,0,.22);}
.dark-card:hover{transform:translateY(-3px);box-shadow:0 24px 52px rgba(0,0,0,.28);}
.dc-hero{min-height:190px;padding:18px 18px 18px;background-position:center;}
.dc-hero::before{background:linear-gradient(180deg,rgba(3,6,10,.15),rgba(3,6,10,.9) 92%);}
.dc-badge{border-radius:999px;padding:5px 9px;font-size:9px;letter-spacing:.04em;box-shadow:0 6px 15px rgba(255,107,44,.18);}
.dc-title{font-family:var(--font-body);font-size:23px;line-height:1.02;letter-spacing:-.03em;text-transform:none;margin-bottom:8px;}
.dc-meta{font-size:10px;color:#c3cbd7;}
.dc-stats{margin:0 15px 13px;background:rgba(255,255,255,.035);border-color:var(--line);border-radius:15px;padding:10px 0;}
.dc-stat-lbl{font-size:8px;letter-spacing:.08em;}
.dc-stat-val{font-family:var(--font-body);font-weight:900;font-size:20px;}
.dc-teams{padding:0 15px 13px;}
.dc-team-title{font-family:var(--font-body);font-size:12px;font-weight:900;letter-spacing:.03em;text-transform:none;margin:11px 0 8px;}
.dc-player,.dc-empty{background:rgba(255,255,255,.035);border-radius:11px;border-color:rgba(255,255,255,.05);padding:9px 10px;}
.dc-alignment-strip{padding:0 15px 13px;}
.dc-position-btn{min-height:38px;border-radius:11px;}

/* Crear */
.screen-hero{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;padding:28px 28px 24px;margin-bottom:14px;border-radius:24px;border:1px solid var(--line);background:linear-gradient(135deg,rgba(18,25,36,.96),rgba(12,17,25,.96));box-shadow:0 22px 52px rgba(0,0,0,.18);position:relative;overflow:hidden;}
.screen-hero::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 90% 30%,rgba(255,107,44,.18),transparent 25%),linear-gradient(130deg,transparent 45%,rgba(255,107,44,.08) 46%,transparent 52%);pointer-events:none;}
.screen-hero>div{position:relative;z-index:1;}
.create-screen-hero p{max-width:650px;}
.screen-hero-badge{display:inline-flex;align-items:center;gap:7px;padding:9px 12px;border-radius:999px;border:1px solid rgba(255,107,44,.24);background:rgba(255,107,44,.08);color:#ffae89;font-size:9px;font-weight:900;letter-spacing:.08em;white-space:nowrap;}
.create-form-premium{max-width:880px;margin:0 auto;background:transparent;box-shadow:none;padding:0;}
.create-form-premium>.field,.create-form-premium>#ubicacion-instalacion,.create-form-premium>#ubicacion-personalizada,.create-form-premium>.field-row,.create-form-premium>.create-field-card,.create-form-premium>#crear-error,.create-form-premium>button{padding:0;}
.create-form-premium>.field,.create-form-premium>#ubicacion-instalacion,.create-form-premium>#ubicacion-personalizada,.create-form-premium>.field-row,.create-form-premium>.create-field-card{background:linear-gradient(180deg,#111722,#0d131c);border:1px solid var(--line);border-radius:18px;padding:16px;box-shadow:0 12px 30px rgba(0,0,0,.16);}
.create-form-premium>.field-row{background:transparent;border:0;padding:0;box-shadow:none;}
.create-form-premium>.create-field-card{padding:17px;}
.create-form-premium>button{border-radius:14px;min-height:48px;font-size:14px;font-weight:900;letter-spacing:.01em;}
.create-form-premium .segmented{background:rgba(255,255,255,.02);}
.create-form-premium .field label{font-size:9px;text-transform:uppercase;letter-spacing:.11em;color:#7f8a9b;}
/* La caja exterior fija el ancho aunque el calendario nativo imponga otro. */
.create-form-premium>.field-row>.field{min-width:0;}
.create-date-control{display:block;box-sizing:border-box;width:100%;max-width:100%;min-width:0;overflow:hidden;border:1px solid var(--line);border-radius:9px;background:var(--pitch-600);}
.create-form-premium .create-date-control #f-fecha{display:block;box-sizing:border-box;width:100%;max-width:100%;min-width:0;min-inline-size:0;min-height:42px;margin:0;border:0;border-radius:0;background:transparent;appearance:none;-webkit-appearance:none;box-shadow:none;outline:none;}
.create-date-control:focus-within{border-color:var(--cone);box-shadow:inset 0 0 0 1px var(--cone);}
#f-fecha::-webkit-date-and-time-value{min-width:0;text-align:left;}

/* Perfil móvil y escritorio coherente con el mockup */
.profile-page{max-width:1030px;}
.profile-hero{min-height:330px;border-radius:25px;background:#0c1118;}
.profile-hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:42%;background:linear-gradient(180deg,transparent,rgba(4,7,11,.84));pointer-events:none;}
.profile-avatar-wrap{box-shadow:0 0 0 6px rgba(255,107,44,.10),0 20px 45px rgba(0,0,0,.36);}
.profile-identity h2{font-family:var(--font-body);font-weight:900;letter-spacing:-.05em;text-transform:none;}
.profile-stat-card{min-height:96px;}
.level-orb{width:110px;height:110px;flex-basis:110px;}

/* bottom nav premium */
@media (max-width:640px){
  .topbar{position:sticky;top:0;z-index:70;padding:9px 12px;}
  .brand-word{font-size:18px;}
  .brand-badge{width:31px;height:31px;border-radius:10px;}
  .app-version{display:none;}
  .topbar>div:last-child{gap:4px!important;}
  .container{padding:12px 12px calc(88px + env(safe-area-inset-bottom));}
  .home-hero{min-height:270px;border-radius:22px;}
  .home-hero-content{padding:26px 20px 22px;max-width:100%;}
  .home-hero h1{font-size:39px;}
  .home-hero p{font-size:11px;max-width:310px;}
  .home-hero-actions{gap:8px;}
  .home-hero-actions .btn{min-width:0;flex:1;padding:11px 12px;font-size:11px;}
  .quick-actions{grid-template-columns:1fr;gap:8px;margin:10px 0 20px;}
  .quick-action-card{padding:12px;border-radius:16px;}
  .section-heading-row{margin:2px 0 9px;}
  .section-heading-row h2{font-size:18px;}
  .filter-shell .filter-bar{gap:7px!important;padding:8px;}
  .grid-matches{gap:12px;grid-template-columns:1fr;}
  .screen-hero{padding:22px 18px 19px;border-radius:21px;margin-bottom:10px;align-items:flex-start;}
  .create-screen-hero h1{font-size:37px;margin-top:12px;}
  .create-screen-hero p{font-size:10px;}
  .screen-hero-badge{display:none;}
  .create-form-premium>.field-row{display:block;}
  .create-form-premium>.field-row>.field + .field{margin-top:12px;}

  /* perfil: hero compacto, avatar integrado y sin aspecto extraño */
  .profile-hero{min-height:292px;border-radius:22px;margin:0 0 14px;}
  .profile-hero-top{padding:11px 11px;}
  .profile-hero-label{padding:7px 9px;font-size:8px;border-radius:999px;background:rgba(0,0,0,.35)!important;backdrop-filter:blur(10px);}
  .profile-hero-main{min-height:292px;padding:78px 18px 22px;justify-content:flex-end;gap:10px;align-items:center;flex-direction:column;text-align:center;}
  .profile-avatar-wrap{width:88px;height:88px;flex-basis:88px;border-width:0;padding:3px;}
  .profile-avatar-wrap img{border-width:3px;}
  .profile-identity h2{font-size:31px;line-height:1;margin-top:2px;}
  .profile-kicker{font-size:8px;margin-bottom:5px;justify-content:center;}
  .profile-identity-meta{justify-content:center;font-size:9px;margin-top:7px;color:#c9d0da;}
  .profile-role-badge{margin-top:6px;font-size:8px;padding:5px 8px;}
  .profile-stats-grid{gap:7px;margin-bottom:12px;}
  .profile-stat-card{min-height:82px;padding:11px;border-radius:14px;}
  .profile-stat-value{font-size:25px;}
  .profile-stat-icon{width:28px;height:28px;margin-bottom:7px;font-size:11px;border-radius:8px;}
  .profile-stat-label{font-size:8px;}
  .premium-level-card{padding:16px 15px;gap:10px;border-radius:18px;}
  .level-num{font-size:50px;}
  .level-copy{font-size:10px;}
  .level-orb{width:86px;height:86px;flex-basis:86px;padding:6px;}
  .level-orb-inner span{font-size:26px;}
  .profile-section-head h2{font-size:21px;}
  .premium-chart-card{min-height:160px;border-radius:17px;padding:11px;}
  .profile-page .history-card{border-radius:13px;padding:11px 12px;}
  #bottomnav{height:auto;padding:7px 6px calc(7px + env(safe-area-inset-bottom))!important;background:rgba(7,10,15,.92)!important;border-top:1px solid rgba(255,255,255,.09)!important;}
  .bn-item{gap:4px;padding:6px 0;border-radius:12px;font-size:9px;}
  .bn-item i{font-size:16px;}
  .bn-item.active{background:rgba(255,107,44,.08);}
}
@media (min-width:641px){
  #bottomnav{display:none!important;}
}

/* Amigos / modales con la misma estética que el resto del producto */
#view-amigos>div:first-child h2{font-family:var(--font-body)!important;font-size:24px!important;font-weight:900!important;letter-spacing:-.03em;}
#amigos-list{gap:9px!important;}
#amigos-list .dark-card{padding:12px 13px!important;border-radius:16px!important;background:linear-gradient(180deg,#111823,#0d131c)!important;}
#amigos-list .dark-card:hover{border-color:rgba(255,107,44,.18)!important;}
#amigos-list .btn{min-height:34px;padding:7px 9px!important;border-radius:10px!important;}
.modal{border-radius:22px!important;}
#modal-amigo-chat .modal{border-radius:24px!important;overflow:hidden;}
#amigo-chat-mensajes{background:linear-gradient(180deg,#090d13,#070a0f)!important;}
#form-amigo-chat{background:#0f151e!important;}
.chat-bubble-me{background:linear-gradient(135deg,#ff6b2c,#ff4b58)!important;border:0!important;box-shadow:0 8px 20px rgba(255,107,44,.16);}
.chat-bubble-other{background:#141b25!important;border-color:rgba(255,255,255,.07)!important;}

/* Precio legible y teclado decimal en móviles. */
.price-input { position: relative; }
.price-input input { width: 100%; box-sizing: border-box; padding-right: 42px; font-variant-numeric: tabular-nums; font-weight: 700; }
.price-input > span { position: absolute; right: 16px; top: 50%; transform: translateY(-50%); color: var(--cone); pointer-events: none; font-weight: 700; }
.price-input:focus-within > span { color: var(--chalk, #fff); }
.price-hint { display: block; margin-top: 6px; font-size: 12px; line-height: 1.5; color: var(--stone); }
.dc-stat-val { font-variant-numeric: tabular-nums; }

/* =====================================================================
   PERFIL PROPIO — distribución inspirada en Playtomic, con la identidad
   de PachangApp. Todo con variables de color, así que funciona igual en
   el tema oscuro y en el claro.
   ===================================================================== */
.pf{max-width:560px;margin:0 auto;padding-bottom:40px;}
.pf-muted{color:var(--stone);font-size:13px;line-height:1.45;}
.pf .is-hidden{display:none!important;}

/* Cabecera */
.pf-head{padding:8px 2px 4px;}
.pf-id{display:flex;align-items:center;gap:16px;}
.pf-avatar{flex-shrink:0;}
.pf-id-txt{min-width:0;display:flex;flex-direction:column;align-items:flex-start;gap:4px;}
.pf-name-line{display:flex;align-items:center;flex-wrap:wrap;gap:9px;min-width:0;max-width:100%;}
.pf-id-txt h2{font-size:24px;font-weight:800;line-height:1.1;color:var(--ink);overflow-wrap:anywhere;}
.pf-streak-badge{display:inline-flex;align-items:center;gap:4px;flex-shrink:0;padding:4px 8px;border:1px solid rgba(255,122,26,.28);border-radius:999px;background:var(--cone-100);color:var(--cone);line-height:1;}
.pf-streak-badge i{font-size:14px;}
.pf-streak-badge strong{font-size:14px;font-weight:800;}
.pf-link{background:none;border:0;padding:0;color:var(--cone);font-size:14px;font-weight:600;cursor:pointer;}
.pf-link-quiet{color:var(--stone);font-weight:500;}
.pf-link-quiet i{margin-right:4px;}
.pf-rol{font-size:10px;font-weight:800;letter-spacing:.08em;color:var(--cone);background:var(--cone-100);padding:3px 8px;border-radius:99px;}
.pf-counters{display:grid;grid-template-columns:repeat(4,1fr);margin:20px 0 16px;}
.pf-counters>div{display:flex;flex-direction:column;align-items:center;gap:2px;position:relative;}
.pf-counters>div+div::before{content:"";position:absolute;left:0;top:14%;bottom:14%;width:1px;background:var(--line);}
.pf-counters strong{font-size:26px;font-weight:800;color:var(--ink);line-height:1.1;}
.pf-counters span{font-size:13px;color:var(--stone);}
.pf-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
.pf-btn{border-radius:99px;padding:12px 14px;font-size:15px;font-weight:700;cursor:pointer;transition:transform .12s,opacity .12s;}
.pf-btn:active{transform:scale(.98);}
.pf-btn-outline{background:transparent;border:1.5px solid var(--cone);color:var(--cone);}
.pf-btn-solid{background:var(--cone);border:1.5px solid var(--cone);color:#fff;}
.pf-btn-sm{padding:7px 12px;font-size:12px;flex-shrink:0;}

/* Secciones y tarjetas */
.pf-section{margin-top:26px;}
.pf-section-head{display:flex;align-items:center;justify-content:space-between;gap:12px;}
.pf-title{font-size:20px;font-weight:800;color:var(--ink);margin:0 0 12px;}
.pf-section-head .pf-title{margin-bottom:12px;}
.pf-section-head .pf-link{margin-bottom:12px;}
.pf-card{background:var(--paper);border:1px solid var(--line);border-radius:18px;}
.pf-stack{display:flex;flex-direction:column;gap:10px;}
.pf-carousel{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;padding:2px 2px 8px;margin:0 -2px;-webkit-overflow-scrolling:touch;scrollbar-width:none;}
.pf-carousel::-webkit-scrollbar{display:none;}
.pf-carousel>*{scroll-snap-align:start;flex-shrink:0;}
.pf-carousel>.pf-muted{flex-shrink:1;}
.pf-row{display:flex;align-items:center;gap:12px;padding:12px 14px;}
.pf-row-accent{border-color:var(--cone);}
.pf-row-txt{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px;font-size:14px;color:var(--ink);}
.pf-row-txt small{color:var(--stone);font-size:12px;}

/* Tarjeta de nivel */
.pf-level-card{position:relative;overflow:hidden;width:100%;min-height:170px;margin-top:26px;border:1px solid var(--line);border-radius:22px;
  padding:22px;display:flex;align-items:flex-end;justify-content:space-between;gap:12px;text-align:left;cursor:pointer;color:#fff;background:#0b0d10;}
.pf-level-bg{position:absolute;inset:0;background:
  linear-gradient(100deg,rgba(7,9,13,.92) 0%,rgba(7,9,13,.55) 55%,rgba(7,9,13,.25) 100%),
  url('../img/fotos/1574629810360-7efbbe195018.jpg') center/cover;}
.pf-level-txt{position:relative;display:flex;flex-direction:column;gap:8px;}
.pf-level-num{font-family:var(--font-display);font-size:52px;line-height:.9;letter-spacing:.01em;color:var(--cone);}
.pf-level-num #perfil-nivel{color:var(--cone);}
.pf-level-rel{font-size:15px;color:#fff;display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.pf-badge{font-size:11px;font-weight:800;letter-spacing:.06em;padding:3px 9px;border-radius:99px;color:#fff;}
.pf-badge-bajo{background:#3b6fd8;}
.pf-badge-medio{background:#c98a12;}
.pf-badge-alto{background:#2e9d52;}
.pf-prov{font-size:12px;color:rgba(255,255,255,.75);}
.pf-level-go{position:relative;flex-shrink:0;width:52px;height:52px;border-radius:50%;background:var(--cone);display:flex;align-items:center;justify-content:center;font-size:18px;}

/* Evolución del nivel */
.pf-chips{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;margin-bottom:12px;}
.pf-chips::-webkit-scrollbar{display:none;}
.pf-chip{flex-shrink:0;border:1.5px solid var(--line);background:transparent;color:var(--ink);border-radius:99px;padding:8px 14px;font-size:14px;font-weight:700;cursor:pointer;}
.pf-chip.active{background:var(--ink);color:var(--court);border-color:var(--ink);}
.pf-lastchange{display:flex;align-items:center;gap:12px;padding:14px 16px;}
.pf-lc-info{color:var(--stone);font-size:18px;align-self:flex-start;}
.pf-lc-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px;}
.pf-lc-main strong{font-size:15px;color:var(--ink);}
.pf-lc-main small{font-size:12px;color:var(--stone);}
.pf-lc-trend{font-size:20px;padding:0 12px;border-left:1px solid var(--line);border-right:1px solid var(--line);align-self:stretch;display:flex;align-items:center;}
.pf-lc-trend.up{color:var(--success);}
.pf-lc-trend.down{color:var(--danger);}
.pf-lc-delta{display:flex;flex-direction:column;align-items:flex-end;gap:2px;min-width:60px;}
.pf-lc-delta small{font-size:12px;color:var(--stone);}
.pf-lc-delta strong{font-size:18px;color:var(--ink);font-variant-numeric:tabular-nums;}
.pf-chart{margin-top:6px;}
.pf-svg{width:100%;height:auto;display:block;overflow:visible;}
.pf-grid{stroke:var(--line);stroke-dasharray:5 6;stroke-width:1;}
.pf-line{fill:none;stroke:var(--cone);stroke-width:3;stroke-linejoin:round;stroke-linecap:round;}
.pf-dot{fill:var(--cone);}
.pf-dot.sel{fill:#fff;stroke:var(--cone);stroke-width:3;}
.pf-hit{fill:transparent;cursor:pointer;}
.pf-halo{fill:var(--cone);opacity:.18;}
.pf-sel-label{fill:var(--ink);font-size:20px;font-weight:800;font-family:var(--font-body);}
.pf-axis{fill:var(--stone);font-size:17px;font-family:var(--font-body);}

/* Más estadísticas */
.pf-more{width:100%;margin-top:18px;display:flex;align-items:center;gap:14px;padding:14px 16px;text-align:left;cursor:pointer;color:var(--ink);}
.pf-more-ico{width:54px;height:54px;border-radius:50%;background:var(--cone-100);color:var(--cone);display:flex;align-items:center;justify-content:center;font-size:22px;flex-shrink:0;}
.pf-more-txt{flex:1;display:flex;flex-direction:column;gap:3px;}
.pf-more-txt strong{font-size:17px;}
.pf-more-txt small{font-size:13px;color:var(--stone);}
.pf-more-arrow{color:var(--stone);}

/* Tarjetas de partido */
.pf-match{width:300px;padding:14px;cursor:pointer;display:flex;flex-direction:column;gap:8px;}
.pf-stack .pf-match{width:auto;}
.pf-match header{display:flex;justify-content:space-between;gap:8px;font-size:12px;color:var(--stone);}
.pf-match-fmt{font-weight:700;color:var(--cone);}
.pf-match-lugar{font-size:14px;font-weight:700;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.pf-team{display:flex;align-items:center;justify-content:space-between;gap:8px;}
.pf-team-players{display:flex;gap:6px;min-width:0;}
.pf-mp{display:flex;flex-direction:column;align-items:center;gap:3px;width:56px;}
.pf-mp-n{font-size:11px;color:var(--stone);max-width:56px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.pf-mp-mas{width:42px;height:42px;border-radius:50%;background:var(--pitch-600);color:var(--stone);font-size:13px;font-weight:700;align-items:center;justify-content:center;flex-direction:row;}
.pf-lvl{font-size:11px;font-weight:800;color:#111;background:var(--cone);border-radius:99px;padding:1px 7px;min-width:30px;text-align:center;}
.pf-team-score{display:flex;align-items:center;gap:8px;font-size:30px;font-weight:800;color:var(--stone);font-variant-numeric:tabular-nums;}
.pf-team.win .pf-team-score{color:var(--ink);}
.pf-team-score i{font-size:22px;color:var(--gold);}
.pf-match-sep{height:1px;background:var(--line);}
.pf-match footer{font-size:12px;color:var(--gold);}

/* Estadísticas */
.pf-stats{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px;}
.pf-stats-grid{display:grid;grid-template-columns:auto auto;gap:14px 26px;}
.pf-stats-grid>div{display:flex;flex-direction:column;align-items:center;gap:2px;}
.pf-stats-grid strong{font-size:30px;font-weight:800;color:var(--ink);line-height:1.1;}
.pf-stats-grid span{font-size:13px;color:var(--stone);}
.pf-stats-grid .ok strong,.pf-stats-grid .ok span{color:var(--success);}
.pf-ring{position:relative;width:130px;height:130px;flex-shrink:0;}
.pf-ring svg{width:100%;height:100%;}
.pf-ring-bg{fill:none;stroke:var(--line);stroke-width:10;}
.pf-ring-fg{fill:none;stroke:var(--cone);stroke-width:10;stroke-linecap:round;}
.pf-ring>span{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;}
.pf-ring strong{font-size:28px;font-weight:800;color:var(--ink);line-height:1;}
.pf-ring small{font-size:11px;color:var(--stone);margin-top:4px;line-height:1.3;}

/* Preferencias */
.pf-pref{display:flex;align-items:center;gap:14px;padding:14px 16px;}
.pf-pref-ico{font-size:26px;width:36px;text-align:center;flex-shrink:0;}
.pf-pref-txt{display:flex;flex-direction:column;gap:3px;min-width:0;}
.pf-pref-txt small{font-size:13px;color:var(--stone);}
.pf-pref-txt strong{font-size:16px;font-weight:600;color:var(--ink);}
.pf-pref-txt .pf-sin{color:var(--cone);}

/* Compañeros */
.pf-person{width:156px;overflow:hidden;cursor:pointer;}
.pf-person-top{height:92px;background:var(--pitch-600);display:flex;align-items:center;justify-content:center;}
.pf-person-top span{font-family:var(--font-display);font-size:42px;color:var(--ink);letter-spacing:.04em;}
.pf-person-top img{width:100%;height:100%;object-fit:cover;}
.pf-person-body{padding:10px 12px 12px;display:flex;flex-direction:column;gap:3px;}
.pf-person-body strong{font-size:14px;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.pf-person-body small{font-size:12px;color:var(--stone);}

/* Campos */
.pf-campo{width:170px;overflow:hidden;}
.pf-campo-foto{position:relative;height:100px;background:linear-gradient(135deg,var(--pitch-600),var(--pitch-700));display:flex;align-items:center;justify-content:center;color:var(--stone);font-size:26px;}
/* La foto va encima del icono: si el enlace de la imagen está roto, se ve el icono en vez de un hueco. */
.pf-campo-img{position:absolute;inset:0;background:center/cover no-repeat;}
.pf-campo-body{padding:10px 12px 12px;display:flex;flex-direction:column;gap:3px;}
.pf-campo-body strong{font-size:14px;color:var(--ink);line-height:1.25;}
.pf-campo-body small{font-size:12px;color:var(--stone);}

/* Ventana del perfil */
.pf-modal{max-width:460px;}
.pf-modal-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px;}
.pf-modal-head h3{font-size:20px;font-weight:800;color:var(--ink);}
.pf-modal-sub{font-size:15px;font-weight:800;color:var(--ink);margin:18px 0 10px;}
.pf-info-top{display:flex;flex-direction:column;gap:4px;margin-bottom:12px;}
.pf-info-top strong{font-family:var(--font-display);font-size:48px;color:var(--cone);line-height:1;}
.pf-info-top span{font-size:13px;color:var(--stone);}
.pf-info-list{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:8px;font-size:13px;color:var(--stone);line-height:1.45;}
.pf-info-list strong{color:var(--ink);}
.pf-delta{font-weight:800;font-size:15px;font-variant-numeric:tabular-nums;}
.pf-delta.up{color:var(--success);}
.pf-delta.down{color:var(--danger);}
.pf-cells{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;}
.pf-cell{padding:12px 8px;display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center;}
.pf-cell strong{font-size:22px;font-weight:800;color:var(--ink);}
.pf-cell small{font-size:11px;color:var(--stone);line-height:1.25;}
.pf-form{display:flex;flex-direction:column;gap:12px;}

@media (max-width:420px){
  .pf-level-num{font-size:46px;}
  .pf-stats{padding:14px 12px;}
  .pf-stats-grid{gap:12px 18px;}
  .pf-ring{width:112px;height:112px;}
  .pf-ring strong{font-size:24px;}
  .pf-cells{grid-template-columns:repeat(2,1fr);}
}

/* =====================================================================
   PANTALLA DE CARGA: «SAQUE DE CENTRO» (v140)
   Cae un balón al centro, bota y se convierte en el círculo central; sale
   la línea de medio campo, se dibuja la P y el degradado del icono se abre
   desde el centro. Luego suben el nombre y el lema. Solo SVG y CSS: la
   animación dura 3,2 s dentro de un ciclo de 4 s (los % de abajo son de
   esos 4 s). Se ve en cada apertura; quien pide reducir el movimiento
   (.loader-estatica) ve directamente la marca, sin animación.
   ===================================================================== */
.loading-screen{
  position:fixed;inset:0;z-index:10000;overflow:hidden;display:grid;place-items:center;padding:24px;
  background:#000;color:#fff;transition:opacity .5s ease,visibility .5s ease;
}
.loading-screen.is-finished{opacity:0;visibility:hidden;pointer-events:none}
.loader-final-brand{display:flex;flex-direction:column;align-items:center;pointer-events:none}
.loader-icono{position:relative;width:108px;height:108px}
.loader-baldosa{position:absolute;inset:0;border-radius:25px;background:linear-gradient(45deg,#C7381E 0%,#F7922F 100%)}
.loader-icono svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.loader-wordmark{margin-top:30px;font-family:var(--font-brand);font-weight:700;font-size:clamp(40px,10.5vw,60px);line-height:1;letter-spacing:-.03em;color:#fff}
.loader-final-brand small{margin-top:18px;font-size:10px;font-weight:800;letter-spacing:.28em;color:rgba(255,255,255,.55)}

.loader-trazo{stroke-dasharray:100 120;animation:4s cubic-bezier(.65,0,.35,1) both}
.loader-circulo{transform-box:fill-box;transform-origin:center;transform:rotate(-90deg);animation-name:loaderCirculo}
.loader-linea{animation-name:loaderLinea}
.loader-p{animation-name:loaderP}
.loader-balon{transform-box:fill-box;transform-origin:center;animation:loaderBalon 4s linear both}
.loader-baldosa{animation:loaderBaldosa 4s cubic-bezier(.3,0,.2,1) both}
.loader-wordmark{animation:loaderNombre 4s cubic-bezier(.2,.8,.2,1) both}
.loader-final-brand small{animation:loaderLema 4s ease both}
@keyframes loaderBalon{
  0%,4%{transform:translateY(-520px) scale(1);animation-timing-function:cubic-bezier(.55,0,1,.45)}
  18%{transform:translateY(0) scale(1.15,.85);animation-timing-function:cubic-bezier(0,.55,.45,1)}
  23%{transform:translateY(-18px) scale(1);animation-timing-function:cubic-bezier(.55,0,1,.45)}
  27%,30%{transform:translateY(0) scale(1)}
  35%,100%{transform:translateY(0) scale(0)}
}
@keyframes loaderCirculo{0%,28%{stroke-dashoffset:110}40%,100%{stroke-dashoffset:0}}
@keyframes loaderLinea{0%,36%{stroke-dashoffset:110}46%,100%{stroke-dashoffset:0}}
@keyframes loaderP{0%,42%{stroke-dashoffset:110}60%,100%{stroke-dashoffset:0}}
@keyframes loaderBaldosa{0%,54%{clip-path:circle(0% at 50% 39%)}66%,100%{clip-path:circle(80% at 50% 39%)}}
@keyframes loaderNombre{0%,62%{opacity:0;transform:translateY(16px)}74%,100%{opacity:1;transform:translateY(0)}}
@keyframes loaderLema{0%,68%{opacity:0;transform:translateY(8px)}80%,100%{opacity:1;transform:translateY(0)}}

/* ?loader-preview=1: en bucle, con un fundido entre vueltas. */
.loader-preview-mode .loader-final-brand{animation:loaderVuelta 4s linear infinite}
.loader-preview-mode .loader-final-brand *{animation-iteration-count:infinite}
@keyframes loaderVuelta{0%{opacity:0}3%,90%{opacity:1}97%,100%{opacity:0}}

@media(max-width:520px){
  .loader-icono{width:96px;height:96px}
  .loader-baldosa{border-radius:22px}
  .loader-final-brand small{font-size:9px}
}
.loader-estatica .loader-final-brand *{animation:none!important}
.loader-estatica .loader-balon{display:none}
@media(prefers-reduced-motion:reduce){
  .loader-final-brand *{animation:none!important}
  .loader-balon{display:none}
}

/* Modo organizador: el creador mueve jugadores de equipo y de posición. */
.pd-org-btn{border:1.5px solid var(--cone);background:transparent;color:var(--cone);border-radius:99px;padding:7px 12px;font-size:12px;font-weight:800;cursor:pointer;white-space:nowrap;flex-shrink:0;}
.pd-org-btn.active{background:var(--cone);color:#fff;}
.pd-organizando .field-slot.occupied{cursor:grab;}
.pd-organizando .field-slot.selected .field-slot-avatar{box-shadow:0 0 0 3px #fff,0 0 0 6px var(--cone);animation:orgPulso 1s ease-in-out infinite alternate;}
@keyframes orgPulso{from{transform:scale(1)}to{transform:scale(1.08)}}
.pd-card-marcado{border-color:var(--cone)!important;box-shadow:0 0 0 1px var(--cone) inset;}
.pd-card-marcado .pd-acts button:first-child{background:var(--cone);}

/* Ajuste de la foto de perfil */
.pf-avatar{background:none;border:0;padding:0;cursor:zoom-in;position:relative;border-radius:50%;}
/* Sin foto (iniciales) no hay nada que ampliar. */
.pf-avatar:not(:has(img)){cursor:default;}
/* Foto de perfil ampliada */
.modal-overlay.foto-ampliada{z-index:400;align-items:center;justify-content:center;}
.foto-ampliada img{display:block;max-width:min(92vw,520px);max-height:78vh;border-radius:18px;object-fit:contain;box-shadow:0 24px 70px rgba(0,0,0,.55);}
.foto-ampliada-cerrar{position:absolute;top:calc(env(safe-area-inset-top, 0px) + 14px);right:16px;color:#fff;}
.pf-foto-edit{display:flex;align-items:center;gap:14px;}
.pf-foto-edit-btns{display:flex;flex-wrap:wrap;gap:8px;}
.pf-foto-edit-btns label{display:inline-flex;align-items:center;}
.af-escena{position:relative;margin:0 auto;overflow:hidden;border-radius:16px;background:#000;touch-action:none;cursor:grab;user-select:none;}
.af-escena:active{cursor:grabbing;}
.af-escena img{position:absolute;max-width:none;pointer-events:none;}
.af-mascara{position:absolute;inset:0;pointer-events:none;border-radius:50%;box-shadow:0 0 0 400px rgba(0,0,0,.6);outline:2px solid rgba(255,255,255,.85);outline-offset:-2px;}
.af-zoom-fila{display:flex;align-items:center;gap:10px;color:var(--stone);font-size:13px;margin:8px 4px 14px;}
.af-zoom-fila input{flex:1;accent-color:var(--cone);}
.af-botones{display:grid;grid-template-columns:1fr 1fr;gap:10px;}

/* =====================================================================
   PERFIL — distribución propia
   Paleta sobria, la del resto de la app: el naranja marca lo positivo y lo
   seleccionado; todo lo demás va en blancos y grises.
   ===================================================================== */
.pf-head{position:relative;}
.pf-ajustes-btn{position:absolute;top:4px;right:0;width:40px;height:40px;border-radius:50%;border:1px solid var(--line);background:var(--paper);color:var(--ink);font-size:16px;cursor:pointer;display:flex;align-items:center;justify-content:center;}
.pf-id{padding-right:48px;}

/* Selector de tramo: ocupa el ancho de la tarjeta y dice qué muestra */
.pf-seg{display:grid;grid-template-columns:1.4fr 1fr 1fr;background:var(--pitch-600);border:1px solid var(--line);border-radius:12px;padding:3px;margin-bottom:14px;}
.pf-seg button{border:0;background:transparent;color:var(--stone);font-size:13px;font-weight:700;padding:8px 6px;border-radius:9px;cursor:pointer;white-space:nowrap;}
.pf-seg button.active{background:var(--paper);color:var(--ink);box-shadow:0 1px 0 var(--line);}

/* Evolución: resumen, gráfica de línea y detalle del punto */
.pf-evo{padding:14px 16px 12px;}
.pf-evo-resumen{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:8px;}
.pf-evo-resumen>div{display:flex;flex-direction:column;gap:2px;}
.pf-evo-resumen>div+div{border-left:1px solid var(--line);padding-left:12px;}
.pf-evo-resumen small{font-size:11px;color:var(--stone);text-transform:uppercase;letter-spacing:.06em;font-weight:700;}
.pf-evo-resumen strong{font-size:20px;font-weight:800;color:var(--ink);font-variant-numeric:tabular-nums;}
.pf-evo-resumen .up{color:var(--cone);}
.pf-evo-vacio{grid-column:1/-1;display:flex;align-items:center;gap:10px;color:var(--stone);font-size:13px;line-height:1.4;}
.pf-evo-vacio i{font-size:20px;color:var(--stone);}
.pf-evo .pf-chart,.pf-evo #chart-wrap{margin:6px 0 4px;}
.pf-evo-detalle{display:flex;align-items:center;gap:12px;border-top:1px solid var(--line);padding-top:12px;}
.pf-evo-dot{width:10px;height:10px;border-radius:50%;background:var(--stone);flex-shrink:0;}
.pf-evo-dot.up{background:var(--cone);}
.pf-evo-txt{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px;}
.pf-evo-txt strong{font-size:14px;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.pf-evo-txt small{font-size:12px;color:var(--stone);}
.pf-evo-val{display:flex;flex-direction:column;align-items:flex-end;gap:2px;}
.pf-evo-val strong{font-size:18px;color:var(--ink);font-variant-numeric:tabular-nums;}
.pf-evo-val small{font-size:12px;font-weight:800;color:var(--stone);}
.pf-evo-val .up{color:var(--cone);}

/* Estadísticas */
.pf-est{padding:16px;}
.pf-est-nums{display:grid;grid-template-columns:repeat(4,1fr);text-align:center;}
.pf-est-nums>div{display:flex;flex-direction:column;gap:2px;}
.pf-est-nums>div+div{border-left:1px solid var(--line);}
.pf-est-nums strong{font-size:26px;font-weight:800;color:var(--ink);line-height:1.1;}
.pf-est-nums small{font-size:11px;color:var(--stone);}
.pf-est-nums .v strong{color:var(--cone);}
.pf-est-barra{display:flex;height:6px;border-radius:99px;overflow:hidden;background:var(--line);margin:14px 0 16px;}
.pf-est-barra .v{background:var(--cone);}
.pf-est-barra .e{background:var(--stone);opacity:.6;}
.pf-est-barra .d{background:var(--stone);opacity:.25;}
.pf-est-fila{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;}
.pf-est-fila small{display:block;font-size:11px;color:var(--stone);text-transform:uppercase;letter-spacing:.06em;font-weight:700;margin-bottom:6px;}
.pf-forma-fila{display:flex;gap:6px;}
.pf-forma{width:28px;height:28px;border-radius:8px;display:inline-flex;align-items:center;justify-content:center;font-size:13px;font-weight:900;color:var(--stone);background:var(--pitch-600);border:1px solid var(--line);flex-shrink:0;}
.pf-forma.v{background:var(--cone);border-color:var(--cone);color:#fff;}
.pf-forma.e{color:var(--ink);}
.pf-forma.d{background:transparent;color:var(--stone);}
.pf-forma.pend{background:transparent;border:1.5px dashed var(--stone);color:var(--stone);}
.pf-forma.nada{background:transparent;border-color:transparent;}
.pf-est-ef{text-align:right;}
.pf-est-ef strong{font-size:26px;font-weight:800;color:var(--ink);}
.pf-est-mas{width:100%;margin-top:16px;border:0;border-top:1px solid var(--line);background:none;padding:12px 0 0;color:var(--cone);font-size:14px;font-weight:800;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;}

/* Últimos partidos jugados */
.pf-partido{display:flex;align-items:center;gap:12px;padding:12px 14px;width:100%;text-align:left;cursor:pointer;color:var(--ink);}
.pf-partido-fecha{width:46px;height:50px;border-radius:12px;background:var(--pitch-600);display:flex;flex-direction:column;align-items:center;justify-content:center;flex-shrink:0;}
.pf-partido-fecha strong{font-size:18px;font-weight:800;line-height:1;}
.pf-partido-fecha small{font-size:10px;font-weight:800;color:var(--stone);letter-spacing:.06em;margin-top:3px;}
.pf-partido-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px;}
.pf-partido-info strong{font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.pf-partido-info small{font-size:12px;color:var(--stone);}
.pf-partido-res{display:flex;flex-direction:column;align-items:flex-end;gap:4px;flex-shrink:0;}
.pf-partido-res small{font-size:12px;color:var(--stone);font-variant-numeric:tabular-nums;}
.pf-partido-res b{font-weight:800;color:var(--stone);}
.pf-partido-res b.up{color:var(--cone);}

/* Características del jugador */
.pf-rasgos{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
.pf-rasgo{padding:14px;display:flex;flex-direction:column;gap:4px;min-width:0;}
.pf-rasgo-ancho{grid-column:1/-1;}
.pf-rasgo-ico{width:34px;height:34px;border-radius:10px;background:var(--pitch-600);color:var(--ink);display:flex;align-items:center;justify-content:center;font-size:15px;margin-bottom:4px;}
.pf-rasgo small{font-size:11px;color:var(--stone);text-transform:uppercase;letter-spacing:.06em;font-weight:700;}
.pf-rasgo strong{font-size:16px;color:var(--ink);}
.pf-rasgo strong.pf-sin{color:var(--stone);font-weight:600;}
.pf-pos-fila{display:flex;gap:8px;flex-wrap:wrap;margin-top:2px;}
.pf-pos{display:inline-flex;align-items:center;gap:6px;background:var(--pitch-600);border-radius:99px;padding:6px 12px;font-size:14px;font-weight:600;color:var(--ink);}
.pf-pos b{font-size:11px;color:var(--stone);font-weight:900;}

/* Ajustes */
.pf-ajuste{width:100%;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;padding:14px 16px;text-align:left;cursor:pointer;color:var(--ink);font-size:15px;font-weight:600;}
.pf-ajuste i{font-size:18px;color:var(--ink);}
.pf-ajuste small{font-size:12px;color:var(--stone);font-weight:500;}

/* Selector de formato: filtra toda la parte de rendimiento */
.pf-fmt{display:grid;grid-template-columns:repeat(4,1fr);gap:4px;margin-top:22px;background:var(--pitch-600);border:1px solid var(--line);border-radius:14px;padding:4px;}
.pf-fmt button{border:0;background:transparent;color:var(--stone);font-size:13px;font-weight:700;padding:9px 4px;border-radius:10px;cursor:pointer;white-space:nowrap;}
.pf-fmt button.active{background:var(--cone);color:#fff;}

/* Tarjeta de nivel propia: número grande, tramo con nombre, anillo de
   fiabilidad y posición en la escala de 0 a 7. */
.pf-lv{display:block;margin-top:12px;padding:0;min-height:0;}
.pf-lv .pf-level-bg{background:
  linear-gradient(0deg,rgba(7,9,13,.96) 0%,rgba(7,9,13,.80) 45%,rgba(7,9,13,.45) 100%),
  url('../img/fotos/1574629810360-7efbbe195018.jpg') center 30%/cover;}
.pf-lv-cuerpo{position:relative;display:flex;flex-direction:column;padding:18px 20px 16px;color:#fff;text-align:left;}
.pf-lv-top{display:flex;align-items:center;justify-content:space-between;gap:10px;}
.pf-lv-kicker{font-size:11px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.72);}
.pf-lv-prov{font-size:10px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:#fff;border:1px solid rgba(255,255,255,.45);border-radius:99px;padding:3px 9px;}
.pf-lv-main{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:10px;}
.pf-lv-datos{display:flex;flex-direction:column;gap:4px;}
.pf-lv-num{font-family:var(--font-display);font-size:68px;line-height:.85;color:#fff;letter-spacing:.01em;}
.pf-lv-tramo{font-size:15px;font-weight:800;color:var(--cone);}
.pf-lv-ring{position:relative;width:66px;height:66px;flex-shrink:0;}
.pf-lv-ring svg{width:100%;height:100%;}
.pf-lv-ring .bg{fill:rgba(7,9,13,.4);stroke:rgba(255,255,255,.18);stroke-width:5;}
.pf-lv-ring .fg{fill:none;stroke:var(--cone);stroke-width:5;stroke-linecap:round;}
.pf-lv-ring>span{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1;}
.pf-lv-ring strong{font-size:15px;font-weight:800;color:#fff;}
.pf-lv-ring small{font-size:9px;font-weight:700;color:rgba(255,255,255,.65);margin-top:3px;text-transform:uppercase;letter-spacing:.08em;}
.pf-lv-escala{position:relative;height:4px;border-radius:99px;background:rgba(255,255,255,.18);margin:16px 0 6px;}
.pf-lv-fill{position:absolute;left:0;top:0;bottom:0;border-radius:99px;background:var(--cone);}
.pf-lv-marca{position:absolute;top:50%;width:12px;height:12px;border-radius:50%;background:#fff;border:2px solid var(--cone);transform:translate(-50%,-50%);}
.pf-lv-escala-txt{display:flex;justify-content:space-between;font-size:10px;font-weight:700;color:rgba(255,255,255,.5);}
.pf-lv-pie{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:12px;padding-top:12px;border-top:1px solid rgba(255,255,255,.12);font-size:12px;color:rgba(255,255,255,.7);}
.pf-lv-link{color:var(--cone);font-weight:800;white-space:nowrap;display:inline-flex;align-items:center;gap:6px;}
.pf-info-top small{font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--stone);}

/* Perfil de otro jugador: pantalla completa, por encima de la navegación y
   por debajo de las ventanas (chat, invitar, detalle del partido). */
.vista-jugador{position:fixed;inset:0;z-index:90;background:var(--court);overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;animation:fadeIn .2s ease both;}
.vista-jugador.is-hidden{display:none;}
.vj{padding:14px 16px calc(40px + env(safe-area-inset-bottom));}
.vj .pf-head{padding-top:6px;}
.vj .pf-actions .pf-btn[disabled]{opacity:.6;cursor:default;}
.vj .pf-actions>:only-child{grid-column:1/-1;}
.pf-nota-hist{display:flex;gap:8px;align-items:flex-start;font-size:12px;margin-top:4px;}
.pf-nota-hist i{margin-top:2px;}
/* Resultado en el detalle de un partido terminado y en "Resultados recientes" */
.rr-wrap{margin-top:28px;}
.rr-score{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;text-align:center;margin:14px 0 4px;}
.rr-score>div{display:flex;flex-direction:column;gap:2px;}
.rr-score small{font-size:12px;font-weight:800;color:var(--stone);text-transform:uppercase;letter-spacing:.06em;}
.rr-score strong{font-family:var(--font-display);font-size:54px;line-height:1;color:var(--ink);}
.rr-score span{font-size:11px;color:var(--stone);}
.rr-sep{font-size:32px;color:var(--stone);padding:0 10px;}
.rr-hecho{font-size:13px;font-weight:800;color:var(--cone);display:inline-flex;align-items:center;gap:6px;}
.rr-marcador{font-size:17px;font-weight:800;color:var(--ink);font-variant-numeric:tabular-nums;}
.rr-estado{font-size:11px!important;font-weight:700;}
.rr-estado.ok{color:var(--cone)!important;}
/* Ficha de jugador a pantalla casi completa: es el perfil, no una tarjeta */
.fj-modal{max-width:560px!important;width:100%;max-height:92vh;}
@media (max-width:520px){ #modal-jugador{padding:0;align-items:stretch;} #modal-jugador .fj-modal{max-height:100vh;height:100%;border-radius:0;} }
.pd-sub .pd-mvp{color:var(--cone);font-weight:800;}
.pd-sub .pd-delta.up{color:var(--cone);}
.pd-sub .pd-delta.down{color:var(--danger);}

/* =====================================================
   PACHANGAPP v55 — DESCUBRIMIENTO Y NAVEGACIÓN DE PARTIDOS
   ===================================================== */
.compact-match-list{display:flex;flex-direction:column;gap:10px}
.match-summary{display:flex;align-items:center;gap:18px;width:100%;padding:20px 22px;border:1px solid var(--line);border-radius:18px;background:var(--paper);color:var(--ink);text-align:left;cursor:pointer;transition:border-color .18s,transform .18s;font:inherit}
.match-summary:hover{border-color:var(--cone);transform:translateY(-2px)}
.match-summary-icon{display:grid;place-items:center;width:46px;height:46px;border-radius:14px;background:var(--cone-100);color:var(--cone);flex-shrink:0}
.match-summary-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px}
.match-summary-main strong{font-size:17px;overflow-wrap:anywhere}
.match-summary-main>span{font-size:12px;color:var(--stone)}
.match-summary-count{display:flex;flex-direction:column;text-align:center;gap:3px;flex-shrink:0}
.match-summary-count b{font-size:20px;color:var(--cone)}
.match-summary-count small{font-size:10px;color:var(--stone)}
.match-summary-arrow{font-size:26px;color:var(--stone)}
.home-match-section{margin-top:26px}
.home-match-section .section-heading-row{margin-bottom:12px}
.match-summary-mine{border-color:rgba(255,107,44,.3);background:linear-gradient(100deg,rgba(255,107,44,.075),var(--paper) 46%)}
.match-summary-status{display:inline-flex;width:max-content;margin-top:1px;padding:3px 7px;border-radius:999px;background:rgba(255,107,44,.12);color:#ff956d;font-size:8px;font-weight:900;letter-spacing:.06em;text-transform:uppercase}
#view-buscar .filter-bar{margin-bottom:0!important}
.search-back-button{display:inline-flex;align-items:center;gap:9px;margin:0 0 18px;padding:9px 13px;border:1px solid var(--line);border-radius:999px;background:var(--paper);color:var(--ink);font:inherit;font-size:12px;font-weight:800;cursor:pointer;transition:border-color .18s,transform .18s}
.search-back-button:hover{border-color:var(--cone);transform:translateX(-2px)}
.search-back-button i{color:var(--cone)}
.search-results-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin:24px 0 12px}
.search-results-head h2{margin:3px 0 0;font-size:22px}
#buscar-count{font-size:12px;margin:0;text-align:right}
#modal-detalle{overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;align-items:flex-start!important}
#modal-detalle .pd-screen{min-height:100%;height:auto;flex:0 0 auto}
.formation-chips{flex-wrap:wrap}

@media(max-width:900px){
  .topbar .tabs{display:none!important}
  #bottomnav{display:flex;position:fixed;top:auto;left:0;right:0;bottom:0;width:100%;margin:0;z-index:60;background:rgba(10,10,10,.94);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-top:1px solid var(--line);padding:6px 4px calc(6px + env(safe-area-inset-bottom));justify-content:space-around;transform:translateZ(0)}

  .bn-item{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;padding:6px 0;color:var(--stone);font-size:10px;font-weight:600;border:none;background:none;cursor:pointer}
  .bn-item i{font-size:18px}.bn-item.active{color:var(--cone)}
  .container{padding-bottom:calc(90px + env(safe-area-inset-bottom))}
}
@media(max-width:540px){
  .match-summary{gap:12px;padding:16px 14px}.match-summary-icon{display:none}.match-summary-main strong{font-size:15px}.match-summary-main>span{font-size:11px}.match-summary-count b{font-size:18px}
  #view-buscar .filter-bar>*{min-width:0!important;flex:1 1 42%!important}#view-buscar #filter-search{flex-basis:100%!important}
  .search-back-button{margin-bottom:14px}.search-results-head{align-items:flex-start;flex-direction:column;gap:5px}.search-results-head h2{font-size:20px}#buscar-count{text-align:left}
  #modal-detalle{padding:0!important}
}

/* Las ventanas (editar, chat, invitar, votar…) se abren por encima de la
   pantalla del partido (#modal-detalle, z-index 120). Antes quedaban debajo
   y no aparecían hasta cerrar el partido. */
.modal-overlay{z-index:130;}

/* Portada: dos tarjetas, crear partido y buscar partido. */
.home-duo{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-bottom:22px;}
.home-card{display:block;width:100%;min-height:250px;padding:0;text-align:left;font:inherit;color:inherit;cursor:pointer;transition:transform .18s ease,border-color .18s ease;}
.home-card:hover{transform:translateY(-2px);border-color:rgba(255,107,44,.28);}
.home-card:focus-visible{outline:2px solid var(--cone);outline-offset:3px;}
.home-card .home-hero-content{display:flex;flex-direction:column;align-items:flex-start;height:100%;padding:30px 28px 26px;}
.home-card-title{display:block;margin:15px 0 10px;font-size:clamp(30px,3.4vw,46px);line-height:.95;letter-spacing:-.05em;font-weight:900;color:#fff;}
.home-card-title span{background:linear-gradient(90deg,#ff7a3f,#ff3f8f);-webkit-background-clip:text;background-clip:text;color:transparent;}
.home-card-text{display:block;max-width:420px;color:#acb5c3;font-size:13px;line-height:1.55;}
.home-card-btn{display:inline-flex;align-items:center;gap:8px;margin-top:auto;padding:11px 16px;border-radius:13px;pointer-events:none;}
.home-card .home-card-text{margin-bottom:18px;}

/* Nombres del partido y de los equipos: nunca se salen de la pantalla. */
.match-summary-main{min-width:0;}
.match-summary-main strong,.match-summary-main>span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.pd-hero .t{overflow-wrap:anywhere;line-height:1.05;}
.pd-teamname{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.pd-team-switch-btn{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.pf-partido-info,.pf-row-txt{min-width:0;}
.pf-partido-info strong,.pf-row-txt strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}

/* Tarjetas de la portada: una foto distinta en cada una. */
.home-card-buscar{background:
  linear-gradient(110deg,rgba(5,8,12,.94) 0%,rgba(5,8,12,.7) 48%,rgba(5,8,12,.25) 100%),
  url('../img/fotos/1553778263-73a83bab9b0c.jpg') center/cover;}
.home-card-equipos{background:
  linear-gradient(110deg,rgba(5,8,12,.94) 0%,rgba(5,8,12,.7) 48%,rgba(5,8,12,.25) 100%),
  url('../img/fotos/1765046804547-06375f9a707b.jpg') center 40%/cover;}
.home-card-btn-extra{display:inline;}

/* Capitán */
.pd-cap{display:inline-grid;place-items:center;width:17px;height:17px;margin-left:6px;border-radius:50%;background:var(--gold);color:#111;font-size:10px;font-weight:900;font-style:normal;vertical-align:1px;}

/* Ajustes: acción peligrosa */
.pf-ajuste-peligro,.pf-ajuste-peligro i{color:var(--danger);}

/* Portada en el móvil: carrusel. Se ve una tarjeta entera y asoma la
   siguiente; se pasa deslizando y los puntos marcan cuál se está viendo. */
.home-duo-dots{display:none;}
@media (max-width:760px){
  .home-duo{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding:0 12px;
    margin:0 -12px 8px;padding:0 12px;scrollbar-width:none;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;}
  .home-duo::-webkit-scrollbar{display:none;}
  .home-card{flex:0 0 86%;min-height:200px;border-radius:20px;scroll-snap-align:start;}
  .home-card:hover{transform:none;}
  .home-card .home-hero-content{justify-content:flex-end;padding:18px 18px 16px;}
  .home-card .home-hero-kicker{display:none;}
  .home-card-title{font-size:27px;margin:0 0 6px;letter-spacing:-.04em;}
  .home-card-text{font-size:12px;line-height:1.45;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
  .home-card .home-card-text{margin-bottom:12px;}
  .home-card-btn{margin-top:0;padding:9px 14px;font-size:12px;border-radius:11px;}
  .home-duo-dots{display:flex;justify-content:center;gap:6px;margin:0 0 18px;}
  .home-duo-dots button{width:7px;height:7px;padding:0;border:0;border-radius:99px;background:#3a4250;cursor:pointer;transition:width .2s ease,background .2s ease;}
  .home-duo-dots button.active{width:18px;background:var(--cone);}
}

/* ============ Acceso: entrar y crear cuenta ============
   Pantalla de app móvil: foto arriba y una hoja que sube con el contenido.
   En pantallas anchas, la misma pantalla en una tarjeta centrada. Colores
   fijos: se ve igual con el tema claro y el oscuro. */
.ob{--ob-bg:#07090d;--ob-sheet:#0e131b;--ob-campo:#141a23;--ob-borde:#222b38;--ob-txt:#f4f6f9;--ob-mute:#8a94a4;
  min-height:100vh;min-height:100dvh;background:var(--ob-bg);color:var(--ob-txt);font-family:var(--font-body);}
.ob-card{display:flex;flex-direction:column;min-height:100vh;min-height:100dvh;}
.ob-hero{position:relative;padding:calc(20px + env(safe-area-inset-top)) 24px 58px;min-height:220px;display:flex;flex-direction:column;justify-content:space-between;overflow:hidden;}
.ob-hero-bg{position:absolute;inset:0;background:
  linear-gradient(180deg,rgba(7,9,13,.25) 0%,rgba(7,9,13,.62) 55%,#07090d 100%),
  url('../img/fotos/1553778263-73a83bab9b0c.jpg') center 35%/cover;}
.ob-brand{position:relative;display:flex;align-items:center;gap:10px;font-family:var(--font-brand);font-weight:700;font-size:25px;letter-spacing:-.03em;color:#fff;}
.ob-brand img{width:38px;height:38px;border-radius:11px;box-shadow:0 10px 26px rgba(255,107,44,.28);}
.ob-title{position:relative;margin:26px 0 0;font-family:var(--font-body);font-size:34px;line-height:1.02;letter-spacing:-.045em;font-weight:900;color:#fff;}
.ob-title span{background:linear-gradient(90deg,#ff7a3f,#ff3f8f);-webkit-background-clip:text;background-clip:text;color:transparent;}
.ob-sheet{position:relative;flex:1;margin-top:-30px;background:var(--ob-sheet);border-radius:28px 28px 0 0;border-top:1px solid rgba(255,255,255,.06);
  padding:20px 20px calc(24px + env(safe-area-inset-bottom));}
.ob-sheet::before{content:"";display:block;width:40px;height:4px;border-radius:99px;background:#2a3442;margin:-8px auto 16px;}

.ob-tabs{display:grid;grid-template-columns:1fr 1fr;padding:4px;margin-bottom:18px;border-radius:15px;background:#151c26;}
.ob-tabs button{height:42px;border:0;border-radius:12px;background:transparent;color:var(--ob-mute);font:inherit;font-size:14px;font-weight:800;cursor:pointer;transition:background .2s,color .2s;}
.ob-tabs button.active{background:#243041;color:#fff;box-shadow:0 6px 16px rgba(0,0,0,.25);}

.ob-steps{margin-bottom:16px;}
.ob-steps-bar{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-bottom:8px;}
.ob-steps-bar span{height:4px;border-radius:99px;background:#222b38;transition:background .3s;}
.ob-steps-bar span.on{background:linear-gradient(90deg,#ff7a3f,#ff4f6d);}
.ob-steps small{font-size:12px;font-weight:700;color:var(--ob-mute);letter-spacing:.02em;}

/* Campos con la etiqueta dentro que sube al escribir */
.ob-field{position:relative;margin-bottom:12px;}
.ob-field>i:first-child{position:absolute;left:17px;top:29px;transform:translateY(-50%);color:#6d7788;font-size:15px;pointer-events:none;transition:color .15s;}
.ob-field input,.ob-field select{display:block;width:100%;height:58px;margin:0;padding:22px 46px 6px 46px;border-radius:16px;border:1.5px solid var(--ob-borde);
  background:var(--ob-campo);background-image:none;color:#fff;font:inherit;font-size:16px;outline:none;box-shadow:none;-webkit-appearance:none;appearance:none;transition:border-color .15s,background-color .15s;}
.ob-field.ob-sin-ico input{padding-left:16px;}
.ob-field.ob-sin-ico label{left:16px;}
.ob-field select{cursor:pointer;}
.ob-field select:has(option[value=""]:checked){color:#7a8494;}
.ob-field select option{color:#fff;background:#161d28;}
.ob-field input:focus,.ob-field select:focus{border-color:#ff7a3f;background-color:#171f2a;}
.ob-field:focus-within>i:first-child{color:#ff7a3f;}
.ob-field label{position:absolute;left:46px;top:29px;transform:translateY(-50%);font-size:15px;color:#7a8494;pointer-events:none;transition:top .15s,font-size .15s,color .15s;white-space:nowrap;}
.ob-field input:focus+label,.ob-field input:not(:placeholder-shown)+label,.ob-field.ob-fijo label{top:17px;font-size:11px;font-weight:700;letter-spacing:.02em;color:#96a0af;}
.ob-field input:focus+label{color:#ff7a3f;}
.ob-field.error input,.ob-field.error select{border-color:#ff5a5f;}
.ob-field.error label,.ob-field.error>i:first-child{color:#ff7b7f;}
.ob-chev{position:absolute;right:17px;top:29px;transform:translateY(-50%);font-size:12px;color:#6d7788;pointer-events:none;}
.ob-eye{position:absolute;right:6px;top:7px;width:44px;height:44px;border:0;border-radius:12px;background:transparent;color:#7a8494;font-size:16px;cursor:pointer;}
.ob-eye:hover{color:#fff;}
.ob-row{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
.ob-row .ob-field input{padding-right:14px;}

/* Sugerencias de ciudad */
.ob-sug{position:absolute;left:0;right:0;top:64px;z-index:20;max-height:236px;overflow:auto;padding:6px;border-radius:16px;
  background:#161d28;border:1px solid #2a3544;box-shadow:0 22px 50px rgba(0,0,0,.5);}
.ob-sug-item{display:flex;width:100%;align-items:center;justify-content:space-between;gap:10px;padding:11px 12px;border:0;border-radius:10px;background:transparent;color:#e8ecf2;font:inherit;font-size:15px;text-align:left;cursor:pointer;}
.ob-sug-item small{font-size:12px;color:var(--ob-mute);white-space:nowrap;}
.ob-sug-item:hover,.ob-sug-item.on{background:#222c3a;}
.ob-sug-vacio{padding:12px;font-size:13px;color:var(--ob-mute);line-height:1.45;}

.ob-checks{display:flex;flex-wrap:wrap;gap:6px 16px;margin:0 4px 14px;padding:0;list-style:none;font-size:12px;color:#6d7788;}
.ob-checks li{display:flex;align-items:center;gap:6px;transition:color .2s;}
.ob-checks li::before{content:"";width:14px;height:14px;border-radius:50%;border:1.5px solid #3a4556;box-sizing:border-box;transition:all .2s;}
.ob-checks li.ok{color:#5dd39e;}
.ob-checks li.ok::before{border-color:#5dd39e;background:#5dd39e;box-shadow:inset 0 0 0 3px var(--ob-sheet);}

.ob-error{min-height:0;margin:0 4px 10px;color:#ff7b7f;font-size:13px;line-height:1.4;}
.ob-error:empty{display:none;}

.ob-cta{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;height:56px;border:0;border-radius:16px;cursor:pointer;
  background:linear-gradient(90deg,#ff7a3f,#ff4f6d);color:#fff;font:inherit;font-size:16px;font-weight:800;letter-spacing:.01em;
  box-shadow:0 14px 32px rgba(255,90,60,.28);transition:transform .15s,box-shadow .15s,opacity .15s;}
.ob-cta:active{transform:scale(.98);}
.ob-cta:disabled{opacity:.6;cursor:default;}
.ob-ghost{flex:0 0 56px;height:56px;border-radius:16px;border:1.5px solid #2a3544;background:transparent;color:#fff;font-size:16px;cursor:pointer;}
.ob-actions{display:flex;gap:10px;margin-top:6px;}
.ob-actions .ob-cta{flex:1;}

.ob-switch{display:flex;align-items:center;gap:12px;margin:4px 2px 16px;font-size:14px;color:#c3cad5;cursor:pointer;user-select:none;}
.ob-switch input{position:absolute;opacity:0;pointer-events:none;}
.ob-switch span{position:relative;flex:0 0 44px;height:26px;border-radius:99px;background:#2a3442;transition:background .2s;}
.ob-switch span::after{content:"";position:absolute;left:3px;top:3px;width:20px;height:20px;border-radius:50%;background:#fff;transition:transform .2s;}
.ob-switch input:checked+span{background:#ff7a3f;}
.ob-switch input:checked+span::after{transform:translateX(18px);}
.ob-switch input:focus-visible+span{outline:2px solid #ff7a3f;outline-offset:2px;}

/* Paso 2 */
.ob-avatar-row{display:flex;align-items:center;gap:14px;padding:12px;border-radius:18px;background:#121821;border:1px solid #1d2531;}
.ob-avatar{flex:0 0 62px;width:62px;height:62px;border-radius:50%;border:2px dashed #3a4556;display:grid;place-items:center;overflow:hidden;color:#8a94a4;font-size:18px;cursor:pointer;background:#161d27;}
.ob-avatar img{width:100%;height:100%;object-fit:cover;}
.ob-avatar-row strong{display:block;font-size:15px;color:#fff;}
.ob-avatar-row small{display:block;margin-top:3px;font-size:12px;color:var(--ob-mute);line-height:1.4;}
.ob-h{margin:22px 2px 3px;font-size:18px;font-weight:800;letter-spacing:-.01em;color:#fff;}
.ob-sub{margin:0 2px 12px;font-size:13px;line-height:1.45;color:var(--ob-mute);}
.ob-pos{margin-bottom:12px;}
.ob-sub-top{margin-top:2px;margin-bottom:16px;}
.ob-car{margin-bottom:18px;}
.ob-car-q{display:flex;align-items:center;gap:10px;margin:0 2px 10px;font-size:16px;font-weight:800;color:#fff;}
.ob-car-q i{display:grid;place-items:center;width:32px;height:32px;border-radius:10px;background:rgba(255,122,63,.13);color:#ff8a57;font-size:14px;}
.ob-car.falta .ob-chip{border-color:rgba(255,90,95,.6);}
.ob-pos-f{display:block;margin:0 2px 7px;font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#96a0af;}
.ob-chips{display:flex;flex-wrap:wrap;gap:8px;}
.ob-chip{flex:0 0 auto;height:40px;padding:0 16px;border-radius:999px;border:1.5px solid #243041;background:#141a23;color:#c3cad5;font:inherit;font-size:14px;font-weight:700;cursor:pointer;transition:all .15s;}
.ob-chip.on{background:rgba(255,122,63,.15);border-color:#ff7a3f;color:#fff;}
.ob-actions+.ob-error,.ob-pos+.ob-error{margin-top:4px;}

/* Paso 3: una pregunta por pantalla */
.ob-quiz-bar{height:6px;margin:2px 0 22px;border-radius:99px;background:#1c2430;overflow:hidden;}
.ob-quiz-bar span{display:block;width:0;height:100%;border-radius:99px;background:linear-gradient(90deg,#ff7a3f,#ff4f6d);transition:width .35s ease;}
.ob-quiz-card{min-height:360px;}
.ob-quiz-ico{display:grid;place-items:center;width:52px;height:52px;border-radius:16px;background:rgba(255,122,63,.13);color:#ff8a57;font-size:21px;}
.ob-quiz-q{margin:16px 0 18px;font-size:24px;line-height:1.18;letter-spacing:-.02em;font-weight:800;color:#fff;}
.ob-quiz-opts{display:flex;flex-direction:column;gap:10px;}
.ob-quiz-opt{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;min-height:58px;padding:14px 16px;border-radius:16px;
  border:1.5px solid #243041;background:#141a23;color:#dde3ea;font:inherit;font-size:15px;font-weight:600;line-height:1.3;text-align:left;cursor:pointer;
  transition:border-color .15s,background .15s,transform .1s;}
.ob-quiz-opt i{flex:0 0 22px;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;font-size:11px;color:transparent;border:1.5px solid #3a4556;transition:all .15s;}
.ob-quiz-opt:hover{border-color:#34404f;}
.ob-quiz-opt:active{transform:scale(.99);}
.ob-quiz-opt.on{border-color:#ff7a3f;background:rgba(255,122,63,.13);color:#fff;}
.ob-quiz-opt.on i{background:#ff7a3f;border-color:#ff7a3f;color:#fff;}
.ob-quiz-atras{display:inline-flex;align-items:center;gap:8px;margin-top:14px;}
.ob-quiz-entra{animation:obQuiz .3s ease both;}
@keyframes obQuiz{from{opacity:0;transform:translateX(22px)}to{opacity:1;transform:none}}

/* Resultado: el nivel y el ajuste de ±0,5 */
.ob-res{display:flex;flex-direction:column;align-items:center;text-align:center;padding:24px 18px 18px;margin-bottom:14px;border-radius:22px;
  background:linear-gradient(160deg,rgba(255,122,63,.2),rgba(255,63,143,.08) 60%,rgba(255,255,255,.02));border:1px solid rgba(255,122,63,.3);}
.ob-res-kicker{font-size:11px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:#ffb08c;}
.ob-res-num{margin:8px 0 2px;font-family:var(--font-display);font-size:84px;line-height:.9;color:#fff;letter-spacing:.02em;}
.ob-res-tramo{font-size:16px;font-weight:800;color:#ff8a57;}
.ob-res-pulso{animation:obPulso .25s ease;}
@keyframes obPulso{50%{transform:scale(1.06)}}
.ob-ajuste-q{margin:20px 0 10px;font-size:14px;font-weight:700;color:#fff;}
.ob-ajuste{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;width:100%;}
.ob-ajuste button{display:flex;flex-direction:column;align-items:center;gap:3px;padding:12px 6px;border-radius:15px;border:1.5px solid #2e3a4a;
  background:rgba(7,9,13,.45);color:#fff;font:inherit;cursor:pointer;transition:border-color .15s,background .15s;}
.ob-ajuste button strong{font-size:17px;font-weight:800;}
.ob-ajuste button small{font-size:11px;color:var(--ob-mute);}
.ob-ajuste button:hover{border-color:#4a5667;}
.ob-ajuste button.on{border-color:#ff7a3f;background:rgba(255,122,63,.16);}
.ob-ajuste button.on small{color:#ffc3a6;}
.ob-res-nota{margin:14px 6px 0;font-size:12px;line-height:1.45;color:#c9b8b0;}
@media (prefers-reduced-motion:reduce){ .ob-quiz-entra,.ob-res-pulso{animation:none;} }

.ob-foot{display:flex;justify-content:center;align-items:center;gap:10px;margin-top:20px;font-size:13px;color:#4f5968;}
.ob-link{border:0;background:none;padding:6px 2px;color:var(--ob-mute);font:inherit;font-size:13px;font-weight:700;cursor:pointer;}
.ob-link:hover{color:#fff;}
.ob-anim{animation:obEntra .28s ease both;}
@keyframes obEntra{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){ .ob-anim{animation:none;} }

@media (min-width:640px){
  .ob{display:flex;align-items:center;justify-content:center;padding:36px 16px;
    background:radial-gradient(circle at 20% 15%,rgba(255,107,44,.14),transparent 26rem),radial-gradient(circle at 85% 80%,rgba(75,163,255,.08),transparent 24rem),var(--ob-bg);}
  .ob-card{width:100%;max-width:450px;min-height:0;border-radius:30px;overflow:hidden;border:1px solid rgba(255,255,255,.08);box-shadow:0 40px 100px rgba(0,0,0,.5);}
  .ob-hero{min-height:230px;}
  .ob-sheet::before{display:none;}
  .ob-sheet{padding:24px 26px 26px;}
}
.colores-equipo{display:flex;flex-direction:column;gap:6px;}
.color-fila{display:flex;gap:6px;align-items:center;}
.color-fila select{flex:1;min-width:0;}
.color-quitar{flex-shrink:0;width:44px;align-self:stretch;border:1px solid var(--line);border-radius:10px;background:var(--pitch-700);color:var(--stone);font-size:18px;line-height:1;cursor:pointer;}
.color-anadir{align-self:flex-start;padding:2px 0;border:0;background:none;color:var(--cone);font:inherit;font-size:13px;font-weight:700;cursor:pointer;}