.cities{--city: var(--teal-400)}.cities-hero .page-hero__art{width:clamp(110px,13vw,180px)}.cities-hero__count{cursor:default}.cities-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:12px 16px;margin-bottom:14px}.cities-search{position:relative;flex:1 1 260px;max-width:420px}.cities-search__icon{position:absolute;top:50%;left:14px;z-index:1;color:var(--teal-400);transform:translateY(-50%);pointer-events:none}.cities-search__input{padding-left:42px;font-size:16px}.cities-search__input::-webkit-search-cancel-button{filter:grayscale(1)}.cities-sort{display:flex;flex-wrap:wrap;gap:6px}.cities-ai{margin:0}.cities-ai.is-disabled{opacity:.45}.cities-summary{min-height:1.5em;margin-bottom:14px;color:var(--text-dim);font-size:14px}.cities-list{display:grid;gap:8px}.cities-row--skeleton .skeleton{display:block;height:64px;border-radius:var(--r-sm)}.cities-row__link{--c: var(--teal-400);position:relative;display:grid;grid-template-columns:40px 30px minmax(0,1fr) auto;align-items:center;gap:14px;min-height:72px;padding:10px 16px 10px 12px;overflow:hidden;border:1px solid var(--line);border-radius:var(--r-sm);background:linear-gradient(90deg,#2432566b,#121a2ec7 45%,#0d1323e6);transition:border-color var(--t-fast),transform var(--t-fast) var(--ease),box-shadow var(--t-fast)}.cities-row__link:before{content:"";position:absolute;top:0;bottom:0;left:0;width:3px;background:var(--c);box-shadow:0 0 12px var(--c)}.cities-row__link:hover,.cities-row__link:focus-visible{border-color:#2ee6d666;box-shadow:0 10px 26px #00000059;transform:translateY(-1px);outline:none}.cities-row__link:focus-visible{box-shadow:var(--focus-ring)}.cities-row__rank{font-family:var(--font-display);font-size:18px;text-align:center;color:var(--text-dim);font-variant-numeric:tabular-nums}.cities-row__rank.is-top{color:var(--gold-200);text-shadow:0 0 12px var(--gold-glow)}.cities-row__rank.is-top-1{font-size:22px}.cities-row__flag{display:block;filter:drop-shadow(0 3px 4px rgba(0,0,0,.5))}.cities-row__flag svg{width:22px;height:44px}.cities-row__main{display:grid;gap:3px;min-width:0}.cities-row__name{display:flex;align-items:center;flex-wrap:wrap;gap:4px 8px;min-width:0}.cities-row__title{min-width:0;overflow:hidden;font-family:var(--font-display);font-size:18px;line-height:1.2;white-space:nowrap;text-overflow:ellipsis;color:var(--text)}.cities-row__sub{overflow:hidden;color:var(--text-dim);font-size:13px;white-space:nowrap;text-overflow:ellipsis}.cities-row__stats{display:grid;grid-template-columns:repeat(4,76px);gap:6px}.cities-row__stat{display:grid;justify-items:end;gap:1px;text-align:right}.cities-row__value{font-family:var(--font-display);font-size:16px;line-height:1.2;color:var(--text-muted);font-variant-numeric:tabular-nums}.cities-row__label{color:var(--text-dim);font-size:11.5px;line-height:1.2}.cities-row__stat.is-sorted .cities-row__value{color:var(--gold-200)}.cities-row__stat--rating .cities-row__value{color:var(--teal-200)}.cities-row__stat--rating.is-sorted .cities-row__value{color:var(--gold-200)}@media(max-width:759px){.cities-row__link{grid-template-columns:30px 24px minmax(0,1fr);gap:8px 10px;padding:12px 12px 12px 10px}.cities-row__flag svg{width:18px;height:36px}.cities-row__title{font-size:16.5px}.cities-row__stats{grid-column:1 / -1;grid-template-columns:repeat(4,minmax(0,1fr));padding-top:8px;border-top:1px solid var(--line)}.cities-row__stat{justify-items:center;text-align:center}.cities-toolbar{gap:10px}.cities-search{flex-basis:100%;max-width:none}.cities-sort{flex:1 1 auto;flex-wrap:nowrap;margin:0 calc(var(--gutter) * -1);padding:2px var(--gutter);overflow-x:auto;scrollbar-width:none}.cities-sort::-webkit-scrollbar{display:none}.cities-sort .chip{flex:none;min-height:40px}}.cities-state,.city-state{display:grid;justify-items:center;gap:10px;padding:40px 16px;text-align:center}.cities-state img,.city-state img{width:84px;height:84px;opacity:.85}.cities-state__title{font-family:var(--font-display);font-size:22px}.cities-state__text{max-width:460px;color:var(--text-muted)}.city-state__actions{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:6px}.cities-more{display:flex;justify-content:center;margin-top:20px}.city-hero{position:relative;isolation:isolate;overflow:hidden;padding:clamp(28px,5vw,56px) 0 clamp(28px,4vw,44px);border-bottom:1px solid var(--line)}.city-hero:before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(60% 120% at 12% 0%,rgba(46,230,214,.12),transparent 70%),linear-gradient(180deg,#0f1526eb,#0a0e1a66);background:radial-gradient(60% 120% at 12% 0%,color-mix(in srgb,var(--city) 22%,transparent),transparent 70%),radial-gradient(40% 80% at 90% 100%,rgba(246,197,68,.06),transparent 70%),linear-gradient(180deg,#0f1526eb,#0a0e1a66)}.city-hero:after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:3px;background:linear-gradient(90deg,transparent,var(--city) 25%,rgba(246,197,68,.6) 75%,transparent);opacity:.7}.city-hero__inner{display:flex;align-items:flex-start;gap:clamp(18px,3vw,32px)}.city-hero__banner{position:relative;flex:none;width:92px;min-height:160px;padding:12px 10px 8px;border:1px solid var(--line-strong);border:1px solid color-mix(in srgb,var(--city) 40%,transparent);border-radius:var(--r-sm);background:#0508108c;box-shadow:var(--shadow-2),inset 0 0 40px #00000059}.city-hero__banner:before{content:"";position:absolute;top:6px;left:4px;right:4px;height:4px;background:#8a6a3a;box-shadow:0 2px #00000080}.city-hero__flag{display:block;width:72px;height:144px;filter:drop-shadow(0 8px 10px rgba(0,0,0,.5));animation:city-flag-sway 6s ease-in-out infinite;transform-origin:50% 0}@keyframes city-flag-sway{0%,to{transform:skew(0)}50%{transform:skew(-1.6deg)}}.city-hero__banner-sk{display:block;width:72px;height:144px}.city-hero__main{min-width:0;padding-top:6px}.city-hero__kind{display:flex;align-items:center;gap:8px;color:var(--text-dim);font-size:13.5px;font-weight:700}.city-hero__swatch{width:12px;height:12px;background:var(--city);box-shadow:0 0 12px var(--city)}.city-hero__name{margin-top:8px;font-size:clamp(32px,1.6rem + 2.6vw,58px);line-height:1.04;overflow-wrap:anywhere;color:#fff6d6;color:color-mix(in srgb,var(--city) 40%,#ffffff);text-shadow:3px 3px 0 rgba(0,0,0,.5)}.city-hero__name:focus{outline:none}.city-hero__name-sk{display:block;width:min(360px,70vw);height:.9em}.city-hero__badges{display:flex;flex-wrap:wrap;gap:6px;margin-top:14px}.city-hero__badges:empty{display:none}.city-hero__actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px}@media(max-width:599px){.city-hero__inner{gap:14px}.city-hero__banner{width:64px;min-height:0;padding:9px 7px 6px}.city-hero__flag,.city-hero__banner-sk{width:48px;height:96px}.city-hero__actions .btn{flex:1 1 100%;min-width:0;white-space:normal}.city-hero__inner{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:start;column-gap:14px}.city-hero__banner{grid-column:1;grid-row:1 / span 3}.city-hero__main{display:contents}.city-hero__kind,.city-hero__name,.city-hero__badges{grid-column:2}.city-hero__kind{padding-top:6px}.city-hero__actions{grid-column:1 / -1}}.city-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(300px,400px);align-items:start;gap:clamp(20px,3vw,36px)}.city-grid__main{display:grid;gap:26px;min-width:0}.city-grid__side{position:sticky;top:calc(var(--header-h) + 20px);display:grid;gap:10px}@media(max-width:959px){.city-grid{grid-template-columns:minmax(0,1fr);gap:26px}.city-grid__main{display:contents}.city-grid__side{position:static;order:2}.city-stats{order:1}[data-city-era-block]{order:3}[data-city-laws-block]{order:4}[data-city-rel-block]{order:5}[data-city-res-block]{order:6}}.city-stats{display:grid;grid-template-columns:repeat(auto-fill,minmax(168px,1fr));gap:8px}.city-stat{display:grid;align-content:start;gap:2px;min-width:0;padding:13px 14px 12px;border:1px solid var(--line);border-radius:var(--r-sm);background:linear-gradient(180deg,#2432566b,#0e1425d9)}.city-stat__sk{display:block;height:46px}.city-stat__label{color:var(--text-dim);font-size:11.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase}.city-stat__value{overflow-wrap:anywhere;font-family:var(--font-display);font-size:22px;line-height:1.25;color:var(--text);font-variant-numeric:tabular-nums}.city-stat__sub{color:var(--text-muted);font-size:13px;line-height:1.35}.city-stat--coins .city-stat__value{color:var(--gold-200)}.city-stat--mayor{grid-column:span 2}@media(max-width:420px){.city-stat--mayor{grid-column:1 / -1}}.city-mayor{display:inline-flex;align-items:center;gap:10px;margin-top:4px}.city-mayor img{width:32px;height:32px;image-rendering:pixelated;box-shadow:0 0 0 2px #00000080,0 0 14px #f6c5444d}.city-mayor .city-stat__value{color:var(--gold-200)}.city-mayor:hover .city-stat__value{text-decoration:underline;text-underline-offset:4px}.city-block__title{display:flex;align-items:center;gap:10px;margin-bottom:12px;font-family:var(--font-pixel);font-size:10px;font-weight:400;line-height:1.6;letter-spacing:.08em;text-transform:uppercase;color:var(--teal-400)}.city-block__title:before{content:"";width:7px;height:7px;background:currentColor;box-shadow:0 0 9px currentColor}.city-block__count{font-family:var(--font-body);font-size:13px;font-weight:700;letter-spacing:0;text-transform:none;color:var(--text-dim)}.city-era{padding:14px 16px;border:1px solid var(--line);border-radius:var(--r-sm);background:#121a2e8c}.city-era__name{font-family:var(--font-display);font-size:19px}.city-era__bar{position:relative;height:10px;margin:12px 0 8px;overflow:hidden;background:#050810d9;box-shadow:inset 0 0 0 1px #a0beff24}.city-era__bar:after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent 0 9px,rgba(0,0,0,.25) 9px 10px),var(--era, var(--gold-400));box-shadow:0 0 12px var(--era, var(--gold-400));transform:scaleX(var(--p, 0));transform-origin:left center;transition:transform var(--t-slow) var(--ease)}.city-era__hint{color:var(--text-muted);font-size:14px}.city-laws{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:6px}.city-law{display:flex;align-items:center;gap:10px;min-height:44px;padding:8px 12px;border:1px solid var(--line);border-radius:var(--r-sm);background:#121a2e8c;font-size:14.5px;font-weight:600}.city-law__dot{flex:none;width:9px;height:9px;background:var(--steel-700)}.city-law.is-on .city-law__dot{background:var(--success);box-shadow:0 0 9px #3ddc8499}.city-law.is-off{color:var(--text-muted)}.city-law.is-info .city-law__dot{background:var(--gold-400);box-shadow:0 0 9px var(--gold-glow)}.city-rel{display:grid;gap:6px}.city-rel__item{display:flex;align-items:flex-start;gap:12px;padding:11px 14px;border:1px solid var(--line);border-radius:var(--r-sm);background:#121a2e8c}.city-rel__item--war{border-color:#ff547052;background:linear-gradient(90deg,#ff54701a,#121a2e8c)}.city-rel__item--ally{border-color:#2ee6d64d}.city-rel__icon{flex:none;width:24px;height:24px}.city-rel__item--war .city-rel__icon{background:url(/assets/img/art/map-war.svg?v=7a1aff72) center / contain no-repeat}.city-rel__item--ally .city-rel__icon{width:12px;height:12px;margin:6px;background:var(--teal-400);box-shadow:0 0 10px var(--teal-glow);transform:rotate(45deg)}.city-rel__item--peace .city-rel__icon{width:12px;height:12px;margin:6px;background:var(--success);box-shadow:0 0 10px #3ddc8480}.city-rel__text{display:grid;gap:2px;line-height:1.45}.city-rel__kind{font-size:13.5px;color:#ff8a9c}.city-rel__text small{color:var(--text-dim);font-size:13px}.city-rel__link{color:var(--gold-200);font-weight:700;text-decoration:underline;text-decoration-color:#ffe38a59;text-underline-offset:3px}.city-rel__link:hover{text-decoration-color:currentColor}.city-residents{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:6px}.city-resident__link{position:relative;display:flex;align-items:center;gap:10px;min-height:50px;padding:8px 12px;border:1px solid var(--line);border-radius:var(--r-sm);background:#121a2e8c;transition:border-color var(--t-fast)}a.city-resident__link:hover,a.city-resident__link:focus-visible{border-color:#2ee6d666;outline:none}.city-resident__link img,.city-resident__nohead{flex:none;width:28px;height:28px;image-rendering:pixelated;background:var(--surface-3);box-shadow:0 0 0 1px #00000080}.city-resident.is-mayor .city-resident__link{border-color:#f6c54466;background:linear-gradient(90deg,#f6c5441a,#121a2e8c)}.city-resident__text{display:grid;min-width:0;line-height:1.25}.city-resident__name{overflow:hidden;font-weight:700;white-space:nowrap;text-overflow:ellipsis}.city-resident__role{color:var(--rc, var(--text-dim));font-size:12.5px;font-weight:700}.city-resident__online{margin-left:auto;flex:none;width:9px;height:9px;background:var(--success);box-shadow:0 0 9px #3ddc84b3}.city-residents__more{margin-top:10px}.city-minimap{position:relative;margin:0;overflow:hidden;border:1px solid rgba(246,197,68,.28);border-radius:var(--r-sm);background:radial-gradient(70% 60% at 50% 45%,rgba(46,120,160,.13),transparent 75%),#0b1424;box-shadow:var(--shadow-2),0 0 0 5px #0a0e1ad9,0 0 0 6px #a0beff1a}.city-minimap__canvas{display:block;width:100%;aspect-ratio:4 / 3.2;cursor:pointer;opacity:0;transition:opacity var(--t-slow) var(--ease)}.city-minimap.is-ready .city-minimap__canvas{opacity:1}.city-minimap.is-empty .city-minimap__canvas{opacity:.6}.city-minimap__open{position:absolute;top:10px;right:10px;padding:6px 10px;border:1px solid var(--line-strong);border-radius:var(--r-sm);background:#090d19db;color:var(--text);font-size:13px;font-weight:700;transition:border-color var(--t-fast)}.city-minimap__open:hover,.city-minimap__open:focus-visible{border-color:#2ee6d699;outline:none}.city-minimap__caption{padding:10px 12px;border-top:1px solid var(--line);color:var(--text-muted);font-size:13px;line-height:1.45}.city-updated{color:var(--text-dim);font-size:12.5px}@media(prefers-reduced-motion:reduce){.city-hero__flag{animation:none}.cities-row__link,.city-era__bar:after,.city-minimap__canvas{transition:none}}.cities-sort .chip[aria-checked=true]{color:var(--gold-200);border-color:#f6c54499;background:linear-gradient(180deg,#f6c54429,#f6c5440d);box-shadow:0 0 18px #f6c54424}.cities-sort .chip:focus-visible{outline:none;box-shadow:var(--focus-ring)}@media(max-width:599px){.cities-hero{padding:22px 0 24px}.cities-hero .crumbs{margin-bottom:12px}.cities-hero .page-hero__lead{margin-top:10px;font-size:15px}.cities-hero .page-hero__meta{margin-top:16px}.cities-hero__count{display:none}.cities-list-section{padding-top:22px}}