@import url('/static/css/datagames.css');

:root{
  --bg:#070B16; --panel:#0E1626; --panel2:#0B1322; --line:rgba(255,255,255,.08);
  --txt:#EAF0FA; --muted:#9AA7BE; --accent:#38BDF8; --accent2:#2563EB;
  --danger:#ef4444; --ok:#22c55e; --radius:14px;
  --grad:linear-gradient(135deg,#38BDF8 0%,#2563EB 100%);
}
*{box-sizing:border-box}
body{margin:0;background:
  radial-gradient(1100px 520px at 85% -8%, rgba(56,189,248,.10), transparent 60%),
  radial-gradient(900px 480px at 0% 0%, rgba(37,99,235,.10), transparent 55%),
  var(--bg);
  color:var(--txt);font-family:var(--dg-font,'Geist','Inter',system-ui,sans-serif);line-height:1.5;-webkit-font-smoothing:antialiased}
a{color:var(--accent);text-decoration:none}
a:hover{text-decoration:underline}
.topbar{display:flex;align-items:center;justify-content:space-between;padding:16px 24px;border-bottom:1px solid var(--line);
  position:sticky;top:0;z-index:20;background:rgba(7,11,22,.72);backdrop-filter:saturate(140%) blur(14px);-webkit-backdrop-filter:saturate(140%) blur(14px)}
.brand{font-weight:800;letter-spacing:-.01em;color:var(--txt)}
.brand .g{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.topbar a.back{color:var(--muted);font-size:14px}
.wrap{max-width:760px;margin:0 auto;padding:40px 20px 72px}
.wrap.narrow{max-width:440px}
h1{font-size:30px;font-weight:800;letter-spacing:-.02em;margin:0 0 4px}
.sub{color:var(--muted);margin:0 0 28px;font-size:15px}
.card{background:var(--panel);border:1px solid var(--line);border-radius:var(--dg-r-lg,22px);padding:24px;margin-bottom:18px;box-shadow:var(--dg-shadow,0 2px 8px rgba(2,6,16,.5))}
.card h2{font-size:12.5px;text-transform:uppercase;letter-spacing:.14em;color:var(--muted);margin:0 0 16px;font-weight:700}
label{display:block;font-size:14px;font-weight:600;margin:0 0 6px}
.req{color:var(--accent)}
input[type=text],input[type=email],input[type=password],input[type=tel],input[type=url],select{
  width:100%;padding:12px 13px;background:var(--panel2);border:1px solid var(--line);border-radius:11px;
  color:var(--txt);font-size:15px;font-family:inherit;transition:border-color .15s,box-shadow .15s}
input::placeholder{color:var(--muted);opacity:1}  /* --muted-2 no existía → caía a #647089 (bajo contraste) */
input:focus,select:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(56,189,248,.30)}
.field{margin-bottom:16px}
.row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media(max-width:560px){.row{grid-template-columns:1fr}}
.hint{font-size:12.5px;color:var(--muted);margin-top:5px}
.types{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media(max-width:560px){.types{grid-template-columns:1fr}}
.type{cursor:pointer;border:1.5px solid var(--line);border-radius:14px;padding:16px;background:var(--panel2);transition:.15s}
.type:hover{border-color:rgba(56,189,248,.35);transform:translateY(-1px)}
.type.sel{border-color:var(--accent);background:rgba(56,189,248,.10);box-shadow:0 0 0 1px rgba(56,189,248,.25)}
.type .t{font-weight:700;font-size:15px}
.type .d{color:var(--muted);font-size:13px;margin-top:4px}
.type input{display:none}
.sports{display:flex;flex-wrap:wrap;gap:8px}
.chip{cursor:pointer;border:1.5px solid var(--line);border-radius:999px;padding:8px 15px;background:var(--panel2);font-size:14px;font-weight:600;user-select:none;transition:.15s}
.chip:hover{border-color:rgba(56,189,248,.35)}
.chip.sel{border-color:var(--accent);background:rgba(56,189,248,.14);color:#dbeafe}
.logo-row{display:flex;align-items:center;gap:16px}
.logo-prev{width:72px;height:72px;border-radius:14px;border:1px dashed var(--line);background:var(--panel2);display:flex;align-items:center;justify-content:center;overflow:hidden;flex:0 0 auto}
.logo-prev img{width:100%;height:100%;object-fit:cover}
.logo-prev span{color:var(--muted);font-size:11px;text-align:center;padding:4px}
.filebtn{display:inline-block;cursor:pointer;border:1px solid var(--line);background:var(--panel2);padding:10px 15px;border-radius:10px;font-size:14px;font-weight:600;transition:.15s}
.filebtn:hover{border-color:rgba(56,189,248,.35)}
.legal{display:flex;gap:10px;align-items:flex-start;font-size:14px;color:var(--muted)}
.legal input{margin-top:3px}
.submit{width:100%;padding:14px;background:var(--grad);color:#04101f;border:none;border-radius:999px;font-size:16px;font-weight:700;cursor:pointer;font-family:inherit;
  box-shadow:0 14px 34px -12px rgba(56,189,248,.6), inset 0 1px 0 rgba(255,255,255,.35);transition:transform .15s,filter .15s}
.submit:hover{filter:brightness(1.06);transform:translateY(-1px)}
.submit:active{transform:translateY(0)}
.submit:disabled{opacity:.55;cursor:not-allowed;filter:none;transform:none}
.linkbtn{background:none;border:none;color:var(--accent);font-size:14px;cursor:pointer;font-family:inherit;padding:0}
.linkbtn:hover{text-decoration:underline}
.msg{display:none;padding:12px 14px;border-radius:11px;margin-bottom:16px;font-size:14px}
.msg.err{display:block;background:rgba(239,68,68,.12);border:1px solid rgba(239,68,68,.4);color:#fecaca}
.msg.ok{display:block;background:rgba(34,197,94,.12);border:1px solid rgba(34,197,94,.4);color:#bbf7d0}
.msg.info{display:block;background:rgba(56,189,248,.1);border:1px solid rgba(56,189,248,.35);color:#bfdbfe}
.foot{text-align:center;color:var(--muted);font-size:14px;margin-top:18px}
.center-actions{display:flex;justify-content:space-between;align-items:center;margin-top:14px;font-size:13px}
/* Buscador de ciudad (combo sin typos) */
.combo{position:relative}
.combo-list{position:absolute;left:0;right:0;top:calc(100% + 4px);background:var(--panel2);border:1px solid var(--line);border-radius:11px;max-height:230px;overflow-y:auto;z-index:10;display:none;box-shadow:var(--dg-shadow-lg,0 30px 70px -28px rgba(3,10,28,.85))}
.combo-list.open{display:block}
.combo-list div{padding:11px 14px;cursor:pointer;font-size:15px;border-bottom:1px solid rgba(255,255,255,.04)}
.combo-list div:hover{background:rgba(56,189,248,.14)}
.combo-list .none{color:var(--muted);cursor:default}
.picked{color:#86efac;font-size:13px;margin-top:8px;display:none}
.picked.show{display:block}