.world-page{
  width:min(1400px,100%);
  margin:0 auto;
  padding:clamp(22px,3.5vw,44px) clamp(16px,2vw,28px) 80px;
}

.world-hero{
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(220px,260px);
  align-items:end;
  gap:clamp(22px,4vw,52px);
  min-height:390px;
  padding:clamp(28px,5vw,68px);
  overflow:hidden;
  isolation:isolate;
  border:1px solid rgba(195,222,216,.2);
  background:#0a2027 url("assets/fenix-sea-bridge.webp") center 48%/cover no-repeat;
}
.world-hero::before{
  position:absolute;
  z-index:-1;
  inset:0;
  content:"";
  background:linear-gradient(90deg,rgba(4,15,20,.96),rgba(4,15,20,.77) 49%,rgba(4,15,20,.15)),linear-gradient(0deg,rgba(4,15,20,.72),transparent 65%);
}
.world-hero .kicker{margin-bottom:18px}
.world-hero h1{
  max-width:820px;
  margin:0;
  color:#f1efe7;
  font-size:clamp(40px,5vw,64px);
  line-height:1;
  letter-spacing:-.045em;
  text-wrap:balance;
}
.world-lead{
  max-width:740px;
  margin:20px 0 0;
  color:#c0cfca;
  font-size:clamp(16px,1.5vw,18px);
  line-height:1.65;
}
.world-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:26px}
.world-update{
  display:grid;
  align-self:end;
  gap:7px;
  padding:18px;
  border:1px solid rgba(232,174,106,.42);
  background:rgba(6,19,25,.82);
  backdrop-filter:blur(8px);
}
.world-update strong{font-size:15px}
.world-update>span:last-child{color:var(--muted);font-size:13px;line-height:1.5}

.world-map-panel,.world-state-section,.world-events-section{
  margin-top:28px;
  padding:clamp(18px,2.5vw,28px);
  border:1px solid var(--line);
  background:rgba(9,29,36,.92);
  box-shadow:var(--shadow);
}
.world-section-heading{
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:24px;
  margin-bottom:20px;
}
.world-section-heading .kicker{margin:0 0 8px}
.world-section-heading h2,.world-rules-strip h2{
  margin:0;
  font-family:"Arial Narrow",Bahnschrift,"Segoe UI",sans-serif;
  font-size:clamp(26px,3.3vw,40px);
  line-height:1.08;
  letter-spacing:-.03em;
  text-wrap:balance;
}
.world-section-heading>a{
  flex:0 0 auto;
  color:var(--blue);
  font-size:13px;
  font-weight:800;
  text-underline-offset:4px;
}
.world-section-heading>a:hover{color:var(--text)}
.world-section-note{
  max-width:430px;
  margin:0;
  color:var(--muted);
  font-size:14px;
  line-height:1.6;
}
.castle-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px}
.castle-card{
  display:grid;
  align-content:start;
  gap:12px;
  min-height:220px;
  padding:18px;
  border:1px solid var(--line);
  background:linear-gradient(160deg,rgba(19,48,56,.92),rgba(7,22,28,.96));
}
.castle-card-capital{border-color:rgba(232,174,106,.52)}
.castle-card h3{margin:0;color:var(--text);font-size:18px;line-height:1.25}
.castle-status{
  width:max-content;
  max-width:100%;
  padding:5px 8px;
  border:1px solid rgba(86,205,188,.2);
  background:rgba(86,205,188,.12);
  color:var(--green);
  font-size:12px;
  font-weight:700;
}
.castle-status-owned{border-color:rgba(131,200,208,.22);background:rgba(131,200,208,.14);color:var(--blue)}
.castle-status-capital{border-color:rgba(232,174,106,.22);background:rgba(232,174,106,.13);color:var(--yellow)}
.castle-detail{display:grid;gap:4px;min-width:0}
.castle-detail span{color:var(--muted);font-size:12px;line-height:1.4}
.castle-detail strong{font-size:14px;line-height:1.45;overflow-wrap:anywhere}
.castle-coords{color:var(--muted);font-size:12px;line-height:1.5;overflow-wrap:anywhere}
.world-tax-note{margin:18px 0 0;color:var(--muted);font-size:14px;line-height:1.6}
.world-loading{grid-column:1/-1;margin:4px 0;color:var(--muted)}
.world-error{margin:14px 0 0;color:var(--yellow)}

.world-events{display:flex;flex-wrap:wrap;justify-content:center;gap:14px}
.world-event{
  flex:1 1 280px;
  max-width:420px;
  padding:18px;
  border:1px solid var(--line);
  background:rgba(13,37,45,.9);
}
.world-event-type{color:var(--yellow);font-size:11px;font-weight:800;letter-spacing:.09em;text-transform:uppercase}
.world-event h3{margin:10px 0 7px;color:var(--text);font-size:18px;line-height:1.3}
.world-event p{margin:0;color:var(--muted);font-size:14px;line-height:1.6}
.world-empty{
  width:100%;
  margin:0;
  padding:30px 18px;
  border:1px dashed rgba(195,222,216,.2);
  color:var(--muted);
  text-align:center;
}

.world-rules-strip{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:32px;
  margin-top:28px;
  padding:clamp(22px,3vw,34px);
  border:1px solid rgba(131,200,208,.28);
  background:rgba(13,37,45,.9);
}
.world-rules-strip .kicker{margin:0 0 9px}
.world-rules-strip p:not(.kicker){max-width:740px;margin:12px 0 0;color:var(--muted);line-height:1.65}
.world-rules-strip .btn{flex:0 0 auto}

@media(max-width:1100px){
  .castle-grid{grid-template-columns:repeat(6,minmax(0,1fr))}
  .castle-card{grid-column:span 2}
  .castle-card:nth-child(4){grid-column:2/span 2}
  .castle-card:nth-child(5){grid-column:4/span 2}
}
@media(max-width:860px){
  .world-hero{grid-template-columns:minmax(0,1fr) 220px;gap:24px}
  .world-hero h1{font-size:clamp(40px,5.8vw,54px)}
  .world-section-heading{align-items:start}
}
@media(max-width:720px){
  .world-page{padding:20px 16px 56px}
  .world-hero{grid-template-columns:1fr;min-height:520px;padding:28px 22px;background-position:58% center}
  .world-hero::before{background:linear-gradient(90deg,rgba(4,15,20,.8),rgba(4,15,20,.36)),linear-gradient(0deg,rgba(4,15,20,.97),rgba(4,15,20,.08) 82%)}
  .world-hero h1{max-width:650px;font-size:clamp(40px,9vw,58px)}
  .world-update{width:min(100%,380px);align-self:start}
  .world-section-heading{flex-direction:column;gap:12px;margin-bottom:16px}
  .world-map-panel,.world-state-section,.world-events-section{margin-top:20px;padding:18px}
  .atlas-layout{grid-template-columns:1fr}
  .atlas-map-canvas{height:62svh;min-height:430px;max-height:640px}
  .atlas-sidebar{padding:18px}
  .castle-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .castle-card,.castle-card:nth-child(4),.castle-card:nth-child(5){grid-column:auto}
  .castle-card:last-child{grid-column:1/-1;width:min(100%,460px);justify-self:center}
  .world-rules-strip{align-items:flex-start;flex-direction:column;gap:20px;margin-top:20px}
}
@media(max-width:480px){
  .world-page{padding-inline:14px}
  .world-hero{min-height:540px;padding:24px 18px}
  .world-hero h1{font-size:clamp(38px,10vw,48px)}
  .world-actions{align-items:stretch;flex-direction:column}
  .world-actions .btn{width:100%}
  .world-map-panel,.world-state-section,.world-events-section{padding:15px}
  .atlas-map-canvas{height:56svh;min-height:380px}
  .atlas-map-toolbar{top:10px;right:10px;left:10px}
  .atlas-map-caption{padding:8px 9px;font-size:8px;letter-spacing:.08em}
  .atlas-map-controls{gap:4px}
  .atlas-map-controls button{width:34px;height:34px}
  .atlas-map-footer{padding:8px 10px;font-size:9px}
  .atlas-map-footer span:last-child{display:none}
  .castle-grid{grid-template-columns:1fr}
  .castle-card:last-child{grid-column:auto;width:100%}
}