/* BLACK PIRATE KINGDOM V18.1 — single-screen gameplay, battle overlay and living ocean */

/* The pools now live in the resource strip, never as a floating box. */
html.v18.v181 .globalPools{display:none!important}
html.v18.v181 #resources{
  top:54px!important;
  min-height:42px!important;
  height:42px;
  padding:0 5px!important;
  padding-right:5px!important;
  display:grid!important;
  grid-template-columns:repeat(12,minmax(64px,1fr))!important;
  gap:0!important;
  overflow:hidden!important;
}
html.v18.v181 #resources .v17Resource{
  min-width:0!important;
  height:42px;
  grid-template-columns:15px minmax(0,1fr)!important;
  column-gap:4px!important;
  padding:4px 5px!important;
}
html.v18.v181 #resources .v17Resource img,
html.v18.v181 #resources .v17Resource .solGlyph{width:15px!important;height:15px!important;font-size:17px!important}
html.v18.v181 #resources .v17Resource span:not(.solGlyph){font-size:6.2px!important;letter-spacing:.02em!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
html.v18.v181 #resources .v17Resource b{font-size:10px!important;line-height:1!important;white-space:nowrap}
html.v18.v181 #resources .v181PoolCell{background:linear-gradient(180deg,rgba(30,23,9,.82),rgba(5,20,25,.96))!important;border-left:1px solid #85652e!important}
html.v18.v181 #resources .v181PoolCell .v181PoolGlyph{grid-row:1/3;align-self:center;font-size:14px;filter:drop-shadow(0 0 5px #d8aa4c88)}
html.v18.v181 #resources .v181PoolCell b{color:#f0bf58!important}

/* More compact top HUD. */
html.v18.v181 header{min-height:54px!important;height:54px;padding:4px 8px!important;grid-template-columns:178px minmax(0,1fr)!important}
html.v18.v181 header>div:first-child:before{width:35px!important;height:35px!important;flex-basis:35px!important;background-size:25px!important}
html.v18.v181 header h1{font-size:13px!important;line-height:1!important;letter-spacing:1.65px!important}
html.v18.v181 #captain{font-size:8px!important;margin-top:1px!important}
html.v18.v181 .v17NavBtn{min-height:29px!important;height:29px!important;padding:4px 6px!important}
html.v18.v181 .v17NavBtn img{width:15px!important;height:15px!important}
html.v18.v181 .v17UtilityBtn{min-height:29px!important;height:29px!important;padding:4px 7px!important}
html.v18.v181 .languagePicker select{height:29px!important;min-width:91px!important;padding:2px 4px!important}

/* WORLD MAP: the page itself never needs vertical scrolling on desktop. */
html.v18.v181 body[data-page="world"]{height:100vh;overflow:hidden!important}
html.v18.v181 body[data-page="world"] #game{height:100vh;overflow:hidden}
html.v18.v181 body[data-page="world"] main{
  height:calc(100vh - 96px);
  min-height:0;
  overflow:hidden;
  padding:4px 6px 5px!important;
}
html.v18.v181 body[data-page="world"] #app{height:calc(100vh - 96px);min-height:0}
html.v18.v181 .v17World{
  height:100%;
  min-height:0;
  grid-template-columns:154px minmax(0,1fr) 176px!important;
  gap:5px!important;
  align-items:stretch!important;
}
html.v18.v181 .v17WorldCenter{height:100%;min-height:0;display:flex;flex-direction:column}
html.v18.v181 .v17WorldTopbar{display:none!important}
html.v18.v181 .v17Side{
  position:relative!important;
  top:auto!important;
  height:100%;
  max-height:none!important;
  overflow:hidden!important;
  align-content:start;
  gap:5px!important;
}
html.v18.v181 .v17Panel{padding:5px!important;min-width:0}
html.v18.v181 .v17PanelTitle{padding-bottom:3px!important;margin-bottom:4px!important;gap:3px!important}
html.v18.v181 .v17PanelTitle>span{font-size:7.4px!important;letter-spacing:.04em!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html.v18.v181 .v17PanelTitle button{font-size:6.3px!important;padding:3px 4px!important;white-space:nowrap}
html.v18.v181 .v17FleetList{gap:2px!important}
html.v18.v181 .v17FleetList article{grid-template-columns:38px minmax(0,1fr)!important;gap:3px!important;padding:3px!important}
html.v18.v181 .v17FleetList img{width:38px!important;height:27px!important}
html.v18.v181 .v17FleetList b{font-size:7.3px!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html.v18.v181 .v17FleetList span,html.v18.v181 .v17FleetList small{font-size:6.4px!important}
html.v18.v181 .v17Hull{height:3px!important;margin:2px 0!important}
html.v18.v181 .v17FleetPower{padding:3px!important;margin-top:3px!important}
html.v18.v181 .v17FleetPower span{font-size:7px!important}
html.v18.v181 .v17FleetPower b{font-size:14px!important}
html.v18.v181 .v17DailyMini{gap:3px!important}
html.v18.v181 .v17DailyMini article{grid-template-columns:15px minmax(0,1fr)!important;gap:3px!important}
html.v18.v181 .v17DailyMini article>span{width:14px!important;height:14px!important;font-size:6px!important}
html.v18.v181 .v17DailyMini b{font-size:7px!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html.v18.v181 .v17DailyMini small{font-size:6px!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html.v18.v181 .v17DailyMini i{height:2px!important;margin-top:2px!important}
html.v18.v181 .v17Production{gap:1px!important}
html.v18.v181 .v17Production>div{grid-template-columns:12px minmax(0,1fr) auto!important;gap:2px!important;padding:2px 0!important}
html.v18.v181 .v17Production img{width:11px!important;height:11px!important}
html.v18.v181 .v17Production span,html.v18.v181 .v17Production b{font-size:6.3px!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

html.v18.v181 .worldEventBanner{min-height:27px;margin:0 0 3px!important;padding:4px 7px!important;gap:6px!important;border-radius:4px!important;white-space:nowrap;overflow:hidden}
html.v18.v181 .worldEventBanner b{font-size:8px!important;flex:0 0 auto}
html.v18.v181 .worldEventBanner span{font-size:7px!important;overflow:hidden;text-overflow:ellipsis}
html.v18.v181 .worldEventBanner small{font-size:6.2px!important;flex:0 0 auto}
html.v18.v181 .v17MapToolbar{height:31px;min-height:31px;margin:0 0 3px!important;gap:4px!important}
html.v18.v181 .v17MapToolbar .seaZoneTabs{gap:4px!important}
html.v18.v181 .v17MapToolbar .seaZoneTabs button{min-width:86px!important;height:27px;padding:4px 6px!important;font-size:7.5px!important}
html.v18.v181 .v17ControlHint{font-size:6.8px!important;line-height:1.15!important;padding-left:4px!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html.v18.v181 .v17MapFrame{flex:1;min-height:0;height:auto;overflow:hidden}
html.v18.v181 .v17SeaViewport{height:100%!important;min-height:0!important;max-height:none!important}
html.v18.v181 .v17CoordinateHud{left:4px!important;top:4px!important;gap:2px!important}
html.v18.v181 .v17CoordinateHud span{min-width:59px!important;padding:3px 4px!important}
html.v18.v181 .v17CoordinateHud small{font-size:5.5px!important}
html.v18.v181 .v17CoordinateHud b{font-size:7.5px!important;margin-top:1px!important}
html.v18.v181 .v17Compass{width:47px!important;height:47px!important;right:7px!important;top:7px!important}
html.v18.v181 .v17SeaViewport .seaHint{bottom:5px!important;padding:3px 7px!important;font-size:6.5px!important}

/* Right side cards: no text collisions and no panel spill. */
html.v18.v181 .v17BossQuick{gap:2px!important}
html.v18.v181 .v17BossQuick>button{grid-template-columns:40px minmax(0,1fr)!important;gap:3px!important;min-height:34px;padding-right:39px!important}
html.v18.v181 .v17BossQuick img{width:40px!important;height:32px!important}
html.v18.v181 .v17BossQuick b{font-size:6.9px!important;line-height:1.05;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html.v18.v181 .v17BossQuick small{font-size:5.7px!important;line-height:1.1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html.v18.v181 .v17BossQuick em{font-size:5.4px!important;right:2px!important;top:2px!important;max-width:36px;text-align:center;white-space:normal;line-height:1.05}
html.v18.v181 .v17Inspect{min-height:112px!important;padding:5px!important;overflow:hidden}
html.v18.v181 .v17Inspect .eyebrow{font-size:6px!important}
html.v18.v181 .v17Inspect h2,html.v18.v181 .v17Inspect h3{font-size:12px!important;margin:4px 0!important}
html.v18.v181 .v17Inspect p{font-size:7px!important;line-height:1.25;margin:4px 0!important}
html.v18.v181 .v17Inspect .inspectShip{height:48px!important}
html.v18.v181 .v17Inspect .inspectStats{gap:3px!important}
html.v18.v181 .v17Inspect .inspectStats div{padding:3px!important}
html.v18.v181 .v17Inspect .inspectStats b{font-size:8px!important}
html.v18.v181 .v17Inspect .inspectStats span{font-size:5.5px!important}
html.v18.v181 .seaLegend{gap:2px!important;margin-top:5px!important;font-size:6.5px!important;grid-template-columns:1fr 1fr}
html.v18.v181 .v17WalletMini>div:last-child span{font-size:6px!important}
html.v18.v181 .v17WalletMini>div:last-child b{font-size:13px!important;margin:2px 0!important}
html.v18.v181 .v17WalletMini>div:last-child small{font-size:5.8px!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html.v18.v181 .v17MiniResources{gap:2px!important}
html.v18.v181 .v17MiniResource{padding:2px!important;grid-template-columns:11px minmax(0,1fr)!important}
html.v18.v181 .v17MiniResource img{width:10px!important;height:10px!important}
html.v18.v181 .v17MiniResource span{font-size:5.4px!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html.v18.v181 .v17MiniResource b{font-size:6.8px!important}

/* A noticeably more alive sea: moving light, currents, foam and cloud shadows. */
html.v18.v181 .v17SeaStage{background:#073746!important}
html.v18.v181 .v17OceanTexture{
  filter:saturate(1.42) contrast(1.13) brightness(1.08)!important;
  background-size:112% 112%!important;
  animation:v181OceanPan 30s ease-in-out infinite alternate;
}
html.v18.v181 .v17OceanTexture:before{
  content:"";position:absolute;inset:-18%;pointer-events:none;
  background:
    radial-gradient(ellipse at 18% 30%,rgba(91,227,244,.18),transparent 21%),
    radial-gradient(ellipse at 73% 65%,rgba(55,194,218,.15),transparent 24%),
    repeating-linear-gradient(116deg,transparent 0 52px,rgba(171,243,250,.045) 54px 56px,transparent 58px 112px);
  mix-blend-mode:screen;filter:blur(1px);
  animation:v181Caustics 18s linear infinite;
}
html.v18.v181 .v17OceanTexture:after{
  background:
    radial-gradient(circle at 45% 45%,transparent 0 34%,rgba(0,8,13,.38) 100%),
    repeating-radial-gradient(ellipse at center,transparent 0 23px,rgba(183,244,250,.055) 25px 26px,transparent 29px 52px)!important;
  animation:v181Current 24s linear infinite!important;
}
html.v18.v181 .v181SeaFx{position:absolute;inset:0;z-index:3;pointer-events:none;overflow:hidden;mix-blend-mode:screen}
html.v18.v181 .v181SeaFx i{position:absolute;width:72px;height:8px;border-radius:50%;border-top:1px solid rgba(194,249,255,.36);filter:blur(.15px);opacity:.24;animation:v181Foam var(--dur) linear infinite;animation-delay:var(--delay)}
html.v18.v181 .v17SeaStage:after{content:"";position:absolute;inset:-20%;z-index:5;pointer-events:none;background:radial-gradient(ellipse at 30% 20%,rgba(0,0,0,.18),transparent 28%),radial-gradient(ellipse at 78% 74%,rgba(0,0,0,.22),transparent 26%);filter:blur(20px);animation:v181CloudShadow 34s ease-in-out infinite alternate}
html.v18.v181 .seaWater{opacity:.25!important;animation-duration:12s!important}
html.v18.v181 .seaWaterB{opacity:.17!important;animation-duration:19s!important}
html.v18.v181 .v17Fog{opacity:.72}
html.v18.v181 .seaVessel .wake{border-bottom-width:4px!important;box-shadow:0 5px 10px rgba(164,240,250,.28);animation-duration:.72s!important}
@keyframes v181OceanPan{0%{background-position:42% 47%;transform:scale(1.04)}100%{background-position:58% 53%;transform:scale(1.08)}}
@keyframes v181Current{to{background-position:520px 260px,-410px 300px}}
@keyframes v181Caustics{0%{transform:translate3d(-4%,-3%,0) rotate(0deg)}100%{transform:translate3d(8%,6%,0) rotate(2deg)}}
@keyframes v181CloudShadow{0%{transform:translate3d(-5%,-2%,0)}100%{transform:translate3d(7%,5%,0)}}
@keyframes v181Foam{0%{transform:translate3d(-130px,0,0) scaleX(.5);opacity:0}12%{opacity:.28}70%{opacity:.18}100%{transform:translate3d(720px,-28px,0) scaleX(1.35);opacity:0}}

/* BOSS MAP: five bosses fit into one desktop viewport. */
html.v18.v181 body[data-page="boss"]{height:100vh;overflow:hidden!important}
html.v18.v181 body[data-page="boss"] #game{height:100vh;overflow:hidden}
html.v18.v181 body[data-page="boss"] main{height:calc(100vh - 96px);min-height:0;overflow:hidden;padding:4px 7px!important;max-width:none!important}
html.v18.v181 body[data-page="boss"] #app{height:calc(100vh - 96px);min-height:0}
html.v18.v181 .v17BossPage{height:100%;min-height:0;display:flex!important;flex-direction:column;gap:5px!important;overflow:hidden}
html.v18.v181 .v17BossHeader{flex:0 0 54px;min-height:54px;padding:2px 3px 4px!important;align-items:center!important}
html.v18.v181 .v17BossHeader .eyebrow{font-size:7px!important}
html.v18.v181 .v17BossHeader h2{font-size:25px!important;margin:0!important;line-height:1.05}
html.v18.v181 .v17BossHeader p{font-size:7px!important;margin:2px 0!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html.v18.v181 .v17BossPower{width:55px!important;height:55px!important}
html.v18.v181 .v17BossPower span{font-size:5.5px!important}
html.v18.v181 .v17BossPower b{font-size:14px!important;margin-top:1px!important}
html.v18.v181 .v17BossGrid{flex:1;min-height:0;display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;grid-template-rows:repeat(2,minmax(0,1fr));gap:5px!important}
html.v18.v181 .v17BossCard,html.v18.v181 .v17BossCard:last-child{grid-column:auto!important;max-width:none!important;width:auto!important;min-height:0!important;height:100%;grid-template-columns:42% minmax(0,58%)!important}
html.v18.v181 .v17BossImage{min-height:0!important;height:100%}
html.v18.v181 .v17BossImage>span{left:5px!important;top:5px!important;padding:2px 4px!important;font-size:5.5px!important}
html.v18.v181 .v17BossBody{padding:7px!important;min-width:0}
html.v18.v181 .v17BossName{gap:3px!important}
html.v18.v181 .v17BossName h3{font-size:13px!important;line-height:1.05;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html.v18.v181 .v17BossName em{font-size:5.5px!important;padding:2px 3px!important;white-space:nowrap}
html.v18.v181 .v17BossBody>p{font-size:6.5px!important;line-height:1.18!important;margin:4px 0!important;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
html.v18.v181 .v17BossStats{gap:2px!important;margin:3px 0!important;grid-template-columns:.72fr .52fr 1.4fr!important}
html.v18.v181 .v17BossStats span{padding:3px!important;min-width:0}
html.v18.v181 .v17BossStats small{font-size:4.8px!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html.v18.v181 .v17BossStats b{font-size:6.5px!important;margin-top:1px!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html.v18.v181 .v17Readiness{margin:2px 0 4px!important}
html.v18.v181 .v17Readiness label{font-size:5.5px!important}
html.v18.v181 .v17Readiness>i{height:4px!important;margin-top:2px!important}
html.v18.v181 .v17BossBody>button{height:25px;padding:3px 5px!important;font-size:7px!important}

/* Boss combat opens over the page, not underneath the cards. */
html.v18.v181 #bossBattleStage.v181BattleOverlay{
  position:fixed!important;
  inset:8px!important;
  z-index:5000!important;
  margin:0!important;
  width:auto!important;
  height:auto!important;
  max-height:none!important;
  padding:8px!important;
  display:grid!important;
  grid-template-rows:34px minmax(0,1fr) minmax(105px,25vh);
  gap:5px;
  overflow:hidden!important;
  background:radial-gradient(circle at 50% 42%,rgba(17,64,76,.98),rgba(2,10,14,.99) 68%)!important;
  border:1px solid #d3a23f!important;
  box-shadow:0 0 0 9999px rgba(0,0,0,.88),0 0 55px rgba(214,166,63,.22)!important;
}
html.v18.v181 #bossBattleStage.v181BattleOverlay .battleControls{height:34px;margin:0!important;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #594522;padding-bottom:5px}
html.v18.v181 #bossBattleStage.v181BattleOverlay .battleControls:before{content:"BLACK PIRATE KINGDOM · NAVAL COMBAT";font:700 12px Georgia;color:#e8bd68;letter-spacing:.12em}
html.v18.v181 #bossBattleStage.v181BattleOverlay .battleControls>div{display:flex;gap:5px}
html.v18.v181 #bossBattleStage.v181BattleOverlay .battleControls button{height:27px;padding:3px 8px!important;font-size:8px!important}
html.v18.v181 #bossBattleStage.v181BattleOverlay .battleArena{min-height:0!important;height:100%;margin:0!important;padding:7px!important;gap:7px!important;grid-template-columns:minmax(0,1fr) 46px minmax(0,1fr)!important;border-radius:6px!important;overflow:hidden}
html.v18.v181 #bossBattleStage.v181BattleOverlay .battleSide{gap:4px!important;min-height:0}
html.v18.v181 #bossBattleStage.v181BattleOverlay .battleSide>h3{font-size:9px!important;margin:0 0 2px!important;letter-spacing:.12em}
html.v18.v181 #bossBattleStage.v181BattleOverlay .battleVs{font-size:24px!important}
html.v18.v181 #bossBattleStage.v181BattleOverlay .battleShip{grid-template-columns:70px minmax(0,1fr)!important;gap:6px!important;min-height:0;padding:5px!important;border-radius:5px!important}
html.v18.v181 #bossBattleStage.v181BattleOverlay .battleShip img{width:70px!important;height:44px!important;background:linear-gradient(#174854,#071b22)!important}
html.v18.v181 #bossBattleStage.v181BattleOverlay .battleShip b{font-size:8px!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html.v18.v181 #bossBattleStage.v181BattleOverlay .battleShip span,html.v18.v181 #bossBattleStage.v181BattleOverlay .battleShip small{font-size:6.5px!important}
html.v18.v181 #bossBattleStage.v181BattleOverlay .hpBar{height:7px!important;margin:3px 0!important}
html.v18.v181 #bossBattleStage.v181BattleOverlay .damagePop{font-size:15px!important}
html.v18.v181 #bossBattleStage.v181BattleOverlay .battleLog{height:100%;max-height:none!important;margin:0!important;padding:5px!important;border-radius:5px!important;overflow:auto}
html.v18.v181 #bossBattleStage.v181BattleOverlay .battleLog>h3{display:none}
html.v18.v181 #bossBattleStage.v181BattleOverlay .battleLogRows>div{grid-template-columns:52px minmax(0,1fr)!important;gap:5px!important;padding:3px 4px!important;font-size:7px!important}
html.v18.v181 body.v181BattleOpen{overflow:hidden!important}

/* Sensible fallback: smaller screens can scroll rather than becoming unusable. */
@media(max-width:1280px),(max-height:720px){
  html.v18.v181 body[data-page="world"],html.v18.v181 body[data-page="boss"]{height:auto;overflow:auto!important}
  html.v18.v181 body[data-page="world"] #game,html.v18.v181 body[data-page="boss"] #game{height:auto;overflow:visible}
  html.v18.v181 body[data-page="world"] main,html.v18.v181 body[data-page="boss"] main{height:auto;min-height:calc(100vh - 96px);overflow:visible}
  html.v18.v181 .v17World{height:auto;grid-template-columns:150px minmax(520px,1fr)!important}
  html.v18.v181 .v17RightSide{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,1fr);height:auto}
  html.v18.v181 .v17SeaViewport{height:62vh!important;min-height:460px!important}
  html.v18.v181 .v17BossPage{height:auto;overflow:visible}
  html.v18.v181 .v17BossGrid{grid-template-columns:repeat(2,minmax(0,1fr))!important;grid-template-rows:none}
  html.v18.v181 .v17BossCard,html.v18.v181 .v17BossCard:last-child{min-height:230px!important;height:auto}
}
@media(max-width:860px){
  html.v18.v181 #resources{position:relative!important;top:auto!important;height:auto;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 .v17BossGrid{grid-template-columns:1fr!important}
  html.v18.v181 #bossBattleStage.v181BattleOverlay{inset:3px!important;grid-template-rows:34px minmax(0,1fr) 135px}
  html.v18.v181 #bossBattleStage.v181BattleOverlay .battleArena{grid-template-columns:1fr!important;overflow:auto}
  html.v18.v181 #bossBattleStage.v181BattleOverlay .battleVs{font-size:16px!important;padding:0}
}
/* Icon-only navigation keeps long Turkish/German labels from colliding. */
html.v18.v181 .v17NavBtn span{display:none!important}
html.v18.v181 .v17NavBtn{justify-content:center}
html.v18.v181 #resources .v181PoolCell .v181PoolGlyph{grid-column:1!important;grid-row:1/3!important;display:grid!important;place-content:center!important}
html.v18.v181 .v17BossCard,html.v18.v181 .v17BossCard:last-child{justify-self:stretch!important;align-self:stretch!important}