/* Responsive Bookworm: short portrait and compact, touch-capable landscape.
   Uses available space, not UA/device detection. No artwork/theme changes. */
:root{
  --wb-safe-top:env(safe-area-inset-top,0px);--wb-safe-right:env(safe-area-inset-right,0px);
  --wb-safe-bottom:env(safe-area-inset-bottom,0px);--wb-safe-left:env(safe-area-inset-left,0px);
}
.bookworm-theme .wb.desk{padding-left:var(--wb-safe-left);padding-right:var(--wb-safe-right);box-sizing:border-box;}
@media(max-width:640px) and (orientation:portrait){
  .bookworm-theme .wb{--sw:calc(100vw - max(8px,var(--wb-safe-left)) - max(8px,var(--wb-safe-right)));--g:min(calc(var(--sw) - 8px),440px);}
  .bookworm-theme .wb .wb-stage{padding-left:max(8px,var(--wb-safe-left));padding-right:max(8px,var(--wb-safe-right));padding-bottom:max(8px,var(--wb-safe-bottom));}
  .bookworm-theme .wb .wb-mobile-header{height:calc(48px + var(--wb-safe-top));padding:var(--wb-safe-top) max(10px,var(--wb-safe-right)) 0 max(10px,var(--wb-safe-left));}
}
@media (min-width:720px) and (max-width:1100px) and (min-height:540px) and (max-height:760px) and (orientation:landscape){
  .bookworm-theme .game-site-header{box-sizing:border-box;min-height:56px;height:calc(56px + var(--wb-safe-top));padding:calc(8px + var(--wb-safe-top)) calc(12px + var(--wb-safe-right)) 8px calc(12px + var(--wb-safe-left));align-items:center;gap:8px;}
  .bookworm-theme .game-site-identity{margin-left:auto;margin-right:48px;}
  .bookworm-theme .game-site-identity h1{font-size:36px;}
  .bookworm-theme .wb > #wb-audio-mute{top:calc(8px + var(--wb-safe-top));left:auto;right:calc(12px + var(--wb-safe-right));}
  .bookworm-theme .wb.desk{
    --SW:calc(var(--availw,100vw) - 24px);--gap:10px;
    --t:44px;--wt:40px;--bh:274px;
    --sh:calc(var(--H) - var(--bh) - 8px);
  }
  .bookworm-theme .wb.desk .wb-top{grid-template-columns:minmax(0,1fr) auto;gap:10px;margin-bottom:8px;min-height:28px;}
  .bookworm-theme .wb.desk .wb-title{grid-column:1;gap:10px;}
  .bookworm-theme .wb.desk .wb-meta{grid-column:2;gap:14px;}
  .bookworm-theme .wb.desk .wb-title-main{font-size:1.25rem;}
  .bookworm-theme .wb.desk .wb-title-sub{font-size:.9rem;}
  .bookworm-theme .wb.desk .wb-stage{row-gap:8px;padding-bottom:0;grid-template-columns:minmax(0,1fr) var(--kb) minmax(0,1.1fr);}
  .bookworm-theme .wb.desk .wb-utility-tiles{flex-wrap:nowrap;gap:4px;padding:0;}
  .bookworm-theme .wb.desk .wb-utility-tiles button{min-height:44px;padding:4px 7px;font-size:.92rem;}
  .bookworm-theme .wb.desk .wb-relic-panel{margin-top:52px;height:calc(100% - 52px);padding:8px;}
  .bookworm-theme .wb.desk .wb-relics{grid-template-columns:repeat(auto-fit,minmax(84px,1fr));gap:8px 4px;padding:6px 0;}
  .bookworm-theme .wb.desk .wb-socket{padding:0;gap:6px;min-width:0;}
  .bookworm-theme .wb.desk .wb-socket-n{width:84px;height:117px;min-width:84px;min-height:117px;padding:14px 13px;}
  .bookworm-theme .wb.desk :is(.wb-lore,#wb-tactics){width:100%;padding:8px 10px;}
  .bookworm-theme .wb.desk .wb-lore{height:calc(55% - 4px);align-self:start;}
  .bookworm-theme .wb.desk #wb-tactics{height:calc(45% - 4px);align-self:end;}
  .bookworm-theme .wb.desk :is(.wb-lore summary,#wb-tactics > summary){min-height:0;font-size:.72rem;letter-spacing:1px;padding-bottom:5px;margin-bottom:5px;}
  .bookworm-theme .wb.desk .wb-lore > p{font-size:.94rem;line-height:1.3;}
  .bookworm-theme .wb.desk .wb-bars{padding:8px 10px;gap:calc(var(--wt)*9 + 24px);}
  .bookworm-theme .wb.desk .wb-scene .wb-who .wb-name{font-size:1.3rem;}
  .bookworm-theme .wb.desk .wb-hearts{font-size:1.3rem;}
  .bookworm-theme .wb.desk .wb-scene .wb-meter{grid-template-columns:repeat(10,12px);gap:3px;}
  .bookworm-theme .wb.desk .wb-scene .wb-health-pip{width:12px;height:11px;}
  .bookworm-theme .wb.desk .wb-fight > .wb-tray{margin-top:8px;}
  .bookworm-theme .wb.desk .wb-verdict{margin-top:54px;max-width:420px;}
  .bookworm-theme .wb.desk .wb-actions{height:44px;}
  .bookworm-theme .wb.desk :is(.wb-speech,.wb-speech.you){top:56px;max-height:calc(100% - 62px);overflow:auto;padding:8px 44px 8px 10px;font-size:16px;line-height:1.2;}
  .bookworm-theme .wb.desk .wb-speech strong{font-size:18px;}
  .bookworm-theme .wb.desk .wb-speech p{margin:4px 0 0;max-height:3em;overflow:auto;}
  .bookworm-theme .wb.desk .wb-speech button{top:0;right:0;width:44px;height:44px;}
}
@media(max-width:640px) and (max-height:640px) and (orientation:portrait){
  /* The rack is limited by its actual remaining height, not the historical
     --g fallback intended for the old side-by-side Words layout. */
  .bookworm-theme .wb .wb-grid{height:min(100%,calc(100vw - 24px));max-height:100%;}
  .bookworm-theme .wb .wb-board{grid-template-rows:34px 18px minmax(0,1fr) 44px;}
  .bookworm-theme .wb .wb-board > .wb-tray{height:34px;min-height:34px;}
  .bookworm-theme .wb .wb-tray .wb-tile{--w:min(28px,(100cqw - (var(--n) - 1)*.3rem)/var(--n));}
  .bookworm-theme .wb .wb-verdict{height:18px;min-height:18px;max-height:18px;line-height:18px;}
  .bookworm-theme .wb .wb-fight > .wb-mobile-progress{height:20px;margin-bottom:3px;}
  .bookworm-theme .wb .wb-mobile-header{height:calc(44px + var(--wb-safe-top));}
  .bookworm-theme .wb .wb-stage{padding-bottom:max(4px,var(--wb-safe-bottom));}
}
@media(min-width:720px) and (max-width:850px) and (min-height:540px) and (max-height:760px) and (orientation:landscape){
  .bookworm-theme .wb.desk .wb-utility-tiles{display:grid;grid-template-columns:1fr 1fr;width:100%;}
  .bookworm-theme .wb.desk .wb-relic-panel{margin-top:100px;height:calc(100% - 100px);}
  .bookworm-theme .wb.desk .wb-title-sub{display:none;}
}
/* Avoid nested/classic scrollbar chrome in touch-sized dialogs. Overflow stays
   auto so long content remains scrollable by touch, wheel and keyboard. */
@media(max-width:640px) and (orientation:portrait), (min-width:720px) and (max-width:1100px) and (min-height:540px) and (max-height:760px) and (orientation:landscape){
  .bookworm-theme .wb dialog{inset:var(--wb-safe-top) var(--wb-safe-right) var(--wb-safe-bottom) var(--wb-safe-left);max-width:calc(100vw - var(--wb-safe-left) - var(--wb-safe-right) - 24px);max-height:calc(100dvh - var(--wb-safe-top) - var(--wb-safe-bottom) - 24px);overflow-x:hidden;overflow-y:auto;scrollbar-width:none;}
  .bookworm-theme .wb dialog.wb-mobile-sheet{overflow:hidden;}
  .bookworm-theme :is(dialog,.wb-sheet-scroll,#wb-mobile-sheet-body,.wb-end-card){scrollbar-width:none;overscroll-behavior:contain;}
  .bookworm-theme :is(dialog,.wb-sheet-scroll,#wb-mobile-sheet-body,.wb-end-card)::-webkit-scrollbar{display:none;width:0;height:0;}
}
@media(min-width:720px) and (max-width:1100px) and (min-height:540px) and (max-height:760px) and (orientation:landscape){
  .bookworm-theme .wb-chapter-story{padding:20px 32px;}
  .bookworm-theme .wb-chapter-story h2{font-size:30px;margin:12px 0;}
  .bookworm-theme #wb-chapter-story-text{font-size:22px;line-height:1.35;}
  .bookworm-theme .wb-chapter-story button{margin-top:18px;padding:8px 20px;}
  .bookworm-theme .wb.desk .wb-speech{left:calc(var(--speech-x,60%) + 32px);right:auto;transform:none;width:clamp(180px,24%,260px);max-width:calc(100% - var(--speech-x,60%) - 42px);overflow:visible;}
  .bookworm-theme .wb.desk .wb-speech.you{left:auto;right:calc(100% - var(--speech-x,40%) + 28px);max-width:calc(var(--speech-x,40%) - 40px);overflow:visible;}
  .bookworm-theme .wb.desk .wb-speech p{max-height:min(3.6em,calc(var(--sh) - 112px));overflow-y:auto;scrollbar-width:none;}
  .bookworm-theme .wb.desk .wb-speech p::-webkit-scrollbar{display:none;}
  .bookworm-theme .wb.desk .wb-speech::after{left:-9px;right:auto;top:24px;bottom:auto;transform:none;border-width:7px 8px 7px 0;border-color:transparent var(--paper) transparent transparent;}
  .bookworm-theme .wb.desk .wb-speech.you::after{left:auto;right:-9px;border-width:7px 0 7px 8px;border-color:transparent transparent transparent var(--paper);}
}