/* Playing on a phone uses a bounded board and dedicated controls. Desktop is unchanged. */
html[data-mobile-client=true] #screen #companion-chat:has(.companion-arcade:not([hidden])[data-playing=true]) {
  inset:8px auto auto 50%!important; width:min(760px,calc(100vw - 16px))!important;
  height:calc(100dvh - 16px)!important; max-width:calc(100vw - 16px)!important; max-height:calc(100dvh - 16px)!important;
  min-width:0; min-height:0; transform:translateX(-50%); margin:0; overflow:hidden;
}
html[data-mobile-client=true] #screen #companion-chat .companion-arcade .arcade-board { display:grid!important; place-items:center; min-width:0; min-height:0; }
html[data-mobile-client=true] #screen #companion-chat .companion-arcade .arcade-choices { grid-template-columns:1fr 1fr; gap:5px; }
html[data-mobile-client=true] #screen #companion-chat .companion-arcade .arcade-choices button:first-child { min-height:38px; font-size:12px; }
html[data-mobile-client=true] #screen #companion-chat .companion-arcade .arcade-options { gap:5px; margin:7px 0; }
html[data-mobile-client=true] #screen #companion-chat .companion-arcade .arcade-help { font-size:11px; margin:6px 0; }
html[data-mobile-client=true] #screen #companion-chat .companion-arcade[data-playing=true] {
  position:relative!important; display:grid!important; flex:1; min-width:0; min-height:0;
  grid-template-columns:minmax(0,1fr) 104px; grid-template-rows:32px minmax(0,1fr) 96px;
  align-content:stretch; align-items:stretch; gap:5px 8px; overflow:hidden; padding:6px 8px 8px!important;
}
html[data-mobile-client=true] #screen #companion-chat .companion-arcade[data-playing=true] :is(h3,.arcade-subtitle,.arcade-choices,.arcade-help,.arcade-ranking,.arcade-options label,.arcade-play) { display:none!important; }
html[data-mobile-client=true] #screen #companion-chat .companion-arcade[data-playing=true] .arcade-options {
  grid-column:2; grid-row:1; display:flex; align-items:center; justify-content:flex-end; margin:0; padding:0;
}
html[data-mobile-client=true] #screen #companion-chat .companion-arcade[data-playing=true] .arcade-options>button:not(:last-child) { display:none!important; }
html[data-mobile-client=true] #screen #companion-chat .companion-arcade[data-playing=true] .arcade-options>button:last-child { min-height:30px; padding:3px 7px; font-size:10px; white-space:nowrap; }
html[data-mobile-client=true] #screen #companion-chat .companion-arcade[data-playing=true] .arcade-hud {
  grid-column:1; grid-row:1; align-self:center; display:flex; justify-content:space-between; align-items:center;
  gap:3px 6px; flex-wrap:wrap; min-width:0; padding:0; font:10px/1.2 system-ui,sans-serif;
}
html[data-mobile-client=true] #screen #companion-chat .companion-arcade[data-playing=true] .arcade-hud>* { white-space:nowrap; }
html[data-mobile-client=true] #screen #companion-chat .companion-arcade[data-playing=true] .arcade-board {
  grid-column:1/-1; grid-row:2; width:100%; height:100%; min-height:0; overflow:hidden;
  background:#061c22; border:1px solid #91c7a94d; border-radius:9px; box-sizing:border-box;
}
html[data-mobile-client=true] #screen #companion-chat .companion-arcade[data-playing=true] canvas.companion-minigame {
  grid-column:auto!important; grid-row:auto!important; display:block; width:100%!important; height:100%!important;
  min-width:0!important; min-height:0!important; max-width:none!important; max-height:100%!important;
  aspect-ratio:auto!important; object-fit:contain; object-position:center; border:0!important; border-radius:0!important;
  margin:0!important; padding:0!important; touch-action:none; box-shadow:none;
}
html[data-mobile-client=true] #screen #companion-chat .companion-arcade[data-playing=true] .arcade-pad {
  position:static; grid-column:1/-1; grid-row:3; display:grid; align-self:center; justify-self:center;
  grid-template-columns:repeat(3,48px); grid-template-rows:repeat(2,42px); gap:4px; margin:0; padding:0; background:transparent;
}
html[data-mobile-client=true] #screen #companion-chat .companion-arcade[data-playing=true] .arcade-pad button { min-height:42px; min-width:44px; padding:0; font-size:24px; border-radius:9px!important; touch-action:none; }
html[data-mobile-client=true] #screen #companion-chat .companion-arcade[data-playing=true] .arcade-result:not(:empty) {
  position:absolute; left:10px; right:10px; bottom:8px; z-index:5; display:block; padding:6px 8px; margin:0;
  border-radius:6px; background:#05201de8; color:#ffe09b; font:11px/1.3 system-ui; pointer-events:none;
}
html[data-mobile-client=true] #screen #companion-chat .companion-arcade[data-playing=true]:is([data-game=catch],[data-game=memory]) { grid-template-rows:32px minmax(0,1fr); }
html[data-mobile-client=true] #screen #companion-chat .companion-arcade[data-game=memory] .arcade-board { display:none!important; }
html[data-mobile-client=true] #screen #companion-chat .companion-arcade[data-playing=true] .arcade-elements {
  grid-column:1/-1; grid-row:2; min-height:0; margin:0; gap:8px; grid-template-columns:1fr 1fr; grid-template-rows:1fr 1fr;
}
html[data-mobile-client=true] #screen #companion-chat .companion-arcade[data-playing=true] .arcade-elements button {
  min-height:44px; padding:8px; font:700 16px/1.3 system-ui; border-radius:12px!important; touch-action:manipulation;
}
html[data-mobile-client=true] #screen #companion-chat:has(.companion-arcade:not([hidden])[data-playing=true]) .companion-resize { display:none; }
html[data-mobile-client=true] #screen #companion-chat .companion-arcade[data-playing=true][hidden],
html[data-mobile-client=true] #screen #companion-chat .companion-arcade[data-playing=true] :is(.arcade-pad,.arcade-elements,canvas)[hidden] { display:none!important; }
@media (orientation:landscape) {
  html[data-mobile-client=true] #screen #companion-chat .companion-arcade[data-playing=true] {
    grid-template-columns:minmax(0,1fr) 152px; grid-template-rows:30px minmax(0,1fr); padding:5px 8px 8px!important;
  }
  html[data-mobile-client=true] #screen #companion-chat .companion-arcade[data-playing=true][data-game=maze] .arcade-board { grid-column:1; grid-row:2; }
  html[data-mobile-client=true] #screen #companion-chat .companion-arcade[data-playing=true][data-game=maze] .arcade-pad { grid-column:2; grid-row:2; align-self:center; }
  html[data-mobile-client=true] #screen #companion-chat .companion-arcade[data-playing=true] .arcade-elements { gap:7px; }
  html[data-mobile-client=true] #screen #companion-chat .companion-arcade[data-playing=true] .arcade-elements button { font-size:14px; }
  html[data-mobile-client=true] #screen #companion-chat .companion-arcade:not([data-playing=true]) .arcade-board { max-height:42dvh; }
  html[data-mobile-client=true] #screen #companion-chat .companion-arcade:not([data-playing=true]) canvas.companion-minigame { width:auto!important; height:auto!important; max-width:100%!important; max-height:42dvh!important; }
}
@media (max-height:360px) and (orientation:landscape) {
  html[data-mobile-client=true] #screen #companion-chat:has(.companion-arcade:not([hidden])[data-playing=true]) .companion-heading { min-height:28px; padding:0 6px; }
  html[data-mobile-client=true] #screen #companion-chat:has(.companion-arcade:not([hidden])[data-playing=true]) nav { padding:2px 4px; }
  html[data-mobile-client=true] #screen #companion-chat:has(.companion-arcade:not([hidden])[data-playing=true]) nav button { min-height:28px; padding:2px 6px; }
}