:root{
  --bg:#080b16;
  --panel:rgba(255,255,255,0.09);
  --panel2:rgba(255,255,255,0.06);
  --line:rgba(255,255,255,0.14);
  --text:#f8fafc;
  --muted:#dbe4f0;
  --gold:#ffd54a;
  --pink:#ff5ccf;
  --purple:#7c3aed;
  --cyan:#67e8f9;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:Arial,Helvetica,sans-serif;
  color:var(--text);
  background:
    radial-gradient(circle at top left, rgba(255,213,74,0.16), transparent 22%),
    radial-gradient(circle at top right, rgba(255,92,207,0.14), transparent 22%),
    radial-gradient(circle at bottom center, rgba(124,58,237,0.20), transparent 28%),
    linear-gradient(135deg,#06070d 0%, #0e1324 45%, #1a1040 100%);
  min-height:100vh;
}
a{color:#9be7ff;text-decoration:none}
a:hover{text-decoration:underline}
.topbar{
  position:sticky; top:0; z-index:1000;
  backdrop-filter:blur(10px);
  background:rgba(5,8,18,0.65);
  border-bottom:1px solid var(--line);
}
.topbar-inner{
  max-width:1180px; margin:0 auto; padding:14px 20px;
  display:flex; justify-content:space-between; align-items:center; gap:14px; flex-wrap:wrap;
}
.brand{
  color:var(--gold); font-weight:900; letter-spacing:.05em;
  text-shadow:0 0 16px rgba(255,213,74,.24);
}
.nav{display:flex; flex-wrap:wrap; gap:10px}
.nav a{
  padding:10px 16px; border-radius:999px;
  color:white; font-weight:700; text-decoration:none;
  background:linear-gradient(135deg,var(--pink),var(--purple));
  box-shadow:0 10px 24px rgba(124,58,237,.25);
}
.hero{
  max-width:1180px; margin:0 auto; padding:72px 20px 28px; text-align:center;
}
h1{
  margin:0 0 12px; font-size:clamp(2.8rem,6vw,5rem); line-height:1.0;
}
.sparkle{
  background:linear-gradient(90deg,#fff,#ffd54a,#ff70d8,#7ee7ff,#fff);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.subtitle{
  max-width:920px; margin:0 auto; color:var(--muted);
  font-size:1.08rem; line-height:1.65;
}
.hero .subtitle{margin-bottom:34px}
.count-wrap{
  margin-top:18px; padding:22px 26px; border-radius:28px; display:inline-block;
  background:
    linear-gradient(135deg, rgba(255,255,255,.16), rgba(255,255,255,.08)),
    radial-gradient(circle at top left, rgba(255,213,74,.18), transparent 35%),
    radial-gradient(circle at bottom right, rgba(255,92,207,.18), transparent 35%);
  border:1px solid rgba(255,255,255,.18);
  box-shadow:0 18px 40px rgba(0,0,0,.28),0 0 34px rgba(124,58,237,.18);
}
.count-label{
  font-size:.9rem; font-weight:900; letter-spacing:.14em; text-transform:uppercase;
  color:#fde68a; margin-bottom:12px;
}
.count-grid{
  display:grid; grid-template-columns:repeat(4,minmax(72px,110px));
  gap:14px; justify-content:center;
}
.count-box{
  background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.12);
  border-radius:22px; padding:14px 10px 12px; box-shadow:0 10px 24px rgba(0,0,0,.18);
}
.count-num{
  font-size:clamp(1.8rem,4vw,2.8rem); font-weight:900; line-height:1;
  color:#fff;
}
.count-unit{
  margin-top:8px; font-size:.78rem; font-weight:800; letter-spacing:.08em;
  text-transform:uppercase; color:#dbe4f0;
}
.container{max-width:1180px; margin:0 auto; padding:22px 20px}
.section-title{margin:10px 0 18px; font-size:1.8rem}
.grid{
  display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:22px;
}
.card{
  background:linear-gradient(180deg,var(--panel),var(--panel2));
  border:1px solid var(--line); border-radius:26px; overflow:hidden;
  box-shadow:0 18px 34px rgba(0,0,0,.28);
}
.card-body{padding:20px}
.kicker{
  color:var(--gold); font-size:.82rem; font-weight:900; text-transform:uppercase;
  letter-spacing:.08em; margin-bottom:8px;
}
.card h3{margin:0 0 8px; font-size:1.35rem}
.meta{color:#d8dff0; font-weight:700; margin-bottom:10px}
.muted{color:var(--muted); line-height:1.55}
.poster{
  display:block; width:100%; aspect-ratio:4/3; object-fit:cover; background:#111827;
}
.actions{display:flex; flex-wrap:wrap; gap:10px; margin-top:16px}
.btn{
  display:inline-block; padding:10px 14px; border-radius:999px;
  text-decoration:none; font-weight:800;
}
.btn-primary{background:linear-gradient(135deg,var(--pink),var(--purple)); color:#fff}
.btn-secondary{
  background:rgba(255,255,255,.08); color:#fff; border:1px solid var(--line);
}
.big-home{
  display:inline-block; margin:10px 0 16px; padding:12px 22px; border-radius:999px;
  text-decoration:none; color:#111; font-weight:900;
  background:linear-gradient(90deg,#ffd54a,#fff176);
  box-shadow:0 0 24px rgba(255,213,74,.24);
}
.profile-wrap{max-width:980px; margin:34px auto; padding:0 20px}
.profile-box{
  background:linear-gradient(180deg,rgba(255,255,255,.12),rgba(255,255,255,.07));
  border:1px solid var(--line); border-radius:30px; overflow:hidden;
  box-shadow:0 22px 44px rgba(0,0,0,.30);
}
.profile-grid{display:grid; grid-template-columns:minmax(260px,360px) 1fr}
.profile-side{background:rgba(255,255,255,.03)}
.profile-main{padding:28px}
.search-wrap{max-width:700px; margin:0 auto 26px}
.search-box{
  width:100%; padding:15px 18px; border-radius:18px; border:1px solid var(--line);
  background:rgba(255,255,255,.08); color:#fff; font-size:1rem;
}
.list-page-intro{
  max-width:920px; margin:0 auto 24px; color:var(--muted); line-height:1.7; text-align:center;
}
.feature-shell{max-width:960px; margin:0 auto}
.feature-panel{
  background:linear-gradient(180deg,rgba(255,255,255,.14),rgba(255,255,255,.08));
  border:1px solid rgba(255,255,255,.16);
  border-radius:30px;
  overflow:hidden;
  box-shadow:0 22px 44px rgba(0,0,0,.28);
}
.feature-grid{display:grid; grid-template-columns:minmax(260px,360px) 1fr}
.feature-copy{padding:26px}
.feature-eyebrow{
  color:#fde68a;
  font-size:.82rem;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.1em;
  margin-bottom:10px;
}
.feature-title{font-size:clamp(1.9rem,4vw,2.8rem); margin:0 0 8px}
.feature-note{
  display:inline-block;
  margin-top:10px;
  padding:8px 14px;
  border-radius:999px;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.12);
  color:#dbe4f0;
  font-size:.9rem;
  font-weight:700;
}
.story-text p{margin:0 0 16px}
.story-grid{
  display:grid;
  grid-template-columns:minmax(260px,360px) 1fr;
}
.story-copy{padding:28px}
.story-list{
  max-width:1180px;
  margin:0 auto;
}
.stat-table{
  width:100%;
  border-collapse:collapse;
  overflow:hidden;
  border-radius:20px;
}
.stat-table th,.stat-table td{
  border-bottom:1px solid rgba(255,255,255,.10);
  padding:14px 16px;
  text-align:left;
}
.stat-table th{
  color:#fde68a;
  font-size:.9rem;
  text-transform:uppercase;
  letter-spacing:.08em;
}
.footer{text-align:center; color:#dde4ef; padding:36px 20px 50px}
@media (max-width:820px){
  .profile-grid,.feature-grid,.story-grid{grid-template-columns:1fr}
}
@media (max-width:640px){
  .count-grid{grid-template-columns:repeat(2,minmax(90px,1fr))}
}



.map-hero-note{
  max-width: 900px;
  margin: 0 auto;
}

.map-panel{
  max-width: 1180px;
  margin: 0 auto 28px;
  padding: 28px;
  border-radius: 30px;
  background:
    radial-gradient(circle at 15% 20%, rgba(255,213,74,.22), transparent 18%),
    radial-gradient(circle at 80% 18%, rgba(255,92,207,.20), transparent 18%),
    radial-gradient(circle at 55% 80%, rgba(103,232,249,.20), transparent 22%),
    linear-gradient(135deg, rgba(255,255,255,.12), rgba(255,255,255,.06));
  border: 1px solid rgba(255,255,255,.14);
  box-shadow: 0 22px 44px rgba(0,0,0,.24);
}

.map-title{
  margin: 0 0 14px;
  font-size: clamp(1.8rem, 4vw, 2.8rem);
  text-align: center;
}

.map-subtitle{
  text-align: center;
  color: #dbe4f0;
  max-width: 820px;
  margin: 0 auto 24px;
  line-height: 1.65;
}

.map-grid{
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: 18px;
}

.map-card{
  border-radius: 26px;
  padding: 20px;
  border: 1px solid rgba(255,255,255,.12);
  color: white;
  box-shadow: 0 16px 30px rgba(0,0,0,.22);
}

.map-card h3{
  margin: 0 0 10px;
  font-size: 1.3rem;
}

.map-card p{
  margin: 0 0 14px;
  line-height: 1.55;
  color: #eef2ff;
}

.map-card ul{
  margin: 0;
  padding-left: 18px;
}

.map-card li{
  margin: 0 0 8px;
}

.map-card a{
  color: white;
  font-weight: 700;
}

.map-australia{
  grid-column: span 4;
  background: linear-gradient(135deg, #0ea5e9, #2563eb);
}

.map-canada{
  grid-column: span 4;
  background: linear-gradient(135deg, #ef4444, #dc2626);
}

.map-caribbean{
  grid-column: span 4;
  background: linear-gradient(135deg, #f97316, #ea580c);
}

.map-usa{
  grid-column: span 6;
  background: linear-gradient(135deg, #8b5cf6, #7c3aed);
}

.map-uk{
  grid-column: span 3;
  background: linear-gradient(135deg, #14b8a6, #0f766e);
}

.map-other{
  grid-column: span 3;
  background: linear-gradient(135deg, #ec4899, #be185d);
}

.map-stat-band{
  margin-top: 24px;
  display: grid;
  grid-template-columns: repeat(4, minmax(120px, 1fr));
  gap: 16px;
}

.map-stat{
  text-align: center;
  padding: 18px 14px;
  border-radius: 22px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.12);
}

.map-stat-num{
  font-size: 2rem;
  font-weight: 900;
  line-height: 1;
  margin-bottom: 8px;
}

.map-stat-label{
  font-size: .82rem;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: #e5e7eb;
  font-weight: 800;
}

@media (max-width: 900px){
  .map-australia,
  .map-canada,
  .map-caribbean,
  .map-usa,
  .map-uk,
  .map-other{
    grid-column: span 12;
  }

  .map-stat-band{
    grid-template-columns: repeat(2, minmax(120px, 1fr));
  }
}



.map-action-bar{
  display:flex;
  justify-content:center;
  gap:14px;
  flex-wrap:wrap;
  margin: 12px 0 28px;
}

.map-launch-btn{
  display:inline-block;
  padding:14px 22px;
  border-radius:999px;
  text-decoration:none;
  font-weight:900;
  color:#111;
  background:linear-gradient(90deg,#ffd54a,#fff176);
  box-shadow:0 0 24px rgba(255,213,74,.24);
}

.map-launch-btn.secondary{
  color:white;
  background:linear-gradient(135deg,#ff5ccf,#7c3aed);
  box-shadow:0 10px 24px rgba(124,58,237,.25);
}

.leaflet-shell{
  max-width: 1180px;
  margin: 0 auto 28px;
  padding: 22px;
  border-radius: 30px;
  background:
    radial-gradient(circle at 15% 20%, rgba(255,213,74,.16), transparent 18%),
    radial-gradient(circle at 80% 18%, rgba(255,92,207,.16), transparent 18%),
    radial-gradient(circle at 55% 80%, rgba(103,232,249,.14), transparent 22%),
    linear-gradient(135deg, rgba(255,255,255,.12), rgba(255,255,255,.06));
  border: 1px solid rgba(255,255,255,.14);
  box-shadow: 0 22px 44px rgba(0,0,0,.24);
}

.leaflet-title{
  margin: 0 0 10px;
  text-align:center;
  font-size: clamp(1.8rem,4vw,2.6rem);
}

.leaflet-subtitle{
  text-align:center;
  color:#dbe4f0;
  max-width:840px;
  margin:0 auto 20px;
  line-height:1.65;
}

#lester-map{
  width:100%;
  height:640px;
  border-radius:24px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.12);
}

.map-legend{
  margin-top:18px;
  display:grid;
  grid-template-columns:repeat(5,minmax(120px,1fr));
  gap:14px;
}

.map-legend-item{
  padding:14px 16px;
  border-radius:18px;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.12);
  color:#e5e7eb;
  font-weight:700;
  text-align:center;
}

.custom-pin{
  width: 18px;
  height: 18px;
  border-radius: 50%;
  border: 2px solid white;
  box-shadow: 0 0 0 3px rgba(255,255,255,.15), 0 6px 14px rgba(0,0,0,.35);
}

.pin-australia{ background:#2563eb; }
.pin-canada{ background:#dc2626; }
.pin-caribbean{ background:#ea580c; }
.pin-usa{ background:#7c3aed; }
.pin-uk{ background:#0f766e; }
.pin-other{ background:#db2777; }

.leaflet-div-icon{
  background: transparent !important;
  border: none !important;
}

@media (max-width: 900px){
  .map-legend{
    grid-template-columns:repeat(2,minmax(120px,1fr));
  }
  #lester-map{
    height:520px;
  }
}



.name-origin-wrap{
  max-width: 1180px;
  margin: 0 auto;
}

.name-highlight{
  padding: 26px;
  border-radius: 30px;
  background:
    radial-gradient(circle at 12% 18%, rgba(255,213,74,.20), transparent 18%),
    radial-gradient(circle at 85% 20%, rgba(255,92,207,.18), transparent 20%),
    radial-gradient(circle at 50% 85%, rgba(103,232,249,.16), transparent 24%),
    linear-gradient(135deg, rgba(255,255,255,.14), rgba(255,255,255,.07));
  border: 1px solid rgba(255,255,255,.14);
  box-shadow: 0 22px 44px rgba(0,0,0,.24);
  margin-bottom: 26px;
}

.name-highlight h2{
  margin: 0 0 10px;
  font-size: clamp(1.6rem, 4vw, 2.4rem);
}

.name-highlight p{
  margin: 0;
  color: #e5e7eb;
  line-height: 1.7;
}

.name-symbol-row{
  display:grid;
  grid-template-columns: repeat(3, minmax(180px, 1fr));
  gap: 16px;
  margin-top: 20px;
}

.name-symbol-card{
  padding: 18px;
  border-radius: 22px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.12);
  text-align:center;
}

.name-symbol-card h3{
  margin: 0 0 8px;
  font-size: 1.08rem;
}

.name-symbol-card p{
  margin: 0;
  color: #dbe4f0;
  line-height: 1.5;
}

.origin-grid{
  display:grid;
  grid-template-columns: repeat(2, minmax(280px, 1fr));
  gap: 22px;
}

.origin-card{
  padding: 22px;
  border-radius: 26px;
  background: linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.06));
  border: 1px solid rgba(255,255,255,.12);
  box-shadow: 0 16px 30px rgba(0,0,0,.22);
}

.origin-card h3{
  margin: 0 0 10px;
  font-size: 1.3rem;
}

.origin-card p{
  margin: 0 0 14px;
  color: #dbe4f0;
  line-height: 1.65;
}

.origin-card ul{
  margin: 0;
  padding-left: 18px;
}

.origin-card li{
  margin: 0 0 10px;
  color: #eef2ff;
}

.culture-grid{
  display:grid;
  grid-template-columns: repeat(3, minmax(220px, 1fr));
  gap: 22px;
  margin-top: 8px;
}

.culture-card{
  border-radius: 26px;
  padding: 22px;
  border: 1px solid rgba(255,255,255,.12);
  box-shadow: 0 16px 30px rgba(0,0,0,.22);
  color: white;
}

.culture-card h3{
  margin: 0 0 10px;
  font-size: 1.25rem;
}

.culture-card p{
  margin: 0;
  line-height: 1.65;
  color: #eef2ff;
}

.culture-uk{ background: linear-gradient(135deg, #2563eb, #1d4ed8); }
.culture-us{ background: linear-gradient(135deg, #7c3aed, #6d28d9); }
.culture-canada{ background: linear-gradient(135deg, #ef4444, #dc2626); }
.culture-caribbean{ background: linear-gradient(135deg, #f97316, #ea580c); }
.culture-australia{ background: linear-gradient(135deg, #0ea5e9, #0284c7); }
.culture-global{ background: linear-gradient(135deg, #ec4899, #be185d); }

.timeline-shell{
  margin-top: 26px;
  padding: 24px;
  border-radius: 30px;
  background: linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.06));
  border: 1px solid rgba(255,255,255,.12);
  box-shadow: 0 16px 30px rgba(0,0,0,.22);
}

.timeline-shell h2{
  margin: 0 0 16px;
}

.timeline-list{
  display:grid;
  gap: 14px;
}

.timeline-item{
  display:grid;
  grid-template-columns: 180px 1fr;
  gap: 16px;
  padding: 14px 0;
  border-bottom: 1px solid rgba(255,255,255,.10);
}

.timeline-item:last-child{
  border-bottom: none;
}

.timeline-year{
  font-weight: 900;
  color: #fde68a;
  letter-spacing: .04em;
}

.timeline-text{
  color: #e5e7eb;
  line-height: 1.6;
}

.related-search-grid{
  display:grid;
  grid-template-columns: repeat(2, minmax(260px, 1fr));
  gap: 16px;
  margin-top: 18px;
}

.related-search{
  padding: 16px 18px;
  border-radius: 18px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.12);
  color: #f8fafc;
  font-weight: 700;
}

@media (max-width: 980px){
  .culture-grid{
    grid-template-columns: repeat(2, minmax(220px, 1fr));
  }
}

@media (max-width: 820px){
  .origin-grid,
  .culture-grid,
  .name-symbol-row,
  .related-search-grid{
    grid-template-columns: 1fr;
  }

  .timeline-item{
    grid-template-columns: 1fr;
    gap: 8px;
  }
}



.submit-shell{
  max-width: 1080px;
  margin: 0 auto;
}

.submit-panel{
  padding: 28px;
  border-radius: 30px;
  background:
    radial-gradient(circle at 15% 20%, rgba(255,213,74,.18), transparent 18%),
    radial-gradient(circle at 82% 18%, rgba(255,92,207,.16), transparent 18%),
    radial-gradient(circle at 55% 84%, rgba(103,232,249,.15), transparent 22%),
    linear-gradient(135deg, rgba(255,255,255,.13), rgba(255,255,255,.07));
  border: 1px solid rgba(255,255,255,.14);
  box-shadow: 0 22px 44px rgba(0,0,0,.24);
}

.submit-intro{
  color:#dbe4f0;
  line-height:1.7;
  max-width:880px;
  margin:0 auto 24px;
  text-align:center;
}

.submit-grid{
  display:grid;
  grid-template-columns: repeat(2, minmax(280px, 1fr));
  gap: 18px;
}

.submit-field{
  display:flex;
  flex-direction:column;
  gap:8px;
}

.submit-field.full{
  grid-column: 1 / -1;
}

.submit-label{
  font-weight:800;
  color:#f8fafc;
  letter-spacing:.02em;
}

.submit-input,
.submit-select,
.submit-textarea{
  width:100%;
  padding:14px 16px;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.08);
  color:white;
  font-size:1rem;
  outline:none;
}

.submit-input:focus,
.submit-select:focus,
.submit-textarea:focus{
  border-color: rgba(255,213,74,.65);
  box-shadow: 0 0 0 3px rgba(255,213,74,.12);
}

.submit-select option{
  color:black;
}

.submit-textarea{
  min-height: 150px;
  resize: vertical;
  line-height:1.6;
}

.submit-help{
  color:#cbd5e1;
  font-size:.92rem;
  line-height:1.5;
}

.submit-actions{
  display:flex;
  flex-wrap:wrap;
  gap:14px;
  margin-top:22px;
}

.submit-btn{
  display:inline-block;
  padding:14px 20px;
  border-radius:999px;
  border:none;
  cursor:pointer;
  font-weight:900;
  font-size:.98rem;
}

.submit-btn.primary{
  color:#111;
  background:linear-gradient(90deg,#ffd54a,#fff176);
  box-shadow:0 0 24px rgba(255,213,74,.24);
}

.submit-btn.secondary{
  color:white;
  background:linear-gradient(135deg,#ff5ccf,#7c3aed);
  box-shadow:0 10px 24px rgba(124,58,237,.25);
}

.submit-btn.ghost{
  color:white;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.14);
}

.submit-status{
  margin-top:18px;
  padding:14px 16px;
  border-radius:18px;
  font-weight:700;
  display:none;
}

.submit-status.ok{
  display:block;
  background:rgba(34,197,94,.14);
  border:1px solid rgba(34,197,94,.35);
  color:#dcfce7;
}

.submit-status.err{
  display:block;
  background:rgba(239,68,68,.14);
  border:1px solid rgba(239,68,68,.35);
  color:#fee2e2;
}

.submit-mini-grid{
  margin-top:26px;
  display:grid;
  grid-template-columns: repeat(3, minmax(180px, 1fr));
  gap:16px;
}

.submit-mini-card{
  padding:18px;
  border-radius:22px;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.12);
}

.submit-mini-card h3{
  margin:0 0 8px;
  font-size:1.08rem;
}

.submit-mini-card p{
  margin:0;
  color:#dbe4f0;
  line-height:1.55;
}

.local-table-wrap{
  margin-top:28px;
  overflow-x:auto;
  border-radius:22px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.05);
}

.local-table{
  width:100%;
  border-collapse:collapse;
  min-width:900px;
}

.local-table th,
.local-table td{
  padding:12px 14px;
  border-bottom:1px solid rgba(255,255,255,.10);
  text-align:left;
  vertical-align:top;
}

.local-table th{
  color:#fde68a;
  font-size:.85rem;
  text-transform:uppercase;
  letter-spacing:.08em;
}

.local-count{
  margin-top:14px;
  color:#dbe4f0;
  font-weight:700;
}

.hp-wrap{
  position:absolute !important;
  left:-9999px !important;
  top:auto !important;
  width:1px !important;
  height:1px !important;
  overflow:hidden !important;
}

.recaptcha-box{
  margin-top:22px;
  padding:18px;
  border-radius:20px;
  background:rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.12);
  color:#dbe4f0;
  line-height:1.55;
}

@media (max-width: 860px){
  .submit-grid,
  .submit-mini-grid{
    grid-template-columns: 1fr;
  }
}



.submit-shell{
  max-width: 1080px;
  margin: 0 auto;
}

.submit-panel{
  padding: 28px;
  border-radius: 30px;
  background:
    radial-gradient(circle at 15% 20%, rgba(255,213,74,.18), transparent 18%),
    radial-gradient(circle at 82% 18%, rgba(255,92,207,.16), transparent 18%),
    radial-gradient(circle at 55% 84%, rgba(103,232,249,.15), transparent 22%),
    linear-gradient(135deg, rgba(255,255,255,.13), rgba(255,255,255,.07));
  border: 1px solid rgba(255,255,255,.14);
  box-shadow: 0 22px 44px rgba(0,0,0,.24);
}

.submit-intro{
  color:#dbe4f0;
  line-height:1.7;
  max-width:880px;
  margin:0 auto 24px;
  text-align:center;
}

.submit-grid{
  display:grid;
  grid-template-columns: repeat(2, minmax(280px, 1fr));
  gap: 18px;
}

.submit-field{
  display:flex;
  flex-direction:column;
  gap:8px;
}

.submit-field.full{
  grid-column: 1 / -1;
}

.submit-label{
  font-weight:800;
  color:#f8fafc;
  letter-spacing:.02em;
}

.submit-input,
.submit-select,
.submit-textarea{
  width:100%;
  padding:14px 16px;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.08);
  color:white;
  font-size:1rem;
  outline:none;
}

.submit-input:focus,
.submit-select:focus,
.submit-textarea:focus{
  border-color: rgba(255,213,74,.65);
  box-shadow: 0 0 0 3px rgba(255,213,74,.12);
}

.submit-select option{
  color:black;
}

.submit-textarea{
  min-height: 150px;
  resize: vertical;
  line-height:1.6;
}

.submit-help{
  color:#cbd5e1;
  font-size:.92rem;
  line-height:1.5;
}

.submit-actions{
  display:flex;
  flex-wrap:wrap;
  gap:14px;
  margin-top:22px;
}

.submit-btn{
  display:inline-block;
  padding:14px 20px;
  border-radius:999px;
  border:none;
  cursor:pointer;
  font-weight:900;
  font-size:.98rem;
}

.submit-btn.primary{
  color:#111;
  background:linear-gradient(90deg,#ffd54a,#fff176);
  box-shadow:0 0 24px rgba(255,213,74,.24);
}

.submit-status{
  margin-top:18px;
  padding:14px 16px;
  border-radius:18px;
  font-weight:700;
  display:none;
}

.submit-status.ok{
  display:block;
  background:rgba(34,197,94,.14);
  border:1px solid rgba(34,197,94,.35);
  color:#dcfce7;
}

.submit-status.err{
  display:block;
  background:rgba(239,68,68,.14);
  border:1px solid rgba(239,68,68,.35);
  color:#fee2e2;
}

.submit-mini-grid{
  margin-top:26px;
  display:grid;
  grid-template-columns: repeat(3, minmax(180px, 1fr));
  gap:16px;
}

.submit-mini-card{
  padding:18px;
  border-radius:22px;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.12);
}

.submit-mini-card h3{
  margin:0 0 8px;
  font-size:1.08rem;
}

.submit-mini-card p{
  margin:0;
  color:#dbe4f0;
  line-height:1.55;
}

.hp-wrap{
  position:absolute !important;
  left:-9999px !important;
  top:auto !important;
  width:1px !important;
  height:1px !important;
  overflow:hidden !important;
}

.recaptcha-box{
  margin-top:22px;
  padding:18px;
  border-radius:20px;
  background:rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.12);
  color:#dbe4f0;
  line-height:1.55;
}

.source-warning{
  display:none;
  margin-top:8px;
  padding:12px;
  border-radius:14px;
  background:rgba(251,191,36,.18);
  border:1px solid rgba(251,191,36,.45);
  color:#fde68a;
  font-weight:600;
}

@media (max-width: 860px){
  .submit-grid,
  .submit-mini-grid{
    grid-template-columns: 1fr;
  }
}



.compact-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:14px;
}

.compact-card{
  background:linear-gradient(180deg,rgba(255,255,255,.10),rgba(255,255,255,.06));
  border:1px solid rgba(255,255,255,.12);
  border-radius:20px;
  overflow:hidden;
  box-shadow:0 12px 24px rgba(0,0,0,.22);
}

.compact-poster{
  width:100%;
  height:110px;
  object-fit:cover;
  display:block;
  background:#111827;
}

.compact-body{
  padding:12px 14px 14px;
}

.compact-kicker{
  color:#fde68a;
  font-size:.72rem;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.08em;
  margin-bottom:6px;
}

.compact-name{
  margin:0 0 6px;
  font-size:1rem;
  line-height:1.25;
}

.compact-name a{
  color:#fff;
  text-decoration:none;
}

.compact-name a:hover{
  text-decoration:underline;
}

.compact-meta{
  color:#dbe4f0;
  font-size:.82rem;
  line-height:1.4;
  margin-bottom:8px;
}

.compact-bio{
  color:#cbd5e1;
  font-size:.86rem;
  line-height:1.45;
  margin-bottom:10px;
  display:-webkit-box;
  -webkit-line-clamp:3;
  -webkit-box-orient:vertical;
  overflow:hidden;
}

.compact-actions{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}

.compact-btn{
  display:inline-block;
  padding:8px 11px;
  border-radius:999px;
  text-decoration:none;
  font-size:.78rem;
  font-weight:800;
}

.compact-btn.primary{
  background:linear-gradient(135deg,#ff5ccf,#7c3aed);
  color:white;
}

.compact-btn.secondary{
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.14);
  color:white;
}

.rank-list{
  display:grid;
  gap:16px;
}

.rank-item{
  display:grid;
  grid-template-columns:72px 1fr auto;
  gap:16px;
  align-items:start;
  padding:18px;
  border-radius:24px;
  background:linear-gradient(180deg,rgba(255,255,255,.10),rgba(255,255,255,.06));
  border:1px solid rgba(255,255,255,.12);
  box-shadow:0 14px 28px rgba(0,0,0,.22);
}

.rank-num{
  font-size:2rem;
  font-weight:900;
  line-height:1;
  color:#fde68a;
  text-align:center;
  padding-top:2px;
}

.rank-content h3{
  margin:0 0 8px;
  font-size:1.18rem;
}

.rank-content h3 a{
  color:#fff;
  text-decoration:none;
}

.rank-content h3 a:hover{
  text-decoration:underline;
}

.rank-meta{
  color:#dbe4f0;
  font-size:.92rem;
  margin-bottom:8px;
}

.rank-bio{
  color:#cbd5e1;
  line-height:1.55;
}

.rank-actions{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  justify-content:flex-end;
}

@media (max-width: 860px){
  .rank-item{
    grid-template-columns:1fr;
  }

  .rank-num{
    text-align:left;
  }

  .rank-actions{
    justify-content:flex-start;
  }
}