/* Tam Sayılar worlds (integer-worlds.js) and adventures (integer-adventures.js).
   One shell for all fifteen: a goal line with status chips and a "Nasıl oynanır" disclosure, then the board with its
   controls beside it (smartboard, landscape phone) or under it (portrait phone). The play card takes exactly the height
   the arena leaves, so nothing scrolls; each board sizes itself to its box. */

/* ---------- Shell ---------- */
#arenaDialog[data-arena-layout~="card"] > #arenaBody > #arenaPlay.iw-world {
  flex: 1 1 0; min-height: 0; display: flex; flex-direction: column; gap: 10px; padding: 12px 16px;
}
.iw-world { font-size: clamp(15px, 1.25vw, 19px); }
.iw-world h3, .iw-world h4 { margin: 0; line-height: 1.2; }
.iw-world p { margin: 0; line-height: 1.35; }
.iw-head { position: relative; flex: none; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 16px; }
.iw-goal { min-width: 0; font-size: clamp(18px, 1.6vw, 25px); }
.iw-chips { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 6px; }
.iw-chip { display: inline-flex; align-items: center; min-height: 34px; padding: 4px 12px; border-radius: 999px; background: var(--primary-soft); color: var(--ink); font-size: 15px; font-weight: 700; white-space: nowrap; }
.iw-turn { background: var(--brand-tint); box-shadow: inset 0 0 0 2px var(--player-a); }
.iw-help { position: static; }
.iw-help:not([open]) > .iw-help-body { display: none; }
.iw-help > summary { display: inline-flex; align-items: center; min-height: 44px; padding: 6px 14px; border: 1px solid var(--line-strong); border-radius: 999px; background: var(--surface); font-size: 15px; font-weight: 700; cursor: pointer; list-style: none; }
.iw-help > summary::-webkit-details-marker { display: none; }
.iw-help > summary::before { content: "?"; display: inline-grid; place-items: center; width: 22px; height: 22px; margin-right: 8px; border-radius: 50%; background: var(--primary); color: var(--on-primary, #fff); font-size: 14px; }
.iw-help[open] > summary { background: var(--primary-soft); }
.iw-help-body { position: absolute; z-index: 6; top: calc(100% + 6px); right: 0; display: grid; gap: 8px; width: min(560px, 100%); max-height: 60vh; overflow: auto; padding: 14px 16px; border: 1px solid var(--line-strong); border-radius: 14px; background: var(--surface); box-shadow: var(--shadow-md, 0 14px 30px -12px rgba(20, 30, 60, .35)); font-size: 16px; transform-origin: top right; animation: iwHelpIn .16s cubic-bezier(.2, .8, .2, 1) both; }
@keyframes iwHelpIn { from { opacity: 0; transform: translateY(-4px) scale(.98); } }
.iw-world .iw-save-note { color: var(--ink-soft); font-size: 14px; line-height: 1.3; }
.iw-world .iw-save-note.is-warning { flex: none; padding: 6px 12px; border-radius: 10px; background: var(--gold-tint); color: var(--ink); }
body.board-view .iw-help-body .iw-save-note { display: none; }

.iw-stage { flex: 1 1 0; min-height: 0; display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(320px, 1fr); gap: 16px; padding: 4px; }
.iw-stage.is-single { grid-template-columns: minmax(0, 1fr); }
/* The board and panel scroll on their own only if their content cannot fit. Their 4px padding, given back by the negative
   margin into the stage's own 4px padding, keeps the selection and focus rings of edge buttons from being cut off. */
.iw-board, .iw-panel { min-width: 0; min-height: 0; display: flex; flex-direction: column; gap: 10px; margin: -4px; padding: 4px; overflow-y: auto; overscroll-behavior: contain; }
.iw-board { justify-content: safe center; container-type: size; container-name: iw-board; }
.iw-panel { justify-content: safe center; }

/* ---------- Shared controls ---------- */
.iw-controls, .iw-hand, .iw-incoming { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.iw-world .iw-button { min-height: 48px; padding: 8px 14px; font-size: inherit; }
.iw-world .iw-button.is-selected { outline: 3px solid var(--primary); outline-offset: 1px; background: var(--primary-soft); }
.iw-button strong { font-size: 1.3em; }
.iw-button small { display: block; font-size: 12px; }
.iw-hand .iw-button { min-width: 60px; min-height: 56px; }
.iw-hint { padding: 8px 12px; border-left: 4px solid #d4a52b; border-radius: 8px; background: var(--gold-tint); font-size: .9em; }
.iw-preview { padding: 8px 14px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface-soft); font-weight: 700; }
.iw-meta { color: var(--ink-soft); font-size: .9em; }
.iw-toolbox { display: flex; flex-direction: column; gap: 10px; min-width: 0; padding: 12px; border: 1px solid var(--line); border-radius: 14px; }
.iw-predict { display: grid; gap: 6px; }
.iw-predict > p { font-weight: 700; font-size: .9em; }
.iw-predict .iw-controls { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
.iw-predict .iw-button { min-width: 0; }
.iw-expression { overflow-wrap: anywhere; font-weight: 700; }
.iw-placeholder { padding: 12px; border: 2px dashed var(--line); border-radius: 12px; color: var(--ink-soft); }
.iw-choices { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 8px; }
.iw-world .explorer-table { margin: 0; }
.iw-world .explorer-table th, .iw-world .explorer-table td { padding: 6px 10px; }

/* A number line fills its width; its labels keep one size, and a narrow box drops every other label. */
.iw-numberline { display: block; flex: none; width: 100%; height: auto; max-height: 34cqh; fill: currentColor; overflow: visible; }
.iw-numberline text { font-size: 20px; font-weight: 700; }
.iw-numberline text.iw-puck { font-size: 17px; }
/* Buz Köprüsü labels every number from −10 to +7, so on a wide board its labels stay small enough not to touch (a narrow board shows every other one). */
@container iw-board (min-width: 481px) { .iw-world[data-world-game="ice-bridge"] .iw-numberline text:not(.iw-puck) { font-size: 16px; } }
@container iw-board (max-width: 480px) { .iw-numberline text { font-size: 26px; } .iw-numberline text.iw-minor { display: none; } }

/* ---------- Sıfır Soygunu (zero-heist): the building is the board, one row per floor ---------- */
.iw-building { flex: 1 1 0; min-height: 0; display: grid; grid-template-rows: repeat(var(--iw-floors), minmax(0, 1fr)); border: 3px solid var(--line-strong); border-radius: 14px; overflow: hidden; background: var(--surface-2); }
.iw-floor { min-height: 0; display: grid; grid-template-columns: 3.2em 1fr; align-items: center; gap: 8px; padding: 0 12px; border-bottom: 1px solid var(--line); font-size: clamp(12px, 3.2cqh, 16px); line-height: 1.1; }
.iw-floor:last-child { border-bottom: 0; }
.iw-floor > span { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; min-width: 0; }
.iw-floor strong { font-size: clamp(12px, 4.2cqh, 22px); }
.iw-floor.is-zero { background: var(--apricot-soft); border-block: 2px solid var(--apricot-dark); }
.iw-floor.is-player { background: var(--brand-tint); }
.iw-floor.is-locked { background: repeating-linear-gradient(135deg, var(--surface-2) 0 8px, var(--surface-3) 8px 16px); }
.iw-agent, .iw-patrol { padding: 1px 8px; border-radius: 6px; font-weight: 750; }
.iw-agent { background: var(--player-a); color: var(--on-player-solid); }
.iw-patrol { border: 1px solid var(--player-b); background: var(--coral-tint); color: var(--player-b-ink); }
.iw-alert { padding: 8px 12px; border-left: 4px solid var(--player-b); border-radius: 8px; background: var(--coral-tint); }
.iw-route { display: block; font-size: .85em; }
/* Concept tasks: each floor is a button. */
.iw-building--pick .iw-floor { width: 100%; margin: 0; border-width: 0 0 1px; border-radius: 0; text-align: left; justify-content: stretch; }
.iw-world .iw-building--pick .iw-floor { min-height: 0; padding: 0 12px; }
.iw-building--pick .iw-floor em { justify-self: end; font-style: normal; font-weight: 750; color: var(--violet-dark); }
.iw-step-label { color: var(--brand-ink); font-size: .85em; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; }
.iw-concept-prompt { padding: 12px 14px; border-left: 5px solid var(--player-a); border-radius: 10px; background: var(--brand-tint); font-size: clamp(18px, 1.7vw, 26px); font-weight: 800; }
.iw-world[data-world-game="zero-heist"] .iw-stage { grid-template-columns: minmax(0, 1fr) minmax(360px, 1.1fr); }

/* ---------- Sıfır Reaktörü (zero-reactor): the square grid fills the board's short side ---------- */
.iw-reactor { align-self: center; display: grid; grid-template-columns: repeat(var(--iw-cols), minmax(0, 1fr)); grid-auto-rows: minmax(0, 1fr); gap: 8px; width: min(100cqw, 100cqh); height: min(100cqw, 100cqh); padding: 10px; border-radius: 16px; background: #0b1b33; }
.iw-world .iw-reactor .iw-button { position: relative; min-width: 0; min-height: 0; padding: 2px; border: 1px solid var(--line-strong); background: var(--surface); }
.iw-reactor .iw-button strong { font-size: clamp(20px, 7cqmin, 36px); }
.iw-reactor .iw-button small { position: absolute; top: 3px; right: 4px; min-width: 20px; border-radius: 50%; background: var(--primary); color: #fff; }
.iw-world .iw-reactor .is-selected { outline-color: var(--gold); background: var(--violet-soft); }
.iw-reactor-status { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.iw-energy { font-weight: 700; }
.iw-energy strong { font-size: 1.8em; }
.iw-incoming { padding: 6px 10px; border-radius: 12px; background: var(--brand-tint); }
.iw-incoming strong { padding: 2px 10px; border: 1px solid var(--line-strong); border-radius: 8px; background: var(--surface); font-size: 1.4em; }
.iw-cancellation { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; padding: 8px; border: 2px solid var(--violet-dark); border-radius: 14px; text-align: center; }
.iw-cancellation > span { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px; padding: 6px; background: var(--violet-soft); }
.iw-cancellation > span:nth-child(2) { background: var(--apricot-soft); }
.iw-cancellation strong { grid-column: 1 / -1; color: var(--violet-dark); }
.iw-counter-cells { display: flex; flex-wrap: wrap; gap: 8px; }
.iw-counter-cells span { min-width: 48px; min-height: 48px; font-size: 1.15em; }
.iw-counter-cells span, .iw-unit { display: inline-flex; align-items: center; justify-content: center; min-width: 36px; min-height: 36px; padding: 4px; border: 2px solid currentColor; border-radius: 50%; font-style: normal; font-weight: 800; }
.iw-unit.positive { color: var(--brand-ink); }
.iw-unit.negative { color: var(--coral-ink); }
.iw-cancellation .iw-unit { animation: iwUnitCancel 1.2s ease both; }
@keyframes iwUnitCancel { to { opacity: .55; transform: scale(.9); text-decoration: line-through; } }
.iw-world[data-world-game="zero-reactor"] .iw-stage { grid-template-columns: minmax(0, 1fr) minmax(340px, 1fr); }

/* ---------- Lanetli Kartlar (cursed-cards) and Sayı Kuşatması (number-siege): board, then the player's toolbox ---------- */
.iw-lanes { flex: 1 1 0; min-height: 0; display: grid; grid-template-columns: repeat(var(--iw-lanes), minmax(0, 1fr)); gap: 10px; }
.iw-lane { display: grid; grid-template-rows: auto minmax(min-content, 1fr) minmax(min-content, 1fr) auto; min-width: 0; min-height: 0; border: 1px solid var(--line); border-radius: 14px; overflow: hidden; }
.iw-lane > h3 { padding: 6px 10px; font-size: 1em; }
.iw-lane-side { display: flex; flex-direction: column; gap: 6px; min-height: 0; padding: 8px 10px; }
.iw-lane-side.side-0 { background: var(--brand-tint); }
.iw-lane-side.side-1 { background: var(--coral-tint); }
.iw-lane-side h4 { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 4px 8px; font-size: .95em; }
.iw-lane-side h4 strong { font-size: 1.6em; }
.iw-power-cards { display: flex; flex-wrap: wrap; gap: 6px; }
.iw-world .iw-power-cards .iw-button { min-width: 52px; padding: 4px 8px; }
.iw-owner { padding: 6px 10px; font-size: .9em; font-weight: 700; }
.iw-team { display: flex; align-items: center; gap: 6px; min-width: 0; overflow-wrap: anywhere; }
.iw-creature { display: block; flex-shrink: 0; width: 30px; height: 26px; }
.iw-toolbox > h3 { font-size: 1.05em; }
.iw-actions .iw-button small { display: inline; font-size: .85em; }
.iw-move { display: grid; grid-template-columns: 1.4fr 1fr 1fr; }
.iw-move .iw-button { min-width: 0; padding-inline: 8px; }
.iw-world:is([data-world-game="cursed-cards"], [data-world-game="number-siege"]) .iw-stage { grid-template-columns: minmax(0, 1.25fr) minmax(360px, 1fr); }
/* Two-player matches: the scoreboard row above takes some height, so the side panel gets half the width (the hand fits one row) and packs a little closer. */
#arenaDialog:has([data-referee-player]) .iw-panel { gap: 6px; }
@media (min-width: 681px) and (min-height: 501px) {
  #arenaDialog:has([data-referee-player]) .iw-world:is([data-world-game="cursed-cards"], [data-world-game="number-siege"]) .iw-stage { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  #arenaDialog:has([data-referee-player]) .iw-world:is([data-world-game="cursed-cards"], [data-world-game="number-siege"]) .iw-toolbox { gap: 8px; padding: 8px 12px; }
  #arenaDialog:has([data-referee-player]) .iw-world .iw-hand .iw-button { min-height: 52px; }
}

.iw-islands { flex: 1 1 0; min-height: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(104px, 1fr)); align-content: center; gap: 14px; padding: 14px; border-radius: 18px; background: var(--apricot-soft); }
.iw-world .iw-islands .iw-button { display: grid; align-content: center; gap: 2px; min-height: min(150px, 40cqh); border: 2px solid var(--line-strong); border-radius: 36% 38% 32% 35%; }
.iw-islands .iw-button strong { font-size: 2em; line-height: 1.1; }
.iw-islands .iw-button span { font-size: 14px; font-weight: 700; }
.iw-world .iw-islands [data-owner="0"] { border-color: var(--player-a); background: var(--brand-tint); }
.iw-world .iw-islands [data-owner="1"] { border-color: var(--player-b); background: var(--coral-tint); }
.iw-world .iw-islands [data-owner="neutral"] { background: var(--surface); }

/* ---------- Ayna Makinesi (mirror-machine) ---------- */
.iw-machine-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 16px; }
.iw-machine-head h3 small { font-size: .7em; font-weight: 600; }
.iw-robot { display: grid; padding: 6px 18px; border: 3px solid var(--player-a); border-radius: 14px 14px 4px 4px; background: var(--brand-tint); text-align: center; }
.iw-robot::before { content: ""; display: block; width: 40px; height: 12px; margin: 0 auto 4px; background: radial-gradient(circle at 8px 6px, #0b1b33 0 5px, transparent 5.5px), radial-gradient(circle at 32px 6px, #0b1b33 0 5px, transparent 5.5px); }
.iw-robot strong { font-size: 1.6em; }
.iw-conveyor { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 10px; border-bottom: 8px dashed var(--line-strong); border-radius: 14px; background: var(--surface-3); }
.iw-slot { display: grid; place-items: center; min-width: 92px; min-height: 56px; border: 2px dashed var(--line-strong); border-radius: 10px; }
.iw-trace { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.iw-trace > span:not([aria-hidden]) { display: grid; padding: 4px 12px; border: 1px solid var(--line-strong); border-radius: 10px; background: var(--violet-soft); text-align: center; }
.iw-trace strong { font-size: 1.4em; }
.iw-trace small { font-size: 12px; }
.iw-modules { display: grid; grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); }
.iw-modules .iw-button { min-width: 0; }
.iw-pattern { align-self: center; font-size: 1.15em; }
.iw-world[data-world-game="mirror-machine"] .iw-stage { grid-template-columns: minmax(0, 1.5fr) minmax(300px, 1fr); }

/* ---------- Sıfır Curling (zero-curling) ---------- */
.iw-board > .iw-numberline:first-child { margin-top: auto; }
.iw-puck-values { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: auto; }
.iw-puck-values section { padding: 10px 14px; border-radius: 12px; }
.iw-puck-values .side-0 { background: var(--brand-tint); }
.iw-puck-values .side-1 { background: var(--coral-tint); }
.iw-puck-values strong { font-size: 2em; }
.iw-puck-values p { font-size: .85em; }

/* ---------- Adventures: shared pieces ---------- */
.ad-room, .ad-robot, .ad-device, .ad-track, .ad-sandbox, .ad-vehicle { min-width: 0; padding: 10px 12px; border: 2px solid var(--line-strong); border-radius: 14px; background: var(--surface); }
.ad-prediction { display: grid; gap: 4px; min-width: 0; margin: 0; padding: 0; border: 0; font-weight: 700; }
.ad-prediction legend { margin-bottom: 4px; font-size: .85em; }
.ad-prediction > div { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
.ad-prediction .iw-button { min-width: 0; padding: 4px; }
.ad-prediction .iw-button.is-selected { border-color: #8d5c00; background: #f9b115; color: #1f2735; box-shadow: 0 0 0 3px rgba(249, 177, 21, .22); }
.ad-last-plan, .ad-predict-prompt { padding: 8px 10px; border-radius: 10px; background: var(--brand-tint); font-weight: 700; font-size: .9em; }
.ad-command-hand { display: grid; grid-template-columns: repeat(auto-fill, minmax(64px, 1fr)); gap: 6px; }
.ad-command-hand .iw-button { min-width: 0; }

/* Termal Kriz and Soğuk Zincir: the shared command box, then three rooms side by side. */
.ad-station-grid { flex: 1 1 0; min-height: 0; display: grid; grid-template-columns: minmax(0, 1fr) minmax(260px, 330px); gap: 12px; }
.ad-station-grid > .iw-toolbox { grid-column: 2; grid-row: 1; align-self: start; }
.ad-rooms { grid-column: 1; grid-row: 1; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; min-height: 0; }
.ad-room { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-content: space-between; gap: 8px; }
.ad-room > h4 { grid-column: 1 / -1; }
.ad-thermometer { grid-column: 2; grid-row: 2; width: 44px; height: 110px; fill: currentColor; }
.ad-facts { grid-column: 1; grid-row: 2; display: grid; align-content: center; gap: 6px; margin: 0; }
.ad-facts > div { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 0 6px; }
.ad-facts dt { color: var(--ink-soft); font-size: .85em; }
.ad-facts dd { margin: 0; font-weight: 800; }
.ad-room > :is(.iw-preview, .ad-assign-controls, .ad-prediction) { grid-column: 1 / -1; }
.ad-room .iw-preview { padding: 6px 10px; font-size: .95em; }
.ad-assign-controls { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 6px; }
.ad-assign-controls .iw-button { min-width: 0; padding: 6px 10px; }
.ad-station-grid .ad-command-hand { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ad-station-grid .ad-command-hand .iw-button { padding-inline: 4px; }
.ad-station-grid .ad-command-hand strong { font-size: 1.1em; white-space: nowrap; }
/* "Kaldır (+4)" cards: the verb sits on its own small line where the cards are narrow. */
.ad-cancel-verb { font-weight: 650; }

/* Tren Makası: four tracks stacked, each with its own buttons. */
.ad-yard { flex: 1 1 0; min-height: 0; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); grid-template-rows: auto auto 1fr; gap: 10px; }
.ad-arrival, .ad-departure { grid-column: 1 / -1; }
.ad-track { display: flex; flex-direction: column; gap: 6px; padding-block: 8px; }
.ad-track h4 { font-size: .95em; }
.ad-wagons { display: flex; flex-wrap: wrap; gap: 10px 12px; min-height: 64px; padding: 6px 4px 16px; border-radius: 8px; background: linear-gradient(to bottom, transparent 70%, #6f7788 71% 74%, transparent 75% 80%, #6f7788 81% 84%, transparent 85%); }
.ad-wagon { position: relative; display: grid; place-items: center; min-width: 58px; height: 44px; border: 2px solid var(--line-strong); border-radius: 8px; background: var(--brand-tint); font-size: 22px; }
.ad-wagon::before, .ad-wagon::after { content: ""; position: absolute; bottom: -9px; width: 13px; height: 13px; border-radius: 50%; background: #0b1b33; }
.ad-wagon::before { left: 8px; }
.ad-wagon::after { right: 8px; }
.ad-wagon.is-exposed { border: 3px solid var(--player-a); }
.ad-departure { background: var(--apricot-soft); }
.ad-track .iw-controls .iw-button, .ad-holding > .iw-button { align-self: flex-start; }

/* Kasa Kilitleri: the locks and the sandbox on the board, the tiles beside it. */
.ad-locks { display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: 10px; }
.iw-world .ad-locks .iw-button { display: grid; gap: 2px; min-height: 84px; }
.ad-locks strong { font-size: 1.9em; }
.ad-sandbox { display: flex; flex-direction: column; gap: 8px; background: var(--surface-2); }
.ad-tiles { justify-content: center; }
.ad-tiles .iw-hand .iw-button { min-width: 64px; min-height: 52px; padding: 4px 8px; }

/* Kutup Trafiği: the harbour (line and docks) on the board, the vehicles beside it. */
.ad-harbour { flex: 1 1 0; min-height: 0; display: flex; flex-direction: column; justify-content: center; gap: 8px; padding: 10px 12px; border-radius: 18px; background: var(--apricot-soft); }
.ad-docking-line { display: block; width: 100%; height: auto; fill: currentColor; }
.ad-docking-line text { font-size: 20px; font-weight: 700; }
.ad-docks { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }
.ad-docks .iw-button { display: grid; gap: 2px; min-width: 90px; }
.ad-docks strong { font-size: 1.5em; }
.ad-harbour.is-vertical { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: stretch; }
.ad-harbour.is-vertical .ad-docking-line { width: auto; height: 100%; max-height: 100cqh; }
.ad-harbour.is-vertical .ad-docks { flex-direction: column; flex-wrap: nowrap; justify-content: space-around; }
.ad-vehicles { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.ad-vehicle { display: flex; flex-direction: column; gap: 6px; padding: 6px; }
.ad-vehicle.is-docked { border-color: #087a6d; }
.ad-vehicle > .iw-button:first-child { display: grid; gap: 2px; width: 100%; text-align: left; }
.ad-vehicle .iw-button span { font-size: .9em; }

/* İşaret Tamircisi */
.ad-robot-progress { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.ad-robot-progress span { padding: 8px; border: 2px solid var(--line-strong); border-radius: 999px; font-weight: 750; text-align: center; }
.ad-robot-progress .is-active { border-color: var(--player-a); background: var(--brand-tint); }
.ad-robot-progress .is-complete { border-color: #087a6d; background: var(--green-tint); color: var(--green-ink); }
.ad-robot--focus { display: flex; flex: 1 1 0; flex-direction: column; justify-content: center; gap: 10px; min-height: 0; }
.ad-order { font-weight: 800; }

/* Zaman Kumandası: the device picker, then the focused device with a two-row pattern strip. */
.ad-device-picker { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.ad-device-picker .iw-button { display: grid; justify-content: start; gap: 2px; min-width: 0; text-align: left; }
.ad-device-picker .iw-button strong { font-size: 1.1em; }
.ad-device-picker .iw-button :is(span, small) { display: block; }
.ad-device--focus { display: flex; flex-direction: column; gap: 8px; }
.ad-pattern { width: 100%; table-layout: fixed; text-align: center; }
.ad-pattern th { width: 9em; text-align: left; font-size: .85em; }

/* Kutup Radarı: one tappable scale where 25 targets fit, a stepper elsewhere; the scan log scrolls inside its box.
   On the smartboard the scale takes the full width and the scans sit in a row under it. */
.iw-world[data-world-game="polar-radar"] .iw-stage { grid-template-columns: minmax(0, 1fr); grid-template-rows: minmax(0, 1fr) minmax(0, auto); }
.iw-world[data-world-game="polar-radar"] .iw-panel { min-height: 140px; }
.ad-scans { display: grid; grid-template-columns: auto auto minmax(0, 1fr); align-items: start; }
.ad-scans > .iw-controls { flex-direction: column; align-items: stretch; }
.ad-radar-scale { display: grid; gap: 6px; }
.ad-radar-station { font-weight: 700; text-align: center; }
.ad-radar-line { display: grid; grid-template-columns: repeat(25, minmax(0, 1fr)); gap: 3px; padding: 8px; border-radius: 14px; background: var(--violet-soft); }
.iw-world .ad-radar-line .iw-button { min-width: 0; min-height: 56px; padding: 2px 0; font-size: 14px; }
.ad-radar-line .iw-button strong { font-size: 15px; }
.ad-radar-line .iw-button.is-zero { border-width: 2px; border-color: var(--primary); }
.ad-radar-line .iw-button.is-target { box-shadow: 0 0 0 3px var(--gold); }
.ad-radar-stepper { display: none; grid-template-columns: 64px minmax(0, 1fr) 64px; gap: 8px; align-items: center; }
.ad-radar-stepper output { display: grid; justify-items: center; }
.ad-radar-stepper output strong { font-size: 2em; line-height: 1; }
.ad-radar-stepper > .iw-button:last-child { grid-column: 1 / -1; }
/* With the stepper, a read-only strip of the 25 positions keeps the marked candidates and the current one in view. */
.ad-radar-mini { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(25, minmax(0, 1fr)); padding: 8px 6px 6px; border-radius: 12px; background: var(--violet-soft); }
.ad-radar-mini span { display: grid; justify-items: center; gap: 3px; min-height: 30px; font-size: 12px; font-weight: 700; white-space: nowrap; }
.ad-radar-mini span::before { content: ""; width: 10px; height: 10px; border: 2px solid var(--line-strong); border-radius: 50%; background: var(--surface); }
.ad-radar-mini .is-zero::before { border-color: var(--primary); }
.ad-radar-mini .is-marked::before { border-color: #8d5c00; background: #f9b115; }
.ad-radar-mini .is-current::before { box-shadow: 0 0 0 2px var(--surface), 0 0 0 4px var(--primary); }
@container iw-board (max-width: 640px) {
  .ad-radar-line { display: none; }
  .ad-radar-stepper { display: grid; }
}
.ad-scans { flex: 1 1 0; min-height: 0; }
.ad-scans > .ad-scan-log { align-self: stretch; }
.ad-side-scan { display: grid; gap: 6px; }
.ad-side-scan .form-field { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 8px; margin: 0; }
.ad-side-scan select { min-height: 44px; }
.ad-scan-log { flex: 1 1 0; min-height: 3em; margin: 0; padding: 6px 10px 6px 2.2em; overflow: auto; border: 1px solid var(--line); border-radius: 10px; background: var(--surface-soft); font-size: .9em; }
.ad-scan-log li + li { margin-top: 4px; }

/* Buz Köprüsü */
.ad-bridge-status { font-size: 1.05em; }
.ad-bridge-status strong { font-size: 1.2em; }
.ad-bridge-route { padding: 10px 14px; border-radius: 12px; background: var(--surface-2); font-size: 1.3em; font-weight: 700; overflow-wrap: anywhere; }

/* ---------- Large text and high contrast ---------- */
body.large-text .iw-world { font-size: clamp(17px, 1.5vw, 22px); }
body.large-text .iw-toolbox { gap: 8px; padding: 8px 12px; }
body.large-text .ad-track { gap: 4px; }
body.large-text .ad-cancel-note { display: none; }
body.large-text .ad-assign-controls { grid-template-columns: minmax(0, 1fr); }
body.large-text .iw-hand .iw-button:has(small) { display: flex; flex-direction: column; align-items: center; min-width: 108px; max-width: 100%; }
body.large-text .iw-hand .iw-button small { max-width: 100%; overflow-wrap: anywhere; white-space: normal; }
/* Large text keeps the phone compactions where the bigger type would push the screen past the fold. */
body.large-text .iw-world .ad-tiles .iw-hand .iw-button { min-width: 0; min-height: 48px; padding: 2px 6px; }
body.large-text .ad-tiles .iw-hand .iw-button small { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
body.large-text .iw-world .ad-docks .iw-button { display: flex; align-items: center; gap: 8px; min-height: 48px; padding: 2px 10px; }
body.large-text .ad-station-grid .ad-command-hand strong { font-size: 1em; white-space: normal; }
body.high-contrast .iw-world .iw-button { border-color: currentColor; }
body.high-contrast :is(.ad-room, .ad-robot, .ad-device, .ad-track, .ad-sandbox, .ad-vehicle, .ad-harbour, .ad-radar-line, .ad-radar-mini, .ad-bridge-route) { border-color: #000; background: #fff; color: #000; }
@media (prefers-reduced-motion: reduce) { .iw-help-body, .iw-cancellation .iw-unit { animation: none; } .iw-cancellation .iw-unit { text-decoration: line-through; } }
body.reduced-motion :is(.iw-help-body, .iw-unit) { animation: none; }
body.reduced-motion .iw-unit { text-decoration: line-through; }

/* ---------- Phones (portrait and short landscape) ---------- */
@media (max-width: 680px), (orientation: landscape) and (max-height: 500px) {
  /* Kasa Kilitleri: the tile ids stay in each tile's accessible name only. */
  .iw-world .ad-tiles .iw-hand .iw-button { min-height: 44px; padding: 2px 6px; }
  .ad-tiles h4, .ad-sandbox h4 { font-size: 13px; }
  .ad-tiles .iw-hand { gap: 3px; }
  .ad-tiles .iw-hand .iw-button small { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .iw-world .ad-locks .iw-button { min-height: 56px; }
  /* Kutup Trafiği: each dock is one line. */
  .ad-harbour { padding: 6px 8px; gap: 6px; }
  .ad-docks { gap: 4px; }
  .iw-world .ad-docks .iw-button { display: flex; align-items: center; gap: 8px; min-height: 44px; padding: 2px 10px; }
  .ad-docks strong { font-size: 1.3em; }
  /* In a two-player match the scoreboard takes the room of the first-move tip; the rules stay under "?". */
  #arenaDialog:has([data-referee-player]) :is(.iw-turn, .iw-hint) { display: none; }
  /* Ayna Motoru: a smaller robot and the slots of the line in one row. */
  .iw-placeholder { padding-block: 6px; }
  .iw-robot { grid-auto-flow: column; align-items: center; gap: 6px; padding: 2px 10px; }
  .iw-robot::before { width: 34px; margin: 0; }
  .iw-robot strong { font-size: 1.35em; }
  .iw-conveyor { flex-wrap: nowrap; gap: 4px; padding: 6px; border-bottom-width: 6px; }
  .iw-conveyor > :not([aria-hidden]) { flex: 1 1 0; min-width: 0; }
  .iw-slot { min-height: 44px; }
  /* Sayı Kuşatması: islands in rows of three, as tall as their content. */
  .iw-islands { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; padding: 6px; }
  .iw-world .iw-islands .iw-button { gap: 0; min-height: 56px; padding: 4px 2px; line-height: 1.15; }
  .iw-islands .iw-button strong { font-size: 1.6em; }
  .iw-islands .iw-button small { font-size: 11px; white-space: nowrap; }
  .iw-islands .iw-button span { font-size: 13px; }
}

/* ---------- Portrait phone: the board on top takes what the controls leave ---------- */
@media (max-width: 680px) {
  #arenaDialog[data-arena-layout~="card"] > #arenaBody > #arenaPlay.iw-world { gap: 8px; padding: 10px 8px; }
  .iw-world { font-size: 16px; }
  .iw-goal { font-size: 18px; }
  .iw-head { align-items: flex-start; }
  .iw-chip { min-height: 30px; padding: 3px 10px; font-size: 14px; }
  .iw-help-body { width: 100%; }
  .iw-chips { justify-content: flex-start; }
  /* The help opener shrinks to its "?" so the chips and it share one row; the summary text stays its accessible name. */
  .iw-help > summary { justify-content: center; width: 44px; padding: 0; font-size: 0; }
  .iw-help > summary::before { width: 28px; height: 28px; margin: 0; font-size: 17px; }
  .iw-world .iw-stage, .iw-world:is([data-world-game]) .iw-stage { grid-template-columns: minmax(0, 1fr); grid-template-rows: minmax(0, 1fr) auto; gap: 10px; }
  .iw-stage.is-single { grid-template-rows: minmax(0, 1fr); }
  .iw-panel { justify-content: flex-start; gap: 8px; }
  .iw-toolbox { padding: 8px; gap: 8px; }
  .iw-world .iw-button { padding: 6px 10px; }
  /* Sıfır Reaktörü: the grid keeps 48 px cells by taking tighter gaps, and the energy and the next stones share one row. */
  .iw-reactor { gap: 4px; padding: 6px; }
  .iw-reactor-status { flex-wrap: nowrap; gap: 8px; }
  .iw-energy strong { font-size: 1.4em; }
  .iw-incoming { gap: 6px; padding: 4px 8px; }
  .iw-incoming strong { padding: 1px 8px; font-size: 1.2em; }
  .iw-world[data-world-game="zero-reactor"] .iw-panel { gap: 6px; }
  .iw-world[data-world-game="zero-reactor"] :is(.iw-hint, .iw-preview) { padding-block: 4px; }
  .iw-world[data-world-game="zero-reactor"] .uk-btn { --uk-size: 48px; }
  .iw-world:not([data-world-game="mirror-machine"]) .iw-hand { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 6px; }
  .iw-world .iw-hand .iw-button { width: 100%; min-width: 0; min-height: 52px; padding: 4px 2px; }
  .iw-hint { font-size: 14px; }
  /* Sıfır Soygunu: the tall building beside the controls, so every floor keeps a readable row. */
  .iw-world[data-world-game="zero-heist"] .iw-stage { grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); grid-template-rows: minmax(0, 1fr); }
  .iw-world[data-world-game="zero-heist"] .iw-hand { grid-template-columns: repeat(auto-fill, minmax(44px, 1fr)); }
  .iw-floor { grid-template-columns: 2.4em 1fr; gap: 4px; padding: 0 6px; }
  .iw-world .iw-building--pick .iw-floor { padding: 0 6px; }
  .iw-route { display: none; }
  .iw-lanes { gap: 6px; }
  .iw-lane > h3 { padding: 4px 8px; font-size: 14px; }
  .iw-lane-side { padding: 4px; }
  .iw-lane-side h4 { flex-wrap: nowrap; font-size: 14px; }
  .iw-lane-side h4 strong { flex: none; font-size: 1.35em; }
  .iw-team { min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
  .iw-world .iw-power-cards .iw-button { min-width: 44px; padding: 4px; }
  .iw-world .iw-lane-side > .iw-button { min-width: 0; padding: 2px 4px; font-size: 14px; line-height: 1.15; }
  .iw-world[data-world-game="cursed-cards"] :is(.iw-toolbox > h3, .iw-owner) { display: none; }
  /* Lanetli Kartlar and Sayı Kuşatması: the toolbox drops its frame so a hand of eight fits one row (Sıfır Curling's too). */
  .iw-world:is([data-world-game="cursed-cards"], [data-world-game="number-siege"]) .iw-toolbox { padding: 0; border: 0; }
  .iw-world:is([data-world-game="cursed-cards"], [data-world-game="number-siege"], [data-world-game="zero-curling"]) .iw-hand { grid-template-columns: repeat(auto-fill, minmax(40px, 1fr)); gap: 2px; }
  .iw-world:is([data-world-game="cursed-cards"], [data-world-game="number-siege"], [data-world-game="zero-curling"]) .iw-hand .iw-button { min-height: 48px; }
  /* Sıfır Curling: slimmer disk cards; a long team name ends in an ellipsis. */
  .iw-puck-values { gap: 6px; }
  .iw-puck-values section { min-width: 0; padding: 4px 8px; }
  .iw-puck-values h4 { overflow: hidden; font-size: 14px; white-space: nowrap; text-overflow: ellipsis; }
  .iw-puck-values strong { font-size: 1.6em; }
  .iw-move { display: flex; gap: 6px; }
  .iw-world .iw-move .iw-button { flex: 1 1 auto; padding-inline: 6px; font-size: 15px; white-space: nowrap; }
  .iw-creature { display: none; }
  .iw-move { grid-template-columns: 1fr 1fr 1fr; }
  /* Stations: the command box on top, then three narrow rooms; each fact keeps one line and the legend is spoken only. */
  .ad-station-grid { grid-template-columns: minmax(0, 1fr); grid-template-rows: auto minmax(0, 1fr); gap: 8px; }
  .ad-station-grid > .iw-toolbox { grid-column: 1; grid-row: 1; padding: 0; border: 0; }
  .ad-station-grid .iw-toolbox .iw-meta { font-size: 12px; }
  .ad-station-grid .ad-command-hand { grid-template-columns: repeat(auto-fill, minmax(56px, 1fr)); }
  .ad-station-grid .ad-command-hand strong { font-size: 1.15em; }
  .ad-cancel-verb { display: block; font-size: 12px; }
  .ad-cancel-note { display: none; }
  .ad-rooms { grid-column: 1; grid-row: 2; gap: 4px; }
  .ad-room { grid-template-columns: minmax(0, 1fr); align-content: start; gap: 4px; padding: 6px 5px; font-size: 14px; }
  .ad-thermometer { display: none; }
  .ad-facts, .ad-room > * { grid-column: 1; grid-row: auto; }
  /* A fact's label yields (it may wrap) so its value never drops to a line of its own. */
  .ad-facts { gap: 2px; }
  .ad-facts > div { flex-wrap: nowrap; align-items: baseline; gap: 4px; }
  .ad-facts dt { flex: 1 1 auto; font-size: 12px; line-height: 1.15; }
  .ad-facts dd { flex: 0 1 auto; text-align: right; line-height: 1.2; }
  .ad-room .iw-preview { padding: 4px 6px; font-size: 13px; }
  .ad-assign-controls { grid-template-columns: minmax(0, 1fr); gap: 4px; }
  .ad-assign-controls .iw-button { padding: 4px; }
  .ad-prediction legend { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .ad-prediction > div { gap: 3px; }
  .iw-world .ad-prediction .iw-button { padding: 2px 0; }
  /* Tren Makası: smaller wagons, the three arrival buttons in one row. */
  .ad-yard { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 8px; }
  .ad-track { gap: 6px; padding: 8px; }
  .ad-track h4 { font-size: 14px; }
  .ad-wagons { gap: 8px 10px; min-height: 50px; padding: 4px 2px 14px; }
  .ad-wagon { min-width: 46px; height: 36px; font-size: 18px; }
  .ad-arrival .iw-controls { display: grid; grid-template-columns: 1.3fr 1fr 1fr; gap: 6px; }
  .ad-arrival .iw-controls .iw-button { min-width: 0; padding: 4px 6px; font-size: 14px; line-height: 1.15; }
  .ad-holding > .iw-button { align-self: stretch; padding: 4px 6px; font-size: 14px; }
  /* Kutup Radarı: the two scan columns side by side, the log under them. */
  .ad-scans { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); grid-template-rows: auto minmax(2.6em, 1fr); }
  .ad-scans > .ad-scan-log { grid-column: 1 / -1; }
  .ad-side-scan .form-field { grid-template-columns: minmax(0, 1fr) auto; font-size: 13px; }
  .ad-scans .iw-button { padding: 4px 6px; font-size: 14px; line-height: 1.2; }
  .ad-robot-progress { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  /* Kasa Kilitleri: three locks in one row, a slimmer sandbox, eight number tiles in one row. */
  .ad-locks { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
  .iw-world .ad-locks .iw-button { padding: 4px; }
  .ad-locks strong { font-size: 1.5em; }
  .ad-sandbox { gap: 6px; padding: 8px; }
  .ad-sandbox .iw-conveyor { padding: 6px; border-bottom-width: 4px; }
  .iw-world .ad-tiles .iw-hand { grid-template-columns: repeat(auto-fill, minmax(42px, 1fr)); }
  /* Kutup Trafiği: the vehicle cards in smaller type so the harbour keeps its height. */
  .ad-vehicles { gap: 6px; }
  .ad-vehicle { padding: 4px; font-size: 14px; }
  /* Zaman Kumandası: the three devices side by side. */
  .ad-device-picker { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px; }
  .iw-world .ad-device-picker .iw-button { padding: 4px 6px; font-size: 14px; }
  .ad-device-picker .iw-button small { font-size: 11px; }
  /* Stations: lower command cards. */
  .iw-world .ad-station-grid .ad-command-hand .iw-button { min-height: 48px; padding: 2px; line-height: 1.1; }
  /* Kutup Radarı: the scans take their own height; the board keeps what is left. */
  .ad-scans { flex: none; }
  /* Sayı Kuşatması: islands in rows of three, sized to their content. */
}

/* ---------- Short landscape phone: board and controls side by side in about 300 px of height ---------- */
@media (orientation: landscape) and (max-height: 500px) {
  #arenaDialog[data-arena-layout~="card"] > #arenaBody > #arenaPlay.iw-world { gap: 6px; padding: 8px 10px; }
  .iw-world { font-size: 14px; }
  .iw-goal { font-size: 16px; }
  .iw-chip { min-height: 28px; padding: 2px 8px; font-size: 13px; }
  .iw-help > summary { min-height: 36px; padding: 4px 10px; font-size: 13px; }
  .iw-help-body { max-height: 70vh; }
  .iw-stage:not(.is-single), .iw-world[data-world-game] .iw-stage:not(.is-single) { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); grid-template-rows: minmax(0, 1fr); gap: 10px; }
  .iw-board, .iw-panel { gap: 6px; }
  /* Kutup Radarı's board and Sıfır Reaktörü's panel stack six rows of 44 px controls and text: tighter gaps fit them. */
  .iw-world[data-world-game="polar-radar"] .iw-board,
  .iw-world[data-world-game="zero-reactor"] .iw-panel { gap: 4px; }
  .iw-toolbox { padding: 6px 8px; gap: 6px; }
  .iw-world .iw-button { min-height: 44px; padding: 4px 8px; }
  .iw-world .uk-btn { --uk-size: 44px; }
  .iw-hand { gap: 4px; }
  .iw-world .iw-hand .iw-button { min-width: 44px; min-height: 44px; padding: 2px 6px; }
  .iw-hint, .iw-meta { font-size: 13px; }
  .iw-hint { padding: 4px 8px; }
  .iw-preview { padding: 4px 10px; }
  .iw-predict > p { display: none; }
  .iw-lane-side { padding: 4px 6px; gap: 4px; }
  .iw-lane > h3, .iw-owner { padding: 2px 8px; font-size: 13px; }
  /* Lanetli Kartlar: a side's cards sit in one row and its name and total in one line, so both sides fit the short board;
     the lead line goes, as on portrait phones, since the two totals already show it. Next to the two-player scoreboard
     the lanes take a little more width and the move buttons may wrap. */
  .iw-lane-side h4 { flex-wrap: nowrap; }
  .iw-lane-side h4 strong { flex: none; font-size: 1.3em; }
  .iw-team { min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
  .iw-power-cards { gap: 3px; }
  .iw-world .iw-lane-side .iw-power-cards .iw-button { flex: 1 1 36px; min-width: 36px; padding: 2px; }
  .iw-world .iw-lane-side > .iw-button { padding: 2px 4px; font-size: 12px; line-height: 1.1; }
  .iw-world[data-world-game="cursed-cards"] .iw-owner { display: none; }
  #arenaDialog:has([data-referee-player]) .iw-world[data-world-game="cursed-cards"] .iw-stage:not(.is-single) { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); }
  #arenaDialog:has([data-referee-player]) .iw-world .iw-move .iw-button { white-space: normal; line-height: 1.1; }
  /* Sıfır Soygunu: the nineteen floors of the building fit its height only with one-line text. */
  body:not(.large-text) .iw-world .iw-building--pick :is(.iw-floor, .iw-floor strong) { font-size: 12px; line-height: 1; }
  /* Sıfır Soygunu with large text: floors never shrink below their text; the board scrolls instead of floors overlapping. */
  body.large-text .iw-building { flex: 1 0 auto; grid-template-rows: repeat(var(--iw-floors), minmax(min-content, 1fr)); }
  .iw-creature { display: none; }
  .iw-world .iw-power-cards .iw-button { min-width: 44px; }
  .iw-concept-prompt { padding: 6px 10px; font-size: 16px; }
  .iw-world:is([data-world-game="cursed-cards"], [data-world-game="number-siege"]) .iw-toolbox > h3 { display: none; }
  .iw-world:is([data-world-game="cursed-cards"], [data-world-game="number-siege"], [data-world-game="zero-curling"]) .iw-toolbox { padding: 0; border: 0; }
  .iw-world:is([data-world-game="cursed-cards"], [data-world-game="number-siege"]) .iw-hand { gap: 3px; }
  .iw-world .iw-move .iw-button { white-space: nowrap; }
  /* Stations: the command box at the left, three rooms filling the rest. */
  .ad-station-grid { grid-template-columns: minmax(220px, 260px) minmax(0, 1fr); gap: 8px; }
  .ad-station-grid > .iw-toolbox { grid-column: 1; }
  .ad-rooms { grid-column: 2; gap: 6px; }
  .ad-station-grid .ad-command-hand { grid-template-columns: repeat(auto-fill, minmax(44px, 1fr)); gap: 3px; }
  .iw-world .ad-station-grid .ad-command-hand .iw-button { padding: 2px; line-height: 1.1; }
  .ad-cancel-verb { display: block; font-size: 11px; }
  .ad-cancel-note { display: none; }
  .ad-room { grid-template-columns: minmax(0, 1fr); align-content: start; padding: 4px 8px; gap: 3px; }
  .ad-room > * { grid-column: 1; grid-row: auto; }
  .ad-thermometer { display: none; }
  .ad-facts { gap: 0; }
  .ad-facts dt { font-size: 12px; }
  .ad-room .iw-preview { padding: 2px 8px; font-size: 13px; }
  .ad-prediction legend { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .ad-radar-mini { padding: 4px 6px 2px; }
  .ad-radar-mini span { min-height: 26px; line-height: 1.2; }
  .ad-radar-stepper { gap: 6px; }
  /* Tren Makası: arrival and departure on the left, the two holding tracks on the right. */
  .ad-yard { grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); grid-template-rows: minmax(0, 1fr) minmax(0, 1fr); gap: 6px; }
  .ad-arrival, .ad-departure { grid-column: 1; }
  .ad-departure { grid-row: 2; }
  .ad-holding { grid-column: 2; }
  .ad-track { gap: 4px; padding: 4px 8px; }
  .ad-track h4 { font-size: 13px; }
  .ad-wagons { gap: 6px 8px; min-height: 46px; padding: 2px 2px 12px; }
  .ad-wagon { min-width: 44px; height: 32px; font-size: 17px; }
  .ad-wagon::before, .ad-wagon::after { width: 11px; height: 11px; bottom: -8px; }
  .ad-track .iw-controls { flex-wrap: nowrap; gap: 4px; }
  .ad-track .iw-controls .iw-button { padding: 2px 6px; font-size: 13px; white-space: nowrap; }
  .ad-holding > .iw-button { font-size: 13px; }
}