/* DBD Tournament web — shared visual system (matches the landing / local app). */
@import url("https://fonts.googleapis.com/css2?family=Anton&family=Oswald:wght@500;600;700&family=Chakra+Petch:wght@400;500;600&display=swap");

:root{
  --ground:#0b0a0c; --surface:#121116; --surface-2:#17161d;
  --line:rgba(232,228,220,.11); --line-2:rgba(232,228,220,.24);
  --text:#e9e4db; --dim:#9a958d; --faint:#6c675f;
  --blood:#b91d27; --blood-2:#e5323c; --on-blood:#f6efe8;
  --ok:#6fbf7f; --warn:#d29a4a;
}
*,*::before,*::after{ box-sizing:border-box; }
body{
  margin:0; background:var(--ground); color:var(--text);
  font-family:"Chakra Petch","Segoe UI",system-ui,sans-serif; line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
a{ color:var(--blood-2); text-decoration:none; }
::selection{ background:var(--blood); color:var(--on-blood); }

.wrap{ width:min(1080px,92vw); margin-inline:auto; padding:2rem 0 4rem; }
.eyebrow{ font-family:"Oswald",sans-serif; font-weight:600; font-size:.7rem;
  letter-spacing:.24em; text-transform:uppercase; color:var(--faint); margin:0; }
h1{ font-family:"Anton",sans-serif; font-weight:400; text-transform:uppercase;
  letter-spacing:.01em; line-height:.9; font-size:clamp(2rem,6vw,3.4rem); margin:.4rem 0 0; }
h2{ font-family:"Oswald",sans-serif; font-weight:700; text-transform:uppercase;
  letter-spacing:.03em; font-size:1.2rem; margin:2.2rem 0 .6rem;
  padding-bottom:.4rem; border-bottom:1px solid var(--line-2); }
.rule{ height:1px; border:0; margin:.7rem 0 0;
  background:linear-gradient(90deg,var(--blood),transparent 60%); }

.btn{ font-family:"Oswald",sans-serif; font-weight:600; font-size:.85rem;
  letter-spacing:.14em; text-transform:uppercase; padding:.7rem 1.4rem;
  border:1px solid var(--blood); border-radius:2px; cursor:pointer;
  background:var(--blood); color:var(--on-blood); transition:transform .12s, background .15s; }
.btn:hover{ background:var(--blood-2); transform:translateY(-1px); }
.btn.ghost{ background:transparent; color:var(--text); border-color:var(--line-2); }
.btn.ghost:hover{ border-color:var(--blood-2); color:var(--blood-2); }
.btn.sm{ padding:.35rem .7rem; font-size:.72rem; letter-spacing:.1em; }
.btn:disabled{ opacity:.5; cursor:not-allowed; transform:none; }

input,select{ font-family:"Chakra Petch",sans-serif; font-size:.9rem;
  background:var(--surface-2); color:var(--text); border:1px solid var(--line-2);
  border-radius:2px; padding:.55rem .7rem; }
input:focus,select:focus{ outline:2px solid var(--blood-2); outline-offset:1px; }
label{ display:flex; flex-direction:column; gap:.35rem; font-family:"Oswald",sans-serif;
  font-size:.68rem; letter-spacing:.14em; text-transform:uppercase; color:var(--dim); }
label input,label select{ text-transform:none; letter-spacing:0; }

.card{ background:var(--surface); border:1px solid var(--line); border-radius:3px; padding:1.1rem 1.2rem; }
.msg{ font-size:.82rem; color:var(--blood-2); min-height:1.1em; }
.pill{ display:inline-block; padding:2px 8px; border-radius:2px;
  font-family:"Oswald",sans-serif; font-size:.62rem; letter-spacing:.1em; text-transform:uppercase; }
.pill.on{ background:rgba(120,190,120,.16); color:var(--ok); }
.pill.off{ background:rgba(185,29,39,.16); color:var(--blood-2); }

table{ width:100%; border-collapse:collapse; font-size:.86rem; }
th,td{ text-align:left; padding:.5rem .7rem; border-bottom:1px solid var(--line); vertical-align:middle; }
th{ font-family:"Oswald",sans-serif; text-transform:uppercase; font-size:.66rem;
  letter-spacing:.12em; color:var(--dim); }
tr.off td{ opacity:.5; }

.topbar{ display:flex; align-items:center; gap:1rem; padding:.8rem 0;
  border-bottom:1px solid var(--line); margin-bottom:1.5rem; }
.topbar .mark{ font-family:"Anton",sans-serif; text-transform:uppercase; font-size:1rem; }
.topbar .mark b{ color:var(--blood); font-weight:400; }
.topbar .sp{ margin-left:auto; }
.who{ font-family:"Oswald",sans-serif; font-size:.7rem; letter-spacing:.12em;
  text-transform:uppercase; color:var(--dim); }

.center{ min-height:100vh; display:grid; place-items:center; }
.login{ width:min(360px,92vw); }
.login h1{ font-size:1.8rem; }

/* shared login modal (auth-ui.js) */
.auth-overlay{ position:fixed; inset:0; z-index:1000; display:grid; place-items:center;
  background:rgba(6,6,8,.72); backdrop-filter:blur(3px); }
.auth-card{ width:min(360px,92vw); background:var(--surface); border:1px solid var(--line-2);
  border-radius:4px; padding:1.4rem 1.5rem 1.6rem; box-shadow:0 30px 80px rgba(0,0,0,.6); }
.grid2{ display:grid; grid-template-columns:1fr 1fr; gap:.8rem; }
@media (max-width:560px){ .grid2{ grid-template-columns:1fr; } }
[hidden]{ display:none !important; }