:root[data-office-theme="google"] {
  font-family: "Google Sans", Arial, sans-serif;
  color: #1f1f1f;
  background: #f8fafd;
  --muted: #5f6368;
  --line: #d3e3fd;
  --paper: #fff;
  --ink: #0b57d0;
  --error: #b3261e;
}

:root[data-office-theme="google"] body,
:root[data-office-theme="microsoft"] body {
  min-height: 100vh;
  background: inherit;
}

:root[data-office-theme="google"] .masthead {
  background: #fff;
  border-color: #e1e7ef;
}

:root[data-office-theme="google"] .wordmark {
  color: #0b57d0;
  letter-spacing: -.35px;
}

:root[data-office-theme="google"] button,
:root[data-office-theme="google"] .button {
  background: #0b57d0;
  border-color: #0b57d0;
  border-radius: 999px;
}

:root[data-office-theme="google"] .secondary,
:root[data-office-theme="google"] .text-button,
:root[data-office-theme="google"] .danger {
  background: transparent;
}

:root[data-office-theme="google"] .secondary {
  color: #0b57d0;
  border-color: #747775;
}

:root[data-office-theme="google"] .text-button { color: #0b57d0; }
:root[data-office-theme="google"] .danger { color: #b3261e; border-color: #f2b8b5; }
:root[data-office-theme="google"] :focus-visible { outline-color: #0b57d0; }

:root[data-office-theme="google"] .intro { padding-bottom: 28px; }
:root[data-office-theme="google"] .launch,
:root[data-office-theme="google"] .section {
  margin: 0 0 18px;
  padding: 28px;
  border: 1px solid #e1e7ef;
  border-radius: 20px;
  background: #fff;
  box-shadow: 0 1px 2px #3c40430d;
}

:root[data-office-theme="google"] input[type="email"],
:root[data-office-theme="google"] select,
:root[data-office-theme="google"] dialog {
  border-color: #747775;
  border-radius: 12px;
}

:root[data-office-theme="google"] .theme-picker select { border-radius: 999px; }
:root[data-office-theme="google"] .file-row { border-color: #e1e7ef; }
:root[data-office-theme="google"] .invite-result { background: #edf4ff; border-radius: 12px; }
:root[data-office-theme="google"] #notice { background: #303030; border-radius: 8px; }

:root[data-office-theme="microsoft"] {
  font-family: "Segoe UI", Arial, sans-serif;
  color: #242424;
  background: #f5f5f5;
  --muted: #616161;
  --line: #e0e0e0;
  --paper: #fff;
  --ink: #0f6cbd;
  --error: #c50f1f;
}

:root[data-office-theme="microsoft"] .masthead {
  background: #fff;
  border-color: #e0e0e0;
  box-shadow: 0 1px 2px #0000000f;
}

:root[data-office-theme="microsoft"] .wordmark {
  color: #0f6cbd;
  letter-spacing: -.25px;
}

:root[data-office-theme="microsoft"] button,
:root[data-office-theme="microsoft"] .button {
  background: #0f6cbd;
  border-color: #0f6cbd;
  border-radius: 4px;
}

:root[data-office-theme="microsoft"] .secondary,
:root[data-office-theme="microsoft"] .text-button,
:root[data-office-theme="microsoft"] .danger {
  background: transparent;
}

:root[data-office-theme="microsoft"] .secondary {
  color: #0f6cbd;
  border-color: #8a8886;
}

:root[data-office-theme="microsoft"] .text-button { color: #0f6cbd; }
:root[data-office-theme="microsoft"] .danger { color: #c50f1f; border-color: #d13438; }
:root[data-office-theme="microsoft"] :focus-visible { outline-color: #0f6cbd; }

:root[data-office-theme="microsoft"] .intro { padding-bottom: 28px; }
:root[data-office-theme="microsoft"] .launch,
:root[data-office-theme="microsoft"] .section {
  margin: 0 0 16px;
  padding: 28px;
  border: 1px solid #e0e0e0;
  border-radius: 4px;
  background: #fff;
  box-shadow: 0 1px 2px #0000000a;
}

:root[data-office-theme="microsoft"] input[type="email"],
:root[data-office-theme="microsoft"] select,
:root[data-office-theme="microsoft"] dialog {
  border-color: #8a8886;
  border-radius: 4px;
}

:root[data-office-theme="microsoft"] .file-row { border-color: #e0e0e0; }
:root[data-office-theme="microsoft"] .invite-result { background: #eff6fc; border-radius: 4px; }
:root[data-office-theme="microsoft"] #notice { background: #323130; border-radius: 4px; }

@media (max-width: 520px) {
  :root[data-office-theme="google"] .launch,
  :root[data-office-theme="google"] .section,
  :root[data-office-theme="microsoft"] .launch,
  :root[data-office-theme="microsoft"] .section { padding: 22px 20px; }
}
