/* Decision dashboard, scoped to the Country Detail surface. */
#wwCountryDecision,#wwLegacyCountryDetails { --detail-ink:#10214b; --detail-muted:#627395; --detail-line:#dce5f1; --detail-bg:white; --detail-soft:#f5f8fd; color:var(--detail-ink); }
.dark #wwCountryDecision,.dark #wwLegacyCountryDetails { --detail-ink:#edf3ff; --detail-muted:#afbed8; --detail-line:#334360; --detail-bg:#111d33; --detail-soft:#1a2b46; }
#wwCountryDecision { min-width:0; }
.ww-detail-nav { position:sticky; top:70px; z-index:18; display:flex; gap:6px; overflow-x:auto; padding:8px; margin:0 -4px 12px; border:1px solid color-mix(in srgb,var(--detail-line) 80%,transparent); border-radius:14px; background:color-mix(in srgb,var(--detail-bg) 92%,transparent); box-shadow:0 8px 24px rgba(16,33,75,.07); backdrop-filter:blur(14px); scrollbar-width:none; }
.ww-detail-nav::-webkit-scrollbar { display:none; }
.ww-detail-nav button { flex-shrink:0; }
.ww-detail-availability { margin:0 2px 12px; padding:9px 12px; border-radius:10px; background:#eef7ff; color:#426182; font-size:13px; line-height:1.55; }
.dark .ww-detail-availability { background:#172b45; color:#b9cbe2; }
.ww-detail-overview,.ww-detail-panel { background:var(--detail-bg); border:1px solid var(--detail-line); border-radius:20px; padding:18px; margin:0 0 14px; scroll-margin-top:145px; min-width:0; box-shadow:0 10px 28px rgba(16,33,75,.055); }
.ww-detail-panel { --section-color:#2f80ed; position:relative; overflow:hidden; transition:border-color .2s ease,transform .2s ease,box-shadow .2s ease; }
.ww-detail-panel[data-section="why"],.ww-detail-panel[data-section="visa"],.ww-detail-panel[data-section="readiness"] { --section-color:#0aa578; }
.ww-detail-panel[data-section="finance"],.ww-detail-panel[data-section="next"] { --section-color:#ef6608; }
.ww-detail-panel[data-section="living"] { --section-color:#7c5ce5; }
.ww-detail-panel::before { content:''; position:absolute; width:150px; height:150px; right:-92px; top:-96px; border-radius:50%; background:color-mix(in srgb,var(--section-color) 8%,transparent); pointer-events:none; transition:transform .25s ease,opacity .25s ease; }
.ww-detail-panel:not([open]):hover { border-color:color-mix(in srgb,var(--section-color) 38%,var(--detail-line)); transform:translateY(-2px); box-shadow:0 13px 30px rgba(16,33,75,.09); }
.ww-detail-panel:not([open]):hover::before { transform:scale(1.18); }
.ww-detail-panel[open] { border-color:color-mix(in srgb,var(--section-color) 30%,var(--detail-line)); box-shadow:0 13px 32px rgba(16,33,75,.075); }
.ww-country-visual { position:relative; overflow:hidden; height:210px; margin:-18px -18px 18px; border-radius:19px 19px 0 0; background:var(--detail-soft); }
.ww-country-visual::after { content:''; position:absolute; inset:35% 0 0; background:linear-gradient(transparent,rgba(5,17,38,.7)); pointer-events:none; }
.ww-country-visual > img { width:100%; height:100%; display:block; object-fit:cover; }
.ww-country-visual figcaption { position:absolute; z-index:1; left:14px; right:14px; bottom:10px; display:flex; align-items:center; justify-content:space-between; gap:12px; color:white; font-size:12px; font-weight:700; text-shadow:0 1px 3px #000; }
.ww-country-visual figcaption a { min-height:32px; display:inline-flex; align-items:center; padding:4px 8px; border:1px solid rgba(255,255,255,.45); border-radius:8px; background:rgba(0,0,0,.28); color:white; text-decoration:none; }
.ww-detail-country { display:flex; gap:12px; align-items:center; }
.ww-detail-country > span:not(.ww-country-flag) { font-size:32px; }
.ww-detail-country > .ww-country-flag { width:46px; height:34px; }
.ww-detail-country > div { flex:1; min-width:0; }
.ww-detail-country h2 { font-size:26px; line-height:1.3; font-weight:800; }
.ww-detail-country p { font-size:13px; color:var(--detail-muted); margin-top:4px; }
.ww-detail-score { font-size:26px; color:#008f64; white-space:nowrap; }
.ww-detail-score small { display:block; text-align:right; font-size:13px; color:var(--detail-muted); }
.ww-detail-muted { font-size:13px; line-height:1.6; color:var(--detail-muted); margin-top:12px; }
.ww-detail-metrics { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin:16px 0; }
.ww-detail-metrics > div { position:relative; min-height:98px; padding:12px 10px 12px 52px; border:1px solid color-mix(in srgb,var(--detail-line) 80%,transparent); background:var(--detail-soft); border-radius:14px; }
.ww-detail-metrics span { font-size:13px; display:block; color:var(--detail-muted); }
.ww-detail-metrics strong { font-size:16px; display:block; line-height:1.6; overflow-wrap:anywhere; }
.ww-detail-icon { width:34px; height:34px; display:inline-flex; align-items:center; justify-content:center; flex-shrink:0; border-radius:11px; background:#eef5ff; color:#1776de; }
.ww-detail-icon svg { width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.ww-detail-icon--salary,.ww-detail-icon--time,.ww-detail-icon--plane { background:#fff1df; color:#ed6508; }
.ww-detail-icon--savings,.ww-detail-icon--visa,.ww-detail-icon--check { background:#e3f7ef; color:#008f64; }
.ww-detail-icon--heart { background:#ffedf0; color:#e23a55; }
.ww-detail-metrics > div > .ww-detail-icon { position:absolute; left:10px; top:12px; }
.ww-detail-actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:12px; }

/* Unified action bar for country hero card */
.ww-detail-actions-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px solid color-mix(in srgb, var(--detail-line) 75%, transparent);
}
.ww-detail-action-icons {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-left: auto;
}

#wwCountryDecision .ww-detail-icon-btn {
  width: 44px;
  height: 44px;
  min-height: 44px;
  padding: 0;
  border-radius: 13px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: relative;
  flex: 0 0 44px;
  cursor: pointer;
  transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1);
}
#wwCountryDecision .ww-detail-icon-btn:active {
  transform: scale(0.94);
}

/* Compare Button - Aesthetic icon button */
#wwCountryDecision #wwDetailCompare {
  background: linear-gradient(135deg, #ff7a00 0%, #ff4514 100%);
  border: 1px solid rgba(255, 255, 255, 0.15);
  color: #ffffff !important;
  box-shadow: 0 3px 12px rgba(255, 73, 26, 0.3);
}
#wwCountryDecision #wwDetailCompare:hover {
  transform: translateY(-1.5px);
  box-shadow: 0 6px 18px rgba(255, 73, 26, 0.42);
}
#wwCountryDecision #wwDetailCompare:active {
  transform: scale(0.94);
}
#wwCountryDecision #wwDetailCompare i {
  font-size: 17px;
}
#wwCountryDecision #wwDetailCompare.is-compared {
  background: #0f172a;
  border: 1.5px solid #ff7700;
  color: #ff9d42 !important;
  box-shadow: 0 3px 12px rgba(0, 0, 0, 0.2);
}
.dark #wwCountryDecision #wwDetailCompare.is-compared {
  background: #1e293b;
  border-color: #ff9d42;
  color: #ffb877 !important;
}

/* Badge dot on compare button when country is active in comparison */
.ww-compare-badge-dot {
  position: absolute;
  top: -3px;
  right: -3px;
  width: 17px;
  height: 17px;
  border-radius: 50%;
  background: #10b981;
  color: white;
  font-size: 9px;
  font-weight: 800;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 2px solid var(--detail-bg, #fff);
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.25);
  animation: wwBadgePop 0.25s cubic-bezier(0.16, 1, 0.3, 1);
}
.dark .ww-compare-badge-dot {
  border-color: #111d33;
}
@keyframes wwBadgePop {
  0% { transform: scale(0); }
  70% { transform: scale(1.2); }
  100% { transform: scale(1); }
}

/* Save / Bookmark Button - Aesthetic icon button */
#wwCountryDecision #wwDetailSave {
  background: var(--detail-bg, #ffffff);
  border: 1.5px solid var(--detail-line, #cbd5e1);
  color: var(--detail-muted, #64748b);
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.04);
}
#wwCountryDecision #wwDetailSave:hover {
  border-color: #f59e0b;
  color: #d97706;
  background: #fffbeb;
  transform: translateY(-1.5px);
}
#wwCountryDecision #wwDetailSave:active {
  transform: scale(0.94);
}
#wwCountryDecision #wwDetailSave[aria-pressed="true"],
#wwCountryDecision #wwDetailSave.is-saved {
  background: #fef3c7;
  border-color: #f59e0b;
  color: #d97706;
  box-shadow: 0 3px 10px rgba(245, 158, 11, 0.2);
}
.dark #wwCountryDecision #wwDetailSave {
  background: #1e293b;
  border-color: #334155;
  color: #94a3b8;
}
.dark #wwCountryDecision #wwDetailSave:hover {
  background: #273549;
  border-color: #f59e0b;
  color: #fbbf24;
}
.dark #wwCountryDecision #wwDetailSave[aria-pressed="true"],
.dark #wwCountryDecision #wwDetailSave.is-saved {
  background: #332214;
  border-color: #f59e0b;
  color: #fbbf24;
}
#wwCountryDecision #wwDetailSave i {
  font-size: 17px;
}

#wwCountryDecision button:disabled { opacity:.5; cursor:not-allowed; }

.ww-detail-saved-drawer {
  margin: 0;
}
.ww-detail-saved-drawer > summary {
  display: inline-flex !important;
  align-items: center;
  gap: 8px;
  font-size: 13px !important;
  color: var(--detail-muted, #64748b);
  padding: 6px 0 !important;
  min-height: 32px !important;
  cursor: pointer;
  transition: color 0.15s ease;
}
.ww-detail-saved-drawer > summary:hover {
  color: var(--detail-ink);
}
.ww-detail-saved-drawer > summary::after {
  display: none !important;
}
.ww-detail-saved-drawer[open] {
  flex-basis: 100%;
  order: 10;
  margin-top: 8px;
}
.ww-detail-saved-drawer[open] #wwDetailSavedList {
  padding: 10px;
  background: var(--detail-soft);
  border-radius: 12px;
  border: 1px solid color-mix(in srgb, var(--detail-line) 60%, transparent);
}

/* Pulse animation for floating bar when triggered */
@keyframes wwBarPulse {
  0% { transform: scale(1); }
  50% { transform: scale(1.025); }
  100% { transform: scale(1); }
}
.ww-bar-pulse #floatingCompareCard {
  animation: wwBarPulse 0.55s ease-out;
}
#wwCountryDecision summary,#wwLegacyCountryDetails > summary { min-height:44px; padding:10px 0; cursor:pointer; font-size:16px; line-height:1.5; font-weight:700; }
.ww-detail-panel > summary { font-size:18px; }
.ww-detail-panel > summary > span { display:flex; align-items:center; gap:12px; }
.ww-detail-panel > summary { position:relative; z-index:1; padding:5px 0; }
.ww-detail-summary-main { min-width:0; flex:1; }
.ww-detail-summary-main > .ww-detail-icon { width:42px; height:42px; border-radius:13px; color:var(--section-color); background:color-mix(in srgb,var(--section-color) 11%,var(--detail-bg)); box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--section-color) 9%,transparent); }
.ww-detail-summary-copy { min-width:0; display:block; }
.ww-detail-summary-copy > strong { display:block; color:var(--detail-ink); font-size:16px; line-height:1.4; }
#wwCountryDecision .ww-detail-summary-copy > small { display:block; margin-top:3px; color:var(--detail-muted); font-size:12px; font-weight:500; line-height:1.45; }
#wwCountryDecision summary,#wwLegacyCountryDetails > summary { display:flex; align-items:center; justify-content:space-between; gap:12px; }
#wwCountryDecision summary::after,#wwLegacyCountryDetails > summary::after { content:'+'; font-size:22px; color:#e86308; flex-shrink:0; }
#wwCountryDecision details[open] > summary::after,#wwLegacyCountryDetails[open] > summary::after { content:'−'; }
.ww-detail-panel > summary::after { width:34px; height:34px; display:grid; place-items:center; border:1px solid color-mix(in srgb,var(--section-color) 22%,var(--detail-line)); border-radius:50%; background:color-mix(in srgb,var(--section-color) 7%,var(--detail-bg)); color:var(--section-color) !important; font-size:20px !important; line-height:1; transition:transform .2s ease,background .2s ease; }
.ww-detail-panel[open] > summary::after { transform:rotate(180deg); background:color-mix(in srgb,var(--section-color) 13%,var(--detail-bg)); }
.ww-detail-metrics .ww-detail-negative strong { color:#cc324e; }
.ww-detail-metrics .ww-detail-positive strong { color:#008f64; }
.ww-detail-content { padding-top:12px; }
.ww-detail-content p,.ww-detail-overview > details { font-size:14px; line-height:1.7; }
.ww-detail-content p { margin:8px 0; }
.ww-detail-content h4 { font-size:16px; font-weight:700; line-height:1.5; margin-top:14px; }
.ww-detail-list { margin:12px 0; }
.ww-detail-list { display:grid; gap:8px; }
.ww-detail-list > div { padding:12px; border:1px solid var(--detail-line); border-radius:12px; background:color-mix(in srgb,var(--detail-soft) 72%,var(--detail-bg)); }
.ww-detail-list dt { display:flex; align-items:center; gap:9px; font-size:14px; font-weight:700; margin-bottom:7px; }
.ww-detail-list dt .ww-detail-icon { width:32px; height:32px; }
.ww-detail-list dd { font-size:14px; line-height:1.7; overflow-wrap:anywhere; }
#wwCountryDecision small { font-size:13px; line-height:1.6; color:var(--detail-muted); display:block; }
.ww-match-hero { position:relative; overflow:hidden; display:flex; align-items:center; gap:15px; padding:16px; margin-bottom:12px; border:1px solid #bfe8d9; border-radius:17px; background:linear-gradient(135deg,#effbf6 0%,#f7fbff 68%,#fff7ed 100%); }
.ww-match-hero::after { content:''; position:absolute; width:120px; height:120px; right:-54px; top:-62px; border-radius:50%; border:22px solid rgba(239,102,8,.08); pointer-events:none; }
.ww-match-score-ring { --match-score:0deg; position:relative; width:82px; height:82px; flex:0 0 82px; display:grid; place-items:center; border-radius:50%; background:conic-gradient(#08a878 var(--match-score),#dce9e5 0); }
.ww-match-score-ring::after { content:''; position:absolute; inset:7px; border-radius:50%; background:var(--detail-bg); }
.ww-match-score-ring > div { position:relative; z-index:1; display:flex; align-items:baseline; }
.ww-match-score-ring strong { color:#008f64; font-size:26px; line-height:1; }
.ww-match-score-ring span { color:var(--detail-muted); font-size:11px; }
.ww-match-hero > div:last-child { position:relative; z-index:1; min-width:0; }
.ww-match-eyebrow { display:block; margin-bottom:3px; color:#008f64; font-size:12px; font-weight:800; text-transform:uppercase; letter-spacing:.04em; }
.ww-match-hero h4 { margin:0; font-size:17px; }
.ww-match-hero p { margin:4px 0 0; color:var(--detail-muted); font-size:13px; }
.ww-match-grid { display:grid; grid-template-columns:minmax(0,1fr); gap:10px; }
.ww-match-card { position:relative; min-width:0; padding:14px; overflow:hidden; border:1px solid var(--detail-line); border-radius:15px; background:linear-gradient(145deg,var(--detail-bg),var(--detail-soft)); }
.ww-match-card::before { content:''; position:absolute; inset:0 auto 0 0; width:3px; background:#83a6d4; }
.ww-match-card.is-positive::before { background:#14a778; }
.ww-match-card.is-caution::before { background:#f4a621; }
.ww-match-card.is-negative::before { background:#d9465f; }
.ww-match-card header { display:flex; align-items:center; gap:10px; margin-bottom:10px; }
.ww-match-card header > div { min-width:0; }
.ww-match-card h4 { margin:1px 0 0; font-size:15px; }
.ww-match-card p { margin:0; color:var(--detail-muted); font-size:13px; line-height:1.65; }
.ww-match-tag { display:block; color:#617796; font-size:11px; font-weight:800; letter-spacing:.025em; text-transform:uppercase; }
.ww-match-card.is-positive .ww-match-tag { color:#00845c; }
.ww-match-card.is-caution .ww-match-tag { color:#a65c00; }
.ww-match-financial { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.ww-match-financial > div { min-width:0; padding:10px; border-radius:11px; background:color-mix(in srgb,var(--detail-bg) 78%,transparent); }
.ww-match-financial span { display:block; color:var(--detail-muted); font-size:12px; }
.ww-match-financial strong { display:block; margin-top:2px; font-size:16px; line-height:1.45; overflow-wrap:anywhere; }
.ww-match-card.is-positive .ww-match-financial > div:last-child strong { color:#008f64; }
.ww-match-card.is-negative .ww-match-financial > div:last-child strong { color:#cc324e; }
.ww-match-progress { height:8px; overflow:hidden; margin:2px 0 10px; border-radius:999px; background:#dfe8f3; }
.ww-match-progress span { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,#20a97d,#46d3a0); }
.ww-match-capital { display:block; margin:2px 0 4px; color:#e45f08; font-size:21px; line-height:1.35; }
.dark .ww-match-hero { border-color:#285b50; background:linear-gradient(135deg,#17362f,#15283f 70%,#33271f); }
.dark .ww-match-score-ring { background:conic-gradient(#42d5a6 var(--match-score),#2d4a48 0); }
.dark .ww-match-eyebrow,.dark .ww-match-card.is-positive .ww-match-tag { color:#62dcac; }
.dark .ww-match-card.is-caution .ww-match-tag { color:#ffc36c; }
.dark .ww-match-progress { background:#30425b; }
.dark .ww-detail-panel:not([open]):hover { box-shadow:0 13px 30px rgba(0,0,0,.2); }
.ww-finance-intro { padding:14px; border:1px solid #fed7b3; border-radius:16px; background:linear-gradient(145deg,#fffaf5,#fff4e8); }
.ww-finance-intro h4,.ww-finance-chart-card h4 { margin:0; }
.ww-finance-intro p,.ww-finance-chart-card p { color:var(--detail-muted); }
.ww-finance-modes { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin-top:12px; }
#wwCountryDecision .ww-finance-modes button { min-width:0; min-height:48px; padding:9px 6px; font-weight:700; }
#wwCountryDecision .ww-finance-modes button[aria-pressed="true"] { border-color:#ef6608; background:#ef6608; color:white; box-shadow:0 5px 14px rgba(239,102,8,.2); }
.ww-finance-mode-note { margin:10px 0 0 !important; padding-top:10px; border-top:1px solid #fed7b3; }
.ww-finance-summary { display:grid; grid-template-columns:minmax(0,1fr); gap:9px; margin:14px 0; }
.ww-finance-summary article { position:relative; min-height:96px; padding:13px 12px 13px 58px; border:1px solid var(--detail-line); border-radius:14px; background:var(--detail-soft); }
.ww-finance-summary article > .ww-detail-icon { position:absolute; top:13px; left:12px; }
.ww-finance-summary article > span { display:block; color:var(--detail-muted); font-size:13px; }
.ww-finance-summary article > strong { display:block; margin:2px 0; font-size:18px; line-height:1.4; overflow-wrap:anywhere; }
.ww-finance-summary .is-positive > strong { color:#008f64; }
.ww-finance-summary .is-negative > strong { color:#cc324e; }
.ww-finance-dashboard { display:grid; grid-template-columns:minmax(0,1fr); gap:12px; }
.ww-finance-chart-card { display:grid; justify-items:center; gap:14px; padding:16px; border:1px solid var(--detail-line); border-radius:16px; background:var(--detail-bg); text-align:center; }
.ww-finance-chart-card > div:first-child { max-width:480px; }
.ww-finance-donut-wrap { width:100%; display:flex; justify-content:center; padding:2px 0; }
.ww-finance-donut { position:relative; width:min(208px,70vw); aspect-ratio:1; display:grid; place-items:center; border-radius:50%; background:var(--finance-chart); box-shadow:inset 0 0 0 1px rgba(16,33,75,.05); }
.ww-finance-donut::after { content:''; position:absolute; inset:30px; border-radius:50%; background:var(--detail-bg); box-shadow:0 0 0 1px color-mix(in srgb,var(--detail-line) 70%,transparent); }
.ww-finance-donut-center { position:relative; z-index:1; width:125px; text-align:center; }
.ww-finance-donut-center span,.ww-finance-donut-center small { color:var(--detail-muted); font-size:12px; }
.ww-finance-donut-center strong { display:block; margin:2px 0; font-size:16px; line-height:1.35; overflow-wrap:anywhere; }
.ww-finance-legend { list-style:none; display:grid; gap:8px; padding:0; margin:0; }
.ww-finance-legend li { min-width:0; display:grid; grid-template-columns:12px minmax(0,1fr) auto; align-items:start; gap:10px; padding:12px; border:1px solid var(--detail-line); border-radius:13px; background:color-mix(in srgb,var(--detail-soft) 72%,var(--detail-bg)); }
.ww-finance-dot { width:10px; height:10px; margin-top:6px; border-radius:50%; background:var(--finance-color); box-shadow:0 0 0 3px color-mix(in srgb,var(--finance-color) 18%,transparent); }
.ww-finance-legend li > div { min-width:0; }
.ww-finance-legend li > div > strong { display:block; font-size:14px; line-height:1.45; }
.ww-finance-legend li small { margin-top:3px; }
.ww-finance-amount { text-align:right; white-space:nowrap; }
.ww-finance-amount > strong { font-size:14px !important; }
.ww-finance-amount > span { display:block; margin-top:3px; color:var(--detail-muted); font-size:12px; font-weight:700; }
.ww-finance-footnote { margin:12px 0 0 !important; padding:10px 12px; border-left:3px solid #2f80ed; border-radius:0 10px 10px 0; background:#f1f7ff; color:#526b8a; font-size:13px !important; }
.ww-finance-capital-title { margin-top:22px !important; }
.dark .ww-finance-intro { border-color:#6b4934; background:linear-gradient(145deg,#30251f,#2a211d); }
.dark .ww-finance-mode-note { border-color:#6b4934; }
.dark .ww-finance-footnote { background:#172b45; color:#b9cbe2; }
.ww-jobs-intro { display:flex; align-items:flex-start; gap:11px; padding:13px; border:1px solid #cfe3fa; border-radius:14px; background:linear-gradient(135deg,#f3f9ff,#f8fbff); }
.ww-jobs-intro > div { min-width:0; }
.ww-jobs-intro h4 { margin:0; }
.ww-jobs-intro p { margin:3px 0 0; color:var(--detail-muted); font-size:13px; }
.ww-jobs-section-heading { display:flex; align-items:end; justify-content:space-between; gap:14px; margin:18px 1px 10px; }
.ww-jobs-section-heading > div > span { color:#ef6608; font-size:11px; font-weight:800; letter-spacing:.04em; text-transform:uppercase; }
.ww-jobs-section-heading h4 { margin:1px 0 0; font-size:17px; }
.ww-jobs-section-heading > small { max-width:260px; text-align:right; }
.ww-jobs-section-heading--list { margin-top:24px; padding-top:17px; border-top:1px solid var(--detail-line); }
.ww-detail-jobs { display:grid; grid-template-columns:minmax(0,1fr); gap:12px; margin:0; }
.ww-detail-job { padding:12px; border:1px solid var(--detail-line); border-radius:15px; min-width:0; background:linear-gradient(145deg,var(--detail-bg),var(--detail-soft)); box-shadow:0 7px 18px rgba(16,33,75,.045); }
.ww-detail-job.is-relevant { border-color:#f48228; box-shadow:inset 3px 0 #f48228,0 7px 18px rgba(16,33,75,.05); }
.ww-job-rank { min-width:30px; height:30px; display:inline-grid; place-items:center; border-radius:9px; background:#eaf2fd; color:#174f9c; font-size:12px; font-weight:800; }
.ww-detail-job.is-relevant .ww-job-rank { background:#fff0e4; color:#df5900; }
.ww-detail-job h4 { margin:0; }
.ww-job-card-header { min-width:0; display:grid; grid-template-columns:30px 34px minmax(0,1fr); align-items:center; gap:8px; margin-bottom:9px; }
.ww-job-card-header > .ww-detail-icon { width:34px; height:34px; }
.ww-job-card-header > div { min-width:0; }
.ww-job-card-header h4 { margin:0 0 3px; font-size:15px; line-height:1.35; }
.ww-job-card-header .ww-detail-status { padding:2px 7px; font-size:10px; line-height:1.45; }
.ww-job-facts { display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:6px; }
.ww-job-facts > div { min-width:0; padding:8px 9px; border:1px solid color-mix(in srgb,var(--detail-line) 75%,transparent); border-radius:10px; background:color-mix(in srgb,var(--detail-bg) 78%,transparent); }
.ww-job-facts span { display:block; color:var(--detail-muted); font-size:11px; }
.ww-job-facts strong { display:block; margin-top:2px; font-size:13px; line-height:1.4; overflow-wrap:anywhere; }
.ww-job-facts strong small { display:inline !important; font-weight:500; }
.ww-job-requirements { margin-top:8px; border-top:1px solid var(--detail-line); }
#wwCountryDecision .ww-job-requirements > summary { justify-content:flex-start; min-height:44px; padding:6px 0 0; color:#115fc0; font-size:13px; }
.ww-job-requirements > summary .ww-detail-icon { width:28px; height:28px; border-radius:9px; }
.ww-job-requirements > summary > .ww-job-requirement-label { flex:1; font-weight:700; }
.ww-job-requirements > summary::after { width:28px; height:28px; display:grid; place-items:center; border-radius:50%; background:#edf5ff; color:#1472d8 !important; font-size:17px !important; }
.ww-job-list { display:grid; gap:8px; }
.ww-job-list-more { margin-top:10px; border:1px solid #bfd8f5; border-radius:13px; background:linear-gradient(135deg,#f5faff,#fff); }
#wwCountryDecision .ww-job-list-more > summary { min-height:52px; padding:8px 12px; color:#115fc0; }
.ww-job-list-more > summary > span { min-width:0; flex:1; }
.ww-job-list-more > summary strong { display:block; font-size:13px; line-height:1.4; }
.ww-job-list-more > summary small { margin-top:1px; font-weight:500; }
.ww-job-list-more > summary::after { width:30px; height:30px; display:grid; place-items:center; border-radius:50%; background:#e8f3ff; color:#1472d8 !important; font-size:18px !important; }
.ww-job-list-more > .ww-job-list { padding:0 8px 8px; }
.ww-job-list-more[open] > summary { margin-bottom:7px; border-bottom:1px solid #d8e7f7; }
.ww-job-row { overflow:hidden; border:1px solid var(--detail-line); border-radius:13px; background:color-mix(in srgb,var(--detail-soft) 62%,var(--detail-bg)); transition:border-color .2s ease,background .2s ease; }
.ww-job-row[open] { border-color:#9bc5f5; background:var(--detail-bg); }
#wwCountryDecision .ww-job-row > summary { display:grid; grid-template-columns:minmax(0,1fr) 32px; gap:8px 10px; align-items:center; padding:11px 12px; }
.ww-job-row-main { min-width:0; display:flex; align-items:center; gap:10px; }
.ww-job-row-main > span { min-width:0; }
.ww-job-row-main strong { display:block; font-size:14px; line-height:1.4; }
.ww-job-row-main small { margin-top:2px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ww-job-row-meta {
  grid-column: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding-left: 44px;
}
.ww-job-row-salary {
  min-width: 0;
  text-align: left;
  flex: 1 1 auto;
}
.ww-job-row-salary small {
  font-size: 11px !important;
  color: var(--detail-muted);
  display: block;
}
.ww-job-row-salary strong {
  display: block;
  color: #10214b;
  font-size: 13.5px;
  white-space: nowrap;
}
.ww-job-row-salary strong span {
  color: var(--detail-muted);
  font-size: 11px;
  font-weight: 500;
}
.dark .ww-job-row-salary > strong {
  color: #edf3ff;
}

#wwCountryDecision .ww-job-quick-change-btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  min-height: 28px;
  padding: 4px 10px;
  border-radius: 7px;
  background: linear-gradient(110deg, #ff8500 0%, #ff491a 100%) !important;
  border: none;
  color: #ffffff !important;
  font-size: 11px;
  font-weight: 700;
  cursor: pointer;
  box-shadow: 0 2px 5px rgba(255, 73, 26, 0.25);
  white-space: nowrap;
  flex-shrink: 0;
  user-select: none;
  transition: all 0.15s ease;
}
#wwCountryDecision .ww-job-quick-change-btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 3px 8px rgba(255, 73, 26, 0.38);
}
#wwCountryDecision .ww-job-quick-change-btn:active {
  transform: translateY(0);
}
#wwCountryDecision .ww-job-quick-change-btn i {
  font-size: 11px;
  color: #ffffff !important;
}
#wwCountryDecision .ww-job-quick-change-btn span {
  color: #ffffff !important;
}

.ww-job-row-action-bottom {
  margin: 14px 0 6px;
  padding-top: 10px;
  border-top: 1px dashed var(--detail-line);
}
#wwCountryDecision .ww-job-change-btn--secondary {
  background: linear-gradient(110deg, #2563eb 0%, #1d4ed8 100%) !important;
  box-shadow: 0 2px 8px -1px rgba(29, 78, 216, 0.35);
}
#wwCountryDecision .ww-job-change-btn--secondary:hover {
  background: linear-gradient(110deg, #1d4ed8 0%, #1e40af 100%) !important;
  box-shadow: 0 4px 14px -1px rgba(29, 78, 216, 0.45);
}

/* Inside expanded row: Ganti Profesi action banner */
.ww-job-row-action {
  margin: 12px 0 14px;
  padding: 12px 14px;
  border-radius: 12px;
  background: linear-gradient(135deg, rgba(255, 247, 237, 0.85) 0%, rgba(254, 243, 199, 0.45) 100%);
  border: 1px solid #fed7aa;
  display: flex;
  flex-direction: column;
  gap: 10px;
  box-shadow: 0 1px 3px rgba(234, 88, 12, 0.05);
}
#wwCountryDecision .ww-job-change-btn {
  width: 100%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 44px;
  padding: 10px 18px;
  border-radius: 10px;
  background: linear-gradient(110deg, #ff8500 0%, #ff491a 100%) !important;
  border: none;
  color: #ffffff !important;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  transition: all 0.2s ease;
  box-shadow: 0 2px 8px -1px rgba(255, 73, 26, 0.35);
  user-select: none;
}
#wwCountryDecision .ww-job-change-btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 4px 14px -1px rgba(255, 73, 26, 0.45);
  background: linear-gradient(110deg, #ff951a 0%, #ff3b0a 100%) !important;
  color: #ffffff !important;
}
#wwCountryDecision .ww-job-change-btn:active {
  transform: translateY(0);
}
#wwCountryDecision .ww-job-change-btn i {
  font-size: 14px;
  color: #ffffff !important;
  transition: transform 0.3s ease;
}
#wwCountryDecision .ww-job-change-btn:hover i {
  transform: rotate(180deg);
}
#wwCountryDecision .ww-job-change-btn span {
  color: #ffffff !important;
}
.ww-job-change-hint {
  font-size: 11px;
  color: #9a3412;
  line-height: 1.45;
  text-align: center;
}
.dark .ww-job-row-action {
  background: rgba(45, 23, 10, 0.55);
  border-color: #9a3412;
}
.dark .ww-job-change-hint {
  color: #fdba74;
}

/* Quick switcher card at the top of section 3 */
.ww-jobs-quick-switch-card {
  background: linear-gradient(135deg, rgba(255, 247, 237, 0.9) 0%, rgba(254, 243, 199, 0.4) 100%);
  border: 1.5px solid #fed7aa;
  border-radius: 16px;
  padding: 14px 16px;
  margin-bottom: 18px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  box-shadow: 0 2px 8px -2px rgba(245, 158, 11, 0.08);
}
.ww-jobs-quick-switch-info {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.ww-jobs-quick-switch-badge {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-size: 13px;
  font-weight: 800;
  color: #c2410c;
}
.ww-jobs-quick-switch-badge i {
  font-size: 13px;
  color: #ea580c;
}
.ww-jobs-quick-switch-desc {
  font-size: 13px;
  color: #475569;
  line-height: 1.5;
  margin: 0;
}
.ww-jobs-quick-switch-desc strong {
  color: #0f172a;
}
.ww-jobs-select-wrapper {
  position: relative;
  width: 100%;
}
.ww-jobs-select-icon {
  position: absolute;
  left: 14px;
  top: 50%;
  transform: translateY(-50%);
  color: #ea580c;
  font-size: 14px;
  pointer-events: none;
  z-index: 2;
}
.ww-jobs-select-arrow {
  position: absolute;
  right: 14px;
  top: 50%;
  transform: translateY(-50%);
  color: #94a3b8;
  font-size: 12px;
  pointer-events: none;
  z-index: 2;
}
.ww-jobs-quick-select {
  width: 100%;
  min-height: 44px;
  padding: 10px 36px 10px 38px;
  border-radius: 12px;
  border: 1.5px solid #fdba74;
  background: #ffffff;
  color: #0f172a;
  font-size: 14px;
  font-weight: 700;
  appearance: none;
  -webkit-appearance: none;
  cursor: pointer;
  box-shadow: 0 1px 3px rgba(0,0,0,0.03);
  transition: all 0.2s ease;
}
.ww-jobs-quick-select:focus {
  outline: none;
  border-color: #ea580c;
  box-shadow: 0 0 0 3px rgba(234, 88, 12, 0.2);
}
.dark .ww-jobs-quick-switch-card {
  background: linear-gradient(135deg, rgba(45, 26, 12, 0.4) 0%, rgba(30, 41, 59, 0.7) 100%);
  border-color: #7c2d12;
  box-shadow: 0 2px 10px -2px rgba(0,0,0,0.4);
}
.dark .ww-jobs-quick-switch-badge {
  color: #fdba74;
}
.dark .ww-jobs-quick-switch-badge i {
  color: #fb923c;
}
.dark .ww-jobs-quick-switch-desc {
  color: #94a3b8;
}
.dark .ww-jobs-quick-switch-desc strong {
  color: #f1f5f9;
}
.dark .ww-jobs-quick-select {
  background: #1e293b;
  border-color: #9a3412;
  color: #f8fafc;
}
.dark .ww-jobs-quick-select:focus {
  border-color: #f97316;
  box-shadow: 0 0 0 3px rgba(249, 115, 22, 0.25);
}
.ww-job-row > summary::after { grid-column:2; grid-row:1; width:30px; height:30px; display:grid; place-items:center; border:1px solid #bfd8f5; border-radius:50%; background:#f3f8ff; color:#1472d8 !important; font-size:18px !important; }
.ww-job-row-content { padding:0 12px 13px; border-top:1px solid var(--detail-line); }
.ww-job-row-content > h4 { display:flex; align-items:center; gap:9px; margin:13px 0 7px; }
.ww-job-row-content > h4 .ww-detail-icon { width:31px; height:31px; }
.dark .ww-jobs-intro { border-color:#34587e; background:linear-gradient(135deg,#142941,#172f4b); }
.dark .ww-job-list-more { border-color:#34587e; background:linear-gradient(135deg,#142941,#111d33); }
.dark .ww-job-list-more > summary::after { background:#18304f; }
.dark .ww-job-row-salary > strong { color:#edf3ff; }
.dark .ww-job-requirements > summary::after,.dark .ww-job-row > summary::after { background:#18304f; border-color:#34587e; }
.ww-readiness-row { display:grid; grid-template-columns:1fr auto; gap:6px 12px; padding:14px 0; border-bottom:1px solid var(--detail-line); }
.ww-readiness-row p { grid-column:1/-1; }
.ww-detail-status { padding:4px 8px; border-radius:8px; font-size:12px; line-height:1.6; display:inline-block; }
.ww-detail-status.ready { background:#e1f6ee; color:#006e49; }
.ww-detail-status.improve { background:#fff2c9; color:#775100; }
.ww-detail-status.missing { background:#edf1f7; color:#526481; }
#wwCountryDecision label { display:block; font-size:14px; font-weight:600; margin:16px 0 8px; }
#wwCountryDecision input,#wwCountryDecision select { width:100%; min-width:0; max-width:100%; min-height:48px; border:1px solid var(--detail-line); border-radius:10px; background:var(--detail-bg); color:var(--detail-ink); font-size:16px; padding:12px; margin-bottom:12px; }
.ww-next-intro { display:flex; align-items:flex-start; gap:12px; padding:14px; margin-bottom:14px; border:1px solid #ffd2ae; border-radius:15px; background:linear-gradient(135deg,#fff8f1,#fff2e5); }
.ww-next-intro > div { min-width:0; }
.ww-next-intro > div > span { color:#d95500; font-size:11px; font-weight:800; letter-spacing:.05em; text-transform:uppercase; }
.ww-next-intro h4 { margin:2px 0 3px; font-size:17px; }
.ww-next-intro p { margin:0; color:var(--detail-muted); font-size:13px; }
.ww-next-steps { list-style:none; display:grid; grid-template-columns:minmax(0,1fr); gap:10px; padding:0; margin:0; }
.ww-next-steps > li { position:relative; min-width:0; display:grid; grid-template-columns:46px minmax(0,1fr); gap:10px; }
.ww-next-marker { position:relative; z-index:1; width:46px; min-height:70px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px; border:1px solid #ffc798; border-radius:14px; background:#fff7ef; color:#dc5b06; }
.ww-next-marker > span { font-size:10px; font-weight:900; letter-spacing:.05em; }
.ww-next-marker .ww-detail-icon { width:28px; height:28px; border-radius:9px; background:#ffe8d5; }
.ww-next-steps > li:not(:last-child) .ww-next-marker::after { content:''; position:absolute; z-index:-1; top:100%; width:2px; height:12px; background:linear-gradient(#f3a363,#ffd7b7); }
.ww-next-card { min-width:0; padding:12px 13px; border:1px solid var(--detail-line); border-radius:14px; background:linear-gradient(145deg,var(--detail-bg),var(--detail-soft)); }
.ww-next-phase { display:inline-flex; align-items:center; min-height:22px; padding:2px 7px; border-radius:7px; background:#eaf3ff; color:#1968bf; font-size:10px; font-weight:800; letter-spacing:.035em; text-transform:uppercase; }
.ww-next-card h4 { margin:5px 0 3px; font-size:15px; }
.ww-next-card p { margin:0; color:var(--detail-muted); font-size:13px; line-height:1.65; }
.ww-next-cta { display:flex; flex-direction:column; gap:12px; padding:14px; margin-top:14px; border:1px solid #bfe8d9; border-radius:15px; background:linear-gradient(135deg,#effbf6,#f5faff); }
.ww-next-cta > div { min-width:0; display:flex; align-items:center; gap:10px; }
.ww-next-cta > div > span { min-width:0; }
.ww-next-cta strong { display:block; font-size:14px; line-height:1.4; }
#wwCountryDecision .ww-next-cta button { border-color:#ef6608; background:linear-gradient(110deg,#ff8500,#f4511e); color:white; font-weight:800; box-shadow:0 7px 16px rgba(239,102,8,.18); }
.dark .ww-next-intro { border-color:#704729; background:linear-gradient(135deg,#31241c,#2b211c); }
.dark .ww-next-intro > div > span { color:#ffaf70; }
.dark .ww-next-marker { border-color:#704729; background:#30241d; color:#ff9d57; }
.dark .ww-next-marker .ww-detail-icon { background:#442b1e; }
.dark .ww-next-phase { background:#18304f; color:#9dceff; }
.dark .ww-next-cta { border-color:#285b50; background:linear-gradient(135deg,#17362f,#15283f); }
.ww-living-visual { position:relative; overflow:hidden; height:190px; margin:0 0 14px; border-radius:14px; }
.ww-living-visual > img { width:100%; height:100%; object-fit:cover; display:block; }
.ww-living-visual::after { content:''; position:absolute; inset:45% 0 0; background:linear-gradient(transparent,rgba(7,22,45,.78)); }
.ww-living-visual > span { position:absolute; z-index:1; left:12px; right:12px; bottom:12px; display:flex; align-items:center; gap:10px; color:white; }
.ww-living-visual strong { font-size:16px; text-shadow:0 1px 4px #000; }
.ww-community-card { margin:0 0 14px; padding:14px; border:1px solid #cfe3fa; border-radius:16px; background:linear-gradient(145deg,#f4f9ff,#edf7ff); }
.ww-community-heading { display:flex; align-items:center; gap:10px; margin-bottom:12px; }
.ww-community-heading h4 { margin:0; font-size:16px; }
.ww-community-heading strong { display:block; color:#0870cf; font-size:13px; margin-top:2px; }

/* Highlight Total Populasi WNI Menetap */
.ww-community-stat-hero {
  margin: 0 0 12px;
  padding: 12px 14px;
  border-radius: 12px;
  border: 1px solid #b8d9fa;
  background: linear-gradient(135deg, #ffffff 0%, #eef6ff 100%);
  box-shadow: 0 1px 3px rgba(8, 102, 188, 0.06);
}
.ww-community-stat-hero-inner {
  display: flex;
  flex-direction: column;
  gap: 3px;
}
.ww-community-stat-label {
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .05em;
  color: #0866bc;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.ww-community-stat-value {
  font-size: 22px;
  font-weight: 900;
  color: #10214b;
  line-height: 1.25;
}
.ww-community-pop-note {
  font-size: 11.5px;
  color: #556987;
  line-height: 1.45;
  margin-top: 2px;
  display: block;
}

.ww-community-grid { display:grid; grid-template-columns:minmax(0,1fr); gap:8px; }
.ww-community-grid > div { position:relative; min-height:72px; padding:10px 10px 10px 50px; border:1px solid #d9e7f6; border-radius:12px; background:rgba(255,255,255,.88); }
.ww-community-grid .ww-detail-icon { position:absolute; top:10px; left:9px; }
.ww-community-grid span { display:block; color:#607492; font-size:12px; line-height:1.4; }
.ww-community-grid strong { display:block; margin-top:3px; color:#10214b; font-size:13px; line-height:1.55; }

/* Regional area breakdown & concentration */
.ww-community-areas {
  margin-top: 12px;
  padding: 12px 14px;
  border: 1px solid #cfe1f5;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.85);
}
.ww-community-areas-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 10px;
}
.ww-community-areas-title {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-size: 13px;
  color: #10214b;
}
.ww-community-areas-title i {
  color: #e86308;
  font-size: 14px;
}
.ww-community-areas-badge {
  padding: 2px 7px;
  border-radius: 6px;
  background: #e7f2ff;
  color: #0866bc;
  font-size: 11px;
  font-weight: 700;
  white-space: nowrap;
}
.ww-community-areas-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.ww-community-area-item {
  padding: 8px 10px;
  border: 1px solid #e1ecf8;
  border-radius: 10px;
  background: var(--detail-bg);
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.ww-community-area-main {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
}
.ww-community-area-name {
  font-size: 12.5px;
  color: #10214b;
}
.ww-community-area-stats {
  display: inline-flex;
  align-items: baseline;
  gap: 6px;
  flex-shrink: 0;
}
.ww-community-area-share {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 36px;
  padding: 2px 6px;
  border-radius: 5px;
  background: #fff0e5;
  color: #d95500;
  font-size: 11px;
  font-weight: 800;
}
.ww-community-area-count {
  font-size: 11.5px;
  font-weight: 600;
  color: #475569;
}
.ww-community-area-progress {
  height: 5px;
  width: 100%;
  border-radius: 999px;
  background: #e2e8f0;
  overflow: hidden;
}
.ww-community-area-progress > span {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(90deg, #2563eb 0%, #f97316 100%);
}
.ww-community-area-role {
  margin: 0;
  font-size: 11px;
  color: #64748b;
  line-height: 1.45;
}

.ww-community-footer {
  margin-top: 12px;
  padding-top: 10px;
  border-top: 1px solid #dce8f5;
}
.ww-community-source-note {
  margin: 0 0 10px;
  font-size: 11.5px;
  color: #5d7190;
  line-height: 1.55;
  display: flex;
  align-items: flex-start;
  gap: 7px;
}
.ww-community-source-note i {
  color: #0866bc;
  font-size: 13px;
  margin-top: 2px;
  flex-shrink: 0;
}
.ww-community-links { display:flex; flex-wrap:wrap; gap:8px; }
.ww-community-links a { min-height:44px; display:inline-flex; align-items:center; gap:6px; padding:9px 12px; border:1px solid #bcd8f7; border-radius:10px; background:white; color:#0866bc; font-size:12px; font-weight:700; text-decoration:none; transition:background .15s ease, border-color .15s ease; }
.ww-community-links a:hover { background:#f0f7ff; border-color:#8ec0f5; }

/* Dark mode overrides for community elements */
.dark .ww-community-card { border-color:#34587e; background:linear-gradient(145deg,#142941,#172f4b); }
.dark .ww-community-heading strong { color:#72b8ff; }
.dark .ww-community-stat-hero { border-color:#2e496b; background:linear-gradient(135deg,#112236 0%,#182f4c 100%); box-shadow:none; }
.dark .ww-community-stat-label { color:#72b8ff; }
.dark .ww-community-stat-value { color:#edf3ff; }
.dark .ww-community-pop-note { color:#9bb5d6; }
.dark .ww-community-grid > div,.dark .ww-community-links a { background:#111d33; border-color:#334d6d; }
.dark .ww-community-grid strong { color:#edf3ff; }
.dark .ww-community-grid span { color:#afbed8; }
.dark .ww-community-areas { border-color:#2a4463; background:rgba(17,29,51,.75); }
.dark .ww-community-areas-title { color:#edf3ff; }
.dark .ww-community-areas-badge { background:#1a3554; color:#9dceff; }
.dark .ww-community-area-item { border-color:#263d59; background:#111d33; }
.dark .ww-community-area-name { color:#edf3ff; }
.dark .ww-community-area-share { background:#3b2214; color:#ff9d57; }
.dark .ww-community-area-count { color:#afbed8; }
.dark .ww-community-area-progress { background:#1e334d; }
.dark .ww-community-area-role { color:#94a3b8; }
.dark .ww-community-footer { border-color:#263d59; }
.dark .ww-community-source-note { color:#afbed8; }
.dark .ww-community-source-note i { color:#72b8ff; }
.dark .ww-community-links a { color:#9dceff; }
.dark .ww-community-links a:hover { background:#162744; border-color:#466d9b; }
#wwLegacyCountryDetails { --legacy-accent:#7664e8; border-color:#c9c3f5; box-shadow:0 12px 30px rgba(60,48,140,.09); }
#wwLegacyCountryDetails::before { display:none; }
#wwLegacyCountryDetails > summary { min-height:86px; margin:-18px -18px 0; padding:13px 16px; border-radius:19px; background:linear-gradient(120deg,#172a58 0%,#304f92 62%,#6258bc 100%); color:white; box-shadow:inset 0 -1px rgba(255,255,255,.12); }
#wwLegacyCountryDetails[open] > summary { border-radius:19px 19px 13px 13px; }
#wwLegacyCountryDetails > summary::after { display:none; }
.ww-legacy-summary-main { min-width:0; display:flex; align-items:center; gap:11px; }
.ww-legacy-summary-icon { width:44px; height:44px; display:inline-flex; align-items:center; justify-content:center; flex:0 0 44px; border-radius:13px; background:linear-gradient(145deg,#ff9a35,#f0640a); color:white; box-shadow:0 7px 16px rgba(5,13,35,.22); }
.ww-legacy-summary-icon svg,.ww-legacy-toggle svg { width:21px; height:21px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.ww-legacy-summary-copy { min-width:0; display:block; }
.ww-legacy-summary-copy > span { display:block; margin-bottom:1px; color:#ffc78f; font-size:10px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; }
.ww-legacy-summary-copy > strong { display:block; color:white; font-size:17px; line-height:1.35; }
#wwLegacyCountryDetails .ww-legacy-summary-copy > small { display:block; margin-top:2px; color:#dce7ff; font-size:11px; font-weight:500; line-height:1.4; }
.ww-legacy-toggle { min-width:122px; min-height:44px; display:inline-flex; align-items:center; justify-content:center; gap:7px; flex-shrink:0; padding:8px 10px; border:1px solid rgba(255,255,255,.32); border-radius:12px; background:rgba(255,255,255,.12); color:white; font-size:12px; font-weight:800; backdrop-filter:blur(8px); transition:background .2s ease; }
#wwLegacyCountryDetails > summary:hover .ww-legacy-toggle { background:rgba(255,255,255,.2); }
.ww-legacy-toggle svg { width:17px; height:17px; transition:transform .2s ease; }
.ww-legacy-toggle-close { display:none; }
#wwLegacyCountryDetails[open] .ww-legacy-toggle-open { display:none; }
#wwLegacyCountryDetails[open] .ww-legacy-toggle-close { display:inline; }
#wwLegacyCountryDetails[open] .ww-legacy-toggle svg { transform:rotate(180deg); }
.ww-legacy-note { margin-top:16px; padding:12px 14px 16px; border-left:3px solid var(--legacy-accent); border-radius:0 11px 11px 0; background:#f2f0ff; color:#4f5f7c; font-size:13px; line-height:1.6; }
#wwLegacyCountryDetails > div { margin-top:16px; }
#wwLegacyCountryDetails { overflow-x:auto; }
/* Give the retained information the same surfaces and type scale as sections 1–9.
   Scope overrides here because the original renderer still emits utility classes. */
#wwLegacyCountryDetails :where(div,section,details,button,input,select) { min-width:0; }
#wwLegacyCountryDetails :where(p,li,span,label,dt,dd) { line-height:1.65; overflow-wrap:anywhere; }
#wwLegacyCountryDetails :is([class*="text-["],[class~="text-xs"],[class~="text-sm"]) { font-size:14px; }
#wwLegacyCountryDetails :is(h3,h4,h5) { color:var(--detail-ink); font-size:18px; line-height:1.45; font-weight:700; letter-spacing:normal; }
#wwLegacyCountryDetails :is([class*="text-slate-"],[class*="text-indigo-"],[class*="text-white"],[class*="text-purple-"],[class*="text-amber-"],[class*="text-orange-"]) { color:var(--detail-ink); }
#wwLegacyCountryDetails :is([class*="text-slate-400"],[class*="text-slate-500"]) { color:var(--detail-muted); }
#wwLegacyCountryDetails [class*="bg-"] { background-color:var(--detail-soft); background-image:none; }
#wwLegacyCountryDetails [class*="bg-white"] { background-color:var(--detail-bg); }
#wwLegacyCountryDetails [class*="border-"] { border-color:var(--detail-line); }
#wwLegacyCountryDetails [class*="shadow"] { box-shadow:none; }
#wwLegacyCountryDetails [class*="rounded-3xl"] { border-radius:14px; padding:16px; }
#wwLegacyCountryDetails [class*="rounded-2xl"] { border-radius:12px; }
#wwLegacyCountryDetails :is([class*="uppercase"],[class*="tracking-"]) { text-transform:none; letter-spacing:normal; }
#wwLegacyCountryDetails :is([class*="text-emerald-"],[class*="text-green-"]) { color:#008a60; }
#wwLegacyCountryDetails [class*="text-rose-"] { color:#bd2945; }
#wwLegacyCountryDetails [class*="bg-emerald-"] { background-color:#e9f7f0; }
#wwLegacyCountryDetails [class*="bg-rose-"] { background-color:#fff0f2; }
#wwLegacyCountryDetails :is(button,input,select) { min-height:44px; font-size:14px; border-radius:10px; }
#wwLegacyCountryDetails button { padding:10px 12px; border:1px solid var(--detail-line); background:var(--detail-bg); color:var(--detail-ink); }
#wwLegacyCountryDetails button:is([class~="bg-amber-500"],[class~="bg-indigo-600"],[class*="bg-gradient-"]) { background:#ef6608; border-color:#ef6608; color:white; }
#wwLegacyCountryDetails button:is([class~="bg-amber-500"],[class~="bg-indigo-600"],[class*="bg-gradient-"]) * { color:inherit; }
#wwLegacyCountryDetails :is(input,select) { max-width:100%; color:var(--detail-ink); background:var(--detail-bg); font-size:16px; }
#wwLegacyCountryDetails :is(button,input,select,summary):focus-visible { outline:3px solid #2689ef; outline-offset:3px; }
#legacyDashCountryHeroCard { background:var(--detail-bg); color:var(--detail-ink); border:1px solid var(--detail-line); }
#legacyDashCountryHeroCard #dashCountryName { font-size:26px; font-weight:800; }
#legacyDashCountryHeroCard :is(#dashWorldWorksScore,#dashProfileMatch,#dashPotentialSavings,#dashTakeHomePay) { font-size:20px; }
#wwLegacyCountryDetails [id^="dashSec_"] { scroll-margin-top:125px; }
#wwLegacyCountryDetails #dashTabContentBox > div { display:grid; gap:24px; }
#wwLegacyCountryDetails #dashTabContentBox > div > * { margin-top:0; }
.dark #wwLegacyCountryDetails :is([class*="text-emerald-"],[class*="text-green-"]) { color:#62dcac; }
.dark #wwLegacyCountryDetails [class*="text-rose-"] { color:#ff9caf; }
.dark #wwLegacyCountryDetails [class*="bg-emerald-"] { background-color:#17382f; }
.dark #wwLegacyCountryDetails [class*="bg-rose-"] { background-color:#3c2630; }
.dark #wwLegacyCountryDetails { border-color:#554b9a; }
.dark #wwLegacyCountryDetails > summary { background:linear-gradient(120deg,#16254a,#273f78 62%,#554c9f); }
.dark .ww-legacy-note { background:#222541; color:#c3cce1; }
@media(max-width:767px) {
  #legacyDashCountryHeroCard .flex { flex-wrap:wrap; }
  #legacyDashCountryHeroCard .truncate { white-space:normal; }
  #wwLegacyCountryDetails [class*="grid-cols-"] { grid-template-columns:minmax(0,1fr); }
  #wwLegacyCountryDetails [class*="col-span-"] { grid-column:auto; }
  #wwLegacyCountryDetails .flex.justify-between { flex-wrap:wrap; gap:8px; }
  #legacyDashCountryHeroCard > div:first-child > div:first-child { flex-wrap:nowrap; align-items:flex-start; }
  #legacyDashCountryHeroCard > .grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
}
@media(max-width:480px) { #wwLegacyCountryDetails .ww-legacy-summary-copy > small { display:none; } .ww-legacy-toggle { min-width:44px; width:44px; padding:0; } .ww-legacy-toggle > span { display:none!important; } }
#sectionDashboard :is(.custom-select-wrapper,.custom-select-trigger) { min-width:0; max-width:100%; }
#sectionDashboard > div:first-child > div { min-width:0; max-width:100%; }
#sectionDashboard .custom-select-trigger,#sectionDashboard .dash-life-btn { min-height:44px; }
#wwCountryDecision :is(button,input,select,summary):focus-visible { outline:3px solid #2689ef; outline-offset:3px; }
@media(max-width:767px) { #sectionDashboard div:has(> select) { min-width:0; width:100%; } #sectionDashboard .custom-select-wrapper,#sectionDashboard .custom-select-trigger { width:100%; } }
@media(min-width:768px) { .ww-country-visual { height:320px; margin:-24px -24px 22px; } .ww-detail-metrics { grid-template-columns:repeat(3,minmax(0,1fr)); } .ww-detail-overview,.ww-detail-panel { padding:24px; } #wwLegacyCountryDetails > summary { margin:-24px -24px 0; padding:15px 20px; } .ww-detail-jobs { grid-template-columns:repeat(2,minmax(0,1fr)); } .ww-detail-list > div { display:grid; grid-template-columns:minmax(180px,1fr) 3fr; gap:24px; align-items:start; } .ww-community-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .ww-match-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .ww-match-card--capital { grid-column:1/-1; } .ww-finance-summary { grid-template-columns:repeat(3,minmax(0,1fr)); } .ww-finance-dashboard { grid-template-columns:minmax(260px,.8fr) minmax(0,1.2fr); align-items:stretch; } .ww-finance-chart-card { align-content:center; } }
@media(min-width:600px) {
  #wwCountryDecision .ww-job-row > summary { grid-template-columns:minmax(0,1fr) auto 32px; }
  .ww-job-row-meta { grid-column:2; padding-left:12px; justify-content:flex-end; gap:12px; }
  .ww-job-row-salary { text-align:right; }
  .ww-job-row > summary::after { grid-column:3; }
  .ww-job-row-action { flex-direction:row; align-items:center; justify-content:space-between; gap:14px; padding:10px 14px; }
  #wwCountryDecision .ww-job-change-btn { width:auto; flex-shrink:0; order:2; }
  .ww-job-change-hint { text-align:left; flex:1; order:1; }
}
@media(min-width:768px) { .ww-next-steps { grid-template-columns:repeat(2,minmax(0,1fr)); } .ww-next-steps > li:last-child { grid-column:1/-1; } .ww-next-steps > li .ww-next-marker::after { display:none; } .ww-next-cta { flex-direction:row; align-items:center; justify-content:space-between; } .ww-next-cta button { flex-shrink:0; } }
@media(min-width:960px) { .ww-detail-jobs--featured { grid-template-columns:minmax(0,1fr); } .ww-detail-jobs--featured .ww-detail-job { display:grid; grid-template-columns:minmax(260px,.8fr) minmax(0,1.2fr); gap:0 12px; align-items:center; } .ww-detail-jobs--featured .ww-job-requirements { grid-column:1/-1; } }
@media print { .ww-detail-nav,.ww-detail-actions { display:none; } }
.ww-prep-heading h4 { margin:0; font-size:18px; }
.ww-prep-heading p { color:var(--detail-muted); }
.ww-prep-base,.ww-prep-scenarios { display:grid; gap:10px; margin:14px 0; }
.ww-prep-base article { display:flex; gap:12px; padding:14px; background:var(--detail-soft); border:1px solid var(--detail-line); border-radius:14px; }
.ww-prep-base article > div { min-width:0; }
.ww-prep-base span,.ww-prep-total span { display:block; font-size:13px; color:var(--detail-muted); }
.ww-prep-base strong { display:block; font-size:19px; overflow-wrap:anywhere; }
.ww-prep-scenario { min-width:0; border:1px solid var(--detail-line); border-radius:14px; overflow:hidden; background:var(--detail-bg); }
.ww-prep-scenario h4 { margin:0; padding:12px 14px; background:var(--detail-soft); }
.ww-prep-scenario dl { padding:10px 14px; margin:0; }
.ww-prep-scenario dl > div { display:flex; justify-content:space-between; gap:10px; padding:6px 0; font-size:13px; }
.ww-prep-scenario dd { text-align:right; overflow-wrap:anywhere; }
.ww-prep-total { padding:12px 14px; background:color-mix(in srgb,#0aa578 9%,var(--detail-bg)); border-top:1px solid var(--detail-line); }
.ww-prep-total > strong { display:block; font-size:19px; color:#008f64; overflow-wrap:anywhere; }
@media(min-width:768px) { .ww-prep-base { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(min-width:1000px) { .ww-prep-scenarios { grid-template-columns:repeat(3,minmax(0,1fr)); } }
.ww-prep-duration { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; padding:5px; margin:12px 0; background:var(--detail-soft); border:1px solid var(--detail-line); border-radius:13px; }
#wwCountryDecision .ww-prep-duration button { min-height:44px; font-weight:700; }
#wwCountryDecision .ww-prep-duration button[aria-pressed="true"] { background:#ef6608; border-color:#ef6608; color:white; }
.ww-prep-scenarios { grid-template-columns:minmax(0,1fr); }
.ww-prep-scenario dl > div { border-bottom:1px solid var(--detail-line); padding:10px 0; }
.ww-prep-scenario dt { min-width:0; flex:1; }
.ww-prep-scenario dd { flex-shrink:0; }
.ww-prep-insurance { display:flex; align-items:flex-start; gap:10px; padding:14px; margin:12px 0; background:var(--detail-soft); border:1px solid var(--detail-line); border-radius:14px; }
.ww-prep-insurance h4 { margin:0; }
.ww-prep-insurance > div { min-width:0; }
.ww-legacy-export { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px; border:1px solid var(--detail-line); border-radius:12px; background:var(--detail-soft); }
.ww-legacy-export small { display:block; font-size:12px; color:var(--detail-muted); }
#wwLegacyCountryDetails .ww-legacy-export button { flex-shrink:0; background:#304f92; color:white; border-color:#304f92; font-weight:700; }
@media(max-width:480px) { .ww-legacy-export { align-items:stretch; flex-direction:column; } }
#wwLegacyCountryDetails .ww-savings-goal { margin-top:16px; padding-top:14px; border-top:1px solid var(--detail-line); }
#wwLegacyCountryDetails .ww-savings-goal > label { display:block; font-size:14px; font-weight:700; margin-bottom:9px; }
#wwLegacyCountryDetails .ww-savings-goal-controls { display:grid; grid-template-columns:minmax(0,1fr); gap:9px; width:100%; }
#wwLegacyCountryDetails .ww-savings-goal-controls > * { min-width:0; width:100%; }
#wwLegacyCountryDetails #wwSavingsGoalSelect { min-height:48px; padding:10px 12px; border:1px solid var(--detail-line); border-radius:11px; font-size:16px; background:var(--detail-bg); }
#wwLegacyCountryDetails .ww-savings-goal-result { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:6px 12px; padding:12px; border:1px solid #bee4d7; border-radius:11px; background:#edf9f3; color:#116c50; }
#wwLegacyCountryDetails .ww-savings-goal-result > span { font-size:13px; }
#wwLegacyCountryDetails .ww-savings-goal-result > strong { font-size:18px; line-height:1.35; }
#wwLegacyCountryDetails .ww-savings-goal > small { display:block; margin-top:8px; color:var(--detail-muted); font-size:12px; line-height:1.5; }
.dark #wwLegacyCountryDetails .ww-savings-goal-result { background:#17382f; border-color:#306553; color:#9de5ca; }
/* Overview: category colors keep key figures easy to distinguish. */
.ww-detail-metrics > .ww-overview-metric { --metric-accent:#2563bd; --metric-tint:#edf5ff; min-height:90px; border-color:color-mix(in srgb,var(--metric-accent) 22%,var(--detail-bg)); background:linear-gradient(125deg,var(--metric-tint),var(--detail-bg)); box-shadow:inset 3px 0 var(--metric-accent); }
.ww-detail-metrics > .ww-overview-metric--home { --metric-accent:#ae6418; --metric-tint:#fff5e8; }
.ww-detail-metrics > .ww-overview-metric--savings { --metric-accent:#008b64; --metric-tint:#e8f9f0; }
.ww-detail-metrics > .ww-overview-metric--plane { --metric-accent:#dd5d12; --metric-tint:#fff0e4; }
.ww-detail-metrics > .ww-overview-metric--time { --metric-accent:#7152bf; --metric-tint:#f2edff; }
.ww-detail-metrics > .ww-overview-metric--visa { --metric-accent:#087d8c; --metric-tint:#e9f8fa; }
.ww-detail-metrics > .ww-detail-negative { --metric-accent:#be324d; --metric-tint:#fff0f3; }
.ww-detail-metrics > .ww-overview-metric > .ww-detail-icon { color:var(--metric-accent); background:color-mix(in srgb,var(--metric-accent) 12%,var(--detail-bg)); display:inline-flex; }
.ww-detail-metrics > .ww-overview-metric > strong { font-size:18px; line-height:1.4; margin-top:5px; }
.ww-detail-metrics > .ww-overview-metric > .ww-overview-metric-sub { display:block; font-size:11px; line-height:1.35; font-weight:600; color:var(--metric-accent); margin-top:2px; letter-spacing:-0.01em; opacity:0.92; }
.ww-detail-score { display:block; text-align:center; padding:9px 12px; border:1px solid #bce7d8; border-radius:14px; background:#eefbf5; line-height:1.2; }
.ww-detail-score .ww-score-caption { display:block; margin-bottom:3px; font-size:10px; font-weight:600; color:#316d5e; }
#wwCountryDecision .ww-detail-score small { display:inline; font-size:12px; margin-left:2px; }
.dark .ww-detail-metrics > .ww-overview-metric { --metric-tint:color-mix(in srgb,var(--metric-accent) 19%,#111d33); }
.dark .ww-detail-score { background:#17382f; border-color:#306553; color:#68dfb4; }
.dark .ww-detail-score .ww-score-caption { color:#aedfce; }
@media(max-width:480px) { .ww-detail-metrics > .ww-overview-metric { padding:10px 10px 12px; } .ww-detail-metrics > .ww-overview-metric > .ww-detail-icon { position:static; width:28px; height:28px; margin-bottom:6px; } .ww-detail-metrics > .ww-overview-metric > strong { font-size:16px; } .ww-detail-score { padding:8px; } }
.ww-match-reserve { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:7px; max-width:380px; margin:10px 0 12px; }
#wwCountryDecision .ww-match-reserve button { min-height:44px; padding:8px; font-size:14px; font-weight:700; }
#wwCountryDecision .ww-match-reserve button[aria-pressed="true"] { background:#ef6608; border-color:#ef6608; color:white; }