/* WorldPirate · estilos de la web (acceso y panel del capitán) */
:root {
  --noche: #07131d;
  --abismo: #0c2233;
  --mar: #12465a;
  --turquesa: #1fb5a8;
  --oro: #e9b949;
  --oro-claro: #ffd97a;
  --pergamino: #f4e6c4;
  --sangre: #c2362b;
  --brasa: #ff6b3d;
  --texto: #eef3f6;
  --texto-suave: #9fb4c2;
  --cristal: rgba(9, 28, 42, 0.72);
  --borde: rgba(233, 185, 73, 0.28);
  --sombra: 0 20px 60px rgba(0, 0, 0, 0.55);
  --radio: 18px;
  --display: "Pirata One", "Georgia", serif;
  --ui: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; }
body {
  font-family: var(--ui);
  color: var(--texto);
  background: var(--noche);
  -webkit-font-smoothing: antialiased;
}
a { color: var(--oro-claro); }
button, input { font: inherit; }

/* Fondo: mar nocturno con niebla dorada */
.fondo {
  position: fixed; inset: 0; z-index: -2;
  background:
    radial-gradient(1200px 600px at 75% 15%, rgba(255, 190, 90, 0.18), transparent 60%),
    radial-gradient(900px 500px at 10% 90%, rgba(31, 181, 168, 0.16), transparent 60%),
    linear-gradient(180deg, rgba(7, 19, 29, 0.55), rgba(7, 19, 29, 0.95)),
    url("/web/img/mar.jpg") center / cover no-repeat;
}
.olas { position: fixed; left: 0; right: 0; bottom: 0; height: 180px; z-index: -1; pointer-events: none; opacity: 0.55; }
.olas path { animation: ola 9s ease-in-out infinite alternate; }
.olas path:nth-child(2) { animation-duration: 12s; opacity: 0.6; }
.olas path:nth-child(3) { animation-duration: 15s; opacity: 0.35; }
@keyframes ola { from { transform: translateX(-40px); } to { transform: translateX(40px); } }

/* Marca */
.marca { display: flex; align-items: center; gap: 12px; text-decoration: none; color: inherit; }
.marca svg { width: 42px; height: 42px; filter: drop-shadow(0 4px 10px rgba(233, 185, 73, 0.4)); }
.marca b { font-family: var(--display); font-size: 30px; font-weight: 400; letter-spacing: 0.5px;
           background: linear-gradient(180deg, var(--oro-claro), var(--oro) 60%, #b07d1c);
           -webkit-background-clip: text; background-clip: text; color: transparent; }

/* ---------- Acceso ---------- */
.acceso { min-height: 100vh; display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(340px, 440px); align-items: center;
          gap: clamp(28px, 4vw, 64px); padding: 48px clamp(20px, 5vw, 64px); max-width: 1180px; margin: 0 auto; }
.acceso .tarjeta { position: relative; }
.acceso .tarjeta::before { content: ""; position: absolute; inset: -1px; border-radius: inherit; pointer-events: none;
                           background: linear-gradient(140deg, rgba(255, 217, 122, 0.55), transparent 35%, transparent 65%, rgba(31, 181, 168, 0.45));
                           -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor;
                           mask-composite: exclude; padding: 1px; }
.acceso .tarjeta h2 { font-family: var(--display); font-weight: 400; font-size: 34px; margin: 0 0 6px; }
.acceso .tarjeta .sub { color: var(--texto-suave); margin: 0 0 22px; font-size: 14px; }
.relato h1 { font-family: var(--display); font-weight: 400; font-size: clamp(54px, 8vw, 104px); line-height: 0.95;
             margin: 28px 0 14px; text-shadow: 0 6px 30px rgba(0, 0, 0, 0.6); }
.relato h1 span { color: var(--oro); }
.relato p.lema { font-size: clamp(16px, 1.6vw, 19px); color: var(--texto-suave); max-width: 520px; line-height: 1.6; }
.navio { width: min(560px, 100%); margin-top: 26px; border-radius: 22px; overflow: hidden; box-shadow: var(--sombra);
         border: 1px solid var(--borde); animation: mecer 6s ease-in-out infinite; }
.navio img { display: block; width: 100%; }
@keyframes mecer { 0%, 100% { transform: translateY(0) rotate(-0.6deg); } 50% { transform: translateY(-10px) rotate(0.6deg); } }
.rasgos { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 22px; }
.rasgos span { padding: 7px 14px; border-radius: 999px; background: rgba(233, 185, 73, 0.1); border: 1px solid var(--borde);
               font-size: 13px; color: var(--pergamino); }

.tarjeta { background: var(--cristal); backdrop-filter: blur(16px) saturate(140%); -webkit-backdrop-filter: blur(16px) saturate(140%);
           border: 1px solid var(--borde); border-radius: var(--radio); box-shadow: var(--sombra); }
.acceso .tarjeta { padding: 34px; max-width: 440px; width: 100%; justify-self: end; }
.pestanas { display: grid; grid-template-columns: 1fr 1fr; background: rgba(0, 0, 0, 0.3); border-radius: 12px; padding: 4px; margin-bottom: 26px; }
.pestanas button { border: 0; background: transparent; color: var(--texto-suave); padding: 11px; border-radius: 9px; cursor: pointer; font-weight: 600; }
.pestanas button[aria-selected="true"] { background: linear-gradient(180deg, var(--oro-claro), var(--oro)); color: #2a1a05; box-shadow: 0 4px 14px rgba(233, 185, 73, 0.35); }
.campo { display: block; margin-bottom: 16px; }
.campo span { display: block; font-size: 13px; color: var(--texto-suave); margin-bottom: 7px; font-weight: 500; }
.campo input { width: 100%; padding: 13px 15px; border-radius: 11px; border: 1px solid rgba(255, 255, 255, 0.12);
               background: rgba(3, 12, 19, 0.6); color: var(--texto); outline: none; transition: border-color .2s, box-shadow .2s; }
.campo input:focus { border-color: var(--oro); box-shadow: 0 0 0 4px rgba(233, 185, 73, 0.18); }
.boton { display: inline-flex; align-items: center; justify-content: center; gap: 10px; width: 100%; padding: 14px 18px;
         border: 0; border-radius: 12px; cursor: pointer; font-weight: 700; letter-spacing: 0.3px; color: #fff;
         background: linear-gradient(180deg, var(--brasa), var(--sangre)); box-shadow: 0 10px 26px rgba(194, 54, 43, 0.45);
         transition: transform .15s, box-shadow .15s, filter .15s; text-decoration: none; }
.boton:hover { transform: translateY(-2px); filter: brightness(1.06); box-shadow: 0 14px 30px rgba(194, 54, 43, 0.55); }
.boton:disabled { opacity: 0.6; cursor: progress; transform: none; }
.aviso { min-height: 22px; margin: 14px 0 0; font-size: 14px; color: #ffb4a8; }
.nota { font-size: 12.5px; color: var(--texto-suave); margin-top: 18px; line-height: 1.5; }

/* ---------- Panel ---------- */
.barra { position: sticky; top: 0; z-index: 10; display: flex; align-items: center; justify-content: space-between; gap: 16px;
         padding: 14px clamp(16px, 4vw, 48px); background: rgba(7, 19, 29, 0.78); backdrop-filter: blur(12px);
         border-bottom: 1px solid rgba(233, 185, 73, 0.15); }
.barra .quien { display: flex; align-items: center; gap: 12px; }
.sello { font-size: 11px; font-weight: 800; letter-spacing: 1px; padding: 5px 9px; border-radius: 6px;
         background: linear-gradient(180deg, var(--brasa), var(--sangre)); color: #fff; }
.salir { background: transparent; border: 1px solid var(--borde); color: var(--pergamino); padding: 8px 14px; border-radius: 10px; cursor: pointer; }
.salir:hover { border-color: var(--oro); }

.panel { display: grid; grid-template-columns: repeat(12, 1fr); gap: 22px; padding: 28px clamp(16px, 4vw, 48px) 120px; max-width: 1440px; margin: 0 auto; }
.panel > * { min-width: 0; }
.nave { grid-column: span 8; position: relative; overflow: hidden; padding: 30px; min-height: 420px; }
.nave .arte { position: absolute; inset: 0; background-size: cover; background-position: center; opacity: 0.32; filter: saturate(1.2);
              mask-image: linear-gradient(90deg, transparent, #000 55%); -webkit-mask-image: linear-gradient(90deg, transparent, #000 55%); }
.nave .contenido { position: relative; display: grid; grid-template-columns: 1fr 1fr; gap: 20px; align-items: center; height: 100%; }
.etiqueta { font-size: 12px; text-transform: uppercase; letter-spacing: 2px; color: var(--oro); font-weight: 700; }
.nave h2 { font-family: var(--display); font-weight: 400; font-size: clamp(40px, 5vw, 64px); line-height: 1; margin: 8px 0 18px;
           text-shadow: 0 4px 24px rgba(0, 0, 0, 0.7); }
.giro { position: relative; aspect-ratio: 1; width: 100%; max-width: 440px; justify-self: center; }
.giro canvas { width: 100%; height: 100%; }
.giro::before { content: ""; position: absolute; inset: 12% 8% 6%; border-radius: 50%;
                background: radial-gradient(closest-side, rgba(255, 200, 100, 0.35), rgba(31, 181, 168, 0.12) 60%, transparent);
                filter: blur(6px); animation: latir 3.6s ease-in-out infinite; }
@keyframes latir { 50% { transform: scale(1.06); opacity: 0.8; } }
.medidas { display: grid; gap: 11px; }
.medida { display: grid; grid-template-columns: 112px 1fr 64px; align-items: center; gap: 10px; font-size: 13px; }
.medida span { color: var(--texto-suave); }
.medida b { text-align: right; font-variant-numeric: tabular-nums; }
.tubo { height: 8px; border-radius: 99px; background: rgba(255, 255, 255, 0.08); overflow: hidden; }
.tubo i { display: block; height: 100%; width: 0; border-radius: inherit; background: linear-gradient(90deg, var(--turquesa), var(--oro));
          transition: width 1.2s cubic-bezier(.2, .8, .2, 1); }

.capitan { grid-column: span 4; padding: 28px; display: flex; flex-direction: column; gap: 22px; }
.anillo { display: flex; align-items: center; gap: 18px; }
.anillo svg { width: 96px; height: 96px; transform: rotate(-90deg); }
.anillo circle { fill: none; stroke-width: 9; }
.anillo .fondo-anillo { stroke: rgba(255, 255, 255, 0.08); }
.anillo .progreso { stroke: url(#grad-oro); stroke-linecap: round; transition: stroke-dashoffset 1.4s cubic-bezier(.2, .8, .2, 1); }
.anillo .nivel { position: relative; }
.anillo .nivel strong { position: absolute; inset: 0; display: grid; place-items: center; font-family: var(--display); font-size: 34px; transform: none; }
.capitan h3 { margin: 0 0 4px; font-size: 22px; }
.capitan small { color: var(--texto-suave); }
.monedas { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.moneda { background: rgba(0, 0, 0, 0.25); border: 1px solid rgba(255, 255, 255, 0.06); border-radius: 13px; padding: 12px; text-align: center; }
.moneda .icono { font-size: 20px; }
.moneda b { display: block; font-size: 17px; margin-top: 4px; font-variant-numeric: tabular-nums; }
.moneda small { font-size: 11px; }
.datos { display: grid; gap: 9px; font-size: 14px; }
.datos div { display: flex; justify-content: space-between; border-bottom: 1px dashed rgba(255, 255, 255, 0.08); padding-bottom: 8px; }
.datos span { color: var(--texto-suave); }

.entrada { grid-column: span 6; position: relative; overflow: hidden; padding: 30px; display: flex; flex-direction: column; gap: 14px;
           text-decoration: none; color: inherit; transition: transform .2s, border-color .2s; min-height: 220px; }
.entrada:hover { transform: translateY(-4px); border-color: var(--oro); }
.entrada .icono-grande { width: 58px; height: 58px; border-radius: 16px; display: grid; place-items: center;
                         background: linear-gradient(180deg, rgba(233, 185, 73, 0.25), rgba(233, 185, 73, 0.06)); border: 1px solid var(--borde); }
.entrada .icono-grande svg { width: 30px; height: 30px; stroke: var(--oro-claro); fill: none; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.entrada h3 { font-family: var(--display); font-weight: 400; font-size: 36px; margin: 0; }
.entrada p { color: var(--texto-suave); margin: 0; line-height: 1.55; max-width: 460px; }
.entrada .ir { margin-top: auto; display: inline-flex; align-items: center; gap: 8px; font-weight: 700; color: var(--oro-claro); }
.entrada.movil .icono-grande { background: linear-gradient(180deg, rgba(31, 181, 168, 0.3), rgba(31, 181, 168, 0.06)); border-color: rgba(31, 181, 168, 0.4); }
.entrada.movil .icono-grande svg { stroke: #7ff5e8; }
.entrada.movil .ir { color: #7ff5e8; }
.entrada .brillo { position: absolute; right: -60px; top: -60px; width: 220px; height: 220px; border-radius: 50%;
                   background: radial-gradient(closest-side, rgba(233, 185, 73, 0.22), transparent); }
.entrada.movil .brillo { background: radial-gradient(closest-side, rgba(31, 181, 168, 0.22), transparent); }

.flota { grid-column: span 12; padding: 24px 28px; }
.flota h3, .admin h3 { margin: 0 0 16px; font-size: 18px; }
.naves { display: flex; gap: 14px; overflow-x: auto; padding-bottom: 6px; scroll-snap-type: x mandatory; }
.ficha { flex: 0 0 210px; scroll-snap-align: start; border-radius: 14px; overflow: hidden; background: rgba(0, 0, 0, 0.3);
         border: 1px solid rgba(255, 255, 255, 0.07); }
.ficha.activa { border-color: var(--oro); box-shadow: 0 0 0 3px rgba(233, 185, 73, 0.2); }
.ficha img { display: block; width: 100%; aspect-ratio: 440 / 170; object-fit: cover; background: var(--abismo); }
.ficha div { padding: 10px 12px; font-size: 14px; display: flex; justify-content: space-between; gap: 8px; }
.ficha em { font-style: normal; font-size: 11px; color: var(--oro); }

.admin { grid-column: span 12; padding: 24px 28px; border-color: rgba(255, 107, 61, 0.35); }
.admin .cifras { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px; }
.admin .cifras div { background: rgba(0, 0, 0, 0.28); border-radius: 12px; padding: 14px; }
.admin .cifras b { display: block; font-size: 24px; margin-top: 4px; }
.admin code { background: rgba(0, 0, 0, 0.4); padding: 2px 6px; border-radius: 6px; font-size: 12.5px; }

.pie { text-align: center; color: var(--texto-suave); font-size: 13px; padding: 30px 16px 40px; }
.pie a { text-decoration: none; }

.cargando { opacity: 0; transform: translateY(14px); }
.visible { opacity: 1; transform: none; transition: opacity .6s ease, transform .6s ease; }

@media (max-width: 1060px) {
  .acceso { grid-template-columns: 1fr; }
  .nave, .capitan { grid-column: span 12; }
  .entrada { grid-column: span 12; }
}
@media (max-width: 640px) {
  .nave .contenido { grid-template-columns: 1fr; }
  .medida { grid-template-columns: 96px 1fr 56px; }
  .relato h1 { margin-top: 18px; }
  .acceso .tarjeta { padding: 24px; }
}
@media (max-width: 1060px) { .acceso .tarjeta { justify-self: center; } }

/* ---------- Acceso del panel de administración (separado del de jugadores) ---------- */
.fondo-admin { background:
  radial-gradient(900px 500px at 50% 0%, rgba(76, 201, 240, 0.14), transparent 60%),
  radial-gradient(700px 400px at 50% 100%, rgba(194, 54, 43, 0.16), transparent 60%),
  linear-gradient(180deg, #050b11, #08131c); }
.acceso-admin { min-height: 100vh; display: grid; place-items: center; padding: 32px 16px; }
.acceso-admin .tarjeta { width: min(420px, 100%); padding: 34px; text-align: left; border-color: rgba(76, 201, 240, 0.3); }
.acceso-admin h1 { font-family: var(--display); font-weight: 400; font-size: 40px; margin: 6px 0 6px; }
.acceso-admin .sub { color: var(--texto-suave); font-size: 14px; margin: 0 0 22px; line-height: 1.5; }
.candado { width: 58px; height: 58px; border-radius: 16px; display: grid; place-items: center; margin-top: 22px;
           background: rgba(76, 201, 240, 0.1); border: 1px solid rgba(76, 201, 240, 0.4); }
.candado svg { width: 28px; height: 28px; fill: none; stroke: #8fdcf5; stroke-width: 1.8; stroke-linecap: round; }
.boton-admin { background: linear-gradient(180deg, #4cc9f0, #1f7fa8); box-shadow: 0 10px 26px rgba(76, 201, 240, 0.3); color: #04121b; }
.chapa-juego { font-size: 11px; font-weight: 800; letter-spacing: 1px; padding: 5px 9px; border-radius: 6px;
               background: linear-gradient(180deg, var(--oro-claro), var(--oro)); color: #2a1a05; }

/* ---------- Canjear código (panel) ---------- */
.canje { grid-column: span 12; padding: 22px 28px; display: flex; align-items: center; gap: 18px; flex-wrap: wrap; }
.canje h3 { margin: 0; font-size: 18px; flex: 1 1 200px; }
.canje form { display: flex; gap: 10px; flex: 2 1 380px; }
.canje input { flex: 1; padding: 12px 14px; border-radius: 11px; border: 1px solid rgba(255, 255, 255, 0.12); background: rgba(3, 12, 19, 0.6);
               color: var(--texto); text-transform: uppercase; letter-spacing: 1px; }
.canje .aviso { flex-basis: 100%; margin: 0; color: var(--oro-claro); }
.boton-corto { width: auto; padding: 11px 18px; }
.boton.peligro, button.peligro { background: linear-gradient(180deg, #e2453a, #8f1d14) !important; color: #fff !important; }
.enlace-admin { color: var(--oro-claro); text-decoration: none; border: 1px solid var(--borde); padding: 8px 12px; border-radius: 10px; }

/* ---------- Sala del almirante ---------- */
.admin-pagina { max-width: 1440px; margin: 0 auto; padding: 26px clamp(16px, 4vw, 48px) 120px; display: grid; gap: 20px; }
.admin-cabecera { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; flex-wrap: wrap; }
.admin-cabecera h1 { font-family: var(--display); font-weight: 400; font-size: clamp(38px, 4vw, 54px); margin: 4px 0 0; }
.anuncio { display: flex; gap: 10px; flex: 1 1 420px; max-width: 640px; }
.anuncio input { flex: 1; }
.admin-pagina input, .admin-pagina select { padding: 11px 13px; border-radius: 10px; border: 1px solid rgba(255, 255, 255, 0.12);
                                            background: rgba(3, 12, 19, 0.65); color: var(--texto); min-width: 0; }
.admin-pagina input:focus, .admin-pagina select:focus { outline: none; border-color: #4cc9f0; box-shadow: 0 0 0 3px rgba(76, 201, 240, 0.18); }
.resumen { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 14px; }
.cifra { padding: 16px 18px; display: grid; grid-template-columns: auto 1fr; column-gap: 12px; align-items: center; }
.cifra span { grid-row: span 2; font-size: 26px; }
.cifra small { color: var(--texto-suave); font-size: 12px; }
.cifra b { font-size: 18px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tabs { display: flex; gap: 10px; flex-wrap: wrap; padding: 10px; background: rgba(5, 14, 22, 0.75); border-radius: 14px;
        border: 1px solid rgba(255, 255, 255, 0.06); }
.tabs button { background: #0b1a26; color: #e6eef3; border: 1px solid rgba(255, 255, 255, 0.08); padding: 11px 18px;
               border-radius: 10px; font-weight: 700; cursor: pointer; transition: border-color .15s, color .15s, background .15s; }
.tabs button:hover { border-color: rgba(76, 201, 240, 0.5); }
.tabs button[aria-selected="true"] { color: #4cc9f0; border-color: #4cc9f0; background: rgba(76, 201, 240, 0.08);
                                     box-shadow: 0 0 18px rgba(76, 201, 240, 0.18); }
.hoja { padding: 18px 20px; }
.hoja-barra { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.hoja-barra input { flex: 0 1 340px; }
.pista { color: var(--texto-suave); font-size: 12.5px; }
.tabla-envoltura { overflow-x: auto; }
.tabla { width: 100%; border-collapse: collapse; font-size: 14px; }
.tabla th { text-align: left; font-size: 11.5px; text-transform: uppercase; letter-spacing: 1px; color: var(--texto-suave);
            padding: 10px 12px; border-bottom: 1px solid rgba(255, 255, 255, 0.08); white-space: nowrap; }
.tabla td { padding: 11px 12px; border-bottom: 1px solid rgba(255, 255, 255, 0.05); vertical-align: middle; }
.tabla tbody tr:hover { background: rgba(255, 255, 255, 0.03); }
.tabla .vacio { text-align: center; color: var(--texto-suave); padding: 26px; }
.acciones { white-space: nowrap; text-align: right; }
.acciones button { background: rgba(255, 255, 255, 0.05); border: 1px solid rgba(255, 255, 255, 0.12); color: var(--texto);
                   padding: 6px 10px; border-radius: 8px; cursor: pointer; font-size: 12.5px; margin-left: 4px; }
.acciones button:hover { border-color: var(--oro); }
.chapa { display: inline-block; padding: 3px 9px; border-radius: 999px; font-size: 12px; font-weight: 700; text-transform: capitalize; }
.chapa.ok { background: rgba(46, 204, 113, 0.15); color: #6ee7a2; }
.chapa.aviso { background: rgba(241, 196, 15, 0.15); color: #f7d774; }
.chapa.mal { background: rgba(231, 76, 60, 0.18); color: #ff8f84; }
.chapa.admin { background: rgba(255, 107, 61, 0.18); color: #ffab8a; }
.chapa.neutra { background: rgba(76, 201, 240, 0.12); color: #8fdcf5; text-transform: none; }
.punto { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: #2ecc71; box-shadow: 0 0 8px #2ecc71; margin-left: 6px; }
.rejilla-form { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 12px; align-items: end; margin-bottom: 18px; }
.rejilla-form label { display: grid; gap: 6px; font-size: 12.5px; color: var(--texto-suave); }
.rejilla-form .ancho { grid-column: span 2; }
.codigo { background: rgba(233, 185, 73, 0.12); color: var(--oro-claro); padding: 4px 8px; border-radius: 6px; cursor: copy; font-weight: 700; letter-spacing: 1px; }
.tubo.mini { width: 70px; height: 6px; display: inline-block; vertical-align: middle; margin-right: 8px; }
.tubo.mini i { width: 0; }
.dialogo { padding: 24px; width: min(440px, calc(100vw - 32px)); color: var(--texto); }
.dialogo::backdrop { background: rgba(2, 8, 13, 0.7); backdrop-filter: blur(3px); }
.dialogo h3 { margin: 0 0 16px; font-size: 20px; }
.dialogo-botones { display: flex; justify-content: flex-end; gap: 10px; margin-top: 8px; }
.ficha-admin { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.ficha-admin div { background: rgba(0, 0, 0, 0.28); border-radius: 10px; padding: 10px 12px; }
.ficha-admin small { display: block; color: var(--texto-suave); font-size: 11.5px; }
.tostada { position: fixed; left: 50%; bottom: 28px; transform: translate(-50%, 20px); opacity: 0; pointer-events: none;
           background: #0f2b3b; border: 1px solid #4cc9f0; color: #dff6ff; padding: 12px 18px; border-radius: 12px;
           box-shadow: var(--sombra); transition: opacity .25s, transform .25s; z-index: 50; }
.tostada.visible { opacity: 1; transform: translate(-50%, 0); }
.tostada.error { border-color: #e74c3c; background: #3a1512; color: #ffd6d1; }
@media (max-width: 640px) { .rejilla-form .ancho { grid-column: span 1; } }

@media (prefers-reduced-motion: reduce) {
  *, *::before { animation: none !important; transition: none !important; }
}

@font-face {
  font-family: Cinzel;
  src: url("/web/wordpirate-cinzel.woff2") format("woff2");
  font-weight: 400 900;
  font-display: swap;
}

.wordpirate {
  --noche: #0a1d21;
  --abismo: #071619;
  --mar: #365255;
  --turquesa: #83bcb4;
  --oro: #e6b86d;
  --oro-claro: #eac184;
  --pergamino: #f8ebd6;
  --texto: #f8ebd6;
  --texto-suave: #b9c8c3;
  --cristal: #11282b;
  --borde: #365255;
  --radio: 8px;
  --display: "Cinzel", Georgia, serif;
}
.wordpirate [hidden] { display: none !important; }
.wordpirate :focus-visible { outline: 2px solid #f3d493; outline-offset: 3px; }
.wordpirate .barra { background: #071619; border-bottom: 1px solid #365255; }
.wordpirate .marca { gap: 10px; }
.marca-emblema { width: 48px; height: 48px; flex: none;
  background: center / contain no-repeat url("data:image/webp;base64,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"); }
.portada .marca-emblema { width: 54px; height: 54px; }
.wordpirate .marca b { color: var(--oro); background: none; font-size: clamp(20px, 2.5vw, 29px); font-weight: 700; }
.wordpirate .tarjeta { backdrop-filter: none; }
.wordpirate .boton { background: #e6b86d; color: #172125; border: 1px solid #f3d599; box-shadow: none; }
.wordpirate .boton:hover { background: #f1cd8c; box-shadow: none; }
.wordpirate .campo input { background: #0a1d21; border-color: #365255; }
.wordpirate .campo input::placeholder { color: #a6b9b6; }
.wordpirate .aviso { color: #ffdbc7; }
.wordpirate .pie { padding: 23px 16px 30px; }

.portada .barra { position: relative; }
.portada .acceso {
  max-width: none;
  min-height: clamp(620px, 78svh, 900px);
  grid-template-columns: minmax(0, 1fr) minmax(320px, 400px);
  padding: clamp(38px, 7vw, 110px) max(6vw, calc((100vw - 1370px) / 2));
  background:
    linear-gradient(90deg, #071619e8 0%, #07161970 45%, #07161924 70%),
    linear-gradient(0deg, #0a1d21 0%, transparent 24%),
    url("/web/wordpirate-galeon.webp") center 45% / cover no-repeat;
}
.portada .relato h1 {
  margin: 0 0 22px;
  font-size: clamp(61px, 8.8vw, 140px);
  line-height: .91;
  letter-spacing: -.045em;
  font-weight: 700;
}
.portada .lema { max-width: 390px; margin-bottom: 0; color: var(--pergamino); }
.portada .acceso .tarjeta { background: #11282bf5; padding: clamp(22px, 3.1vw, 42px); border-color: #9b744b; }
.portada .acceso .tarjeta::before { content: none; }
.portada .acceso .tarjeta h2 { font-size: clamp(24px, 2.5vw, 35px); }
.portada .pestanas button[aria-selected="true"] { background: #2d4545; color: #f8ebd6; box-shadow: none; }

.cuenta {
  background: linear-gradient(180deg, #0a1d2165, #0a1d21 530px),
              url("/web/wordpirate-flota.jpg") center 70px / min(100%, 1920px) auto no-repeat,
              var(--noche);
}
.cuenta .panel { max-width: 1390px; padding-bottom: 48px; }
.cuenta .definiciones { position: absolute; }
.panel-titulo { grid-column: 1 / -1; margin: 12px 0 4px; font: 700 clamp(27px, 4vw, 49px)/1.1 var(--display); text-shadow: 0 3px 22px #071619; }
.estado-cuenta { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: center; gap: 14px; padding: 18px 24px; }
.estado-cuenta p { margin: 0; }
.estado-cuenta[data-error] { background: #4a292a; border-color: #f3a986; color: #ffdbc7; }
.cuenta .nave { background: linear-gradient(110deg, #11282b 35%, #173537); }
.cuenta .nave .arte { inset: 0 0 0 38%; background-size: contain; background-repeat: no-repeat; opacity: .78; }
.cuenta .nave.con-giro .arte { opacity: 0; }
.cuenta .nave h2 { font-size: clamp(27px, 3.4vw, 48px); line-height: 1.12; }
.cuenta .giro::before { animation: none; pointer-events: none; }
.cuenta .capitan { border-top: 2px solid var(--oro); }
.cuenta .entrada { min-height: 0; padding: 25px; }
.cuenta .entrada h3 { font-size: clamp(24px, 3vw, 32px); }
.cuenta .entrada:hover { transform: none; }

@media (max-width: 760px) {
  .portada .acceso { grid-template-columns: minmax(0, 1fr); padding: 46px 20px 28px; gap: 35px; min-height: 0;
                    background: linear-gradient(180deg, #07161966, #07161975 230px, #0a1d21 620px),
                                url("/web/wordpirate-galeon.webp") 57% top / auto 560px no-repeat; }
  .portada .acceso .tarjeta { justify-self: start; }
  .cuenta .barra { padding: 9px 12px; }
  .cuenta .quien { gap: 8px; min-width: 0; }
  .cuenta #nombre-barra { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .cuenta #sello-admin { display: none; }
  .cuenta .panel { gap: 14px; }
  .cuenta .panel-titulo { order: -3; }
  .cuenta .estado-cuenta { order: -2; }
  .cuenta .capitan { order: -1; }
  .cuenta .nave, .cuenta .capitan, .cuenta .entrada { padding: 18px; }
  .cuenta .nave .arte { inset: 54% 0 0; mask-image: none; }
  .cuenta .giro { max-width: 220px; }
  .cuenta .medida { grid-template-columns: 96px 1fr 75px; }
}

/* Registro: casilla de términos */
.casilla-terminos { display: flex; gap: 10px; align-items: flex-start; margin: 4px 0 16px; font-size: 13.5px; color: var(--texto-suave, #b9c6cc); line-height: 1.45; }
.casilla-terminos input { width: 18px; height: 18px; margin-top: 1px; flex: none; accent-color: #e9b949; }
.casilla-terminos a { color: #f3d58d; }
[hidden] { display: none !important; }
.id-usuario { display: block; color: #f3d58d; font-weight: 700; letter-spacing: .3px; margin: 2px 0; }

.enlace-boton { margin-left: 6px; padding: 4px 10px; border-radius: 7px; border: 1px solid #c99a45; background: #3a2a12;
  color: #f3d58d; font: inherit; font-weight: 700; cursor: pointer; }
.enlace-boton:disabled { opacity: .55; cursor: default; }
