[inert] {
  pointer-events: none;
}
[hidden] {
  display: none !important;
}
html,
body {
  height: 100%;
}
button:focus,
a:focus,
input:focus,
select:focus {
  outline: 2px solid #77659d;
  outline-offset: 2px;
}
.shell {
  padding: 24px 32px 18px;
}
.row > .btn + .btn,
.bottom > .btn + .btn,
.sheet-foot > .btn + .btn {
  margin-left: 10px;
}
.row-icon {
  margin-right: 14px;
}
.top > .icon-btn {
  margin-right: 16px;
}
.r8-hardware-hint span + span {
  margin-left: 14px;
}
.family-orbit {
  width: 292px;
  max-width: 100%;
}
.r9-crop {
  width: 600px;
  max-width: 100%;
  padding: 20px 22px 18px;
}
.phone-page {
  width: 480px;
  max-width: 100%;
  min-height: 100%;
}
.phone-page .hero-photo {
  height: 180px;
}
.r9-pick-grid img {
  height: 110px;
}
.photo-card img {
  height: 130px;
}
.r9-crop-preview {
  height: 280px;
}
.r9-compose-foot {
  padding: 14px 0 18px;
}
html[data-surface=phone] .r9-composing {
  height: 100vh;
}
html[data-surface=frame] {
  --r8-edge:28px;
}
.r8-frame .clock b {
  font-size: 36px;
}
.r8-caption h2 {
  font-size: 24px;
}
html[data-surface=frame] .sheet {
  padding: 22px 28px 18px;
}
html[data-surface=frame] .sheet-head h2 {
  font-size: 28px !important;
}
html[data-surface=frame] .r8-letter {
  font-size: 26px;
}
.r8-record time {
  font-size: 48px;
}
html[data-surface=frame] .draft-text {
  height: 140px;
}
.r8-ai-welcome {
  font-size: 36px !important;
}
.qr-card {
  padding: 14px;
}
.system-progress {
  width: 80%;
  max-width: 400px;
}
.update-line {
  width: 320px;
  max-width: 100%;
}
.btn {
  flex-shrink: 0;
}
.shell .content {
  min-height: 0;
}
.assistant-input {
  min-width: 0;
}
.call-identity > img {
  margin-right: 18px;
}
@media (max-height:380px) {
  .shell {
    padding: 10px 18px;
  }
  .shell h1 {
    font-size: 22px;
  }
  .shell .content {
    padding-top: 8px;
  }
  .shell .bottom {
    padding-top: 8px;
  }
  .top {
    min-height: 40px;
  }
  html[data-surface=frame] {
    --r8-edge:18px;
  }
  html[data-surface=frame] .sheet {
    padding: 12px 18px 10px;
  }
  .r8-frame .clock b {
    font-size: 26px;
  }
  .r8-caption h2 {
    font-size: 18px;
  }
  html[data-surface=frame] .sheet-head h2 {
    font-size: 22px !important;
  }
  html[data-surface=frame] .r8-letter {
    font-size: 19px;
  }
  .r8-record time {
    font-size: 36px;
  }
  html[data-surface=frame] .draft-text {
    height: 76px;
    min-height: 76px;
  }
  .photo-card img {
    height: 110px;
  }
  .system-menu {
    grid-grid-gap: 0 16px;
  }
  .bottom .btn {
    min-height: 48px;
  }
  .pairing .qr-card {
    padding: 6px;
  }
  .qr-card canvas {
    width: 120px !important;
    height: 120px !important;
  }
}
html[data-family-scale][data-surface=phone] .r9-composing {
  height: var(--family-height);
  min-height: 0;
}
html[data-unseen-scale] body {
  height: var(--unseen-canvas-height) !important;
}