/* ============================================================
   Join / Login / Dashboard — built on top of the site's tokens
   ============================================================ */

.auth-section{
  padding:64px 24px 96px;
  display:flex; justify-content:center;
}

.auth-card{
  width:100%; max-width:480px;
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:var(--radius);
  box-shadow:var(--shadow-md);
  padding:40px 36px;
}

.auth-card--wide{ max-width:720px; }

.auth-card h1{
  font-size:clamp(24px,3.4vw,30px); font-weight:900; color:var(--ink);
  margin-bottom:8px;
}
.auth-card .auth-sub{
  color:var(--muted); font-size:14.5px; line-height:1.6; margin-bottom:28px;
}

.field{ margin-bottom:20px; }
.field label{
  display:block; font-family:var(--font-display); font-weight:700;
  font-size:12.5px; letter-spacing:.03em; text-transform:uppercase;
  color:var(--ink-soft); margin-bottom:8px;
}
.field input[type="text"],
.field input[type="email"],
.field input[type="password"],
.field input[type="file"],
.field textarea{
  width:100%; font-family:var(--font-body); font-size:15px; color:var(--ink);
  background:var(--paper); border:1px solid var(--line); border-radius:10px;
  padding:12px 14px; box-sizing:border-box;
}
.field input:focus,
.field textarea:focus{
  outline:none; border-color:var(--gold); box-shadow:0 0 0 3px rgba(201,162,77,.25);
}
.field textarea{ resize:vertical; min-height:110px; font-family:var(--font-body); }
.field .hint{ margin-top:6px; font-size:12.5px; color:var(--muted); }

.btn-primary{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  width:100%; background:var(--red); color:#fff; font-family:var(--font-display);
  font-weight:700; font-size:14px; letter-spacing:.03em;
  padding:13px 20px; border:0; border-radius:999px; cursor:pointer;
  box-shadow:var(--shadow-sm); transition:background .15s ease;
}
.btn-primary:hover{ background:var(--red-deep); }

.auth-alt{
  margin-top:22px; text-align:center; font-size:14px; color:var(--ink-soft);
}
.auth-alt a{ color:var(--red); font-weight:700; }

.alert{
  border-radius:10px; padding:12px 16px; font-size:14px; margin-bottom:22px;
  border:1px solid transparent;
}
.alert--success{ background:#eef7ec; border-color:#bfe3b6; color:#2c6b26; }
.alert--error{ background:#fbeceb; border-color:#f2c2bf; color:var(--red-deep); }

.dashboard-head{
  display:flex; align-items:baseline; justify-content:space-between; gap:16px;
  flex-wrap:wrap; margin-bottom:32px;
}
.dashboard-head h1{ font-size:clamp(24px,3.4vw,32px); font-weight:900; color:var(--ink); }
.dashboard-head p{ color:var(--muted); margin-top:6px; }

.submission-list{ margin-top:40px; }
.submission-list h2{
  font-size:18px; font-weight:800; color:var(--ink); margin-bottom:16px;
}
.submission-card{
  background:var(--paper); border:1px solid var(--line); border-radius:12px;
  padding:18px; margin-bottom:16px;
}
.submission-card video{
  width:100%; max-height:320px; border-radius:8px; background:#000; display:block;
}
.submission-card .comment{
  margin-top:12px; font-size:14.5px; color:var(--ink-soft); line-height:1.6;
}
.submission-card .meta{
  margin-top:10px; font-size:12.5px; color:var(--muted);
}
.empty-note{
  color:var(--muted); font-size:14.5px; padding:18px 0;
}

/* ============================================================
   Videos gallery page
   ============================================================ */
.video-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(280px, 1fr));
  gap:24px;
  margin-top:8px;
}
.video-card{
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:var(--radius);
  overflow:hidden;
  box-shadow:var(--shadow-sm);
  display:flex; flex-direction:column;
}
.video-card video{
  width:100%; aspect-ratio:16/10; background:#000; display:block;
}
.video-card-body{ padding:16px 18px 20px; }
.video-comment{
  font-size:14.5px; color:var(--ink); line-height:1.6; margin-bottom:10px;
}
.video-meta{
  font-size:12.5px; color:var(--muted);
}
.video-meta i{ color:var(--gold); margin-right:2px; }