.split { display: grid; grid-template-columns: 1fr 1fr; min-height: 100vh; }
.split-left {
  position: relative;
  display: flex;
  flex-direction: column;
  padding: 40px;
  background: radial-gradient(120% 75% at 50% -10%, #eaa17c 0%, #c04f28 34%, #7a2f18 66%, #2a1a12 100%);
  color: #fbf3ec;
}
.split-left .brand { color: #fbf3ec; }
.split-left .brand .dot { color: #f5d9c8; }
.quote-card {
  width: 100%;
  max-width: 420px;
  margin: auto;
  padding: 28px;
  border-radius: 18px;
  background: rgba(255, 253, 249, .92);
  box-shadow: 0 20px 60px rgba(42, 26, 18, .35);
}
.quote-card p { margin-bottom: 22px; color: var(--ink); font-family: var(--serif); font-size: 22px; line-height: 1.32; }
.quote-card .attr { display: flex; align-items: center; gap: 12px; }
.quote-card .avatar { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: var(--rust); color: #fff; font-family: var(--serif); font-weight: 700; }
.quote-card .attr-name { color: var(--ink); font-size: 14px; font-weight: 500; }
.quote-card .attr-role { color: var(--muted); font-size: 12.5px; }
.dots { display: flex; justify-content: center; gap: 7px; margin-top: 22px; }
.dots span { width: 7px; height: 7px; border-radius: 50%; background: rgba(251, 243, 236, .4); }
.dots span.on { width: 22px; border-radius: 4px; background: #fbf3ec; }
.worksrow { margin-top: 28px; text-align: center; }
.worksrow .lbl { margin-bottom: 12px; font-size: 11px; letter-spacing: .16em; text-transform: uppercase; opacity: .7; }
.worksrow .names { display: flex; justify-content: center; flex-wrap: wrap; gap: 22px; font-family: var(--serif); font-size: 19px; font-weight: 600; opacity: .92; }
.split-right { display: flex; align-items: center; justify-content: center; padding: 40px; background: var(--bg); }
.auth-col { width: 100%; max-width: 400px; }
.auth-col h1 { margin-bottom: 24px; font-family: var(--serif); font-size: 34px; font-weight: 600; line-height: 1.15; text-align: center; }
.auth-sub { margin: -10px 0 20px; color: var(--ink-mid); font-size: 14.5px; line-height: 1.5; text-align: center; }
.auth-hint { margin: 6px 0 0; color: var(--muted); font-size: 12.5px; }
.invite-context { margin: -8px 0 20px; padding: 11px 13px; border-radius: 9px; background: var(--rust-dim); color: var(--rust-dark); font-size: 13px; line-height: 1.5; }
.auth-notice { margin-top: 14px; padding: 10px 12px; border: 1px solid rgba(56,116,72,.2); border-radius: 9px; background: rgba(56,116,72,.08); color: var(--success); font-size: 12.5px; line-height: 1.5; }
.organization-card { display: flex; align-items: center; gap: 13px; min-height: 78px; padding: 14px 16px; border: 1px solid var(--line); border-radius: 12px; background: #fff; }
.organization-avatar { display: grid; place-items: center; width: 46px; height: 46px; flex: none; border-radius: 11px; background: var(--ink); color: #fff; font-family: var(--serif); font-size: 22px; font-weight: 700; }
.organization-copy { display: flex; min-width: 0; flex-direction: column; line-height: 1.45; }
.organization-copy strong, .organization-copy span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.organization-copy strong { font-size: 14.5px; }
.organization-copy span { color: var(--muted); font-size: 12.5px; }
.organization-copy .organization-state { color: var(--rust-dark); font-size: 10.5px; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; }
.code-row { display: flex; justify-content: center; gap: 10px; margin: 8px 0 18px; }
.code-row input { width: 48px; height: 56px; text-align: center; font-size: 24px; font-weight: 600; }
.code-links { display: flex; justify-content: space-between; margin-top: 12px; font-size: 13.5px; }
.code-links a, .muted-link { color: var(--muted); }
.muted-link { display: block; margin: 8px 0; font-size: 13.5px; text-align: center; }
.trustline { margin: 18px 0; color: var(--muted); font-size: 12.5px; text-align: center; }
.legal-links { margin-top: 18px; color: var(--muted); font-size: 11.5px; line-height: 1.5; text-align: center; }
.legal-links a { color: inherit; text-underline-offset: 2px; }
@media (max-width: 860px) {
  .split { grid-template-columns: 1fr; }
  .split-left { min-height: auto; }
}
@media (max-width: 640px) {
  .split-left { padding: 28px 20px 32px; }
  .quote-card { margin: 24px auto 0; padding: 22px; }
  .split-right { padding: 32px 20px; }
}
@media (max-width: 480px) {
  .code-row { gap: 6px; }
  .code-row input { width: 40px; height: 52px; }
}