:root {
  --panel-ink: var(--ink);
  --panel-body: var(--body);
  --panel-line: var(--line);
  --panel-soft: var(--warm);
  --panel-card: rgba(255,255,255,.92);
}

body.upage {
  background:
    radial-gradient(circle at top left, rgba(255,56,92,.08), transparent 30%),
    radial-gradient(circle at top right, rgba(26,159,99,.08), transparent 24%),
    linear-gradient(180deg, #ffffff 0%, var(--warm) 100%);
}

.upage__wash {
  position: fixed;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(135deg, rgba(255,255,255,.5), rgba(255,255,255,0) 45%),
    radial-gradient(circle at 50% 0%, rgba(255,56,92,.05), transparent 38%);
  z-index: 0;
}

.upanelbar,
.authshell,
.upanel {
  position: relative;
  z-index: 1;
}

.upanelbar {
  background: rgba(255,255,255,.82);
  backdrop-filter: saturate(180%) blur(12px);
  border-bottom: 1px solid var(--panel-line);
}

.upanelbar__row {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  min-height:76px;
}

.upanelbar__nav,
.upanelbar__actions {
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}

.uinline-form {
  margin:0;
}

.upanelbar__link,
.uside__link {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:42px;
  padding:0 16px;
  border-radius:999px;
  background:transparent;
  color:var(--panel-body);
  font-weight:700;
  text-decoration:none;
  border:1px solid transparent;
}

.upanelbar__link:hover,
.uside__link:hover {
  background:var(--panel-soft);
  color:var(--panel-ink);
  text-decoration:none;
}

.upanelbar__link.is-active,
.uside__link.is-active {
  background:var(--coral-soft);
  border-color:#ffd5dd;
  color:var(--coral-dk);
}

.authshell {
  padding:36px 0 56px;
}

/* .authshell__grid,
.upanel {
  display:grid;
  grid-template-columns: minmax(260px, 360px) minmax(0, 1fr);
  gap:24px;
  align-items:start;
} */

.authshell__grid {
  display:grid;
  grid-template-columns: minmax(250px, 490px) minmax(0, 1fr);
  gap:10px;
  align-items:start;
}

.upanel {
  max-width:var(--maxw);
  margin:0 auto;
  padding:24px;
}

.authshell__copy,
.uside,
.authcard,
.panelcard,
.panelsection,
.panelhero,
.reviewtile,
.reviewform,
.metric,
.reviewsummary,
.reviewtable,
.reviewflow,
.profilecard,
.passcard {
  background:var(--panel-card);
  border:1px solid var(--panel-line);
  border-radius:24px;
  box-shadow:var(--shadow-sm);
}

.authshell__copy {
  padding:28px;
  position:sticky;
  top:24px;
}

.authshell__copy h1 {
  margin-bottom:14px;
  font-size:clamp(2rem, 3.8vw, 3.1rem);
}

.authshell__points {
  display:grid;
  gap:10px;
  margin-top:22px;
}

.authpoint {
  display:flex;
  gap:10px;
  align-items:flex-start;
  color:var(--panel-body);
  font-weight:600;
}

.authpoint__dot {
  width:10px;
  height:10px;
  border-radius:999px;
  background:linear-gradient(135deg, var(--coral), #ff8a5c);
  margin-top:8px;
  flex:none;
}

.authshell__mini {
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:10px;
  margin-top:24px;
}

.authmini,
.metaitem,
.ustat {
  background:#fff;
  border:1px solid var(--panel-line);
  border-radius:18px;
  padding:14px 16px;
}

.authmini b,
.metaitem b,
.ustat b {
  display:block;
  color:var(--panel-ink);
  font-size:1.05rem;
  margin-bottom:3px;
}

.authmini span,
.metaitem span,
.ustat span {
  display:block;
  color:var(--muted);
  font-size:.86rem;
  line-height:1.4;
}

.authcard {
  padding:30px;
  max-width:620px;
  justify-self:end;
  width:100%;
}

.authcopy {
  margin-bottom:18px;
}

.authcard .eyebrow,
.panelhero .eyebrow,
.uside .eyebrow,
.sectionhead .eyebrow {
  margin-bottom:10px;
}

.authcard h2 {
  margin-bottom:10px;
}

.authcard p.lead,
.panelhero p {
  font-size:1rem;
  color:var(--panel-body);
}

.ualert {
  border-radius:16px;
  padding:14px 16px;
  margin-bottom:16px;
  font-weight:600;
  border:1px solid var(--panel-line);
  background:#fff;
  color:var(--panel-ink);
}

.ualert--success {
  background:var(--c-green);
  border-color:var(--c-green-b);
  color:#127a44;
}

.ualert--error {
  background:var(--c-pink);
  border-color:var(--c-pink-b);
  color:#c0392b;
}

.formstack {
  display:grid;
  gap:16px;
  margin-top:24px;
}

.ufield {
  display:grid;
  gap:8px;
}

.ufield > span {
  font-size:.8rem;
  font-weight:800;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:var(--muted);
}

.uinput,
.usetting,
.uselect,
.utextarea {
  width:100%;
  border:1.5px solid var(--panel-line);
  border-radius:14px;
  background:#fff;
  color:var(--panel-ink);
  font:inherit;
  padding:13px 14px;
}

.utextarea {
  min-height:120px;
  resize:vertical;
}

.uinput:focus,
.usetting:focus,
.uselect:focus,
.utextarea:focus {
  outline:none;
  border-color:var(--coral);
  box-shadow:0 0 0 4px rgba(255,56,92,.08);
}

.ucheckrow {
  display:flex;
  gap:10px;
  align-items:flex-start;
  font-size:.94rem;
  color:var(--panel-body);
}

.ucheckrow input {
  width:18px;
  height:18px;
  margin-top:3px;
  accent-color:var(--coral);
}

.uactions {
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  align-items:center;
  margin-top:8px;
}

.uside {
  padding:22px;
  position:sticky;
  top:24px;
}

.uside__hero {
  display:flex;
  gap:16px;
  align-items:flex-start;
}

.uavatar {
  width:72px;
  height:72px;
  border-radius:22px;
  display:grid;
  place-items:center;
  background:linear-gradient(135deg, var(--coral), #ff8a5c);
  color:#fff;
  font-size:1.35rem;
  font-weight:800;
  letter-spacing:.03em;
  box-shadow:0 14px 34px rgba(255,56,92,.22);
  flex:none;
}

.uside h2 {
  font-size:1.4rem;
  margin-bottom:8px;
}

.uside p {
  color:var(--panel-body);
  margin:0;
  font-size:.95rem;
}

.uside__nav {
  display:grid;
  gap:8px;
  margin-top:22px;
}

.uside__meta {
  display:grid;
  gap:10px;
  margin-top:22px;
}

.ucontent {
  min-width:0;
  display:grid;
  gap:22px;
}

.panelhero,
.panelsection,
.reviewtile,
.reviewform,
.metric,
.reviewsummary,
.reviewtable,
.reviewflow,
.profilecard,
.passcard {
  padding:24px;
}

.panelhero {
  background:linear-gradient(180deg, rgba(255,255,255,.98), rgba(250,249,246,.96));
}

.panelhero__top,
.sectionhead,
.reviewhead,
.profilehead,
.passhead,
.reviewrow__top,
.reviewrow__bottom {
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:16px;
  flex-wrap:wrap;
}

.sectionhead h2,
.reviewhead h2,
.profilehead h2,
.passhead h2 {
  margin-bottom:4px;
}

.panelstats,
.reviewgrid,
.grid2,
.grid3 {
  display:grid;
  gap:16px;
}

.panelstats {
  grid-template-columns:repeat(4, minmax(0, 1fr));
  margin-top:20px;
}

.metric {
  background:#fff;
  display:grid;
  gap:8px;
}

.metric b {
  font-size:1.9rem;
  color:var(--panel-ink);
  line-height:1;
}

.metric span {
  color:var(--muted);
  font-size:.85rem;
}

.timeline {
  display:grid;
  gap:12px;
}

.timeline__item {
  display:flex;
  gap:14px;
  padding:14px 16px;
  border:1px solid var(--panel-line);
  border-radius:18px;
  background:#fff;
}

.timeline__dot {
  width:11px;
  height:11px;
  border-radius:999px;
  background:var(--coral);
  margin-top:6px;
  flex:none;
}

.timeline__item b,
.reviewrow__main b {
  display:block;
  color:var(--panel-ink);
  margin-bottom:3px;
}

.timeline__item span,
.reviewrow__main span {
  color:var(--muted);
  font-size:.9rem;
}

.reviewtable {
  overflow-x:auto;
}

.utable {
  width:100%;
  border-collapse:collapse;
  min-width:860px;
}

.utable th,
.utable td {
  padding:14px 12px;
  border-bottom:1px solid var(--panel-line);
  text-align:left;
  font-size:.92rem;
  vertical-align:top;
}

.utable thead th {
  color:var(--panel-ink);
  background:var(--panel-soft);
  font-size:.78rem;
  text-transform:uppercase;
  letter-spacing:.05em;
}

.utable tbody tr:hover {
  background:rgba(255,56,92,.03);
}

.status {
  display:inline-flex;
  align-items:center;
  gap:7px;
  padding:5px 10px;
  border-radius:999px;
  font-weight:700;
  font-size:.78rem;
}

.status::before {
  content:"";
  width:8px;
  height:8px;
  border-radius:999px;
  background:currentColor;
}

.status--live {
  color:#127a44;
  background:var(--c-green);
}

.status--draft {
  color:#8c5e00;
  background:var(--c-yellow);
}

.status--refresh {
  color:#7d4274;
  background:var(--c-pink);
}

.reviewgrid {
  grid-template-columns:repeat(2, minmax(0, 1fr));
}

.grid2 {
  grid-template-columns:repeat(2, minmax(0, 1fr));
}

.grid3 {
  grid-template-columns:repeat(3, minmax(0, 1fr));
}

.gridspan2 {
  grid-column:1 / -1;
}

.reviewflow {
  display:grid;
  gap:16px;
}

.stepcard {
  border:1px solid var(--panel-line);
  border-radius:18px;
  padding:18px;
  background:#fff;
}

.stepcard h3 {
  margin-bottom:8px;
}

.reviewsummary .rate-row {
  margin-top:10px;
}

.proscons {
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:16px;
}

.probox,
.conbox {
  border:1px solid var(--panel-line);
  border-radius:18px;
  background:#fff;
  padding:18px;
}

.probox ul,
.conbox ul {
  margin:0;
  padding-left:18px;
}

.probox li,
.conbox li {
  margin-bottom:10px;
}

.faqlist {
  display:grid;
  gap:12px;
}

.faqitem {
  border:1px solid var(--panel-line);
  border-radius:18px;
  background:#fff;
  padding:18px;
}

.faqitem b {
  display:block;
  color:var(--panel-ink);
  margin-bottom:8px;
}

.reviewhero {
  display:flex;
  gap:18px;
  align-items:flex-start;
}

.reviewhero__logo {
  width:76px;
  height:76px;
  border-radius:22px;
  display:grid;
  place-items:center;
  color:#fff;
  font-size:1.35rem;
  font-weight:800;
  flex:none;
}

.reviewhero__copy h1 {
  margin-bottom:10px;
}

.reviewhero__copy p {
  margin-bottom:0;
}

.pillrow,
.badgebar {
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin-top:12px;
}

.pilltag {
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:6px 11px;
  border-radius:999px;
  font-size:.78rem;
  font-weight:800;
  background:var(--panel-soft);
  color:var(--panel-ink);
}

.sectionspacer {
  height:1px;
  background:var(--panel-line);
  margin:2px 0;
}

.emptystate {
  border:1px dashed var(--panel-line);
  border-radius:22px;
  background:rgba(255,255,255,.7);
  padding:28px;
  text-align:center;
  color:var(--muted);
}

.emptystate h3 {
  margin-bottom:8px;
}

@media (max-width: 1100px) {
  .authshell__grid,
  .upanel {
    grid-template-columns:1fr;
  }

  .authshell__copy,
  .uside,
  .authcard {
    position:static;
    max-width:none;
    justify-self:stretch;
  }

  .panelstats {
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 820px) {
  .upanelbar__row {
    flex-wrap:wrap;
    justify-content:flex-start;
  }

  .authshell__mini,
  .panelstats,
  .reviewgrid,
  .grid2,
  .grid3,
  .proscons {
    grid-template-columns:1fr;
  }

  .reviewhero,
  .uside__hero {
    flex-direction:column;
  }

  .utable {
    min-width:720px;
  }
}

@media (max-width: 560px) {
  .authshell,
  .panelhero,
  .panelsection,
  .reviewtile,
  .reviewform,
  .metric,
  .reviewsummary,
  .reviewtable,
  .reviewflow,
  .profilecard,
  .passcard,
  .authcard,
  .upanel,
  .uside {
    padding:18px;
    border-radius:20px;
  }

  .upanelbar__actions {
    width:100%;
  }

  .upanelbar__actions .btn {
    flex:1 1 auto;
  }
}
