:root {
      --bg: #f4f7f6;
      --surface: #ffffff;
      --surface-soft: #eef5f2;
      --text: #14211c;
      --muted: #68766f;
      --line: #dbe5e0;
      --primary: #147a56;
      --primary-dark: #0f5d43;
      --trip: #1d72b8;
      --meet: #147a56;
      --service: #b7791f;
      --social: #7c3aed;
      --danger: #b42318;
      --shadow: 0 12px 30px rgba(18, 33, 28, 0.08);
      --radius: 18px;
      color-scheme: light;
    }

    html[data-theme="dark"] {
      --bg: #0f1513;
      --surface: #161f1c;
      --surface-soft: #1d2925;
      --text: #edf5f1;
      --muted: #a5b4ad;
      --line: #2d3a35;
      --primary: #39a97c;
      --primary-dark: #23835f;
      --trip: #3b8ed0;
      --meet: #2f9d73;
      --service: #c58b38;
      --social: #8d67d9;
      --danger: #ff8075;
      --shadow: 0 12px 30px rgba(0, 0, 0, 0.28);
      color-scheme: dark;
    }

    * { box-sizing: border-box; }
    html { scroll-behavior: smooth; }

    body {
      margin: 0;
      font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
      background:
        radial-gradient(circle at top right, rgba(158, 216, 194, .23), transparent 28rem),
        var(--bg);
      color: var(--text);
    }

    button, input, select, textarea { font: inherit; }
    button { cursor: pointer; }
    a { color: inherit; }

    .shell {
      width: min(1180px, calc(100% - 32px));
      margin: 0 auto;
    }

    .topbar {
      position: sticky;
      top: 0;
      z-index: 20;
      backdrop-filter: blur(12px);
      background: color-mix(in srgb, var(--bg) 90%, transparent);
      border-bottom: 1px solid rgba(219, 229, 224, .8);
    }

    .topbar-inner {
      min-height: 74px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 20px;
    }

    .brand {
      display: flex;
      align-items: center;
      gap: 12px;
      font-weight: 800;
      letter-spacing: -0.02em;
    }

    .brand-mark {
      width: 42px;
      height: 42px;
      border-radius: 13px;
      display: grid;
      place-items: center;
      background: linear-gradient(145deg, var(--primary), var(--primary-dark));
      color: #fff;
      box-shadow: var(--shadow);
    }

    .brand small {
      display: block;
      color: var(--muted);
      font-size: .74rem;
      font-weight: 700;
      letter-spacing: .08em;
      text-transform: uppercase;
      margin-top: 2px;
    }

    .nav {
      display: flex;
      gap: 8px;
      align-items: center;
    }

    .nav a, .nav button {
      color: var(--muted);
      text-decoration: none;
      padding: 9px 12px;
      border-radius: 10px;
      font-weight: 700;
      font-size: .92rem;
      border: 0;
      background: transparent;
    }

    .nav a:hover, .nav button:hover {
      color: var(--text);
      background: var(--surface);
    }

    .hero { padding: 64px 0 28px; }

    .hero-grid {
      display: grid;
      grid-template-columns: 1.35fr .65fr;
      gap: 24px;
      align-items: stretch;
    }

    .hero-card, .hero-side {
      border: 1px solid var(--line);
      background: color-mix(in srgb, var(--surface) 92%, transparent);
      border-radius: 28px;
      box-shadow: var(--shadow);
    }

    .hero-card {
      padding: 36px;
      overflow: hidden;
      position: relative;
    }

    .hero-card::after {
      content: "PRIUS";
      position: absolute;
      right: -10px;
      bottom: -38px;
      font-size: clamp(4.5rem, 12vw, 9rem);
      font-weight: 900;
      letter-spacing: -.08em;
      color: rgba(20, 122, 86, .055);
      pointer-events: none;
    }

    .eyebrow {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      padding: 7px 11px;
      border-radius: 999px;
      background: var(--surface-soft);
      color: var(--primary-dark);
      font-weight: 800;
      font-size: .78rem;
      text-transform: uppercase;
      letter-spacing: .08em;
    }

    h1 {
      margin: 18px 0 12px;
      font-size: clamp(2.2rem, 6vw, 4.9rem);
      line-height: .95;
      letter-spacing: -.065em;
      max-width: 760px;
    }

    .lead {
      max-width: 720px;
      color: var(--muted);
      line-height: 1.7;
      font-size: 1.05rem;
    }

    .hero-actions {
      display: flex;
      flex-wrap: wrap;
      gap: 10px;
      margin-top: 26px;
    }

    .btn {
      border: 0;
      border-radius: 12px;
      padding: 12px 16px;
      font-weight: 800;
      transition: .18s ease;
      text-decoration: none;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
    }

    .btn-primary { color: white; background: var(--primary); }
    .btn-primary:hover { transform: translateY(-1px); background: var(--primary-dark); }

    .btn-secondary {
      background: var(--surface-soft);
      color: var(--text);
      border: 1px solid var(--line);
    }

    .btn-danger {
      background: color-mix(in srgb, var(--surface) 84%, #d94841 16%);
      color: var(--danger);
      border: 1px solid #f4c7c3;
    }

    .hero-side {
      padding: 24px;
      background: linear-gradient(145deg, rgba(20,122,86,.96), rgba(9,66,48,.98));
      color: white;
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      min-height: 310px;
    }

    .hero-side .muted { color: rgba(255,255,255,.68); }
    .stat {
      font-size: 3.6rem;
      line-height: 1;
      font-weight: 900;
      letter-spacing: -.05em;
      margin: 8px 0 0;
    }

    .next-event {
      border-top: 1px solid rgba(255,255,255,.18);
      padding-top: 18px;
      margin-top: 28px;
    }

    main { padding-bottom: 70px; }

    .toolbar {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 14px;
      margin: 24px 0 16px;
      flex-wrap: wrap;
    }

    .toolbar-left, .toolbar-right {
      display: flex;
      align-items: center;
      gap: 10px;
      flex-wrap: wrap;
    }

    .toolbar h2, .section-title h2 {
      margin: 0;
      font-size: 1.55rem;
      letter-spacing: -.035em;
    }

    .icon-btn {
      width: 40px;
      height: 40px;
      border-radius: 11px;
      border: 1px solid var(--line);
      background: var(--surface);
      color: var(--text);
    }

    .filter-btn {
      border: 1px solid var(--line);
      background: var(--surface);
      padding: 9px 12px;
      border-radius: 999px;
      font-weight: 800;
      color: var(--muted);
    }

    .filter-btn.active {
      background: var(--text);
      color: white;
      border-color: var(--text);
    }

    .calendar {
      border: 1px solid var(--line);
      background: var(--surface);
      border-radius: var(--radius);
      overflow: hidden;
      box-shadow: var(--shadow);
    }

    .weekdays, .calendar-grid {
      display: grid;
      grid-template-columns: repeat(7, 1fr);
    }

    .weekdays {
      border-bottom: 1px solid var(--line);
      background: color-mix(in srgb, var(--surface) 92%, var(--bg));
    }

    .weekdays div {
      padding: 14px 10px;
      color: var(--muted);
      font-size: .78rem;
      font-weight: 900;
      text-align: center;
      text-transform: uppercase;
      letter-spacing: .06em;
    }

    .day {
      min-height: 130px;
      padding: 10px;
      border-right: 1px solid var(--line);
      border-bottom: 1px solid var(--line);
      background: var(--surface);
    }

    .day:nth-child(7n) { border-right: 0; }
    .day.outside { background: color-mix(in srgb, var(--surface) 85%, var(--bg)); color: #abb5b0; }
    .day.today .date-number { background: var(--primary); color: white; }

    .date-number {
      width: 30px;
      height: 30px;
      border-radius: 50%;
      display: grid;
      place-items: center;
      font-size: .86rem;
      font-weight: 900;
      margin-bottom: 6px;
    }

    .event-chip {
      display: block;
      width: 100%;
      border: 0;
      text-align: left;
      border-radius: 8px;
      padding: 7px 8px;
      margin: 5px 0 0;
      font-size: .74rem;
      font-weight: 800;
      color: white;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    .trip { background-color: var(--trip); }
    .meet { background-color: var(--meet); }
    .service { background-color: var(--service); }
    .social { background-color: var(--social); }

    .section-title {
      margin: 34px 0 16px;
      display: flex;
      align-items: end;
      justify-content: space-between;
      gap: 14px;
    }

    .section-title p { margin: 4px 0 0; color: var(--muted); }

    .events-list {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 14px;
    }

    .event-card {
      background: var(--surface);
      border: 1px solid var(--line);
      border-radius: 16px;
      padding: 18px;
      box-shadow: 0 8px 18px rgba(18,33,28,.045);
      transition: .18s ease;
    }

    .event-card:hover { transform: translateY(-2px); box-shadow: var(--shadow); }

    .event-meta {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      margin-bottom: 14px;
    }

    .tag {
      padding: 6px 9px;
      border-radius: 999px;
      font-size: .72rem;
      font-weight: 900;
      color: white;
    }

    .date-badge { font-size: .78rem; color: var(--muted); font-weight: 800; }

    .event-card h3 { margin: 0 0 8px; font-size: 1.08rem; }
    .event-card p { margin: 0; color: var(--muted); line-height: 1.55; font-size: .92rem; }

    .event-card .details {
      display: grid;
      gap: 7px;
      margin-top: 16px;
      padding-top: 14px;
      border-top: 1px solid var(--line);
      font-size: .84rem;
      color: var(--muted);
    }


    .event-view-tabs {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      margin: 0 0 18px;
    }

    .event-view-tab {
      border: 1px solid var(--line);
      background: var(--surface);
      color: var(--muted);
      border-radius: 999px;
      padding: 9px 13px;
      font-weight: 900;
      cursor: pointer;
    }

    .event-view-tab.active {
      background: var(--primary);
      border-color: var(--primary);
      color: #fff;
    }

    .event-participation {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 10px;
      margin-top: 14px;
      padding-top: 14px;
      border-top: 1px solid var(--line);
      flex-wrap: wrap;
    }

    .participant-count {
      display: inline-flex;
      align-items: center;
      gap: 7px;
      font-size: .86rem;
      font-weight: 900;
      color: var(--text);
    }

    .rsvp-btn {
      border: 1px solid var(--line);
      background: var(--surface-soft);
      color: var(--text);
      border-radius: 10px;
      padding: 9px 11px;
      font-weight: 900;
    }

    .rsvp-btn.attending {
      color: white;
      background: var(--primary);
      border-color: var(--primary);
    }

    .user-state {
      display: inline-flex;
      align-items: center;
      gap: 8px;
    }

    .user-state button {
      white-space: nowrap;
    }

    .auth-tabs {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 6px;
      margin: 4px 0 18px;
      padding: 4px;
      border-radius: 12px;
      background: var(--surface-soft);
    }

    .auth-tab {
      border: 0;
      border-radius: 9px;
      padding: 9px 10px;
      background: transparent;
      color: var(--muted);
      font-weight: 900;
    }

    .auth-tab.active {
      background: var(--surface);
      color: var(--text);
      box-shadow: 0 3px 10px rgba(0,0,0,.06);
    }

    .auth-pane {
      display: none;
    }

    .auth-pane.active {
      display: block;
    }

    .auth-message {
      display: none;
      margin-top: 12px;
      padding: 10px 12px;
      border-radius: 10px;
      background: var(--surface-soft);
      border: 1px solid var(--line);
      color: var(--text);
      font-size: .88rem;
      line-height: 1.5;
    }

    .auth-message.show {
      display: block;
    }

    .profile-summary {
      display: grid;
      gap: 6px;
      margin: 10px 0 18px;
      padding: 12px;
      border-radius: 12px;
      background: var(--surface-soft);
      color: var(--muted);
      font-size: .9rem;
    }

    .participant-panel {
      margin-top: 18px;
      padding: 16px;
      border: 1px solid var(--line);
      border-radius: 14px;
      background: var(--surface);
    }

    .participant-panel-head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      flex-wrap: wrap;
    }

    .participant-panel-head h4 {
      margin: 0;
      font-size: 1rem;
    }

    .participant-list {
      display: grid;
      gap: 8px;
      margin-top: 12px;
    }

    .participant-person {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      padding: 9px 10px;
      border-radius: 10px;
      background: var(--surface-soft);
      font-size: .88rem;
    }

    .participant-person small {
      color: var(--muted);
    }

    .checkbox-row {
      display: flex;
      align-items: flex-start;
      gap: 9px;
      color: var(--muted);
      font-size: .88rem;
      line-height: 1.45;
    }

    .checkbox-row input {
      margin-top: 3px;
      flex: 0 0 auto;
    }

    .modal-rsvp {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      margin-top: 18px;
      padding: 14px;
      border-radius: 14px;
      background: var(--surface-soft);
      flex-wrap: wrap;
    }

    .modal-rsvp strong {
      display: block;
    }


    .submission-status {
      display: inline-flex;
      align-items: center;
      gap: 7px;
      padding: 6px 9px;
      border-radius: 999px;
      font-size: .78rem;
      font-weight: 900;
      border: 1px solid var(--line);
      background: var(--surface-soft);
    }

    .submission-status.pending {
      color: #8a5a00;
    }

    .submission-status.approved {
      color: var(--primary);
    }

    .submission-status.rejected {
      color: var(--danger);
    }

    .pending-events-list {
      display: grid;
      gap: 12px;
      margin-top: 14px;
    }

    .pending-event-item {
      padding: 14px;
      border: 1px solid var(--line);
      border-radius: 14px;
      background: var(--surface);
    }

    .pending-event-item h4 {
      margin: 0 0 6px;
      font-size: 1rem;
    }

    .pending-event-item p {
      margin: 6px 0;
      color: var(--muted);
      font-size: .88rem;
      line-height: 1.5;
    }

    .pending-event-meta {
      display: flex;
      flex-wrap: wrap;
      gap: 8px 12px;
      margin-top: 8px;
      color: var(--muted);
      font-size: .82rem;
    }

    .pending-event-actions {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      margin-top: 12px;
    }

    .user-submissions {
      display: grid;
      gap: 10px;
      margin-top: 12px;
    }

    .user-submission-row {
      padding: 10px 12px;
      border: 1px solid var(--line);
      border-radius: 10px;
      background: var(--surface-soft);
      font-size: .87rem;
    }

    .modal-rsvp small {
      color: var(--muted);
    }

    .map-wrap {
      margin-top: 18px;
      border-radius: 14px;
      overflow: hidden;
      border: 1px solid var(--line);
      background: var(--surface-soft);
      min-height: 280px;
    }

    .map-wrap iframe,
    .map-wrap .leaflet-map {
      display: block;
      width: 100%;
      height: 360px;
      border: 0;
    }

    .route-actions {
      display: none;
      margin-top: 14px;
      padding: 14px;
      border: 1px solid var(--line);
      border-radius: 14px;
      background: var(--surface);
    }

    .route-actions.visible {
      display: block;
    }

    .route-actions-buttons {
      display: flex;
      flex-wrap: wrap;
      gap: 9px;
    }

    .route-actions p {
      margin: 10px 0 0;
      font-size: .84rem;
      color: var(--muted);
      line-height: 1.5;
    }

    .route-meta {
      display: flex;
      flex-wrap: wrap;
      gap: 8px 14px;
      margin: 10px 0 0;
      color: var(--muted);
      font-size: .84rem;
      font-weight: 700;
    }

    .file-help {
      margin-top: 5px;
      color: var(--muted);
      font-size: .8rem;
      line-height: 1.45;
    }


    .recurrence-box {
      padding: 14px;
      border: 1px solid var(--line);
      border-radius: 14px;
      background: var(--surface-soft);
    }

    .recurrence-box.disabled {
      opacity: .62;
    }

    .recurrence-preview {
      margin-top: 8px;
      color: var(--muted);
      font-size: .82rem;
      line-height: 1.5;
    }

    .current-route {
      display: none;
      margin-top: 8px;
      padding: 10px 12px;
      border-radius: 10px;
      background: var(--surface-soft);
      color: var(--text);
      font-size: .84rem;
    }

    .current-route.visible {
      display: block;
    }

    .remove-route-row {
      display: none;
      align-items: center;
      gap: 8px;
      margin-top: 8px;
      color: var(--muted);
      font-size: .86rem;
    }

    .remove-route-row.visible {
      display: flex;
    }

    .leaflet-container {
      font-family: inherit;
      background: var(--surface-soft);
    }

    .admin-panel {
      display: none;
      margin: 36px 0;
      padding: 24px;
      background: var(--surface);
      border: 1px solid var(--line);
      border-radius: 20px;
      box-shadow: var(--shadow);
    }

    .admin-panel.open { display: block; }

    .admin-grid {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 14px;
    }

    .field { display: grid; gap: 6px; }
    .field.full { grid-column: 1 / -1; }

    .field label {
      font-size: .78rem;
      font-weight: 900;
      color: var(--muted);
      text-transform: uppercase;
      letter-spacing: .04em;
    }

    .field input, .field select, .field textarea {
      width: 100%;
      border: 1px solid var(--line);
      border-radius: 11px;
      padding: 11px 12px;
      background: var(--surface);
      color: var(--text);
      outline: none;
    }

    .field textarea { min-height: 100px; resize: vertical; }

    .field input:focus, .field select:focus, .field textarea:focus {
      border-color: var(--primary);
      box-shadow: 0 0 0 3px rgba(20,122,86,.1);
    }

    .admin-actions {
      display: flex;
      gap: 10px;
      flex-wrap: wrap;
      margin-top: 16px;
    }

    .admin-list {
      margin-top: 28px;
      display: grid;
      gap: 10px;
    }

    .admin-item {
      display: grid;
      grid-template-columns: 1fr auto;
      gap: 14px;
      align-items: center;
      padding: 14px;
      border: 1px solid var(--line);
      border-radius: 12px;
    }

    .admin-item small { color: var(--muted); }
    .admin-item-actions { display: flex; gap: 8px; }

    .tiny-btn {
      border: 1px solid var(--line);
      background: var(--surface-soft);
      border-radius: 9px;
      padding: 8px 10px;
      font-weight: 800;
    }

    .tiny-btn.delete { color: var(--danger); }

    .notice {
      margin-top: 14px;
      padding: 12px 14px;
      border-radius: 12px;
      background: color-mix(in srgb, var(--surface) 86%, #d39b2a 14%);
      border: 1px solid #ead7a0;
      color: var(--text);
      line-height: 1.5;
      font-size: .88rem;
    }


    .login-card {
      width: min(430px, 100%);
      background: var(--surface);
      border: 1px solid var(--line);
      border-radius: 22px;
      padding: 24px;
      box-shadow: 0 30px 80px rgba(0,0,0,.28);
    }

    .login-card h3 {
      margin: 0 0 8px;
      font-size: 1.5rem;
    }

    .login-card p {
      margin: 0 0 18px;
      color: var(--muted);
      line-height: 1.55;
    }

    .login-error {
      display: none;
      margin-top: 12px;
      padding: 10px 12px;
      border-radius: 10px;
      background: color-mix(in srgb, var(--surface) 82%, #d94841 18%);
      border: 1px solid color-mix(in srgb, var(--line) 70%, #d94841 30%);
      color: var(--danger);
      font-size: .88rem;
      font-weight: 700;
    }

    .login-error.show { display: block; }

    .security-box {
      margin: 0 0 22px;
      padding: 16px;
      border: 1px solid var(--line);
      border-radius: 14px;
      background: var(--surface-soft);
    }

    .security-box h3 {
      margin: 0 0 6px;
      font-size: 1rem;
    }

    .security-box p {
      margin: 0;
      color: var(--muted);
      line-height: 1.55;
      font-size: .9rem;
    }

    .security-box .admin-actions {
      margin-top: 12px;
    }

    .security-state {
      display: inline-flex;
      align-items: center;
      gap: 7px;
      margin-bottom: 8px;
      padding: 6px 9px;
      border-radius: 999px;
      background: var(--surface);
      border: 1px solid var(--line);
      font-size: .78rem;
      font-weight: 900;
    }

    .mfa-qr {
      width: min(260px, 100%);
      display: block;
      margin: 16px auto;
      padding: 10px;
      background: white;
      border-radius: 12px;
    }

    .mfa-secret {
      display: block;
      padding: 10px 12px;
      border-radius: 10px;
      background: var(--surface-soft);
      border: 1px solid var(--line);
      word-break: break-all;
      font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
      font-size: .82rem;
      margin: 10px 0;
    }

    .security-warning {
      color: var(--danger);
      font-weight: 800;
    }

    .admin-status {
      display: none;
      align-items: center;
      gap: 8px;
      padding: 7px 10px;
      border-radius: 999px;
      background: var(--surface-soft);
      color: var(--primary);
      font-size: .78rem;
      font-weight: 900;
    }

    .admin-status.visible { display: inline-flex; }

    .modal-backdrop {
      position: fixed;
      inset: 0;
      z-index: 50;
      background: rgba(10, 20, 16, .56);
      display: none;
      align-items: center;
      justify-content: center;
      padding: 20px;
    }

    .modal-backdrop.open { display: flex; }

    .modal {
      width: min(680px, 100%);
      max-height: 92vh;
      overflow: auto;
      background: var(--surface);
      border-radius: 22px;
      padding: 24px;
      box-shadow: 0 30px 80px rgba(0,0,0,.28);
    }

    .modal-head {
      display: flex;
      align-items: flex-start;
      justify-content: space-between;
      gap: 16px;
    }

    .modal h3 { margin: 10px 0 8px; font-size: 1.55rem; }
    .modal p { color: var(--muted); line-height: 1.6; }

    .modal-details {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 10px;
      margin-top: 18px;
    }

    .detail-box {
      padding: 12px;
      border-radius: 12px;
      background: var(--surface-soft);
    }

    .detail-box small {
      display: block;
      color: var(--muted);
      font-weight: 800;
      text-transform: uppercase;
      font-size: .68rem;
      letter-spacing: .05em;
      margin-bottom: 3px;
    }

    footer {
      border-top: 1px solid var(--line);
      padding: 24px 0 38px;
      color: var(--muted);
      font-size: .88rem;
    }

    .legend {
      display: flex;
      flex-wrap: wrap;
      gap: 10px;
      margin-top: 12px;
    }

    .legend span {
      display: inline-flex;
      align-items: center;
      gap: 7px;
      font-size: .78rem;
      color: var(--muted);
      font-weight: 700;
    }

    .legend i {
      width: 9px;
      height: 9px;
      border-radius: 50%;
      display: inline-block;
    }

    @media (max-width: 900px) {
      .hero-grid { grid-template-columns: 1fr; }
      .events-list { grid-template-columns: 1fr 1fr; }
      .day { min-height: 110px; padding: 8px; }
    }

    @media (max-width: 680px) {
      .shell { width: min(100% - 20px, 1180px); }
      .topbar-inner { min-height: 64px; }
      .nav a { display: none; }
      .nav button { padding: 8px 10px; }
      .hero { padding-top: 28px; }
      .hero-card, .hero-side { border-radius: 20px; }
      .hero-card { padding: 24px 20px; }
      .hero-side { min-height: 240px; }
      .calendar { overflow-x: auto; }
      .weekdays, .calendar-grid { min-width: 760px; }
      .day { min-height: 105px; }
      .events-list { grid-template-columns: 1fr; }
      .toolbar { align-items: flex-start; }
      .toolbar-right { width: 100%; }
      .filter-btn { flex: 1; min-width: max-content; }
      .modal-details, .admin-grid { grid-template-columns: 1fr; }
      .field.full { grid-column: auto; }
      .admin-item { grid-template-columns: 1fr; }
    }
    #securityBox,
    #mfaChallengeBackdrop,
    #mfaEnrollBackdrop {
      display: none !important;
    }