/* BLACK PIRATE KINGDOM V18.2 — balanced desktop sizing and readable HUD */
html.v18.v181 body{font-size:14px}

/* Header: readable without wasting the whole screen. */
html.v18.v181 header{
  grid-template-columns:255px minmax(0,1fr)!important;
  min-height:68px!important;
  padding:7px 12px!important;
  gap:10px!important;
}
html.v18.v181 header>div:first-child:before{width:45px!important;height:45px!important;flex-basis:45px!important;background-size:34px!important}
html.v18.v181 header h1{font-size:19px!important;line-height:1.02!important;letter-spacing:2.7px!important}
html.v18.v181 #captain{font-size:11px!important;max-width:155px}
html.v18.v181 #nav{gap:5px!important;overflow:hidden}
html.v18.v181 .v17NavScroll{gap:2px!important;overflow-x:auto!important;scrollbar-width:thin!important}
html.v18.v181 .v17NavBtn{padding:7px 8px!important;min-height:38px!important;gap:5px!important;font-size:11px!important}
html.v18.v181 .v17NavBtn img{width:17px!important;height:17px!important}
html.v18.v181 .v17NavBtn span{display:inline!important}
html.v18.v181 .v17UtilityBtn{padding:7px 9px!important;min-height:38px!important;font-size:11px!important}
html.v18.v181 .languagePicker select{height:38px!important;min-width:112px!important;font-size:11px!important}

/* Resource strip: medium-sized values, pools remain in the strip. */
html.v18.v181 #resources{
  top:68px!important;
  height:54px!important;
  min-height:54px!important;
  grid-template-columns:repeat(12,minmax(92px,1fr))!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  padding:0 8px!important;
}
html.v18.v181 #resources .v17Resource{
  grid-template-columns:20px minmax(62px,1fr)!important;
  min-width:92px!important;
  padding:7px 8px!important;
  column-gap:6px!important;
}
html.v18.v181 #resources .v17Resource img,html.v18.v181 .solGlyph{width:19px!important;height:19px!important;font-size:20px!important}
html.v18.v181 #resources .v17Resource span:not(.solGlyph){font-size:8px!important;line-height:1.15!important}
html.v18.v181 #resources .v17Resource b{font-size:12px!important;line-height:1.2!important}
html.v18.v181 .energyMeta{font-size:7.5px!important}

/* General controls. */
html.v18.v181 button{font-size:12px!important;padding:8px 11px!important}
html.v18.v181 input,html.v18.v181 select,html.v18.v181 textarea{font-size:12px!important}
html.v18.v181 main{padding:14px 18px 30px!important}

/* WORLD MAP: readable sidebars and a large sea, still suitable for a 1080p screen. */
html.v18.v181 body[data-page="world"]{height:auto!important;overflow:auto!important}
html.v18.v181 body[data-page="world"] #game{height:auto!important;overflow:visible!important}
html.v18.v181 body[data-page="world"] main{height:auto!important;min-height:calc(100vh - 122px)!important;overflow:visible!important;padding:10px 12px 18px!important}
html.v18.v181 .v17World{
  height:auto!important;
  grid-template-columns:215px minmax(650px,1fr) 235px!important;
  gap:9px!important;
  max-width:1920px!important;
}
html.v18.v181 .v17Side{top:130px!important;max-height:calc(100vh - 142px)!important;gap:8px!important}
html.v18.v181 .v17Panel{padding:10px!important}
html.v18.v181 .v17PanelTitle>span{font-size:11px!important}
html.v18.v181 .v17FleetList article{grid-template-columns:60px 1fr!important;padding:6px!important;gap:6px!important}
html.v18.v181 .v17FleetList img{width:60px!important;height:45px!important}
html.v18.v181 .v17FleetList b{font-size:10.5px!important}
html.v18.v181 .v17FleetList span,html.v18.v181 .v17FleetList small{font-size:8.5px!important}
html.v18.v181 .v17DailyMini b{font-size:10px!important}
html.v18.v181 .v17DailyMini small{font-size:8px!important}
html.v18.v181 .v17Production span,html.v18.v181 .v17Production b{font-size:9px!important}
html.v18.v181 .v17WorldTopbar h2{font-size:29px!important}
html.v18.v181 .v17WorldTopbar p{font-size:10px!important}
html.v18.v181 .v17SeaStatus>span{min-width:88px!important;padding:6px 8px!important}
html.v18.v181 .v17SeaStatus small{font-size:7.5px!important}
html.v18.v181 .v17SeaStatus b{font-size:11px!important}
html.v18.v181 .v17MapToolbar .seaZoneTabs button{min-width:128px!important;font-size:10px!important;padding:7px 9px!important}
html.v18.v181 .v17ControlHint{font-size:9px!important}
html.v18.v181 .v17SeaViewport{height:calc(100vh - 215px)!important;min-height:560px!important;max-height:820px!important}
html.v18.v181 .v17CoordinateHud span{min-width:80px!important;padding:5px 6px!important}
html.v18.v181 .v17CoordinateHud small{font-size:7px!important}
html.v18.v181 .v17CoordinateHud b{font-size:10px!important}
html.v18.v181 .seaVessel{width:112px!important;height:78px!important}
html.v18.v181 .seaVessel img{width:108px!important;height:64px!important}
html.v18.v181 .seaVessel span{top:63px!important;font-size:9px!important;padding:3px 6px!important;max-width:155px!important}
html.v18.v181 .seaVessel.me{width:135px!important;height:92px!important}
html.v18.v181 .seaVessel.me img{width:130px!important;height:77px!important}
html.v18.v181 .seaVessel.me span{top:76px!important}
html.v18.v181 .v17BossQuick>button{grid-template-columns:66px 1fr!important;padding:5px!important}
html.v18.v181 .v17BossQuick img{width:66px!important;height:48px!important}
html.v18.v181 .v17BossQuick b{font-size:10px!important}
html.v18.v181 .v17BossQuick small{font-size:8px!important}
html.v18.v181 .v17Inspect{min-height:205px!important}

/* BOSS MAP: 2 columns, readable typography; fifth boss centered. */
html.v18.v181 body[data-page="boss"]{height:auto!important;overflow:auto!important}
html.v18.v181 body[data-page="boss"] #game{height:auto!important;overflow:visible!important}
html.v18.v181 body[data-page="boss"] main{height:auto!important;min-height:calc(100vh - 122px)!important;overflow:visible!important;padding:12px 18px 28px!important;max-width:1760px!important}
html.v18.v181 body[data-page="boss"] #app{height:auto!important;min-height:0!important}
html.v18.v181 .v17BossPage{height:auto!important;display:flex!important;gap:12px!important;overflow:visible!important}
html.v18.v181 .v17BossHeader{flex:0 0 auto!important;min-height:92px!important;padding:8px 4px 12px!important}
html.v18.v181 .v17BossHeader .eyebrow{font-size:10px!important}
html.v18.v181 .v17BossHeader h2{font-size:39px!important;line-height:1.05!important;margin:3px 0!important}
html.v18.v181 .v17BossHeader p{font-size:11px!important;white-space:normal!important;overflow:visible!important}
html.v18.v181 .v17BossPower{width:92px!important;height:92px!important}
html.v18.v181 .v17BossPower span{font-size:9px!important}
html.v18.v181 .v17BossPower b{font-size:22px!important}
html.v18.v181 .v17BossGrid{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  grid-template-rows:none!important;
  gap:12px!important;
}
html.v18.v181 .v17BossCard,html.v18.v181 .v17BossCard:last-child{
  min-height:315px!important;
  height:auto!important;
  grid-template-columns:minmax(245px,42%) minmax(0,58%)!important;
  width:100%!important;
  max-width:none!important;
}
html.v18.v181 .v17BossCard:last-child{grid-column:1/-1!important;width:min(860px,100%)!important;justify-self:center!important}
html.v18.v181 .v17BossImage{min-height:315px!important;height:100%!important}
html.v18.v181 .v17BossImage>span{left:10px!important;top:10px!important;padding:4px 7px!important;font-size:8px!important}
html.v18.v181 .v17BossBody{padding:17px!important}
html.v18.v181 .v17BossName{gap:8px!important}
html.v18.v181 .v17BossName h3{font-size:24px!important;line-height:1.1!important;white-space:normal!important;overflow:visible!important}
html.v18.v181 .v17BossName em{font-size:8px!important;padding:4px 6px!important}
html.v18.v181 .v17BossBody>p{font-size:11px!important;line-height:1.45!important;margin:10px 0!important;display:block!important;overflow:visible!important}
html.v18.v181 .v17BossStats{gap:7px!important;margin:10px 0!important;grid-template-columns:.7fr .55fr 1.45fr!important}
html.v18.v181 .v17BossStats span{padding:8px!important}
html.v18.v181 .v17BossStats small{font-size:7.5px!important}
html.v18.v181 .v17BossStats b{font-size:10px!important;margin-top:3px!important;white-space:normal!important}
html.v18.v181 .v17Readiness{margin:9px 0 14px!important}
html.v18.v181 .v17Readiness label{font-size:8.5px!important}
html.v18.v181 .v17Readiness>i{height:7px!important;margin-top:4px!important}
html.v18.v181 .v17BossBody>button{height:42px!important;padding:8px 10px!important;font-size:11px!important}

/* Combat overlay: no microscopic logs or ships. */
html.v18.v181 #bossBattleStage.v181BattleOverlay{inset:18px!important;padding:14px!important;grid-template-rows:44px minmax(0,1fr) minmax(150px,27vh)!important;gap:9px!important}
html.v18.v181 #bossBattleStage.v181BattleOverlay .battleControls{height:44px!important}
html.v18.v181 #bossBattleStage.v181BattleOverlay .battleControls:before{font-size:14px!important}
html.v18.v181 #bossBattleStage.v181BattleOverlay .battleControls button{height:34px!important;font-size:10px!important;padding:6px 10px!important}
html.v18.v181 #bossBattleStage.v181BattleOverlay .battleArena{padding:12px!important;gap:12px!important;grid-template-columns:minmax(0,1fr) 60px minmax(0,1fr)!important}
html.v18.v181 #bossBattleStage.v181BattleOverlay .battleSide{gap:8px!important}
html.v18.v181 #bossBattleStage.v181BattleOverlay .battleSide>h3{font-size:12px!important}
html.v18.v181 #bossBattleStage.v181BattleOverlay .battleVs{font-size:34px!important}
html.v18.v181 #bossBattleStage.v181BattleOverlay .battleShip{grid-template-columns:96px minmax(0,1fr)!important;gap:10px!important;padding:9px!important}
html.v18.v181 #bossBattleStage.v181BattleOverlay .battleShip img{width:96px!important;height:62px!important}
html.v18.v181 #bossBattleStage.v181BattleOverlay .battleShip b{font-size:11px!important}
html.v18.v181 #bossBattleStage.v181BattleOverlay .battleShip span,html.v18.v181 #bossBattleStage.v181BattleOverlay .battleShip small{font-size:9px!important}
html.v18.v181 #bossBattleStage.v181BattleOverlay .hpBar{height:9px!important;margin:5px 0!important}
html.v18.v181 #bossBattleStage.v181BattleOverlay .battleLog{padding:9px!important}
html.v18.v181 #bossBattleStage.v181BattleOverlay .battleLogRows>div{grid-template-columns:72px minmax(0,1fr)!important;gap:8px!important;padding:5px 7px!important;font-size:10px!important}

/* 1366px laptops keep labels where possible and fall back gracefully. */
@media(max-width:1500px){
  html.v18.v181 header{grid-template-columns:220px minmax(0,1fr)!important}
  html.v18.v181 header h1{font-size:16px!important}
  html.v18.v181 .v17NavBtn{padding:7px 6px!important;font-size:10px!important}
  html.v18.v181 .v17World{grid-template-columns:190px minmax(570px,1fr) 205px!important}
  html.v18.v181 .v17BossCard,html.v18.v181 .v17BossCard:last-child{grid-template-columns:minmax(210px,40%) minmax(0,60%)!important}
}
@media(max-width:1250px){
  html.v18.v181 .v17NavBtn span{display:none!important}
  html.v18.v181 .v17World{grid-template-columns:190px minmax(560px,1fr)!important}
  html.v18.v181 .v17RightSide{grid-column:1/-1!important;grid-template-columns:repeat(3,1fr)!important;max-height:none!important}
  html.v18.v181 .v17BossGrid{grid-template-columns:1fr!important}
  html.v18.v181 .v17BossCard:last-child{grid-column:auto!important;width:100%!important}
}
@media(max-width:860px){
  html.v18.v181 header{grid-template-columns:1fr!important}
  html.v18.v181 #resources{position:relative!important;top:auto!important;height:auto!important;grid-template-columns:repeat(3,1fr)!important;overflow:visible!important}
  html.v18.v181 .v17World{grid-template-columns:1fr!important}
  html.v18.v181 .v17RightSide{grid-template-columns:1fr!important}
  html.v18.v181 .v17BossCard,html.v18.v181 .v17BossCard:last-child{grid-template-columns:1fr!important}
  html.v18.v181 .v17BossImage{min-height:240px!important}
}
