/* Map dock, newspaper, city templates and custom flags.  Loaded last. */

/* ---------- map dock: labelled 3D glass buttons in one capsule ---------- */
.map-fab .map-dock {
  pointer-events:auto; display:flex; direction:rtl; gap:2px; padding:4px;
  border-radius:22px; background:linear-gradient(160deg,rgba(var(--sk-2c5560, 44, 85, 96), 0.8),rgba(var(--sk-0b222a, 11, 34, 42), 0.8));
  border:1px solid rgba(var(--sk-c8fff3, 200, 255, 243), 0.239); box-shadow:inset 0 1px #effff52b,0 10px 22px rgba(var(--sk-000000, 0, 0, 0), 0.4);
}
.map-fab .map-dock .dock-btn {
  width:auto; height:auto; min-width:58px; padding:6px 6px 5px; border-radius:17px;
  display:flex; flex-direction:column; align-items:center; gap:2px;
  background:none; border:0; box-shadow:none; color:var(--text);
  transition:transform .12s ease, background-color .15s ease;
}
.map-fab .map-dock .dock-btn + .dock-btn { border-inline-start:0; }
.map-fab .map-dock .dock-ic {
  display:grid; place-items:center; width:38px; height:38px; border-radius:14px;
  background:linear-gradient(160deg,rgba(var(--sk-3f6f7a, 63, 111, 122), 0.933),rgba(var(--sk-173740, 23, 55, 64), 0.933));
  box-shadow:inset 0 1px #ffffff40, inset 0 -3px rgba(var(--sk-0b1d23, 11, 29, 35), 0.502), 0 3px 0 rgb(var(--sk-08161b, 8, 22, 27)), 0 6px 10px rgba(var(--sk-000000, 0, 0, 0), 0.333);
}
.map-fab .map-dock .dock-ic .ic { width:26px; height:26px; }
.map-fab .map-dock .dock-label { font-size:10.5px; font-weight:700; line-height:1.2; color:rgb(var(--sk-dff6ef, 223, 246, 239)); text-shadow:0 1px 2px rgba(var(--sk-000000, 0, 0, 0), 0.6); }
.map-fab .map-dock .dock-btn:active { transform:translateY(2px); }
.map-fab .map-dock .dock-btn:active .dock-ic { box-shadow:inset 0 1px #ffffff30, 0 1px 0 rgb(var(--sk-08161b, 8, 22, 27)), 0 2px 5px rgba(var(--sk-000000, 0, 0, 0), 0.333); }
.map-fab .map-dock .dock-btn[data-fab="newspaper"] .dock-ic { background:linear-gradient(160deg,rgba(var(--sk-5b7fb8, 91, 127, 184), 0.933),rgba(var(--sk-22355a, 34, 53, 90), 0.933)); }
.map-fab .fab-notices { align-self:flex-start; min-height:52px; box-shadow:inset 0 1px #effff52b,0 10px 22px rgba(var(--sk-000000, 0, 0, 0), 0.4); }
@media (prefers-reduced-motion:reduce) { .map-fab .map-dock .dock-btn { transition:none; } }

/* ---------- newspaper ---------- */
.news-head .ic-lg { width:44px; height:44px; }
.news-actions { display:flex; justify-content:flex-start; margin:4px 0 10px; }
.news-actions .btn[disabled] { opacity:.55; }
.news-feed { display:flex; flex-direction:column; gap:12px; padding-bottom:18px; }
.news-card { padding:14px 14px 10px; border-radius:20px; border:1px solid rgba(var(--sk-c8fff3, 200, 255, 243), 0.149);
  background:linear-gradient(170deg,rgba(var(--sk-f6f1e4, 246, 241, 228), 0.078),rgba(var(--sk-0b222a, 11, 34, 42), 0.0) 40%), var(--sheet-face, rgb(var(--sk-10262e, 16, 38, 46))); }
.news-card.cat-war { border-color:#ff969055; }
.news-card.cat-fun { border-color:rgba(var(--sk-ffd56b, 255, 213, 107), 0.333); }
.news-card.cat-ad { border-color:rgba(var(--sk-9acde9, 154, 205, 233), 0.333); }
.news-meta { display:flex; align-items:center; gap:10px; }
.news-meta > div { display:flex; flex-direction:column; min-width:0; flex:1; }
.news-meta b { font-size:13px; }
.news-meta small { font-size:11px; color:var(--text-3); }
.news-flag { width:42px; height:28px; border-radius:6px; object-fit:cover; flex:none;
  box-shadow:0 0 0 1px #ffffff2a, 0 3px 6px rgba(var(--sk-000000, 0, 0, 0), 0.4); }
.news-flag.none { display:grid; place-items:center; background:#ffffff12; }
.news-flag.none .ic { width:20px; height:20px; }
.news-tag { display:inline-flex; align-items:center; gap:4px; font-size:11px; font-weight:700;
  padding:3px 8px; border-radius:10px; background:#ffffff14; white-space:nowrap; }
.news-tag .ic { width:16px; height:16px; }
.news-title { margin:10px 0 6px; font-size:17px; line-height:1.55; font-weight:800; overflow-wrap:anywhere; }
.news-body { margin:0; font-size:13.5px; line-height:1.9; color:var(--text-2); white-space:pre-wrap; overflow-wrap:anywhere; }
.news-foot { display:flex; align-items:center; gap:8px; margin-top:10px; }
.news-like { display:inline-flex; align-items:center; gap:5px; padding:5px 10px; border-radius:14px;
  background:#ffffff10; border:1px solid #ffffff1c; color:var(--text); font:inherit; font-size:12.5px; }
.news-like .ic { width:20px; height:20px; }
.news-like.on { background:#ff6b7a22; border-color:#ff6b7a66; }
.news-foot .btn.sm { margin-inline-start:auto; }
.news-foot .btn.sm + .btn.sm { margin-inline-start:0; }
.news-more { width:100%; }
.news-empty { text-align:center; display:flex; flex-direction:column; align-items:center; gap:8px; padding:26px 14px; }
.news-empty .ic-lg { width:54px; height:54px; }
.news-writer .field, .tpl-sheet .field, .flag-card .field { display:flex; flex-direction:column; gap:6px; margin:10px 0; }
.news-writer .field span { font-size:12px; color:var(--text-3); font-weight:700; }
.news-writer input, .news-writer textarea, .tpl-sheet input {
  width:100%; box-sizing:border-box; padding:11px 12px; border-radius:14px; border:1px solid rgba(var(--sk-c8fff3, 200, 255, 243), 0.2);
  background:rgba(var(--sk-06161b, 6, 22, 27), 0.8); color:var(--text); font:inherit; font-size:14px; resize:vertical;
}
.news-writer input:focus, .news-writer textarea:focus, .tpl-sheet input:focus { outline:2px solid var(--gold); outline-offset:0; }
.news-read .news-body.full { color:var(--text); }

/* ---------- city templates ---------- */
.tpl-list { display:flex; flex-direction:column; gap:10px; }
.tpl-card { padding:12px 14px; border-radius:18px; }
.tpl-card h4 { margin:0 0 4px; font-size:15px; display:flex; align-items:center; gap:6px; }
.tpl-card p { margin:0 0 10px; font-size:12.5px; color:var(--text-2); line-height:1.8; }
.tpl-card .btns { display:flex; gap:8px; flex-wrap:wrap; }
.tpl-intro { font-size:12.5px; color:var(--text-2); line-height:1.8; margin:2px 2px 10px; }
.tpl-row { display:flex; align-items:center; gap:8px; padding:8px 0; border-bottom:1px solid #ffffff12; }
.tpl-row span { flex:1; font-size:13.5px; }
.tpl-row .btn.sm { min-width:34px; padding-inline:0; }
.tpl-row b { min-width:26px; text-align:center; }

/* ---------- custom flag ---------- */
.flag-card { display:flex; align-items:center; gap:14px; }
.flag-card .flag-preview { width:96px; height:64px; border-radius:10px; object-fit:cover; flex:none;
  background:#ffffff10; display:grid; place-items:center; font-size:34px;
  box-shadow:0 0 0 1px #ffffff2a, 0 6px 14px rgba(var(--sk-000000, 0, 0, 0), 0.467); }
.flag-card .flag-info { flex:1; min-width:0; }
.flag-card .flag-info h4 { margin:0 0 4px; font-size:15px; }
.flag-card .flag-info p { margin:0 0 8px; font-size:12px; color:var(--text-3); line-height:1.7; }
.flag-review { display:flex; flex-direction:column; gap:12px; }
.flag-review .row { display:flex; align-items:center; gap:10px; }
.flag-review img { width:96px; height:64px; border-radius:8px; object-fit:cover; }
.flag-review .row b { flex:1; }

/* The dock is taller than the old round buttons: keep «نیروهای من» below it. */
.troop-control { top:calc(var(--hud-h) + var(--safe-top) + 112px); }
.tpl-total { margin:10px 0 4px; font-size:13px; font-weight:700; }
.tpl-total.over { color:var(--red, #ff9690); }

/* custom (approved) flag images inside diplomacy flag badges */
.dp-flag.img { overflow: hidden; padding: 0; background: rgb(var(--sk-0b1120, 11, 17, 32)); }
.dp-flag.img img { width: 100%; height: 100%; object-fit: cover; display: block; border-radius: inherit; }

/* unit markers vanish on the zoomed-out world map and fade back in country view */
.troop-layer { transition: opacity .25s ease; }
.troop-layer.far { opacity: 0; transition: none; }
.troop-layer.far .troop-marker { pointer-events: none !important; }
@media (prefers-reduced-motion: reduce) { .troop-layer { transition: none; } }

/* notifications read on panel open: rows that were new stay highlighted until it closes */
.notice-row.read.fresh { background: linear-gradient(145deg,#302139,#211828); border-color: rgba(var(--sk-91e2cb, 145, 226, 203), 0.333); }
.notice-row.fresh small { color: rgb(var(--sk-9fe8d2, 159, 232, 210)); }
.notice-row.fresh .notice-dot { background: rgb(var(--sk-9fe8d2, 159, 232, 210)); }

/* ---------- diplomacy: five tabs (پیمان‌ها added) ---------- */
.dp-seg:not(.mini) { --n: 5; }
.dp-seg:not(.mini) .dp-seg-btn { flex-direction: column; font-size: 11px; padding: 5px 1px; gap: 2px; white-space: nowrap; }
.dp-seg:not(.mini) .dp-seg-btn .ic { width: 20px; height: 20px; }

/* ---------- diplomacy: commitments («پیمان‌ها») ---------- */
.dp-pact-head { display: flex; align-items: center; gap: 12px; padding: 12px 14px; margin-bottom: 10px;
  border: 1px solid rgba(var(--sk-ffb347, 255, 179, 71), 0.251); background: linear-gradient(135deg, rgba(var(--sk-2a1d10, 42, 29, 16), 0.8), #15121dcc); }
.dp-pact-head .ic-lg { width: 40px; height: 40px; flex: none; }
.dp-pact-head b { display: block; font-size: 14px; }
.dp-pact-head small { display: block; color: rgb(var(--sk-d9c3a3, 217, 195, 163)); font-size: 12px; line-height: 1.8; }
.dp-pact-head em { font-style: normal; color: #ff8a7a; font-weight: 800; }
.dp-pact { border-inline-start: 4px solid var(--nation, #888); }
.dp-pact.ceasefire { border-inline-start-color: rgb(var(--sk-7fd3ff, 127, 211, 255)); }
.dp-pact .ttl { font-weight: 800; }
.dp-pact-with { display: flex; align-items: center; flex-wrap: wrap; gap: 4px; margin: 2px 0; font-size: 13px; }
.dp-pact .sub { display: flex; align-items: center; gap: 4px; }
.dp-pact .btns { margin-top: 8px; }
.dp-pact-cost { display: grid; gap: 8px; margin: 12px 0; padding: 12px; border-radius: 14px; background: #2a10148c; border: 1px solid #ff6b5a40; }
.dp-pact-cost > div { display: flex; align-items: center; gap: 8px; font-size: 13.5px; }
.dp-pact-cost b { color: #ff8a7a; font-size: 16px; direction: ltr; }
.dp-pact-poor { color: #ff9a8a; }

/* ---------- any-length durations ---------- */
.dp-days { align-items: center; }
.dp-custom { display: inline-flex; align-items: center; gap: 6px; padding: 3px 4px 3px 10px; border-radius: 999px;
  border: 1px dashed #ffffff40; background: #ffffff0d; color: var(--text-2, rgb(var(--sk-cfd6e6, 207, 214, 230))); font-size: 12.5px; }
.dp-custom.on { border-style: solid; border-color: rgb(var(--sk-ffd34d, 255, 211, 77)); background: rgba(var(--sk-ffd34d, 255, 211, 77), 0.122); color: rgb(var(--sk-ffe9a8, 255, 233, 168)); }
.dp-custom input { width: 46px; height: 30px; padding: 0 6px; border-radius: 999px; border: 0; text-align: center;
  background: rgb(var(--sk-0b1120, 11, 17, 32)); color: #fff; font: inherit; font-size: 14px; font-weight: 700; }
.dp-custom input:focus { outline: 2px solid rgb(var(--sk-ffd34d, 255, 211, 77)); }
.dp-custom input.bad { outline: 2px solid #ff6b5a; }
.dp-days-hint { margin: 4px 2px 10px; font-size: 11.5px; color: var(--text-3, rgb(var(--sk-9aa6bd, 154, 166, 189))); }
.dp-days-hint.bad { color: #ff8a7a; }

/* mission preview: enemy cities the column must take on the way */
.ar-stops { display: flex; gap: 10px; align-items: flex-start; margin: 8px 0; padding: 10px 12px; border-radius: 14px;
  background: rgba(255, 90, 60, .1); border: 1px solid rgba(255, 120, 90, .35); }
.ar-stops .ic { flex: none; margin-top: 3px; }
.ar-stops b { display: block; font-size: 13.5px; color: #ffd2c4; }
.ar-stops small { display: block; font-size: 12px; line-height: 1.8; color: #e8c2b8; }

/* hangar: many small rows of the same equipment shown as one stacked card */
.ar-stack { position: relative; }
.ar-stack::before, .ar-stack::after { content: ""; position: absolute; inset: 0; border-radius: inherit; border: 1px solid rgba(255, 255, 255, .08);
  background: inherit; z-index: -1; }
.ar-stack::before { transform: translate(-4px, 4px); opacity: .6; }
.ar-stack::after { transform: translate(-8px, 8px); opacity: .3; }
.ar-stack-n { font-size: 15px; font-weight: 900; color: rgb(var(--sk-b9f6df, 185, 246, 223)); margin-inline-start: 4px; }
.ar-stack-rows { display: grid; gap: 8px; margin-top: 10px; }
.ar-stack-row { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 12px; background: rgba(255, 255, 255, .04);
  border: 1px solid rgba(255, 255, 255, .08); }
.ar-stack-row small { display: inline-flex; align-items: center; gap: 4px; color: var(--text-2, rgb(var(--sk-cfd6e6, 207, 214, 230))); }

/* «سازمان ملل»: rank badges, rules, members */
.pill.un-rank { font-size: 11px; padding: 2px 8px; border: 1px solid var(--edge); color: var(--text-2); background: var(--glass2); }
.pill.un-rank.r5 { color: var(--gold-hi); border-color: var(--gold); background: rgba(var(--sk-2a1d10, 42, 29, 16), 0.8); }
.pill.un-rank.r4 { color: var(--cyan); border-color: var(--cyan); }
.pill.un-rank.r3 { color: var(--blue); border-color: var(--blue); }
.pill.un-rank.r0 { color: var(--red); border-color: var(--red); }
.dp-nation-top .pill.un-rank { margin-inline-start: 6px; }
.un-head { display: flex; align-items: center; gap: 12px; padding: 12px 14px; margin-bottom: 10px; border: 1px solid var(--edge); }
.un-head .ic-lg { width: 40px; height: 40px; flex: none; }
.un-head b { display: block; font-size: 14px; }
.un-head small { display: block; color: var(--text-2); font-size: 12px; line-height: 1.8; }
.un-head em { font-style: normal; color: var(--gold-hi); font-weight: 800; }
.un-rules ol { list-style: persian; margin: 8px 0; padding-inline-start: 24px; display: grid; gap: 6px; line-height: 1.8; }
.un-rules .row { display: flex; align-items: center; gap: 8px; }
.un-ranks summary { cursor: pointer; font-weight: 800; }
.un-rank-row { display: flex; align-items: center; gap: 8px; margin-top: 8px; }
.un-rank-row small { color: var(--text-2); line-height: 1.7; }
.un-list { display: grid; gap: 6px; margin-bottom: 8px; }
.un-member { display: flex; align-items: center; gap: 8px; width: 100%; padding: 10px 12px; border-radius: 14px; border: 1px solid var(--edge-2);
  background: var(--glass2); color: var(--text); font: inherit; text-align: start; }
.un-member:not([disabled]) { cursor: pointer; }
.un-member.me { border-color: var(--gold); }
.un-log { display: grid; gap: 6px; font-size: 12px; color: var(--text-2); line-height: 1.7; }
.dp-terms { margin: 6px 0; padding-inline-start: 18px; display: grid; gap: 4px; line-height: 1.7; }
.dp-custom.wide input { width: 9em; }
.un-join ul { margin: 8px 0; padding-inline-start: 20px; display: grid; gap: 4px; line-height: 1.8; font-size: 13px; }
.un-req .row { display: flex; align-items: center; gap: 8px; }
.un-req .btns, .un-member .btn { margin-top: 0; }
.un-resolution { border: 1px solid var(--gold); }
.un-resolution small { color: var(--gold-hi); display: flex; align-items: center; gap: 6px; }
.un-resolution p { margin: 6px 0 0; line-height: 1.8; }
.un-out summary, .un-log summary { cursor: pointer; font-weight: 800; }
.un-filter { width: 100%; margin: 8px 0; padding: 8px 12px; border-radius: 12px; border: 1px solid var(--edge); background: var(--glass2); color: var(--text); font: inherit; }
/* سازمان ملل: شاخص صلح، شورا، دادگاه، کمک‌ها، شهرهای امن، لیست سیاه */
.un-peace { display: flex; align-items: center; gap: 14px; padding: 12px 14px; }
.un-peace-score { display: grid; justify-items: center; min-width: 76px; text-align: center; }
.un-peace-score b { font-size: 30px; line-height: 1.1; font-weight: 900; }
.un-peace-score small { font-size: 10.5px; color: var(--text-3); }
.un-peace-score em { font-style: normal; font-size: 12px; font-weight: 800; margin-top: 2px; }
.un-peace.calm .un-peace-score b, .un-peace.calm .un-peace-score em { color: var(--green); }
.un-peace.tense .un-peace-score b, .un-peace.tense .un-peace-score em { color: var(--gold-hi); }
.un-peace.fire .un-peace-score b, .un-peace.fire .un-peace-score em { color: var(--red); }
.un-peace small { color: var(--text-2); font-size: 11.5px; line-height: 1.8; }
.un-peace .pill { margin-top: 6px; }
.un-peace-bars { display: flex; align-items: flex-end; gap: 5px; height: 42px; margin-bottom: 6px; }
.un-peace-bars i { flex: 1; height: max(3px, var(--h)); border-radius: 4px 4px 2px 2px; background: linear-gradient(180deg, var(--red), rgba(var(--sk-ffd68c, 255, 214, 140), 0.45)); opacity: 0.85; }
.un-zones, .un-council, .un-court, .un-help { display: grid; gap: 8px; }
.un-zone { display: flex; align-items: center; gap: 8px; padding: 8px 10px; border-radius: 12px; border: 1px solid var(--edge-2); }
.un-zone small, .un-member small { color: var(--text-3); }
.un-chat summary, .un-black summary { cursor: pointer; font-weight: 800; }
.un-chat-log { display: grid; gap: 6px; max-height: 220px; overflow-y: auto; margin: 8px 0; font-size: 13px; line-height: 1.8; }
.un-chat-log small { color: var(--text-3); font-size: 11px; }
.un-chat-send { display: flex; gap: 8px; align-items: stretch; }
.un-chat-send input, .un-chat-send textarea { flex: 1; min-width: 0; padding: 9px 12px; border-radius: 12px; border: 1px solid var(--edge); background: var(--glass2); color: var(--text); font: inherit; resize: none; }
.un-chat-send .btn { margin: 0; flex: none; }
.un-case { padding: 10px 12px; border-radius: 14px; border: 1px solid var(--edge-2); }
.un-case.open { border-color: var(--blue); }
.un-case.guilty { border-color: var(--red); }
.un-case .row { display: flex; align-items: center; gap: 8px; }
.un-case p { margin: 6px 0; }
.un-case small { color: var(--text-3); }
.un-case .btns { margin-top: 6px; }
.un-help > small { color: var(--text-3); line-height: 1.8; }
.un-black .un-member { cursor: default; flex-wrap: wrap; }
.un-pick { max-height: 40vh; overflow-y: auto; }
/* نامه‌های خصوصی */
.dp-letters { margin-bottom: 10px; }
.dp-letters summary { cursor: pointer; font-weight: 800; }
.dp-letters .un-list { margin-top: 8px; }
.dp-letters .un-member .grow { display: grid; gap: 2px; min-width: 0; text-align: start; }
.dp-letter-last { color: var(--text-3); font-size: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dp-letter-log { display: grid; gap: 8px; max-height: 50vh; overflow-y: auto; margin: 8px 0 12px; padding: 2px; }
.dp-letter { justify-self: end; max-width: 82%; padding: 9px 12px; border-radius: 16px 16px 16px 4px; background: var(--glass2); border: 1px solid var(--edge-2); line-height: 1.8; white-space: pre-wrap; overflow-wrap: anywhere; }
.dp-letter.mine { justify-self: start; border-radius: 16px 16px 4px 16px; background: rgba(var(--sk-ffd68c, 255, 214, 140), 0.14); border-color: rgba(var(--sk-ffd68c, 255, 214, 140), 0.35); }
.dp-letter small { display: block; margin-top: 2px; color: var(--text-3); font-size: 10.5px; }