/* Postos avançados no mapa mundial e gestão interna */
.map-node.outpost-node {
  width:220px;
  z-index:7;
}
.map-node.outpost-node .outpost-node-btn {
  width:58px;
  height:58px;
  padding:0;
  border:2px solid #d4b06a;
  border-radius:12px;
  background:linear-gradient(#d2b071,#7a4f24);
  box-shadow:0 8px 16px #0009, inset 0 1px #fff8;
  position:relative;
}
.map-node.outpost-node .outpost-node-btn::before {
  content:"";
  position:absolute;
  inset:6px 8px 7px;
  border-radius:7px 7px 3px 3px;
  background:linear-gradient(#744320,#3f2719);
  clip-path:polygon(0 42%,18% 42%,18% 22%,36% 22%,36% 42%,49% 42%,49% 16%,66% 16%,66% 42%,83% 42%,83% 26%,100% 26%,100% 100%,0 100%);
  box-shadow:inset 0 0 0 2px #f0d08a55;
}
.map-node.outpost-node .outpost-node-icon {
  position:absolute;
  right:-8px;
  top:-9px;
  width:25px;
  height:25px;
  display:grid;
  place-items:center;
  border:1px solid #6b441c;
  border-radius:50%;
  color:#231707;
  background:#f2ce73;
  box-shadow:0 3px 8px #0009;
  font-size:15px;
  z-index:2;
  margin:0;
  padding:0;
  pointer-events:none;
}



/* v0.1.130 — tooltip dos postos avançados mais largo e organizado em linhas */
.map-node.outpost-node .outpost-map-label {
  display:block;
  width:max-content;
  min-width:178px;
  max-width:245px;
  margin:5px auto 0;
  padding:6px 10px 7px;
  color:white;
  background:linear-gradient(#1f1a10f2,#11120beb);
  border:1px solid #d0a65d;
  border-radius:6px;
  box-shadow:0 5px 12px #000a, inset 0 1px #ffffff18;
  text-align:center;
  text-shadow:0 1px 2px #000;
  pointer-events:none;
  box-sizing:border-box;
}
.map-node.outpost-node .outpost-map-label strong {
  display:block;
  color:#fff8df;
  font-size:11px;
  line-height:1.2;
  font-weight:900;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.map-node.outpost-node .outpost-map-label small {
  display:block;
  margin-top:3px;
  color:#e6d7aa;
  font-size:9px;
  line-height:1.25;
  font-weight:700;
}
.map-node.outpost-node .outpost-map-label small em {
  display:block;
  font-style:normal;
  white-space:nowrap;
}
.map-node.outpost-node.owned .outpost-map-label {
  border-color:#ffe29b;
  background:linear-gradient(#4b3315f2,#231609ee);
}
.map-node.outpost-node .outpost-node-icon {
  right:-12px;
  top:-12px;
}

.map-node.outpost-node.owned .outpost-node-btn {
  border-color:#fff0aa;
  background:linear-gradient(#f0d28a,#9b6b25);
  box-shadow:0 0 18px #ffd86a66,0 8px 16px #0009, inset 0 1px #fff8;
}
.map-node.outpost-node.rare .outpost-node-btn {
  border-color:#fff2b2;
  box-shadow:0 0 22px #f7d56a88,0 8px 16px #0009, inset 0 1px #fff8;
}
.map-node.outpost-node.taken .outpost-node-btn {
  filter:grayscale(.25) brightness(.85);
}

.outpost-open-card,
.outpost-manage-head {
  display:flex;
  gap:13px;
  align-items:center;
  border:1px solid #6d5730;
  border-radius:10px;
  padding:12px;
  background:linear-gradient(#332a1d,#221b14);
  box-shadow:inset 0 1px #fff1;
  margin-bottom:12px;
}
.outpost-open-card.rare,
.outpost-manage-head.rare {
  border-color:#f1d98e;
  box-shadow:0 0 18px #d7a84a33, inset 0 1px #fff2;
}
.outpost-open-icon {
  width:54px;
  height:54px;
  display:grid;
  place-items:center;
  flex:0 0 auto;
  border:2px solid #d6a94e;
  border-radius:13px;
  background:linear-gradient(#d6a94e,#8a5923);
  font-size:29px;
}
.outpost-open-card h4 {
  margin:0 0 4px;
  color:#f5dc99;
}
.outpost-open-card p {
  margin:0 0 8px;
  color:#d8d1c3;
}

.outpost-resource-chip {
  display:inline-flex;
  align-items:center;
  gap:5px;
  vertical-align:middle;
  margin-right:6px;
}
.outpost-resource-chip .resource-svg-icon {
  width:18px;
  height:18px;
  flex:0 0 18px;
}
.outpost-resource-chip strong {
  color:#ffe3a2;
}
.outpost-resource-separator {
  color:#9d8552;
  margin:0 4px 0 0;
}

.outpost-resources,
.outpost-manage-head small {
  display:block;
  color:#f0d792;
  font-weight:800;
}
.outpost-warning,
.outpost-limit-text,
.outpost-queue {
  padding:9px 11px;
  border:1px solid #6b5735;
  border-radius:8px;
  background:#19150f;
  color:#f1dca6;
  margin:10px 0;
}
.outpost-limit-text {
  border-color:#8d4b4b;
  color:#f1a3a3;
}
.outpost-manage-head {
  justify-content:space-between;
}
.outpost-manage-head strong {
  display:block;
  color:#f5dc99;
}
.outpost-coords {
  color:#cbbf9d;
  font-size:12px;
  font-weight:800;
}
.outpost-production-line {
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin:10px 0 12px;
}
.outpost-production-line span {
  border:1px solid #4a5360;
  border-radius:7px;
  background:#151a20;
  padding:7px 9px;
  color:#dfe5e9;
}
.outpost-production-line strong {
  color:#7fca91;
}
.outpost-grid {
  display:grid;
  grid-template-columns:repeat(4,minmax(92px,1fr));
  gap:9px;
  margin-top:12px;
}
.outpost-slot {
  min-height:86px;
  padding:9px 7px;
  border:1px solid #66532f;
  border-radius:9px;
  background:linear-gradient(#b78a4e,#704823);
  color:#21180d;
  box-shadow:inset 0 1px #fff5,0 5px 10px #0004;
  text-align:center;
  position:relative;
}
.outpost-slot:hover:not(:disabled) {
  filter:brightness(1.08);
}
.outpost-slot.empty {
  border-style:dashed;
  color:#ffe7a7;
  background:#221914;
  font-size:28px;
}
.outpost-slot strong {
  display:block;
  font-size:24px;
  line-height:1;
  margin-bottom:4px;
}
.outpost-slot span,
.outpost-slot small,
.outpost-slot em {
  display:block;
}
.outpost-slot span {
  font-weight:900;
  font-size:12px;
}
.outpost-slot small {
  font-size:11px;
  color:#302013;
}
.outpost-slot em {
  position:absolute;
  left:5px;
  right:5px;
  bottom:5px;
  padding:3px 4px;
  border-radius:5px;
  background:#17120cdd;
  color:#ffe6a0;
  font-size:10px;
  font-style:normal;
}

@media (max-width:900px) {
  .outpost-grid { grid-template-columns:repeat(3,minmax(86px,1fr)); }
}

/* v0.1.88 — seleção de castelos e postos avançados como castelos secundários */
.location-selector {
  min-width:160px;
  max-width:260px;
  height:38px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:0 12px;
  border:2px solid #6b441c;
  border-radius:4px;
  background:linear-gradient(#f1d79c,#bf8345);
  box-shadow:inset 0 1px #fff8,0 3px 8px #0006;
  color:#2b1808;
  font-weight:900;
  font-size:13px;
  white-space:nowrap;
}
.location-selector span {
  overflow:hidden;
  text-overflow:ellipsis;
}
.location-selector b {
  width:21px;
  height:21px;
  display:grid;
  place-items:center;
  border:1px solid #8a6334;
  border-radius:3px;
  background:#f7e4b9;
  font-size:12px;
  line-height:1;
}
.location-selector:hover {
  filter:brightness(1.06);
}
.location-choice-list {
  display:grid;
  gap:9px;
}
.location-choice {
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:12px 13px;
  border:1px solid #6b5735;
  border-radius:9px;
  background:linear-gradient(#30271c,#1b1510);
  color:#f4dfaa;
  text-align:left;
}
.location-choice:hover:not(.disabled) {
  border-color:#e2bd62;
  filter:brightness(1.08);
}
.location-choice b,
.location-choice small {
  display:block;
}
.location-choice small {
  color:#cbbf9d;
  font-size:11px;
}
.location-choice.disabled {
  opacity:.7;
  pointer-events:none;
}

.map-node.outpost-node.occupying .outpost-node-btn {
  border-color:#f0d074;
  background:linear-gradient(#c9a35b,#604421);
  box-shadow:0 0 18px #e0b65788,0 8px 16px #0009, inset 0 1px #fff7;
}
.outpost-defense-preview {
  display:flex;
  align-items:center;
  gap:12px;
  margin:10px 0;
  padding:10px 12px;
  border:1px solid #6b5735;
  border-radius:8px;
  background:#17140f;
  color:#f0d792;
}
.outpost-defense-preview span,
.outpost-defense-preview small {
  color:#cbbf9d;
}
.outpost-defense-preview strong {
  color:#ffe3a2;
  font-size:18px;
}
.outpost-castle-view {
  background:radial-gradient(circle at center,#516a3f,#263623 78%);
}
.outpost-location-actions {
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}
.outpost-castle-strip {
  display:grid;
  grid-template-columns:1.05fr 1.4fr .85fr 1fr;
  gap:10px;
  margin-bottom:12px;
  padding:10px;
  border:2px solid #775b2b;
  border-radius:12px;
  background:linear-gradient(#3a2c1a,#1d1710);
  box-shadow:0 7px 18px #0006,inset 0 1px #fff1;
}
.outpost-castle-strip.rare {
  border-color:#e3c36b;
  box-shadow:0 0 18px #d7a84a44,0 7px 18px #0006,inset 0 1px #fff2;
}
.outpost-castle-strip > div {
  min-height:54px;
  padding:8px 10px;
  border:1px solid #5f4b2b;
  border-radius:8px;
  background:#17120c;
}
.outpost-castle-strip span {
  display:block;
  margin-bottom:4px;
  color:#cbbf9d;
  font-size:11px;
  font-weight:800;
}
.outpost-castle-strip strong {
  color:#ffe3a2;
  font-size:13px;
}
.outpost-castle-strip .outpost-resource-chip {
  display:inline-flex;
  margin:0 4px 3px 0;
}
.outpost-castle-board {
  min-height:520px;
  padding:28px;
  border:2px solid #6f6044;
  border-radius:14px;
  background:
    radial-gradient(circle at 24% 30%,#80a65e 0 13%,transparent 14%),
    radial-gradient(circle at 70% 65%,#5f8547 0 11%,transparent 12%),
    linear-gradient(135deg,#8fc26b,#48663f 70%);
  box-shadow:inset 0 0 70px #10210f66,0 14px 40px #0007;
}
.outpost-castle-grid {
  max-width:980px;
  margin:18px auto;
  grid-template-columns:repeat(6,minmax(98px,1fr));
}
.outpost-castle-grid .outpost-slot {
  min-height:100px;
}

@media (max-width:1200px) {
  .outpost-castle-strip { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:850px) {
  .location-selector { min-width:130px; }
  .outpost-castle-strip { grid-template-columns:1fr; }
  .outpost-castle-grid { grid-template-columns:repeat(3,minmax(88px,1fr)); }
}
