:root {
  --rg-blue: #2563eb;
  --rg-blue-dark: #1d4ed8;
  --rg-purple: #7c3aed;
  --rg-cyan: #38bdf8;
  --rg-ink: #0f172a;
  --rg-muted: #64748b;
  --rg-soft: #f5f7fb;
  --rg-card: #ffffff;
  --rg-border: #dbeafe;
  --rg-green: #10b981;
  --rg-red: #ef4444;
  --rg-shadow: 0 22px 55px rgba(15, 23, 42, .10);
  --safe-bottom: env(safe-area-inset-bottom, 0px);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--rg-ink);
  background:
    radial-gradient(circle at top right, rgba(37,99,235,.12), transparent 34rem),
    linear-gradient(180deg, #f8fbff 0%, #f6f7fb 100%);
  min-height: 100vh;
}
a { color: inherit; }
img, svg { max-width: 100%; }

.rg-topbar {
  position: sticky;
  top: 0;
  z-index: 50;
  background: linear-gradient(135deg, #3f7ad9 0%, #2451c9 100%);
  color: #fff;
  box-shadow: 0 12px 30px rgba(37,99,235,.22);
}
.rg-nav {
  min-height: 114px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 18px clamp(20px, 5vw, 64px);
}
.rg-logo {
  display: inline-flex;
  align-items: center;
  gap: 13px;
  text-decoration: none;
  color: #fff;
}
.rg-logo-mark {
  width: 54px;
  height: 54px;
  border-radius: 19px;
  background: rgba(255,255,255,.18);
  display: grid;
  place-items: center;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.25);
  font-size: 30px;
}
.rg-logo-text strong {
  display: block;
  font-size: clamp(27px, 7vw, 42px);
  line-height: .86;
  letter-spacing: -.045em;
  font-weight: 850;
}
.rg-logo-text span {
  display: block;
  margin-top: 8px;
  font-size: 12px;
  color: rgba(255,255,255,.86);
}
.rg-nav-links {
  display: flex;
  gap: 10px;
  align-items: center;
}
.rg-nav-links a {
  color: rgba(255,255,255,.92);
  text-decoration: none;
  font-weight: 750;
  padding: 10px 12px;
  border-radius: 14px;
}
.rg-nav-links a:hover { background: rgba(255,255,255,.14); }
.rg-menu-button {
  display: none;
  width: 48px;
  height: 48px;
  border: 0;
  background: rgba(255,255,255,.14);
  color: #fff;
  border-radius: 16px;
  font-size: 26px;
  line-height: 1;
  cursor: pointer;
}
.rg-menu-overlay {
  position: fixed;
  inset: 0;
  z-index: 90;
  background: rgba(15,23,42,.52);
  opacity: 0;
  pointer-events: none;
  transition: opacity .18s ease;
}
.rg-menu-overlay.open { opacity: 1; pointer-events: auto; }
.rg-mobile-drawer {
  position: fixed;
  z-index: 100;
  top: 0;
  right: 0;
  width: min(88vw, 430px);
  max-width: 430px;
  height: 100dvh;
  background: #fff;
  color: var(--rg-ink);
  box-shadow: -18px 0 45px rgba(15, 23, 42, .24);
  transform: translateX(105%);
  transition: transform .2s ease;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  padding: 24px 22px calc(38px + var(--safe-bottom));
}
.rg-mobile-drawer.open { transform: translateX(0); }
.rg-drawer-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 18px;
}
.rg-drawer-title strong { display: block; font-size: 22px; }
.rg-drawer-title span { color: var(--rg-muted); font-size: 14px; }
.rg-close {
  width: 44px;
  height: 44px;
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  background: #fff;
  font-size: 22px;
  cursor: pointer;
}
.rg-drawer-section { margin: 22px 0; }
.rg-drawer-label {
  letter-spacing: .18em;
  text-transform: uppercase;
  color: #748099;
  font-size: 12px;
  font-weight: 850;
  margin: 0 0 10px;
}
.rg-drawer-link {
  display: flex;
  align-items: center;
  gap: 13px;
  padding: 14px 8px;
  text-decoration: none;
  font-size: 18px;
  font-weight: 780;
  border-radius: 16px;
}
.rg-drawer-link:hover { background: #f1f5ff; }
.rg-drawer-link small { display:block; color: var(--rg-muted); font-weight:600; font-size: 12px; margin-top: 2px; }
.rg-drawer-actions { display: grid; gap: 12px; margin: 18px 0 22px; }
.rg-drawer-account {
  background: linear-gradient(135deg, #eff6ff, #fff);
  border: 1px solid var(--rg-border);
  border-radius: 24px;
  padding: 16px;
  display: flex;
  gap: 12px;
  align-items: center;
}
.rg-avatar {
  width: 52px;
  height: 52px;
  border-radius: 18px;
  background: linear-gradient(135deg, var(--rg-purple), var(--rg-blue));
  color: #fff;
  display: grid;
  place-items: center;
  font-weight: 900;
}
.rg-footer {
  padding: 42px 22px calc(42px + var(--safe-bottom));
  text-align: center;
  color: #64748b;
  border-top: 1px solid #e6edf7;
  background: #fff;
}
.rg-footer a { color: var(--rg-blue); text-decoration: none; font-weight: 750; }
.rg-container { width: min(1140px, calc(100% - 44px)); margin: 0 auto; }
.rg-section { padding: clamp(46px, 8vw, 88px) 0; }
.rg-hero { padding: clamp(40px, 8vw, 94px) 0 54px; overflow: hidden; }
.rg-hero-grid { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(330px, .9fr); gap: clamp(32px, 6vw, 70px); align-items: center; }
.rg-eyebrow {
  display: inline-flex; gap: 8px; align-items: center;
  color: #2451c9;
  background: rgba(37,99,235,.08);
  border: 1px solid rgba(37,99,235,.15);
  padding: 10px 14px;
  border-radius: 999px;
  font-weight: 850;
  margin-bottom: 20px;
}
.rg-hero h1, .rg-page-hero h1 {
  font-size: clamp(44px, 9.5vw, 78px);
  line-height: .94;
  letter-spacing: -.065em;
  margin: 0 0 22px;
}
.rg-hero p, .rg-page-hero p {
  color: #475569;
  font-size: clamp(19px, 3vw, 26px);
  line-height: 1.48;
  margin: 0 0 24px;
}
.rg-actions { display: flex; gap: 14px; flex-wrap: wrap; align-items: center; }
.rg-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  border: 0;
  border-radius: 22px;
  padding: 16px 22px;
  font-weight: 850;
  text-decoration: none;
  cursor: pointer;
  font-size: 16px;
}
.rg-btn-primary { color: #fff; background: linear-gradient(135deg, var(--rg-purple), var(--rg-blue)); box-shadow: 0 18px 36px rgba(37,99,235,.25); }
.rg-btn-secondary { background: #fff; color: var(--rg-blue-dark); border: 1px solid #dbeafe; box-shadow: 0 12px 28px rgba(15,23,42,.05); }
.rg-btn-danger { background: #fff1f2; color: #be123c; border: 1px solid #fecdd3; }
.rg-btn-full { width: 100%; }
.rg-card {
  background: rgba(255,255,255,.92);
  border: 1px solid rgba(203,213,225,.70);
  border-radius: 32px;
  box-shadow: var(--rg-shadow);
  padding: clamp(22px, 4vw, 34px);
}
.rg-card h2, .rg-card h3 { margin-top: 0; letter-spacing: -.03em; }
.rg-muted { color: var(--rg-muted); }
.rg-grid-3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.rg-grid-2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.rg-feature-card { padding: 26px; border-radius: 28px; background: #fff; border: 1px solid #e5edf8; box-shadow: 0 14px 40px rgba(15,23,42,.06); }
.rg-feature-icon { width: 54px; height: 54px; border-radius: 18px; display: grid; place-items: center; background: #eff6ff; font-size: 26px; margin-bottom: 16px; }
.rg-mini-flow { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; }
.rg-mini-step { background: #fff; border: 1px solid #e2e8f0; border-radius: 22px; padding: 18px 12px; text-align: center; box-shadow: 0 10px 24px rgba(15,23,42,.07); }
.rg-mini-step strong { display:block; font-size:14px; margin: 8px 0 4px; }
.rg-mini-step span { display:block; font-size:12px; color: var(--rg-muted); }
.rg-visual-panel { background: linear-gradient(160deg, #ffffff 0%, #eff6ff 100%); border: 1px solid #dbeafe; border-radius: 36px; padding: 24px; box-shadow: var(--rg-shadow); }
.rg-child-preview { display: grid; gap: 16px; }
.rg-child-card { background: #fff; border-radius: 28px; padding: 22px; border: 1px solid #e5edf8; box-shadow: 0 16px 36px rgba(15,23,42,.08); }
.rg-progress { height: 10px; background: #e2e8f0; border-radius: 999px; overflow: hidden; margin-top: 12px; }
.rg-progress > span { display:block; height:100%; border-radius: 999px; background: linear-gradient(90deg, var(--rg-green), var(--rg-cyan)); }
.rg-pill-row { display: flex; flex-wrap: wrap; gap: 10px; }
.rg-pill { border: 1px solid #dbeafe; color: #2451c9; background:#eff6ff; border-radius: 999px; padding: 9px 12px; font-weight:800; font-size: 13px; }
.rg-page-hero { padding: 54px 0 22px; }
.rg-page-hero h1 { max-width: 950px; }
.rg-page-hero p { max-width: 820px; }
.rg-form-wrap { width: min(520px, calc(100% - 32px)); margin: 48px auto; }
.rg-form-card { background:#fff; border:1px solid #e2e8f0; border-radius: 32px; box-shadow: var(--rg-shadow); padding: clamp(24px, 6vw, 38px); }
.rg-form-card h1 { margin: 0 0 6px; letter-spacing: -.04em; font-size: clamp(34px, 7vw, 48px); }
.rg-field { margin: 16px 0; }
.rg-field label { display:block; font-weight: 850; margin-bottom: 7px; }
.rg-input, .rg-select, .rg-textarea {
  width: 100%;
  border: 1px solid #cbd5e1;
  border-radius: 16px;
  padding: 14px 15px;
  font: inherit;
  outline: none;
  background: #fff;
}
.rg-input:focus, .rg-select:focus, .rg-textarea:focus { border-color: var(--rg-blue); box-shadow: 0 0 0 4px rgba(37,99,235,.10); }
.rg-textarea { min-height: 118px; resize: vertical; }
.rg-alert { padding: 14px 16px; border-radius: 18px; margin: 15px 0; font-weight: 700; }
.rg-alert-error { background: #fff1f2; color: #be123c; border:1px solid #fecdd3; }
.rg-alert-success { background: #ecfdf5; color: #047857; border:1px solid #bbf7d0; }
.rg-alert-info { background: #eff6ff; color: #1d4ed8; border:1px solid #dbeafe; }
.rg-dashboard { display: grid; grid-template-columns: 280px minmax(0, 1fr); min-height: calc(100vh - 114px); }
.rg-sidebar { background: #fff; border-right: 1px solid #e2e8f0; padding: 24px 18px calc(28px + var(--safe-bottom)); position: sticky; top: 114px; height: calc(100dvh - 114px); overflow-y:auto; }
.rg-sidebar .rg-drawer-link { font-size: 16px; padding: 12px; }
.rg-main { padding: clamp(24px, 5vw, 46px); }
.rg-stat-row { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin: 22px 0; }
.rg-stat { background:#fff; border:1px solid #e2e8f0; border-radius:24px; padding:22px; box-shadow:0 14px 34px rgba(15,23,42,.05); }
.rg-stat strong { font-size: 34px; display:block; }
.rg-table-card { overflow-x: auto; }
.rg-placeholder { border: 2px dashed #cbd5e1; border-radius: 28px; padding: 28px; background: #fff; text-align: center; }
.rg-price { font-size: 48px; font-weight: 900; letter-spacing: -.05em; margin: 8px 0; }
.rg-price small { font-size: 16px; color: var(--rg-muted); font-weight: 800; }
.rg-list { padding-left: 0; list-style: none; display: grid; gap: 10px; }
.rg-list li { display: flex; gap: 10px; align-items: flex-start; color: #334155; }
.rg-list li:before { content:'✓'; color: var(--rg-green); font-weight: 900; }
.rg-separator { height: 1px; background: #e2e8f0; margin: 22px 0; }

@media (max-width: 920px) {
  .rg-nav { min-height: 112px; }
  .rg-nav-links { display: none; }
  .rg-menu-button { display: inline-grid; place-items: center; }
  .rg-hero-grid, .rg-grid-2, .rg-grid-3 { grid-template-columns: 1fr; }
  .rg-mini-flow { grid-template-columns: repeat(2, 1fr); }
  .rg-dashboard { display: block; }
  .rg-sidebar { position: static; height: auto; display:none; }
  .rg-main { padding: 26px 20px 80px; }
  .rg-stat-row { grid-template-columns: 1fr; }
}

@media (max-width: 560px) {
  .rg-container { width: min(100% - 32px, 1140px); }
  .rg-logo-mark { width: 44px; height: 44px; border-radius: 15px; font-size: 23px; }
  .rg-logo-text strong { font-size: 31px; }
  .rg-logo-text span { font-size: 10px; }
  .rg-nav { padding: 16px 18px; min-height: 104px; }
  .rg-menu-button { width: 44px; height: 44px; }
  .rg-actions { display:grid; grid-template-columns: 1fr; }
  .rg-btn { width: 100%; }
  .rg-mini-flow { grid-template-columns: 1fr; }
  .rg-card, .rg-feature-card { border-radius: 26px; }
  .rg-hero h1, .rg-page-hero h1 { font-size: 44px; }
}

/* Phase 2 parent-child linking */
.rg-child-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}.rg-child-card{display:flex;align-items:center;gap:14px;text-decoration:none;color:var(--rg-text);border:1px solid var(--rg-border);background:#fff;border-radius:22px;padding:16px;box-shadow:0 12px 30px rgba(15,23,42,.06);transition:transform .16s ease,box-shadow .16s ease}.rg-child-card:hover{transform:translateY(-2px);box-shadow:0 18px 42px rgba(15,23,42,.1)}.rg-child-card strong{font-size:18px;display:block}.rg-child-card span,.rg-child-head p{color:var(--rg-muted);margin:0}.rg-avatar-lg{width:58px;height:58px;font-size:20px}.rg-child-metrics{margin-left:auto;display:flex;flex-direction:column;gap:5px;align-items:flex-end}.rg-child-metrics span{background:#eff6ff;color:#1d4ed8;border-radius:999px;padding:5px 9px;font-size:12px;font-weight:900}.rg-child-panel{display:flex;flex-direction:column;gap:14px}.rg-child-head{display:flex;gap:14px;align-items:center}.rg-child-head h2{margin:0;font-size:22px;letter-spacing:-.03em}.rg-permission-pills{display:flex;flex-wrap:wrap;gap:8px}.rg-permission-pills span{background:#f0fdf4;color:#166534;border:1px solid #bbf7d0;border-radius:999px;padding:7px 10px;font-weight:900;font-size:12px}.rg-form-stack{display:flex;flex-direction:column;gap:10px}.rg-input{border:1px solid #dbe3ec;border-radius:16px;padding:14px 15px;font-size:16px;font-weight:700;background:#fff}.rg-work-list{display:flex;flex-direction:column;gap:12px}.rg-work-item{display:flex;justify-content:space-between;align-items:center;gap:12px;border:1px solid var(--rg-border);border-radius:16px;padding:12px;background:#f8fafc}.rg-work-item strong{display:block}.rg-work-item span{display:block;color:var(--rg-muted);font-size:13px}.rg-grade-pill{background:#ecfdf5!important;color:#166534!important;border-radius:999px;padding:7px 10px;font-weight:950;white-space:nowrap}.rg-feedback-note{margin:-6px 0 8px 12px;border-left:3px solid #bfdbfe;padding:8px 12px;color:#475569;background:#f8fafc;border-radius:0 12px 12px 0;font-size:14px}.rg-mastery-row{display:grid;grid-template-columns:1fr 120px 44px;gap:10px;align-items:center;margin-bottom:14px}.rg-mastery-row strong{display:block}.rg-mastery-row span{color:var(--rg-muted);font-size:12px}.rg-mastery-bar{height:10px;background:#e5e7eb;border-radius:999px;overflow:hidden}.rg-mastery-bar i{display:block;height:100%;background:linear-gradient(90deg,#7c3aed,#2563eb);border-radius:999px}.rg-stat-row.compact{grid-template-columns:repeat(2,minmax(0,1fr));margin:12px 0}.rg-hero-compact{padding-top:42px;padding-bottom:28px}@media(max-width:640px){.rg-child-metrics{margin-left:0;align-items:flex-start}.rg-child-card{align-items:flex-start;flex-direction:column}.rg-work-item{align-items:flex-start;flex-direction:column}.rg-mastery-row{grid-template-columns:1fr}.rg-stat-row.compact{grid-template-columns:1fr}}
