:root{
  --bg1:#0b1020;
  --bg2:#121a33;
  --card: rgba(255,255,255,.07);
  --stroke: rgba(255,255,255,.14);
  --text: rgba(255,255,255,.92);
  --muted: rgba(255,255,255,.95);
  --glow: rgba(255,210,102,.28);
  --glow2: rgba(122,197,255,.22);
  --accent2:#7ac5ff;
}

body{
  background: radial-gradient(1200px 800px at 15% 10%, var(--glow2), transparent 55%),
              radial-gradient(900px 600px at 85% 20%, var(--glow), transparent 55%),
              linear-gradient(180deg, var(--bg1), var(--bg2));
  color: var(--text);
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  min-height: 100vh;
}

.navbar{
  background: rgba(0,0,0,.18);
  border-bottom: 1px solid rgba(255,255,255,.08);
  backdrop-filter: blur(10px);
}

.brand-script{
  font-family: Satisfy, cursive;
  font-size: 1.35rem;
  letter-spacing: .5px;
}
.brand-strong{
  font-weight: 800;
  letter-spacing: .2px;
  opacity: .95;
}

.bg-glow{
  position: fixed;
  inset: -40px;
  pointer-events:none;
  background: radial-gradient(700px 500px at 30% 20%, rgba(255,210,102,.10), transparent 60%),
              radial-gradient(900px 700px at 75% 65%, rgba(122,197,255,.08), transparent 62%);
  filter: blur(10px);
  z-index: -1;
}

.glass{
  background: var(--card);
  border: 1px solid var(--stroke);
  border-radius: 22px;
  box-shadow: 0 18px 40px rgba(0,0,0,.35);
  backdrop-filter: blur(10px);
}

/* Ensure all text in glass cards uses theme colors */
.glass,
.glass * {
  color: var(--text);
}

/* Specific fix for tier section readability */
.glass .h5,
.glass .fw-700,
.glass .tier-bubble {
  color: var(--text) !important;
}

/* Make small muted text in tier rows more readable */
.tier-row .small.text-muted {
  color: rgba(255,255,255,.98) !important;
  opacity: 1 !important;
}

/* Make footer text in glass cards more readable */
.glass .mt-3.small.text-muted,
.glass .text-muted.small {
  color: rgba(255,255,255,1) !important;
  opacity: 1 !important;
  font-weight: 500;
}

/* Fix all muted text on admin pages for better readability */
.text-muted {
  color: rgba(255,255,255,.98) !important;
}

/* Make small text more readable everywhere */
small,
.form-label,
.stat {
  color: rgba(255,255,255,.96) !important;
}

.hero{
  border-radius: 28px;
  background: linear-gradient(135deg, rgba(255,210,102,.10), rgba(122,197,255,.09));
  border: 1px solid rgba(255,255,255,.12);
  box-shadow: 0 22px 55px rgba(0,0,0,.38);
  position: relative;
  overflow: hidden;
}

.hero:before{
  content:"";
  position:absolute;
  inset:-2px;
  background: radial-gradient(500px 300px at 10% 10%, rgba(255,255,255,.14), transparent 55%),
              radial-gradient(600px 380px at 90% 40%, rgba(255,255,255,.10), transparent 55%);
  opacity:.6;
  pointer-events:none;
}

.pill{
  display:inline-block;
  background: rgba(255,255,255,.10);
  border: 1px solid rgba(255,255,255,.12);
  padding: .35rem .65rem;
  border-radius: 999px;
  font-weight: 700;
  font-size: .85rem;
}

.fw-800{ font-weight: 800; }
.fw-700{ font-weight: 700; }

.verse-ref{
  font-size: 1.05rem;
  color: var(--muted);
  font-weight: 600;
}

.support-callout{
  background: rgba(0,0,0,.22);
  border: 1px solid rgba(255,255,255,.10);
  padding: 1rem 1rem;
  border-radius: 18px;
}
.support-title{ font-weight: 800; }
.support-body{ color: var(--muted); }
.support-body a{ color: var(--accent2); text-decoration: none; }
.support-body a:hover{ text-decoration: underline; }

.btn-glow{
  background: linear-gradient(135deg, rgba(255,210,102,.98), rgba(122,197,255,.92));
  border: none;
  color: rgba(0,0,0,.88);
  font-weight: 800;
  border-radius: 14px;
  padding: .65rem 1rem;
  box-shadow: 0 18px 40px rgba(0,0,0,.28);
}
.btn-glow:hover{ transform: translateY(-1px); }

.project-card .accordion-button{
  background: rgba(255,255,255,.04);
  color: var(--text);
}
.accordion-item{
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 14px;
  overflow:hidden;
  margin-bottom:.5rem;
}
.accordion-button:focus{ box-shadow: none; }
.accordion-button:not(.collapsed){
  background: rgba(255,255,255,.08);
  color: var(--text);
}

.icon-badge{
  width: 54px; height: 54px;
  display:flex; align-items:center; justify-content:center;
  border-radius: 18px;
  background: rgba(255,255,255,.09);
  border: 1px solid rgba(255,255,255,.14);
}

.tier-row{
  display:flex;
  align-items:center;
  gap:.75rem;
  padding: .6rem .6rem;
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,.09);
  background: rgba(0,0,0,.18);
  margin-top: .55rem;
}

.tier-bubble{
  width: 44px; height: 44px;
  border-radius: 16px;
  display:flex; align-items:center; justify-content:center;
  background: linear-gradient(135deg, rgba(255,210,102,.18), rgba(122,197,255,.15));
  border: 1px solid rgba(255,255,255,.16);
  font-weight: 900;
}

.footer-card{
  background: rgba(0,0,0,.22);
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 20px;
  padding: 1.2rem 1.2rem;
}

.footer-title{ font-weight: 800; }
.footer-sub{ color: var(--muted); }

.shadow-soft{ box-shadow: 0 12px 30px rgba(0,0,0,.25); }

.tier-edit, .project-admin, .supporter-card{
  background: rgba(0,0,0,.18);
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 18px;
  padding: 1rem;
}

.stat{ color: var(--muted); }

code{
  color: rgba(255,255,255,.88);
  background: rgba(0,0,0,.26);
  padding: .05rem .35rem;
  border-radius: 8px;
}

.form-control, textarea{
  background: rgba(0,0,0,.22) !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  color: var(--text) !important;
  border-radius: 14px;
}

.form-control::placeholder{ color: rgba(255,255,255,.45); }