/* Keep physical pixel density separate from the available CSS viewport. */
#creditsPage .skill-domain-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-template-rows: repeat(3, minmax(64px, 1fr));
  gap: clamp(8px, 2vmin, 24px);
  height: auto;
  flex: 1;
  min-height: 216px;
}
#creditsPage .skill-domain-browser {
  display: flex;
  flex-direction: column;
  gap: 12px;
  overflow-y: auto;
  overscroll-behavior: contain;
  min-height: 0;
  box-sizing: border-box;
}
#creditsPage .skill-domain-browser[hidden] { display: none; }
#creditsPage .skill-domain-card {
  min-height: 64px;
  padding: clamp(8px, 1.4vmin, 20px);
}
#creditsPage .skill-domain-card strong {
  white-space: normal;
  overflow-wrap: anywhere;
  font-size: clamp(14px, 1.4vw, 24px);
  line-height: 1.15;
}
#creditsPage .skill-domain-card small { font-size: clamp(11px, 1vw, 16px); }
#creditsPage .skill-domain-card em { position: static; font-size: 10px; }
#creditsPage .skill-domain-pagination { flex-shrink: 0; height: 48px; }
#creditsPage .skill-domain-pagination button { min-width: 48px; min-height: 48px; touch-action: manipulation; }
.skill-tree-header { min-width: 0; }
.skill-tree-header > div { min-width: 0; }
.skill-tree-header h2 { overflow-wrap: anywhere; }
.skill-detail-content { min-height: 0; overflow-y: auto; overscroll-behavior: contain; }
.skill-detail-actions button { min-height: 44px; touch-action: manipulation; }
@media (max-width: 480px) {
  .skill-tree-header { padding: 6px; gap: 6px; grid-template-columns: auto minmax(0,1fr) auto; }
  .skill-tree-header h2 { font-size: 20px; }
  .skill-tree-header small { font-size: 11px; }
  #creditsPage .skill-domain-browser { padding: 6px; gap: 6px; }
}
@media (max-height: 380px) {
  #creditsPage .skill-domain-browser { overflow-y: auto; }
  #creditsPage .skill-domain-grid { flex: none; }
}
/* Secondary dialogs must stay reachable with browser chrome or a keyboard open. */
.inventory-inspect-card, .inventory-drop-stack-card, .teleport-destination-card,
.training-master__shell, .exchange-window, .session-window, .ranking-window {
  max-width: calc(100vw - env(safe-area-inset-left, 0px) - env(safe-area-inset-right, 0px) - 16px);
  max-height: calc(100dvh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px) - 16px);
  box-sizing: border-box;
  overflow-y: auto;
  overscroll-behavior: contain;
}
@media (pointer: coarse) {
  .game-menu input, .game-menu select, .training-master input { font-size: max(16px, 1rem); }
}
#equipmentHandV39 { min-height: 44px; max-width: 100%; font-size: 16px; }
.combat-viewport { overflow: auto; touch-action: none; overscroll-behavior: contain; cursor: grab; }
.combat-graph { position: relative; display: block; padding: 0; min-width: 1400px; min-height: 1200px; }
.combat-graph::before { display: none; }
.combat-map-center { position: sticky; top: 8px; left: 8px; z-index: 3; min-height: 44px; color: #fff; background: #203d37; border: 1px solid #a5b9a8; padding: 8px 16px; }
.combat-tree-links { position: absolute; inset: 0; width: 1400px; height: 1200px; pointer-events: none; }
.combat-tree-links path { fill: none; stroke: #82908a; stroke-width: 3; }
.combat-tree-links path.is-ready { stroke: #e3c276; }
.combat-graph .combat-map-node.is-future { border-style: dashed; }
.combat-graph .combat-map-node {
  position: absolute; width: 248px; min-height: 88px; transform: translate(-50%, -50%);
  margin: 0; font-size: 16px; grid-column: auto; grid-row: auto;
}
@media (max-width: 600px), (max-height: 480px) {
  /* Scrolling is preferable to unreadable type or controls outside the screen. */
  .standard-menu-open > .game-menu-window > .menu-page:not([hidden]) {
    overflow-y: auto !important;
    overscroll-behavior: contain;
    min-height: 0 !important;
  }
  .game-menu-window button, .game-menu-window select,
  .training-master__shell button, .inventory-inspect-card button {
    min-height: 44px !important;
    font-size: max(12px, .85rem) !important;
    overflow-wrap: anywhere;
  }
  .game-menu-window input:not([type="range"]):not([type="checkbox"]) { min-height: 44px; font-size: 16px !important; }
  .inventory-inspect-actions { flex-wrap: wrap; }
  .inventory-inspect-actions > * { min-width: 0 !important; flex: 1 1 120px; }
}
#skillNodeMaster { min-height: 48px; padding: 10px 18px; width: 100%; max-width: 420px; margin: 8px 0; font: inherit; }

/* Explicit grid placement keeps the title out of the hidden Back column. */
#creditsPage.skill-tree-page:not([hidden]) { display:flex !important; flex-direction:column; min-height:0 !important; overflow:hidden !important; }
#creditsPage .skill-tree-header { position:relative; flex:0 0 auto; grid-template-columns:44px minmax(0,1fr) minmax(70px,auto); min-height:64px; box-sizing:border-box; }
#creditsPage .skill-tree-back { grid-column:1; grid-row:1; }
#creditsPage .skill-tree-header > div { grid-column:2; grid-row:1; text-align:center; }
#creditsPage .skill-tree-header > strong { grid-column:3; grid-row:1; }
#creditsPage .skill-tree-header h2 { overflow-wrap:normal; font-size:clamp(20px,3vmin,36px); line-height:1.2; }
#creditsPage .skill-tree-header small { max-width:100%; }
#creditsPage .skill-domain-browser,
#creditsPage .skill-tree-view { flex:1 1 0; height:auto; min-height:0; }
#creditsPage .skill-tree-view[hidden] { display:none !important; }
#creditsPage .skill-domain-grid { grid-template-rows:repeat(3,minmax(64px,1fr)); }
#creditsPage .combat-graph { margin:0; min-height:0; min-width:0; }
#creditsPage .combat-card { width:200px; min-height:108px; box-sizing:border-box; }
#creditsPage .combat-card small { line-height:1.3; }
#creditsPage .combat-card strong { white-space:normal; overflow-wrap:normal; }
#creditsPage .combat-card.is-future { border-style:dashed; }
#creditsPage .profession-viewport { scrollbar-width:none; }
#creditsPage .profession-viewport::-webkit-scrollbar { display:none; }
@media(max-height:480px) {
 #creditsPage .skill-tree-header { min-height:52px; padding:5px 8px; }
 #creditsPage .skill-domain-browser { gap:4px; padding:6px; }
 #creditsPage .skill-domain-grid { gap:6px; min-height:192px; }
 #creditsPage .skill-domain-pagination { height:44px; }
}