* {
  box-sizing:border-box
}
body {
  margin:0;
  color:var(--kiwi-color-text);
  background:var(--kiwi-color-canvas);
  font-family:var(--kiwi-font-sans);
  line-height:1.6;
  -webkit-font-smoothing:antialiased
}
a {
  color:var(--kiwi-color-interactive);
  text-decoration:none
}
button,input {
  font:inherit
}
a:focus-visible,button:focus-visible {
  outline:2px solid var(--kiwi-color-focus);
  outline-offset:5px
}
.shell {
  max-width:1120px;
  min-height:100svh;
  margin:auto;
  padding:40px 48px;
  display:flex;
  flex-direction:column
}
header,footer {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px
}
.brand {
  display:flex;
  align-items:center;
  gap:14px;
  color:var(--kiwi-color-text);
  font-size:13px;
  font-weight:750;
  letter-spacing:.09em
}
.brand-mark {
  font-size:28px;
  font-weight:850;
  letter-spacing:-.12em;
  line-height:1
}
.brand-mark span {
  color:var(--kiwi-color-interactive)
}
.brand-sub {
  display:block;
  font-size:9px;
  letter-spacing:.16em;
  font-weight:500;
  color:var(--kiwi-color-text-muted)
}
.private-note,.eyebrow,.context-note {
  font-size:10px;
  font-weight:650;
  letter-spacing:.16em;
  color:var(--kiwi-color-text-muted)
}
main {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,.65fr);
  gap:96px;
  align-items:center;
  flex:1;
  padding:88px 0 104px
}
.panel {
  max-width:440px;
  min-width:0
}
.eyebrow {
  margin:0 0 20px
}
h1 {
  font-size:clamp(32px,4vw,46px);
  letter-spacing:-.055em;
  line-height:1.22;
  margin:0 0 22px;
  font-weight:650;
  word-break:keep-all
}
.description {
  color:var(--kiwi-color-text-muted);
  font-size:15px;
  margin:0 0 36px;
  word-break:keep-all
}
.button {
  display:flex;
  width:100%;
  min-height:48px;
  align-items:center;
  justify-content:center;
  gap:12px;
  border:0;
  border-radius:var(--kiwi-radius-md);
  padding:12px 20px;
  font-size:14px;
  font-weight:650;
  cursor:pointer;
  transition:background 160ms,color 160ms
}
.primary {
  background:var(--kiwi-color-brand-field);
  color:var(--kiwi-color-on-brand)
}
.primary:hover {
  background:var(--kiwi-color-brand-field-hover)
}
.primary:active {
  background:var(--kiwi-color-brand-field-active)
}
.secondary {
  background:var(--kiwi-color-surface);
  color:var(--kiwi-color-text);
  border:1px solid var(--kiwi-color-control-border)
}
.secondary:hover {
  background:var(--kiwi-color-control-hover)
}
.secondary:active {
  background:var(--kiwi-color-control-active)
}
.google {
  justify-content:space-between
}
.google-mark {
  font-size:19px;
  font-weight:750
}
.hint {
  font-size:12px;
  color:var(--kiwi-color-text-muted);
  margin:16px 0 0
}
.notice {
  padding:16px;
  background:var(--kiwi-color-error-soft);
  color:var(--kiwi-color-error);
  border-radius:var(--kiwi-radius-md);
  font-size:14px;
  overflow-wrap:anywhere;
  margin-bottom:24px
}
.account {
  display:flex;
  flex-direction:column;
  background:var(--kiwi-color-surface);
  border-radius:var(--kiwi-radius-md);
  padding:20px 24px;
  margin:0 0 24px;
  overflow-wrap:anywhere
}
.account-label {
  font-size:11px;
  color:var(--kiwi-color-text-muted);
  margin-bottom:8px
}
.account-email {
  font-size:13px;
  color:var(--kiwi-color-text-muted)
}
.context {
  padding-left:40px;
  border-left:1px solid var(--kiwi-color-border);
  align-self:center
}
.context p {
  font-size:28px;
  letter-spacing:-.045em;
  line-height:1.5;
  margin:24px 0 28px;
  word-break:keep-all
}
.status-dot {
  display:block;
  width:12px;
  height:12px;
  border-radius:50%;
  background:var(--kiwi-color-brand-field)
}
footer {
  font-size:11px;
  color:var(--kiwi-color-text-muted);
  border-top:1px solid var(--kiwi-color-border);
  padding-top:22px
}
@media(max-width:700px) {
  .shell {
    padding:28px 24px
  }
  .private-note {
    display:none
  }
  main {
    grid-template-columns:minmax(0,1fr);
    gap:56px;
    padding:64px 0
  }
  .panel {
    max-width:none
  }
  .context {
    padding-left:20px
  }
  .context p {
    font-size:20px;
    margin:16px 0
  }
  .context-note {
    font-size:9px
  }
  footer {
    gap:12px;
    font-size:10px
  }
}
@media(prefers-reduced-motion:reduce) {
  * {
    transition:none!important;
    scroll-behavior:auto!important
  }
}