:root {
  --navy: #0B1F33;
  --brand: #2563EB;
  --brand-dark: #1D4ED8;
  --border: #E2E8F0;
  --muted: #64748B;
  --surface: #FFFFFF;
  --bg: #F8FAFC;
  --ring: rgba(37, 99, 235, .14);
  --shadow-sm: 0 1px 2px rgba(15, 23, 42, .06);
  --shadow-md: 0 18px 50px rgba(15, 23, 42, .10);
}

* {
  box-sizing: border-box
}

html {
  -webkit-text-size-adjust: 100%
}

body {
  overflow-x: hidden;
  font-family: "Open Sans", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif
}

a {
  transition: color .18s ease, background-color .18s ease, border-color .18s ease, transform .18s ease, box-shadow .18s ease
}

button,
input,
textarea,
select {
  font: inherit
}

img,
svg,
video {
  max-width: 100%;
  height: auto
}

.brand-mark {
  display: grid;
  height: 2.75rem;
  width: 2.75rem;
  place-items: center;
  border-radius: 14px;
  background: var(--navy);
  color: #fff;
  box-shadow: var(--shadow-sm)
}

.brand-mark-sm {
  height: 1.85rem;
  width: 1.85rem;
  border-radius: 10px;
  display: inline-grid;
  vertical-align: middle;
  flex: 0 0 auto
}

.brand-logo {
  display: block;
  height: auto;
  max-width: 100%
}

.brand-logo-wordmark {
  height: 2.25rem;
  width: auto;
  max-width: min(230px, 48vw)
}

.brand-logo-sidebar {
  height: 2rem;
  width: auto;
  max-width: 190px
}

.dash-icon {
  display: inline-grid;
  height: 1.65rem;
  width: 1.65rem;
  place-items: center;
  flex: 0 0 auto;
  border-radius: 10px;
  color: #64748B
}

.dash-link-active .dash-icon {
  background: #DBEAFE;
  color: var(--brand-dark)
}

.dash-link:hover .dash-icon {
  background: #F1F5F9;
  color: #0F172A
}

.icon-soft {
  display: grid;
  height: 2.6rem;
  width: 2.6rem;
  place-items: center;
  border-radius: 14px;
  background: #EFF6FF;
  color: var(--brand)
}

.status-icon {
  display: inline-grid;
  height: 2rem;
  width: 2rem;
  place-items: center;
  border-radius: 999px;
  flex: 0 0 auto
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0
}

.skip-link {
  position: fixed;
  left: 1rem;
  top: .75rem;
  z-index: 9999;
  transform: translateY(-160%);
  border-radius: 10px;
  background: var(--navy);
  color: #fff;
  padding: .7rem 1rem;
  font-weight: 900;
  box-shadow: var(--shadow-md)
}

.skip-link:focus {
  transform: translateY(0);
  outline: 3px solid #93C5FD;
  outline-offset: 3px
}

:focus-visible {
  outline: 3px solid #93C5FD;
  outline-offset: 3px;
  border-radius: 8px
}

.btn-primary,
.btn-secondary,
.btn-danger,
.btn-ghost {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  border-radius: 10px;
  padding: .68rem 1rem;
  font-size: .875rem;
  font-weight: 800;
  line-height: 1;
  transition: .18s ease;
  white-space: nowrap;
  touch-action: manipulation
}

.btn-primary {
  background: var(--brand);
  color: #fff
}

.btn-primary:hover {
  background: var(--brand-dark);
  transform: translateY(-1px)
}

.btn-secondary {
  background: #fff;
  color: #0F172A;
  border: 1px solid var(--border)
}

.btn-secondary:hover {
  border-color: #CBD5E1;
  background: #F8FAFC
}

.btn-danger {
  background: #DC2626;
  color: #fff
}

.btn-danger:hover {
  background: #B91C1C
}

.btn-ghost {
  background: transparent;
  color: #334155
}

.btn-ghost:hover {
  background: #F1F5F9;
  color: #0F172A
}

.card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: 1.5rem;
  box-shadow: var(--shadow-sm)
}

.card-premium {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 20px;
  padding: 1.5rem;
  box-shadow: var(--shadow-md)
}

.input,
.textarea,
.select,
.form-input {
  width: 100%;
  border: 2px solid #CBD5E1;
  border-radius: 10px;
  background: #fff;
  font-size: .875rem;
  outline: none;
  transition: .15s ease;
  color: #0F172A
}

.input,
.select,
.form-input {
  height: 46px;
  padding: 0 .9rem
}

.textarea {
  min-height: 120px;
  padding: .8rem;
  resize: vertical
}

.input:focus,
.textarea:focus,
.select:focus,
.form-input:focus {
  border-color: var(--brand);
  box-shadow: 0 0 0 3px var(--ring)
}

.input[disabled],
.textarea[disabled],
.select[disabled] {
  background: #F8FAFC;
  color: #94A3B8;
  cursor: not-allowed
}

.label,
.form-label {
  display: block;
  margin-bottom: .45rem;
  font-size: .875rem;
  font-weight: 800;
  color: #0F172A
}

.helper {
  margin-top: .35rem;
  font-size: .75rem;
  color: #64748B;
  line-height: 1.5
}

.section-title {
  font-size: 1rem;
  font-weight: 900;
  color: var(--navy);
  letter-spacing: -.01em
}

.badge {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  border-radius: 999px;
  padding: .25rem .65rem;
  font-size: .75rem;
  font-weight: 800;
  text-transform: capitalize;
  background: #EFF6FF;
  color: #2563EB;
  line-height: 1.35;
  white-space: nowrap
}

.badge-new {
  background: #EFF6FF;
  color: #2563EB
}

.badge-reviewed {
  background: #F5F3FF;
  color: #7C3AED
}

.badge-invoice_sent,
.badge-awaiting_payment,
.badge-sent,
.badge-pending {
  background: #FFFBEB;
  color: #B45309
}

.badge-paid,
.badge-successful {
  background: #ECFDF5;
  color: #15803D
}

.badge-in_progress {
  background: #E0F2FE;
  color: #0369A1
}

.badge-completed {
  background: #DCFCE7;
  color: #166534
}

.badge-cancelled,
.badge-failed {
  background: #FEF2F2;
  color: #B91C1C
}

.badge-abandoned,
.badge-reversed {
  background: #F8FAFC;
  color: #475569;
  border: 1px solid #CBD5E1
}

.table-wrap {
  overflow-x: auto;
  border-radius: 14px;
  border: 1px solid var(--border);
  background: #fff;
  -webkit-overflow-scrolling: touch
}

.table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  font-size: .875rem;
  min-width: 720px
}

.table th {
  text-align: left;
  color: #64748B;
  font-size: .75rem;
  text-transform: uppercase;
  letter-spacing: .04em;
  font-weight: 900;
  padding: .9rem 1rem;
  border-bottom: 1px solid var(--border);
  background: #F8FAFC;
  white-space: nowrap
}

.table td {
  padding: 1rem;
  border-bottom: 1px solid #EEF2F7;
  vertical-align: top;
  color: #334155
}

.table tr:last-child td {
  border-bottom: 0
}

.table tr:hover td {
  background: #FBFDFF
}

.nav-link {
  position: relative
}

.nav-link:after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -8px;
  height: 2px;
  border-radius: 99px;
  background: var(--brand);
  opacity: 0;
  transform: scaleX(.6);
  transition: .18s
}

.nav-link:hover {
  color: var(--brand)
}

.nav-link:hover:after {
  opacity: 1;
  transform: scaleX(1)
}

.mobile-menu-button {
  display: inline-grid;
  height: 44px;
  width: 44px;
  place-items: center;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: #fff;
  color: #0F172A
}

.mobile-menu-button [data-mobile-menu-icon] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.mobile-nav-item {
  display: flex;
  align-items: center;
  min-height: 44px;
  border-radius: 12px;
  padding: .65rem .8rem
}

.mobile-nav-item:hover {
  background: #F1F5F9;
  color: var(--brand)
}

.dash-link {
  display: flex;
  align-items: center;
  gap: .75rem;
  border-radius: 12px;
  padding: .8rem .9rem;
  color: #475569
}

.dash-link:hover {
  background: #F1F5F9;
  color: #0F172A
}

.dash-link-active {
  background: #EFF6FF;
  color: var(--brand-dark)
}

.mobile-tab {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  border: 1px solid var(--border);
  background: #fff;
  border-radius: 999px;
  padding: .5rem .8rem;
  font-size: .8rem;
  font-weight: 800;
  color: #475569;
  white-space: nowrap
}

.mobile-tab-active {
  background: #EFF6FF;
  border-color: #BFDBFE;
  color: var(--brand-dark)
}

.toast {
  position: fixed;
  right: 1rem;
  top: 1rem;
  z-index: 60;
  max-width: min(28rem, calc(100vw - 2rem));
  border-radius: 14px;
  padding: 1rem 1.1rem;
  font-size: .875rem;
  font-weight: 700;
  box-shadow: 0 18px 50px rgba(15, 23, 42, .18)
}

.toast-success {
  background: #ECFDF5;
  border: 1px solid #BBF7D0;
  color: #166534
}

.toast-error {
  background: #FEF2F2;
  border: 1px solid #FECACA;
  color: #991B1B
}

.metric {
  position: relative;
  overflow: hidden
}

.metric:after {
  content: "";
  position: absolute;
  right: -20px;
  top: -20px;
  width: 80px;
  height: 80px;
  border-radius: 999px;
  background: #EFF6FF;
  z-index: 0
}

.metric>* {
  position: relative;
  z-index: 1
}

.metric-card {
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: 1.25rem;
  box-shadow: var(--shadow-sm)
}

.metric-card span {
  display: block;
  font-size: .75rem;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .05em;
  color: #64748B
}

.metric-card strong {
  display: block;
  margin-top: .3rem;
  font-size: 1.45rem;
  line-height: 1.1;
  font-weight: 950;
  color: var(--navy)
}

.metric-card small {
  display: block;
  margin-top: .4rem;
  color: #64748B;
  font-weight: 700
}

.page-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem
}

.page-title {
  font-size: clamp(1.7rem, 3vw, 2.15rem);
  line-height: 1.15;
  font-weight: 900;
  letter-spacing: -.03em;
  color: var(--navy)
}

.page-subtitle {
  margin-top: .35rem;
  color: #64748B;
  line-height: 1.6
}

.empty-state {
  border: 1px dashed #CBD5E1;
  border-radius: 14px;
  background: #F8FAFC;
  padding: 2rem;
  text-align: center;
  color: #64748B
}

.timeline-dot {
  width: .65rem;
  height: .65rem;
  border-radius: 999px;
  background: var(--brand);
  box-shadow: 0 0 0 4px #DBEAFE
}

.scrollbar-hide::-webkit-scrollbar {
  display: none
}

.code-box {
  overflow: auto;
  border: 1px solid #DBEAFE;
  background: #EFF6FF;
  border-radius: 12px;
  padding: .85rem 1rem;
  font-size: .85rem;
  font-weight: 800;
  color: #1E3A8A;
  white-space: nowrap
}

.mobile-bottom-cta {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 50;
  border-top: 1px solid var(--border);
  background: rgba(255, 255, 255, .94);
  backdrop-filter: blur(16px);
  padding: .75rem 1rem calc(.75rem + env(safe-area-inset-bottom));
  box-shadow: 0 -12px 30px rgba(15, 23, 42, .08)
}

.skeleton {
  position: relative;
  overflow: hidden;
  background: #E2E8F0;
  border-radius: 10px
}

.skeleton:after {
  content: "";
  position: absolute;
  inset: 0;
  transform: translateX(-100%);
  background:var(--surface);
  animation: shimmer 1.4s infinite
}

@keyframes shimmer {
  100% {
    transform: translateX(100%)
  }
}

@media(max-width:768px) {

  .card,
  .card-premium {
    padding: 1rem;
    border-radius: 14px
  }

  .page-head {
    display: block
  }

  .page-head .btn-primary,
  .page-head .btn-secondary {
    width: 100%;
    margin-top: 1rem
  }

  .table {
    min-width: 0
  }

  .table-mobile-card table,
  .table-mobile-card thead,
  .table-mobile-card tbody,
  .table-mobile-card th,
  .table-mobile-card td,
  .table-mobile-card tr {
    display: block
  }

  .table-mobile-card th {
    display: none
  }

  .table-mobile-card tr {
    border-bottom: 1px solid var(--border);
    padding: .85rem
  }

  .table-mobile-card tr:last-child {
    border-bottom: 0
  }

  .table-mobile-card td {
    border: 0 !important;
    padding: .35rem 0 !important;
    background: transparent !important
  }

  .table-mobile-card td:before {
    content: attr(data-label);
    display: block;
    font-size: .68rem;
    text-transform: uppercase;
    letter-spacing: .05em;
    font-weight: 900;
    color: #94A3B8;
    margin-bottom: .12rem
  }

  .toast {
    left: 1rem;
    right: 1rem;
    top: .75rem
  }

  .empty-state {
    padding: 1.25rem
  }

  .btn-primary,
  .btn-secondary,
  .btn-danger,
  .btn-ghost {
    min-height: 46px
  }

  .mobile-full {
    width: 100%
  }
}

@media(max-width:480px) {
  .badge {
    white-space: normal
  }

  .page-title {
    font-size: 1.6rem
  }

  .card .text-4xl {
    font-size: 2rem
  }

  .mobile-bottom-cta .btn-primary {
    min-height: 48px
  }
}

@media(prefers-reduced-motion:reduce) {

  *,
  *:before,
  *:after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: .01ms !important
  }
}

@media print {

  header,
  footer,
  aside,
  .mobile-bottom-cta,
  .btn-primary,
  .btn-secondary,
  .btn-danger,
  .btn-ghost {
    display: none !important
  }

  body {
    background: #fff !important
  }

  .card,
  .card-premium,
  .table-wrap {
    box-shadow: none !important;
    border-color: #CBD5E1 !important
  }

  .lg\:pl-72 {
    padding-left: 0 !important
  }
}

/* Phase 13: production launch polish */
.dashboard-sidebar {
  max-height: 100vh;
  overflow: hidden
}

.dashboard-sidebar-nav {
  scrollbar-width: thin;
  scrollbar-color: #CBD5E1 transparent;
  overscroll-behavior: contain;
  padding-bottom: .25rem
}

.dashboard-sidebar-nav::-webkit-scrollbar {
  width: 8px
}

.dashboard-sidebar-nav::-webkit-scrollbar-track {
  background: transparent
}

.dashboard-sidebar-nav::-webkit-scrollbar-thumb {
  background: #CBD5E1;
  border-radius: 999px;
  border: 2px solid #fff
}

.dashboard-sidebar-nav:focus-visible {
  outline: 3px solid #93C5FD;
  outline-offset: 2px
}

.launch-check-grid {
  grid-template-columns: minmax(0, 1fr) auto
}

@media(max-height:720px) {
  .dashboard-sidebar {
    padding-top: 1rem;
    padding-bottom: 1rem
  }

  .dashboard-sidebar .rounded-2xl {
    padding: .75rem
  }

  .dashboard-sidebar-nav {
    margin-top: 1rem
  }
}


/* Premium SaaS UI refresh */
:root{
  --navy:#07172c;
  --navy-2:#0B1F33;
  --brand:#2563EB;
  --brand-dark:#1D4ED8;
  --brand-soft:#EFF6FF;
  --ink:#0F172A;
  --muted:#64748B;
  --border:#E2E8F0;
  --border-strong:#CBD5E1;
  --surface:#FFFFFF;
  --surface-soft:#F8FAFC;
  --ring:rgba(37,99,235,.18);
  --shadow-sm:0 1px 2px rgba(15,23,42,.06);
  --shadow-md:0 18px 50px rgba(15,23,42,.10);
  --shadow-lg:0 24px 80px rgba(15,23,42,.14);
}
body{
  min-height:100vh;
  background:var(--surface) !important;
  color:var(--ink);
}
body:before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:-1;
  background-image:none;
  background-size:48px 48px;
  mask-image:none;
}
.public-header{
  border-bottom:1px solid rgba(226,232,240,.8) !important;
  background:rgba(255,255,255,.82) !important;
  backdrop-filter:saturate(180%) blur(18px);
  box-shadow:0 10px 30px rgba(15,23,42,.04);
}
.public-nav-wrap{height:78px}
.nav-link{font-weight:850;color:#475569}
.nav-link:after{bottom:-10px;height:3px;background:var(--brand)}
.btn-primary,.btn-secondary,.btn-danger,.btn-ghost{
  border-radius:999px;
  min-height:46px;
  padding:.78rem 1.15rem;
  font-weight:900;
  letter-spacing:-.01em;
}
.btn-primary{
  background:var(--surface);
  color:#fff;
  border:1px solid rgba(37,99,235,.88);
  box-shadow:0 12px 24px rgba(37,99,235,.22), inset 0 1px rgba(255,255,255,.22);
}
.btn-primary:hover{
  background:var(--surface);
  box-shadow:0 18px 32px rgba(37,99,235,.28);
  transform:translateY(-1px);
}
.btn-secondary{
  border:1px solid rgba(203,213,225,.82);
  background:rgba(255,255,255,.88);
  color:#0F172A;
  box-shadow:0 8px 18px rgba(15,23,42,.05);
  backdrop-filter:blur(10px);
}
.btn-secondary:hover{
  border-color:#93C5FD;
  background:#fff;
  box-shadow:0 16px 30px rgba(15,23,42,.08);
  transform:translateY(-1px);
}
.btn-danger{
  border:1px solid #EF4444;
  background:var(--surface);
  box-shadow:0 14px 30px rgba(220,38,38,.16);
}
.card,.card-premium,.metric-card{
  border:1px solid rgba(226,232,240,.84);
  border-radius:24px;
  background:var(--surface);
  box-shadow:0 18px 48px rgba(15,23,42,.07);
  backdrop-filter:blur(12px);
}
.card:hover,.card-premium:hover,.metric-card:hover{
  border-color:rgba(191,219,254,.95);
  box-shadow:0 24px 68px rgba(15,23,42,.10);
}
.card.bg-navy,.bg-navy.card{
  background:var(--surface) !important;
  border-color:rgba(148,163,184,.18);
  box-shadow:0 30px 80px rgba(7,23,44,.22);
}
.input,.textarea,.select,.form-input{
  border-color:rgba(203,213,225,.92);
  border-radius:16px;
  background:rgba(255,255,255,.92);
  min-height:50px;
  box-shadow:inset 0 1px rgba(255,255,255,.6),0 1px 2px rgba(15,23,42,.02);
}
.textarea{min-height:132px}
.input:focus,.textarea:focus,.select:focus,.form-input:focus{
  border-color:#60A5FA;
  box-shadow:0 0 0 4px rgba(37,99,235,.12),0 12px 22px rgba(37,99,235,.06);
}
.label,.form-label{font-size:.82rem;letter-spacing:.01em}
.badge{
  border:1px solid rgba(191,219,254,.75);
  background:var(--surface);
  color:#1D4ED8;
  box-shadow:inset 0 1px rgba(255,255,255,.75);
}
.icon-soft{
  border:1px solid rgba(191,219,254,.75);
  background:var(--surface);
  box-shadow:inset 0 1px rgba(255,255,255,.7),0 10px 24px rgba(37,99,235,.09);
}
.table-wrap{
  border-radius:22px;
  border-color:rgba(226,232,240,.92);
  box-shadow:0 14px 38px rgba(15,23,42,.05);
}
.table th{
  background:var(--surface);
  color:#64748B;
  letter-spacing:.08em;
}
.table td{background:rgba(255,255,255,.76)}
.table tr:hover td{background:#F8FBFF}
.page-head{
  align-items:center;
  border:1px solid rgba(226,232,240,.74);
  background:var(--surface);
  border-radius:28px;
  padding:1.15rem 1.25rem;
  box-shadow:0 18px 50px rgba(15,23,42,.055);
}
.page-title{
  font-size:clamp(1.85rem,3vw,2.55rem);
  font-weight:950;
  letter-spacing:-.045em;
}
.page-subtitle{max-width:52rem;color:#667085}
.empty-state{
  border-radius:24px;
  border-color:#BFDBFE;
  background:var(--surface);
}
.dashboard-sidebar{
  background:var(--surface) !important;
  backdrop-filter:blur(18px);
  border-right-color:rgba(226,232,240,.88) !important;
  box-shadow:14px 0 40px rgba(15,23,42,.04);
}
.dashboard-sidebar .rounded-2xl{
  border-radius:24px;
}
.dash-link{
  margin-bottom:.18rem;
  border:1px solid transparent;
  border-radius:16px;
  color:#475569;
  font-weight:850;
}
.dash-link:hover{
  border-color:rgba(226,232,240,.95);
  background:rgba(248,250,252,.92);
}
.dash-link-active{
  border-color:rgba(191,219,254,.95);
  background:var(--surface);
  color:#1D4ED8;
  box-shadow:0 10px 24px rgba(37,99,235,.08);
}
.dash-icon{
  border-radius:12px;
}
.dashboard-topbar{
  background:rgba(255,255,255,.80) !important;
  backdrop-filter:blur(20px);
  box-shadow:0 12px 30px rgba(15,23,42,.04);
}
.dashboard-content{
  position:relative;
}
.dashboard-content:before{
  content:"";
  position:absolute;
  top:0;
  left:0;
  right:0;
  height:280px;
  pointer-events:none;
  background:var(--surface);
  z-index:-1;
}
.mobile-tab{
  border-radius:999px;
  box-shadow:0 6px 16px rgba(15,23,42,.04);
}
.premium-hero{
  position:relative;
  overflow:hidden;
  background:var(--surface);
}
.premium-grid-bg:before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background-image:none;
  background-size:56px 56px;
  mask-image:none;
}
.hero-orb{
  position:absolute;
  border-radius:999px;
  filter:blur(36px);
  opacity:.55;
}
.hero-orb-one{width:18rem;height:18rem;right:8%;top:6%;background:#DBEAFE}
.hero-orb-two{width:14rem;height:14rem;left:8%;bottom:8%;background:#E0F2FE}
.premium-kicker{
  display:inline-flex;
  align-items:center;
  gap:.5rem;
  border:1px solid rgba(191,219,254,.88);
  border-radius:999px;
  background:rgba(239,246,255,.82);
  color:#1D4ED8;
  padding:.45rem .78rem;
  font-size:.76rem;
  font-weight:950;
  text-transform:uppercase;
  letter-spacing:.12em;
  box-shadow:0 10px 24px rgba(37,99,235,.08),inset 0 1px rgba(255,255,255,.8);
}
.premium-panel{
  border:1px solid rgba(255,255,255,.68);
  border-radius:34px;
  background:var(--surface);
  box-shadow:0 28px 90px rgba(15,23,42,.12);
  backdrop-filter:blur(20px);
}
.premium-footer{
  background:var(--surface) !important;
  border-top:1px solid rgba(148,163,184,.18);
}
.auth-shell{
  position:relative;
  overflow:hidden;
}
.auth-shell:before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:var(--surface);
}
.auth-panel{
  border:1px solid rgba(255,255,255,.70);
  border-radius:32px;
  background:var(--surface);
  box-shadow:0 28px 80px rgba(15,23,42,.12);
  backdrop-filter:blur(18px);
}
.auth-feature{
  border:1px solid rgba(226,232,240,.78);
  border-radius:22px;
  background:rgba(255,255,255,.72);
  padding:1rem;
  box-shadow:0 14px 34px rgba(15,23,42,.05);
}
.stat-tile{
  border:1px solid rgba(226,232,240,.80);
  border-radius:24px;
  background:rgba(255,255,255,.76);
  padding:1.1rem;
  box-shadow:0 16px 38px rgba(15,23,42,.055);
}
@media(max-width:768px){
  .page-head{display:block;padding:1rem;border-radius:22px}
  .card,.card-premium,.auth-panel{border-radius:22px}
  .public-nav-wrap{height:68px}
}
@media print{
  body:before,.dashboard-content:before{display:none!important}
}




/* Light/Dark theme system */
.theme-toggle{
  display:inline-grid;
  height:46px;
  width:46px;
  place-items:center;
  border:1px solid rgba(203,213,225,.85);
  border-radius:999px;
  background:rgba(255,255,255,.86);
  color:#0F172A;
  box-shadow:0 8px 18px rgba(15,23,42,.06);
  backdrop-filter:blur(10px);
  transition:transform .18s ease,box-shadow .18s ease,background .18s ease,border-color .18s ease;
}
.theme-toggle:hover{transform:translateY(-1px);box-shadow:0 16px 28px rgba(15,23,42,.10);border-color:#93C5FD}
.theme-moon{display:none}
html[data-theme="dark"] .theme-sun{display:none}
html[data-theme="dark"] .theme-moon{display:inline-flex}

html[data-theme="dark"]{
  color-scheme:dark;
  --navy:#F8FAFC;
  --navy-2:#E2E8F0;
  --brand:#60A5FA;
  --brand-dark:#3B82F6;
  --brand-soft:#10233F;
  --ink:#E5E7EB;
  --muted:#94A3B8;
  --border:rgba(148,163,184,.22);
  --border-strong:rgba(148,163,184,.35);
  --surface:#0F172A;
  --surface-soft:#111C2F;
  --ring:rgba(96,165,250,.24);
  --shadow-sm:0 1px 2px rgba(0,0,0,.25);
  --shadow-md:0 20px 60px rgba(0,0,0,.32);
  --shadow-lg:0 30px 100px rgba(0,0,0,.45);
}
html[data-theme="dark"] body{
  background:var(--surface) !important;
  color:#E5E7EB;
}
html[data-theme="dark"] body:before{
  background-image:none;
  mask-image:none;
}
html[data-theme="dark"] .public-header,
html[data-theme="dark"] .dashboard-topbar,
html[data-theme="dark"] #mobile-public-nav,
html[data-theme="dark"] .mobile-bottom-cta{
  background:rgba(8,17,31,.82)!important;
  border-color:rgba(148,163,184,.20)!important;
  box-shadow:0 14px 42px rgba(0,0,0,.26);
}
html[data-theme="dark"] .public-header img,
html[data-theme="dark"] .dashboard-sidebar>a img{
  filter:brightness(0) invert(1);
}
html[data-theme="dark"] .premium-footer img{filter:none}
html[data-theme="dark"] .dashboard-app,
html[data-theme="dark"] .bg-slate-50,
html[data-theme="dark"] .bg-white{
  background-color:transparent!important;
}
html[data-theme="dark"] .premium-hero{
  background:var(--surface) !important;
}
html[data-theme="dark"] .card,
html[data-theme="dark"] .card-premium,
html[data-theme="dark"] .metric-card,
html[data-theme="dark"] .auth-panel,
html[data-theme="dark"] .premium-panel,
html[data-theme="dark"] .stat-tile,
html[data-theme="dark"] .auth-feature{
  border-color:rgba(148,163,184,.18);
  background:var(--surface) !important;
  box-shadow:0 24px 80px rgba(0,0,0,.30);
}
html[data-theme="dark"] .card:hover,
html[data-theme="dark"] .card-premium:hover,
html[data-theme="dark"] .metric-card:hover{
  border-color:rgba(96,165,250,.38);
  box-shadow:0 30px 100px rgba(0,0,0,.38);
}
html[data-theme="dark"] .dashboard-sidebar{
  background:var(--surface) !important;
  border-color:rgba(148,163,184,.18)!important;
  box-shadow:18px 0 50px rgba(0,0,0,.24);
}
html[data-theme="dark"] .dashboard-sidebar .rounded-2xl{
  background:rgba(37,99,235,.10)!important;
  border-color:rgba(96,165,250,.22)!important;
}
html[data-theme="dark"] .dash-link{color:#CBD5E1}
html[data-theme="dark"] .dash-link:hover{background:rgba(30,41,59,.74);color:#F8FAFC;border-color:rgba(148,163,184,.18)}
html[data-theme="dark"] .dash-link-active{background:var(--surface);color:#BFDBFE;border-color:rgba(96,165,250,.35)}
html[data-theme="dark"] .dash-icon{color:#94A3B8}
html[data-theme="dark"] .dash-link-active .dash-icon{background:rgba(96,165,250,.18);color:#DBEAFE}
html[data-theme="dark"] .page-head{
  background:var(--surface) !important;
  border-color:rgba(148,163,184,.18);
}
html[data-theme="dark"] .page-title,
html[data-theme="dark"] .text-navy,
html[data-theme="dark"] .text-slate-900{
  color:#F8FAFC!important;
}
html[data-theme="dark"] .text-slate-800,
html[data-theme="dark"] .text-slate-700{
  color:#E2E8F0!important;
}
html[data-theme="dark"] .page-subtitle,
html[data-theme="dark"] .text-slate-600,
html[data-theme="dark"] .text-slate-500,
html[data-theme="dark"] .helper{
  color:#94A3B8!important;
}
html[data-theme="dark"] .text-slate-400{color:#CBD5E1!important}
html[data-theme="dark"] .border-slate-100,
html[data-theme="dark"] .border-slate-200,
html[data-theme="dark"] .border-slate-800{
  border-color:rgba(148,163,184,.18)!important;
}
html[data-theme="dark"] .bg-slate-50,
html[data-theme="dark"] .bg-slate-100,
html[data-theme="dark"] .bg-blue-50,
html[data-theme="dark"] .bg-emerald-50,
html[data-theme="dark"] .bg-purple-50,
html[data-theme="dark"] .bg-green-50,
html[data-theme="dark"] .bg-red-50,
html[data-theme="dark"] .bg-amber-50{
  background-color:rgba(15,23,42,.64)!important;
}
html[data-theme="dark"] .bg-navy{
  background:var(--surface) !important;
}
html[data-theme="dark"] .input,
html[data-theme="dark"] .textarea,
html[data-theme="dark"] .select,
html[data-theme="dark"] .form-input{
  background:rgba(8,17,31,.70)!important;
  border-color:rgba(148,163,184,.26)!important;
  color:#F8FAFC!important;
}
html[data-theme="dark"] .input::placeholder,
html[data-theme="dark"] .textarea::placeholder{color:#64748B!important}
html[data-theme="dark"] .label,
html[data-theme="dark"] .form-label{color:#E2E8F0!important}
html[data-theme="dark"] .btn-secondary,
html[data-theme="dark"] .btn-ghost,
html[data-theme="dark"] .theme-toggle,
html[data-theme="dark"] .mobile-menu-button{
  background:rgba(15,23,42,.78)!important;
  border-color:rgba(148,163,184,.24)!important;
  color:#F8FAFC!important;
}
html[data-theme="dark"] .btn-secondary:hover,
html[data-theme="dark"] .btn-ghost:hover,
html[data-theme="dark"] .theme-toggle:hover,
html[data-theme="dark"] .mobile-menu-button:hover{background:rgba(30,41,59,.86)!important}
html[data-theme="dark"] .badge{
  background:rgba(37,99,235,.18)!important;
  border-color:rgba(96,165,250,.28)!important;
  color:#BFDBFE!important;
}
html[data-theme="dark"] .badge-paid,
html[data-theme="dark"] .badge-successful{background:rgba(16,185,129,.14)!important;color:#86EFAC!important;border-color:rgba(34,197,94,.28)!important}
html[data-theme="dark"] .badge-failed,
html[data-theme="dark"] .badge-cancelled{background:rgba(239,68,68,.12)!important;color:#FCA5A5!important;border-color:rgba(239,68,68,.26)!important}
html[data-theme="dark"] .badge-pending,
html[data-theme="dark"] .badge-awaiting_payment,
html[data-theme="dark"] .badge-sent,
html[data-theme="dark"] .badge-invoice_sent{background:rgba(245,158,11,.12)!important;color:#FCD34D!important;border-color:rgba(245,158,11,.26)!important}
html[data-theme="dark"] .icon-soft{
  background:rgba(37,99,235,.18)!important;
  border-color:rgba(96,165,250,.25)!important;
  color:#93C5FD!important;
}
html[data-theme="dark"] .table-wrap{
  background:rgba(15,23,42,.66)!important;
  border-color:rgba(148,163,184,.20)!important;
}
html[data-theme="dark"] .table th{
  background:rgba(15,23,42,.90)!important;
  color:#94A3B8!important;
  border-color:rgba(148,163,184,.20)!important;
}
html[data-theme="dark"] .table td{
  background:rgba(15,23,42,.54)!important;
  color:#CBD5E1!important;
  border-color:rgba(148,163,184,.16)!important;
}
html[data-theme="dark"] .table tr:hover td{background:rgba(30,41,59,.64)!important}
html[data-theme="dark"] .empty-state{
  background:rgba(15,23,42,.58)!important;
  border-color:rgba(96,165,250,.30)!important;
  color:#94A3B8!important;
}
html[data-theme="dark"] .code-box{
  background:rgba(37,99,235,.14)!important;
  border-color:rgba(96,165,250,.25)!important;
  color:#BFDBFE!important;
}
html[data-theme="dark"] .toast-success{background:#052E22!important;border-color:#166534!important;color:#BBF7D0!important}
html[data-theme="dark"] .toast-error{background:#450A0A!important;border-color:#991B1B!important;color:#FECACA!important}
html[data-theme="dark"] .mobile-tab{background:rgba(15,23,42,.72);border-color:rgba(148,163,184,.22);color:#CBD5E1}
html[data-theme="dark"] .mobile-tab-active{background:rgba(37,99,235,.22);border-color:rgba(96,165,250,.32);color:#DBEAFE}
html[data-theme="dark"] .premium-kicker{background:rgba(37,99,235,.18);border-color:rgba(96,165,250,.30);color:#BFDBFE}
html[data-theme="dark"] .premium-footer{background:#050B16!important}
html[data-theme="dark"] .brightness-0.invert img{filter:none}
html[data-theme="dark"] .rounded-2xl.bg-white,
html[data-theme="dark"] .rounded-xl.bg-white{background:rgba(15,23,42,.72)!important}



/* Flat color SaaS UI override */
body{background:#F8FAFC!important}
body:before{background-image:none!important}
.public-header,.dashboard-topbar,#mobile-public-nav,.mobile-bottom-cta{background:rgba(255,255,255,.94)!important}
.btn-primary{background:#2563EB!important;border-color:#2563EB!important;color:#fff!important}
.btn-primary:hover{background:#1D4ED8!important}
.btn-danger{background:#DC2626!important}
.card,.card-premium,.metric-card,.auth-panel,.premium-panel,.stat-tile,.auth-feature{background:#FFFFFF!important}
.card.bg-navy,.bg-navy.card,.bg-navy{background:#07172c!important}
.input,.textarea,.select,.form-input{background:#FFFFFF!important}
.badge{background:#EFF6FF!important}
.icon-soft{background:#EFF6FF!important}
.table th{background:#F8FAFC!important}
.table td{background:#FFFFFF!important}
.page-head{background:#FFFFFF!important}
.empty-state{background:#F8FAFC!important}
.premium-hero{background:#FFFFFF!important}
.premium-grid-bg:before{background-image:none!important}
.hero-orb{display:none!important}
.premium-footer{background:#07172c!important}
.skeleton:after{background:rgba(255,255,255,.55)!important}

html[data-theme="dark"] body{background:#08111F!important}
html[data-theme="dark"] body:before{background-image:none!important}
html[data-theme="dark"] .public-header,
html[data-theme="dark"] .dashboard-topbar,
html[data-theme="dark"] #mobile-public-nav,
html[data-theme="dark"] .mobile-bottom-cta{background:rgba(8,17,31,.94)!important}
html[data-theme="dark"] .card,
html[data-theme="dark"] .card-premium,
html[data-theme="dark"] .metric-card,
html[data-theme="dark"] .auth-panel,
html[data-theme="dark"] .premium-panel,
html[data-theme="dark"] .stat-tile,
html[data-theme="dark"] .auth-feature{background:#0F172A!important}
html[data-theme="dark"] .dashboard-sidebar{background:#0F172A!important}
html[data-theme="dark"] .page-head{background:#0F172A!important}
html[data-theme="dark"] .input,
html[data-theme="dark"] .textarea,
html[data-theme="dark"] .select,
html[data-theme="dark"] .form-input{background:#08111F!important}
html[data-theme="dark"] .btn-secondary,
html[data-theme="dark"] .btn-ghost,
html[data-theme="dark"] .theme-toggle,
html[data-theme="dark"] .mobile-menu-button{background:#0F172A!important}
html[data-theme="dark"] .badge{background:#10233F!important}
html[data-theme="dark"] .icon-soft{background:#10233F!important}
html[data-theme="dark"] .table-wrap{background:#0F172A!important}
html[data-theme="dark"] .table th{background:#111C2F!important}
html[data-theme="dark"] .table td{background:#0F172A!important}
html[data-theme="dark"] .empty-state{background:#0F172A!important}
html[data-theme="dark"] .premium-hero{background:#08111F!important}
html[data-theme="dark"] .premium-footer{background:#050B16!important}


/* Sitewide visual-system rules */
html, body, button, input, select, textarea {
  font-family: "Open Sans", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

input:not([type="hidden"]), select, textarea, .input, .select, .textarea, .form-input {
  border-width: 2px !important;
  border-style: solid !important;
}

.pg-icon {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  line-height: 1;
}

/* ProctorGeek uses flat solid fills only. */
[class*="bg-gradient-"] {
  background-image: none !important;
}

/* 2026-10-04 UI/UX refinement: cleaner public site, focused auth, compact admin directory */

/* Public navigation */
.public-header {
  background: rgba(255,255,255,.97) !important;
  border-bottom: 1px solid #E2E8F0 !important;
  box-shadow: 0 6px 20px rgba(15,23,42,.035) !important;
  backdrop-filter: blur(14px);
}
.public-nav-wrap { height: 72px !important; }
.public-brand { display:inline-flex; align-items:center; flex:0 0 auto; }
.public-nav-links { gap: 2rem; }
.nav-link {
  position: relative;
  color:#475569;
  font-size:.875rem;
  font-weight:700;
  text-decoration:none;
  transition:color .15s ease;
}
.nav-link:hover,.nav-link-active { color:#0B1F33; }
.nav-link-active:after {
  content:"";
  position:absolute;
  left:0; right:0; bottom:-25px;
  height:2px;
  background:#2563EB;
}
.public-login-link {
  display:inline-flex;
  min-height:44px;
  align-items:center;
  padding:0 .8rem;
  color:#0F172A;
  font-size:.875rem;
  font-weight:800;
}
.public-login-link:hover { color:#2563EB; }
.public-cta { min-height:44px !important; padding:.68rem 1.1rem !important; }
.mobile-menu-button {
  display:inline-grid;
  width:44px;
  height:44px;
  place-items:center;
  border:1px solid #E2E8F0;
  border-radius:999px;
  color:#0F172A;
  background:#fff;
}
.public-mobile-nav {
  border-top:1px solid #E2E8F0;
  background:#fff !important;
  padding:1rem;
  box-shadow:0 12px 28px rgba(15,23,42,.06);
}
.public-mobile-actions {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:.75rem;
  margin-top:1rem;
  padding-top:1rem;
  border-top:1px solid #E2E8F0;
}

/* Homepage */
.home-hero {
  background:#fff;
  padding:6.5rem 0 4.5rem;
  border-bottom:1px solid #E2E8F0;
}
.home-hero-copy {
  max-width:900px;
  margin:0 auto;
  text-align:center;
}
.home-eyebrow {
  margin:0 0 1rem;
  color:#2563EB;
  font-size:.75rem;
  font-weight:800;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.home-hero h1 {
  margin:0;
  color:#07172C;
  font-size:clamp(2.7rem,6vw,5.5rem);
  line-height:.98;
  letter-spacing:-.055em;
  font-weight:800;
}
.home-hero-lead {
  max-width:760px;
  margin:1.6rem auto 0;
  color:#64748B;
  font-size:clamp(1rem,2vw,1.22rem);
  line-height:1.75;
}
.home-hero-actions {
  display:flex;
  justify-content:center;
  gap:.8rem;
  margin-top:2rem;
  flex-wrap:wrap;
}
.home-proof-strip {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  max-width:980px;
  margin:4.5rem auto 0;
  border-top:1px solid #E2E8F0;
  border-bottom:1px solid #E2E8F0;
}
.home-proof-strip>div {
  padding:1.3rem 1.6rem;
  text-align:left;
}
.home-proof-strip>div+div { border-left:1px solid #E2E8F0; }
.home-proof-strip strong { display:block; color:#0F172A; font-size:.95rem; font-weight:800; }
.home-proof-strip span { display:block; margin-top:.3rem; color:#64748B; font-size:.82rem; line-height:1.6; }
.home-section { padding:5.5rem 0; background:#fff; }
.home-section-muted { background:#F8FAFC; border-bottom:1px solid #E2E8F0; }
.home-section-head { margin-bottom:2.5rem; }
.home-section-head.centered { max-width:760px; margin-left:auto; margin-right:auto; text-align:center; }
.home-section-head.split { display:flex; align-items:end; justify-content:space-between; gap:3rem; }
.home-section-head h2 {
  color:#07172C;
  font-size:clamp(2rem,4vw,3.35rem);
  line-height:1.05;
  letter-spacing:-.04em;
  font-weight:800;
}
.home-section-head>p,.home-section-head.split>p { color:#64748B; line-height:1.75; max-width:560px; }
.home-section-head.centered>p:last-child { max-width:680px; margin:.9rem auto 0; }
.home-steps-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1rem; }
.home-step-card {
  min-height:210px;
  border:1px solid #E2E8F0;
  border-radius:20px;
  background:#fff;
  padding:1.5rem;
  box-shadow:0 10px 28px rgba(15,23,42,.045);
}
.home-step-number { color:#2563EB; font-size:.78rem; font-weight:800; letter-spacing:.08em; }
.home-step-card h3 { margin-top:2.4rem; color:#0F172A; font-size:1.05rem; font-weight:800; }
.home-step-card p { margin-top:.65rem; color:#64748B; font-size:.875rem; line-height:1.65; }
.exam-chip-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.75rem; }
.exam-chip {
  min-height:54px;
  display:flex;
  align-items:center;
  padding:.8rem 1rem;
  border:1px solid #E2E8F0;
  border-radius:14px;
  background:#fff;
  color:#0F172A;
  font-size:.875rem;
  font-weight:800;
  box-shadow:0 6px 18px rgba(15,23,42,.035);
}
.home-trust-section { padding-top:4.5rem; }
.home-trust-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:2.5rem; }
.home-trust-grid article { padding-top:1.25rem; border-top:2px solid #E2E8F0; }
.home-trust-grid h3 { color:#0F172A; font-size:1.05rem; font-weight:800; }
.home-trust-grid p { margin-top:.7rem; color:#64748B; font-size:.9rem; line-height:1.7; }
.home-cta-band {
  margin-top:5rem;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:2rem;
  border-radius:22px;
  background:#07172C;
  padding:2.25rem 2.5rem;
  color:#fff;
  box-shadow:0 18px 44px rgba(7,23,44,.16);
}
.home-cta-label { color:#93C5FD; font-size:.75rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.home-cta-band h2 { margin-top:.4rem; font-size:clamp(1.5rem,3vw,2.2rem); font-weight:800; letter-spacing:-.03em; }
.home-cta-band p:not(.home-cta-label) { margin-top:.5rem; color:#CBD5E1; }

/* Footer */
.premium-footer { background:#07172C !important; border-top:0 !important; }
.footer-main-grid { display:grid; grid-template-columns:2fr repeat(3,minmax(0,1fr)); gap:3rem; }
.footer-brand-block p { max-width:330px; margin-top:1.25rem; color:#94A3B8; font-size:.8rem; line-height:1.7; }
.footer-link-group { display:flex; flex-direction:column; gap:.8rem; }
.footer-link-group h3 { margin-bottom:.25rem; color:#fff; font-size:.72rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase; }
.footer-link-group a { width:max-content; max-width:100%; color:#94A3B8; font-size:.8rem; font-weight:600; }
.footer-link-group a:hover { color:#fff; }
.footer-bottom-row { margin-top:3rem; padding-top:1.5rem; border-top:1px solid #1E293B; display:flex; justify-content:space-between; gap:1rem; color:#64748B; font-size:.75rem; }
.footer-bottom-row a:hover { color:#CBD5E1; }

/* Focused authentication pages */
.auth-main { min-height:100vh; background:#F8FAFC; }
.auth-form-page {
  min-height:100vh;
  display:grid;
  place-items:center;
  padding:2rem 1rem;
}
.auth-form-card {
  width:min(100%,460px);
  border:1px solid #E2E8F0;
  border-radius:24px;
  background:#fff;
  padding:2rem;
  box-shadow:0 18px 50px rgba(15,23,42,.075);
}
.auth-form-card-wide { width:min(100%,650px); }
.auth-form-logo { display:inline-flex; margin-bottom:2rem; }
.auth-form-heading h1 { color:#07172C; font-size:1.8rem; line-height:1.15; font-weight:800; letter-spacing:-.035em; }
.auth-form-heading p { margin-top:.5rem; color:#64748B; font-size:.9rem; line-height:1.6; }
.auth-form-fields { display:grid; gap:1.1rem; margin-top:1.75rem; }
.auth-register-grid { grid-template-columns:1fr 1fr; }
.auth-register-full { grid-column:1/-1; }
.auth-password-label { display:flex; align-items:center; justify-content:space-between; gap:1rem; margin-bottom:.45rem; }
.auth-password-label a,.auth-form-switch a { color:#2563EB; font-weight:800; }
.auth-password-label a { font-size:.78rem; }
.auth-form-switch { margin-top:1.4rem; text-align:center; color:#64748B; font-size:.875rem; }

/* Users directory: give the directory the width, not the creation form */
.users-page-head { align-items:center !important; }
.users-head-actions { display:flex; align-items:center; gap:.65rem; flex-wrap:wrap; }
.users-directory-card { padding:0 !important; overflow:visible; }
.users-toolbar { display:flex; gap:.75rem; align-items:center; padding:1rem; border-bottom:1px solid #E2E8F0; }
.users-search-wrap { flex:1 1 320px; }
.users-filter-wrap { width:190px; flex:0 0 190px; }
.users-search,.users-filter-wrap .select { min-height:44px !important; }
.users-table-wrap { overflow:visible; }
.users-table { min-width:0 !important; table-layout:fixed; }
.users-table th,.users-table td { padding:.85rem 1rem !important; vertical-align:middle; }
.users-table th:nth-child(1){width:18%}
.users-table th:nth-child(2){width:15%}
.users-table th:nth-child(3){width:25%}
.users-table th:nth-child(4){width:20%}
.users-table th:nth-child(5){width:12%}
.users-table th:nth-child(6){width:10%}
.users-name { color:#07172C; font-weight:800; }
.users-email { color:#475569; overflow-wrap:anywhere; }
.users-activity { color:#64748B; font-size:.82rem; white-space:normal; }
.users-activity strong { color:#0F172A; font-weight:800; }
.users-role-badge { white-space:normal !important; text-align:center; }
.users-actions-cell { position:relative; overflow:visible; }
.users-actions-col { text-align:right !important; }
.row-actions-menu { position:relative; display:inline-block; float:right; }
.row-actions-menu summary {
  list-style:none;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:38px;
  padding:.45rem .75rem;
  border:1px solid #CBD5E1;
  border-radius:999px;
  background:#fff;
  color:#334155;
  font-size:.78rem;
  font-weight:800;
  user-select:none;
}
.row-actions-menu summary::-webkit-details-marker { display:none; }
.row-actions-menu[open] summary { border-color:#93C5FD; color:#1D4ED8; }
.row-actions-popover {
  position:absolute;
  right:0;
  top:calc(100% + .45rem);
  z-index:25;
  width:170px;
  border:1px solid #E2E8F0;
  border-radius:14px;
  background:#fff;
  padding:.4rem;
  box-shadow:0 18px 44px rgba(15,23,42,.14);
}
.row-actions-popover a,.row-actions-popover button {
  display:block;
  width:100%;
  border:0;
  background:transparent;
  padding:.65rem .7rem;
  border-radius:10px;
  text-align:left;
  color:#334155;
  font-size:.8rem;
  font-weight:700;
  cursor:pointer;
}
.row-actions-popover a:hover,.row-actions-popover button:hover { background:#F8FAFC; color:#0F172A; }
.row-actions-popover .danger-text { color:#B91C1C; }
.users-no-results { padding:2rem; text-align:center; color:#64748B; }

.payment-admin-dialog {
  width:min(calc(100% - 2rem),540px);
  max-height:calc(100vh - 2rem);
  border:0;
  border-radius:24px;
  padding:0;
  background:transparent;
}
.payment-admin-dialog::backdrop { background:rgba(15,23,42,.48); }
.payment-admin-dialog-panel { border:1px solid #E2E8F0; border-radius:24px; background:#fff; padding:1.5rem; box-shadow:0 30px 80px rgba(15,23,42,.2); }
.payment-admin-dialog-head { display:flex; justify-content:space-between; gap:1rem; align-items:flex-start; }
.payment-admin-dialog-head h2 { color:#07172C; font-size:1.4rem; font-weight:800; }
.payment-admin-dialog-head p { margin-top:.4rem; color:#64748B; font-size:.85rem; line-height:1.6; }
.payment-admin-dialog-close { display:grid; place-items:center; width:38px; height:38px; flex:0 0 auto; border:1px solid #E2E8F0; border-radius:999px; background:#fff; color:#475569; font-size:1.35rem; line-height:1; }
.payment-admin-dialog-form { display:grid; gap:1rem; margin-top:1.4rem; }
.payment-admin-dialog-actions { display:flex; justify-content:flex-end; gap:.7rem; margin-top:.3rem; }

@media (max-width:1200px) and (min-width:769px) {
  .users-table th:nth-child(4),.users-table td:nth-child(4) { display:none; }
  .users-table th:nth-child(1){width:20%}
  .users-table th:nth-child(2){width:18%}
  .users-table th:nth-child(3){width:31%}
  .users-table th:nth-child(5){width:16%}
  .users-table th:nth-child(6){width:15%}
}

@media (max-width:900px) {
  .home-steps-grid,.exam-chip-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .home-trust-grid { grid-template-columns:1fr; gap:1.5rem; }
  .home-section-head.split { display:block; }
  .home-section-head.split>p { margin-top:1rem; }
  .footer-main-grid { grid-template-columns:2fr 1fr 1fr; }
  .footer-link-group:last-child { grid-column:2; }
}

@media (max-width:768px) {
  .public-nav-wrap { height:66px !important; }
  .home-hero { padding:4.5rem 0 3rem; }
  .home-proof-strip { grid-template-columns:1fr; margin-top:3rem; }
  .home-proof-strip>div+div { border-left:0; border-top:1px solid #E2E8F0; }
  .home-section { padding:4rem 0; }
  .home-steps-grid,.exam-chip-grid { grid-template-columns:1fr; }
  .home-step-card { min-height:0; }
  .home-step-card h3 { margin-top:1.6rem; }
  .home-cta-band { display:block; padding:1.6rem; }
  .home-cta-band .btn-primary { margin-top:1.4rem; width:100%; }
  .footer-main-grid { grid-template-columns:1fr 1fr; gap:2.2rem 1.5rem; }
  .footer-brand-block { grid-column:1/-1; }
  .footer-link-group:last-child { grid-column:auto; }
  .footer-bottom-row { display:block; }
  .footer-bottom-row a { display:inline-block; margin-top:.55rem; }
  .auth-register-grid { grid-template-columns:1fr; }
  .auth-register-full { grid-column:auto; }
  .auth-form-card,.auth-form-card-wide { padding:1.4rem; border-radius:20px; }
  .users-page-head .users-head-actions { display:grid; grid-template-columns:1fr 1fr; width:100%; margin-top:1rem; }
  .users-page-head .users-head-actions .btn-primary,.users-page-head .users-head-actions .btn-secondary { width:100%; margin-top:0 !important; }
  .users-toolbar { display:grid; grid-template-columns:1fr; }
  .users-filter-wrap { width:100%; }
  .users-directory-card { padding:0 !important; }
  .users-table-wrap { overflow:visible !important; }
  .users-table tr { padding:1rem !important; }
  .users-table td { padding:.35rem 0 !important; }
  .users-actions-cell { padding-top:.7rem !important; }
  .row-actions-menu { float:none; width:100%; }
  .row-actions-menu summary { width:100%; }
  .row-actions-popover { position:static; width:100%; margin-top:.4rem; box-shadow:none; }
  .payment-admin-dialog-actions { display:grid; grid-template-columns:1fr 1fr; }
}

@media (max-width:480px) {
  .home-hero h1 { font-size:2.55rem; }
  .home-hero-actions { display:grid; grid-template-columns:1fr; }
  .home-hero-actions .btn-primary,.home-hero-actions .btn-secondary { width:100%; }
  .footer-main-grid { grid-template-columns:1fr; }
  .footer-brand-block { grid-column:auto; }
  .users-page-head .users-head-actions { grid-template-columns:1fr; }
  .payment-admin-dialog-actions { grid-template-columns:1fr; }
}

/* Dark-mode counterparts for the refined surfaces */
html[data-theme="dark"] .home-hero,
html[data-theme="dark"] .home-section { background:#08111F; }
html[data-theme="dark"] .home-section-muted { background:#0B1424; border-color:#1E293B; }
html[data-theme="dark"] .home-hero h1,
html[data-theme="dark"] .home-section-head h2,
html[data-theme="dark"] .home-step-card h3,
html[data-theme="dark"] .home-trust-grid h3,
html[data-theme="dark"] .exam-chip,
html[data-theme="dark"] .home-proof-strip strong,
html[data-theme="dark"] .auth-form-heading h1,
html[data-theme="dark"] .payment-admin-dialog-head h2,
html[data-theme="dark"] .users-name,
html[data-theme="dark"] .users-activity strong { color:#F8FAFC; }
html[data-theme="dark"] .home-step-card,
html[data-theme="dark"] .exam-chip,
html[data-theme="dark"] .auth-form-card,
html[data-theme="dark"] .payment-admin-dialog-panel,
html[data-theme="dark"] .row-actions-popover,
html[data-theme="dark"] .row-actions-menu summary,
html[data-theme="dark"] .payment-admin-dialog-close { background:#0F172A; border-color:#273449; }
html[data-theme="dark"] .home-proof-strip,
html[data-theme="dark"] .home-proof-strip>div+div,
html[data-theme="dark"] .home-trust-grid article { border-color:#273449; }
html[data-theme="dark"] .auth-main { background:#08111F; }
html[data-theme="dark"] .row-actions-popover a,
html[data-theme="dark"] .row-actions-popover button,
html[data-theme="dark"] .row-actions-menu summary { color:#CBD5E1; }
html[data-theme="dark"] .row-actions-popover a:hover,
html[data-theme="dark"] .row-actions-popover button:hover { background:#111C2F; color:#fff; }
html[data-theme="dark"] .public-login-link { color:#E2E8F0; }

/* 2026-10-04 sitewide uniformity pass */
:root {
  --radius-panel: 20px;
  --radius-inner: 14px;
  --radius-control: 12px;
  --surface-subtle: #F8FAFC;
  --surface-border: #E2E8F0;
  --text-strong: #0F172A;
  --text-muted: #64748B;
  --panel-shadow: 0 10px 30px rgba(15, 23, 42, .055);
}

/* Major surfaces use one radius, border and elevation language. */
.page-head,
.card,
.card-premium,
.metric-card,
.auth-form-card,
.payment-admin-dialog-panel {
  border: 1px solid var(--surface-border) !important;
  border-radius: var(--radius-panel) !important;
  background: #fff !important;
  box-shadow: var(--panel-shadow) !important;
  backdrop-filter: none !important;
}

.page-head {
  min-height: 112px;
  padding: 1.35rem 1.5rem !important;
}

.card,
.card-premium {
  padding: 1.5rem;
}

/* Static cards should not behave as if clickable. */
.card:hover,
.card-premium:hover,
.metric-card:hover {
  border-color: var(--surface-border) !important;
  box-shadow: var(--panel-shadow) !important;
  transform: none !important;
}

.card-interactive:hover {
  border-color: #BFDBFE !important;
  box-shadow: 0 16px 38px rgba(15, 23, 42, .08) !important;
}

.page-title {
  font-size: clamp(1.8rem, 3vw, 2.35rem) !important;
  line-height: 1.12;
  font-weight: 800 !important;
  letter-spacing: -.035em !important;
}

.page-subtitle {
  margin-top: .45rem;
  max-width: 54rem;
  color: var(--text-muted) !important;
  font-size: .95rem;
  line-height: 1.65;
}

.panel-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
}

.panel-title {
  color: var(--navy);
  font-size: 1.05rem;
  line-height: 1.35;
  font-weight: 800;
  letter-spacing: -.015em;
}

.panel-copy {
  margin-top: .3rem;
  color: var(--text-muted);
  font-size: .875rem;
  line-height: 1.65;
}

.eyebrow-label {
  color: #64748B;
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.subcard,
.toolbar-panel,
.list-item,
.summary-row,
.stat-box,
.notification-item {
  border: 1px solid var(--surface-border);
  border-radius: var(--radius-inner);
  background: var(--surface-subtle);
}

.subcard { padding: 1rem; }
.toolbar-panel { padding: 1rem; }
.list-item { padding: 1rem; background: #fff; }
.summary-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  padding: .8rem .9rem;
}
.summary-row-success,
.summary-row-danger { background: var(--surface-subtle); }
.summary-row-success > :first-child { color: #166534 !important; }
.summary-row-danger > :first-child { color: #991B1B !important; }

.stat-box { padding: 1rem; }
.stat-box span {
  display: block;
  color: var(--text-muted);
  font-size: .78rem;
  font-weight: 700;
}
.stat-box strong {
  display: block;
  margin-top: .3rem;
  color: var(--navy);
  font-size: 1.75rem;
  line-height: 1.1;
  font-weight: 800;
}

.notification-item { padding: 1rem; background: #fff; }
.notification-item-unread { border-color: #BFDBFE; background: #EFF6FF; }

.alert {
  border: 1px solid;
  border-radius: var(--radius-inner);
  padding: .9rem 1rem;
  font-size: .875rem;
  font-weight: 600;
  line-height: 1.6;
}
.alert-success { border-color: #BBF7D0; background: #ECFDF5; color: #166534; }
.alert-error { border-color: #FECACA; background: #FEF2F2; color: #991B1B; }
.alert-warning { border-color: #FDE68A; background: #FFFBEB; color: #78350F; }
.alert-info { border-color: #BFDBFE; background: #EFF6FF; color: #1E3A8A; }

/* Controls are always 2px, same radius and same height. */
.input,
.select,
.form-input,
.textarea {
  border: 2px solid #CBD5E1 !important;
  border-radius: var(--radius-control) !important;
  background: #fff !important;
  color: var(--text-strong);
  box-shadow: none !important;
}
.input,
.select,
.form-input { min-height: 48px !important; height: 48px; }
.textarea { min-height: 132px; }
.input:focus,
.select:focus,
.form-input:focus,
.textarea:focus {
  border-color: #2563EB !important;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, .12) !important;
}

.btn-primary,
.btn-secondary,
.btn-danger,
.btn-ghost {
  min-height: 44px;
  border-radius: 999px;
  box-shadow: none !important;
}
.btn-primary:hover,
.btn-secondary:hover,
.btn-danger:hover,
.btn-ghost:hover { transform: none !important; box-shadow: none !important; }

/* Tables sit quietly inside cards instead of becoming a second shadowed card. */
.table-wrap {
  border: 1px solid var(--surface-border) !important;
  border-radius: var(--radius-inner) !important;
  background: #fff !important;
  box-shadow: none !important;
}
.table th {
  padding: .8rem .95rem !important;
  background: #F8FAFC !important;
  color: #64748B;
  font-size: .7rem;
  letter-spacing: .065em;
}
.table td {
  padding: .9rem .95rem !important;
  background: #fff !important;
  vertical-align: middle;
}
.table tr:hover td { background: #FAFCFF !important; }
.table-action {
  color: var(--brand);
  font-size: .875rem;
  font-weight: 800;
}
.table-action:hover { color: var(--brand-dark); }

.empty-state {
  border: 1px dashed #CBD5E1 !important;
  border-radius: var(--radius-inner) !important;
  background: #F8FAFC !important;
  box-shadow: none !important;
}

.metric-card {
  padding: 1.15rem 1.25rem !important;
}
.metric-card span {
  color: #64748B !important;
  font-size: .72rem !important;
  font-weight: 800 !important;
  letter-spacing: .065em !important;
}
.metric-card strong {
  margin-top: .45rem !important;
  color: var(--navy) !important;
  font-size: 1.85rem !important;
  font-weight: 800 !important;
}
.metric:after { display: none !important; }

/* Public secondary pages share the same width, spacing and heading scale. */
.public-page-shell {
  width: min(100%, 1280px);
  margin: 0 auto;
  padding: 5rem 1rem;
}
.public-page-shell-narrow { width: min(100%, 920px); }
.public-page-intro { max-width: 780px; }
.public-page-intro-narrow { max-width: 680px; }
.public-page-title {
  margin-top: .8rem;
  color: var(--navy);
  font-size: clamp(2.2rem, 5vw, 3.8rem);
  line-height: 1.04;
  font-weight: 800;
  letter-spacing: -.05em;
}
.public-page-lead {
  margin-top: 1.1rem;
  max-width: 680px;
  color: #64748B;
  font-size: 1rem;
  line-height: 1.8;
}
.public-page-actions { margin-top: 2.25rem; }

/* Public cards use the same restraint as dashboard cards. */
.home-step-card,
.exam-chip {
  border-radius: var(--radius-inner) !important;
  box-shadow: none !important;
}
.home-step-card:hover,
.exam-chip:hover { transform: none !important; box-shadow: none !important; }

/* Sidebar and topbar align with the same radius/spacing language. */
.dashboard-sidebar .rounded-2xl { border-radius: var(--radius-inner) !important; }
.dash-link { border-radius: 12px !important; }
.dash-link-active { box-shadow: none !important; background: #EFF6FF !important; }
.dashboard-topbar { box-shadow: 0 1px 0 rgba(226,232,240,.85) !important; }
.dashboard-content:before { display: none !important; }

/* Modals and row menus use the same panel radius. */
.payment-admin-dialog-panel { border-radius: var(--radius-panel) !important; }
.row-actions-popover { border-radius: var(--radius-inner) !important; }

@media (min-width: 640px) {
  .public-page-shell { padding-left: 1.5rem; padding-right: 1.5rem; }
}
@media (min-width: 1024px) {
  .public-page-shell { padding-left: 2rem; padding-right: 2rem; }
}

@media (max-width: 768px) {
  .page-head { min-height: 0; padding: 1.15rem !important; }
  .card,.card-premium { padding: 1.15rem !important; }
  .panel-head { display: block; }
  .panel-head .btn-primary,.panel-head .btn-secondary { width: 100%; margin-top: 1rem; }
  .public-page-shell { padding-top: 3.5rem; padding-bottom: 3.5rem; }
  .public-page-title { font-size: 2.45rem; }
  .table-mobile-card tr { padding: .9rem !important; }
}

/* Dark mode parity for all normalized surfaces. */
html[data-theme="dark"] .page-head,
html[data-theme="dark"] .card,
html[data-theme="dark"] .card-premium,
html[data-theme="dark"] .metric-card,
html[data-theme="dark"] .auth-form-card,
html[data-theme="dark"] .payment-admin-dialog-panel,
html[data-theme="dark"] .list-item,
html[data-theme="dark"] .notification-item,
html[data-theme="dark"] .table-wrap,
html[data-theme="dark"] .table td {
  background: #0F172A !important;
  border-color: #273449 !important;
}
html[data-theme="dark"] .subcard,
html[data-theme="dark"] .toolbar-panel,
html[data-theme="dark"] .summary-row,
html[data-theme="dark"] .stat-box,
html[data-theme="dark"] .empty-state {
  background: #111C2F !important;
  border-color: #273449 !important;
}
html[data-theme="dark"] .notification-item-unread { background: #10233F !important; border-color: #315A93 !important; }
html[data-theme="dark"] .table th { background: #111C2F !important; border-color: #273449 !important; }
html[data-theme="dark"] .table tr:hover td { background: #111C2F !important; }
html[data-theme="dark"] .input,
html[data-theme="dark"] .select,
html[data-theme="dark"] .form-input,
html[data-theme="dark"] .textarea { background: #08111F !important; border-color: #475569 !important; color: #F8FAFC; }
html[data-theme="dark"] .panel-title,
html[data-theme="dark"] .public-page-title,
html[data-theme="dark"] .stat-box strong,
html[data-theme="dark"] .metric-card strong { color: #F8FAFC !important; }
html[data-theme="dark"] .panel-copy,
html[data-theme="dark"] .public-page-lead { color: #94A3B8 !important; }
html[data-theme="dark"] .alert-success { background:#052E1A; border-color:#166534; color:#BBF7D0; }
html[data-theme="dark"] .alert-error { background:#450A0A; border-color:#991B1B; color:#FECACA; }
html[data-theme="dark"] .alert-warning { background:#422006; border-color:#A16207; color:#FDE68A; }
html[data-theme="dark"] .alert-info { background:#10233F; border-color:#315A93; color:#BFDBFE; }

/* Small responsive alignment fixes found during the all-pages audit. */
.home-step-card h2,
.home-step-card h3 {
  margin-top: 2.15rem;
  color: #0F172A;
  font-size: 1.05rem;
  font-weight: 800;
}
.page-head > .flex { flex-wrap: wrap; }
@media (max-width: 768px) {
  .page-head > .flex { width: 100%; margin-top: 1rem; }
  .page-head > .flex > .btn-primary,
  .page-head > .flex > .btn-secondary { flex: 1 1 180px; margin-top: 0 !important; }
}
html[data-theme="dark"] .home-step-card h2,
html[data-theme="dark"] .home-step-card h3 { color:#F8FAFC; }

/* Normalize legacy utility radii that remain in specialized diagnostics/setup screens. */
.rounded-xl,
.rounded-2xl { border-radius: var(--radius-inner) !important; }
.choice-row {
  display:flex;
  align-items:center;
  gap:.75rem;
  min-height:48px;
  border:1px solid var(--surface-border);
  border-radius:var(--radius-inner);
  background:#fff;
  padding:.75rem .9rem;
  color:#334155;
  font-size:.875rem;
  font-weight:700;
  cursor:pointer;
}
.choice-row:hover { background:#F8FAFC; border-color:#CBD5E1; }
html[data-theme="dark"] .choice-row { background:#0F172A; border-color:#273449; color:#E2E8F0; }
html[data-theme="dark"] .choice-row:hover { background:#111C2F; }
