@font-face {
  font-family: "Vazirmatn Atlas";
  src: url("/fonts/vazirmatn-arabic.woff2") format("woff2-variations");
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
}

:root {
  color-scheme: light;
  --ink: #261d19;
  --muted: #74655e;
  --paper: #f7f2ec;
  --paper-deep: #eee4da;
  --panel: rgba(255, 252, 248, .82);
  --line: rgba(69, 49, 40, .12);
  --orange: #f47721;
  --orange-deep: #d9540c;
  --orange-soft: #fff0e3;
  --green: #20775b;
  --shadow: 0 28px 80px rgba(66, 40, 25, .12);
  --text-2xs: clamp(.54rem, .5rem + .12vw, .62rem);
  --text-xs: clamp(.62rem, .58rem + .14vw, .72rem);
  --text-sm: clamp(.72rem, .66rem + .18vw, .84rem);
  --text-md: clamp(.88rem, .8rem + .24vw, 1.05rem);
  --leading-tight: 1.25;
  --leading-copy: 1.85;
  font-family: "Vazirmatn Atlas", Vazirmatn, Tahoma, Arial, sans-serif;
  font-synthesis: none;
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  min-width: 320px;
  background:
    radial-gradient(circle at 12% 3%, rgba(244, 119, 33, .12), transparent 26rem),
    linear-gradient(180deg, #faf7f3 0, var(--paper) 28rem, #f2ebe4 100%);
  color: var(--ink);
  font-weight: 440;
  line-height: 1.6;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

button, input, select { font: inherit; }
button, select { cursor: pointer; }
button:focus-visible, input:focus-visible, select:focus-visible, [tabindex="0"]:focus-visible {
  outline: 3px solid rgba(244, 119, 33, .34);
  outline-offset: 3px;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.topbar {
  width: min(1480px, calc(100% - 2.5rem));
  min-height: 80px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid var(--line);
}

.brand {
  display: inline-flex;
  align-items: center;
  gap: .68rem;
  color: var(--ink);
  text-decoration: none;
  font-weight: 790;
}

.brand-mark {
  width: .85rem;
  height: .85rem;
  border-radius: 72% 28% 64% 36%;
  background: var(--orange);
  box-shadow: 0 0 0 6px rgba(244, 119, 33, .11);
  transform: rotate(45deg);
}

.edition {
  padding: .48rem .82rem;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--muted);
  background: rgba(255, 255, 255, .46);
  font-size: .78rem;
  font-weight: 640;
}

main { width: min(1480px, calc(100% - 2.5rem)); margin: 0 auto; }

.intro {
  min-height: 420px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 3rem;
  padding: clamp(4rem, 8vw, 7.5rem) 0 4.5rem;
}

.eyebrow {
  margin: 0 0 .75rem;
  color: var(--orange-deep);
  font-size: .77rem;
  font-weight: 760;
  letter-spacing: -.01em;
}

h1 {
  max-width: 780px;
  margin: 0;
  font-size: clamp(3.1rem, 7vw, 7.4rem);
  font-weight: 760;
  line-height: .98;
  letter-spacing: -.055em;
}

h1 em { color: var(--orange); font-style: normal; font-weight: 840; }
.intro-copy {
  max-width: 710px;
  margin: 1.65rem 0 0;
  color: var(--muted);
  font-size: clamp(.98rem, 1.5vw, 1.15rem);
  line-height: 2;
}

.overview {
  display: grid;
  grid-template-columns: repeat(3, minmax(98px, 1fr));
  gap: .65rem;
  margin: 0;
}

.overview div {
  min-width: 112px;
  padding: 1rem 1.05rem;
  border-top: 1px solid var(--line);
}

.overview dt { color: var(--muted); font-size: var(--text-xs); font-weight: 620; line-height: var(--leading-tight); }
.overview dd { margin: .38rem 0 0; font-size: clamp(1.55rem, 1.35rem + .7vw, 2rem); font-weight: 820; line-height: 1; font-variant-numeric: tabular-nums; font-feature-settings: "tnum" 1; }

.overview dd, .province-counts b, .city-profile-stats dd, .city-result-count, #result-count, #community-result-count {
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum" 1;
  transition: color .2s ease, transform .2s ease;
}
.is-counting { display: inline-block; color: var(--orange-deep) !important; transform-origin: center bottom; animation: counter-rise .72s cubic-bezier(.16,1,.3,1); }

.atlas {
  display: grid;
  grid-template-columns: minmax(0, 1.18fr) minmax(380px, .82fr);
  min-height: 850px;
  overflow: hidden;
  border: 1px solid rgba(75, 48, 34, .12);
  border-radius: 2rem;
  background: var(--panel);
  box-shadow: var(--shadow);
  backdrop-filter: blur(18px);
}

.map-panel {
  position: relative;
  min-width: 0;
  padding: clamp(1rem, 2.4vw, 2rem);
  border-left: 1px solid var(--line);
  background:
    linear-gradient(rgba(255,255,255,.6), rgba(255,255,255,.08)),
    radial-gradient(circle at 50% 42%, rgba(244,119,33,.1), transparent 46%);
}

.map-toolbar {
  position: relative;
  z-index: 8;
  display: grid;
  grid-template-columns: minmax(320px, 1.25fr) minmax(220px, .75fr);
  align-items: stretch;
  gap: .75rem;
}

.province-picker-card {
  padding: .85rem;
  border: 1px solid rgba(72,47,35,.1);
  border-radius: 1.15rem;
  background: rgba(255,255,255,.76);
  box-shadow: 0 12px 34px rgba(68,40,25,.07), inset 0 1px rgba(255,255,255,.8);
  backdrop-filter: blur(16px);
}
.picker-heading { display: flex; align-items: center; gap: .62rem; }
.picker-pin { flex: 0 0 auto; width: 38px; height: 38px; display: grid; place-items: center; border-radius: .8rem; background: linear-gradient(145deg, #fff2e6, #ffe3cd); box-shadow: inset 0 0 0 1px rgba(244,119,33,.16); }
.picker-pin i { position: relative; width: 13px; height: 16px; border: 2px solid var(--orange-deep); border-radius: 50% 50% 58% 58%; }
.picker-pin i::before { content: ""; position: absolute; inset: 3px; border-radius: 50%; background: var(--orange); }
.picker-pin i::after { content: ""; position: absolute; left: 2px; bottom: -5px; width: 6px; height: 6px; border-right: 2px solid var(--orange-deep); border-bottom: 2px solid var(--orange-deep); transform: rotate(45deg); }
.picker-heading div { display: grid; gap: .05rem; }
.picker-heading span { color: var(--orange-deep); font-size: .57rem; font-weight: 730; }
.picker-heading strong { font-size: .8rem; }
.province-select-wrap { position: relative; display: block; margin-top: .65rem; }
.province-select-wrap select {
  appearance: none;
  width: 100%;
  min-height: 48px;
  padding: 0 .9rem 0 2.7rem;
  border: 1px solid rgba(72,47,35,.13);
  border-radius: .82rem;
  background: #fffaf6;
  color: var(--ink);
  font-size: .77rem;
  font-weight: 720;
  box-shadow: 0 5px 18px rgba(73,43,27,.04);
}
.province-select-wrap > i { position: absolute; left: 1rem; top: 50%; width: 7px; height: 7px; border-left: 1.5px solid var(--muted); border-bottom: 1.5px solid var(--muted); pointer-events: none; transform: translateY(-70%) rotate(-45deg); }
.quick-provinces { display: flex; align-items: center; flex-wrap: wrap; gap: .32rem; margin-top: .58rem; }
.quick-provinces > span { margin-left: .12rem; color: var(--muted); font-size: .53rem; }
.quick-provinces button { min-height: 34px; padding: .25rem .62rem; border: 1px solid rgba(72,47,35,.09); border-radius: 999px; background: #f7f1ec; color: #5c4b43; font-size: .55rem; transition: .2s ease; }
.quick-provinces button:hover { border-color: rgba(244,119,33,.3); background: var(--orange-soft); color: var(--orange-deep); }
.quick-provinces button[aria-pressed="true"] { border-color: var(--orange); background: var(--orange); color: #fff; box-shadow: 0 5px 14px rgba(217,84,12,.18); }
.map-toolbar-actions { display: flex; flex-direction: column; justify-content: space-between; gap: .65rem; }
.map-status-card { flex: 1; display: flex; align-items: center; gap: .65rem; padding: .85rem; border: 1px solid rgba(72,47,35,.09); border-radius: 1.15rem; background: linear-gradient(145deg, rgba(45,33,28,.95), rgba(70,47,36,.94)); color: #fff; box-shadow: 0 12px 30px rgba(47,29,21,.11); }
.map-status-card > div { display: grid; gap: .14rem; }
.map-status-card strong { font-size: .69rem; }
.map-status-card span:not(.live-dot) { color: rgba(255,255,255,.62); font-size: .54rem; line-height: 1.6; }
.map-toolbar-actions > button { min-height: 40px; padding: .25rem .7rem; border: 1px solid rgba(244,119,33,.2); border-radius: .72rem; background: var(--orange-soft); color: var(--orange-deep); font-size: .6rem; font-weight: 700; }
.map-toolbar-actions > button span { display: inline-block; margin-left: .28rem; font-size: .8rem; }
.live-dot { display: inline-block; flex: 0 0 auto; width: .46rem; height: .46rem; margin-left: .35rem; border-radius: 50%; background: #5dd6ad; box-shadow: 0 0 0 4px rgba(93,214,173,.11), 0 0 12px rgba(93,214,173,.28); }

.map-stage {
  position: relative;
  min-height: 690px;
  display: grid;
  place-items: start center;
  overflow: hidden;
  isolation: isolate;
  border-radius: 1.5rem;
  background: radial-gradient(circle at 50% 42%, rgba(255,255,255,.78), transparent 48%), linear-gradient(155deg, rgba(255,244,235,.52), rgba(244,224,209,.18));
}
.map-stage::before {
  content: "";
  position: absolute;
  z-index: -3;
  inset: -25%;
  background: radial-gradient(circle at 22% 28%, rgba(244,119,33,.16), transparent 18%), radial-gradient(circle at 76% 40%, rgba(255,180,119,.2), transparent 20%), radial-gradient(circle at 52% 76%, rgba(155,84,44,.1), transparent 22%);
  filter: blur(8px);
  animation: atlas-aurora 16s ease-in-out infinite alternate;
}
.map-stage::after {
  content: "";
  position: absolute;
  z-index: -2;
  inset: 0;
  opacity: .22;
  background-image: radial-gradient(rgba(130,81,52,.22) .7px, transparent .7px);
  background-size: 18px 18px;
  mask-image: radial-gradient(ellipse at center, #000 0, transparent 68%);
  animation: atlas-grid-drift 22s linear infinite;
}
.map-halo { position: absolute; z-index: -1; inset: 15% 8% 6%; border-radius: 50%; background: radial-gradient(ellipse, rgba(164,86,42,.16), transparent 68%); filter: blur(16px); transform: rotate(-7deg) scaleY(.62); animation: atlas-halo 8s ease-in-out infinite alternate; }
.map-atmosphere { position: absolute; z-index: -1; inset: 3% 4% 13%; pointer-events: none; }
.map-atmosphere i { position: absolute; border: 1px dashed rgba(209,111,50,.2); border-radius: 50%; transform: rotate(-11deg); animation: atlas-orbit 30s linear infinite; }
.map-atmosphere i::before { content: ""; position: absolute; top: -3px; left: 50%; width: 6px; height: 6px; border-radius: 50%; background: #f89a59; box-shadow: 0 0 0 4px rgba(244,119,33,.08), 0 0 13px rgba(244,119,33,.45); }
.map-atmosphere i:nth-child(1) { inset: 12% 2% 5%; border-color: rgba(209,111,50,.13); animation-duration: 38s; }
.map-atmosphere i:nth-child(2) { inset: 19% 10% 12%; border-style: solid; border-color: rgba(209,111,50,.13); animation-duration: 31s; animation-direction: reverse; }
.map-atmosphere i:nth-child(2)::before { top: auto; right: 20%; bottom: -2px; left: auto; width: 4px; height: 4px; }
.map-atmosphere i:nth-child(3) { inset: 26% 18% 19%; animation-duration: 24s; }
.map-atmosphere i:nth-child(4) { inset: 34% 27% 27%; border-style: solid; border-color: rgba(244,119,33,.17); animation-duration: 18s; animation-direction: reverse; }
.map-atmosphere i:nth-child(4)::before { width: 4px; height: 4px; }
.map-atmosphere span { position: absolute; top: 23%; left: 12%; width: 5px; height: 5px; border-radius: 50%; background: var(--orange); box-shadow: 0 0 18px 5px rgba(244,119,33,.24); animation: atlas-particle 9s ease-in-out infinite; }

#iran-map {
  position: relative;
  z-index: 1;
  width: min(100%, 760px);
  height: auto;
  overflow: visible;
  filter: drop-shadow(0 22px 20px rgba(71, 38, 21, .12));
}

.province { transition: transform .62s cubic-bezier(.16,1,.3,1), filter .55s ease, opacity .55s ease; transform-box: fill-box; transform-origin: center; }
.province:hover, .province.is-selected { transform: translateY(-8px); filter: brightness(1.04) saturate(1.04); }
.atlas.has-focus .province.is-dimmed { opacity: .075; filter: grayscale(.55) blur(.25px); transform: translateY(9px) scale(.985); }
.atlas.has-focus .province.is-selected { opacity: 1; transform: translateY(-13px) scale(1.018); filter: drop-shadow(0 16px 12px rgba(113,45,12,.23)) brightness(1.05); }
.province .depth { pointer-events: none; fill: #a83b0b; opacity: .86; }
.province .surface {
  cursor: pointer;
  stroke: rgba(255, 246, 238, .88);
  stroke-width: 1.25;
  stroke-linejoin: round;
  transition: fill .25s ease, stroke .25s ease;
}
.province .sheen { pointer-events: none; fill: url(#map-sheen); opacity: .56; }
.province.is-selected .surface { stroke: #fff9f2; stroke-width: 2.8; }
.province.is-selected .depth { fill: #8e2d06; }
.province .led-border { pointer-events: none; fill: none; stroke: rgba(255,244,220,.58); stroke-width: 1.15; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 1.2 10; animation: led-flow 13s linear infinite; filter: url(#led-glow); opacity: .42; }
.province:nth-child(3n) .led-border { animation-duration: 15s; animation-direction: reverse; }
.province:nth-child(4n) .led-border { animation-duration: 17s; }
.province:hover .led-border, .province.is-selected .led-border { stroke: #fff8d7; stroke-width: 1.7; stroke-dasharray: 2.5 8; opacity: .95; animation-duration: 5.5s; }
.heat-1 .surface { fill: #f9b27f; }
.heat-2 .surface { fill: #f79754; }
.heat-3 .surface { fill: #f47b2d; }
.heat-4 .surface { fill: #e95f16; }
.heat-5 .surface { fill: #ce430b; }

.county-outline { fill: none; stroke: rgba(88, 35, 12, .5); stroke-width: .7; stroke-linejoin: round; pointer-events: none; }
.province-label { font-family: inherit; font-weight: 760; fill: rgba(255,255,255,.96); text-anchor: middle; dominant-baseline: middle; paint-order: stroke; stroke: rgba(86,35,13,.62); stroke-width: 2px; stroke-linejoin: round; pointer-events: none; transition: opacity .5s ease, transform .5s ease, filter .5s ease; }
.province-label tspan { direction: rtl; unicode-bidi: plaintext; }
.province-callout { cursor: pointer; pointer-events: auto; outline: none; transition: opacity .5s ease, filter .25s ease; }
.province-callout-line { fill: none; stroke: rgba(72,43,28,.42); stroke-width: .8; stroke-dasharray: 2 2; }
.province-callout-dot { fill: #fff7ef; stroke: var(--orange-deep); stroke-width: 1.4; }
.province-callout-box { fill: rgba(255,252,248,.94); stroke: rgba(86,50,31,.14); stroke-width: .8; filter: drop-shadow(0 4px 7px rgba(61,34,21,.09)); }
.province-callout-text { fill: #3e2c24; font-family: inherit; font-size: 8.4px; font-weight: 760; text-anchor: middle; dominant-baseline: middle; }
.province-callout:hover, .province-callout:focus-visible { filter: drop-shadow(0 5px 7px rgba(217,84,12,.2)); }
.province-callout:hover .province-callout-box, .province-callout:focus-visible .province-callout-box { fill: #fff4e9; stroke: var(--orange); stroke-width: 1.2; }
.province-callout:focus-visible .province-callout-text { fill: var(--orange-deep); }
.atlas.has-focus .province-label.is-dimmed { opacity: .035; }
.atlas.has-focus .province-callout.is-dimmed { opacity: .05; }
.atlas.has-focus .province-label.is-selected { opacity: 1; transform: translateY(-5px); filter: drop-shadow(0 2px 2px rgba(65,25,8,.25)); }
.atlas.has-focus .province-callout.is-selected { opacity: 1; filter: drop-shadow(0 3px 5px rgba(217,84,12,.12)); }

.map-tooltip {
  position: absolute;
  z-index: 5;
  pointer-events: none;
  min-width: 150px;
  padding: .7rem .8rem;
  border: 1px solid rgba(255,255,255,.34);
  border-radius: .82rem;
  background: rgba(42, 29, 24, .91);
  color: #fff;
  box-shadow: 0 .9rem 2.2rem rgba(44,27,19,.22);
  backdrop-filter: blur(12px);
  font-size: .74rem;
  line-height: 1.75;
}
.map-tooltip b { display: block; font-size: .88rem; }
.map-tooltip span { color: rgba(255,255,255,.72); }

.map-guide { position: absolute; z-index: 4; right: 1rem; left: 1rem; bottom: .8rem; min-height: 86px; display: grid; grid-template-columns: auto minmax(160px,.7fr) minmax(290px,1.3fr); align-items: center; gap: 1rem; padding: .72rem .82rem; border: 1px solid rgba(255,255,255,.62); border-radius: 1.05rem; background: rgba(255,252,248,.78); box-shadow: 0 14px 38px rgba(64,37,23,.09), inset 0 0 0 1px rgba(88,50,31,.04); backdrop-filter: blur(18px); }
.map-guide-heading { display: flex; align-items: center; gap: .55rem; }
.map-guide-heading > span { width: 31px; height: 31px; border-radius: .65rem; background: conic-gradient(from 180deg, #f9b27f, #ce430b, #f9b27f); box-shadow: inset 0 0 0 6px rgba(255,255,255,.72); }
.map-guide-heading div { display: grid; }
.map-guide-heading small { color: var(--orange-deep); font-size: .48rem; font-weight: 720; }
.map-guide-heading strong { font-size: .65rem; white-space: nowrap; }
.heat-guide { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: .42rem; color: var(--muted); font-size: .48rem; }
.heat-guide i { height: 7px; border-radius: 999px; background: linear-gradient(90deg, #f9b27f, #f79754, #f47b2d, #e95f16, #ce430b); box-shadow: inset 0 0 0 1px rgba(89,48,25,.08); }
.map-guide ul { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: .45rem; margin: 0; padding: 0; list-style: none; }
.map-guide li { min-width: 0; display: flex; align-items: center; gap: .38rem; color: var(--muted); font-size: .47rem; line-height: 1.45; }
.map-guide li > i { flex: 0 0 auto; width: 21px; height: 21px; display: grid; place-items: center; border-radius: .5rem; background: #f5ede7; }
.map-guide li b { display: block; color: var(--ink); font-size: .5rem; }
.guide-led::before { content: ""; width: 13px; height: 2px; border-radius: 2px; background: linear-gradient(90deg, transparent, var(--orange), transparent); box-shadow: 0 0 5px rgba(244,119,33,.7); }
.guide-label { color: var(--orange-deep); font-style: normal; font-size: .58rem; font-weight: 800; }
.guide-click::before { content: ""; width: 7px; height: 7px; border: 1.5px solid var(--orange-deep); border-radius: 50%; box-shadow: 0 0 0 3px rgba(244,119,33,.1); }
.compass { position: absolute; z-index: 3; left: 1rem; top: 1.2rem; width: 52px; height: 52px; display: grid; place-items: center; color: var(--muted); font-size: .62rem; }
.compass i { position: absolute; width: 1px; height: 35px; background: var(--line); }
.compass i::before { content: ""; position: absolute; top: -1px; left: -4px; border-width: 0 4.5px 8px; border-style: solid; border-color: transparent transparent var(--orange); }
.compass span { position: absolute; top: -6px; }
.compass b { position: absolute; bottom: -6px; font-weight: 580; }

.detail-panel { position: relative; min-width: 0; min-height: 850px; padding: clamp(1.1rem, 2.5vw, 2.2rem); background: rgba(255,255,255,.64); }
.detail-content { transition: opacity .3s ease, transform .45s cubic-bezier(.16,1,.3,1), filter .3s ease; }
.detail-panel.is-loading .detail-content { opacity: .08; transform: translateY(12px) scale(.985); filter: blur(3px); pointer-events: none; }
.province-transition { position: absolute; z-index: 10; inset: 0; display: grid; place-content: center; justify-items: center; gap: 1.2rem; background: radial-gradient(circle at center, rgba(255,248,241,.98), rgba(249,242,234,.88) 48%, rgba(249,242,234,.55)); backdrop-filter: blur(14px); opacity: 0; visibility: hidden; transition: opacity .28s ease, visibility .28s ease; }
.province-transition.is-active { opacity: 1; visibility: visible; }
.province-transition p { margin: 0; color: var(--muted); font-size: .76rem; }
.province-transition p b { display: block; margin-top: .28rem; color: var(--ink); font-size: 1.15rem; text-align: center; }
.transition-orbit { position: relative; width: 86px; height: 86px; display: grid; place-items: center; }
.transition-orbit i { position: absolute; inset: 0; border: 1px solid rgba(244,119,33,.2); border-radius: 42% 58% 64% 36%; animation: orbit 2.1s linear infinite; }
.transition-orbit i:nth-child(2) { inset: 10px; border-color: rgba(244,119,33,.38); animation-duration: 1.55s; animation-direction: reverse; }
.transition-orbit i:nth-child(3) { inset: 20px; border-style: dashed; border-color: rgba(217,84,12,.48); animation-duration: 1.1s; }
.transition-orbit span { width: 23px; height: 23px; border-radius: 72% 28% 64% 36%; background: linear-gradient(145deg, #ff9e55, var(--orange-deep)); box-shadow: 0 0 28px rgba(244,119,33,.55); transform: rotate(45deg); }
.transition-line { width: 150px; height: 2px; overflow: hidden; border-radius: 999px; background: rgba(78,52,40,.08); }
.transition-line span { display: block; width: 44%; height: 100%; border-radius: inherit; background: linear-gradient(90deg, transparent, var(--orange), transparent); animation: trace 1.15s ease-in-out infinite; }
.province-heading { display: flex; align-items: end; justify-content: space-between; gap: 1rem; padding-bottom: 1.45rem; border-bottom: 1px solid var(--line); }
.province-heading p { margin: 0 0 .3rem; color: var(--muted); font-size: var(--text-xs); line-height: var(--leading-tight); }
.province-heading h2 { margin: 0; font-size: clamp(2.05rem, 3vw, 3.1rem); font-weight: 810; line-height: 1.08; letter-spacing: -.035em; }
.province-counts { display: grid; gap: .32rem; color: var(--muted); font-size: var(--text-xs); line-height: 1.4; text-align: left; white-space: nowrap; }
.province-counts b { display: inline-block; min-width: 2.1ch; color: var(--ink); font-size: var(--text-md); font-weight: 820; font-variant-numeric: tabular-nums; }
.province-guide { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(12rem, .65fr); gap: 1rem; margin: 1rem 0 1.2rem; padding: 1rem; border: 1px solid rgba(117, 66, 37, .14); border-radius: 18px; background: linear-gradient(135deg, rgba(255, 249, 241, .96), rgba(241, 225, 207, .62)); box-shadow: 0 14px 30px rgba(64, 36, 20, .06); }
.province-guide-copy > span { color: var(--orange-deep); font-size: .64rem; font-weight: 800; }
.province-guide-copy p { margin: .35rem 0; color: var(--ink); font-size: .76rem; line-height: 1.85; }
.province-guide-copy strong { display: block; color: var(--muted); font-size: .68rem; line-height: 1.75; }
.province-guide-meta { display: grid; align-content: center; gap: .6rem; padding-inline-start: .9rem; border-inline-start: 1px solid var(--line); }
.province-guide-meta p { margin: 0; color: var(--muted); font-size: .62rem; line-height: 1.7; }
.province-category-chips { display: flex; flex-wrap: wrap; gap: .32rem; }
.province-category-chips span { padding: .27rem .48rem; border-radius: 999px; background: rgba(117, 66, 37, .09); color: var(--ink); font-size: .58rem; font-weight: 750; }

.county-section, .university-section, .community-section { padding-top: 1.4rem; }
.section-title { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: .8rem; }
.section-title > div p { margin: 0 0 .2rem; color: var(--muted); font-size: var(--text-2xs); line-height: var(--leading-copy); }
.section-title h3 { margin: 0; font-size: var(--text-md); font-weight: 780; line-height: 1.45; letter-spacing: -.01em; }
.section-title span { color: var(--muted); font-size: var(--text-xs); }
.section-title button { padding: .2rem 0; border: 0; background: transparent; color: var(--orange-deep); font-size: .68rem; }

.city-menu-toolbar { display: grid; grid-template-columns: minmax(0,1fr) minmax(118px,.62fr); gap: .42rem; margin-bottom: .62rem; }
.city-search, .city-sort-wrap { position: relative; display: block; }
.city-search svg { position: absolute; top: 50%; right: .68rem; width: 15px; height: 15px; fill: none; stroke: var(--muted); stroke-width: 1.8; transform: translateY(-50%); }
.city-search input, .city-sort-wrap select { width: 100%; min-height: 42px; border: 1px solid var(--line); border-radius: .76rem; background: rgba(255,255,255,.82); color: var(--ink); outline: 0; font-size: var(--text-xs); }
.city-search input { padding: 0 2.15rem 0 .65rem; }
.city-sort-wrap select { appearance: none; padding: 0 .62rem 0 1.8rem; }
.city-sort-wrap > i { position: absolute; left: .7rem; top: 50%; width: 6px; height: 6px; border-left: 1.4px solid var(--muted); border-bottom: 1.4px solid var(--muted); pointer-events: none; transform: translateY(-70%) rotate(-45deg); }
.city-search input:focus, .city-sort-wrap select:focus { border-color: rgba(244,119,33,.46); box-shadow: 0 0 0 3px rgba(244,119,33,.08); }
.city-result-count { grid-column: 1 / -1; justify-self: end; min-height: 22px; padding: .2rem .48rem; border-radius: 999px; background: #f1ebe5; color: var(--muted); font-size: var(--text-2xs); font-weight: 680; }
.county-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: .48rem; max-height: 330px; overflow-y: auto; padding: .1rem .05rem .7rem; scrollbar-width: thin; scrollbar-color: rgba(89,63,49,.18) transparent; }
.city-option {
  min-width: 0;
  min-height: 60px;
  display: grid;
  grid-template-columns: 30px minmax(0,1fr) auto 24px;
  align-items: center;
  gap: .55rem;
  padding: .55rem .6rem;
  border: 1px solid var(--line);
  border-radius: .86rem;
  background: rgba(255,255,255,.76);
  color: var(--ink);
  text-decoration: none;
  box-shadow: 0 5px 15px rgba(65,39,25,.025);
  transition: border-color .2s ease, background .2s ease, transform .2s ease, box-shadow .2s ease;
}
.city-option:hover { border-color: rgba(244,119,33,.36); background: #fffaf6; transform: translateY(-1px); box-shadow: 0 9px 22px rgba(68,39,24,.07); }
.city-option:focus-visible { outline: 3px solid rgba(244,119,33,.3); outline-offset: 2px; }
.city-option[aria-current="page"] { border-color: var(--orange); background: linear-gradient(135deg, #f77f2d, var(--orange-deep)); color: #fff; box-shadow: 0 10px 22px rgba(217,84,12,.18); }
.city-rank { width: 28px; height: 28px; display: grid; place-items: center; border-radius: .62rem; background: #f1ebe5; color: var(--muted); font-size: var(--text-2xs); font-weight: 760; font-variant-numeric: tabular-nums; }
.city-option[aria-current="page"] .city-rank { background: rgba(255,255,255,.16); color: #fff; }
.city-option-copy { min-width: 0; display: grid; gap: .08rem; }
.city-option-copy strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: var(--text-xs); font-weight: 760; line-height: 1.35; }
.city-option-copy small { color: var(--muted); font-size: var(--text-2xs); }
.city-option[aria-current="page"] .city-option-copy small { color: rgba(255,255,255,.72); }
.city-option-meta { padding: .22rem .4rem; border-radius: 999px; background: var(--orange-soft); color: var(--orange-deep); font-size: .48rem; font-weight: 700; white-space: nowrap; }
.city-option[aria-current="page"] .city-option-meta { background: rgba(255,255,255,.15); color: #fff; }
.city-option-arrow { color: var(--orange-deep); font-size: .78rem; transition: transform .2s ease; }
.city-option:hover .city-option-arrow { transform: translateX(-3px); }
.city-option[aria-current="page"] .city-option-arrow { color: #fff; }
.city-menu-empty { grid-column: 1 / -1; padding: 1.2rem; border: 1px dashed var(--line); border-radius: .84rem; color: var(--muted); text-align: center; font-size: var(--text-xs); }

.detail-tabs { display: grid; grid-template-columns: 1fr 1.35fr; gap: .35rem; margin-top: 1.25rem; padding: .3rem; border-radius: .9rem; background: #eee7e1; }
.detail-tabs button { min-height: 39px; border: 0; border-radius: .68rem; background: transparent; color: var(--muted); font-size: .7rem; font-weight: 680; }
.detail-tabs button[aria-selected="true"] { background: #fff; color: var(--ink); box-shadow: 0 4px 16px rgba(65,41,28,.08); }

.search-box { position: relative; display: block; margin-bottom: .75rem; }
.search-box svg { position: absolute; top: 50%; right: .9rem; width: 18px; height: 18px; fill: none; stroke: var(--muted); stroke-width: 1.8; transform: translateY(-50%); }
.search-box input {
  width: 100%;
  min-height: 48px;
  padding: 0 2.75rem 0 1rem;
  border: 1px solid var(--line);
  border-radius: .92rem;
  background: rgba(255,255,255,.82);
  color: var(--ink);
  outline: 0;
}
.search-box input:focus { border-color: rgba(244,119,33,.5); box-shadow: 0 0 0 4px rgba(244,119,33,.09); }
.search-box input::placeholder { color: #a0938a; }

.filters { display: flex; gap: .38rem; overflow-x: auto; padding: 0 .05rem .8rem; scrollbar-width: none; }
.filters::-webkit-scrollbar { display: none; }
.filters button {
  flex: 0 0 auto;
  min-height: 34px;
  padding: .35rem .68rem;
  border: 1px solid transparent;
  border-radius: 999px;
  background: #f1ebe5;
  color: var(--muted);
  font-size: .67rem;
  white-space: nowrap;
}
.filters button[aria-pressed="true"] { background: var(--ink); color: #fff; }

.university-list { display: grid; gap: .48rem; max-height: 500px; overflow-y: auto; padding-left: .3rem; scrollbar-width: thin; scrollbar-color: rgba(89,63,49,.2) transparent; }
.university-card {
  display: block;
  padding: .82rem .88rem;
  border: 1px solid var(--line);
  border-radius: .88rem;
  background: rgba(255,255,255,.72);
}
.university-card-main { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .6rem; align-items: center; }
.university-card h4 { margin: 0; font-size: .76rem; font-weight: 700; line-height: 1.75; }
.university-card p { margin: .18rem 0 0; color: var(--muted); font-size: .63rem; line-height: 1.6; }
.university-badges { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .3rem; }
.university-card .category { padding: .32rem .55rem; border-radius: 999px; background: var(--orange-soft); color: var(--orange-deep); font-size: .59rem; font-weight: 650; white-space: nowrap; }
.university-card .identity-state { padding: .32rem .55rem; border-radius: 999px; background: #fff0c7; color: #765000; font-size: .56rem; font-weight: 750; white-space: nowrap; }
.university-more { margin-top: .55rem; padding-top: .5rem; border-top: 1px solid var(--line); }
.university-more summary { width: fit-content; cursor: pointer; color: var(--orange-deep); font-size: .6rem; font-weight: 700; list-style: none; }
.university-more summary::-webkit-details-marker { display: none; }
.university-more summary::after { content: " +"; }
.university-more[open] summary::after { content: " −"; }
.university-contact { display: grid; gap: .35rem; margin-top: .55rem; color: var(--muted); font-size: .61rem; line-height: 1.8; }
.university-contact a { color: var(--ink); text-underline-offset: 3px; }
.contact-research-note { padding: .48rem .56rem; border-radius: .62rem; background: #fff3d8; color: #7b5100; }
.university-official-facts { display: grid; gap: .42rem; padding: .68rem; border: 1px solid rgba(47, 111, 88, .16); border-radius: .72rem; background: #f3fbf7; }
.university-official-facts > b { color: #285f4b; font-size: .65rem; }
.university-official-facts-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(82px, 1fr)); gap: .34rem; }
.university-official-facts-grid > span { display: grid; gap: .08rem; padding: .42rem; border-radius: .58rem; background: rgba(255,255,255,.82); }
.university-official-facts-grid strong { color: var(--ink); font-size: .68rem; }
.university-official-facts-grid small { color: var(--muted); font-size: .48rem; }
.university-official-facts > p { margin: 0; color: var(--muted); font-size: .52rem; line-height: 1.8; }
.university-applicant-guide { display: grid; gap: .45rem; margin-top: .55rem; padding: .75rem; border: 1px solid rgba(117, 66, 37, .13); border-radius: 13px; background: rgba(255, 250, 244, .84); }
.university-applicant-guide > b { color: var(--orange-deep); font-size: .68rem; }
.university-applicant-guide p { margin: 0; }
.university-applicant-guide ul, .student-guide-list { display: grid; gap: .28rem; margin: 0; padding: 0 1rem 0 0; }
.university-applicant-guide li, .student-guide-list li { padding-inline-start: .1rem; }
.university-guide-links { display: flex; flex-wrap: wrap; gap: .35rem; }
.university-guide-links a { padding: .26rem .48rem; border-radius: 999px; background: rgba(117, 66, 37, .08); text-decoration: none; }
.university-links { display: flex; flex-wrap: wrap; gap: .3rem; margin-top: .45rem; }
.university-links a { padding: .28rem .46rem; border: 1px solid var(--line); border-radius: 999px; background: #fbf8f5; color: var(--ink); text-decoration: none; font-size: .55rem; }
.university-links a:hover { border-color: rgba(244,119,33,.35); background: var(--orange-soft); }
.review-digest { display: grid; gap: .45rem; margin: .25rem 0; padding: .7rem; border: 1px solid #ecdcbc; border-radius: .72rem; background: #fffaf0; }
.review-digest > b { color: var(--ink); font-size: .65rem; }
.review-digest .review-warning { width: fit-content; padding: .18rem .4rem; border-radius: 999px; background: #ffebbd; color: #7a5000; font-size: .5rem; font-weight: 700; }
.review-theme-grid { display: grid; grid-template-columns: 1fr 1fr; gap: .4rem; }
.review-theme-grid > div { padding: .52rem; border-radius: .6rem; background: rgba(255,255,255,.72); }
.review-theme-grid strong { color: var(--ink); font-size: .54rem; }
.review-theme-grid ul { margin: .28rem 0 0; padding-right: .9rem; }
.review-theme-grid li { margin-top: .18rem; color: #584943; font-size: .53rem; line-height: 1.7; }
.review-theme-grid .is-positive { border-right: 3px solid #5b9e78; }
.review-theme-grid .is-concern { border-right: 3px solid #d99942; }
.review-digest > p { margin: 0; color: var(--muted); font-size: .52rem; line-height: 1.85; }
.review-sources { display: flex; flex-wrap: wrap; gap: .28rem; }
.review-sources a { padding: .2rem .38rem; border: 1px solid var(--line); border-radius: 999px; background: #fff; color: var(--ink); text-decoration: none; font-size: .5rem; }
.review-topic-chips { display: flex; flex-wrap: wrap; gap: .28rem; }
.review-topic-chips span { padding: .22rem .4rem; border-radius: 999px; background: #f2ece5; color: #584943; font-size: .5rem; }
.review-contradictions { padding: .58rem; border-radius: .65rem; background: #f5f0ff; border-right: 3px solid #8971c7; }
.review-contradictions strong { color: var(--ink); font-size: .56rem; }
.review-contradictions ul, .city-review-questions ul { margin: .3rem 0 0; padding-right: 1rem; }
.review-contradictions li, .city-review-questions li { margin-top: .2rem; color: #584943; font-size: .53rem; line-height: 1.8; }
.city-review-questions { border-top: 1px dashed var(--line); padding-top: .45rem; }
.city-review-questions summary { cursor: pointer; color: var(--ink); font-size: .56rem; font-weight: 750; }
.empty { padding: 2.2rem 1rem; border: 1px dashed var(--line); border-radius: 1rem; color: var(--muted); text-align: center; font-size: .76rem; line-height: 1.9; }

.load-more { width: 100%; min-height: 42px; margin-top: .6rem; border: 1px solid var(--line); border-radius: .82rem; background: rgba(255,255,255,.72); color: var(--ink); font-size: .7rem; font-weight: 650; }
.load-more:hover { background: var(--orange-soft); border-color: rgba(244,119,33,.3); }

.community-placeholder { min-height: 320px; display: grid; place-content: center; justify-items: center; padding: 2rem; border: 1px dashed rgba(84,58,45,.18); border-radius: 1rem; background: rgba(255,255,255,.36); text-align: center; }
.community-placeholder > span { width: 54px; height: 54px; display: grid; place-items: center; border-radius: 50%; background: var(--orange-soft); color: var(--orange-deep); font-size: 1.5rem; box-shadow: 0 0 0 10px rgba(244,119,33,.05); }
.community-placeholder h3 { margin: 1.2rem 0 .35rem; font-size: 1rem; }
.community-placeholder p { max-width: 360px; margin: 0; color: var(--muted); font-size: .7rem; line-height: 1.9; }
.city-profile-hero { display: flex; align-items: center; gap: .8rem; padding: 1rem; border-radius: 1rem; background: linear-gradient(135deg, #2c211c, #493126); color: #fff; box-shadow: 0 18px 35px rgba(49,30,22,.13); }
.city-symbol { flex: 0 0 auto; width: 52px; height: 52px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.16); border-radius: 45% 55% 65% 35%; background: rgba(255,255,255,.08); transform: rotate(8deg); }
.city-symbol span { width: 17px; height: 17px; border-radius: 70% 30% 62% 38%; background: var(--orange); box-shadow: 0 0 22px rgba(244,119,33,.85); transform: rotate(35deg); }
.city-profile-hero p { margin: 0 0 .12rem; color: rgba(255,255,255,.62); font-size: .59rem; }
.city-profile-hero h3 { margin: 0; font-size: 1.25rem; }
.city-profile-hero > div:last-child > span { display: block; margin-top: .16rem; color: rgba(255,255,255,.68); font-size: .62rem; }
.city-profile-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: .42rem; margin: .55rem 0 1rem; }
.city-profile-stats div { padding: .7rem .6rem; border: 1px solid var(--line); border-radius: .75rem; background: rgba(255,255,255,.72); }
.city-profile-stats dt { color: var(--muted); font-size: .56rem; }
.city-profile-stats dd { margin: .18rem 0 0; font-size: 1rem; font-weight: 760; font-variant-numeric: tabular-nums; }
.city-insight { display: grid; gap: .65rem; margin-bottom: 1rem; }
.insight-card { padding: .85rem; border: 1px solid var(--line); border-radius: .9rem; background: rgba(255,255,255,.72); }
.insight-card-header { display: flex; align-items: center; justify-content: space-between; gap: .7rem; margin-bottom: .55rem; }
.insight-card h4 { margin: 0; font-size: .75rem; }
.insight-card-header span { padding: .24rem .45rem; border-radius: 999px; background: #f1ebe5; color: var(--muted); font-size: .52rem; }
.insight-card-header span.is-estimate { background: #fff3d8; color: #8b5a00; }
.insight-card > p, .vibe-item p { margin: 0; color: #584943; font-size: .64rem; line-height: 1.95; }
.cost-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .38rem; }
.cost-grid div { padding: .55rem .58rem; border-radius: .66rem; background: #f7f2ed; }
.cost-grid span { display: block; color: var(--muted); font-size: .53rem; }
.cost-grid b { display: block; margin-top: .14rem; font-size: .68rem; font-variant-numeric: tabular-nums; }
.cost-grid .cost-total { background: #2d211c; color: #fff; }
.cost-grid .cost-total span { color: rgba(255,255,255,.62); }
.insight-note { margin-top: .55rem !important; color: var(--muted) !important; font-size: .56rem !important; }
.mobility-mode-chips, .mobility-source-links, .mobility-intercity-links { display: flex; flex-wrap: wrap; gap: .34rem; }
.mobility-mode-chips span { padding: .3rem .48rem; border-radius: 999px; background: #edf7f2; color: var(--green); font-size: .55rem; font-weight: 680; }
.mobility-copy { margin: .55rem 0 0; color: #584943; font-size: .62rem; line-height: 1.95; }
.mobility-source-links, .mobility-intercity-links { margin-top: .48rem; }
.mobility-source-links a, .mobility-intercity-links a { padding: .34rem .5rem; border: 1px solid var(--line); border-radius: .62rem; background: #fff; color: var(--ink); text-decoration: none; font-size: .54rem; }
.mobility-source-links a:hover, .mobility-intercity-links a:hover { border-color: rgba(244,119,33,.38); background: var(--orange-soft); }
.mobility-subtitle { display: block; margin-top: .62rem; color: var(--muted); font-size: .55rem; line-height: 1.8; }
.mobility-warning { margin: .6rem 0 0; padding: .5rem .58rem; border-radius: .65rem; background: #fff3d8; color: #7b5100; font-size: .56rem; line-height: 1.9; }
.vibe-list { display: grid; gap: .48rem; }
.vibe-item { display: grid; grid-template-columns: 74px 1fr; gap: .55rem; align-items: start; }
.vibe-item b { color: var(--orange-deep); font-size: .58rem; line-height: 1.8; }
.group-chips, .place-chips, .discovery-links { display: flex; flex-wrap: wrap; gap: .34rem; }
.group-chips span { padding: .3rem .48rem; border-radius: 999px; background: #f1ebe5; color: var(--ink); font-size: .55rem; }
.place-chip { display: grid; gap: .12rem; min-width: min(100%, 205px); padding: .38rem .5rem; border: 1px solid transparent; border-radius: .72rem; background: #f1ebe5; }
.place-chip:hover { border-color: rgba(244,119,33,.35); background: var(--orange-soft); }
.place-chip a { color: var(--ink); font-size: .55rem; font-weight: 700; text-decoration: none; }
.place-map-snapshot { color: var(--muted); font-size: .48rem; line-height: 1.75; }
.discovery-links a { padding: .38rem .53rem; border: 1px solid var(--line); border-radius: .62rem; background: #fff; color: var(--ink); text-decoration: none; font-size: .56rem; }
.discovery-links a:hover { border-color: rgba(244,119,33,.38); background: var(--orange-soft); }
.coverage-line { display: flex; align-items: center; gap: .45rem; margin-top: .55rem; color: var(--muted); font-size: .54rem; }
.coverage-line i { flex: 1; height: 5px; overflow: hidden; border-radius: 999px; background: #eee6df; }
.coverage-line i::before { content: ""; display: block; width: var(--coverage, 35%); height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--orange), #ffad6c); }
.community-composer { padding: 1rem; border: 1px solid var(--line); border-radius: 1rem; background: rgba(255,255,255,.8); }
.composer-heading { display: flex; align-items: start; justify-content: space-between; gap: 1rem; margin-bottom: .85rem; }
.composer-heading p, .community-feed-heading p { margin: 0 0 .12rem; color: var(--orange-deep); font-size: .57rem; font-weight: 700; }
.composer-heading h4, .community-feed-heading h4 { margin: 0; font-size: .82rem; }
.composer-heading > span { padding: .28rem .5rem; border-radius: 999px; background: #edf7f2; color: var(--green); font-size: .56rem; }
.kind-picker { display: grid; grid-template-columns: 1fr 1fr; gap: .35rem; margin-bottom: .72rem; }
.kind-picker label { position: relative; }
.kind-picker input { position: absolute; opacity: 0; pointer-events: none; }
.kind-picker span { min-height: 38px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: .68rem; color: var(--muted); font-size: .65rem; cursor: pointer; }
.kind-picker input:checked + span { border-color: rgba(244,119,33,.32); background: var(--orange-soft); color: var(--orange-deep); font-weight: 680; }
.kind-picker input:focus-visible + span { outline: 3px solid rgba(244,119,33,.28); outline-offset: 2px; }
.honeypot { position: absolute !important; left: -9999px !important; }
.composer-field { display: grid; gap: .28rem; margin-top: .58rem; }
.composer-field > span { color: var(--muted); font-size: .58rem; font-weight: 620; }
.composer-field input, .composer-field textarea { width: 100%; border: 1px solid var(--line); border-radius: .7rem; background: #fbf8f5; color: var(--ink); outline: 0; font-size: .7rem; }
.composer-field input { min-height: 41px; padding: 0 .72rem; }
.composer-field textarea { padding: .65rem .72rem; line-height: 1.8; resize: vertical; }
.composer-field input:focus, .composer-field textarea:focus { border-color: rgba(244,119,33,.48); box-shadow: 0 0 0 3px rgba(244,119,33,.08); }
.composer-submit { display: flex; align-items: center; justify-content: space-between; gap: .65rem; margin-top: .72rem; }
.composer-submit p { flex: 1; margin: 0; color: var(--muted); font-size: .59rem; line-height: 1.6; }
.composer-submit p.is-error { color: #a83827; }
.composer-submit p.is-success { color: var(--green); }
.composer-submit button { min-height: 41px; padding: 0 .85rem; border: 0; border-radius: .72rem; background: linear-gradient(135deg, #f88b3c, var(--orange-deep)); color: #fff; font-size: .66rem; font-weight: 700; box-shadow: 0 8px 18px rgba(217,84,12,.18); }
.composer-submit button:disabled { cursor: wait; opacity: .62; }
.community-feed-heading { display: flex; align-items: end; justify-content: space-between; gap: 1rem; margin: 1.15rem 0 .62rem; }
.community-feed-heading > span { color: var(--muted); font-size: .6rem; }
.community-feed { display: grid; gap: .45rem; max-height: 300px; overflow-y: auto; scrollbar-width: thin; scrollbar-color: rgba(89,63,49,.2) transparent; }
.community-post { padding: .78rem .82rem; border: 1px solid var(--line); border-radius: .82rem; background: rgba(255,255,255,.68); }
.community-post header { display: flex; align-items: center; justify-content: space-between; gap: .65rem; }
.community-post header div { display: flex; align-items: center; gap: .42rem; min-width: 0; }
.community-post header b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .68rem; }
.community-post .post-kind { padding: .22rem .4rem; border-radius: 999px; background: var(--orange-soft); color: var(--orange-deep); font-size: .52rem; white-space: nowrap; }
.community-post time { color: var(--muted); font-size: .52rem; white-space: nowrap; }
.community-post > p { margin: .55rem 0 0; color: #584943; font-size: .67rem; line-height: 1.9; white-space: pre-wrap; }
.community-feed-empty { padding: 1.5rem 1rem; border: 1px dashed var(--line); border-radius: .82rem; color: var(--muted); text-align: center; font-size: .65rem; line-height: 1.9; }

@keyframes led-flow { to { stroke-dashoffset: -88; } }
@keyframes orbit { to { transform: rotate(1turn); } }
@keyframes trace { from { transform: translateX(180%); } to { transform: translateX(-240%); } }
@keyframes atlas-aurora { from { transform: translate3d(-2%, -1%, 0) rotate(-2deg) scale(1); } to { transform: translate3d(3%, 2%, 0) rotate(3deg) scale(1.05); } }
@keyframes atlas-grid-drift { to { background-position: 36px 18px; } }
@keyframes atlas-halo { from { opacity: .58; transform: rotate(-7deg) scaleY(.6) scale(.96); } to { opacity: 1; transform: rotate(-3deg) scaleY(.66) scale(1.04); } }
@keyframes atlas-orbit { to { transform: rotate(349deg); } }
@keyframes atlas-particle { 0%,100% { transform: translate(0,0); opacity: .35; } 50% { transform: translate(40px,18px); opacity: .8; } }
@keyframes counter-rise { 0% { opacity: .42; transform: translateY(5px) scale(.96); filter: blur(1px); } 58% { opacity: 1; transform: translateY(-1px) scale(1.035); filter: blur(0); } 100% { transform: translateY(0) scale(1); } }

.data-note { display: grid; grid-template-columns: 1fr 1.2fr auto; align-items: center; gap: clamp(1.2rem, 4vw, 4rem); margin: 4rem 0 2rem; padding: 2rem 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.data-note h2 { max-width: 440px; margin: 0; font-size: clamp(1.35rem, 2.2vw, 2.2rem); line-height: 1.45; letter-spacing: -.025em; }
.data-note > p { margin: 0; color: var(--muted); font-size: .78rem; line-height: 2; }
.data-note a { display: inline-flex; align-items: center; min-height: 42px; padding: 0 .9rem; border: 1px solid var(--line); border-radius: .8rem; color: var(--ink); text-decoration: none; font-size: .7rem; font-weight: 650; white-space: nowrap; }
.data-note a:hover { border-color: rgba(244,119,33,.35); background: var(--orange-soft); }

.footer { width: min(1480px, calc(100% - 2.5rem)); min-height: 90px; margin: 0 auto; display: flex; justify-content: space-between; align-items: center; color: var(--muted); font-size: .68rem; }

.loading { position: fixed; inset: 0; z-index: 20; display: grid; place-content: center; place-items: center; gap: .75rem; background: rgba(247,242,236,.94); backdrop-filter: blur(18px); transition: opacity .35s ease, visibility .35s ease; }
.loading.is-done { opacity: 0; visibility: hidden; }
.loading span { width: 34px; height: 34px; border: 3px solid rgba(244,119,33,.18); border-top-color: var(--orange); border-radius: 50%; animation: spin .8s linear infinite; }
.loading p { margin: 0; color: var(--muted); font-size: .75rem; }

@keyframes spin { to { transform: rotate(1turn); } }

@media (max-width: 1080px) {
  .intro { grid-template-columns: 1fr; align-items: start; }
  .overview { justify-self: stretch; }
  .overview div { min-width: 0; }
  .atlas { grid-template-columns: 1fr; }
  .map-panel { border-left: 0; border-bottom: 1px solid var(--line); }
  .map-stage { min-height: 690px; }
  .university-list { max-height: 620px; }
  .data-note { grid-template-columns: 1fr 1fr; }
  .data-note a { justify-self: start; }
}

@media (max-width: 680px) {
  .topbar, main, .footer { width: min(100% - 1.25rem, 1480px); }
  .topbar { min-height: 68px; }
  .edition { font-size: .65rem; }
  .intro { min-height: auto; padding: 3.8rem 0 2.7rem; gap: 2rem; }
  h1 { font-size: clamp(2.8rem, 15vw, 4.3rem); line-height: 1.03; }
  .intro-copy { font-size: .88rem; line-height: 1.9; }
  .overview { gap: .25rem; }
  .overview div { padding: .8rem .45rem; }
  .overview dt { font-size: .63rem; }
  .overview dd { font-size: 1.45rem; }
  .atlas { border-radius: 1.25rem; }
  .map-panel { padding: .85rem; }
  .map-toolbar { grid-template-columns: 1fr; align-items: start; }
  .province-picker-card { padding: .72rem; }
  .map-status-card { min-height: 52px; padding: .7rem .78rem; }
  .map-toolbar-actions > button { width: 100%; }
  .quick-provinces { flex-wrap: nowrap; overflow-x: auto; padding-bottom: .16rem; scrollbar-width: none; }
  .quick-provinces::-webkit-scrollbar { display: none; }
  .quick-provinces button { flex: 0 0 auto; }
  .quick-provinces button { min-height: 40px; padding-inline: .78rem; }
  .map-stage { min-height: 530px; margin-top: .5rem; }
  .map-guide { right: .5rem; left: .5rem; bottom: .5rem; min-height: 142px; grid-template-columns: 1fr; gap: .5rem; padding: .62rem .68rem; }
  .map-guide-heading { justify-content: center; }
  .heat-guide { padding: 0 .2rem; }
  .map-guide ul { gap: .25rem; }
  .map-guide li { display: grid; justify-items: center; gap: .18rem; text-align: center; }
  .map-guide li > span { font-size: 0; }
  .map-guide li b { font-size: .48rem; }
  .province-label { font-size: 15px; stroke-width: 2.6px; }
  .province-callout-text { font-size: 13px; }
  .province-callout-line { stroke-width: 1.15; }
  .province-callout-dot { r: 3.4px; }
  .compass { left: 0; top: .55rem; transform: scale(.72); }
  .detail-panel { padding: 1rem; }
  .province-heading { align-items: start; }
  .province-heading h2 { font-size: 2rem; }
  .province-counts { text-align: left; }
  .province-guide { grid-template-columns: 1fr; }
  .province-guide-meta { padding-inline-start: 0; padding-top: .75rem; border-inline-start: 0; border-top: 1px solid var(--line); }
  .university-list { max-height: 540px; }
  .university-card { grid-template-columns: 1fr; }
  .university-card-main { grid-template-columns: 1fr; }
  .university-badges { justify-content: flex-start; }
  .review-theme-grid { grid-template-columns: 1fr; }
  .data-note { grid-template-columns: 1fr; gap: 1rem; margin-top: 2.5rem; }
  .footer { min-height: 74px; gap: 1rem; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}
