*{box-sizing:border-box}html,body{margin:0;padding:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif;background:#0b0c10;color:#e5e7eb}
header{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;border-bottom:1px solid #1f2937;background:#111827;position:sticky;top:0;z-index:10}
h1{margin:0;font-size:18px;color:#fff}
nav button{margin-left:8px}
button{appearance:none;border:1px solid #374151;background:#111827;color:#e5e7eb;padding:8px 12px;border-radius:10px;cursor:pointer}
button.accent{background:#2563eb;border-color:#1d4ed8;color:white}
button.hidden{display:none}
main{display:grid;grid-template-columns:1fr;gap:16px;padding:16px;max-width:1100px;margin:0 auto}
.panel{background:#111827;border:1px solid #1f2937;border-radius:16px;padding:16px;box-shadow:0 2px 10px rgba(0,0,0,.25)}
.image-wrap{width:100%;aspect-ratio:16/9;background:#111317;border-radius:12px;overflow:hidden;display:flex;align-items:center;justify-content:center}
.image-wrap img{width:100%;height:100%;object-fit:cover;display:block}
#map{width:100%;height:440px;border-radius:12px;overflow:hidden}
.notice{padding:12px;border:1px dashed #374151;border-radius:8px;background:#0f172a;color:#cbd5e1}
.hidden{display:none}
footer{padding:16px;text-align:center;color:#9ca3af}
dialog{border:none;border-radius:12px;padding:0}
.dialog-form{padding:16px;background:#111827;color:#e5e7eb;border:1px solid #1f2937;border-radius:12px}
label input{width:100%;padding:10px;margin-top:6px;border-radius:8px;border:1px solid #374151;background:#0b0c10;color:#e5e7eb}
.muted{color:#9ca3af;font-size:12px}
/* Two-up layout above the cam */
.duo {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  max-width: 1100px;
  margin: 0 auto 8px auto;
}
@media (max-width: 900px) {
  .duo { grid-template-columns: 1fr; }
}

/* Info cards */
.infocard {
  background:#111827;
  border:1px solid #1f2937;
  border-radius:16px;
  padding:16px;
  box-shadow:0 2px 10px rgba(0,0,0,.25);
  text-align:left;
}
.infocard h3 { margin:0 0 8px 0; font-size:18px; }
.infocard .facts { margin:8px 0 0 0; padding-left:18px; }
.infocard .facts li { margin:4px 0; }
.clickable { cursor:pointer; }
.linklike { color:#60a5fa; text-decoration:underline; font-size:14px; }

/* Dialog tweaks */
.rules-list { margin: 8px 0 12px 22px; }
.dialog-actions { display:flex; justify-content:flex-end; gap:8px; }