/*
 * CARE in Neuromodulation (tenant "carens") — its own look. No dark mode (the dashboard is always light).
 *
 * Loaded only by Carens' own server and by a local multi-tenant dev server (src/app/layout.tsx); IFPC's
 * server never loads it. Every rule sits under .carens-ui, which only Carens pages carry:
 *   .carens-ui    <html> on Carens' server; locally the Carens pages (/t/carens…, ?tenant=carens) and a Carens dashboard
 *   .carens-home  the public home page        (t/[tenant]/tenant-home.tsx)
 *   .carens-login the login page              (auth/login/legacy-login-page.tsx)
 *   .carens-dash  the signed-in dashboard     (dashboard/dashboard-tenant-wrapper.tsx)
 *
 * Looks only: colour, gradients, shadows, gradient borders (only where a border already exists), corner radius,
 * hover and press feedback. No margin, padding, size, display, grid or flex, and no type size, weight, tracking,
 * case or wrapping changes (they change text widths): every element stays exactly where it is. Decoration lives in
 * absolutely placed ::before / ::after layers (never a section's own ::before, which the page uses as a divider).
 * Screen only: printed ID cards, certificates and receipts are untouched.
 *
 * Design "Neural Aurora": the tenant's teal (#0f766e) and blue carried into a teal → cyan → indigo spectrum; night
 * surfaces (#04191d → #0a1a33: the hero's light, gallery, footer, login panel, dashboard sidebar) lit by aurora glows,
 * alternating with airy mint-white bands; white glass cards with spectrum hairline edges; soft dot fields.
 */

@keyframes cr-progress { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@keyframes cr-sheen { from { transform: translateX(-130%) skewX(-20deg); } to { transform: translateX(330%) skewX(-20deg); } }

@media screen {

/* ═══════════════════════════════════════════════════════════════════════════
   Tokens
   ═══════════════════════════════════════════════════════════════════════════ */

.carens-ui {
  --cr-ink: #0a1c26;
  --cr-teal-800: #0b524c;
  --cr-teal-700: #0f766e;
  --cr-teal-600: #0d9488;
  --cr-teal-500: #14b8a6;
  --cr-teal-400: #2dd4bf;
  --cr-teal-300: #5eead4;
  --cr-teal-200: #99f6e4;
  --cr-teal-50: #f0fdfa;
  --cr-hair: rgba(15, 118, 110, 0.10);

  /* The spectrum, in three strengths. */
  --cr-spectrum: linear-gradient(90deg, #14b8a6 0%, #0ea5e9 50%, #6366f1 100%);
  --cr-brand: linear-gradient(135deg, #0d9488 0%, #0e7490 50%, #3730a3 115%);
  --cr-brand-bright: linear-gradient(135deg, #14b8a6 0%, #0ea5e9 55%, #6366f1 115%);
  --cr-ring: linear-gradient(135deg, rgba(20, 184, 166, 0.55), rgba(14, 165, 233, 0.32) 50%, rgba(99, 102, 241, 0.5));
  --cr-ring-soft: linear-gradient(135deg, rgba(20, 184, 166, 0.30), rgba(255, 255, 255, 0.9) 45%, rgba(99, 102, 241, 0.26));
  --cr-ink-text: linear-gradient(180deg, #0a1c26 20%, #0f5f59 100%);

  --cr-shadow-1: 0 1px 2px rgba(4, 35, 40, 0.05), 0 8px 20px -10px rgba(4, 35, 40, 0.16);
  --cr-shadow-2: 0 2px 4px rgba(4, 35, 40, 0.04), 0 24px 48px -26px rgba(4, 35, 40, 0.38);
  --cr-shadow-3: 0 4px 10px rgba(4, 35, 40, 0.05), 0 36px 70px -30px rgba(4, 35, 40, 0.45);
  --cr-glow: 0 12px 30px -10px rgba(13, 148, 136, 0.6);
  --cr-ease: cubic-bezier(0.22, 1, 0.36, 1);

  /* Shared component colours (buttons, inputs, tabs, badges, dialogs) in Carens' palette. */
  --background: #f4f9f8;
  --foreground: #0a1c26;
  --card: #ffffff;
  --card-foreground: #0a1c26;
  --popover: #ffffff;
  --popover-foreground: #0a1c26;
  --primary: #0f766e;
  --primary-foreground: #ffffff;
  --secondary: #e8f6f3;
  --secondary-foreground: #0b3b37;
  --muted: #edf5f3;
  --muted-foreground: #526b73;
  --accent: #e1f5f0;
  --accent-foreground: #0b524c;
  --border: #d6e7e3;
  --input: #cde0dc;
  --ring: #14b8a6;
  --sidebar-primary: #0f766e;
  --sidebar-ring: #14b8a6;
  --medical-teal: #0f766e;

  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

.carens-ui ::selection { background: rgba(20, 184, 166, 0.24); }
html.carens-ui { scrollbar-color: rgba(13, 148, 136, 0.4) transparent; }

/* ═══════════════════════════════════════════════════════════════════════════
   Shared controls (dashboard, dialogs, event pages)
   ═══════════════════════════════════════════════════════════════════════════ */

/* Primary buttons: the spectrum with a lit top edge; instant press feedback. */
.carens-ui :is(button, a).bg-primary.text-primary-foreground {
  background-image: var(--cr-brand);
  box-shadow: 0 10px 24px -12px rgba(13, 148, 136, 0.8), inset 0 1px 0 rgba(255, 255, 255, 0.24);
  transition: filter 0.2s ease, box-shadow 0.25s var(--cr-ease), transform 0.12s ease-out;
}
.carens-ui :is(button, a).bg-primary.text-primary-foreground:hover {
  filter: brightness(1.08) saturate(1.08);
  box-shadow: 0 14px 30px -12px rgba(13, 148, 136, 0.85), inset 0 1px 0 rgba(255, 255, 255, 0.28);
}
.carens-ui :is(button, a).bg-primary.text-primary-foreground:active { transform: scale(0.97); }

/* Fields: a crisp white well, a teal halo on focus. */
.carens-ui :is(input, textarea).border-input,
.carens-ui button[role="combobox"].border-input {
  border-color: rgba(15, 118, 110, 0.18);
  box-shadow: inset 0 1px 2px rgba(4, 35, 40, 0.05);
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.carens-ui :is(input, textarea).border-input:hover,
.carens-ui button[role="combobox"].border-input:hover { border-color: rgba(13, 148, 136, 0.36); }
.carens-ui :is(input, textarea).border-input:focus-visible,
.carens-ui button[role="combobox"].border-input:focus { border-color: #14b8a6; box-shadow: 0 0 0 4px rgba(20, 184, 166, 0.18); }

/* Tabs: a tinted track; the chosen tab lifts out in white with a spectrum underline. */
.carens-ui [role="tablist"].bg-muted { background: linear-gradient(180deg, #e9f4f2, #e3f0ee); box-shadow: inset 0 1px 2px rgba(4, 35, 40, 0.08); }
.carens-ui [role="tab"][data-state="active"] {
  color: var(--cr-teal-800);
  box-shadow: 0 1px 2px rgba(4, 35, 40, 0.08), 0 8px 16px -10px rgba(13, 148, 136, 0.55), inset 0 -2px 0 #14b8a6;
}

/* Dialogs, menus and pickers (they open at the end of the page, under <html class="carens-ui">). */
.carens-ui .fixed.inset-0.bg-black\/60 {
  background-color: rgba(3, 19, 23, 0.55);
  -webkit-backdrop-filter: blur(8px) saturate(140%);
  backdrop-filter: blur(8px) saturate(140%);
}
.carens-ui :is([role="dialog"], [role="alertdialog"]).bg-white\/95 {
  background: linear-gradient(180deg, #ffffff, #f7fcfb) padding-box, var(--cr-ring) border-box;
  border-color: transparent;
  box-shadow: 0 50px 100px -30px rgba(4, 35, 40, 0.55), 0 0 0 6px rgba(20, 184, 166, 0.05);
}
.carens-ui [data-radix-popper-content-wrapper] > :is([role="menu"], [role="listbox"], [role="dialog"]) {
  border-color: var(--cr-hair);
  box-shadow: 0 0 0 1px rgba(15, 118, 110, 0.05), var(--cr-shadow-2);
}
.carens-ui :is([role="menuitem"], [role="option"])[data-highlighted] { background-color: #e3f6f1; color: var(--cr-teal-800); }

/* Register buttons on every Carens page: the bright spectrum instead of plain green. */
.carens-ui :is(button[style*="#10b981"], button[style*="rgb(16, 185, 129)"]) {
  background: var(--cr-brand-bright) !important;
  box-shadow: 0 12px 28px -12px rgba(14, 165, 233, 0.75), inset 0 1px 0 rgba(255, 255, 255, 0.32) !important;
}
.carens-ui :is(button[style*="#10b981"], button[style*="rgb(16, 185, 129)"]):active { transform: scale(0.97); }

/* ═══════════════════════════════════════════════════════════════════════════
   Public home — rhythm: night hero · airy events · mint committee · research ·
   night gallery · about · contact · night footer
   ═══════════════════════════════════════════════════════════════════════════ */

.carens-home { background-color: #f4f9f8; }

/* ── Top bar: frosted glass, spectrum hairline, a reading-progress line ───── */
.carens-home > header.sticky {
  background-color: rgba(255, 255, 255, 0.74);
  -webkit-backdrop-filter: blur(24px) saturate(190%);
  backdrop-filter: blur(24px) saturate(190%);
  border-bottom-color: transparent;
  box-shadow: 0 1px 0 rgba(15, 118, 110, 0.07), 0 18px 40px -30px rgba(4, 35, 40, 0.45);
}
.carens-home > header.sticky.bg-white\/90 { background-color: rgba(255, 255, 255, 0.86); }
.carens-home > header.sticky::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -1px;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(20, 184, 166, 0.7) 20%, rgba(14, 165, 233, 0.7) 50%, rgba(99, 102, 241, 0.7) 80%, transparent);
  pointer-events: none;
}
@supports (animation-timeline: scroll()) {
  .carens-home > header.sticky::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -1px;
    height: 2px;
    background: var(--cr-spectrum);
    transform-origin: left center;
    animation: cr-progress linear both;
    animation-timeline: scroll(root);
    pointer-events: none;
    z-index: 1;
  }
}
.carens-home > header a.group > div[style] {
  background: var(--cr-brand-bright) !important;
  box-shadow: 0 8px 18px -6px rgba(14, 165, 233, 0.6), 0 0 0 3px rgba(20, 184, 166, 0.12), inset 0 1px 0 rgba(255, 255, 255, 0.35);
}
.carens-home > header a.group > span {
  background: linear-gradient(90deg, #0a1c26 0%, #0f766e 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
  text-shadow: none !important;
}
/* Menu: each link gets a soft teal capsule under it on hover (drawn behind, so nothing moves). */
.carens-home > header nav.hidden a {
  position: relative;
  isolation: isolate;
  color: #3f5962;
  transition: color 0.2s ease;
}
.carens-home > header nav.hidden a::before {
  content: "";
  position: absolute;
  inset: -7px -12px;
  z-index: -1;
  border-radius: 999px;
  background: linear-gradient(180deg, rgba(240, 253, 250, 0.95), rgba(204, 251, 241, 0.7));
  box-shadow: inset 0 0 0 1px rgba(20, 184, 166, 0.22), 0 6px 14px -8px rgba(13, 148, 136, 0.5);
  opacity: 0;
  transform: scale(0.86);
  transition: opacity 0.2s ease, transform 0.3s var(--cr-ease);
}
.carens-home > header nav.hidden a:hover { color: var(--cr-teal-800); }
.carens-home > header nav.hidden a:hover::before { opacity: 1; transform: scale(1); }
.carens-home > header a > button[style] {
  position: relative;
  overflow: hidden;
  background: var(--cr-brand-bright) !important;
  box-shadow: 0 10px 24px -10px rgba(14, 165, 233, 0.75), 0 0 0 4px rgba(20, 184, 166, 0.1), inset 0 1px 0 rgba(255, 255, 255, 0.3) !important;
}
.carens-home > header a > button[style]::after,
.carens-home #hero .hero-stagger-4 button.bg-emerald-500::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 40%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.45), transparent);
  transform: translateX(-130%) skewX(-20deg);
  pointer-events: none;
}
.carens-home > header a > button[style]:hover::after,
.carens-home #hero .hero-stagger-4 button.bg-emerald-500:hover::after { animation: cr-sheen 0.9s var(--cr-ease); }
.carens-home > header a > button[style]:active { transform: scale(0.97); }
.carens-home > header button[aria-label="Toggle menu"]:hover { background-color: var(--cr-teal-50); color: var(--cr-teal-700); }
.carens-home > header .border-t.bg-white\/95 { border-top-color: var(--cr-hair); background-color: rgba(255, 255, 255, 0.92); }
.carens-home > header nav.flex-col a { color: #3d5660; }
.carens-home > header nav.flex-col a:hover { background: linear-gradient(90deg, #ecfdf8, #f0f9ff); color: var(--cr-teal-800); }

/* ── Hero: the photo toned into the brand (teal → indigo), aurora light, a neural dot field ── */
.carens-home #hero > img { filter: saturate(0.75) contrast(1.08); }
.carens-home #hero > img + div {
  background:
    radial-gradient(55% 45% at 50% 34%, rgba(45, 212, 191, 0.20), transparent 70%),
    linear-gradient(135deg, rgba(3, 40, 40, 0.88) 0%, rgba(5, 42, 56, 0.74) 45%, rgba(24, 30, 82, 0.86) 100%) !important;
}
.carens-home #hero::after {
  content: "";
  position: absolute;
  inset: -10%;
  z-index: 1;
  pointer-events: none;
  background:
    radial-gradient(32% 42% at 10% 18%, rgba(45, 212, 191, 0.55), transparent 70%),
    radial-gradient(28% 38% at 90% 22%, rgba(56, 189, 248, 0.42), transparent 70%),
    radial-gradient(38% 34% at 72% 96%, rgba(129, 140, 248, 0.42), transparent 70%),
    radial-gradient(30% 30% at 22% 92%, rgba(20, 184, 166, 0.3), transparent 70%);
  filter: blur(36px);
  mix-blend-mode: screen;
  opacity: 0.8;
}
.carens-home #hero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background-image: radial-gradient(rgba(153, 246, 228, 0.32) 1px, transparent 1.6px);
  background-size: 24px 24px;
  -webkit-mask-image: radial-gradient(70% 62% at 50% 44%, #000 0%, transparent 85%);
  mask-image: radial-gradient(70% 62% at 50% 44%, #000 0%, transparent 85%);
  opacity: 0.55;
}
.carens-home .hero-particle { background: rgba(165, 243, 252, 0.75); box-shadow: 0 0 12px rgba(45, 212, 191, 0.9), 0 0 2px #fff; }

.carens-home #hero .hero-stagger-1 > span {
  background-color: rgba(6, 40, 46, 0.5);
  border-color: rgba(94, 234, 212, 0.5);
  color: #e6fffb;
  box-shadow: 0 10px 30px -12px rgba(45, 212, 191, 0.55);
}
.carens-home #hero .hero-stagger-1 > span > span { background-color: var(--cr-teal-300); box-shadow: 0 0 12px var(--cr-teal-400); }

.carens-home #hero .rounded-2xl.bg-white\/95 {
  background-color: rgba(255, 255, 255, 0.97);
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.8), 0 0 0 7px rgba(153, 246, 228, 0.14), 0 0 50px -6px rgba(45, 212, 191, 0.45), 0 30px 60px -20px rgba(0, 0, 0, 0.65) !important;
}

.carens-home #hero h1 {
  background: linear-gradient(100deg, #ffffff 0%, #f0fdfa 30%, #99f6e4 62%, #a5b4fc 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
  text-shadow: none !important;
  filter: drop-shadow(0 8px 30px rgba(0, 0, 0, 0.5));
}
.carens-home #hero .hero-stagger-2 .bg-emerald-400 { background: var(--cr-spectrum); box-shadow: 0 0 16px rgba(45, 212, 191, 0.85); }
.carens-home #hero .hero-stagger-2 .bg-gradient-to-r.to-emerald-400 { background: linear-gradient(90deg, transparent, var(--cr-teal-300)); }
.carens-home #hero .hero-stagger-2 .bg-gradient-to-l.to-emerald-400 { background: linear-gradient(270deg, transparent, #a5b4fc); }
.carens-home #hero .hero-stagger-2 .text-\[11px\] { background-color: rgba(255, 255, 255, 0.08); border-color: rgba(153, 246, 228, 0.22); color: rgba(230, 255, 251, 0.85); }
.carens-home #hero .hero-stagger-2 .border-blue-400\/30 {
  background: linear-gradient(135deg, rgba(4, 47, 46, 0.8), rgba(23, 37, 84, 0.84)) !important;
  border-color: rgba(125, 211, 252, 0.55) !important;
  -webkit-backdrop-filter: blur(14px) !important;
  backdrop-filter: blur(14px) !important;
  box-shadow: 0 16px 36px -14px rgba(56, 189, 248, 0.6), inset 0 1px 0 rgba(255, 255, 255, 0.12) !important;
}
.carens-home #hero .hero-stagger-3 { color: rgba(226, 247, 243, 0.88); }

.carens-home #hero .hero-stagger-4 button.bg-emerald-500 {
  position: relative;
  overflow: hidden;
  background: var(--cr-brand-bright) !important;
  box-shadow: 0 18px 40px -14px rgba(14, 165, 233, 0.85), 0 0 0 1px rgba(165, 243, 252, 0.35) inset, inset 0 1px 0 rgba(255, 255, 255, 0.4) !important;
}
.carens-home #hero .hero-stagger-4 button.border-white\/30 {
  background-color: rgba(255, 255, 255, 0.07);
  border-color: rgba(153, 246, 228, 0.5);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.16), 0 12px 30px -16px rgba(0, 0, 0, 0.5);
}
.carens-home #hero .hero-stagger-4 button.border-white\/30:hover { background-color: rgba(255, 255, 255, 0.15); border-color: rgba(153, 246, 228, 0.8); }
.carens-home #hero .hero-stagger-4 button:active { transform: scale(0.97); }

/* Registration status pill: dark glass with a teal edge ("opens on…"); open / closing soon keep their colours. */
.carens-home #hero .hero-stagger-5 > :is(div[style*="#3b82f6"], div[style*="rgb(59, 130, 246)"]) {
  background: linear-gradient(135deg, rgba(6, 40, 50, 0.78), rgba(14, 30, 70, 0.78)) !important;
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
  box-shadow: inset 0 0 0 1.5px rgba(94, 234, 212, 0.55), 0 14px 34px -12px rgba(56, 189, 248, 0.6) !important;
}
.carens-home #hero .hero-stagger-5 > :is(div[style*="#3b82f6"], div[style*="rgb(59, 130, 246)"]) > span:first-child { background: var(--cr-teal-300); box-shadow: 0 0 10px var(--cr-teal-400); }

/* Countdown: frosted tiles with a teal edge; figures glow. */
.carens-home #hero :is(.bg-white\/15.backdrop-blur-md, .bg-slate-900.border-slate-700) {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0.03)) !important;
  border-color: rgba(153, 246, 228, 0.45) !important;
  -webkit-backdrop-filter: blur(16px) saturate(160%);
  backdrop-filter: blur(16px) saturate(160%);
  box-shadow: 0 20px 40px -16px rgba(0, 0, 0, 0.7), 0 0 30px -10px rgba(45, 212, 191, 0.45);
}
.carens-home #hero .tabular-nums {
  background: linear-gradient(180deg, #ffffff 35%, #99f6e4 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
  text-shadow: none !important;
  filter: drop-shadow(0 0 12px rgba(94, 234, 212, 0.45));
}
.carens-home #hero .text-center > p.uppercase.tracking-wider { color: var(--cr-teal-200); }
.carens-home #hero span.animate-pulse.font-bold { color: rgba(153, 246, 228, 0.7); }

/* Yearly figures. */
.carens-home #hero [data-scroll-reveal] > p.font-extrabold {
  background: linear-gradient(180deg, #ffffff 30%, #7dd3fc 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
  text-shadow: none !important;
}
.carens-home #hero [data-scroll-reveal] > p.font-medium { color: rgba(204, 251, 241, 0.75); }
.carens-home #hero .w-px.h-10 { background: linear-gradient(180deg, transparent, rgba(153, 246, 228, 0.7), transparent); }
.carens-home #hero > div.absolute.bottom-0.h-24 { background: linear-gradient(to bottom, rgba(238, 247, 246, 0), #eef7f6) !important; }

/* ── Upcoming events: an airy band — mint-white with aurora corners ───────── */
.carens-home #events.bg-slate-900 {
  background:
    radial-gradient(45% 70% at 100% 0%, rgba(45, 212, 191, 0.16), transparent 65%),
    radial-gradient(40% 60% at 0% 100%, rgba(99, 102, 241, 0.10), transparent 65%),
    linear-gradient(180deg, #eef7f6 0%, #f6fbfa 100%);
}
.carens-home #events .bg-slate-700\/30 { background-color: rgba(14, 165, 233, 0.08); }
.carens-home #events .bg-emerald-500\/5 { background-color: rgba(20, 184, 166, 0.08); }
.carens-home #events p.text-slate-400 { color: #5b7179; }
.carens-home #events span.h-8[style] { background: linear-gradient(180deg, #14b8a6, #6366f1) !important; box-shadow: 0 0 14px rgba(20, 184, 166, 0.45); }
.carens-home #events span.h-7[style] { background: var(--cr-brand-bright) !important; box-shadow: 0 6px 16px -6px rgba(14, 165, 233, 0.7), inset 0 1px 0 rgba(255, 255, 255, 0.35); }
.carens-home #events p.text-emerald-400 { color: var(--cr-teal-700); }
.carens-home #events .rounded-full.border-white\/20 { border-color: rgba(15, 118, 110, 0.22); color: var(--cr-ink); background-color: rgba(255, 255, 255, 0.7); box-shadow: var(--cr-shadow-1); }
.carens-home #events .rounded-full.border-white\/20:hover { background-color: #ffffff; border-color: rgba(13, 148, 136, 0.45); }
.carens-home #events .bg-slate-600 { background-color: #c9dad7; }
.carens-home #events .bg-emerald-400 { background: var(--cr-spectrum); }
.carens-home #events .bg-slate-700 { background-color: #d6e6e3; }
.carens-home #events .absolute.left-0.w-16[style] { background: linear-gradient(to right, #f1f8f7, transparent) !important; }
.carens-home #events .absolute.right-0.w-16[style] { background: linear-gradient(to left, #f1f8f7, transparent) !important; }
.carens-home #events > svg path { fill: #f7fbfb; }

/* Event cards: a photo window floating on the light band — teal edge, deep soft shadow, teal bloom on hover. */
.carens-home #events .group.rounded-2xl.cursor-pointer {
  border-radius: 24px;
  border-color: rgba(94, 234, 212, 0.35) !important;
  box-shadow: 0 0 0 4px rgba(255, 255, 255, 0.7), 0 40px 80px -36px rgba(4, 35, 40, 0.6), 0 20px 40px -30px rgba(14, 165, 233, 0.4) !important;
  transition: transform 0.45s var(--cr-ease), box-shadow 0.45s var(--cr-ease), border-color 0.3s ease;
}
.carens-home #events .group.rounded-2xl.cursor-pointer:hover {
  border-color: rgba(94, 234, 212, 0.7) !important;
  box-shadow: 0 0 0 4px rgba(255, 255, 255, 0.85), 0 50px 90px -36px rgba(4, 35, 40, 0.65), 0 0 70px -20px rgba(20, 184, 166, 0.55) !important;
}
.carens-home #events .group.rounded-2xl.cursor-pointer > .absolute.inset-0 > .absolute.inset-0[style] {
  background:
    radial-gradient(60% 90% at 100% 0%, rgba(45, 212, 191, 0.25), transparent 60%),
    linear-gradient(115deg, rgba(3, 30, 32, 0.92) 0%, rgba(4, 40, 52, 0.72) 48%, rgba(24, 30, 82, 0.8) 100%) !important;
}
.carens-home #events .group.rounded-2xl.cursor-pointer h3 {
  background: linear-gradient(100deg, #ffffff 0%, #ccfbf1 60%, #c7d2fe 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
  text-shadow: none !important;
}
.carens-home #events .group.rounded-2xl.cursor-pointer .bg-white\/95 { box-shadow: 0 12px 28px -10px rgba(0, 0, 0, 0.6), 0 0 0 3px rgba(153, 246, 228, 0.3); }
.carens-home #events .group.rounded-2xl.cursor-pointer .text-emerald-300 { color: var(--cr-teal-300); }
.carens-home #events .group.rounded-2xl.cursor-pointer :is(.text-2xl, .text-3xl).font-extrabold.text-white {
  background: linear-gradient(180deg, #ffffff 30%, #99f6e4 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
  text-shadow: none !important;
}
.carens-home #events .group.rounded-2xl.cursor-pointer button.bg-white\/10 { border-color: rgba(153, 246, 228, 0.45); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12); }
.carens-home #events .group.rounded-2xl.cursor-pointer .h-2.rounded-full.bg-white\/15 { background-color: rgba(255, 255, 255, 0.12); box-shadow: inset 0 0 0 1px rgba(153, 246, 228, 0.12); }

/* ── Section headings on light bands: ink fading into teal; eyebrow pills with a spectrum edge ── */
.carens-home section:not(#hero):not(#gallery) h2.font-extrabold {
  background: var(--cr-ink-text);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
  text-shadow: none !important;
}
.carens-home section span.rounded-full.mb-4.px-5 {
  background: linear-gradient(180deg, #ffffff, #effcf8) padding-box, linear-gradient(90deg, #2dd4bf, #38bdf8, #818cf8) border-box !important;
  border-color: transparent !important;
  color: var(--cr-teal-800);
  box-shadow: 0 10px 22px -12px rgba(14, 165, 233, 0.55);
}
.carens-home section span.rounded-full.mb-4.px-5 > svg { color: var(--cr-teal-600) !important; }

/* ── Organising committee: mint band with aurora corners ─────────────────── */
.carens-home #committee {
  background:
    radial-gradient(40% 45% at 0% 0%, rgba(45, 212, 191, 0.14), transparent 70%),
    radial-gradient(40% 45% at 100% 100%, rgba(56, 189, 248, 0.12), transparent 70%),
    linear-gradient(180deg, #f7fbfb, #f2f9f8);
}
.carens-home #committee > div.h-1[style] { background: var(--cr-spectrum) !important; }
.carens-home #committee div.inline-flex.rounded-full.text-white[style] {
  background: var(--cr-brand-bright) !important;
  box-shadow: 0 12px 28px -10px rgba(14, 165, 233, 0.6), 0 0 0 4px rgba(20, 184, 166, 0.1), inset 0 1px 0 rgba(255, 255, 255, 0.3) !important;
}
.carens-home #committee .bg-emerald-500 { background: var(--cr-spectrum); box-shadow: 0 0 10px rgba(20, 184, 166, 0.5); }
.carens-home #committee .bg-emerald-300 { background-color: rgba(94, 234, 212, 0.7); }
.carens-home #committee .grid > div.rounded-2xl.text-white[style] {
  border-radius: 22px;
  background:
    radial-gradient(80% 120% at 100% 0%, rgba(94, 234, 212, 0.45), transparent 55%),
    radial-gradient(70% 100% at 0% 100%, rgba(99, 102, 241, 0.45), transparent 60%),
    linear-gradient(135deg, #0b524c 0%, #0e7490 50%, #312e81 100%) !important;
  box-shadow: 0 30px 60px -28px rgba(14, 116, 144, 0.8), 0 0 0 1px rgba(153, 246, 228, 0.25) inset, inset 0 1px 0 rgba(255, 255, 255, 0.25) !important;
}
.carens-home #committee .grid > div.rounded-2xl.text-white[style] .bg-white\/20 { background: rgba(255, 255, 255, 0.16); box-shadow: inset 0 0 0 1px rgba(204, 251, 241, 0.35); }
.carens-home #committee .grid > div.rounded-2xl.border[style] {
  border-radius: 22px;
  background: linear-gradient(160deg, #ffffff 0%, #f3f6ff 100%) padding-box, linear-gradient(135deg, rgba(56, 189, 248, 0.6), rgba(99, 102, 241, 0.55)) border-box !important;
  border-color: transparent !important;
  box-shadow: var(--cr-shadow-2) !important;
}
.carens-home #committee .bg-white.rounded-xl.border-l-4 {
  border-radius: 16px;
  border-top-color: rgba(15, 118, 110, 0.08) !important;
  border-right-color: rgba(15, 118, 110, 0.08) !important;
  border-bottom-color: rgba(15, 118, 110, 0.08) !important;
  background: linear-gradient(180deg, #ffffff, #fbfefd);
  box-shadow: var(--cr-shadow-1);
  transition: transform 0.35s var(--cr-ease), box-shadow 0.35s var(--cr-ease);
}
.carens-home #committee .bg-white.rounded-xl.border-l-4:hover { box-shadow: var(--cr-shadow-2), 0 0 0 5px rgba(20, 184, 166, 0.08); }
.carens-home #committee .bg-white.rounded-xl.border-l-4 > .rounded-full[style] {
  background: var(--cr-brand-bright) !important;
  box-shadow: 0 0 0 3px #ffffff, 0 0 0 4.5px rgba(20, 184, 166, 0.35), 0 8px 16px -6px rgba(14, 165, 233, 0.6);
}
.carens-home #committee .bg-white.rounded-xl.border-l-4 p.font-semibold { color: var(--cr-ink); }
.carens-home #committee span.rounded-full.uppercase[style] {
  background: linear-gradient(180deg, #ffffff, #edfaf7) !important;
  color: var(--cr-teal-800) !important;
  box-shadow: inset 0 0 0 1px rgba(20, 184, 166, 0.3), 0 6px 14px -8px rgba(13, 148, 136, 0.45);
}
.carens-home #committee .h-0\.5.flex-1[style*="to right"] { background: linear-gradient(to right, transparent, rgba(20, 184, 166, 0.55)) !important; }
.carens-home #committee .h-0\.5.flex-1[style*="to left"] { background: linear-gradient(to left, transparent, rgba(99, 102, 241, 0.45)) !important; }

/* ── Glass cards with a spectrum hairline (research, contact, about features) ── */
.carens-home :is(#research .group.rounded-2xl, #contact .group.bg-slate-50, #about .group.bg-white.rounded-2xl) {
  border-radius: 22px;
  background: linear-gradient(180deg, #ffffff 0%, #f8fcfb 100%) padding-box, var(--cr-ring-soft) border-box;
  border-color: transparent;
  box-shadow: inset 0 1px 0 #ffffff, var(--cr-shadow-2);
}
.carens-home :is(#research .group.rounded-2xl, #contact .group.bg-slate-50, #about .group.bg-white.rounded-2xl):hover {
  background: linear-gradient(180deg, #ffffff 0%, #f6fcfb 100%) padding-box, var(--cr-ring) border-box;
  box-shadow: inset 0 1px 0 #ffffff, 0 40px 80px -34px rgba(13, 148, 136, 0.5), 0 0 0 6px rgba(20, 184, 166, 0.06);
}
/* Their icons sit in filled spectrum tiles. */
.carens-home :is(#research .group .w-14.h-14, #contact .group .w-14.h-14, #about .group .w-16.h-16) {
  background: var(--cr-brand-bright);
  border-color: transparent;
  box-shadow: 0 12px 24px -10px rgba(14, 165, 233, 0.65), inset 0 1px 0 rgba(255, 255, 255, 0.35);
}
.carens-home :is(#research .group .w-14.h-14, #contact .group .w-14.h-14, #about .group .w-16.h-16) svg { color: #ffffff; }

/* ── Research ─────────────────────────────────────────────────────────────── */
.carens-home #research {
  background:
    radial-gradient(35% 50% at 100% 30%, rgba(99, 102, 241, 0.08), transparent 70%),
    radial-gradient(35% 50% at 0% 70%, rgba(45, 212, 191, 0.1), transparent 70%),
    linear-gradient(180deg, #f2f9f8 0%, #f7fbfb 100%) !important;
}
.carens-home #research .group.rounded-2xl > .absolute.top-0.h-1 { background: var(--cr-spectrum); }
.carens-home #research .group.rounded-2xl h3 { color: var(--cr-ink); }
.carens-home #research .group.rounded-2xl .bg-emerald-50 { background: linear-gradient(90deg, #ecfdf5, #f0f9ff); border-color: rgba(20, 184, 166, 0.3); color: var(--cr-teal-800); }

/* ── Gallery: a night band so the photographs glow ────────────────────────── */
.carens-home #gallery {
  background:
    radial-gradient(45% 60% at 10% 0%, rgba(45, 212, 191, 0.2), transparent 65%),
    radial-gradient(45% 60% at 95% 100%, rgba(99, 102, 241, 0.24), transparent 65%),
    linear-gradient(180deg, #04191d 0%, #061f28 55%, #0b1a35 100%) !important;
}
.carens-home #gallery h2 {
  background: linear-gradient(100deg, #ffffff 0%, #ccfbf1 55%, #c7d2fe 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
  text-shadow: none !important;
}
.carens-home #gallery .text-muted-foreground { color: rgba(204, 251, 241, 0.72); }
.carens-home #gallery h3 { color: #e6fffb; }
.carens-home #gallery span.rounded-full.mb-4.px-5 {
  background: rgba(6, 40, 46, 0.7) !important;
  border-color: rgba(94, 234, 212, 0.5) !important;
  color: #ccfbf1;
  box-shadow: 0 10px 26px -12px rgba(45, 212, 191, 0.6);
}
.carens-home #gallery span.rounded-full.mb-4.px-5 > svg { color: var(--cr-teal-300) !important; }
.carens-home #gallery [role="button"].rounded-xl {
  border-radius: 18px;
  box-shadow: 0 0 0 1px rgba(153, 246, 228, 0.22), 0 30px 60px -26px rgba(0, 0, 0, 0.8);
}
.carens-home #gallery [role="button"].rounded-xl:hover { box-shadow: 0 0 0 1.5px rgba(94, 234, 212, 0.75), 0 0 60px -12px rgba(45, 212, 191, 0.55), 0 30px 60px -26px rgba(0, 0, 0, 0.85); }
.carens-home #gallery [role="button"].rounded-xl .bg-gradient-to-t.from-black\/70 { background: linear-gradient(to top, rgba(3, 25, 29, 0.88), rgba(14, 116, 144, 0.25) 55%, transparent); }
.carens-home #gallery a > button[style] {
  background: rgba(255, 255, 255, 0.06) !important;
  border-color: rgba(94, 234, 212, 0.6) !important;
  color: #ccfbf1 !important;
  box-shadow: 0 14px 30px -14px rgba(45, 212, 191, 0.55);
  transition: background 0.25s ease, box-shadow 0.3s var(--cr-ease), transform 0.3s var(--cr-ease);
}
.carens-home #gallery a > button[style]:hover { background: rgba(45, 212, 191, 0.16) !important; border-color: #5eead4 !important; }
.carens-home #gallery a > button[style]:active { transform: scale(0.97); }

/* ── About ────────────────────────────────────────────────────────────────── */
.carens-home #about {
  background:
    radial-gradient(40% 55% at 0% 30%, rgba(45, 212, 191, 0.12), transparent 70%),
    radial-gradient(35% 50% at 100% 80%, rgba(56, 189, 248, 0.10), transparent 70%),
    linear-gradient(180deg, #f6fbfa 0%, #eef7f5 100%) !important;
}
.carens-home #about .aspect-\[4\/3\] {
  border-radius: 26px;
  box-shadow: 0 0 0 1px rgba(15, 118, 110, 0.12), 0 0 0 9px rgba(255, 255, 255, 0.85), 0 0 0 10px rgba(20, 184, 166, 0.25), 0 50px 90px -40px rgba(4, 35, 40, 0.6), 0 0 80px -30px rgba(14, 165, 233, 0.5);
}
.carens-home #about .bg-emerald-500 { background: var(--cr-brand-bright); box-shadow: 0 10px 22px -8px rgba(14, 165, 233, 0.65), inset 0 1px 0 rgba(255, 255, 255, 0.3); }
.carens-home #about span.w-1\.5.h-6 { background: linear-gradient(180deg, #14b8a6, #6366f1); }
.carens-home #about h3.font-extrabold {
  background: var(--cr-ink-text);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
  text-shadow: none !important;
}
.carens-home #about h4 { color: var(--cr-teal-800); }
.carens-home #about .border-t.border-slate-200 { border-top-color: rgba(20, 184, 166, 0.2); }
.carens-home #about p.text-slate-600 { color: #3f5861; }

/* ── Contact ──────────────────────────────────────────────────────────────── */
.carens-home #contact {
  background:
    radial-gradient(40% 35% at 50% 0%, rgba(45, 212, 191, 0.10), transparent 70%),
    linear-gradient(180deg, #ffffff 0%, #f5faf9 100%);
}
.carens-home #contact .group h3 { color: var(--cr-ink); }
.carens-home #contact .bg-white.shadow-lg.border-0 {
  border-radius: 22px;
  box-shadow: 0 0 0 1px rgba(20, 184, 166, 0.18), 0 0 0 6px rgba(255, 255, 255, 0.8), var(--cr-shadow-3);
}
.carens-home #contact .bg-white.shadow-lg.border-0 .w-12.h-12[style] { background: var(--cr-brand-bright) !important; box-shadow: 0 10px 22px -8px rgba(14, 165, 233, 0.6); }
.carens-home #contact .bg-white.shadow-lg.border-0 .w-12.h-12[style] svg { color: #ffffff !important; }
.carens-home #contact .bg-white.shadow-lg.border-0 .bg-muted\/50 { background: linear-gradient(90deg, #f0faf8, #f5f9ff); box-shadow: inset 0 0 0 1px rgba(20, 184, 166, 0.1); }
.carens-home #contact .rounded-2xl.overflow-hidden.shadow-lg.border {
  border-radius: 24px;
  border-color: rgba(20, 184, 166, 0.25);
  box-shadow: 0 0 0 7px rgba(255, 255, 255, 0.85), 0 0 0 8px rgba(20, 184, 166, 0.18), var(--cr-shadow-3);
}

/* ── FAQ (shown once the admin adds questions) ───────────────────────────── */
.carens-home #faq .border-emerald-200 { border-color: rgba(13, 148, 136, 0.3); }
.carens-home #faq :is([style*="#10b981"], [style*="rgb(16, 185, 129)"]) { border-left-color: var(--cr-teal-600) !important; }
.carens-home #faq .bg-emerald-500 { background: var(--cr-brand-bright); }
.carens-home #faq .border-emerald-200.text-emerald-600 { color: var(--cr-teal-700); }

/* ── Footer: the night band again, aurora-lit, with a spectrum hairline ───── */
.carens-home > footer > .relative.bg-white { background-color: #f5faf9; }
.carens-home > footer > .relative.bg-white svg path:first-child { fill: #14b8a6; opacity: 0.35; }
.carens-home > footer > .relative.bg-white svg path:last-child { fill: #04191d; }
.carens-home > footer > div[style] {
  background:
    radial-gradient(45% 80% at 90% 0%, rgba(45, 212, 191, 0.2), transparent 60%),
    radial-gradient(40% 70% at 0% 100%, rgba(99, 102, 241, 0.26), transparent 62%),
    linear-gradient(170deg, #04191d 0%, #062328 50%, #0b1a35 100%) !important;
}
.carens-home > footer > div[style]::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(94, 234, 212, 0.8) 30%, rgba(129, 140, 248, 0.8) 70%, transparent);
}
.carens-home > footer .rounded-full[class*="animate-[float"] { background-color: rgba(94, 234, 212, 0.05); box-shadow: inset 0 0 0 1px rgba(153, 246, 228, 0.06); }
.carens-home > footer .h-12.w-12.rounded-xl { background: var(--cr-brand-bright); border-color: transparent; box-shadow: 0 10px 24px -8px rgba(14, 165, 233, 0.6), inset 0 1px 0 rgba(255, 255, 255, 0.3); }
.carens-home > footer .h-12.w-12.rounded-xl svg { color: #ffffff; }
.carens-home > footer p.font-bold.text-xl {
  background: linear-gradient(90deg, #ffffff, #99f6e4);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
  text-shadow: none !important;
}
.carens-home > footer h4 { color: #99f6e4; }
.carens-home > footer ul a { transition: color 0.2s ease; }
.carens-home > footer ul a:hover { color: #ffffff; }
.carens-home > footer .w-1.h-1.rounded-full { background: var(--cr-teal-300); box-shadow: 0 0 8px rgba(45, 212, 191, 0.9); }
.carens-home > footer :is(.border-t.border-white\/10, .border-t.border-white\/15) { border-top-color: rgba(94, 234, 212, 0.12); }

/* ── Floating controls ────────────────────────────────────────────────────── */
.carens-home .back-to-top-btn {
  background: var(--cr-brand-bright) !important;
  box-shadow: 0 14px 30px -10px rgba(14, 165, 233, 0.75), 0 0 0 4px rgba(255, 255, 255, 0.6), inset 0 1px 0 rgba(255, 255, 255, 0.3);
}
.carens-home .ifpc-sticky-cta { background-color: rgba(255, 255, 255, 0.82); border-top-color: var(--cr-hair); -webkit-backdrop-filter: blur(20px) saturate(180%); backdrop-filter: blur(20px) saturate(180%); }
.carens-home .ifpc-sticky-cta button.bg-emerald-500 {
  background: var(--cr-brand-bright) !important;
  box-shadow: 0 12px 26px -10px rgba(14, 165, 233, 0.75), inset 0 1px 0 rgba(255, 255, 255, 0.3) !important;
}

/* ═══════════════════════════════════════════════════════════════════════════
   The other public pages (events, an event, its registration, gallery)
   ═══════════════════════════════════════════════════════════════════════════ */
.carens-ui header.sticky.border-b {
  border-bottom-color: rgba(15, 118, 110, 0.1);
  -webkit-backdrop-filter: blur(22px) saturate(190%);
  backdrop-filter: blur(22px) saturate(190%);
}
.carens-ui header.sticky a > div:is(.rounded-xl, .rounded-lg)[style] {
  background: var(--cr-brand-bright) !important;
  box-shadow: 0 8px 18px -6px rgba(14, 165, 233, 0.6), inset 0 1px 0 rgba(255, 255, 255, 0.32);
}
.carens-ui header.sticky a > span.font-bold {
  background: linear-gradient(90deg, #0a1c26 0%, #0f766e 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
  text-shadow: none !important;
}
.carens-ui header.sticky ~ section > .absolute.inset-0 > .absolute.inset-0[style] {
  background:
    radial-gradient(50% 70% at 85% 10%, rgba(45, 212, 191, 0.3), transparent 65%),
    linear-gradient(120deg, rgba(3, 30, 32, 0.9) 0%, rgba(4, 40, 52, 0.7) 50%, rgba(24, 30, 82, 0.82) 100%) !important;
}
.carens-ui header.sticky ~ section h1.font-extrabold.text-white {
  background: linear-gradient(100deg, #ffffff 0%, #ccfbf1 55%, #c7d2fe 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
  text-shadow: none !important;
}
.carens-ui header.sticky ~ section .bg-white\/15.border-white\/20.rounded-2xl {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0.03));
  border-color: rgba(153, 246, 228, 0.45);
  box-shadow: 0 20px 40px -16px rgba(0, 0, 0, 0.65), 0 0 30px -10px rgba(45, 212, 191, 0.4);
}
.carens-ui header.sticky ~ section button.bg-white.text-slate-900 { box-shadow: 0 18px 40px -14px rgba(45, 212, 191, 0.6), 0 0 0 4px rgba(153, 246, 228, 0.25); }
.carens-ui header.sticky ~ section span.h-8.w-1\.5[style] { background: linear-gradient(180deg, #14b8a6, #6366f1) !important; }
.carens-ui header.sticky ~ section span.h-7.rounded-full[style] { background: var(--cr-brand-bright) !important; box-shadow: 0 6px 16px -6px rgba(14, 165, 233, 0.6); }

/* Full gallery page (/t/carens/gallery): a night masthead and glowing photo tiles. */
.carens-ui header.sticky.border-slate-200\/50 + div.text-center[style] {
  background:
    radial-gradient(45% 80% at 10% 0%, rgba(45, 212, 191, 0.22), transparent 65%),
    radial-gradient(45% 80% at 95% 100%, rgba(99, 102, 241, 0.26), transparent 65%),
    linear-gradient(180deg, #04191d 0%, #061f28 55%, #0b1a35 100%) !important;
}
.carens-ui header.sticky.border-slate-200\/50 + div.text-center[style] h2 {
  background: linear-gradient(100deg, #ffffff 0%, #ccfbf1 55%, #c7d2fe 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
  text-shadow: none !important;
}
.carens-ui header.sticky.border-slate-200\/50 + div.text-center[style] .text-muted-foreground { color: rgba(204, 251, 241, 0.75); }
.carens-ui header.sticky.border-slate-200\/50 + div.text-center[style] button.bg-white { background-color: rgba(255, 255, 255, 0.06); border-color: rgba(153, 246, 228, 0.3); color: #ccfbf1; }
.carens-ui header.sticky.border-slate-200\/50 + div.text-center[style] button.bg-white:hover { background-color: rgba(45, 212, 191, 0.14); border-color: rgba(153, 246, 228, 0.6); }
.carens-ui header.sticky.border-slate-200\/50 + div.text-center[style] button[style] { background: var(--cr-brand-bright) !important; box-shadow: 0 10px 26px -10px rgba(14, 165, 233, 0.75), inset 0 1px 0 rgba(255, 255, 255, 0.3); }
.carens-ui header.sticky.border-slate-200\/50 ~ div .group.relative.aspect-square.rounded-xl {
  border-radius: 18px;
  box-shadow: 0 0 0 1px rgba(15, 118, 110, 0.1), var(--cr-shadow-2);
}
.carens-ui header.sticky.border-slate-200\/50 ~ div .group.relative.aspect-square.rounded-xl:hover { box-shadow: 0 0 0 1.5px rgba(20, 184, 166, 0.55), 0 30px 60px -26px rgba(13, 148, 136, 0.55); }

/* ═══════════════════════════════════════════════════════════════════════════
   Login
   ═══════════════════════════════════════════════════════════════════════════ */
.carens-login {
  background:
    radial-gradient(55% 45% at 85% 8%, rgba(45, 212, 191, 0.14), transparent 65%),
    radial-gradient(45% 40% at 75% 100%, rgba(99, 102, 241, 0.10), transparent 65%),
    #f4f9f8;
}
.carens-login > .login-noise {
  background:
    radial-gradient(70% 60% at 8% 15%, rgba(20, 184, 166, 0.55) 0%, transparent 55%),
    radial-gradient(60% 60% at 90% 85%, rgba(99, 102, 241, 0.5) 0%, transparent 55%),
    radial-gradient(40% 40% at 60% 45%, rgba(56, 189, 248, 0.18) 0%, transparent 60%),
    linear-gradient(135deg, #031317 0%, #062126 45%, #0b1a35 100%) !important;
}
.carens-login > .login-noise::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background-image: radial-gradient(rgba(153, 246, 228, 0.26) 1px, transparent 1.6px);
  background-size: 24px 24px;
  -webkit-mask-image: radial-gradient(70% 60% at 35% 50%, #000, transparent 80%);
  mask-image: radial-gradient(70% 60% at 35% 50%, #000, transparent 80%);
  opacity: 0.5;
}
.carens-login .bg-purple-500\/15 { background-color: rgba(56, 189, 248, 0.16); }
.carens-login > .login-noise .shadow-premium-lg { box-shadow: 0 0 0 3px rgba(153, 246, 228, 0.3), 0 0 0 9px rgba(153, 246, 228, 0.08), 0 0 40px -6px rgba(45, 212, 191, 0.55), 0 18px 40px -14px rgba(0, 0, 0, 0.6); }
.carens-login > .login-noise h1 > span { background-image: linear-gradient(90deg, #5eead4, #38bdf8 55%, #a5b4fc); }
.carens-login > .login-noise .rounded-full.bg-white\/\[0\.08\] { background-color: rgba(255, 255, 255, 0.05); border-color: rgba(153, 246, 228, 0.28); }
.carens-login .glass-card {
  border-radius: 24px;
  background: linear-gradient(180deg, #ffffff, #f8fcfb) padding-box, var(--cr-ring) border-box !important;
  border-color: transparent !important;
  box-shadow: 0 50px 90px -40px rgba(4, 35, 40, 0.5), 0 0 0 8px rgba(20, 184, 166, 0.05), 0 0 80px -30px rgba(14, 165, 233, 0.45) !important;
}
.carens-login main h1 {
  background: var(--cr-ink-text);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
  text-shadow: none !important;
}
.carens-login main .bg-primary\/5 { background: linear-gradient(180deg, #ffffff, #effcf8) padding-box, linear-gradient(90deg, #2dd4bf, #38bdf8, #818cf8) border-box; border-color: transparent; }
.carens-login button.h-12.rounded-xl[style] {
  background: var(--cr-brand-bright) !important;
  box-shadow: 0 16px 34px -14px rgba(14, 165, 233, 0.8), inset 0 1px 0 rgba(255, 255, 255, 0.3) !important;
}
.carens-login button.h-12.rounded-xl[style]:active { transform: scale(0.98); }

/* ═══════════════════════════════════════════════════════════════════════════
   Dashboard — Carens' own: aurora-night sidebar, aurora mint canvas, glass panels with spectrum edges
   (IFPC's is navy and gold on soft grey; nothing here is shared with it)
   ═══════════════════════════════════════════════════════════════════════════ */

/* Canvas */
.carens-dash .min-h-screen:has(> aside) {
  background:
    radial-gradient(45% 40% at 100% 0%, rgba(45, 212, 191, 0.16), transparent 70%),
    radial-gradient(35% 45% at 18% 30%, rgba(56, 189, 248, 0.09), transparent 70%),
    radial-gradient(40% 40% at 70% 100%, rgba(99, 102, 241, 0.09), transparent 70%),
    #f2f8f7;
  background-attachment: fixed;
}

/* ── Sidebar ─────────────────────────────────────────────────────────────── */
.carens-dash aside.fixed {
  background:
    radial-gradient(130% 40% at 0% 0%, rgba(45, 212, 191, 0.28), transparent 60%),
    radial-gradient(110% 40% at 100% 100%, rgba(99, 102, 241, 0.32), transparent 62%),
    linear-gradient(180deg, #031417 0%, #052226 45%, #0b1a35 100%);
  scrollbar-color: rgba(94, 234, 212, 0.25) transparent;
}
.carens-dash aside.fixed > div.absolute.right-0 { background: linear-gradient(180deg, rgba(94, 234, 212, 0.6), rgba(56, 189, 248, 0.25) 50%, rgba(129, 140, 248, 0.4)) !important; }
.carens-dash aside.fixed > div.h-16 { border-bottom-color: rgba(94, 234, 212, 0.1); background: linear-gradient(180deg, rgba(255, 255, 255, 0.04), transparent); }
.carens-dash aside .rounded-full.bg-white.shadow-lg { box-shadow: 0 0 0 2px rgba(94, 234, 212, 0.5), 0 0 0 6px rgba(94, 234, 212, 0.1), 0 0 24px -2px rgba(45, 212, 191, 0.5); }
.carens-dash aside .rounded-full.shadow-lg[style] { background: var(--cr-brand-bright) !important; }
.carens-dash aside.fixed > div.h-16 h1 {
  background: linear-gradient(90deg, #ffffff, #99f6e4);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
  text-shadow: none !important;
}
.carens-dash aside.fixed > div.h-16 p { color: rgba(153, 246, 228, 0.6); }
.carens-dash aside nav span.text-white\/25 { color: rgba(153, 246, 228, 0.55); }
.carens-dash aside nav .h-\[1px\] { background: linear-gradient(90deg, rgba(94, 234, 212, 0.28), rgba(129, 140, 248, 0.12), transparent); }
.carens-dash aside nav a.text-white\/50 { color: rgba(214, 240, 236, 0.7); }
.carens-dash aside nav a.text-white\/50:hover { color: #ffffff; background: linear-gradient(90deg, rgba(94, 234, 212, 0.12), rgba(94, 234, 212, 0.02)); }
.carens-dash aside nav a[style] {
  background: linear-gradient(90deg, rgba(45, 212, 191, 0.3) 0%, rgba(56, 189, 248, 0.14) 60%, rgba(129, 140, 248, 0.06)) !important;
  box-shadow: inset 0 0 0 1px rgba(153, 246, 228, 0.22), 0 10px 26px -14px rgba(45, 212, 191, 0.9);
}
.carens-dash aside nav a[style] > span.absolute { background: linear-gradient(180deg, #5eead4, #38bdf8, #818cf8) !important; box-shadow: 0 0 12px rgba(45, 212, 191, 0.95) !important; }
.carens-dash aside nav a[style] > svg { color: #99f6e4 !important; filter: drop-shadow(0 0 7px rgba(45, 212, 191, 0.75)) !important; }
.carens-dash aside nav a:active { transform: scale(0.98); }
.carens-dash aside :is(button, a).bg-white\/\[0\.06\] { background-color: rgba(255, 255, 255, 0.05); border-color: rgba(94, 234, 212, 0.18); }
.carens-dash aside :is(button, a).bg-white\/\[0\.06\]:hover { background-color: rgba(94, 234, 212, 0.1); }
.carens-dash aside .bg-slate-800 { background-color: #072b31; border-color: rgba(94, 234, 212, 0.16); }
.carens-dash aside .p-3.border-t { border-top-color: rgba(94, 234, 212, 0.1); }
.carens-dash aside .p-3.border-t button.text-white\/40 { color: rgba(214, 240, 236, 0.6); }
.carens-dash aside .p-3.border-t button.text-white\/40:hover { color: #ffffff; background-color: rgba(94, 234, 212, 0.09); }
.carens-dash aside .p-3.border-t button.hover\:text-red-300:hover { color: #fda4af; background-color: rgba(244, 63, 94, 0.12); }
.carens-dash .fixed.inset-0.bg-black\/70 { background-color: rgba(2, 14, 17, 0.6); }

/* ── Top bar: glass, a spectrum hairline, a reading-progress line ────────── */
.carens-dash header.fixed {
  background-color: rgba(246, 251, 250, 0.72);
  border-bottom-color: transparent;
  -webkit-backdrop-filter: blur(22px) saturate(190%);
  backdrop-filter: blur(22px) saturate(190%);
  box-shadow: 0 16px 36px -30px rgba(4, 35, 40, 0.5);
}
.carens-dash header.fixed > div.absolute.bottom-0[style] { background: linear-gradient(90deg, rgba(20, 184, 166, 0.8), rgba(14, 165, 233, 0.55) 45%, rgba(99, 102, 241, 0.4) 75%, transparent) !important; }
@supports (animation-timeline: scroll()) {
  .carens-dash header.fixed::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -1px;
    height: 2px;
    background: var(--cr-spectrum);
    transform-origin: left center;
    animation: cr-progress linear both;
    animation-timeline: scroll(root);
    pointer-events: none;
  }
}
.carens-dash header input.bg-muted\/50 {
  background-color: #ffffff;
  border-color: rgba(15, 118, 110, 0.14);
  box-shadow: inset 0 1px 2px rgba(4, 35, 40, 0.05), 0 6px 16px -12px rgba(4, 35, 40, 0.3);
}
.carens-dash header input.bg-muted\/50:focus { border-color: var(--cr-teal-500); box-shadow: 0 0 0 4px rgba(20, 184, 166, 0.16); }
.carens-dash header button[aria-label="Notifications"] span[style]:not(.animate-ping) { background: var(--cr-brand-bright) !important; box-shadow: 0 4px 12px -2px rgba(14, 165, 233, 0.6) !important; }
.carens-dash header button[aria-label="Notifications"] span.animate-ping[style] { background: rgba(45, 212, 191, 0.35) !important; }
.carens-dash header .ring-2[style] { box-shadow: 0 0 0 2px #ffffff, 0 0 0 3.5px rgba(20, 184, 166, 0.6), 0 6px 14px -6px rgba(14, 165, 233, 0.6) !important; }
.carens-dash header .ring-2[style] > span[style] { background: var(--cr-brand-bright) !important; }

/* ── Page title: ink → teal, the last word in the spectrum, a glowing underline ── */
.carens-dash .section-heading {
  background: var(--cr-ink-text);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
  text-shadow: none !important;
}
.carens-dash .section-heading .v3-accent {
  background: linear-gradient(100deg, #0d9488 0%, #0ea5e9 55%, #6366f1 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
  text-shadow: none !important;
}
.carens-dash main .h-1.w-16.rounded-full[style] { background: var(--cr-spectrum) !important; box-shadow: 0 4px 14px -3px rgba(14, 165, 233, 0.7); }

/* ── Welcome banner: aurora over teal → indigo, neural dots, a lit edge ──── */
.carens-dash .v3-greet {
  border-radius: 26px;
  background:
    radial-gradient(70% 130% at 100% 0%, rgba(94, 234, 212, 0.45), transparent 55%),
    radial-gradient(55% 110% at 0% 100%, rgba(129, 140, 248, 0.5), transparent 60%),
    radial-gradient(40% 80% at 55% 50%, rgba(56, 189, 248, 0.25), transparent 70%),
    linear-gradient(135deg, #064e48 0%, #0e7490 50%, #312e81 100%) !important;
  box-shadow: 0 36px 70px -34px rgba(14, 116, 144, 0.85), 0 0 0 1px rgba(153, 246, 228, 0.25) inset, inset 0 1px 0 rgba(255, 255, 255, 0.25);
}
.carens-dash .v3-greet::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background-image: radial-gradient(rgba(204, 251, 241, 0.38) 1px, transparent 1.6px);
  background-size: 22px 22px;
  -webkit-mask-image: linear-gradient(100deg, transparent 30%, #000 100%);
  mask-image: linear-gradient(100deg, transparent 30%, #000 100%);
  opacity: 0.6;
}
.carens-dash .v3-greet h1 {
  background: linear-gradient(100deg, #ffffff 0%, #ecfeff 50%, #a5f3fc 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
  text-shadow: none !important;
}
.carens-dash .v3-greet .bg-white\/20 { background-color: rgba(255, 255, 255, 0.14); box-shadow: inset 0 0 0 1px rgba(153, 246, 228, 0.55); }

/* ── Panels and cards: white glass, spectrum hairline edge, deep soft shadow ── */
.carens-dash main :is(.rounded-2xl, .rounded-xl).border-2.border-slate-100 {
  background: linear-gradient(180deg, #ffffff, #fafdfc) padding-box, var(--cr-ring-soft) border-box;
  border-color: transparent;
  box-shadow: inset 0 1px 0 #ffffff, 0 2px 4px rgba(4, 35, 40, 0.03), 0 22px 44px -30px rgba(4, 35, 40, 0.4);
}
.carens-dash main :is(.rounded-2xl, .rounded-xl).border-2.border-slate-100:is(.hover\:shadow-xl, .hover\:shadow-lg):hover {
  background: linear-gradient(180deg, #ffffff, #f8fcfb) padding-box, var(--cr-ring) border-box;
  box-shadow: inset 0 1px 0 #ffffff, 0 36px 64px -30px rgba(13, 148, 136, 0.5), 0 0 0 5px rgba(20, 184, 166, 0.06);
}
.carens-dash main .bg-card.border { border-color: rgba(20, 184, 166, 0.16); box-shadow: inset 0 1px 0 #ffffff, var(--cr-shadow-2); }
.carens-dash main .dashboard-card { border-color: rgba(20, 184, 166, 0.14); box-shadow: var(--cr-shadow-1); }
.carens-dash main .dashboard-card:hover { border-color: rgba(13, 148, 136, 0.3); box-shadow: var(--cr-shadow-2); }

/* Stat cards: each card's own colour bar along the top, always shown (it used to appear only on hover). */
.carens-dash main .grid > .group.relative.overflow-hidden.border-2 > .absolute.top-0.h-\[3px\] { opacity: 1; box-shadow: 0 2px 10px -2px rgba(4, 35, 40, 0.25); }
.carens-dash main .grid > .group.relative.overflow-hidden.border-2 > p.font-extrabold {
  background: var(--cr-ink-text);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
  text-shadow: none !important;
}
.carens-dash main .grid > .group.relative.overflow-hidden.border-2 .rounded-xl.text-white[style] { box-shadow: 0 10px 22px -8px rgba(4, 35, 40, 0.35), inset 0 1px 0 rgba(255, 255, 255, 0.35) !important; }

/* Panel heads' small icon tiles. */
.carens-dash main .rounded-lg.text-white.shadow-md[style] { box-shadow: 0 8px 18px -8px rgba(4, 35, 40, 0.45), inset 0 1px 0 rgba(255, 255, 255, 0.35); }

/* Tables */
.carens-dash main table thead tr { background: linear-gradient(90deg, #eef9f6, #f1f6fd); }
.carens-dash main table thead th { color: #46636b; }
.carens-dash main table tbody tr { transition: background-color 0.15s ease; }
.carens-dash main table tbody tr:hover { background-color: rgba(20, 184, 166, 0.06); }
.carens-dash main .dashboard-table th { background: #eef9f6; color: #46636b; border-bottom-color: rgba(15, 118, 110, 0.1); }

/* ═══════════════════════════════════════════════════════════════════════════
   Comfort settings
   ═══════════════════════════════════════════════════════════════════════════ */
@media (prefers-reduced-motion: reduce) {
  .carens-home > header nav.hidden a::before { transition: opacity 0.2s ease; transform: none; }
  .carens-ui :is(button, a):active { transform: none !important; }
  .carens-home .hero-particle { animation: none; opacity: 0.4; }
  .carens-home :is(header a > button[style], #hero .hero-stagger-4 button.bg-emerald-500):hover::after { animation: none; }
  .carens-home #events .group.rounded-2xl.cursor-pointer,
  .carens-home #committee .bg-white.rounded-xl.border-l-4 { transition: box-shadow 0.2s ease, border-color 0.2s ease; }
}
@media (prefers-reduced-transparency: reduce) {
  .carens-home > header.sticky, .carens-home > header.sticky.bg-white\/90, .carens-home .ifpc-sticky-cta { background-color: #ffffff; -webkit-backdrop-filter: none; backdrop-filter: none; }
  .carens-dash header.fixed { background-color: #f6fbfa; -webkit-backdrop-filter: none; backdrop-filter: none; }
}
@media (prefers-contrast: more) {
  .carens-home #hero > img + div { background: rgba(3, 19, 23, 0.82) !important; }
  .carens-dash aside nav a.text-white\/50 { color: #ffffff; }
}

} /* @media screen */