body :is(#setupModal, #setupDialog)[data-match-settings] { --match-header-height: var(--iwashi-header-height, calc(clamp(20px, 4vw, 64px) + 51px)); --setup-fit-top: var(--match-header-height); --setup-fit-viewport-height: calc(100dvh - var(--match-header-height)); }
/* Shared landscape settings for 01 and CRICKET; portrait keeps the existing form layout. */
.iwashi-header-game { display: none; }
@media (max-width: 700px) { body :is(#setupModal, #setupDialog)[data-match-settings] { --match-header-height: var(--iwashi-header-height, 61px); } }
@media (orientation: portrait), (hover: hover) and (pointer: fine) {
  body #setupDialog[data-match-settings] .dialog-card { display: block; }
  body #setupDialog[data-match-settings] .form-grid { grid-template-rows: none; }
  body #setupDialog[data-match-settings] .setup-player { grid-template-rows: auto auto auto; }

  body :is(#setupModal, #setupDialog)[data-match-settings] .match-settings-layout,
  body :is(#setupModal, #setupDialog)[data-match-settings] :is(.match-column, .match-player, .match-settings-actions) { display: contents; }
  body :is(#setupModal, #setupDialog)[data-match-settings] .settings-game-title { display: none; }
  body #setupModal[data-match-settings] .form-grid :has(> #finishRule) { order: 1; }
  body #setupModal[data-match-settings] .form-grid :has(> #bullMode) { order: 2; }
  body #setupModal[data-match-settings] .form-grid :has(> #startScore) { order: 3; }
  body #setupModal[data-match-settings] .form-grid :has(> #roundLimit) { order: 4; }
  body #setupModal[data-match-settings] .form-grid :has(> #legLimit) { order: 5; }
  body #setupModal[data-match-settings] .form-grid :has(> #checkoutVisible) { order: 6; }
  body #setupModal[data-match-settings] .setup-section-divider { order: 7; }
  body #setupModal[data-match-settings] #name1Field { order: 8; }
  body #setupModal[data-match-settings] #name2Field { order: 9; }
  body #setupModal[data-match-settings] #comAvg1Field { order: 10; }
  body #setupModal[data-match-settings] #comAvg2Field { order: 11; }
}
@media (orientation: landscape) and (pointer: coarse), (orientation: landscape) and (hover: none) {
body :is(#setupModal, #setupDialog)[data-match-settings] { --match-header-height: var(--iwashi-header-height, calc(clamp(20px, 4vw, 64px) + 51px)); --setup-fit-top: var(--match-header-height); --setup-fit-viewport-height: calc(100dvh - var(--match-header-height)); padding: 16px 24px !important; }
body :is(#setupModal, #setupDialog)[data-match-settings] .match-settings-layout { display: flex; flex-direction: column; width: min(1060px, 100%); height: 100%; min-height: 0; margin: auto; }
body :is(#setupModal, #setupDialog)[data-match-settings] .settings-game-title { flex: 0 0 auto; margin: 0 0 20px; padding: 0 0 16px; border-bottom: 1px solid #bfc4ca; font: 700 32px Arial, Helvetica, sans-serif; letter-spacing: .07em; color: #25282c; }
body :is(#setupModal, #setupDialog)[data-match-settings] .match-settings-form { display: flex !important; flex-direction: column; gap: 16px; flex: 1 1 auto !important; width: 100% !important; height: 0 !important; min-height: 0 !important; padding: 0 !important; margin: 0 !important; border: 0 !important; background: transparent !important; zoom: 1 !important; }
body :is(#setupModal, #setupDialog)[data-match-settings] .match-columns { display: grid; grid-template-columns: 1.5fr 1fr 1fr; gap: 16px; flex: 1 1 auto; min-height: 0; }
body :is(#setupModal, #setupDialog)[data-match-settings] .match-column { display: flex; flex-direction: column; gap: 12px; min-width: 0; min-height: 0; padding: 16px; border: 1px solid #bcc2c8; background: #f5f6f7; }
body :is(#setupModal, #setupDialog)[data-match-settings] :is(.field, .setup-player) { display: block; grid-column: auto; min-width: 0; margin: 0; padding: 0; border: 0; }
body :is(#setupModal, #setupDialog)[data-match-settings] :is(.field > label, .com-options > label) { display: block; margin: 0 0 6px; color: #69717a !important; font-size: 12px; line-height: 1.2; letter-spacing: 0; }
body :is(#setupModal, #setupDialog)[data-match-settings] .match-player { display: flex; flex-direction: column; gap: 8px; }
body :is(#setupModal, #setupDialog)[data-match-settings] :is(.player-name-heading, .player-setup-heading) { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 4px 8px; align-items: center; margin: 0 0 6px; }
body :is(#setupModal, #setupDialog)[data-match-settings] :is(.player-name-heading, .player-setup-heading) > label:first-child { grid-column: 1 / -1; margin: 0; color: #69717a !important; font-size: 12px; line-height: 1.2; }
body :is(#setupModal, #setupDialog)[data-match-settings] :is(.com-toggle, .setup-switch) { display: inline-flex; align-items: center; gap: 4px; min-height: 18px; margin: 0; font-size: 11px; white-space: nowrap; line-height: 1.2; }
body :is(#setupModal, #setupDialog)[data-match-settings] input[type="checkbox"] { position: static !important; opacity: 1; appearance: auto; width: 16px !important; height: 16px !important; min-height: 16px !important; margin: 0; padding: 0; flex: 0 0 16px; }
body :is(#setupModal, #setupDialog)[data-match-settings] :is(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]), select:not([hidden])) { display: block; width: 100%; min-width: 0; height: 44px; min-height: 44px; padding: 8px; }
body :is(#setupModal, #setupDialog)[data-match-settings] select[hidden], body :is(#setupModal, #setupDialog)[data-match-settings] input[type="hidden"] { display: none !important; }
body :is(#setupModal, #setupDialog)[data-match-settings] :is(.setup-choices) { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px; width: 100%; }
body :is(#setupModal, #setupDialog)[data-match-settings] :is([data-choice-group="bullMode"], [data-choice-group="checkoutVisible"], [data-setup-choice="overkill"]) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
body :is(#setupModal, #setupDialog)[data-match-settings] [data-choice-group="startScore"] { grid-template-columns: repeat(4, minmax(0, 1fr)); }
body :is(#setupModal, #setupDialog)[data-match-settings] .setup-choice { width: 100%; min-width: 0; min-height: 44px; padding: 6px 4px; line-height: 1.2; white-space: normal; overflow-wrap: anywhere; }
body :is(#setupModal, #setupDialog)[data-match-settings] .com-options { display: grid; grid-template-columns: minmax(0, 1fr) 56px; gap: 6px; margin-top: 6px; }
body :is(#setupModal, #setupDialog)[data-match-settings] .setup-choice-field small { display: block; margin-top: 6px; font-size: 12px; line-height: 1.4; }
body :is(#setupModal, #setupDialog)[data-match-settings] .player-settings { display: grid; grid-template-columns: minmax(0, 1fr); gap: 10px; margin: 0; }
body :is(#setupModal, #setupDialog)[data-match-settings] .player-settings label { margin: 0; }
body :is(#setupModal, #setupDialog)[data-match-settings] .player-settings :is(input,select) { margin-top: 6px; }
body :is(#setupModal, #setupDialog)[data-match-settings] .choices { grid-template-columns: repeat(2, minmax(0, 1fr)); }
body :is(#setupModal, #setupDialog)[data-match-settings] .choices label { position: relative; display: grid; place-items: center; min-width: 0; min-height: 44px; margin: 0; padding: 4px; border: 1px solid #bcc2c8; background: #e5e7e9; color: #25282c !important; font-size: 14px; line-height: 1.2; text-align: center; }
body :is(#setupModal, #setupDialog)[data-match-settings] .choices label:has(input:checked) { background: #424a53; color: #fff !important; border-color: #424a53; }
body :is(#setupModal, #setupDialog)[data-match-settings] .choices label:has(input:focus-visible) { outline: 2px solid #424a53; outline-offset: 2px; }
body :is(#setupModal, #setupDialog)[data-match-settings] .choices input { position: absolute; opacity: 0; margin: 0; }
body :is(#setupModal, #setupDialog)[data-match-settings] .match-settings-actions { display: flex; flex: 0 0 auto; gap: 12px; align-items: center; justify-content: flex-end; margin: 0; }
body :is(#setupModal, #setupDialog)[data-match-settings] .match-settings-actions button[type="submit"] { width: 100%; min-height: 44px; height: 44px; margin: 0; padding: 8px; }
body :is(#setupModal, #setupDialog)[data-match-settings] .match-settings-actions a { color: #424a53 !important; white-space: nowrap; font-size: 12px; }

  body :is(#setupModal, #setupDialog)[data-match-settings] { padding: 8px 12px !important; }
  body :is(#setupModal, #setupDialog)[data-match-settings] .settings-game-title { font-size: 24px; margin-bottom: 8px; padding-bottom: 8px; }
  body :is(#setupModal, #setupDialog)[data-match-settings] .match-settings-form { gap: 8px; }
  body :is(#setupModal, #setupDialog)[data-match-settings] .match-columns { gap: 8px; }
  body :is(#setupModal, #setupDialog)[data-match-settings] .match-column { padding: 8px; gap: 6px; }
  body :is(#setupModal, #setupDialog)[data-match-settings] :is(.field > label, .com-options > label) { margin-bottom: 4px; }
  body :is(#setupModal, #setupDialog)[data-match-settings] :is(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]), select:not([hidden])) { height: 32px; min-height: 32px; padding: 4px; }
  body :is(#setupModal, #setupDialog)[data-match-settings] :is(.setup-choice) { min-height: 32px; padding: 2px; }
  body :is(#setupModal, #setupDialog)[data-match-settings] .player-settings { gap: 6px; }
  body :is(#setupModal, #setupDialog)[data-match-settings] .player-settings :is(input,select) { margin-top: 4px; }
  body :is(#setupModal, #setupDialog)[data-match-settings] .match-settings-actions button[type="submit"] { height: 32px; min-height: 32px; padding: 4px; }

  body :is(#setupModal, #setupDialog)[data-match-settings] { --match-header-height: var(--iwashi-header-height, 39px); padding: 6px 12px !important; }
  body :is(#setupModal, #setupDialog)[data-match-settings] .settings-game-title { display: none; }
  body :is(#setupModal, #setupDialog)[data-match-settings] .match-settings-form { gap: 6px; }
  body :is(#setupModal, #setupDialog)[data-match-settings] .match-column { padding: 6px; }
  body :is(#setupModal, #setupDialog)[data-match-settings] :is(button, select, input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"])) { min-height: 28px !important; height: 28px; font-size: 12px !important; padding: 2px !important; line-height: 1.1; }
  body :is(#setupModal, #setupDialog)[data-match-settings] :is(.setup-choice) { height: auto; min-height: 28px; font-size: 12px; line-height: 1.1; }
  body :is(#setupModal, #setupDialog)[data-match-settings] :is(.field > label, .com-options > label) { font-size: 11px; margin-bottom: 3px; }
  body :is(#setupModal, #setupDialog)[data-match-settings] :is(.com-toggle, .setup-switch) { font-size: 10px; min-height: 14px; gap: 3px; }
  body :is(#setupModal, #setupDialog)[data-match-settings] input[type="checkbox"] { width: 12px !important; height: 12px !important; min-height: 12px !important; flex-basis: 12px; }
  body :is(#setupModal, #setupDialog)[data-match-settings] .match-player { gap: 4px; }
  body :is(#setupModal, #setupDialog)[data-match-settings] :is(.player-name-heading, .player-setup-heading) { gap: 2px 4px; margin-bottom: 3px; }
  body :is(#setupModal, #setupDialog)[data-match-settings] :is(.player-name-heading, .player-setup-heading) > label:first-child { font-size: 10px; }
  body :is(#setupModal, #setupDialog)[data-match-settings] .com-options { margin-top: 3px; grid-template-columns: minmax(0, 1fr) 48px; gap: 4px; }
  body :is(#setupModal, #setupDialog)[data-match-settings] .setup-choice-field small { font-size: 10px; margin-top: 3px; }
  body :is(#setupModal, #setupDialog)[data-match-settings] .match-settings-actions button[type="submit"] { height: 28px; min-height: 28px; }
  .iwashi-screen-header[data-match-settings] .iwashi-header-row { position: relative; }
  body[data-iwashi-header-screen="setup"] .iwashi-screen-header[data-match-settings] .iwashi-header-game { display: block; position: absolute; left: 50%; top: 0; transform: translateX(-50%); font: 700 14px Arial, Helvetica, sans-serif; line-height: 24px; color: #25282c; letter-spacing: .07em; white-space: nowrap; }

  body :is(#setupModal, #setupDialog)[data-match-settings] .setup-section-divider { display: none; }
  body :is(#setupModal, #setupDialog)[data-match-settings] :is(button.setup-choice) { height: auto !important; min-height: 28px !important; }
  body :is(#setupModal, #setupDialog)[data-match-settings] .match-settings-actions a { padding: 0; min-height: 0; border: 0; background: transparent; line-height: 1.2; }
  body[data-iwashi-header-screen="setup"] .iwashi-screen-header[data-match-settings] .iwashi-header-game { font-weight: 700 !important; }
  body :is(#setupModal, #setupDialog)[data-match-settings] .match-columns { grid-template-rows: minmax(0, 1fr) !important; height: 0 !important; margin: 0 !important; }
  body #setupModal[data-match-settings="01"] [data-choice-group="legLimit"], body #setupModal[data-match-settings="01"] [data-choice-group="roundLimit"] { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  body #setupModal[data-match-settings="01"] [data-choice-group="legLimit"] > button:nth-child(n+7) { grid-column: span 2; }

  /* Four columns only on touch-device landscape setup screens. */
  body :is(#setupModal, #setupDialog)[data-match-settings] .match-settings-form {
    --match-rule-width: calc((100% - 16px) / 3.5);
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) var(--match-rule-width) var(--match-rule-width);
    grid-template-rows: minmax(0, 1fr) 28px;
    gap: 6px 8px;
  }
  body #setupModal[data-match-settings="01"] .match-settings-form {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) max(var(--match-rule-width), 282px) var(--match-rule-width);
  }
  body :is(#setupModal, #setupDialog)[data-match-settings] :is(.match-columns, .match-players) { display: contents; }
  body :is(#setupModal, #setupDialog)[data-match-settings] :is(.match-player, .setup-player) {
    grid-row: 1; min-width: 0; padding: 6px; border: 1px solid #bcc2c8; background: #f5f6f7;
  }
  body :is(#setupModal, #setupDialog)[data-match-settings] :is(.match-player, .setup-player):first-child { grid-column: 1; }
  body :is(#setupModal, #setupDialog)[data-match-settings] :is(.match-player, .setup-player):nth-child(2) { grid-column: 2; }
  body :is(#setupModal, #setupDialog)[data-match-settings] .match-primary { grid-area: 1 / 3; }
  body :is(#setupModal, #setupDialog)[data-match-settings] .match-secondary { grid-area: 1 / 4; }
  body #setupDialog[data-match-settings="cricket"] .match-primary { grid-column: 4; }
  body #setupDialog[data-match-settings="cricket"] .match-secondary { grid-column: 3; }
  body :is(#setupModal, #setupDialog)[data-match-settings] .match-settings-actions { grid-area: 2 / 4; }
  body :is(#setupModal, #setupDialog)[data-match-settings] :is(.match-player, .setup-player),
  body #setupModal[data-match-settings="01"] .match-primary,
  body #setupDialog[data-match-settings="cricket"] .match-secondary { grid-row: 1 / -1; }

  body #setupModal[data-match-settings="01"] .player-name-field,
  body #setupDialog[data-match-settings="cricket"] .setup-player {
    display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: auto 28px auto; gap: 4px; align-content: start;
  }
  body :is(#setupModal, #setupDialog)[data-match-settings] :is(.player-name-heading, .player-setup-heading) { display: contents; }
  body :is(#setupModal, #setupDialog)[data-match-settings] :is(.player-name-heading, .player-setup-heading) > label:first-child { grid-area: 1 / 1 / 2 / 3; font-size: 0; }
  body :is(#setupModal, #setupDialog)[data-match-settings] label[for="name1"]::after { content: 'PLAYER 1'; font-size: 10px; }
  body :is(#setupModal, #setupDialog)[data-match-settings] label[for="name2"]::after { content: 'PLAYER 2'; font-size: 10px; }
  body :is(#setupModal, #setupDialog)[data-match-settings] :is(#name1, #name2) { grid-area: 2 / 1 / 3 / 3; }
  body :is(#setupModal, #setupDialog)[data-match-settings] :is(.com-toggle, .setup-switch) { grid-row: 3; white-space: normal; align-items: start; }
  body :is(#setupModal, #setupDialog)[data-match-settings] label:has(> :is(#playerType1, #playerType2, #comEnabled1, #comEnabled)) { font-size: 0; gap: 3px; }
  body :is(#setupModal, #setupDialog)[data-match-settings] label:has(> :is(#playerType1, #playerType2, #comEnabled1, #comEnabled)) > span { display: none; }
  body :is(#setupModal, #setupDialog)[data-match-settings] label:has(> :is(#playerType1, #playerType2, #comEnabled1, #comEnabled))::after { content: 'COMにする'; font-size: 10px; line-height: 1.2; }
  body #setupModal[data-match-settings="01"] .com-avg-field > label { font-size: 0; }
  body #setupModal[data-match-settings="01"] .com-avg-field > label::after { content: 'COM AVG'; font-size: 11px; }
  body #setupModal[data-match-settings="01"] [data-choice-group="finishRule"] .setup-choice { white-space: nowrap; overflow-wrap: normal; }

  body #setupDialog[data-match-settings="cricket"] .com-options { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, 1fr); margin: 0; gap: 4px; }
  body #setupDialog[data-match-settings="cricket"] .com-options > .field > label { display: none; }
  body #setupDialog[data-match-settings="cricket"] :is([data-setup-choice="comMode1"], [data-setup-choice="comMode"]) { grid-template-columns: minmax(0, 1fr); }
  body #setupDialog[data-match-settings="cricket"] :is([data-setup-choice="comMode1"], [data-setup-choice="comMode"]) > button:first-child { font-size: 0 !important; }
  body #setupDialog[data-match-settings="cricket"] :is([data-setup-choice="comMode1"], [data-setup-choice="comMode"]) > button:first-child::after { content: '通常モード'; font-size: 12px; }
}
@media (max-width: 760px) and (orientation: landscape) and (pointer: coarse), (max-width: 760px) and (orientation: landscape) and (hover: none) {
  body #setupModal[data-match-settings="01"] .player-name-field { grid-template-rows: auto 28px auto auto; }
  body #setupModal[data-match-settings="01"] .com-toggle { grid-column: 1 / -1; align-items: center; gap: 2px; }
  body #setupModal[data-match-settings="01"] .com-toggle:last-child { grid-row: 4; }
}
@media (orientation: portrait) and (pointer: coarse), (orientation: portrait) and (hover: none) {
  body #setupDialog[data-match-settings="cricket"] #setupForm :is([data-setup-choice="comMode1"], [data-setup-choice="comMode"]) > button:is([data-value="scoring"], [data-value="closing"]) { font-size: 0 !important; line-height: 0; }
  body #setupDialog[data-match-settings="cricket"] #setupForm :is([data-setup-choice="comMode1"], [data-setup-choice="comMode"]) > button:is([data-value="scoring"], [data-value="closing"])::after { display: block; white-space: pre; font-size: 12px; line-height: 1; }
  body #setupDialog[data-match-settings="cricket"] #setupForm :is([data-setup-choice="comMode1"], [data-setup-choice="comMode"]) > button[data-value="scoring"]::after { content: '加点\A モード'; }
  body #setupDialog[data-match-settings="cricket"] #setupForm :is([data-setup-choice="comMode1"], [data-setup-choice="comMode"]) > button[data-value="closing"]::after { content: 'オープン\A モード'; }
}

/* Titles belong to the setup header on every screen size. */
body[data-iwashi-header-screen="setup"] .iwashi-screen-header[data-match-settings] .iwashi-header-row { position: relative; }
body[data-iwashi-header-screen="setup"] .iwashi-screen-header[data-match-settings] .iwashi-header-game { display: block; position: absolute; top: 0; left: 50%; transform: translateX(-50%); font: 700 20px/24px Arial, Helvetica, sans-serif; letter-spacing: .07em; color: #25282c; white-space: nowrap; }
@media (min-width: 921px) and (hover: hover) and (pointer: fine) {
  body[data-iwashi-header-screen="setup"] .iwashi-screen-header[data-match-settings] .iwashi-header-row { min-height: 61px; }
  body[data-iwashi-header-screen="setup"] .iwashi-screen-header[data-match-settings] .iwashi-header-game { font-size: 32px; line-height: 38px; }
}
@media (orientation: portrait) and (pointer: coarse), (orientation: portrait) and (hover: none) {
  body[data-iwashi-header-screen="setup"] .iwashi-screen-header[data-match-settings] .iwashi-header-row { flex-wrap: wrap; }
  body[data-iwashi-header-screen="setup"] .iwashi-screen-header[data-match-settings] .iwashi-header-game { position: static; transform: none; order: 1; flex: 0 0 100%; text-align: center; }
}
@media (orientation: landscape) and (pointer: coarse), (orientation: landscape) and (hover: none) {
  body[data-iwashi-header-screen="setup"] .iwashi-screen-header[data-match-settings] .iwashi-header-game { font-size: 14px; line-height: 24px; }
}
