/* One type scale for readable UI; canvas labels and decorative artwork stay separate. */
/* The only UI size definitions. Components choose a named role; ordinary
   interface copy inherits Default. Button and Chat intentionally match it. */
.pq-app {
 --pq-font-input-floor:16px; --pq-font-default:20px; --pq-font-game:var(--pq-font-default);
 --pq-font-button:var(--pq-font-default); --pq-font-chat:var(--pq-font-default);
 --pq-font-secondary:17px; --pq-font-meta:14px; --pq-font-heading:24px;
 --pq-font-display:clamp(28px,3.2vw,40px); --pq-font-hero:clamp(36px,5vw,64px);
 --pq-font-metric:26px; --pq-font-timer:38px; --pq-font-symbol:28px;
 --pq-body180:var(--pq-font-game); --pq-small180:var(--pq-font-secondary);
 --pq-meta180:var(--pq-font-meta); --pq-title180:var(--pq-font-heading); --pq-font:var(--pq-font-default);
}
@media(max-width:1100px){.pq-app{--pq-font-default:18px;--pq-font-secondary:16px;--pq-font-heading:22px;--pq-font-metric:24px}}
@media(max-width:600px){.pq-app{--pq-font-default:16px;--pq-font-secondary:14px;--pq-font-meta:12px;--pq-font-heading:20px;--pq-font-timer:32px;--pq-font-metric:22px}}
.pq-app .pq-button,
.pq-app .pq-enc150 .pq-enc150__controls button,
.pq-app.pq-portrait162 .pq-panel .pq-button,
.pq-app.pq-layout146.pq-in-battle:has(.pq-welcome[hidden]) .pq-scene>.pq-panel.pq-battle-panel166>.pq-battle-actions .pq-button {
  font:600 var(--pq-font-button)/1.25 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  min-height:44px; padding:10px 12px; gap:8px;
}
.pq-app .pq-panel :is(p,.pq-panel__stats),.pq-app .pq-boss-intent178>strong { font-size:var(--pq-body180); line-height:1.4; }
.pq-app .pq-boss-intent178>p,.pq-app .pq-friendly-consequence178 { font-size:var(--pq-small180)!important; }
.pq-app :is(.pq-combat-cargo178 strong,.pq-boss-intent178>b,.pq-gear-comparison178 h4,.pq-gear-comparison178 p,.pq-gear-filters178 .pq-button,.pq-harbour-filters178 .pq-button) { font-size:var(--pq-small180); }
.pq-app :is(.pq-combat-cargo178 small,.pq-boss-intent178>div,.pq-boss-intent178>b small) { font-size:var(--pq-meta180); }
.pq-app .pq-action-icon180 { display:inline-flex; flex:0 0 24px; align-items:center; justify-content:center; }
.pq-app .pq-button>svg,.pq-app .pq-action-icon180 svg { flex-shrink:0; }
/* Gold identifies the primary action. Deliberate keyboard focus uses the
   standard outside outline, with no extra border inside the button. */
.pq-app :is(button,a).pq-button--gold.gr-default-action { box-shadow:none; }
.pq-app.pq-layout146 :is(button,a):focus-visible { outline:2px solid #b5e5df; outline-offset:2px; }
.pq-app .pq-chat-dialog [data-dialog-close]:focus { outline:none; box-shadow:none; }
.pq-app .pq-outcome:focus { outline:none; }

/* Capacity stays above the tabs, including Active effects and individual item details. */
.pq-app .pq-items-dialog>.gr-dialog__head { display:flex; align-items:center; flex-wrap:wrap; gap:12px; }
.pq-app .pq-items-dialog>.gr-dialog__head>h2 { flex:1 1 190px; min-width:0; font-size:var(--pq-title180); }
.pq-app .pq-items-dialog [data-dialog-close][hidden] { display:none!important; }
.pq-app .pq-items-dialog [data-cargo-capacity180] { flex:0 1 190px; min-width:132px; margin-left:auto; }
.pq-app .pq-cargo-capacity180 { color:#e8e9d6; }
.pq-app .pq-cargo-capacity180>span { display:flex; align-items:baseline; gap:8px; font-size:var(--pq-small180); white-space:nowrap; }
.pq-app .pq-cargo-capacity180 b { color:#ffe0a0; font-variant-numeric:tabular-nums; }
.pq-app .pq-cargo-capacity180 small { margin-left:auto; color:#bddbd0; font-size:var(--pq-meta180); }
.pq-app .pq-cargo-capacity180 [role=meter] { margin-top:5px; height:7px; border-radius:5px; overflow:hidden; background:#041c28; border:1px solid #8dac9c77; }
.pq-app .pq-cargo-capacity180 [role=meter]>span { display:block; height:100%; background:linear-gradient(90deg,#4d9b93,#c5dbaa); border-radius:inherit; }
.pq-app .pq-cargo-capacity180.is-full [role=meter]>span { background:linear-gradient(90deg,#b17b45,#f1c778); }
@media(max-width:600px) {
  .pq-app .pq-items-dialog>.gr-dialog__head { display:grid; grid-template-columns:minmax(0,1fr) 44px; gap:8px; padding:12px; }
  .pq-app .pq-items-dialog>.gr-dialog__head>h2 { margin:0; grid-column:1; grid-row:1; }
  .pq-app .pq-items-dialog>.gr-dialog__head>[data-dialog-close] { grid-column:2; grid-row:1; }
  .pq-app .pq-items-dialog>.gr-dialog__head>[data-cargo-capacity180] { grid-column:1/-1; grid-row:2; width:100%; margin:0; }
  .pq-app .pq-items-dialog>.gr-dialog__head:has([data-dialog-close][hidden])>h2 { grid-column:1/-1; }
}

/* Ship previews and live battles consume the same two-ship stat component. */
.pq-app .pq-battle-ship166__head,.pq-app .pq-battle-ship166__facts { font-size:var(--pq-small180); line-height:1.3; }
.pq-app .pq-battle-ship166__head>strong,.pq-app .pq-battle-ship166__damage>b { font-size:var(--pq-body180); line-height:1.25; }
.pq-app .pq-battle-ship166__crew,.pq-app .pq-battle-ship166__hull-label { font-size:var(--pq-small180); }
.pq-app .pq-battle-ship166__damage>span { display:inline-flex; align-items:center; gap:5px; }
.pq-app .pq-battle-ship166 svg { width:20px; height:20px; flex-basis:20px; }
.pq-app .pq-battle-ships166>.pq-battle-odds { font-size:var(--pq-small180); line-height:1.3; }
.pq-app .pq-panel { container-type:inline-size; }
.pq-app.pq-layout146.pq-in-battle:has(.pq-welcome[hidden]) .pq-scene>.pq-panel.pq-battle-panel166 {
  grid-template-columns:minmax(0,1fr) auto;
  grid-template-rows:auto auto auto auto auto;
  grid-template-areas:"name clock" "stats stats" "intent intent" "actions actions" "cargo cargo";
  width:min(440px,calc(100% - 16px)); gap:10px; padding:12px;
}
.pq-app.pq-layout146.pq-in-battle:has(.pq-welcome[hidden]) .pq-scene>.pq-panel.pq-battle-panel166>h2 { font-size:var(--pq-title180); }
.pq-app.pq-layout146.pq-in-battle:has(.pq-welcome[hidden]) .pq-scene>.pq-panel.pq-battle-panel166>.pq-battle-clock,
.pq-app.pq-layout146.pq-in-battle:has(.pq-welcome[hidden]) .pq-scene>.pq-panel.pq-battle-panel166>.pq-battle-clock b { font-size:var(--pq-small180); }
.pq-app.pq-layout146.pq-in-battle:has(.pq-welcome[hidden]) .pq-scene>.pq-panel.pq-battle-panel166>.pq-battle-actions { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.pq-app.pq-layout146.pq-in-battle:has(.pq-welcome[hidden]) .pq-scene>.pq-panel.pq-battle-panel166>.pq-battle-actions--live>.pq-button:last-child { grid-column:1/-1; }
.pq-app .pq-battle-panel166>.pq-boss-intent178 { grid-area:intent; margin:0; }
.pq-app .pq-battle-panel166>.pq-combat-cargo178 { grid-area:cargo; margin:0; }
/* A landscape panel never puts a 2x2 action block beside an empty stats column. */
@media(max-width:1100px) {
  .pq-app.pq-layout146.pq-in-battle:has(.pq-welcome[hidden]) .pq-scene>.pq-panel.pq-battle-panel166 {
    left:50%; right:auto; bottom:8px; transform:translateX(-50%); max-height:calc(100% - 136px); max-width:calc(100% - 16px);
  }
  .pq-app.pq-layout146:has(.pq-welcome[hidden]) .pq-scene>.pq-panel:not(.pq-battle-panel166) { max-height:calc(100% - 120px); overflow-y:auto; }
}
.pq-app.pq-layout146.pq-portrait162.pq-in-battle.pq-viewport-short180:has(.pq-welcome[hidden]) .pq-hud { display:none!important; }
.pq-app.pq-layout146.pq-portrait162.pq-in-battle.pq-viewport-short180:has(.pq-welcome[hidden]) .pq-stage,
.pq-app.pq-layout146.pq-portrait162.pq-in-battle.pq-viewport-short180:has(.pq-welcome[hidden]) .pq-stage:has(.pq-panel[hidden]) { grid-template-rows:minmax(0,1fr); grid-template-areas:"scene"; }

/* A separate top-layer dialog preserves any open inventory or conversation. */
.pq-app dialog.pq-viewport-guard180 {
  position:fixed; inset:0; margin:0; padding:max(24px,env(safe-area-inset-top)) max(24px,env(safe-area-inset-right)) max(24px,env(safe-area-inset-bottom)) max(24px,env(safe-area-inset-left));
  width:100vw; height:100dvh; max-width:none; max-height:none; box-sizing:border-box; border:0; border-radius:0;
  color:#f4e4c4; background:radial-gradient(ellipse at 50% 30%,#275967,#092c39 70%); overflow:auto;
}
.pq-app dialog.pq-viewport-guard180[open] { display:grid; place-items:center; }
.pq-viewport-guard180::backdrop { background:#071f2b; }
.pq-app .pq-viewport-guard180>div { max-width:620px; text-align:center; margin:auto; }
.pq-app .pq-viewport-guard180 h2 { color:#ffe5b5; margin:18px 0 12px; font:650 var(--pq-font-display)/1.2 system-ui; }
.pq-app .pq-viewport-guard180 p { color:#d4e7df; font:400 var(--pq-font-default)/1.5 system-ui; margin:10px 0; }
.pq-app .pq-viewport-guard180 small,.pq-app .pq-viewport-guard180 .pq-viewport-status180 { color:#afd1ca; font:400 var(--pq-font-secondary)/1.5 system-ui; }
.pq-viewport-symbol180 { display:inline-flex; color:#e6c484; }
@media(max-height:420px) { .pq-app dialog.pq-viewport-guard180 { padding:18px; }.pq-viewport-symbol180 svg { width:42px; height:42px; }.pq-app .pq-viewport-guard180 h2 { margin:10px 0; } }

/* Compact portrait encounters reclaim the resource row as well as the dormant
   helm. Health, damage and crew remain in the shared two-ship panel. */
.pq-app.pq-layout146.pq-portrait162.pq-viewport-short180:has(.pq-welcome[hidden]):has(.pq-panel:not([hidden])) .pq-hud { display:none!important; }
.pq-app.pq-layout146.pq-portrait162.pq-navigation-unavailable.pq-viewport-short180:has(.pq-welcome[hidden]):has(.pq-panel:not([hidden])) .pq-stage { grid-template-rows:minmax(0,1fr); grid-template-areas:"scene"; }

.pq-app .pq-enc150 .pq-enc150__controls button { display:inline-flex; align-items:center; justify-content:center; gap:8px; }

/* Interface copy shares the same roles in dialogs, scenes and embedded chats. */
.pq-app{font-size:var(--pq-body180);line-height:1.45}
.pq-app .pq-visually-hidden181{position:absolute!important;width:1px!important;height:1px!important;margin:-1px!important;padding:0!important;border:0!important;clip:rect(0,0,0,0)!important;clip-path:inset(50%)!important;overflow:hidden!important;white-space:nowrap!important}
.pq-app :is(.pq-chat-bubble,.pq-chat-portrait154,.pq-tavern__caption,.pq-mystic160__scene-caption){font-size:var(--pq-font-chat);line-height:1.45}
.pq-app .pq-chat-bubble p{font:inherit;margin-top:8px}
.pq-app .pq-chat-bubble strong{line-height:1.35}
.pq-app .pq-tavern__caption[hidden]{display:none!important}
.pq-app .pq-chat-portrait154{min-width:0;gap:12px}
.pq-app .pq-chat-portrait154>span{min-width:0;overflow-wrap:break-word;line-height:1.35}
.pq-app .pq-chat-choice-label158{min-width:0;word-break:normal;overflow-wrap:break-word}
.pq-app .pq-chat-replies .pq-button{align-items:center;line-height:1.3}
.pq-app .pq-chat-options154 [data-chat-status]:empty{display:none}
.pq-app :is(.pq-act160__head h2,.pq-tavern__head h2,.pq-mystic160__head h2,.gr-dialog__head h2){font-size:var(--pq-title180);line-height:1.2}
.pq-app .pq-act160__head>div:first-child,.pq-app .pq-tavern__head>div,.pq-app .pq-mystic160__head>div{min-width:0}
.pq-app :is(.pq-act160__head,.pq-tavern__head,.pq-mystic160__head){flex-shrink:0}
.pq-app .pq-act160__guide :is(p,li){font-size:var(--pq-body180);line-height:1.5}
.pq-app .pq-act160__panel p{font-size:var(--pq-body180);line-height:1.45}
.pq-app :is(input,select,textarea){font-size:max(var(--pq-font-input-floor),var(--pq-body180))}
.pq-app dialog.pq-server-wait181{position:fixed;inset:0;margin:0;width:100vw;height:100dvh;max-width:none;max-height:none;border:0;border-radius:0;padding:24px;box-sizing:border-box;color:#f6ebcf;background:radial-gradient(ellipse at 50% 35%,#174854f2,#061f2bf5 75%);backdrop-filter:blur(7px);overflow:auto;z-index:250}
.pq-app dialog.pq-server-wait181[open]{display:grid;place-items:center}
.pq-server-wait181::backdrop{background:#041923b8}
.pq-app .pq-server-wait181>div{text-align:center;max-width:36ch;margin:auto}
.pq-app .pq-server-wait181 h2{font-size:var(--pq-title180);line-height:1.25;color:#ffe3ac;margin:18px 0 12px}
.pq-app .pq-server-wait181 p{font-size:var(--pq-body180);line-height:1.5;color:#d5e7df;margin:0}
.pq-app .pq-server-wait181__symbol{display:inline-flex;color:#e8cc92;animation:pq-wait181-bob 2.4s ease-in-out infinite}
@keyframes pq-wait181-bob{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-5px) rotate(2deg)}}
@media(prefers-reduced-motion:reduce){.pq-app .pq-server-wait181__symbol{animation:none}}
.pq-app.pq-reduce-animations .pq-server-wait181__symbol,.pq-app[data-reduce-animations="true"] .pq-server-wait181__symbol{animation:none}

/* Both capacity bars are global to the inventory, not repeated in its tabs.
   Their parent can hide this optional block if even the compact pair cannot fit. */
.pq-app .pq-items-dialog>.gr-dialog__head{container-type:inline-size;container-name:pq-inventory-head}
.pq-app .pq-items-dialog [data-cargo-capacity180]{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;flex:0 1 340px;min-width:270px}
.pq-app .pq-cargo-capacity180>span{font-size:var(--pq-font-default);gap:6px;justify-content:space-between;white-space:nowrap}
.pq-app .pq-cargo-capacity180 [role=meter]{height:7px}
@container pq-inventory-head (max-width:285px){.pq-app .pq-items-dialog [data-cargo-capacity180]{display:none}}
@media(max-width:600px){.pq-app .pq-items-dialog [data-cargo-capacity180]{min-width:0;gap:10px}.pq-app .pq-items-dialog>.gr-dialog__head>[data-cargo-capacity180]{width:100%;margin:0}}
.pq-app .gr-countdown .gr-countdown__label{font-size:var(--pq-font-meta)}
.pq-app .gr-countdown .gr-countdown__value{font-size:var(--pq-font-timer);line-height:1.05}