.mobile-only,.mobile-chat-heading { display:none; }
.mobile-chat { display:contents; }
@media (max-width:700px), (max-width:1000px) and (max-height:520px) {
  #viewport[data-render-quality] { width:100%;height:auto;max-width:none;aspect-ratio:auto; }
  #systems-nav { display:none; }
  .systems-dialog { max-height:calc(var(--mobile-viewport-height,100dvh) - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px) - 16px);overflow:auto;overscroll-behavior:contain; }
  .systems-dialog button { min-height:44px; }
  .systems-dialog input,.systems-dialog textarea,.systems-dialog select { font-size:16px; }
}
@media (max-width:700px), (max-width:1000px) and (max-height:520px) {
  :root { --mobile-chat-height:clamp(148px,calc(var(--mobile-viewport-height,100dvh) * .34),270px);--mobile-chat-width:min(310px,40vw); }
  html,body { height:100%;height:var(--mobile-viewport-height,100dvh);min-height:0;overflow:hidden;overscroll-behavior:none; }
  main { width:100%;max-width:none;height:100%;padding:0;display:flex;flex-direction:column; }
  header { display:none; }
  header>div,footer { display:none; }
  body.embedded header { display:none; }
  #viewport { width:100%;flex:1;height:auto;min-height:0;aspect-ratio:auto;margin:0;border:0;overflow:hidden;box-shadow:none; }
  #game { display:block;width:100%;height:100%; }
  #world-ui { font-size:14px; }
  #world-ui button,#world-ui input { font-size:14px; }
  #world-ui button,header button { min-width:44px;min-height:44px;touch-action:manipulation; }
  #map-name { top:52px;left:10px;max-width:36%;height:28px;display:flex;align-items:center;margin:0;padding:4px 6px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:12px; }
  .tools { top:env(safe-area-inset-top,0px);left:0;right:0;height:44px;display:flex;align-items:center;justify-content:flex-end;gap:4px;padding:0 max(4px,env(safe-area-inset-right)) 0 calc(48px + env(safe-area-inset-left,0px));background:#20170ff2;z-index:6; }
  .tools button { display:none;padding:8px;white-space:nowrap; }
  .tools #map-button,.tools .mobile-only { display:block;font-size:14px;min-width:48px; }
  .tools .mobile-game-title { flex:1;min-width:0;font-size:16px;white-space:nowrap; }
  #mobile-return { display:block;position:absolute;left:env(safe-area-inset-left,0px);top:env(safe-area-inset-top,0px);z-index:10;width:44px;min-width:44px;height:44px;font-size:24px;border:0;background:#20170ff2;color:#f1dfb7; }
  .embedded .tools { padding-left:max(4px,env(safe-area-inset-left)); }
  .embedded #mobile-return { display:none; }
  #player-status { top:52px;left:40%;right:10px;width:auto;padding:5px 8px;font-size:12px;line-height:1.5;background:#100c09bf; }
  #player-status div { display:none; }
  #player-status div:first-child,#player-status div:nth-child(5),#player-status div:nth-child(6) { display:inline-block;margin-right:12px; }
  #mobile-pad { position:absolute;left:max(14px,env(safe-area-inset-left));bottom:max(16px,env(safe-area-inset-bottom));display:grid;grid-template-columns:repeat(3,48px);grid-template-rows:repeat(2,48px);gap:4px;opacity:1;pointer-events:auto;z-index:3; }
  #mobile-pad button { min-width:48px;min-height:48px;font-size:24px;background:#21190cd6;touch-action:none;user-select:none;-webkit-user-select:none; }
  #mobile-pad button:first-child { grid-column:2; }
  #mobile-pad button:nth-child(2) { grid-column:1;grid-row:2; }
  #mobile-pad button:nth-child(3) { grid-column:2;grid-row:2; }
  #mobile-pad button:nth-child(4) { grid-column:3;grid-row:2; }
  #mobile-pad[hidden] { display:none; }
  #mobile-interact { display:block;position:absolute;right:max(16px,env(safe-area-inset-right));bottom:max(35px,env(safe-area-inset-bottom));min-width:104px;min-height:56px;font-size:16px;background:#604521e8;pointer-events:auto;z-index:3; }
  #world-ui:has(#battle-panel:not([hidden])) #mobile-interact { display:none; }
  .mobile-menu { position:absolute;top:calc(50px + env(safe-area-inset-top,0px));right:max(10px,env(safe-area-inset-right));z-index:8;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:min(320px,calc(100% - 20px - env(safe-area-inset-left,0px) - env(safe-area-inset-right,0px)));max-height:calc(100% - 66px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px));overflow:auto;overscroll-behavior:contain;gap:8px;padding:10px;background:#241b13f5;border:1px solid #ab8754;box-shadow:0 12px 36px #0009;pointer-events:auto; }
  .mobile-menu[hidden] { display:none; }
  .mobile-menu button { display:block;min-height:48px;font-size:14px; }
  .mobile-chat { display:none; }
  .mobile-chat-open .mobile-chat { position:absolute;bottom:0;left:0;right:0;height:var(--mobile-chat-height);display:grid;grid-template-rows:44px minmax(0,1fr) 48px;gap:6px;padding:6px max(10px,env(safe-area-inset-right)) max(6px,env(safe-area-inset-bottom)) max(10px,env(safe-area-inset-left));background:#17110ff2;border-top:1px solid #a07c4b;pointer-events:auto;z-index:5; }
  .mobile-chat-heading { display:flex;align-items:center;gap:10px;font-size:14px; }
  .mobile-chat-heading button { display:block;margin-left:auto;min-width:48px;min-height:44px; }
  #chat-log { position:static;inset:auto;width:100%;height:auto;min-height:0;padding:6px 2px;font-size:14px;line-height:1.65; }
  #chat-form { position:static;inset:auto;width:100%;height:48px;display:flex;gap:6px; }
  #chat-input { min-width:0;flex:1;font-size:16px!important;padding:8px; }
  #chat-form button { min-width:64px;min-height:44px; }
  .mobile-chat-open #game { height:calc(100% - var(--mobile-chat-height)); }
  .mobile-chat-open #mobile-pad { bottom:calc(var(--mobile-chat-height) + 16px); }
  .mobile-chat-open #mobile-interact { bottom:calc(var(--mobile-chat-height) + 35px); }
  #battle-panel { inset:96px 10px 16px; }
  #battle-panel>div:first-child { padding:8px;font-size:14px; }
  #battle-name { margin-right:8px; }
  #battle-log { margin:6px;font-size:13px; }
  #battle-panel small { display:none; }
  .battle-actions { left:0;right:0;bottom:12px;gap:8px; }
  .battle-actions button { min-width:80px;min-height:52px;font-size:16px;padding:10px 14px; }
  .mobile-chat-open #battle-panel { bottom:calc(var(--mobile-chat-height) + 10px); }
  #toast { left:12px;right:12px;bottom:140px;font-size:14px;padding:10px;z-index:9; }
  dialog { width:min(560px,calc(100% - 16px - env(safe-area-inset-left,0px) - env(safe-area-inset-right,0px)));max-width:calc(100% - 16px - env(safe-area-inset-left,0px) - env(safe-area-inset-right,0px));max-height:calc(var(--mobile-viewport-height,100dvh) - 16px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px));overflow:auto;overscroll-behavior:contain;padding:18px; }
  dialog button,dialog select { min-height:44px;min-width:44px;font-size:14px; }
  dialog input { min-height:44px;font-size:16px; }
  #title-screen { overflow-y:auto; }
  #title-screen>img { height:52%;min-height:180px;object-fit:cover; }
  .entrance { position:relative;left:auto;right:auto;bottom:auto;width:100%;margin-top:-50px;padding:28px 18px 20px;background:linear-gradient(transparent,#100b07 32px); }
  .entrance h1 { font-size:28px; }
  .entrance p { font-size:14px;margin:12px 0; }
  #guest-form { display:grid;grid-template-columns:1fr 1fr;gap:8px;font-size:14px; }
  #guest-form label { grid-column:1/-1;display:flex;align-items:center;gap:12px; }
  #nickname { width:0;flex:1; }
  #guest-form input,#guest-form button,#avatar-select { font-size:16px;min-height:48px;max-width:none;width:100%;padding:10px; }
  .entrance details { margin:16px 0; }
  .entrance summary { min-height:44px;padding:12px;font-size:14px; }
  #account-form { gap:8px; }
  #account-form input { grid-column:1/-1;font-size:16px;min-height:44px; }
  #account-form button { min-height:44px;font-size:14px; }
  .entrance small { font-size:11px; }
}
@media (max-width:700px), (max-width:1000px) and (max-height:520px) {
  #map-name { left:calc(10px + env(safe-area-inset-left,0px));top:calc(52px + env(safe-area-inset-top,0px)); }
  #player-status { top:calc(52px + env(safe-area-inset-top,0px));right:calc(10px + env(safe-area-inset-right,0px)); }
  #battle-panel { left:calc(10px + env(safe-area-inset-left,0px));right:calc(10px + env(safe-area-inset-right,0px));top:calc(96px + env(safe-area-inset-top,0px));bottom:calc(16px + env(safe-area-inset-bottom,0px)); }
}
@media (max-width:1000px) and (max-height:520px) {
  .mobile-chat-open .mobile-chat { top:0;left:auto;right:0;bottom:0;width:var(--mobile-chat-width);height:100%;padding-top:max(6px,env(safe-area-inset-top));padding-right:max(10px,env(safe-area-inset-right));padding-bottom:max(6px,env(safe-area-inset-bottom)); }
  .mobile-chat-open #game { width:calc(100% - var(--mobile-chat-width));height:100%; }
  .mobile-chat-open .tools { right:var(--mobile-chat-width); }
  .mobile-chat-open #map-name { max-width:calc(60% - var(--mobile-chat-width)/2); }
  .mobile-chat-open #player-status { right:calc(var(--mobile-chat-width) + 10px); }
  .mobile-chat-open #mobile-pad { bottom:12px; }
  .mobile-chat-open #mobile-interact { right:calc(var(--mobile-chat-width) + 16px);bottom:25px; }
  #mobile-pad { bottom:12px; }
  #battle-panel,.mobile-chat-open #battle-panel { top:calc(66px + env(safe-area-inset-top,0px));left:calc(12px + env(safe-area-inset-left,0px));right:calc(12px + env(safe-area-inset-right,0px));bottom:calc(8px + env(safe-area-inset-bottom,0px)); }
  .battle-actions { left:auto;right:4px;bottom:4px; }
  .battle-actions button { min-height:48px; }
  #battle-log { display:none; }
  .mobile-chat-open #battle-panel { right:calc(var(--mobile-chat-width) + 12px + env(safe-area-inset-right,0px)); }
  #title-screen { display:block; }
  #title-screen>img { position:absolute;inset:0;width:50%;height:100%; }
  .entrance { width:50%;margin:0 0 0 50%;padding:14px 18px; }
  .entrance h1 { font-size:22px; }
  .entrance p { margin:6px 0;font-size:12px; }
  .entrance small { display:none; }
}
