* { box-sizing: border-box; }
body {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  margin: 0;
  color: #1a1a1a;
  background: #f7f7f8;
}

.auth-page {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 100vh;
  padding: 1.5rem;
}
.auth-card {
  background: white;
  padding: 2.5rem;
  border-radius: 12px;
  box-shadow: 0 2px 12px rgba(0,0,0,0.08);
  width: 340px;
  max-width: 100%;
}
.auth-card h1 { font-size: 1.3rem; margin-bottom: 0.25rem; }
.muted { color: #666; }
.small { font-size: 0.85rem; }
.error { color: #c0392b; font-size: 0.9rem; }
.auth-card form { display: flex; flex-direction: column; gap: 0.9rem; margin-top: 1.2rem; }
.auth-card label { display: flex; flex-direction: column; gap: 0.3rem; font-size: 0.9rem; }
.auth-card input {
  padding: 0.6rem 0.7rem;
  border: 1px solid #ddd;
  border-radius: 6px;
  font-size: 1rem;
}
.auth-card button {
  padding: 0.7rem;
  border: none;
  border-radius: 6px;
  background: #2d6cdf;
  color: white;
  font-size: 1rem;
  cursor: pointer;
}

.dashboard-page {
  user-select: none;
  -webkit-user-select: none;
}
.topbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0.9rem 1.5rem;
  background: white;
  border-bottom: 1px solid #e5e5e5;
  position: sticky;
  top: 0;
  z-index: 10;
}
.topbar a { color: #2d6cdf; text-decoration: none; }
.table-wrap { padding: 1.5rem; overflow-x: auto; }
table { border-collapse: collapse; width: 100%; background: white; }
th, td {
  border: 1px solid #e5e5e5;
  padding: 0.5rem 0.75rem;
  text-align: left;
  font-size: 0.9rem;
  white-space: nowrap;
}
th { background: #fafafa; position: sticky; top: 0; }
.footnote { padding: 0 1.5rem 2rem; font-size: 0.8rem; }

/* Tabbed dashboard */
.tab-nav {
  display: flex;
  align-items: center;
  gap: 0.25rem;
  padding: 0.6rem 1.5rem;
  background: white;
  border-bottom: 1px solid #e5e5e5;
  position: sticky;
  top: 57px;
  z-index: 9;
  flex-wrap: wrap;
}
.tab-btn {
  appearance: none;
  border: none;
  background: transparent;
  padding: 0.7rem 1.1rem;
  font-size: 0.92rem;
  font-weight: 600;
  color: #55606e;
  cursor: pointer;
  border-bottom: 3px solid transparent;
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.tab-btn:hover { color: #0f172a; }
.tab-btn.active {
  color: #0f172a;
  border-bottom-color: #e2472c;
}
.soon-badge {
  background: #f4ead9;
  color: #6b5f4a;
  font-size: 0.65rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  padding: 0.2rem 0.5rem;
  border-radius: 999px;
}

/* Sponsor spotlight slot -- docked to the right of the tabs. Sized for a
   728x90 creative scaled down to fit the tab bar's height. Hidden on
   phone-sized screens entirely per design decision -- there's no good place
   for it in the mobile layout, so it just doesn't show rather than cramping
   things. Named "spotlight" rather than "banner"/"ad" on purpose -- browser
   ad-blockers filter on those words in class names and URLs and will hide
   this even though it's our own first-party content. */
.spotlight-slot {
  margin-left: auto;
  position: relative;
  width: 620px;
  max-width: 55vw;
  height: 68px;
  align-self: center;
}
.spotlight-item { display: none; position: absolute; inset: 0; }
.spotlight-item.active { display: block; }
.spotlight-item img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  border-radius: 6px;
}
@media (max-width: 768px) {
  .spotlight-slot { display: none; }
}

.tab-wrap { padding: 1.25rem 1.5rem 0; }
.tab-panel { display: none; }
.tab-panel.active { display: block; }
/* Wrapper handles horizontal scrolling ourselves -- Chrome and Safari were
   inconsistent about showing the embedded Sheet's OWN internal scrollbar for
   overflow columns at narrower window widths (a cross-origin rendering
   difference we can't fix by styling Google's page directly). Giving the
   iframe a min-width and letting our own wrapper scroll it guarantees the
   same behavior in every browser. */
.sheet-embed-wrap {
  width: 100%;
  overflow-x: auto;
  border-radius: 10px;
  /* Force the horizontal scrollbar to stay visible instead of relying on
     macOS's default "fade out until you touch the trackpad" overlay
     behavior, which made the scroll affordance invisible on Mac even
     though scrolling (via arrow keys or two-finger swipe) still worked.
     Windows already shows a persistent scrollbar by default, so this is
     mainly a Mac fix; it's a no-op on mobile browsers, which use their own
     native touch-scroll indicators regardless of this styling. */
  scrollbar-width: thin; /* Firefox */
  scrollbar-color: #e2472c #f0f0f0; /* Firefox: thumb, track */
}
.sheet-embed-wrap::-webkit-scrollbar {
  height: 10px;
}
.sheet-embed-wrap::-webkit-scrollbar-track {
  background: #f0f0f0;
  border-radius: 10px;
}
.sheet-embed-wrap::-webkit-scrollbar-thumb {
  background: #e2472c;
  border-radius: 10px;
}
.sheet-embed-wrap::-webkit-scrollbar-thumb:hover {
  background: #c93a22;
}
.sheet-embed {
  display: block;
  width: 100%;
  height: 78vh;
  min-height: 520px;
  border: 1px solid #e5e5e5;
  border-radius: 10px;
  background: white;
}
/* min-width per sheet, not a single shared value -- Google's published-HTML
   embed (widget=false) has its own internal horizontal scroll container
   (#sheets-viewport, overflow:auto) whenever the actual table is wider than
   the iframe's rendered width. Trackpad/mouse scroll-chains across that
   inner scrollbar and our own outer wrapper seamlessly, but iOS touch-drag
   does not chain across a cross-origin iframe boundary, so touch users get
   stuck wherever the inner scrollbar's range runs out. Sizing each iframe
   past its real content width eliminates that inner scrollbar entirely,
   leaving a single scroll container that works the same for touch and
   mouse. Widths below were measured directly from each sheet's published
   HTML (summing each column's <th style="width:...px"> from view-source).
   Re-measure and bump these if columns are ever added/widened. */
.sheet-embed-dashboard {
  /* measured: 13 + 90*12 + 60 = 1153px */
  min-width: 1300px;
}
.sheet-embed-conferences {
  /* measured: 97+237+111+76+76+153+153+307+405+139+125+97+111+181 = 2268px */
  min-width: 2450px;
}
.embed-missing { padding: 3rem 1rem; text-align: center; }

/* List View / Sheet View toggle (2026 Conferences tab) */
.view-toggle {
  display: flex;
  gap: 0.5rem;
  margin-bottom: 1rem;
}
.view-btn {
  appearance: none;
  border: 1px solid #e5e5e5;
  background: white;
  color: #55606e;
  font-weight: 600;
  font-size: 0.85rem;
  padding: 0.5rem 1rem;
  border-radius: 999px;
  cursor: pointer;
}
.view-btn.active {
  background: #0f172a;
  border-color: #0f172a;
  color: white;
}
.view-panel { display: none; }
.view-panel.active { display: block; }
/* More specific than the plain .card-list rule below on purpose -- without
   this, .card-list's own "display: flex" ties with .view-panel's "display:
   none" on specificity, and whichever is declared later in the file wins
   regardless of the "active" class, making List View permanently visible
   underneath Sheet View. */
.view-panel.active.card-list { display: flex; }

.card-list { flex-direction: column; gap: 0.75rem; padding-bottom: 1.5rem; }
.conf-card {
  background: white;
  border: 1px solid #e5e5e5;
  border-radius: 10px;
  padding: 0.9rem 1rem;
}
.conf-card summary {
  cursor: pointer;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
}
.conf-card summary::-webkit-details-marker { display: none; }
.conf-card summary::before {
  content: "+ ";
  color: #e2472c;
  font-weight: 800;
  float: right;
}
.conf-card[open] summary::before { content: "\2212 "; }
.conf-name { font-weight: 700; font-size: 1rem; color: #0f172a; }
.conf-meta { font-size: 0.82rem; color: #55606e; }
.conf-body { margin-top: 0.75rem; padding-top: 0.75rem; border-top: 1px solid #f0f0f0; }
.conf-tag {
  display: inline-block;
  background: #f4ead9;
  color: #6b5f4a;
  font-size: 0.7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  padding: 0.25rem 0.6rem;
  border-radius: 999px;
  margin: 0 0.4rem 0.5rem 0;
}
.conf-tag-alt { background: #eef2f7; color: #334155; }
.conf-desc { font-size: 0.9rem; line-height: 1.55; color: #334155; white-space: pre-wrap; margin: 0.5rem 0 0.9rem; }
.conf-register {
  display: inline-block;
  background: linear-gradient(90deg, #f2a24a, #e2472c);
  color: white;
  font-weight: 700;
  font-size: 0.88rem;
  text-decoration: none;
  padding: 0.55rem 1.1rem;
  border-radius: 8px;
}
.coming-soon-card {
  max-width: 560px;
  margin: 3rem auto;
  padding: 2.5rem;
  background: white;
  border: 1px solid #e5e5e5;
  border-radius: 12px;
  text-align: center;
}
.coming-soon-card h2 { margin: 0 0 0.75rem; font-size: 1.3rem; }
.coming-soon-card p { color: #55606e; line-height: 1.6; margin: 0; }

.landing-page {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 100vh;
  padding: 1.5rem;
}
.landing-card {
  background: white;
  padding: 3rem 2.5rem;
  border-radius: 16px;
  box-shadow: 0 4px 24px rgba(0,0,0,0.08);
  width: 480px;
  max-width: 100%;
  text-align: center;
}
.logo-placeholder {
  display: inline-block;
  font-weight: 700;
  font-size: 0.95rem;
  letter-spacing: 0.02em;
  color: #2d6cdf;
  border: 1px solid #2d6cdf;
  border-radius: 6px;
  padding: 0.4rem 0.8rem;
  margin-bottom: 1.5rem;
}
.landing-card h1 { font-size: 1.6rem; margin: 0 0 1rem; }
.landing-subtitle { color: #555; line-height: 1.5; margin-bottom: 2rem; }
.landing-actions {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}
.btn {
  display: block;
  padding: 0.8rem;
  border-radius: 8px;
  text-decoration: none;
  font-weight: 600;
  font-size: 1rem;
}
.btn-primary { background: #2d6cdf; color: white; }
.btn-secondary { background: #f0f2f5; color: #1a1a1a; }

/* Admin tool */
.admin-nav {
  display: flex;
  align-items: center;
  gap: 1.25rem;
  padding: 0.9rem 1.5rem;
  background: white;
  border-bottom: 1px solid #e5e5e5;
}
.admin-nav a { color: #55606e; text-decoration: none; font-weight: 600; font-size: 0.92rem; }
.admin-nav a:hover, .admin-nav a.active { color: #0f172a; }
.admin-nav .admin-nav-title { font-weight: 800; color: #0f172a; margin-right: 0.5rem; }
.admin-nav .admin-nav-spacer { flex: 1; }
.admin-main { max-width: 1100px; margin: 0 auto; padding: 2rem 1.5rem 3rem; }
.admin-main h1 { font-size: 1.4rem; margin: 0 0 1.25rem; }

.stat-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  gap: 1rem;
  margin-bottom: 2rem;
}
.stat-card { background: white; border: 1px solid #e5e5e5; border-radius: 10px; padding: 1.1rem 1.25rem; }
.stat-card .stat-num { font-size: 1.9rem; font-weight: 800; color: #0f172a; line-height: 1; }
.stat-card .stat-label { color: #666; font-size: 0.85rem; margin-top: 0.35rem; }

.admin-toolbar { display: flex; justify-content: space-between; align-items: center; gap: 1rem; margin-bottom: 1rem; flex-wrap: wrap; }
.admin-toolbar input[type="search"] {
  padding: 0.5rem 0.75rem;
  border: 1px solid #ddd;
  border-radius: 6px;
  font-size: 0.9rem;
  min-width: 220px;
}

.tag {
  display: inline-block;
  padding: 0.2rem 0.6rem;
  border-radius: 999px;
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.02em;
}
.tag-paypal { background: #eaf1fd; color: #2d6cdf; }
.tag-admin { background: #fdf0e2; color: #b8660f; }
.tag-navigator { background: #eef2f7; color: #334155; }
.tag-active { background: #e6f7ed; color: #1a7a42; }
.tag-inactive { background: #fdeceb; color: #c0392b; }
.tag-pending { background: #f0f0f0; color: #666; }

.admin-form { background: white; border: 1px solid #e5e5e5; border-radius: 10px; padding: 1.5rem; max-width: 480px; }
.admin-form label { display: flex; flex-direction: column; gap: 0.3rem; font-size: 0.9rem; margin-bottom: 1rem; }
.admin-form input {
  padding: 0.6rem 0.7rem;
  border: 1px solid #ddd;
  border-radius: 6px;
  font-size: 1rem;
}
.admin-form .form-actions { display: flex; gap: 0.75rem; align-items: center; margin-top: 1.25rem; }
.admin-form .btn { display: inline-block; width: auto; padding: 0.65rem 1.25rem; cursor: pointer; border: none; font-size: 0.95rem; }
.btn-danger { background: #c0392b; color: white; }

.admin-table-actions { display: flex; gap: 0.6rem; }
.admin-table-actions a, .admin-table-actions button {
  font-size: 0.85rem;
  color: #2d6cdf;
  background: none;
  border: none;
  padding: 0;
  cursor: pointer;
  text-decoration: underline;
  font-family: inherit;
}
.admin-table-actions .danger { color: #c0392b; }
.pagination { display: flex; gap: 0.5rem; align-items: center; margin-top: 1rem; font-size: 0.9rem; }
.pagination a, .pagination span { padding: 0.3rem 0.6rem; border-radius: 6px; text-decoration: none; color: #2d6cdf; }
.pagination .current { background: #0f172a; color: white; }
.detail-label { font-weight: 600; color: #55606e; width: 220px; background: #fafafa; }

@media print {
  body::before {
    content: "Printing is disabled for this content.";
    display: block;
    font-size: 1.5rem;
    padding: 3rem;
  }
  .topbar, .table-wrap, .footnote, .tab-nav, .tab-wrap { display: none !important; }
}