/* Panel de inicio, whitelist, eventos y pase de temporada */

/* ----- tarjetas del panel ----- */
.d-card { position: relative; background: linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.012)); border-radius: 22px; padding: 22px 24px; display: grid; gap: 14px; align-content: start; box-shadow: inset 0 0 0 1px rgba(255,255,255,.06); min-width: 0; }
.d-card > header { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; }
.d-card h2 { font: 800 30px/1 var(--display); text-transform: uppercase; letter-spacing: .01em; }
.d-acc { display: flex; gap: 8px; flex-wrap: wrap; }
.d-lista { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; }
.d-lista li { padding: 10px 0; border-top: 1px solid var(--line); display: grid; gap: 2px; }
.d-lista li:first-child { border-top: 0; padding-top: 0; }
.d-lista a { display: grid; gap: 2px; text-decoration: none; color: inherit; }
.d-lista b { font-weight: 600; } .d-lista .mut { font-size: 13.5px; }
.av-mini { display: inline-flex; vertical-align: middle; margin-right: 8px; } .av-mini .av { width: 28px; height: 28px; font-size: 13px; }

/* ----- cabecera del panel ----- */
.dash-hero { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 24px; align-items: end; padding: clamp(26px, 4vw, 54px); border-radius: 26px; overflow: hidden; min-height: 240px; background: radial-gradient(120% 140% at 85% -20%, rgba(255,180,60,.16), transparent 55%), linear-gradient(160deg, #101c28, #0a1118 70%); box-shadow: inset 0 0 0 1px rgba(255,255,255,.06); }
.dh-escena { position: absolute; inset: -70px 0 -70px 0; background: radial-gradient(circle at 78% 30%, rgba(255,180,60,.22), transparent 38%), repeating-linear-gradient(90deg, rgba(255,255,255,.025) 0 1px, transparent 1px 90px); pointer-events: none; }
.dh-txt { position: relative; display: grid; gap: 12px; }
.dh-txt h1 { font: 900 clamp(48px, 7vw, 104px)/.88 var(--display); text-transform: uppercase; }
.item.ok-i { color: var(--teal); background: var(--teal-d); } .item.warn-i { color: var(--amber); background: var(--amber-d); text-decoration: none; }
.dh-live { position: relative; background: rgba(8,13,18,.6); backdrop-filter: blur(8px); border-radius: 18px; padding: 16px 20px; display: grid; gap: 8px; min-width: 220px; box-shadow: inset 0 0 0 1px rgba(255,255,255,.07); }
.dh-live .big { font: 800 46px/1 var(--display); font-variant-numeric: tabular-nums; } .dh-live .big small { font-size: 22px; color: var(--mut); }

/* ----- cifras ----- */
.d-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin: 14px 0; }
.d-stat { display: grid; gap: 4px; background: var(--s1); border-radius: 20px; padding: 20px 22px; text-decoration: none; color: inherit; box-shadow: inset 0 0 0 1px rgba(255,255,255,.06); transition: background .25s, box-shadow .25s; }
.d-stat:hover { background: var(--s2); box-shadow: inset 0 0 0 1px rgba(255,180,60,.35); }
.d-stat b { font: 800 clamp(30px, 3.2vw, 46px)/1 var(--display); text-transform: uppercase; font-variant-numeric: tabular-nums; }
.d-stat .mut { font-size: 13.5px; }

/* ----- rejilla ----- */
.d-grid { display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(300px, 1fr); gap: 14px; align-items: start; }
.d-main, .d-side { display: grid; gap: 14px; min-width: 0; }
.d-news { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 12px; }
.d-nw { display: grid; gap: 6px; background: var(--s2); border-radius: 16px; padding: 16px 18px; text-decoration: none; color: inherit; align-content: start; transition: background .25s; }
.d-nw:hover { background: var(--s3); } .d-nw b { font: 800 22px/1.05 var(--display); text-transform: uppercase; }
.d-nivel { display: flex; align-items: baseline; gap: 10px; } .d-nivel b { font: 900 44px/1 var(--display); text-transform: uppercase; color: var(--amber); }

/* ----- eventos ----- */
.ev-lista { display: grid; gap: 12px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 420px), 1fr)); }
.ev { display: grid; grid-template-columns: 68px minmax(0, 1fr); gap: 16px; align-items: center; background: var(--s2); border-radius: 18px; padding: 14px 18px 14px 14px; text-decoration: none; color: inherit; transition: background .25s; }
.ev:hover { background: var(--s3); }
.ev-fecha { display: grid; place-items: center; align-content: center; height: 68px; border-radius: 16px; background: var(--amber-d); color: var(--amber); }
.ev-fecha b { font: 900 30px/1 var(--display); } .ev-fecha span { font: 700 12px var(--body); letter-spacing: .12em; }
.ev-cuerpo { display: grid; gap: 3px; min-width: 0; } .ev-cuerpo > b { font: 800 24px/1.05 var(--display); text-transform: uppercase; }
.ev-meta { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; font-size: 13px; color: var(--mut); }
.ev-det { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(280px, 1fr); gap: 24px; align-items: start; }

/* ----- whitelist ----- */
.gate { max-width: 820px; margin: 4vh auto 0; display: grid; gap: 14px; }
.pasos { list-style: none; padding: 0; margin: 12px 0 0; display: grid; gap: 12px; }
.pasos li { display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 16px; background: var(--s1); border-radius: 18px; padding: 18px 20px; box-shadow: inset 0 0 0 1px rgba(255,255,255,.06); opacity: .7; }
.pasos li > div { display: grid; gap: 8px; justify-items: start; }
.pasos li.actual { opacity: 1; box-shadow: inset 0 0 0 1px rgba(255,180,60,.5); background: var(--s2); }
.pasos li.hecho { opacity: 1; } .pasos li.hecho .n { background: var(--teal-d); color: var(--teal); }
.pasos .n { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 14px; background: var(--s4); font: 800 22px var(--display); }
.pasos li.actual .n { background: var(--amber); color: #1a1205; }

/* ----- pase de temporada ----- */
.pase-cab { display: flex; gap: 28px; align-items: center; flex-wrap: wrap; }
.pista { margin-top: 14px; background: var(--s1); border-radius: 22px; padding: 18px 20px 20px; box-shadow: inset 0 0 0 1px rgba(255,255,255,.06); --pc: var(--teal); }
.pista-bronce { --pc: #d18a5b; } .pista-plata { --pc: #b9c3cc; } .pista-oro { --pc: var(--amber); } .pista-gratis { --pc: var(--teal); }
.pista > header { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 12px; margin-bottom: 14px; } .pista > header .tag { white-space: nowrap; } .pista > header form { margin-left: auto; }
.pista h2 { font: 900 34px/1 var(--display); text-transform: uppercase; color: var(--pc); }
.pista.cerrada { opacity: .72; }
.pista-fila { display: flex; gap: 10px; overflow-x: auto; padding-bottom: 8px; scroll-snap-type: x proximity; }
.nv { flex: 0 0 132px; scroll-snap-align: start; display: grid; gap: 4px; align-content: start; background: var(--s2); border-radius: 16px; padding: 12px 14px; min-height: 124px; position: relative; box-shadow: inset 0 3px 0 transparent; }
.nv-n { font: 900 26px/1 var(--display); color: var(--dim); } .nv b { font-weight: 600; font-size: 14px; line-height: 1.25; }
.nv-e { font-size: 12px; font-weight: 600; margin-top: auto; }
.nv.lista { background: var(--s3); box-shadow: inset 0 3px 0 var(--pc); } .nv.lista .nv-n { color: var(--pc); } .nv.lista .nv-e { color: var(--pc); }
.nv.reclamada { opacity: .6; } .nv.reclamada .nv-e { color: var(--teal); }
.pistas-vacias { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 14px; }
.pistas-vacias .d-card h2 { color: var(--pc); font-size: 44px; }

/* ----- adaptacion ----- */
@media (max-width: 1100px) { .d-grid, .ev-det { grid-template-columns: 1fr; } .d-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 680px) {
  .dash-hero { grid-template-columns: 1fr; min-height: 0; } .dh-live { min-width: 0; }
  .d-stats { gap: 10px; } .d-stat { padding: 16px; } .d-card { padding: 18px; border-radius: 18px; }
  .ev { grid-template-columns: 58px minmax(0, 1fr); } .ev-fecha { height: 58px; }
  .nv { flex-basis: 116px; }
}

/* ----- menu de usuario ----- */
.menu-u { position: relative; flex: none; }
.menu-u > summary { list-style: none; cursor: pointer; display: flex; align-items: center; gap: 10px; background: var(--s2); border-radius: 99px; padding: 4px 14px 4px 4px; font-weight: 600; font-size: 14px; user-select: none; }
.menu-u > summary::-webkit-details-marker { display: none; }
.menu-u > summary:hover, .menu-u[open] > summary { background: var(--s3); }
.menu-u .av { width: 32px; height: 32px; font-size: 14px; }
.mu-n { max-width: 14ch; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mu-panel { position: absolute; right: 0; top: calc(100% + 8px); z-index: 20; min-width: 220px; background: var(--s2); border-radius: 16px; padding: 8px; display: grid; gap: 2px; box-shadow: 0 18px 50px rgba(0,0,0,.55), inset 0 0 0 1px rgba(255,255,255,.08); }
.mu-panel a { padding: 10px 14px; border-radius: 10px; color: var(--ink); text-decoration: none; font-weight: 500; font-size: 14.5px; }
.mu-panel a:hover { background: var(--s3); } .mu-panel .mu-adm { color: var(--amber); }
.mu-panel form { border-top: 1px solid var(--line); margin-top: 6px; padding-top: 6px; }
.mu-salir { width: 100%; text-align: left; background: transparent; border: 0; color: #ffb4a8; font: 600 14.5px var(--body); padding: 10px 14px; border-radius: 10px; cursor: pointer; }
.mu-salir:hover { background: var(--coral-d); color: #ffd2c9; }
.mu-salir.solo { width: auto; background: var(--s2); color: var(--ink); padding: 9px 18px; border-radius: 99px; }
@media (max-width: 680px) { .mu-n { display: none; } .menu-u > summary { padding-right: 10px; } .mu-panel { position: fixed; right: 16px; top: 64px; } }

/* ----- barra superior: el menu de usuario nunca queda oculto ----- */
.nl { display: flex; align-items: center; gap: 6px; min-width: 0; overflow-x: auto; scrollbar-width: none; }
.nl::-webkit-scrollbar { display: none; }
.nl a { flex: none; }
@media (min-width: 681px) { .nav { overflow: visible; } }
@media (max-width: 680px) {
  .nav { flex-wrap: wrap; overflow: visible; -webkit-mask-image: none; mask-image: none; row-gap: 10px; }
  .nav .sp { display: block; flex: 1; }
  .nl { order: 5; width: 100%; -webkit-mask-image: linear-gradient(90deg, #000 90%, transparent); mask-image: linear-gradient(90deg, #000 90%, transparent); }
}

/* ----- tienda: dos caminos ----- */
.tienda-guia { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin-bottom: 8px; }
.tienda-guia .d-card b { font: 800 26px/1.05 var(--display); text-transform: uppercase; }
@media (max-width: 680px) { .tienda-guia { grid-template-columns: 1fr; } }

/* ===== Pulido, ronda 2 ===== */
/* profundidad en las paginas interiores: el skyline del puerto, muy atenuado, detras del titulo */
main.pagebody { position: relative; }
main.pagebody::before { content: ""; position: absolute; left: 50%; width: 100vw; transform: translateX(-50%); top: -40px; height: 380px; z-index: -1; pointer-events: none;
  background: url(/static/img/escena.svg) center 78% / cover no-repeat; opacity: .2; -webkit-mask-image: linear-gradient(180deg, #000 20%, transparent); mask-image: linear-gradient(180deg, #000 20%, transparent); }
/* rotulos sobrios: sin mayusculas diminutas con tracking */
.k, .wiki .cat, .pass dt { text-transform: none; letter-spacing: .01em; font-size: 13px; font-weight: 600; }
table.t th, table.hist th, .th.head { text-transform: none; letter-spacing: .01em; font-size: 13px; }
.cap { font-size: 17px; max-width: 64ch; }
.vip-t { font-size: clamp(34px, 3.6vw, 52px); }
/* tienda */
.products { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.prod.ancho { grid-column: span 2; }
.prod .art { height: 170px; background: var(--s1); }
.prod .art, .order .art { object-fit: cover; }
@media (max-width: 1000px) { .prod.ancho { grid-column: span 2; } }
@media (max-width: 680px) { .products { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; } .prod .art { height: 96px; } .prod .info { padding: 12px 14px 16px; } .prod .info b { font-size: 22px; } .prod .row { flex-direction: column; align-items: flex-start; } .prod.ancho { grid-column: span 2; } }
/* eventos */
.ev-lista { grid-template-columns: repeat(auto-fit, minmax(min(100%, 380px), 1fr)); }
/* pase: nivel actual, fundido en el borde, sin aro */
.pista { box-shadow: none; }
.pista-fila { -webkit-mask-image: linear-gradient(90deg, #000 94%, transparent); mask-image: linear-gradient(90deg, #000 94%, transparent); padding-right: 40px; }
.nv .aqui { position: absolute; top: -9px; left: 12px; background: var(--pc); color: #14110b; font: 800 11px var(--body); letter-spacing: .04em; padding: 3px 10px; border-radius: 99px; }
.nv.actual { background: var(--s4); box-shadow: inset 0 3px 0 var(--pc), 0 0 0 1px var(--pc); }
/* inicio: lo importante, mas grande */
.d-stats { grid-template-columns: 1.4fr 1.4fr 1fr 1fr; }
.d-stat:nth-child(-n+2) b { font-size: clamp(40px, 4.6vw, 68px); }
/* whitelist en dos columnas */
.gate { max-width: 1240px; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 1100px) { .gate { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 40px; align-items: start; } }
.gate-col { display: grid; gap: 14px; min-width: 0; align-content: start; }
.gate-col.prose { max-width: none; }
.gate-col.prose h2 { font-size: 34px; }
.pasos li:not(.hecho):not(.actual) { opacity: .85; }
/* admin movil: la tabla-tarjeta conserva sus rotulos */
@media (max-width: 680px) {
  table.hist td[data-etq]::before, table.t td[data-etq]::before { content: attr(data-etq); display: block; font-size: 12px; color: var(--dim); font-weight: 600; margin-bottom: 1px; }
  .hero::after { background: linear-gradient(0deg, rgba(7,11,16,.94) 0%, rgba(7,11,16,.6) 60%, rgba(7,11,16,.2)); }
}

/* ----- ajustes de la ronda 2 ----- */
.pista-fila { padding-top: 14px; }
@media (min-width: 681px) {
  .nav { flex-wrap: nowrap; }
  .nl { flex: 1 1 0; min-width: 0; }
  .nav .sp { display: none; }
  .nav .menu-u, .nav .chip { flex: none; }
}

/* Etiquetas de rol (Owner, dev, staff) */
.mu-rol{font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:2px 7px;border-radius:999px;background:var(--amber,#ffb43c);color:#1a1205}
.rol-et{border-color:var(--amber,#ffb43c);color:var(--amber,#ffb43c);font-weight:700;text-transform:uppercase;letter-spacing:.06em}


/* Soporte: tickets */
.tk-e{display:inline-block;font-size:11px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;padding:4px 10px;border-radius:99px;background:var(--s2);color:#9fb0ba}
.tk-abierto{background:var(--amber-d);color:var(--amber)}.tk-en_curso{background:rgba(90,160,255,.15);color:#7fb4ff}
.tk-esperando{background:rgba(160,120,255,.15);color:#b79cff}.tk-resuelto{background:rgba(45,212,191,.14);color:#2dd4bf}
.tk-p{font-size:12px;font-weight:700}.tk-p-urgente{color:#ff7a7a}.tk-p-alta{color:var(--amber)}.tk-p-baja{color:#8a99a3}
.tk-hilo{list-style:none;margin:0 0 18px;padding:0;display:grid;gap:10px;max-width:760px}
.tk-m{background:var(--s1,#111a22);border:1px solid var(--s3,#26303a);border-radius:14px;padding:12px 16px}
.tk-m p{margin:6px 0 0;white-space:pre-wrap;overflow-wrap:anywhere;color:#d5dcdf}
.tk-mh{display:flex;gap:10px;align-items:center;flex-wrap:wrap;font-size:13px}.tk-mh .mut{margin-left:auto}
.tk-jugador{border-left:3px solid #5b6b76}.tk-staff{border-left:3px solid var(--teal,#2dd4bf)}.tk-kato{border-left:3px solid var(--amber)}
.tk-sistema{background:transparent;border-style:dashed;padding:8px 14px}.tk-sistema p{color:#8a99a3;margin:2px 0 0;font-size:13px}
.tk-interno{background:rgba(255,180,60,.06);border-color:rgba(255,180,60,.35)}
.tk-nota{font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:2px 8px;border-radius:99px;background:var(--s2);color:#9fb0ba}

/* ----- temporada diaria: tira de días, misiones, premios ----- */
.dp-racha { display: grid; gap: 2px; padding: 12px 16px; border-radius: 16px; background: var(--s2); min-width: 150px; }
.dp-racha b { font: 900 28px/1 var(--display); text-transform: uppercase; } .dp-racha.ok b { color: var(--teal); } .dp-racha.rota b { color: #c9786b; }
.dp-tira { display: grid; grid-template-columns: repeat(10, minmax(0, 1fr)); gap: 8px; margin-top: 8px; }
.dp-dia { position: relative; display: grid; place-items: center; aspect-ratio: 1 / 0.86; border-radius: 14px; background: var(--s2); color: var(--dim); text-decoration: none; box-shadow: inset 0 0 0 1px rgba(255,255,255,.05); transition: transform .15s; }
.dp-dia:hover { transform: translateY(-2px); }
.dp-dia i { position: absolute; top: 6px; left: 9px; font: 700 12px var(--body); font-style: normal; opacity: .8; }
.dp-dia span { font: 800 20px var(--display); margin-top: 8px; }
.dp-completado { background: rgba(52, 205, 184, .16); color: var(--teal); box-shadow: inset 0 0 0 1px rgba(52, 205, 184, .45); }
.dp-excusado { background: rgba(108, 178, 255, .13); color: #6cb2ff; box-shadow: inset 0 0 0 1px rgba(108, 178, 255, .4); }
.dp-perdido { background: rgba(201, 120, 107, .13); color: #c9786b; box-shadow: inset 0 0 0 1px rgba(201, 120, 107, .4); }
.dp-anterior { opacity: .45; } .dp-futuro { opacity: .7; }
.dp-hoy { background: var(--s4); color: var(--amber); box-shadow: inset 0 0 0 2px var(--amber); }
.dp-sel { outline: 2px solid var(--text, #fff); outline-offset: 2px; }
.dp-leyenda { display: flex; flex-wrap: wrap; gap: 6px 16px; margin-top: 10px; font-size: 12px; color: var(--mut); }
.dp-c::before { content: ''; display: inline-block; width: 10px; height: 10px; border-radius: 3px; margin-right: 6px; background: var(--dim); }
.dp-c.completado::before { background: var(--teal); } .dp-c.hoy::before { background: var(--amber); } .dp-c.excusado::before { background: #6cb2ff; } .dp-c.perdido::before { background: #c9786b; }
.dp-mis { display: grid; gap: 10px; }
.dp-m { display: grid; grid-template-columns: 40px 1fr auto; gap: 12px; align-items: center; padding: 12px 14px; border-radius: 16px; background: var(--s2); }
.dp-m b { display: block; } .dp-m .mut { display: block; font-size: 13px; }
.dp-m.hecha { box-shadow: inset 0 0 0 1px rgba(52, 205, 184, .45); }
.dp-n { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 12px; background: var(--s4); font: 800 18px var(--display); }
.dp-barra { display: block; height: 6px; border-radius: 4px; background: var(--s4); margin-top: 6px; overflow: hidden; } .dp-barra i { display: block; height: 100%; background: var(--teal); }
.dp-pistas { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 12px; margin-top: 8px; }
.dp-p { margin-top: 0; display: grid; gap: 6px; align-content: start; padding: 16px 18px; }
.dp-p header { margin-bottom: 4px; } .dp-p h2 { font-size: 26px; }
.dp-premio { font-size: 17px; line-height: 1.25; overflow-wrap: anywhere; }
.dp-p .tag, .dp-p .btn { justify-self: start; } .dp-p form { margin: 0; }
@media (max-width: 720px) { .dp-tira { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 6px; } .dp-m { grid-template-columns: 34px 1fr; } .dp-m .tag { grid-column: 2; justify-self: start; } }

.ev-poster { display: none; }