/* Konto-, Login- und Partienübersichts-Stile. Das Modul bleibt unabhängig vom Tippspiel ladbar. */
    .auth-button {
      position: relative;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 0.45rem;
      min-width: 84px;
      min-height: 38px;
      border: 1px solid var(--accent);
      border-radius: 999px;
      background: var(--accent);
      color: #07080c;
      cursor: pointer;
      font-family: var(--font-body);
      font-size: var(--text-sm);
      font-weight: 700;
      padding: 0.45rem 0.9rem;
      white-space: nowrap;
    }
    .auth-button:hover { filter: brightness(1.08); }
    .auth-button.is-authenticated {
      width: 38px;
      min-width: 38px;
      padding: 0;
    }
    .auth-button.is-authenticated.secondary-button {
      border-color: var(--border);
      background: var(--surface);
      color: var(--text);
      filter: none;
    }
    .auth-button.is-authenticated.secondary-button:hover,
    .auth-button.is-authenticated.secondary-button:focus-visible {
      border-color: var(--accent);
      color: var(--accent);
      filter: none;
    }
    .auth-user-icon {
      width: 20px;
      height: 20px;
      fill: none;
      stroke: currentColor;
      stroke-linecap: round;
      stroke-linejoin: round;
      stroke-width: 1.8;
    }
    .auth-task-badge {
      position: absolute;
      top: -6px;
      right: -6px;
      display: grid;
      place-items: center;
      min-width: 19px;
      height: 19px;
      padding: 0 4px;
      border-radius: 999px;
      background: var(--accent);
      color: #07080c;
      box-shadow: 0 0 0 2px var(--bg);
      font-family: var(--font-mono);
      font-size: 0.66rem;
    }
    .auth-dialog {
      width: min(calc(100vw - 16px), 640px);
      max-width: none;
      max-height: min(calc(100vh - 64px), 900px);
      margin: auto;
      border: 1px solid var(--border);
      border-radius: 20px;
      background: var(--bg);
      color: var(--text);
      box-shadow: 0 34px 120px rgba(0,0,0,0.72);
      overflow: hidden;
      padding: 0;
    }
    .auth-dialog::backdrop { background: rgba(3,4,8,0.7); backdrop-filter: blur(2px); }
    .auth-dialog-card {
      box-sizing: border-box;
      max-height: inherit;
      overflow: auto;
      overscroll-behavior: contain;
      padding: 1.5rem;
    }
    .auth-dialog h2 { font-family: var(--font-heading); font-size: var(--text-heading); letter-spacing: 0.04em; margin: 0.25rem 0 1rem; }
    .auth-mode-toggle {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 4px;
      border-radius: 10px;
      margin-bottom: 1rem;
    }
    .auth-mode-toggle button {
      border: 0;
      border-radius: 7px;
      background: transparent;
      color: var(--dim);
      cursor: pointer;
      font-family: var(--font-body);
      font-size: var(--text-sm);
      font-weight: 500;
      padding: 0.55rem;
    }
    .auth-mode-toggle button.active { background: color-mix(in srgb, var(--accent) 10%, var(--surface)); color: var(--accent); }
    .auth-form { display: grid; gap: 12px; }
    .auth-form-actions { display: flex; justify-content: flex-end; gap: 8px; }
    .auth-form label[hidden] { display: none !important; }
    .auth-form label { display: grid; gap: 6px; color: var(--dim); font-size: var(--text-sm); font-weight: 600; }
    .auth-form input,
    .auth-form select {
      width: 100%;
      min-height: 44px;
      border: 1px solid var(--border);
      border-radius: 8px;
      background: var(--bg);
      color: var(--text);
      font-family: var(--font-body);
      font-size: var(--text-base);
      outline: none;
      padding: 0.65rem 0.75rem;
    }
    .auth-form select {
      appearance: none;
      background-image: linear-gradient(45deg, transparent 50%, var(--dim) 50%), linear-gradient(135deg, var(--dim) 50%, transparent 50%);
      background-position: calc(100% - 16px) 19px, calc(100% - 11px) 19px;
      background-repeat: no-repeat;
      background-size: 5px 5px, 5px 5px;
      padding-right: 2.25rem;
    }
    .auth-form input:focus,
    .auth-form select:focus { border-color: var(--accent); }
    .auth-form-link { justify-self: center; margin-top: 0; }
    #auth-guest-view .auth-form-link[hidden] {
      display: inline-flex !important;
      visibility: hidden;
    }
    .auth-dialog-copy { color: var(--dim); font-size: 0.88rem; line-height: 1.5; margin: -0.35rem 0 1rem; }
    .tipp-invitation-dialog { width: min(calc(100vw - 24px), 460px); }
    .tipp-invitation-card {
      display: flex;
      flex-direction: column;
      align-items: center;
      padding: 2.5rem 2rem 2rem;
      text-align: center;
    }
    .tipp-invitation-icon {
      display: grid;
      place-items: center;
      width: 64px;
      height: 64px;
      border: 1px solid color-mix(in srgb, var(--accent) 38%, var(--border));
      border-radius: 18px;
      background: color-mix(in srgb, var(--accent) 10%, var(--surface));
      color: var(--accent);
      margin-bottom: 1.15rem;
    }
    .tipp-invitation-icon svg {
      width: 32px;
      height: 32px;
      fill: none;
      stroke: currentColor;
      stroke-linecap: round;
      stroke-linejoin: round;
      stroke-width: 1.7;
    }
    .tipp-invitation-dialog h2 {
      margin: 0.3rem 0 0.85rem;
      font-size: clamp(2.3rem, 9vw, 3.25rem);
      line-height: 0.95;
    }
    .tipp-invitation-dialog .auth-dialog-copy {
      max-width: 34ch;
      font-size: var(--text-base);
    }
    .player-email-privacy { color: var(--dim); font-size: 0.75rem; line-height: 1.45; }
    .player-email-actions { display: flex; justify-content: flex-end; gap: 8px; flex-wrap: wrap; }
    .player-invite-output {
      display: grid;
      gap: 12px;
      border-top: 1px solid var(--border);
      margin-top: 1rem;
      padding-top: 1rem;
    }
    .player-invite-output[hidden] { display: none; }
    .player-invite-output label { display: grid; gap: 5px; color: var(--dim); font-size: 0.78rem; font-weight: 600; }
    .player-invite-output input,
    .player-invite-preview {
      width: 100%;
      border: 1px solid var(--border);
      border-radius: 8px;
      background: var(--bg);
      color: var(--text);
      font: inherit;
      font-size: var(--text-sm);
      line-height: 1.5;
      outline: none;
      padding: 0.65rem 0.75rem;
    }
    .player-invite-output input { min-height: 44px; }
    .player-invite-preview { min-height: 290px; font-weight: 400; }
    .player-invite-preview p { margin: 0 0 1rem; }
    .player-invite-preview p:last-child { margin-bottom: 0; }
    .player-invite-preview ul { margin: 0 0 1rem; padding-left: 1.2rem; }
    .player-invite-preview a { color: var(--accent); pointer-events: none; }
    .player-invite-output input:focus,
    .player-invite-preview:focus-within { border-color: var(--accent); }
    .player-invite-expiry { color: var(--dim); font-size: 0.75rem; line-height: 1.45; margin: 0; }
    .auth-message { min-height: 1.25rem; color: var(--dim); font-size: 0.82rem; margin-top: 0.8rem; }
    #auth-dialog #auth-message { min-height: 2.5rem; line-height: 1.5; }
    .auth-message.error { color: var(--negativ); }
    .auth-message.success { color: var(--positiv); }
    .account-auth-message {
      position: absolute;
      z-index: 30;
      left: 50%;
      bottom: max(16px, env(safe-area-inset-bottom));
      display: flex;
      align-items: center;
      gap: 12px;
      width: 100%;
      min-height: 44px;
      margin: 0;
      border: 1px solid var(--accent);
      border-radius: 12px;
      background: var(--surface);
      box-shadow: 0 14px 40px rgba(0,0,0,0.48);
      color: var(--text);
      padding: 0.85rem;
      transform: translateX(-50%);
    }
    .account-auth-message[hidden] { display: none; }
    .account-auth-message.success { border-color: var(--positiv); color: var(--text); }
    .account-auth-message.error { border-color: var(--negativ); color: var(--text); }
    .account-auth-message > span { width: 100%; overflow-wrap: anywhere; }
    .account-auth-message-dismiss {
      display: grid;
      flex: 0 0 auto;
      width: 28px;
      height: 28px;
      border: 1px solid var(--border);
      border-radius: 50%;
      background: transparent;
      color: var(--dim);
      cursor: pointer;
      font: var(--text-base)/1 var(--font-body);
      padding: 0 0 2px;
      place-items: center;
    }
    .account-auth-message-dismiss:hover,
    .account-auth-message-dismiss:focus-visible { border-color: var(--accent); color: var(--accent); }
    .training-message { margin: 0; }
    .training-message:empty { display: none; }
    .account-header {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 20px;
      padding-right: 2rem;
      margin-bottom: 1.35rem;
    }
    .account-header > div { min-width: 0; }
    .account-header-actions { display: flex; align-items: center; justify-content: flex-end; gap: 8px; }
    .account-header h2 { margin-bottom: 0.1rem; }
    .auth-account-email { color: var(--dim); font-size: 0.88rem; margin: 0; text-wrap: nowrap; }
    .account-settings {
      display: grid;
      gap: 18px;
      border: 1px solid var(--border);
      border-radius: 12px;
      background: var(--surface);
      margin-bottom: 1.35rem;
      padding: 1rem;
    }
    .account-settings[hidden] { display: none; }
    .account-settings-heading {
      display: flex;
      align-items: end;
      justify-content: space-between;
      gap: 20px;
    }
    .account-settings-heading h3 {
      margin: 0.2rem 0 0;
      font-family: var(--font-heading);
      font-size: 1.35rem;
      font-weight: 400;
      letter-spacing: 0.03em;
    }
    .account-settings-heading p {
      max-width: 28ch;
      margin: 0;
      color: var(--dim);
      font-size: var(--text-xs);
      line-height: 1.45;
      text-align: right;
    }
    .account-setting-list { display: grid; }
    .account-setting-row {
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      align-items: center;
      gap: 16px;
      border-top: 1px solid var(--border);
      cursor: pointer;
      padding: 0.85rem 0;
    }
    .account-setting-row:last-child { border-bottom: 1px solid var(--border); }
    .account-setting-row > span { display: grid; gap: 3px; min-width: 0; }
    .account-setting-row strong { color: var(--text); font-size: var(--text-sm); }
    .account-setting-row small { color: var(--dim); font-size: var(--text-xs); line-height: 1.4; }
    .account-setting-row input {
      appearance: none;
      position: relative;
      width: 42px;
      height: 24px;
      border: 1px solid var(--border);
      border-radius: 999px;
      background: var(--surface2);
      cursor: pointer;
      outline: none;
      transition: border-color 160ms ease, background 160ms ease;
    }
    .account-setting-row input::after {
      content: '';
      position: absolute;
      top: 3px;
      left: 3px;
      width: 16px;
      height: 16px;
      border-radius: 50%;
      background: var(--dim);
      transition: background 160ms ease, transform 160ms ease;
    }
    .account-setting-row input:checked { border-color: var(--accent); background: var(--accent); }
    .account-setting-row input:checked::after { background: #07080c; transform: translateX(18px); }
    .account-setting-row input:focus-visible { box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 22%, transparent); }
    .account-setting-row input:disabled { cursor: wait; opacity: 0.55; }
    .account-settings-message { min-height: 0; margin: -6px 0 0; }
    .account-settings-message:empty { display: none; }
    .account-settings-actions { display: flex; justify-content: flex-end; gap: 8px; }
    .account-games-empty {
      border: 1px solid var(--border);
      border-radius: 10px;
      color: var(--dim);
      font-size: 0.82rem;
      padding: 1rem;
    }
    .account-games-empty[hidden] { display: none; }
    .account-player-area { display: grid; }
    .account-player-area[hidden] { display: none; }
    .account-section {
      display: grid;
      gap: 18px;
      padding-top: 2rem;
    }
    .account-section-heading { display: flex; align-items: center; justify-content: space-between; }
    .account-section-heading .sh-title-with-help { position: relative; }
    .account-section-heading .account-games-help.th-help-wrap { position: static; }
    .account-section-heading .account-games-help.th-help-wrap .help-tooltip {
      top: calc(100% + 8px);
      right: auto;
      left: 0;
      width: min(340px, calc(100vw - 48px));
      transform: none;
    }
    .account-games-help-block { display: block; }
    .account-games-help-block + .account-games-help-block { margin-top: 0.65rem; }
    .account-games-help-block strong {
      display: block;
      margin-bottom: 0.15rem;
      color: var(--text);
      font-weight: 600;
    }
    .account-result-scope-toggle { justify-self: start; }
    .account-result-scope-toggle[hidden] { display: none; }
    .account-task-list { display: grid; gap: 18px; }
    #result-task-list { gap: 40px; }
    #result-task-list > .account-task-group {
      margin-top: 2rem;
    }
    .account-task-group { display: grid; }
    .result-task-wrap { display: grid; gap: 6px; }
    .account-task-card {
      display: grid;
      gap: 12px;
      border: 1px solid var(--border);
      border-radius: 12px;
      background: var(--surface);
      padding: 1rem;
    }
    .account-task-card.has-authenticated-player {
      border-color: var(--accent2);
      box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--accent2) 18%, transparent);
    }
    .account-task-card.is-actionable {
      border-color: var(--accent);
      box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--accent) 18%, transparent);
    }
    .account-task-card.is-waiting { background: color-mix(in srgb, var(--surface) 62%, var(--bg)); }
    .account-task-card.is-waiting > :not(.account-task-actions) { opacity: 0.58; }
    .account-task-meta { display: flex; align-items: center; justify-content: space-between; gap: 8px; color: var(--dim); }
    .account-task-status {
      border: 1px solid var(--border);
      border-radius: 999px;
      color: var(--dim);
      font: var(--text-xs) var(--font-body);
      padding: 0.2rem 0.45rem;
      white-space: nowrap;
    }
    .account-task-status.is-open { border-color: var(--accent); background: transparent; color: var(--accent); }
    .account-task-status.is-complete { border-color: color-mix(in srgb, var(--positiv) 45%, var(--border)); color: var(--positiv); }
    .result-card-timing { color: var(--dim); font: var(--text-sm) var(--font-body); letter-spacing: 0.02rem; }
    .racket-check, .racket-status { color: var(--muted); font: var(--text-sm) var(--font-body); letter-spacing: 0.02rem; }
    .racket-check.is-free, .racket-status.is-free { color: var(--positiv); }
    .racket-check.is-busy, .racket-status.is-busy { color: var(--negativ); }
    .account-task-matchup { 
      display: grid; 
      grid-template-columns: 1fr auto 1fr; 
      align-items: center; 
      gap: 12px; 
      font-size: var(--text-base);
    }
    .account-task-matchup strong:last-child { text-align: right; }
    .account-task-matchup > span { color: var(--dim); font-size: var(--text-sm); }
    #live-account-list .account-task-matchup {
      margin: 12px 0;
    }
    #live-account-list .result-entry-buttons {
      flex-flow: column-reverse;
    }
    #live-account-list .result-entry-buttons .primary-button {
      padding: 1rem;
      font-size: var(--text-base);
    }
    .account-live-player { display: inline-flex; align-items: center; min-width: 0; gap: 0.3em; }
    .account-live-server {
      flex: 0 0 auto;
      color: var(--accent);
      font-size: var(--text-base);
      line-height: 1;
    }
    .account-task-live-score {
      display: grid;
      min-width: 72px;
      gap: 2px;
      text-align: center;
    }
    .account-task-live-score .mc-score-main { font-size: var(--text-heading); }
    .account-task-live-score .mc-score-detail { 
      margin-top: 0; 
      position: inherit;
      width: inherit;
      top: inherit;
    }
    .account-task-player-name.is-authenticated { color: var(--accent2); }
    .result-proposal { display: flex; align-items: center; justify-content: space-between; gap: 8px; border-radius: 8px; background: var(--surface2); padding: 0.7rem; }
    .result-proposal span { color: var(--dim); font-size: var(--text-sm); }
    .result-proposal strong { font-family: var(--font-body); font-size: var(--text-sm); text-align: right; letter-spacing: 0.02rem; }
    .account-task-actions { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
    .result-review-actions { justify-content: flex-end; flex-wrap: nowrap; }
    .result-entry-form { display: grid; grid-template-columns: 1fr; gap: 12px; }
    .result-entry-form[hidden] { display: none; }
    .result-entry-form.is-counterproposal {
      border-top: 1px solid var(--border);
      padding-top: 12px;
    }
    .result-entry-timing { display: grid; grid-template-columns: minmax(150px, 200px) minmax(120px, 160px); gap: 8px; }
    .match-schedule-form { display: grid; gap: 8px; }
    .match-schedule-actions,
    .scheduled-result-actions { display: flex; justify-content: flex-end; }
    .result-entry-form label,
    .match-schedule-form label,
    .training-form label {
      display: flex;
      align-items: center;
      gap: 8px;
      color: var(--dim);
      font-size: var(--text-sm);
      font-weight: 600;
    }
    .result-entry-form :where(input, select),
    .match-schedule-form :where(input),
    .training-form :where(input, select) {
      width: 70%;
      min-width: 0;
      max-width: 100%;
      min-height: 38px;
      border: 1px solid var(--border);
      border-radius: 8px;
      background: var(--surface);
      color: var(--text);
      font: var(--text-sm) var(--font-body);
      padding: 0.55rem 0.65rem;
    }
    :where(.result-entry-form, .match-schedule-form, .training-form) input:is([type="date"], [type="time"]) {
      display: block;
      width: auto;
      min-inline-size: 0;
      max-inline-size: 100%;
      text-align: left;
    }
    :where(.result-entry-form, .match-schedule-form, .training-form) input:is([type="date"], [type="time"])::-webkit-date-and-time-value {
      text-align: left;
    }
    .datetime-input-shell { display: contents; }
    .datetime-input-shell.is-empty input { color: var(--dim); }
    .has-controlled-datetime-hints .datetime-input-shell {
      position: relative;
      display: inline-grid;
      grid-template-areas: 'field';
      width: fit-content;
      max-width: 100%;
    }
    .has-controlled-datetime-hints .datetime-input-shell input {
      grid-area: field;
      width: 100%;
      min-width: 0;
      max-width: 100%;
    }
    .has-controlled-datetime-hints .datetime-input-shell::after {
      content: attr(data-datetime-hint);
      z-index: 1;
      grid-area: field;
      align-self: center;
      justify-self: start;
      color: var(--dim);
      font: var(--text-sm) var(--font-body);
      opacity: 0;
      padding: 0.55rem 0.65rem;
      pointer-events: none;
      white-space: nowrap;
    }
    .has-controlled-datetime-hints .datetime-input-shell.is-empty:not(:focus-within)::after { opacity: 1; }
    .has-controlled-datetime-hints .datetime-input-shell.is-empty:not(:focus-within) input {
      color: transparent;
      -webkit-text-fill-color: transparent;
    }
    .result-score-entry {
      display: grid;
      grid-template-columns: repeat(3, auto);
      align-items: start;
      justify-content: center;
      gap: 18px;
    }
    .result-score-set {
      display: grid;
      gap: 8px;
      min-width: 0;
    }
    .result-score-label {
      color: var(--dim);
      font-size: 0.72rem;
      font-weight: 600;
      text-align: center;
    }
    .result-score-tiebreak {
      display: grid;
      gap: 6px;
      margin-top: 4px;
    }
    .result-score-tiebreak[hidden] { display: none; }
    .result-score-set[data-result-decision]:has(:disabled) { opacity: 0.38; }
    .result-entry-summary {
      flex: 1 1 180px;
      min-width: 0;
      color: var(--dim);
      font: var(--text-xs) var(--font-body);
      letter-spacing: 0.02rem;
      line-height: 1.35;
      overflow-wrap: anywhere;
    }
    .result-entry-summary.is-valid { color: var(--positiv); }
    .result-entry-summary.is-invalid { color: var(--negativ); }
    .result-entry-summary.is-partial { color: var(--accent); }
    .result-entry-actions {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      flex-wrap: wrap;
    }
    .result-entry-buttons { display: flex; align-items: center; justify-content: flex-end; gap: 10px; flex: 0 0 auto; width: 100%; }
    .match-cancel-button { margin-right: auto; }
    .live-mode-fieldset {
      display: grid;
      gap: 8px;
      min-width: 0;
      margin: 0;
      border: 0;
      padding: 0;
    }
    .live-mode-fieldset legend {
      margin-bottom: 8px;
      color: var(--dim);
      font-size: var(--text-sm);
      font-weight: 600;
    }
    .live-mode-fieldset small { color: var(--dim); line-height: 1.45; }
    .live-mode-toggle {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 4px;
      border: 1px solid var(--border);
      border-radius: 12px;
      background: var(--surface2);
      padding: 4px;
    }
    .live-mode-toggle button {
      display: grid;
      gap: 2px;
      min-width: 0;
      border: 0;
      border-radius: 8px;
      background: transparent;
      color: var(--dim);
      cursor: pointer;
      font: inherit;
      padding: 0.7rem;
      text-align: center;
    }
    .live-mode-toggle button strong { color: var(--text); font-size: var(--text-sm); }
    .live-mode-toggle button span { font-size: var(--text-xs); }
    .live-mode-toggle button.active { background: var(--surface); box-shadow: 0 0 0 1px var(--accent); color: var(--accent); }
    .live-mode-toggle button.active strong { color: var(--accent); }
    .live-writer-mode {
      color: var(--dim);
      font-family: var(--font-mono);
      font-size: var(--text-xs);
      letter-spacing: 0.08em;
      text-align: center;
      text-transform: uppercase;
    }
    .live-point-team-buttons {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 12px;
    }
    .live-point-team-button {
      display: grid;
      align-content: center;
      justify-items: center;
      min-width: 0;
      min-height: 88px;
      gap: 5px;
      border: 1px solid var(--border);
      border-radius: 12px;
      background: var(--surface2);
      color: var(--text);
      cursor: pointer;
      font-family: var(--font-body);
      padding: 0.85rem;
      text-align: center;
      transition: border-color 160ms ease, background 160ms ease, color 160ms ease, transform 160ms ease;
    }
    .live-point-team-button > span {
      color: var(--dim);
      font-family: var(--font-body);
      font-size: var(--text-xs);
      letter-spacing: 0.1em;
      text-transform: uppercase;
    }
    .live-point-team-button > strong {
      font-size: var(--text-sm);
      line-height: 1.25;
      overflow-wrap: anywhere;
    }
    .live-point-team-button:hover,
    .live-point-team-button:focus-visible {
      border-color: var(--accent);
      color: var(--accent);
      outline: none;
    }
    .live-point-team-button.active {
      border-color: var(--accent);
      background: var(--accent);
      color: var(--bg);
    }
    .live-point-team-button.active > span { color: currentColor; opacity: 0.7; }
    .live-point-team-button:disabled { cursor: wait; opacity: 0.55; }
    .live-finish-summary {
      display: grid;
      gap: 4px;
      border: 1px solid var(--border);
      border-radius: 12px;
      background: var(--surface2);
      padding: 0.9rem;
      text-align: center;
    }
    .live-finish-summary span,
    .live-finish-summary small { color: var(--dim); }
    .live-finish-summary strong { color: var(--accent); font-size: 1.05rem; }
    .live-tiebreak-form { gap: 14px; }
    .live-tiebreak-score { width: min(100%, 320px); margin: 0 auto; }
    .live-ticker-text-actions {
      display: flex;
      align-items: baseline;
      justify-content: space-around;
      margin: 12px 0;
    }
    .live-ticker-text-actions .text-link { margin-top: 0; padding: 0; }
    .live-server-correction-forms {
      display: grid;
      gap: 12px;
      border-top: 1px solid var(--border);
      padding-top: 12px;
    }
    .live-server-correction-forms[hidden] { display: none; }
    .account-empty,
    .account-waiting { color: var(--dim); font-size: var(--text-sm); }
    .account-waiting { display: inline-flex; align-items: center; min-height: 36px; }
    .training-form { 
      display: grid; 
      gap: 10px; 
      border: 1px solid var(--border); 
      border-radius: 12px; 
      padding: 0.9rem; 
      background-color: var(--surface); 
    }
    .training-form > .secondary-button,
    .training-result-fields > .secondary-button { width: max-content; }
    .training-form .primary-button { width: max-content; margin-left: auto; }
    .training-form[hidden] { display: none; }
    .training-result-fields { display: grid; gap: 10px; }
    .training-result-fields[hidden] { display: none; }
    .training-form-actions { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
    .training-alternative-form {
      border: 0;
      border-top: 1px solid var(--border);
      border-radius: 0;
      padding: 12px 0 0;
    }
    .scheduled-training-form.is-result-entry {
      border-top: 0;
      padding-top: 0;
    }
    .training-form-meta { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
    .training-player-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
    .training-picker-label { color: var(--dim); font-size: var(--text-sm); font-weight: 600; }
    .training-picker-search-control {
      position: relative;
      display: flex;
      width: 100%;
      min-width: 0;
      color: var(--text);
    }
    .training-picker-search-control::after {
      content: '';
      position: absolute;
      top: 50%;
      right: 0.85rem;
      z-index: 2;
      width: 6px;
      height: 6px;
      border-right: 1.5px solid currentColor;
      border-bottom: 1.5px solid currentColor;
      pointer-events: none;
      transform: translateY(-65%) rotate(45deg);
      transform-origin: center;
      transition: transform 160ms ease;
    }
    .training-picker-search-control .training-picker-toggle::after { display: none; }
    .training-picker-toggle {
      display: flex;
      align-items: center;
      justify-content: flex-start;
      width: 100%;
      min-width: 0;
      text-align: left;
      transition: border-color 0.15s, color 0.15s, background 0.15s;
    }
    .training-picker-search-input {
      appearance: none;
      -webkit-appearance: none;
      position: absolute;
      inset: 0;
      z-index: 1;
      display: none;
      width: 100%;
      height: 100%;
      min-width: 0;
      min-height: 0;
      border: 1px solid var(--border);
      border-radius: 999px;
      background: var(--surface);
      color: var(--text);
      font: 500 var(--text-sm) var(--font-body);
      outline: none;
      padding: 0.5rem 1.8rem 0.5rem 0.85rem;
    }
    .training-picker-search-input::placeholder { color: var(--dim); opacity: 1; }
    .training-picker-search-input::-webkit-search-cancel-button { display: none; }
    .training-picker.open .training-picker-search-control { color: var(--accent); }
    .training-picker.open .training-picker-search-control::after { transform: translateY(-35%) rotate(225deg); }
    .training-picker.open .training-picker-search-control .training-picker-toggle { visibility: hidden; }
    .training-picker.open .training-picker-search-input {
      display: block;
      border-color: var(--accent);
    }
    .training-picker-display {
      flex: 1 1 auto;
      min-width: 0;
      overflow: hidden;
    }
    .training-picker-display-line {
      display: block;
      min-width: 0;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    .training-picker-matchup {
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
      align-items: center;
      gap: 8px;
      width: 100%;
      min-width: 0;
    }
    .training-picker-team {
      display: grid;
      min-width: 0;
    }
    .training-picker-player {
      display: flex;
      align-items: baseline;
      min-width: 0;
    }
    .training-picker-team--right .training-picker-player { justify-content: flex-end; }
    .training-picker-player-name {
      min-width: 0;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    .training-picker-separator {
      flex: 0 0 auto;
      margin-left: 0.25em;
      color: var(--muted);
      font-weight: 400;
    }
    .training-picker-versus {
      color: var(--muted);
      font-weight: 400;
      text-align: center;
    }
    .training-picker-option-label {
      display: block;
      flex: 1 1 auto;
      min-width: 0;
      overflow: hidden;
    }
    .training-picker-option[data-training-guest-option] {
      border-top: 1px solid var(--border);
      color: var(--accent);
    }
    .training-guest-control {
      display: grid;
      grid-template-columns: auto minmax(0, 1fr) auto;
      align-items: center;
      gap: 8px;
      min-height: 38px;
      border: 1px solid var(--accent);
      border-radius: 999px;
      background: var(--surface);
      padding: 0 0.85rem;
    }
    .training-guest-badge {
      color: var(--accent);
      font-size: var(--text-xs);
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: 0.04em;
    }
    .training-guest-name-input {
      min-width: 0;
      border: 0;
      background: transparent;
      color: var(--text);
      font: 500 var(--text-sm) var(--font-body);
      outline: none;
      padding: 0.35rem 0;
      min-height: 36px;
    }
    .training-guest-name-input::placeholder { color: var(--dim); opacity: 1; }
    .training-guest-remove {
      display: grid;
      width: 30px;
      height: 30px;
      border: 0;
      border-radius: 50%;
      background: transparent;
      color: var(--dim);
      cursor: pointer;
      font: 1rem/1 var(--font-body);
      place-items: center;
    }
    .training-guest-remove:hover,
    .training-guest-remove:focus-visible { background: var(--surface2); color: var(--accent); outline: none; }
    .account-task-player-name.is-guest { color: var(--dim); font-weight: 600; }
    .training-picker-menu { right: auto; left: 0; width: max(100%, 260px); }
    .training-player-fields .training-picker:nth-child(even) .training-picker-menu { right: 0; left: auto; }
    .training-rounds { display: grid; gap: 16px; }
    .training-round-field { display: grid; gap: 14px; border: 1px solid var(--border); padding: 0.9rem; border-radius: 12px; background-color: var(--surface2); }
    .training-round-head { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .42fr) auto; align-items: end; gap: 8px; }
    .training-score-entry { grid-template-columns: repeat(3, auto); gap: 10px; }
    .training-round-remove {
      display: grid;
      width: 40px;
      height: 40px;
      border: 1px solid var(--border);
      border-radius: 50%;
      background: rgba(7,8,12,0.86);
      color: var(--text);
      cursor: pointer;
      padding: 0;
      place-items: center;
    }
    .training-round-remove svg {
      display: block;
      width: 18px;
      height: 18px;
      fill: none;
      stroke: currentColor;
      stroke-linecap: round;
      stroke-width: 3.2;
      pointer-events: none;
    }
    .training-round-remove:hover,
    .training-round-remove:focus-visible { border-color: var(--accent); color: var(--accent); outline: none; }
    .training-round-summary { min-height: 1rem; }
    .training-task-rounds { display: grid; gap: 14px; }
    .training-task-participants {
      display: flex;
      gap: 8px;
      justify-content: space-around;
    }
    .training-task-participants .account-task-player-name { min-width: 0; }
    .training-task-round { display: grid; gap: 14px; }
    .training-task-round + .training-task-round { border-top: 1px solid var(--border); padding-top: 14px; }
    .training-result-details { display: inline-flex; align-items: baseline; justify-content: flex-end; flex-wrap: wrap; gap: 0.2rem; }
    .training-result-divider { color: var(--dim); }
    .training-result-partial { color: var(--dim); font-style: italic; font-weight: 500; opacity: 0.68; }
    @media (max-width: 768px) {
      .auth-button { min-width: 58px; }
      .auth-task-badge { position: unset; }
      .auth-dialog { max-height: 94vh; }
      .auth-dialog-card { padding: 1.1rem 0.5rem; }
      .tipp-invitation-card { padding: 2.25rem 1.25rem 1.25rem; }
      .account-auth-message { bottom: max(8px, env(safe-area-inset-bottom)); max-width: calc(100% - 32px); }
      .account-header { flex-wrap: wrap; gap: 12px; padding-right: 64px; }
      .account-header-actions { width: 100%; justify-content: flex-start; flex-wrap: wrap; }
      .account-header h2 { font-size: 1.65rem; }
      .account-settings-heading { align-items: start; flex-direction: column; gap: 6px; }
      .account-settings-heading p { max-width: none; text-align: left; }
      .account-settings-actions { justify-content: stretch; }
      .account-settings-actions .secondary-button { flex: 1 1 0; }
      .account-section { min-width: 0; }
      .account-section-heading { min-width: 0; }
      .account-section-heading .sh-title { font-size: 1.65rem; }
      #result-task-list,
      #result-task-list > .account-task-group,
      #result-task-list .account-task-list { min-width: 0; }
      .result-entry-timing { grid-template-columns: repeat(2, minmax(0, 1fr)); }
      .result-entry-form :where(input, select), .match-schedule-form :where(input), .training-form :where(input, select) { width: 100%; }
      :where(.result-entry-form, .match-schedule-form, .training-form) input:is([type="date"], [type="time"]) {
        -webkit-appearance: none;
        appearance: none;
        width: auto;
        inline-size: auto;
        min-inline-size: 0;
        max-inline-size: 100%;
        align-self: flex-start;
        justify-self: start;
      }
      .result-entry-timing label { min-width: 0; flex-direction: column; align-items: stretch; gap: 4px; }
      .account-section-heading { align-items: center; }
      .account-task-matchup strong { display: flex; flex-wrap: wrap; }
      .account-task-matchup strong:last-child { justify-content: end; }

      .account-task-actions .secondary-button, 
      .account-task-actions .primary-button, 
      .result-entry-buttons .secondary-button, 
      .result-entry-buttons .primary-button,
      .live-ticker-text-actions .text-link,
      .match-schedule-actions .secondary-button,
      .training-form > .primary-button,
      .training-form > .secondary-button,
      .training-result-fields > .secondary-button,
      .training-form-actions .primary-button,
      .training-form-actions .secondary-button
      { font-size: var(--text-xs); }

      .result-proposal { align-items: flex-start; flex-direction: column; }
      .result-proposal strong { text-align: left; }
      .result-score-entry { grid-template-columns: 1fr; gap: 12px; }
      .result-entry-actions .primary-button { width: auto; min-width: 0; }
      .training-round-head { display: flex; flex-wrap: wrap-reverse; justify-content: space-between; }
      .training-round-head .training-picker:first-child { width: 100%; }
      .training-round-head .training-picker { width: 80%; }
      .training-form-meta label { display: grid; gap: 4px; }
      .training-picker-toggle { min-width: 0; }
      .training-form-actions { align-items: stretch; flex-direction: column-reverse; }
      .training-form-actions .primary-button,
      .training-form-actions .secondary-button { width: 100%; margin: 0; }
    }