/* Shared workspace rules. New components use these tokens instead of repeated overrides. */
.section-options .section-access-form {
  display:grid;
  gap:10px;
  margin:16px 0 0;
  padding:16px;
  border:1px solid var(--control-line);
  border-radius:10px;
  background:#ffffff02
}
.section-access-form>.field-help {
  margin:0;
  max-width:80ch;
  font-size:12px;
  font-weight:400;
  line-height:1.6
}
.invite-scope>.invite-unavailable-reason {
  flex-basis:100%;
  margin:0;
  font-size:12px;
  line-height:1.6;
  color:#9db2b8
}
.guest-signup-unavailable {
  margin-bottom:20px;
  padding:20px;
  border-color:#435355
}
.guest-signup-unavailable h2 {
  margin:0;
  font-size:17px
}
.guest-signup-unavailable p {
  margin:10px 0 0;
  max-width:75ch;
  line-height:1.6;
  color:#b7c9cc;
  font-size:14px
}
.guest-signup-unavailable p.field-help {
  font-size:13px;
  color:#98aeb3
}
.guest-session-restriction {
  display:block;
  max-width:24ch;
  margin:8px auto 0;
  padding:4px 8px;
  border:1px solid #526267;
  border-radius:7px;
  font-size:11px;
  font-weight:500;
  line-height:1.4;
  color:#b6c8cc;
  background:#ffffff04
}
.guest-account-nudge {
  position:fixed;
  right:24px;
  bottom:24px;
  z-index:50;
  box-sizing:border-box;
  width:min(380px,calc(100vw - 32px));
  max-height:calc(100dvh - 48px);
  overflow:auto;
  padding:20px;
  border:1px solid #355155;
  border-radius:16px;
  background:linear-gradient(145deg,#1b2b2e,#151e22 70%);
  color:#dae6e8;
  box-shadow:0 12px 40px #0006
}
.guest-account-nudge[hidden] {
  display:none
}
.guest-account-heading {
  display:flex;
  align-items:center;
  gap:10px
}
.guest-account-heading h2 {
  margin:0;
  font-size:17px;
  line-height:1.4;
  color:#eff7f7
}
.guest-account-icon {
  display:grid;
  place-items:center;
  flex:0 0 34px;
  width:34px;
  height:34px;
  border:1px solid #24c6c840;
  border-radius:10px;
  background:#24c6c80d;
  color:#67ded5
}
.guest-account-icon svg,.guest-account-close svg {
  width:20px;
  height:20px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.7;
  stroke-linecap:round;
  stroke-linejoin:round
}
.guest-account-close {
  display:grid;
  place-items:center;
  align-self:flex-start;
  flex:0 0 32px;
  min-height:32px;
  margin:-6px -6px 0 auto;
  border:0;
  border-radius:8px;
  background:transparent;
  color:#a3babe;
  cursor:pointer
}
.guest-account-close:hover {
  background:#ffffff0a;
  color:#f0f7f7
}
.guest-account-nudge>p {
  margin:14px 0 10px;
  font-size:13px;
  line-height:1.6;
  color:#a9c1c5
}
.guest-account-nudge>ul {
  display:grid;
  gap:8px;
  margin:0;
  padding:0 0 0 18px;
  font-size:13px;
  line-height:1.5
}
.guest-account-nudge li::marker {
  color:#61d5cb
}
.guest-account-actions {
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:18px
}
.guest-account-actions>.button {
  flex:1;
  justify-content:center
}
.guest-account-nudge>small {
  display:block;
  margin-top:10px;
  color:#91a9ae;
  font-size:11px;
  line-height:1.5
}
.guest-account-close:focus-visible {
  outline:2px solid #7be7db;
  outline-offset:2px
}
@media(max-width:600px) {
  .guest-account-nudge {
    right:16px;
    bottom:max(16px,env(safe-area-inset-bottom));
    padding:16px
  }
}
:root {
  --space-1:4px;
  --space-2:8px;
  --space-3:12px;
  --space-4:16px;
  --space-6:24px;
  --space-8:32px;
  --control-height:44px;
  --surface:#171e21;
  --surface-hover:#1d292d;
  --control-line:#35464b
}
/* One disclosure icon across account, settings and expandable cards. */
details>summary.disclosure-summary {
  display:flex;
  align-items:center;
  gap:10px;
  list-style:none;
  cursor:pointer
}
details>summary.disclosure-summary::-webkit-details-marker {
  display:none
}
details>summary.disclosure-summary::after {
  content:'';
  flex:0 0 16px;
  width:16px;
  height:16px;
  margin-left:auto;
  background:currentColor;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='m3.5 6 4.5 4 4.5-4' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;
  transition:transform .18s ease
}
details[open]>summary.disclosure-summary::after {
  transform:rotate(180deg)
}
.ui-select-picker {
  width:100%;
  min-width:0;
  font-weight:400;
  text-align:left
}
.ui-select-picker>summary {
  min-height:44px;
  box-sizing:border-box;
  font-size:14px;
  color:#e4eeee
}
.ui-select-value {
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  min-width:0
}
.ui-select-picker[open] {
  z-index:35
}
.ui-select-picker>.ui-select-menu {
  width:100%;
  min-width:0;
  max-width:none;
  box-sizing:border-box;
  z-index:35;
  max-height:min(320px,45vh)
}
.ui-select-menu>.section-picker-option {
  padding:10px 12px;
  font-size:14px;
  cursor:pointer;
  line-height:1.5
}
.ui-select-menu>[aria-selected=true]::after {
  content:'✓';
  color:#54d4cf;
  margin-left:auto
}
.ui-select-menu>[aria-disabled=true] {
  opacity:.45;
  cursor:not-allowed
}
.ui-select-picker summary[aria-disabled=true] {
  opacity:.5;
  cursor:not-allowed
}
.ui-select-native {
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  min-height:0!important;
  margin:0!important;
  padding:0!important;
  opacity:0!important;
  clip-path:inset(50%)!important;
  overflow:hidden!important;
  pointer-events:none!important
}
.ui-select-picker>.ui-select-menu[popover] {
  position:fixed;
  inset:auto;
  margin:0;
  max-width:calc(100vw - 24px)
}
.ui-select-picker>.ui-select-menu[popover]:popover-open {
  display:block
}
.ui-select-menu .section-picker-option {
  padding:10px 12px;
  font-size:14px;
  cursor:pointer;
  line-height:1.5;
  overflow-wrap:anywhere
}
.ui-select-menu .section-picker-option[aria-selected=true]::after {
  content:'✓';
  color:#54d4cf;
  margin-left:auto
}
.ui-select-menu .section-picker-option[aria-disabled=true] {
  opacity:.45;
  cursor:not-allowed
}
.ui-select-menu [hidden],.ui-select-picker[hidden],.ui-select-error[hidden] {
  display:none!important
}
.ui-select-menu .section-picker-team {
  display:block;
  padding:10px 12px 6px;
  font-size:11px;
  font-weight:750;
  letter-spacing:.06em
}
.ui-select-group+.ui-select-group {
  border-top:1px solid var(--control-line);
  margin-top:6px;
  padding-top:4px
}
.ui-select-error {
  display:block;
  margin-top:6px;
  font-size:12px;
  line-height:1.5;
  color:#ffb2b2
}
.ui-select-picker>summary[aria-invalid=true] {
  border-color:#f08d8d
}
.ui-select-picker>summary {
  font-weight:400;
  text-transform:none;
  letter-spacing:normal
}
.guest-identity-field>.ui-select-picker>summary {
  min-height:48px
}
.contact-field>.ui-select-picker>summary {
  min-height:46px
}
.admin-role-form>.ui-select-picker {
  flex:1;
  min-width:125px
}
select[data-picker-ready][hidden] {
  display:none!important
}
.training-page>.page-heading {
  flex-wrap:wrap;
  align-items:center;
  gap:16px
}
.training-page>.guest-invite-tools {
  margin:0 0 20px
}
.training-page>.month-response-form {
  margin:12px 0 16px;
  gap:10px;
  padding:16px
}
.month-response-form>.field-help {
  flex:1 1 100%;
  margin:0
}
.section-schedules[open]>summary {
  margin-bottom:16px
}
.section-schedules>.button {
  margin:0 0 16px
}
.section-schedules>.schedule-line {
  padding:12px 14px;
  margin:0 0 10px;
  border:1px solid var(--line);
  border-radius:10px
}
.section-schedules>.schedule-line:last-child {
  margin-bottom:0
}
.section-schedules>.schedule-line>p {
  margin:0;
  line-height:1.7
}
.section-options>.section-badge-settings {
  margin-top:16px;
  padding-top:16px
}
.section-badge-settings>summary.disclosure-summary {
  width:auto;
  padding:12px 14px;
  border:1px solid var(--control-line);
  border-radius:10px;
  background:#ffffff03;
  font-weight:650
}
.section-badge-settings[open]>summary {
  border-color:#24c6c866;
  color:#a6eeea
}
@media(max-width:760px) {
  .training-page>.page-heading {
    align-items:flex-start
  }
}
@media(max-width:640px) {
  .training-page>.month-response-form>.button {
    flex:1 1 100%
  }
}
.nav-icon svg {
  width:19px;
  height:19px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.65;
  stroke-linecap:round;
  stroke-linejoin:round
}
.sidebar .side-link {
  font-size:14px;
  gap:12px;
  min-height:44px
}
.sidebar .nav-label {
  font-size:11px;
  letter-spacing:.08em;
  text-transform:uppercase
}
.sidebar-context {
  padding-top:16px;
  margin-top:12px;
  border-top:1px solid var(--line);
  min-width:0
}
.sidebar-context .nav-label {
  margin:0 0 12px
}
.sidebar-context-name,.sidebar-context-picker>summary {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  padding:12px;
  border:1px solid var(--control-line);
  border-radius:10px;
  color:#e4eeee;
  font-size:14px;
  line-height:1.5;
  overflow-wrap:anywhere;
  cursor:pointer
}
.sidebar-context-picker>nav {
  display:grid;
  gap:4px;
  margin-top:6px;
  max-height:40vh;
  overflow-y:auto;
  padding:6px;
  border:1px solid var(--line);
  border-radius:10px;
  background:#111a1d
}
.sidebar-context-picker a,.sidebar-context-links a,.sidebar-context-sections>a {
  display:block;
  padding:10px 12px;
  font-size:13px;
  line-height:1.45;
  color:#aebfc2;
  border-radius:8px;
  text-decoration:none;
  overflow-wrap:anywhere
}
.sidebar-context-links {
  display:grid;
  gap:2px;
  margin-top:10px
}
.sidebar-context a.is-active {
  color:#a6eeea;
  background:#1b3639;
  font-weight:650
}
.sidebar-context a:hover {
  background:var(--surface-hover);
  color:#e9f3f4
}
.sidebar-context-sections {
  margin-top:8px
}
.sidebar-context-sections>summary {
  padding:10px 12px;
  cursor:pointer;
  font-size:13px;
  color:#c0cfd0
}
.sidebar-context-sections>summary span {
  color:#96aeb1;
  margin-left:6px
}
.sidebar-context-sections>a {
  margin-left:12px;
  border-left:1px solid #34464a;
  border-radius:0 8px 8px 0
}
.owner-account-menu-panel .account-logout {
  width:100%;
  padding:12px;
  border:0;
  border-radius:8px;
  background:transparent;
  color:#d5dfe0;
  text-align:left;
  font:inherit;
  font-size:14px;
  cursor:pointer
}
.account-logout:hover {
  background:#ffffff08
}
.breadcrumbs {
  flex-wrap:wrap;
  gap:8px;
  line-height:1.5
}
.breadcrumbs strong {
  overflow-wrap:anywhere
}
.manage-page .page-heading {
  margin-bottom:20px
}
.manage-page .page-heading h1 {
  font-size:clamp(1.7rem,3vw,2.3rem)
}
.manage-page .page-lead {
  font-size:14px;
  line-height:1.6
}
.manage-page input:not([type=checkbox]):not([type=hidden]),.manage-page select,.manage-page textarea {
  min-height:var(--control-height);
  font-size:14px
}
.manage-page textarea {
  resize:vertical
}
.field-help {
  font-size:13px;
  color:#a5b8bd;
  line-height:1.6
}
.field-help:empty {
  display:none
}
.list-filters {
  display:flex;
  align-items:flex-end;
  flex-wrap:wrap;
  gap:12px;
  margin:20px 0
}
.list-filters>label {
  display:grid;
  gap:6px;
  flex:1 1 150px;
  font-size:13px;
  color:#bfcdcf
}
.list-filters>label:first-child {
  flex:2 1 230px
}
.list-filters>p {
  flex-basis:100%;
  margin:0;
  color:#a4babe;
  font-size:13px
}
.list-filters input,.list-filters select,.member-unified-form select {
  width:100%;
  min-height:44px;
  padding:10px 12px;
  border:1px solid var(--control-line);
  border-radius:9px;
  background:#11191c;
  color:#e4eeee;
  font:inherit;
  font-size:14px
}
.list-filters input:focus-visible,.list-filters select:focus-visible,.member-unified-form select:focus-visible {
  outline:2px solid #7be7db;
  outline-offset:2px
}
.member-section-picker input[type=checkbox] {
  width:18px;
  height:18px;
  accent-color:#24c6c8
}
.manage-page form label:not(.setting-checkbox) {
  line-height:1.5
}
.manage-page .button:not(.section-name-save):not(.section-name-cancel):not(.response-save-button) {
  min-height:44px;
  font-size:13px
}
.compact-member {
  padding:0;
  margin:8px 0;
  border-radius:10px
}
.member-summary {
  display:flex;
  align-items:center;
  gap:12px;
  padding:14px 16px;
  cursor:pointer;
  list-style:none
}
.member-summary::-webkit-details-marker {
  display:none
}
.member-summary-name {
  display:grid;
  gap:4px;
  flex:1 1 170px;
  min-width:0
}
.member-summary-name strong {
  font-size:14px;
  overflow-wrap:anywhere
}
.member-summary-name small {
  font-size:12px;
  color:#a6b8bd
}
.member-summary-sections {
  flex:1 1 160px;
  max-width:30ch;
  color:#a8bdc2;
  font-size:12px;
  overflow-wrap:anywhere
}
.member-summary .member-status {
  font-size:11px;
  white-space:nowrap
}
.member-editor {
  padding:4px 16px 16px;
  border-top:1px solid var(--line)
}
.member-unified-form {
  display:grid;
  gap:16px
}
.member-unified-form>.button {
  justify-self:start
}
.member-unified-form label {
  display:grid;
  gap:6px;
  font-size:13px
}
.member-unified-form .setting-checkbox,.member-section-picker label {
  display:flex;
  align-items:center;
  gap:8px
}
.member-section-picker {
  display:flex;
  gap:10px 20px;
  flex-wrap:wrap;
  min-width:0;
  border:1px solid var(--line);
  border-radius:8px;
  padding:12px
}
.member-section-picker legend {
  padding:0 6px;
  font-size:13px
}
.member-danger-actions {
  margin-top:20px;
  border-top:1px solid var(--line);
  padding-top:12px
}
.member-danger-actions>summary {
  cursor:pointer;
  color:#a5b8bd;
  font-size:13px
}
.member-danger-actions form {
  margin-top:12px
}
.section-roster-item>.section-schedules {
  grid-column:1/-1;
  margin-top:8px;
  border-top:1px solid var(--line);
  padding-top:12px
}
.section-roster-item>.section-open-link {
  grid-column:3;
  grid-row:1
}
.section-roster-item.is-editing-section-name>.section-schedules {
  display:none
}
.section-schedules>summary {
  font-size:14px;
  cursor:pointer;
  color:#8ee2dd
}
.schedule-create-form {
  display:grid;
  gap:14px;
  margin-top:20px
}
.schedule-create-form>.button {
  justify-self:start
}
.calendar-legend {
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  font-size:12px;
  color:#c3d3d5
}
.calendar-legend span:before {
  content:'';
  display:inline-block;
  width:10px;
  height:10px;
  margin-right:6px;
  border:1px solid #238d8c;
  border-radius:3px;
  background:#154346
}
.calendar-legend .legend-existing:before {
  background:#343f44;
  border-color:#65767d
}
.calendar-legend .legend-overlap:before {
  background:#154346;
  border-color:#a6b6bd;
  box-shadow:inset 0 0 0 2px #526269
}
.season-day.is-training-day.is-existing-session {
  box-shadow:inset 0 0 0 2px #8b9da2
}
.schedule-create-dialog {
  width:min(1050px,calc(100vw - 32px))
}
.schedule-dialog-heading {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px
}
.schedule-dialog-heading h2 {
  margin:0;
  font-size:20px
}
.schedule-create-form>label {
  display:grid;
  gap:6px;
  font-size:13px
}
.schedule-create-form>label small {
  color:#9eb4b9
}
.section-options {
  grid-column:2;
  grid-row:1
}
.section-options>summary {
  font-size:13px;
  cursor:pointer;
  color:#a8bfc2;
  padding:8px
}
.section-options[open] {
  grid-column:1/-1;
  grid-row:2;
  padding:12px;
  border:1px solid var(--line);
  border-radius:10px
}
.section-danger-action {
  margin-top:16px;
  padding-top:12px;
  border-top:1px solid var(--line)
}
.section-roster-item.is-editing-section-name>.section-options {
  display:none
}
.training-page>.page-heading {
  margin-bottom:16px
}
.training-secondary-actions {
  margin:8px 0;
  border-bottom:1px solid var(--line);
  padding:8px 0
}
.training-secondary-actions>summary {
  width:fit-content;
  cursor:pointer;
  padding:6px 0;
  font-size:13px;
  color:#a5babe
}
.training-secondary-actions .guest-invite-tools,.training-secondary-actions .month-response-form {
  margin:12px 0
}
.training-ended {
  display:block;
  color:#a7b7bb;
  font-size:11px
}
.response-stage-button.is-dirty {
  background:#22c6c814;
  box-shadow:inset 0 0 0 1px #37d2c466
}
.response-row-actions [data-row-status] {
  font-size:12px;
  line-height:1.4;
  max-width:26ch
}
.response-row-actions[hidden]:has([data-row-status]:not(:empty)) {
  display:flex
}
.response-row-actions[hidden]>button {
  display:none
}
.attendance-editor .list-filters {
  margin-bottom:12px
}
.attendance-editor-summary {
  display:flex;
  flex-wrap:wrap;
  gap:16px;
  color:#a9d9d5;
  font-size:13px;
  margin:16px 0
}
.attendance-editor-actions {
  position:sticky;
  bottom:12px;
  z-index:4;
  padding:12px;
  border:1px solid var(--line);
  border-radius:12px;
  background:#182125;
  box-shadow:0 6px 20px #0004
}
.actual-attendance-list {
  padding-bottom:12px
}
.attendance-group-title {
  padding:14px 0 0;
  color:#bdced0;
  font-size:14px
}
.attendance-editor button,.attendance-editor input,.attendance-editor textarea {
  scroll-margin-block:90px
}
.manage-page .button:focus-visible,.manage-page summary:focus-visible,.sidebar a:focus-visible,.sidebar summary:focus-visible {
  outline:2px solid #7be7db;
  outline-offset:3px
}
.manage-page .button:disabled {
  opacity:.45;
  cursor:not-allowed
}
.tournament-page .score-actions {
  gap:12px;
  flex-direction:row;
  flex-wrap:wrap;
  justify-content:center
}
.tournament-page .score-actions button {
  min-width:120px;
  min-height:56px;
  padding:14px 18px;
  font-size:16px;
  font-weight:700;
  border-radius:10px
}
.tournament-page .set-score>div strong {
  font-size:clamp(40px,6vw,68px)
}
.tournament-page .scoreboard {
  padding:24px 12px
}
.tournament-page .score-team strong {
  font-size:14px
}
.tournament-page .score-team small {
  font-size:12px
}
.tournament-page .match-heading-actions {
  flex-wrap:wrap
}
.match-final-actions {
  display:flex;
  justify-content:flex-end;
  margin-top:24px;
  padding-top:16px;
  border-top:1px solid var(--line)
}
.undo-point-form {
  margin:12px 0
}
.tournament-page .log-row {
  display:grid;
  grid-template-columns:48px 48px 10px minmax(70px,.7fr) minmax(0,1.5fr);
  gap:10px;
  align-items:start;
  font-size:13px;
  line-height:1.5
}
.tournament-page .log-row>* {
  min-width:0;
  overflow-wrap:anywhere
}
.tournament-page .log-row>span:last-child {
  grid-column:auto
}
.report-match-result {
  display:grid;
  gap:8px;
  padding:24px 0;
  border-bottom:1px solid var(--line)
}
.report-match-result>strong {
  font-size:40px;
  color:#dff4f1
}
.report-match-result>small {
  color:#a1b7bc
}
.report-table-scroll {
  max-width:100%;
  overflow:auto;
  margin:24px 0
}
.report-table {
  width:100%;
  border-collapse:collapse;
  font-size:14px;
  text-align:left
}
.report-table caption {
  text-align:left;
  margin-bottom:12px;
  font-weight:700;
  font-size:16px
}
.report-table th,.report-table td {
  padding:12px;
  border-bottom:1px solid var(--line);
  line-height:1.5;
  vertical-align:top
}
.report-table th {
  color:#b7cbcd
}
.report-table td {
  overflow-wrap:anywhere
}
@media(max-width:600px) {
  .tournament-page .scoreboard {
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    gap:12px
  }
  .tournament-page .score-main {
    flex:0 0 100%;
    order:3
  }
  .tournament-page .score-team {
    flex:1;
    min-width:0
  }
  .tournament-page .log-row {
    grid-template-columns:40px 40px 8px minmax(0,1fr);
    gap:6px
  }
  .tournament-page .log-row>span:last-child {
    grid-column:4
  }
  .report-table {
    font-size:12px
  }
  .report-table th,.report-table td {
    padding:8px
  }
}
@media print {
  .sidebar,.topbar,.app-footer,.skip-to-content,.mobile-nav-backdrop,.tournament-page>:not(.report-panel),.report-panel button {
    display:none!important
  }
  .app-frame,.main-column,body {
    min-height:0!important;
    display:block!important
  }
  .main-column {
    margin:0!important
  }
  #main-content {
    padding:0!important
  }
  .tournament-page,.report-panel {
    max-width:none!important;
    padding:0!important;
    margin:0!important;
    border:0!important
  }
  .report-panel,.report-panel * {
    color:#111!important;
    background:transparent!important;
    box-shadow:none!important
  }
  .report-table-scroll {
    overflow:visible
  }
  .report-table thead {
    display:table-header-group
  }
  .report-table tr {
    break-inside:avoid
  }
  .report-table th,.report-table td {
    border-color:#aaa
  }
  .report-table {
    font-size:11px
  }
  body {
    background:#fff!important
  }
}
@media(min-width:1101px) {
  :root {
    --sidebar:268px
  }
  .schedule-create-form {
    grid-template-columns:minmax(0,1fr) minmax(300px,.9fr);
    align-items:start
  }
  .schedule-create-form>.season-exceptions {
    grid-column:2;
    grid-row:1 / span 8;
    margin:0
  }
  .schedule-create-form>:not(.season-exceptions) {
    grid-column:1
  }
  .schedule-create-form>.form-row {
    display:flex;
    flex-wrap:wrap
  }
  .schedule-create-form label {
    min-width:0
  }
  .schedule-create-form input,.schedule-create-form select {
    width:100%
  }
}
@media(max-width:760px) {
  .member-summary {
    flex-wrap:wrap
  }
  .member-summary-sections {
    flex:1 1 100%;
    order:5;
    margin-left:48px;
    max-width:none
  }
  .member-summary .member-status {
    margin-left:auto
  }
  .member-summary-name {
    flex:1 1 130px
  }
  .training-toolbar {
    gap:12px
  }
  .board-scroll {
    max-width:100%;
    overflow:auto
  }
  .sidebar-context {
    margin-top:8px
  }
  .attendance-editor-actions {
    bottom:4px
  }
}
@media(max-width:640px) {
  .section-roster-item>.section-open-link {
    grid-column:2
  }
  .section-options {
    grid-column:1/-1;
    grid-row:2
  }
  .section-options[open] {
    grid-row:2
  }
  .manage-card .section-roster-title>.section-name-edit-form input[name="name"] {
    min-width:70px;
    max-width:none;
    width:100%;
    flex:1
  }
  .manage-card .section-roster-title>.section-name-edit-form {
    width:100%
  }
}
@media(prefers-reduced-motion:reduce) {
  *,*::before,*::after {
    scroll-behavior:auto!important;
    transition:none!important;
    animation:none!important
  }
}
.month-response-disclosure {
  margin:10px 0 16px;
  border:1px solid var(--line);
  border-radius:12px;
  background:#151a1e
}
.month-response-disclosure>summary {
  display:flex;
  align-items:center;
  gap:10px;
  width:100%;
  padding:11px 15px;
  cursor:pointer;
  color:#bed3d5;
  font-size:.85rem;
  font-weight:650
}
.month-response-disclosure>summary>span {
  color:#8ba1a6;
  font-size:.75rem;
  font-weight:400;
  margin-left:auto
}
.month-response-disclosure .month-response-form {
  margin:0;
  padding:4px 15px 15px;
  border:0;
  background:transparent
}
.participant-tools {
  display:flex;
  gap:6px
}
.participant-tool {
  position:relative;
  display:grid;
  place-items:center;
  width:32px;
  height:32px;
  padding:6px;
  border:1px solid #354348;
  border-radius:9px;
  background:#202a2e;
  color:#b4c6cb;
  cursor:pointer
}
.participant-tool svg {
  width:18px;
  height:18px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.6;
  stroke-linecap:round;
  stroke-linejoin:round
}
.participant-tool:hover,.participant-tool.is-active {
  background:#173b3c;
  color:#6be1d7;
  border-color:#33716e
}
.participant-tool [data-filter-badge] {
  position:absolute;
  right:-5px;
  top:-6px;
  min-width:15px;
  padding:1px 3px;
  border-radius:8px;
  background:#68e0d4;
  color:#102223;
  font-size:10px
}
.participant-tool:focus-visible,.participant-popover :focus-visible,.participant-filter-summary button:focus-visible {
  outline:2px solid #68e0d4;
  outline-offset:3px
}
.participant-popover {
  position:fixed;
  inset:auto;
  margin:0;
  width:min(320px,calc(100vw - 24px));
  max-height:calc(100dvh - 24px);
  overflow:auto;
  padding:18px;
  border:1px solid #3a5055;
  border-radius:14px;
  background:#192226;
  color:#d6e3e5;
  box-shadow:0 18px 60px #0009;
  font-weight:400
}
.participant-popover h3 {
  margin:0 30px 14px 0;
  font-size:1rem
}
.participant-popover-close {
  position:absolute;
  top:10px;
  right:10px;
  display:grid;
  place-items:center;
  width:30px;
  height:30px;
  padding:0;
  border:0;
  border-radius:8px;
  background:transparent;
  color:#a9bdc2;
  font-size:22px;
  cursor:pointer
}
.participant-popover-close:hover {
  background:#ffffff0d;
  color:#e4eeee
}
.participant-popover label {
  display:grid;
  gap:5px;
  margin:0 0 12px;
  font-size:.78rem;
  color:#a9bdc2
}
.participant-popover select,.participant-popover input {
  width:100%;
  min-width:0;
  min-height:38px;
  padding:7px 10px;
  border:1px solid #3a4b51;
  border-radius:8px;
  background:#11191d;
  color:#e4eeee;
  font:inherit;
  color-scheme:dark
}
.participant-popover .field-help {
  margin:8px 0 0;
  font-size:.75rem
}
.participant-reset {
  padding:6px 0;
  border:0;
  background:transparent;
  color:#6bddd2;
  font-size:.8rem;
  cursor:pointer;
  text-decoration:underline;
  text-underline-offset:3px
}
.participant-filter-summary {
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:10px;
  padding:10px 16px;
  border-bottom:1px solid var(--line);
  font-size:.78rem;
  color:#a9bec2
}
.participant-filter-summary [data-participant-chips] {
  display:flex;
  flex-wrap:wrap;
  gap:6px
}
.participant-filter-summary button {
  padding:4px 9px;
  border:1px solid #34615e;
  border-radius:20px;
  background:#173331;
  color:#a3e9df;
  font:inherit;
  cursor:pointer
}
[data-participant-empty] td {
  padding:28px!important;
  text-align:center;
  color:#a9bec2
}
.participant-filter-summary[hidden],[data-filter-badge][hidden],[data-participant-row][hidden],[data-participant-empty][hidden] {
  display:none!important
}
.attendance-board .participant-cell.has-response-actions {
  padding-right:84px;
  min-width:220px
}
.attendance-board .participant-cell.has-response-actions>.response-row-actions {
  position:absolute;
  top:50%;
  right:10px;
  transform:translateY(-50%);
  display:flex;
  flex-wrap:nowrap;
  align-items:center;
  gap:5px;
  width:auto;
  margin:0;
  padding:0;
  border:0
}
.attendance-board .participant-cell.has-response-actions>.response-row-actions[hidden]:not(:has([data-row-status]:not(:empty))) {
  display:none
}
.attendance-board .has-response-actions .response-row-actions>button {
  display:grid;
  place-items:center;
  flex:0 0 28px;
  width:28px;
  min-width:28px;
  height:28px;
  min-height:28px;
  padding:4px;
  border-radius:7px;
  font-size:17px;
  line-height:1
}
.attendance-board .has-response-actions .response-row-actions[hidden]>button {
  display:none
}
.attendance-board .has-response-actions .response-save-button svg {
  display:block;
  width:17px;
  height:17px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.6;
  stroke-linecap:round;
  stroke-linejoin:round
}
.attendance-board .has-response-actions .response-row-actions>button:focus-visible {
  outline:2px solid #68e0d4;
  outline-offset:2px
}
.attendance-board .has-response-actions .response-row-actions [data-row-status] {
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip-path:inset(50%);
  white-space:nowrap;
  border:0
}
.profile-signin-card {
  display:flex;
  align-items:center;
  gap:16px;
  box-sizing:border-box;
  max-width:780px;
  margin-top:18px;
  padding:24px 26px;
  color:inherit;
  text-decoration:none;
  transition:border-color .16s ease,background .16s ease
}
.profile-signin-card:hover {
  border-color:#45857e;
  background:#1b292b
}
.profile-signin-card:focus-visible,.signin-methods-page a:focus-visible,.signin-google-action:focus-visible {
  outline:2px solid #75e1d6;
  outline-offset:4px
}
.profile-signin-card .profile-signin-copy {
  min-width:0;
  flex:1
}
.profile-signin-card h2 {
  margin:0;
  color:#f0f5f5;
  font-size:1.05rem
}
.profile-signin-copy>span {
  display:block;
  margin-top:6px;
  font-size:13px;
  line-height:1.6;
  color:#a4b7bc
}
.profile-signin-destination {
  display:flex;
  align-items:center;
  gap:16px;
  flex-shrink:0
}
.profile-signin-destination img {
  box-sizing:content-box;
  padding:8px;
  border:1px solid #d9dfe0;
  border-radius:10px;
  background:#fff
}
.profile-signin-destination svg,.signin-back-link svg {
  width:18px;
  height:18px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.7;
  stroke-linecap:round;
  stroke-linejoin:round;
  color:#a4b7bc
}
.profile-signin-card .profile-section-icon svg,.signin-provider-icon svg,.signin-continuity-note svg,.signin-connected-note svg {
  width:22px;
  height:22px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.7;
  stroke-linecap:round;
  stroke-linejoin:round;
  flex-shrink:0
}
.signin-methods-page {
  max-width:900px
}
.signin-back-link {
  display:inline-flex;
  align-items:center;
  gap:6px;
  margin-bottom:24px;
  color:#a9bfc2;
  font-size:13px;
  text-decoration:none
}
.signin-back-link:hover {
  color:#7ee2d8
}
.signin-methods-page .page-lead {
  max-width:65ch;
  line-height:1.7
}
.signin-method-card {
  padding:24px;
  margin-bottom:18px;
  overflow:visible
}
.signin-method-heading {
  display:flex;
  align-items:center;
  gap:14px;
  flex-wrap:wrap
}
.signin-provider-icon {
  display:grid;
  place-items:center;
  box-sizing:border-box;
  width:46px;
  height:46px;
  flex:0 0 46px;
  border-radius:13px
}
.signin-password-icon {
  border:1px solid #315450;
  background:#1a302f;
  color:#75e1d6
}
.signin-google-icon {
  border:1px solid #e0e3e5;
  background:#fff
}
.signin-google-icon img,.signin-google-action img {
  display:block;
  object-fit:contain;
  flex-shrink:0
}
.signin-method-copy {
  flex:1;
  min-width:160px
}
.signin-method-copy h2 {
  margin:0;
  color:#f0f5f5;
  font-size:17px;
  line-height:1.4
}
.signin-method-copy p {
  margin:5px 0 0;
  color:#a4b7bc;
  font-size:13px;
  line-height:1.6;
  overflow-wrap:anywhere
}
.signin-status {
  display:inline-flex;
  align-items:center;
  gap:7px;
  min-height:28px;
  box-sizing:border-box;
  padding:4px 10px;
  border:1px solid #435157;
  border-radius:20px;
  background:#ffffff03;
  color:#b6c3c7;
  font-size:12px;
  font-weight:600;
  white-space:nowrap
}
.signin-status.is-connected {
  border-color:#316b59;
  background:#183d302e;
  color:#7be2b6
}
.signin-status.is-connected:before {
  content:'';
  width:6px;
  height:6px;
  border-radius:50%;
  background:currentColor
}
.signin-method-note,.signin-state-note {
  margin:20px 0 0;
  padding-top:18px;
  border-top:1px solid var(--control-line);
  font-size:13px;
  line-height:1.7;
  color:#aebfc3
}
.signin-method-note p {
  margin:0 0 10px
}
.signin-method-note a,.signin-link-actions>a {
  color:#8ae4da;
  text-underline-offset:4px
}
.signin-connected-note {
  display:flex;
  align-items:center;
  gap:10px;
  margin-top:20px;
  padding:14px 16px;
  border:1px solid #2b574b;
  border-radius:10px;
  background:#14332a40;
  color:#a6ddc4
}
.signin-connected-note svg {
  color:#74dbaa
}
.signin-connected-note p {
  margin:0;
  font-size:13px;
  line-height:1.7
}
.signin-link-content {
  margin-top:24px;
  padding-top:22px;
  border-top:1px solid var(--control-line)
}
.signin-link-steps {
  display:flex;
  flex-wrap:wrap;
  gap:12px 28px;
  margin:0 0 26px;
  padding:0;
  list-style:none
}
.signin-link-steps li {
  display:flex;
  align-items:center;
  gap:9px;
  color:#a1b3b8;
  font-size:12px;
  line-height:1.5
}
.signin-link-steps li>span {
  display:grid;
  place-items:center;
  width:26px;
  height:26px;
  flex:0 0 26px;
  border:1px solid #435157;
  border-radius:50%;
  font-size:12px;
  font-weight:700
}
.signin-link-steps li[aria-current=step] {
  color:#c7ece7
}
.signin-link-steps li[aria-current=step]>span {
  border-color:#36877d;
  background:#203c39;
  color:#8ce6db
}
.signin-link-intro h3 {
  margin:0;
  font-size:17px;
  color:#f0f5f5;
  line-height:1.5
}
.signin-link-intro p {
  margin:7px 0 20px;
  max-width:62ch;
  color:#a4b7bc;
  font-size:13px;
  line-height:1.7
}
.signin-link-form {
  display:grid;
  gap:18px;
  max-width:520px
}
.signin-link-field {
  display:grid;
  gap:8px;
  min-width:0
}
.signin-link-field label {
  font-size:13px;
  font-weight:600;
  color:#d3e0e3
}
.signin-link-field input {
  box-sizing:border-box;
  width:100%;
  min-height:48px;
  padding:12px 14px;
  border:1px solid #405257;
  border-radius:10px;
  background:#11191c;
  color:#eff6f5;
  font:inherit;
  font-size:14px
}
.signin-link-field input:focus-visible {
  outline:2px solid #75e1d6;
  outline-offset:2px
}
.signin-field-help {
  color:#9bafb5;
  font-size:12px;
  line-height:1.6
}
.signin-link-actions {
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:16px;
  margin-top:2px
}
.signin-link-actions>a {
  font-size:12px;
  line-height:1.7
}
.signin-google-action {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  box-sizing:border-box;
  min-height:46px;
  padding:12px 18px;
  border:1px solid #747775;
  border-radius:10px;
  background:#fff;
  color:#1f1f1f;
  font:500 14px/20px Arial,sans-serif;
  cursor:pointer
}
.signin-google-action:hover {
  background:#f2f5fa;
  border-color:#a7aeb8
}
.signin-continuity-note {
  display:flex;
  align-items:flex-start;
  gap:9px;
  margin:24px 0 0;
  padding-top:18px;
  border-top:1px solid var(--control-line);
  color:#9bafb5;
  font-size:12px;
  line-height:1.7
}
.signin-continuity-note svg {
  width:18px;
  height:18px;
  color:#6ab9af
}
.signin-error {
  padding:14px 16px;
  border:1px solid #77484a;
  border-radius:10px;
  background:#48222640;
  line-height:1.6
}
@media(max-width:600px) {
  .profile-signin-card {
    padding:19px;
    gap:12px
  }
  .profile-signin-destination {
    gap:8px
  }
  .profile-signin-destination img {
    display:none
  }
  .signin-method-card {
    padding:19px
  }
  .signin-method-heading {
    gap:12px
  }
  .signin-method-heading>.signin-status {
    margin-left:58px
  }
  .signin-method-copy {
    min-width:calc(100% - 60px)
  }
  .signin-link-actions {
    align-items:stretch;
    flex-direction:column
  }
  .signin-google-action {
    width:100%
  }
  .signin-link-actions>a {
    align-self:center
  }
  .signin-link-steps {
    gap:12px
  }
  .signin-continuity-note {
    margin-top:20px
  }
}
@media(prefers-reduced-motion:reduce) {
  .profile-signin-card {
    transition:none
  }
}
.profile-contact-phone-field {
  display:grid;
  gap:7px;
  max-width:380px;
  margin:18px 0
}
.profile-contact-phone-field label {
  color:#d3e0e3;
  font-size:13px;
  font-weight:600
}
.profile-contact-phone-field input {
  box-sizing:border-box;
  width:100%;
  min-height:46px;
  padding:11px 13px;
  border:1px solid var(--control-line);
  border-radius:10px;
  background:#11191c;
  color:#edf2f2;
  font:inherit;
  font-size:14px
}
.profile-contact-phone-field input:focus-visible {
  outline:2px solid #75e1d6;
  outline-offset:2px
}
.profile-contact-phone-field .field-help {
  margin:0;
  font-size:12px;
  line-height:1.6;
  color:#9aafb5
}
.member-contact-details {
  display:flex;
  flex-wrap:wrap;
  gap:12px 32px;
  margin:14px 0
}
.member-contact-details>div {
  display:grid;
  gap:4px;
  min-width:0
}
.member-contact-details dt {
  font-size:11px;
  color:#9aafb5
}
.member-contact-details dd {
  margin:0;
  font-size:13px;
  color:#d3e0e3;
  overflow-wrap:anywhere
}
.member-contact-details a {
  color:#9ce4dc;
  text-underline-offset:3px
}
/* Settings navigation follows the administration workspace navigation. */
.profile-settings-layout {
  --profile-nav-top: 95px;
  display: grid;
  grid-template-columns: 205px minmax(0, 780px);
  gap: 28px;
  align-items: start;
}
.profile-settings-content { min-width: 0; }
.profile-settings-aside {
  position: sticky;
  top: var(--profile-nav-top);
  max-height: calc(100dvh - var(--profile-nav-top) - 20px);
  overflow-y: auto;
  scrollbar-width: thin;
}
.profile-guide-description {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}
.profile-settings-page [data-profile-section] { scroll-margin-top: calc(var(--profile-nav-top, 95px) + 15px); }
.profile-settings-page [data-profile-section]:target {
  outline: 2px solid #427e75;
  outline-offset: 8px;
  border-radius: 10px;
}
.profile-settings-page .profile-display-name-field > h2 {
  margin: 0 0 18px;
  color: #f0f5f5;
  font-size: 1.05rem;
}
@media (max-width: 1100px) {
  .profile-settings-layout { grid-template-columns: 185px minmax(0, 780px); gap: 18px; }
}
@media (max-width: 800px) {
  .profile-settings-layout { grid-template-columns: minmax(0, 1fr); gap: 18px; }
  .profile-settings-aside { position: static; max-height: none; overflow: visible; }
  .profile-settings-guide ul {
    display: flex;
    gap: 7px;
    overflow-x: auto;
    scrollbar-width: thin;
    padding: 2px 2px 6px;
  }
  .profile-settings-guide li { flex: 0 0 auto; }
  .profile-settings-guide a { padding: 10px 12px; white-space: nowrap; }
}
.member-display-alias {
  font-weight:400;
  color:#b0c3c7
}
[data-member-editor] {
  scroll-margin-top:110px
}
[data-member-editor]:target {
  outline:2px solid #427e75;
  outline-offset:5px;
  border-radius:10px
}
.participant-member-link {
  color:inherit;
  text-decoration:underline;
  text-decoration-color:#6daaa666;
  text-underline-offset:4px
}
.participant-member-link:hover {
  color:#8ce5db;
  text-decoration-color:currentColor
}
.participant-member-link:focus-visible {
  outline:2px solid #75e1d6;
  outline-offset:4px;
  border-radius:3px
}
.profile-newsletter-card {
  max-width:780px;
  padding:26px;
  margin-top:18px
}
.profile-newsletter-card .profile-section-icon svg {
  width:22px;
  height:22px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.7;
  stroke-linecap:round;
  stroke-linejoin:round
}
.profile-card .newsletter-settings-form {
  gap:16px;
  margin-top:20px
}
.newsletter-email-settings {
  display:grid;
  gap:16px;
  padding:16px 18px;
  border:1px solid var(--control-line);
  border-radius:12px;
  background:#ffffff02
}
.newsletter-email-settings>.setting-checkbox {
  display:flex;
  align-items:center;
  gap:10px;
  font-size:13px;
  color:#d2e0e3;
  cursor:pointer
}
.newsletter-email-settings .setting-checkbox input {
  width:18px;
  height:18px;
  margin:0;
  accent-color:#24c6c8
}
.newsletter-account-email {
  display:grid;
  gap:5px;
  font-size:12px;
  color:#9db2b8
}
.newsletter-account-email strong {
  font-size:14px;
  font-weight:500;
  color:#e2eeee;
  overflow-wrap:anywhere
}
.newsletter-email-field {
  display:grid;
  gap:8px
}
.newsletter-email-field label {
  font-size:13px;
  font-weight:600;
  color:#d3e0e3
}
.newsletter-email-field input {
  box-sizing:border-box;
  width:100%;
  min-height:46px;
  padding:11px 13px;
  border:1px solid var(--control-line);
  border-radius:10px;
  background:#11191c;
  color:#edf2f2;
  font:inherit;
  font-size:14px
}
.newsletter-email-field input:focus-visible {
  outline:2px solid #75e1d6;
  outline-offset:2px
}
.newsletter-email-field p,.newsletter-settings-footer p {
  margin:0;
  color:#9db2b8;
  font-size:12px;
  line-height:1.6
}
.newsletter-settings-footer {
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:12px 18px
}
.newsletter-email-settings[hidden],.newsletter-account-email[hidden],.newsletter-email-field[hidden] {
  display:none!important
}
@media(max-width:600px) {
  .profile-newsletter-card {
    padding:19px
  }
  .newsletter-email-settings {
    padding:14px
  }
  .newsletter-settings-footer {
    align-items:flex-start;
    flex-direction:column
  }
}
/* Credential forms share the account settings surfaces and spacing. */
.credential-card {
  box-sizing:border-box;
  width:100%;
  max-width:584px;
  padding:30px
}
.credential-card h1 {
  font-size:clamp(24px,4vw,32px);
  line-height:1.25;
  margin:0 0 16px
}
.credential-card .credential-form {
  display:grid;
  gap:24px;
  max-width:520px
}
.credential-form .credential-field {
  display:grid;
  gap:9px;
  min-width:0
}
.credential-field label {
  margin:0;
  font-size:14px;
  font-weight:600;
  color:#d3e0e3
}
.credential-input {
  position:relative;
  display:flex;
  align-items:center
}
.credential-form input:not([type=hidden]):not(.credential-username) {
  box-sizing:border-box;
  width:100%;
  min-height:50px;
  padding:12px 14px;
  border:1px solid var(--control-line);
  border-radius:11px;
  background:#11191c;
  color:#edf2f2;
  font:inherit
}
.credential-input input {
  padding-right:90px!important
}
.credential-input button {
  position:absolute;
  right:5px;
  min-width:74px;
  min-height:44px;
  padding:8px;
  border:0;
  border-radius:8px;
  background:transparent;
  color:#8bddd6;
  font:inherit;
  font-size:12px;
  cursor:pointer
}
.credential-form input:focus-visible,.credential-form button:focus-visible {
  outline:2px solid #75e1d6;
  outline-offset:2px
}
.credential-field p,.credential-security-note {
  margin:0;
  font-size:13px;
  line-height:1.65;
  color:#9db2b8
}
.credential-field a {
  font-size:13px;
  justify-self:start
}
.credential-security-note {
  border-top:1px solid var(--control-line);
  padding-top:18px
}
.credential-actions {
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:16px 24px
}
.credential-form .validation-summary-valid {
  display:none
}
.credential-form .error-banner {
  margin:0
}
.credential-username {
  position:absolute;
  width:1px!important;
  height:1px!important;
  clip-path:inset(50%);
  overflow:hidden
}
.credential-return {
  display:inline-flex;
  margin-top:24px;
  min-height:44px;
  align-items:center
}
.credential-form button:disabled {
  opacity:.65;
  cursor:wait
}
@media(max-width:600px) {
  .credential-card {
    padding:22px 18px
  }
  .credential-form {
    gap:22px
  }
  .credential-actions {
    align-items:flex-start
  }
}
/* Optional authenticator settings. */
.mfa-page {
  max-width:900px
}
.mfa-repair-page {
  box-sizing:border-box;
  margin:6vh auto;
  padding:0 20px
}
.mfa-method-card {
  margin-top:22px
}
.mfa-status-line {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  margin-bottom:16px
}
.mfa-status-line h2 {
  margin:0;
  font-size:19px
}
.mfa-settings-card>.muted-note {
  margin:0 0 24px
}
.mfa-recovery-count {
  margin:0 0 22px;
  color:#9db2b8;
  font-size:13px
}
.mfa-checkbox {
  display:flex!important;
  align-items:center;
  gap:10px;
  font-size:13px!important;
  line-height:1.5;
  cursor:pointer
}
.credential-form .mfa-checkbox input[type=checkbox] {
  flex:0 0 18px;
  width:18px;
  min-height:18px;
  height:18px;
  padding:0;
  accent-color:#1cc1bd
}
.mfa-benefits {
  display:grid;
  gap:10px;
  margin:0;
  padding-left:18px;
  color:#a9bec2;
  font-size:13px;
  line-height:1.6
}
.mfa-danger {
  padding-top:20px;
  border-top:1px solid var(--control-line)
}
.mfa-danger summary {
  cursor:pointer;
  color:#f6a49d;
  font-size:13px;
  padding:8px 0
}
.mfa-danger p {
  font-size:13px;
  color:#b7c5c8;
  line-height:1.6
}
.mfa-danger .button {
  margin-top:16px
}
.mfa-setup-card,.mfa-codes-card {
  box-sizing:border-box;
  max-width:820px;
  padding:30px
}
.mfa-setup-card h2,.mfa-codes-card h2 {
  margin:20px 0 12px;
  font-size:22px
}
.mfa-steps {
  display:flex;
  flex-wrap:wrap;
  gap:12px 24px;
  list-style:none;
  padding:0;
  margin:0 0 28px;
  font-size:12px;
  color:#9db2b8
}
.mfa-steps li {
  display:flex;
  align-items:center;
  gap:8px
}
.mfa-steps li[aria-current] {
  color:#7ee4d9
}
.mfa-steps li>span {
  display:grid;
  place-items:center;
  width:26px;
  height:26px;
  border:1px solid #35524f;
  border-radius:50%;
  font-size:11px
}
.mfa-setup-grid {
  display:grid;
  grid-template-columns:240px minmax(0,1fr);
  gap:28px;
  align-items:center;
  margin:26px 0
}
.mfa-qr {
  padding:14px;
  background:#fff;
  border-radius:14px;
  line-height:0;
  max-width:240px;
  box-sizing:border-box
}
.mfa-qr svg {
  display:block;
  width:100%;
  height:auto
}
.mfa-manual-key {
  min-width:0
}
.mfa-manual-key h3 {
  font-size:15px;
  margin:0 0 10px
}
.mfa-manual-key p {
  font-size:13px;
  color:#9db2b8;
  line-height:1.6
}
.mfa-manual-key>code {
  display:block;
  border:1px solid #35524f;
  background:#111b1d;
  padding:12px;
  border-radius:9px;
  color:#c8f6ed;
  font-size:14px;
  letter-spacing:1px;
  overflow-wrap:anywhere;
  user-select:all
}
.mfa-account-label {
  overflow-wrap:anywhere
}
.mfa-cancel {
  margin-top:16px
}
.mfa-recovery-codes {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:9px;
  list-style:none;
  margin:24px 0;
  padding:0
}
.mfa-recovery-codes li {
  padding:12px 10px;
  border:1px solid var(--control-line);
  background:#111b1d;
  border-radius:9px;
  overflow-wrap:anywhere;
  font-size:12px;
  color:#d6eeea
}
.mfa-codes-card>p {
  font-size:14px;
  line-height:1.7;
  color:#a9bec2
}
.mfa-codes-card .credential-actions {
  margin-top:22px
}
@media(max-width:640px) {
  .mfa-setup-grid {
    grid-template-columns:1fr;
    gap:18px
  }
  .mfa-qr {
    justify-self:center;
    width:240px
  }
  .mfa-setup-card,.mfa-codes-card {
    padding:22px 18px
  }
  .mfa-recovery-codes {
    grid-template-columns:1fr
  }
  .mfa-steps {
    gap:8px 14px
  }
}
.site-notices {
  display:grid;
  gap:10px;
  margin:0 0 20px;
  grid-column:1/-1
}
.site-notices>section {
  padding:14px 18px;
  border:1px solid #346b6c;
  border-radius:12px;
  background:#173034;
  color:#cce9e7
}
.site-notices strong {
  font-size:14px
}
.site-notices p {
  margin:6px 0 0;
  font-size:13px;
  line-height:1.7;
  white-space:pre-wrap;
  overflow-wrap:anywhere
}

/* Destructive account action remains separate from preference forms. */
.profile-delete-card > .button { margin: 20px 0 0 53px; }
.profile-delete-card .profile-section-icon { color: #ffb4bc; border-color: #633c43; background: #302025; }
.profile-delete-card .profile-section-icon svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 1.6; }
.account-delete-dialog { max-width: 520px; }
.account-delete-dialog::backdrop { background: rgba(4,8,10,.85); backdrop-filter: none; -webkit-backdrop-filter: none; }
html:has(.account-delete-dialog[open]) { overflow: hidden; scrollbar-gutter: stable; }
.account-delete-dialog p { margin: 0; line-height: 1.65; }
.account-delete-dialog .setting-checkbox { display: flex; align-items: flex-start; gap: 10px; }
.account-delete-dialog .setting-checkbox input { flex: 0 0 auto; }
.account-delete-actions { display: flex; flex-wrap: wrap; gap: 12px; justify-content: flex-end; margin-top: 6px; }
@media (max-width: 540px) { .account-delete-actions > .button { flex: 1 1 100%; } }

@media (max-width: 600px) {
  .profile-delete-card > .button { width: 100%; margin-left: 0; }
}

/* Beach sections keep indoor profile positions stored while omitting them from registration UI. */
[data-beach-hidden][hidden] { display: none !important; }
.beach-training-overview {
  display: grid;
  gap: 18px;
  margin-top: 18px;
  padding: 20px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #151e20;
}
.beach-training-court { display: block; width: 100%; max-width: 640px; margin: 0 auto; }
.beach-court-sand { fill: #cbb88c; }
.beach-court-boundary { fill: #dfcda5; stroke: #276b70; stroke-width: 4; }
.beach-court-net { fill: none; stroke: #263e42; stroke-width: 5; stroke-dasharray: 7 5; }
.beach-court-counter { fill: #142f33; stroke: #49cbc5; stroke-width: 2; }
.beach-court-number { fill: #f0faf8; font: 800 48px system-ui, sans-serif; }
.beach-court-label { fill: #bbdfdc; font: 600 15px system-ui, sans-serif; }
.beach-training-overview > .muted-note { margin: 0; text-align: center; }
@media (min-width: 721px) {
  .guest-identity-fields:has(> [data-beach-hidden][hidden]) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px) { .beach-training-overview { padding: 14px; } }

/* Section lifecycle and coach-only occupancy warnings. */
.lifecycle-state { display: inline-flex; margin-left: 8px; padding: 3px 8px; border: 1px solid #44545a; border-radius: 8px; color: #b8c5c9; background: #263034; font-size: 12px; }
.minimum-participants-warning { display: block; margin: 10px 0; padding: 10px 12px; border: 1px solid #7e6937; border-radius: 9px; background: #302b1c; color: #f2d58c; font-size: 13px; line-height: 1.55; }
.minimum-participants-warning[hidden] { display: none !important; }
.minimum-participants-warning.is-compact { margin: 8px 0 0; padding: 5px 8px; font-size: 11px; font-weight: 600; }
.section-workspace .minimum-participants-form > label { color: #e1ebec; font-size: 14px; font-weight: 600; }
.section-workspace .minimum-participants-form > .field-help { margin-right: 0; }
.minimum-participants-form .form-row { display: flex; flex-wrap: wrap; align-items: end; gap: 10px; margin-top: 12px; }
.minimum-participants-form input { width: 100px; }
.section-archive-row > .button { margin-top: 12px; }
.schedule-copy-button { align-self: center; white-space: nowrap; }
.team-leave-row { display: flex; justify-content: flex-end; margin-top: 20px; padding-top: 16px; border-top: 1px solid var(--line); }
.team-leave-owner-help { margin-top: 18px; max-width: 80ch; font-size: 12px; }
.lifecycle-dialog::backdrop { background: rgba(4,8,10,.85); backdrop-filter: none; -webkit-backdrop-filter: none; }
html:has(.lifecycle-dialog[open]) { overflow: hidden; scrollbar-gutter: stable; }
body:has(.lifecycle-dialog[open]) :not(.lifecycle-dialog[open], .lifecycle-dialog[open] *) { animation-play-state: paused !important; transition: none !important; }
.lifecycle-dialog .setting-checkbox { display: flex; align-items: flex-start; gap: 10px; }
.lifecycle-dialog .setting-checkbox input { flex: 0 0 auto; }
@media(max-width:640px) { .schedule-copy-button { align-self: stretch; } }

/* External sign-in: one consistent layout, native server-side OAuth. */
.landing-auth-v2 .external-login-options { display: grid; gap: 10px; margin-top: 24px; }
.landing-auth-v2 .external-login-options .google-login-form,
.landing-auth-v2 .external-login-options .facebook-login-form { margin: 0; }
.facebook-login-button {
  appearance: none; display: flex; justify-content: center; align-items: center; gap: 10px;
  box-sizing: border-box; width: 100%; min-height: 48px; padding: 12px;
  border: 1px solid #0866ff; border-radius: 10px; background: #0866ff; color: #fff;
  font: 600 14px/20px Arial, sans-serif; cursor: pointer;
}
.facebook-login-button:hover,.signin-facebook-action:hover { background: #0758db; border-color: #0758db; color: #fff; }
.facebook-login-button:focus-visible,.signin-facebook-action:focus-visible { outline: 3px solid #68dfd5; outline-offset: 3px; }
.facebook-login-button img,.signin-facebook-icon img { display: block; flex: 0 0 auto; }
.signin-facebook-icon { background: #0866ff; border: 1px solid #0866ff; }
.signin-facebook-action { background: #0866ff; border-color: #0866ff; color: #fff; }
.profile-facebook-mark { display: inline-flex; align-items: center; justify-content: center; border-radius: 8px; width: 28px; height: 28px; background: #0866ff; }