:root {
  --access-bg: #f5f5f6;
  --access-card: #fff;
  --access-head: #ededf0;
  --access-text: #17171a;
  --access-muted: #62626b;
  --access-field: #f5f5f6;
  --access-border: #d9d9df;
  --access-error-bg: #fff0f2;
  --access-error-text: #b5162b;
}
.dark {
  --access-bg: #101114;
  --access-card: #1b1d22;
  --access-head: #22252b;
  --access-text: #f1f2f4;
  --access-muted: #acb1bc;
  --access-field: #25282e;
  --access-border: #484e59;
  --access-error-bg: #391b23;
  --access-error-text: #ffb5bf;
}
body { background: var(--access-bg); color: var(--access-text); }
.shell { background: var(--access-card); border-color: var(--access-border); }
.head { background: var(--access-head); }
.caption, label span, summary { color: var(--access-muted) !important; }
.content a { color: var(--access-text) !important; }
.content a[href="./google-auth.php?start=1"] {
  background: var(--access-field) !important;
  border: 1px solid var(--access-border);
}
input, select, textarea {
  background: var(--access-field) !important;
  color: var(--access-text) !important;
  border-color: var(--access-border) !important;
}
.notice.error { background: var(--access-error-bg); color: var(--access-error-text); }
button[data-theme-toggle] {
  width: auto; min-height: 40px; height: auto; margin: 16px 0 0; padding: 8px 14px;
  border: 1px solid var(--access-border); background: var(--access-card);
  color: var(--access-text); font: inherit; font-size: 14px;
}
button[data-theme-toggle]:hover { background: var(--access-field); }
button[data-theme-toggle]:focus-visible { outline: 2px solid #ef1b2d; outline-offset: 3px; }