:root {
    color-scheme: dark;

    --ink: #0d0d0f;
    --ink-2: #121214;
    --surface: #18181b;
    --surface-2: #1e1e22;
    --surface-3: #27272c;
    --line: #303036;
    --line-strong: #46464e;

    --text: #f5f5f3;
    --text-2: #b4b4b1;
    --text-3: #77777c;

    --gold: #ed3e49;
    --gold-2: #c51f2b;
    --gold-soft: rgba(237, 62, 73, 0.10);
    --gold-line: rgba(237, 62, 73, 0.27);
    --accent-ink: #ffffff;
    --text-accent: #ed3e49;

    --crimson: #ef7180;
    --crimson-soft: rgba(239, 113, 128, 0.12);

    --mint: #48b98b;
    --mint-soft: rgba(72, 185, 139, 0.12);

    --heat-0: #2a1114;
    --heat-1: #371317;
    --heat-2: #46161b;
    --heat-3: #57191f;
    --heat-4: #6b1d24;
    --heat-5: #81232b;
    --heat-6: #982a33;
    --heat-7: #b6323c;
    --heat-8: #d33c46;
    --heat-9: #ef4d56;
    --map-line: #0c0809;
    --marker-accent: #f0cf7a;
    --marker-accent-2: #d2a94e;
    --marker-halo: rgba(240, 207, 122, 0.25);

    --radius-xs: 5px;
    --radius-sm: 7px;
    --radius: 10px;
    --radius-lg: 14px;
    --radius-xl: 18px;

    --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.32);
    --shadow: 0 8px 28px rgba(0, 0, 0, 0.38);
    --shadow-lg: 0 22px 60px rgba(0, 0, 0, 0.5);

    --font: -apple-system, BlinkMacSystemFont, "Segoe UI", Inter, Roboto, "Helvetica Neue", Arial, sans-serif;
    --mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;

    --brand-logo-height: 46px;
    --header-h: max(56px, calc(var(--brand-logo-height, 46px) + 12px));
    --wrap: 1220px;
    --ease: cubic-bezier(0.22, 0.61, 0.36, 1);
}

/* --------------------------------------------------------------------------
   2026 sade ana sayfa ve çoklu şehir satın alma akışı
   -------------------------------------------------------------------------- */
.simple-hero {
    position: relative;
    overflow: hidden;
    padding: 66px 0 30px;
    background: var(--ink);
}

.simple-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: .12;
    background-image: linear-gradient(var(--line) 1px, transparent 1px), linear-gradient(90deg, var(--line) 1px, transparent 1px);
    background-size: 56px 56px;
    mask-image: linear-gradient(to bottom, #000, transparent 88%);
}

.simple-hero__inner { position: relative; z-index: 1; text-align: center; }
.simple-hero__brandline { display: flex; justify-content: center; align-items: center; gap: 12px; color: var(--text-3); font-size: .8rem; margin-bottom: 28px; }
.simple-hero__brandline > span { display: inline-flex; align-items: center; gap: 6px; }
.simple-hero__visitors { padding: 7px 12px; border: 1px solid var(--line); border-radius: 999px; background: color-mix(in srgb, var(--surface) 86%, transparent); box-shadow: var(--shadow-sm); }
.simple-hero__visitors strong { color: var(--text); font-family: var(--mono); }
.simple-hero h1 { max-width: 920px; margin: 8px auto 12px; font-size: clamp(2.4rem, 4.6vw, 4rem); line-height: 1; letter-spacing: -.065em; }
.simple-hero__lead { max-width: 700px; margin: 0 auto; color: var(--text-2); font-size: clamp(1rem, 2vw, 1.22rem); line-height: 1.6; }

.quick-reign { position: relative; width: min(880px, 100%); margin: 32px auto 18px; padding: 12px; border: 1px solid var(--line-strong); border-radius: var(--radius-xl); background: color-mix(in srgb, var(--surface) 94%, transparent); box-shadow: var(--shadow-lg); text-align: left; transition: box-shadow .18s var(--ease), border-color .18s var(--ease); }
.quick-reign--collapsed { padding: 10px; }
.quick-reign--collapsed .quick-reign__platforms,
.quick-reign--collapsed .quick-reign__foot,
.quick-reign--collapsed #quickReignCity,
.quick-reign--collapsed .quick-reign__amount { display: none; }
.quick-reign--collapsed .quick-reign__fields { grid-template-columns: minmax(0, 1fr) auto; }
.quick-reign--collapsed .quick-reign__fields .input { grid-column: auto; }
.quick-reign--collapsed .quick-reign__fields .btn { width: auto; white-space: nowrap; }
.quick-reign__collapse { position: absolute; z-index: 2; top: -14px; right: -14px; display: grid; place-items: center; width: 30px; height: 30px; padding: 0; border: 1px solid var(--line-strong); border-radius: 50%; background: var(--surface); color: var(--text-3); box-shadow: var(--shadow-sm); cursor: pointer; }
.quick-reign__collapse:hover { color: var(--text); border-color: var(--gold-line); }
.quick-reign__platforms, .bulk-platforms { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; margin-bottom: 10px; }
.quick-reign__platforms button, .bulk-platforms button { display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-height: 42px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 11px; background: var(--surface-2); color: var(--text-3); font-size: .78rem; font-weight: 750; transition: .16s var(--ease); }
.quick-reign__platforms button .ico, .bulk-platforms button .ico { width: 17px; height: 17px; flex: 0 0 auto; }
.quick-reign__platforms button[data-quick-platform="x"] .ico, .bulk-platforms button[data-bulk-platform="x"] .ico { width: 15px; height: 15px; }
.quick-reign__platforms button:hover, .bulk-platforms button:hover { background: var(--surface-3); color: var(--text); }
.quick-reign__platforms button.is-active, .bulk-platforms button.is-active { border-color: var(--gold-line); background: var(--gold-soft); box-shadow: inset 0 0 0 1px var(--gold-line); color: var(--gold); }
.quick-reign__fields { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(150px, .8fr) minmax(120px, .6fr) auto; gap: 8px; }
.quick-reign__fields .input, .quick-reign__fields .select, .quick-reign__amount .input { min-height: 50px; }
.quick-reign__amount { min-width: 0; }
.quick-reign__foot { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 10px 5px 1px; font-size: .75rem; color: var(--text-3); }
.quick-reign__foot a { color: var(--text-2); }
.quick-reign__foot a:hover { color: var(--gold); }
.quick-reign__bulk-cta {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    min-width: 238px;
    padding: 8px 11px;
    border: 1px solid var(--gold-line);
    border-radius: 13px;
    background: linear-gradient(135deg, color-mix(in srgb, var(--gold-soft) 92%, var(--surface)), color-mix(in srgb, var(--mint-soft) 58%, var(--surface)));
    box-shadow: 0 5px 16px color-mix(in srgb, var(--gold) 11%, transparent);
    color: var(--text) !important;
    text-decoration: none;
    transition: border-color .16s var(--ease), box-shadow .16s var(--ease), transform .16s var(--ease);
}
.quick-reign__bulk-cta:hover {
    border-color: var(--gold);
    box-shadow: 0 8px 22px color-mix(in srgb, var(--gold) 18%, transparent);
    color: var(--text) !important;
    transform: translateY(-1px);
}
.quick-reign__bulk-cta-icon {
    display: grid;
    place-items: center;
    width: 29px;
    height: 29px;
    flex: 0 0 29px;
    border-radius: 9px;
    background: var(--gold);
    color: var(--accent-ink);
}
.quick-reign__bulk-cta-icon .ico { width: 16px; height: 16px; }
.quick-reign__bulk-cta-copy { display: grid; gap: 1px; min-width: 0; line-height: 1.15; }
.quick-reign__bulk-cta-copy > span { color: var(--text-3); font-size: .64rem; font-weight: 700; }
.quick-reign__bulk-cta-copy strong { color: var(--gold); font-size: .84rem; font-weight: 900; }
.quick-reign__bulk-cta-arrow { width: 17px; height: 17px; margin-left: auto; color: var(--gold); }
.simple-hero__benefits { display: flex; justify-content: center; flex-wrap: wrap; gap: 9px; }
.simple-hero__benefits span { display: inline-flex; align-items: center; gap: 7px; padding: 8px 12px; border: 1px solid var(--line); border-radius: 999px; color: var(--text-2); background: color-mix(in srgb, var(--surface) 75%, transparent); font-size: .78rem; }
.simple-hero__benefits .ico { width: 14px; height: 14px; color: var(--gold); }

.simple-home-stage { padding-top: 0; padding-bottom: 24px; }
.simple-home-stage .map-panel {
    margin: 0;
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
}
.simple-home-stage .map-panel__head { display: none; }
.simple-home-stage .map-wrap { background: transparent; }
.simple-home-stage .map-controls { display: none; }

/* Haritada seçilen il, sayfadan ayrılmadan kendi teklif listesine odaklanır. */
.map-control.map-control--focus-close {
    position: absolute;
    z-index: 5;
    right: 18px;
    bottom: 18px;
    width: 42px;
    height: 42px;
    background: color-mix(in srgb, var(--surface) 93%, transparent);
    border: 1px solid var(--line);
    border-radius: 13px;
    box-shadow: var(--shadow-md);
    backdrop-filter: blur(10px);
}
.map-control.map-control--focus-close .ico { width: 19px; height: 19px; }
.map-wrap.is-city-focus { overflow: hidden; }
.map-wrap.is-city-focus .map-zoom-stage { position: relative; }
.map-wrap.is-city-focus .map-zoom-stage .tr-map {
    max-width: none;
    transform-origin: top left;
    transition: transform .42s var(--ease);
    will-change: transform;
}
.map-wrap.is-city-focus .tr-city,
.map-wrap.is-city-focus .map-reis-marker { opacity: .4; transition: opacity .22s var(--ease); }
.map-wrap.is-city-focus .tr-city.is-active,
.map-wrap.is-city-focus .map-reis-marker.is-active { opacity: 1; }
.map-wrap.is-city-focus .tr-city.is-active path {
    fill: var(--gold-2);
    stroke: var(--text);
    stroke-width: 1.15;
}

.city-focus { padding: 24px 4px 8px; }
.city-focus__panel { width: min(760px, 100%); margin-inline: auto; }
.city-focus__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.city-focus__head h2 { font-size: clamp(1.65rem, 4vw, 2.25rem); line-height: 1; letter-spacing: -.055em; }
.city-focus__head p { margin-top: 5px; color: var(--text-2); font-size: .84rem; font-weight: 700; }
.city-focus__plate { display: grid; place-items: center; width: 40px; height: 36px; border: 1px solid var(--gold-line); border-radius: 11px; background: var(--gold-soft); color: var(--text-accent); font-family: var(--mono); font-size: .85rem; font-weight: 900; }
.city-focus__list { display: grid; gap: 9px; list-style: none; }
.city-focus__offer {
    display: grid;
    grid-template-columns: 42px 52px minmax(0, 1fr) auto;
    align-items: center;
    gap: 11px;
    min-width: 0;
    padding: 11px 14px;
    border: 1px solid var(--line);
    border-radius: 17px;
    background: color-mix(in srgb, var(--surface) 94%, transparent);
    box-shadow: var(--shadow-sm);
}
.city-focus__offer.is-leading { border-color: color-mix(in srgb, var(--gold) 38%, var(--line-strong)); box-shadow: var(--shadow); }
.city-focus__rank { color: var(--text-3); font-family: var(--mono); font-size: .86rem; font-weight: 850; }
.city-focus__offer.is-leading .city-focus__rank { color: var(--gold-2); }
.city-focus__avatar { display: grid; place-items: center; width: 52px; height: 52px; overflow: hidden; border: 1px solid var(--line); border-radius: 16px; background: var(--surface-2); color: var(--gold); }
.city-focus__avatar img { width: 100%; height: 100%; object-fit: cover; }
.city-focus__avatar > span { display: grid; place-items: center; width: 100%; height: 100%; }
.city-focus__avatar .ico { width: 22px; height: 22px; }
.city-focus__identity { display: grid; min-width: 0; }
.city-focus__identity strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .97rem; letter-spacing: -.02em; }
.city-focus__identity span { overflow: hidden; margin-top: 2px; color: var(--text-3); font-size: .74rem; text-overflow: ellipsis; white-space: nowrap; }
.city-focus__amount { display: grid; justify-items: end; min-width: 58px; }
.city-focus__amount strong { font-family: var(--mono); font-size: 1rem; white-space: nowrap; }
.city-focus__amount span { display: inline-flex; align-items: center; gap: 3px; margin-top: 2px; color: var(--text-3); font-size: .65rem; white-space: nowrap; }
.city-focus__amount .ico { width: 11px; height: 11px; }
.city-focus__empty { display: flex; align-items: center; gap: 10px; padding: 18px; border: 1px dashed var(--gold-line); border-radius: 17px; color: var(--text-2); background: color-mix(in srgb, var(--surface) 72%, transparent); }
.city-focus__empty .ico { width: 19px; height: 19px; flex: 0 0 auto; color: var(--gold); }
.city-focus__actions { display: flex; gap: 9px; margin-top: 14px; }
.city-focus__actions > .btn { flex: 1 1 0; min-width: 0; border-radius: 16px; }
.city-focus__vote { border-color: var(--mint); background: var(--mint-soft); color: var(--mint); box-shadow: 0 10px 22px color-mix(in srgb, var(--mint) 13%, transparent); }
.city-focus__vote:hover { border-color: var(--mint); background: color-mix(in srgb, var(--mint-soft) 78%, var(--surface-2)); color: var(--mint); }
.city-focus__vote.is-voted { background: var(--mint); color: var(--accent-ink); box-shadow: none; }
.city-focus__take { margin-top: 0; box-shadow: 0 12px 25px color-mix(in srgb, var(--gold) 20%, transparent); }

.recent-strip { padding: 8px 0 24px; overflow: hidden; }
.recent-strip__title { display: flex; align-items: center; justify-content: center; gap: 7px; margin-bottom: 10px; color: var(--text-3); font-size: .75rem; font-weight: 750; }
.recent-strip__viewport { width: 100%; overflow-x: auto; overflow-y: hidden; scrollbar-width: none; -webkit-overflow-scrolling: touch; overscroll-behavior-inline: contain; touch-action: pan-x pan-y; }
.recent-strip__viewport::-webkit-scrollbar { display: none; }
.recent-strip__viewport:focus-visible { outline: 2px solid var(--gold-line); outline-offset: 3px; border-radius: 13px; }
.recent-strip__track { display: flex; gap: 8px; width: max-content; min-width: 100%; padding: 2px 2px 8px; }
.recent-purchase { flex: 0 0 200px; width: 200px; min-width: 0; display: flex; align-items: center; gap: 9px; padding: 8px 12px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); }
.recent-purchase:hover { border-color: var(--gold-line); transform: translateY(-1px); }
.recent-purchase img, .recent-purchase > span:first-child { width: 30px; height: 30px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 9px; object-fit: cover; background: var(--gold-soft); color: var(--gold); }
.recent-purchase > span:last-child { min-width: 0; display: grid; }
.recent-purchase strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .875rem; line-height: 1.114; }
.recent-purchase small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--text-3); font-size: .75rem; line-height: 1.2; }

.home-ranking--simple {
    max-width: 1040px;
    padding-top: 0;
    padding-bottom: 22px;
}

.home-ranking--simple .leaderboard-list { gap: 10px; }
.home-ranking--continuation { padding-top: 0; }

.home-profile-ranking {
    max-width: 752px;
    padding-top: 0;
    padding-bottom: 22px;
}

.home-profile-ranking--continuation {
    padding-top: 0;
}

.home-profile-ranking__list {
    display: grid;
    gap: 8px;
}

.home-profile-row {
    display: grid;
    grid-template-columns: 35px 46px minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    min-width: 0;
    height: 63.84375px;
    padding: 10px 14px;
    border: 1px solid var(--line);
    border-radius: 13px;
    background: var(--surface);
    box-shadow: var(--shadow-sm);
    transition: transform .18s var(--ease), border-color .18s var(--ease), box-shadow .18s var(--ease);
}

.home-profile-ranking:not(.home-profile-ranking--continuation) .home-profile-row:first-child {
    height: 76px;
    padding: 14px;
    border-color: color-mix(in srgb, var(--gold) 44%, var(--line));
    background: color-mix(in srgb, var(--gold-soft) 34%, var(--surface));
}

.home-profile-row:hover {
    transform: translateY(-1px);
    border-color: var(--gold-line);
    box-shadow: var(--shadow);
}

.home-profile-row__rank {
    color: var(--text-3);
    font: 800 .78rem var(--mono);
    text-align: center;
}

.home-profile-ranking:not(.home-profile-ranking--continuation) .home-profile-row:first-child .home-profile-row__rank {
    color: var(--gold);
}

.home-profile-row__avatar {
    width: 46px;
    height: 40px;
    display: grid;
    place-items: start;
    overflow: visible;
    color: var(--gold);
    background: transparent;
    border: 0;
    border-radius: 0;
}

.home-profile-row__avatar img {
    width: 40px;
    height: 40px;
    object-fit: cover;
    border-radius: 50%;
}

.home-profile-ranking:not(.home-profile-ranking--continuation) .home-profile-row:first-child .home-profile-row__avatar {
    height: 46px;
}

.home-profile-ranking:not(.home-profile-ranking--continuation) .home-profile-row:first-child .home-profile-row__avatar img {
    width: 46px;
    height: 46px;
}

.home-profile-row__avatar .ico {
    width: 22px;
    height: 22px;
}

.home-profile-row__identity {
    min-width: 0;
    color: var(--text);
}

.home-profile-row__identity > strong,
.home-profile-row__identity > span {
    display: block;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.home-profile-row__identity > strong {
    font-size: 1rem;
    font-weight: 850;
    line-height: 1.35;
    letter-spacing: -.02em;
}

.home-profile-row__identity > span {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 0;
    color: var(--text-3);
    font-size: .8125rem;
    line-height: 1.55;
}

.home-profile-row__identity b,
.home-profile-row__identity em {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    color: var(--gold);
    font-style: normal;
    font-weight: 800;
}

.home-profile-row__identity b .ico {
    width: 12px;
    height: 12px;
}

.home-profile-row__info {
    display: inline-flex;
    width: 15px;
    height: 15px;
    margin-left: 3px;
    color: var(--text-3);
    vertical-align: -2px;
}

.home-profile-row__info .ico {
    width: 15px;
    height: 15px;
}

.home-profile-row__stats {
    display: grid;
    justify-items: end;
    gap: 2px;
    white-space: nowrap;
}

.home-profile-row__stats strong {
    color: var(--text);
    font: 600 1.125rem/1.2 Georgia, "Times New Roman", serif;
}

.home-profile-row__stats span {
    color: var(--text-3);
    font-size: .6875rem;
    line-height: 1.2;
}

.home-profile-ranking:not(.home-profile-ranking--continuation) .home-profile-row:first-child .home-profile-row__stats strong {
    font-size: 1.375rem;
}

.profile-ranking { padding-top: 42px; padding-bottom: 42px; }
.profile-ranking__head { align-items: flex-end; }
.profile-ranking__head > div > p:last-child { max-width: 650px; margin-top: 5px; color: var(--text-3); font-size: .88rem; }
.profile-podium { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.profile-rank { border: 1px solid var(--line); background: var(--surface); }
.profile-rank--top { position: relative; display: grid; justify-items: center; text-align: center; gap: 10px; padding: 28px 18px 18px; border-radius: var(--radius-lg); overflow: hidden; }
.profile-rank--top::before { content: ""; position: absolute; inset: 0 0 auto; height: 4px; background: linear-gradient(90deg, var(--gold), var(--mint)); }
.profile-rank__position { font: 750 .75rem var(--mono); color: var(--text-3); }
.profile-rank__avatar { width: 54px; height: 54px; display: grid; place-items: center; border-radius: 16px; background: var(--gold-soft); color: var(--gold); overflow: hidden; }
.profile-rank__avatar img { width: 100%; height: 100%; object-fit: cover; }
.profile-rank__identity { min-width: 0; display: grid; gap: 2px; }
.profile-rank__identity strong { font-size: .94rem; }
.profile-rank__identity span { color: var(--text-3); font-size: .72rem; }
.profile-rank__stats { display: grid; gap: 2px; }
.profile-rank__stats b { color: var(--gold); font: 800 1.1rem var(--mono); }
.profile-rank__stats span { color: var(--text-3); font-size: .7rem; }
.profile-rank__visit { color: var(--text-2); font-size: .75rem; font-weight: 750; }
.profile-rank-list { display: grid; gap: 8px; margin-top: 12px; }
.profile-rank--row { display: grid; grid-template-columns: 40px 42px minmax(0, 1fr) minmax(150px, auto) auto; align-items: center; gap: 12px; padding: 11px 13px; border-radius: 12px; }
.profile-rank--row .profile-rank__avatar { width: 38px; height: 38px; border-radius: 11px; }
.profile-ranking__empty { padding: 34px; }

.compact-faq { display: grid; grid-template-columns: 280px minmax(0, 1fr); gap: 34px; padding-top: 34px; padding-bottom: 64px; }
.compact-faq__intro h2 { margin: 5px 0 7px; font-size: 1.55rem; }
.compact-faq__intro > p:last-child { color: var(--text-3); font-size: .85rem; }
.compact-faq__items { display: grid; grid-template-columns: 1fr 1fr; align-items: start; gap: 8px; }
.compact-faq details { border: 1px solid var(--line); border-radius: 12px; background: var(--surface); }
.compact-faq summary { min-height: 52px; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 14px; cursor: pointer; font-size: .83rem; font-weight: 780; list-style: none; }
.compact-faq summary::-webkit-details-marker { display: none; }
.compact-faq summary span { width: 18px; height: 18px; position: relative; flex: 0 0 auto; border-radius: 50%; background: var(--surface-3); }
.compact-faq summary span::before, .compact-faq summary span::after { content: ""; position: absolute; left: 5px; right: 5px; top: 8px; height: 2px; background: var(--text-2); }
.compact-faq summary span::after { transform: rotate(90deg); transition: transform .15s; }
.compact-faq details[open] { border-color: var(--gold-line); background: var(--gold-soft); }
.compact-faq details[open] summary span::after { transform: rotate(0); }
.compact-faq details p { padding: 0 14px 14px; color: var(--text-2); font-size: .8rem; line-height: 1.55; }

.bulk-hero { padding: 58px 0 26px; text-align: center; background: radial-gradient(circle at 50% 0%, var(--gold-soft), transparent 62%); }
.bulk-hero h1 { margin: 5px 0 8px; font-size: clamp(2.4rem, 6vw, 4.6rem); letter-spacing: -.06em; }
.bulk-hero p:last-child { color: var(--text-2); }
.bulk-checkout { display: grid; gap: 14px; padding-bottom: 56px; }
.bulk-checkout > * { min-width: 0; }
.bulk-step { width: 100%; min-width: 0; padding: 20px; }
.bulk-step__head { display: flex; align-items: flex-start; gap: 12px; margin-bottom: 16px; }
.bulk-step__head > span { width: 28px; height: 28px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 50%; background: var(--gold); color: var(--accent-ink); font: 750 .76rem var(--mono); }
.bulk-step__head h2 { font-size: 1.05rem; }
.bulk-step__head p { margin-top: 2px; color: var(--text-3); font-size: .78rem; }
.bulk-platforms { max-width: 640px; }
.bulk-profile-preview { display: flex; align-items: center; gap: 10px; margin-top: 12px; padding: 11px; border: 1px solid var(--mint); border-radius: 12px; background: var(--mint-soft); }
.bulk-profile-preview img { border-radius: 11px; object-fit: cover; }
.bulk-profile-preview .grow { display: grid; }
.bulk-profile-preview span:not(.chip) { color: var(--text-3); font-size: .74rem; }
.bulk-meta-fields { display: grid; grid-template-columns: 1fr 1.5fr; gap: 10px; margin-top: 12px; }
.bulk-quick-row { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; margin-bottom: 12px; color: var(--text-3); font-size: .76rem; }
.bulk-quick-row button { padding: 6px 9px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface-2); color: var(--text-2); font-size: .72rem; }
.bulk-quick-row button:hover { border-color: var(--gold-line); color: var(--gold); }
.bulk-map { padding: 12px; border: 1px solid var(--line); border-radius: var(--radius-lg); background: var(--surface-2); }
.bulk-map .tr-map { display: block; width: min(880px, 100%); margin: auto; }
.bulk-map .tr-city { cursor: pointer; }
.bulk-map .tr-city.is-selected path { fill: var(--gold) !important; stroke-width: 2.4; filter: drop-shadow(0 3px 5px var(--gold-soft)); }
.bulk-map .map-reis-marker { display: none; }
.bulk-budget { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin: 12px 0; padding: 11px; border-radius: 12px; background: var(--surface-2); }
.bulk-budget label { font-weight: 750; font-size: .8rem; }
.bulk-budget .input-money { width: 150px; }
.bulk-budget > span { color: var(--text-3); font-size: .72rem; }
.bulk-city-picker { border-top: 1px solid var(--line); padding-top: 12px; }
.bulk-city-picker summary { display: flex; justify-content: space-between; cursor: pointer; list-style: none; font-size: .82rem; }
.bulk-city-picker summary span { color: var(--text-3); }
.bulk-city-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 7px; margin-top: 12px; max-height: 440px; overflow: auto; padding-right: 3px; }
.bulk-city { display: grid; grid-template-columns: auto 32px minmax(0, 1fr) auto; align-items: center; gap: 7px; min-width: 0; padding: 8px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface-2); cursor: pointer; }
.bulk-city.is-selected { border-color: var(--gold); background: var(--gold-soft); }
.bulk-city__name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .78rem; font-weight: 730; }
.bulk-city__price { color: var(--text-3); font: 700 .7rem var(--mono); }
.bulk-city__bid { grid-column: 2 / -1; display: none; min-height: 34px; height: 34px; }
.bulk-city.is-selected .bulk-city__bid { display: block; }
.bulk-total { position: relative; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); align-items: center; gap: 18px; padding: 14px 16px; box-shadow: var(--shadow-lg); }
.bulk-total > p, .bulk-total > .btn { grid-column: 1 / -1; }
.profile-page__stats > div { display: grid; gap: 6px; min-width: 0; }
.bulk-total > div { display: grid; }
.bulk-total > div span { color: var(--text-3); font-size: .68rem; }
.bulk-total > div strong { font: 800 1.08rem var(--mono); }
.bulk-total > p { color: var(--text-3); font-size: .72rem; }
.bulk-total > p strong { color: var(--text); }
.bulk-total .alert { grid-column: 1 / -1; }
.bulk-success-list { width: min(620px, 100%); display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin: 18px auto; text-align: left; }
.bulk-success-list a { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 9px; padding: 10px; border: 1px solid var(--line); border-radius: 11px; background: var(--surface-2); color: var(--text); }
.bulk-success-list a > span:last-child { color: var(--gold); font: 750 .78rem var(--mono); }
.bulk-success-list strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .8rem; }

.profile-page { padding: 52px 0 70px; }
.profile-page__hero { display: flex; align-items: center; gap: 18px; padding: 24px; }
.profile-page__avatar { width: 72px; height: 72px; display: grid; place-items: center; flex: 0 0 auto; overflow: hidden; border-radius: 20px; background: var(--gold-soft); color: var(--gold); }
.profile-page__avatar img { width: 100%; height: 100%; object-fit: cover; }
.profile-page__hero h1 { margin: 2px 0; font-size: 1.75rem; }
.profile-page__hero .grow > a { color: var(--gold); font-size: .82rem; }
.profile-page__hero .grow > p:last-child { max-width: 620px; margin-top: 7px; color: var(--text-3); font-size: .8rem; }
.profile-page__stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin: 12px 0; }
.profile-page__stats .card { display: grid; padding: 16px; }
.profile-page__stats span { color: var(--text-3); font-size: .72rem; }
.profile-page__stats strong { color: var(--gold); font: 800 1.2rem var(--mono); }
.profile-page__areas { overflow: hidden; }
.profile-performance > .profile-page__stats, .profile-performance > p { margin: 16px; }
.profile-performance > .profile-page__stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.profile-performance .card__head { flex-wrap: wrap; gap: 10px; }
.profile-performance nav a[aria-current="page"] { color: var(--gold); font-weight: 700; }
.profile-page__areas .card__head { display: flex; justify-content: space-between; align-items: center; }
.profile-page__area-list { display: grid; }
.profile-page__area-list > a { display: grid; grid-template-columns: 38px minmax(0, 1fr) auto 18px; align-items: center; gap: 10px; padding: 12px 16px; border-top: 1px solid var(--line); }
.profile-page__area-list > a:hover { background: var(--surface-2); }
.profile-page__area-list span:not(.plate) { display: grid; }
.profile-page__area-list small { color: var(--text-3); font-size: .7rem; }
.profile-page__area-list b { color: var(--gold); font-family: var(--mono); }

@media (max-width: 820px) {
    .simple-hero { padding-top: 42px; }
    .simple-hero h1 { font-size: clamp(2.25rem, 9.2vw, 3rem); }
    .quick-reign__fields { grid-template-columns: 1fr 1fr; }
    .quick-reign__fields #quickReignUrl { grid-column: 1 / -1; }
    .quick-reign__fields .btn { width: 100%; }
    .quick-reign--collapsed .quick-reign__fields { grid-template-columns: minmax(0, 1fr) auto; }
    .quick-reign--collapsed .quick-reign__fields #quickReignUrl { grid-column: auto; }
    .quick-reign--collapsed .quick-reign__fields .btn { width: auto; }
    .profile-podium { grid-template-columns: 1fr; }
    .profile-rank--top { grid-template-columns: 46px 54px minmax(0, 1fr) auto; justify-items: start; align-items: center; text-align: left; padding: 16px; }
    .profile-rank--top .profile-rank__visit { display: none; }
    .profile-rank--row { grid-template-columns: 34px 38px minmax(0, 1fr) auto; }
    .profile-rank--row .profile-rank__stats { display: none; }
    .compact-faq { grid-template-columns: 1fr; gap: 16px; }
    .bulk-city-grid { grid-template-columns: 1fr 1fr; }
    .bulk-total { grid-template-columns: 1fr 1fr auto; }
    .bulk-total > p { grid-column: 1 / 3; }
    .profile-page__stats { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 560px) {
    .simple-hero { padding-top: 30px; }
    .simple-hero__brandline { margin-bottom: 20px; }
    .simple-hero__brandline > span:last-child { display: none; }
    .quick-reign { margin-top: 24px; padding: 9px; }
    .quick-reign__platforms, .bulk-platforms { grid-template-columns: 1fr 1fr; }
    .quick-reign__fields { grid-template-columns: 1fr; }
    .quick-reign__fields #quickReignUrl { grid-column: auto; }
    .quick-reign__foot { align-items: flex-start; flex-direction: column; }
    .quick-reign__bulk-cta { width: 100%; min-width: 0; }
    .quick-reign--collapsed .quick-reign__fields { grid-template-columns: minmax(0, 1fr) auto; }
    .quick-reign--collapsed .quick-reign__fields #quickReignUrl { grid-column: auto; }
    .quick-reign--collapsed .quick-reign__fields .btn { width: auto; padding-left: 14px; padding-right: 14px; }
    .simple-hero__benefits { gap: 6px; }
    .simple-hero__benefits span { padding: 7px 9px; font-size: .7rem; }
    .simple-home-stage { padding-left: 8px; padding-right: 8px; }
    .profile-ranking { padding-top: 24px; }
    .profile-ranking__head { align-items: flex-start; }
    .profile-ranking__head .btn { width: 100%; }
    .profile-rank--top { grid-template-columns: 34px 48px minmax(0, 1fr); gap: 9px; }
    .profile-rank--top .profile-rank__avatar { width: 48px; height: 48px; }
    .profile-rank--top .profile-rank__stats { display: none; }
    .profile-rank--row { grid-template-columns: 28px 36px minmax(0, 1fr); padding: 10px; }
    .profile-rank--row > .btn { display: none; }
    .compact-faq__items { grid-template-columns: 1fr; }
    .bulk-hero { padding-top: 36px; }
    .bulk-step { padding: 14px; }
    .bulk-step .input-group { display: grid; grid-template-columns: 1fr; }
    .bulk-meta-fields { grid-template-columns: 1fr; }
    .bulk-map { padding: 2px; overflow-x: auto; }
    .bulk-map .tr-map { min-width: 620px; }
    .bulk-city-grid { grid-template-columns: 1fr; max-height: 520px; }
    .bulk-success-list { grid-template-columns: 1fr; }
    .bulk-total { bottom: 7px; grid-template-columns: 1fr 1fr; gap: 9px; }
    .bulk-total > p { grid-column: 1 / -1; }
    .bulk-total > .btn { grid-column: 1 / -1; width: 100%; }
    .profile-page { padding-top: 28px; }
    .profile-page__hero { align-items: flex-start; flex-wrap: wrap; padding: 16px; }
    .profile-page__hero .btn { width: 100%; }
    .profile-page__stats { grid-template-columns: 1fr 1fr; }
    .profile-page__area-list > a { grid-template-columns: 34px minmax(0, 1fr) auto; }
    .profile-page__area-list > a > .ico { display: none; }
}

/* Ana sayfadaki harita, referanstaki gibi mobilde tam genişlikte ve
   yalnızca tam ekran düğmesiyle gösterilir. Diğer sayfalardaki harita
   yakınlaştırma araçları bu kapsamın dışında kalır. */
@media (max-width: 720px) {
    .wrap.simple-home-stage { padding-left: 0; padding-right: 0; }
    .simple-home-stage { padding-bottom: 14px; }
    .simple-home-stage .map-panel { border: 0; border-radius: 0; }
    .simple-home-stage .map-panel__head { display: none; }
    .simple-home-stage .map-wrap { padding: 0; }
    .simple-home-stage .map-zoom-stage { width: 100%; }
    .simple-home-stage .map-zoom-stage .tr-map { width: 100%; max-width: none; }
    .simple-home-stage .map-control--fullscreen { top: 14px; right: 14px; bottom: auto; }
    .simple-home-stage .map-control--focus-close { top: 14px; right: 14px; bottom: auto; }
    .city-focus { padding: 20px 18px 8px; }
    .city-focus__head { margin-bottom: 10px; }
    .city-focus__head h2 { font-size: 1.55rem; }
    .city-focus__offer {
        grid-template-columns: 26px 44px minmax(0, 1fr) auto;
        gap: 8px;
        height: 68px;
        padding: 11px;
        border-radius: 13px;
    }
    .city-focus__avatar { width: 44px; height: 44px; border-radius: 13px; }
    .city-focus__identity strong { font-size: .91rem; }
    .city-focus__identity span { display: block; font-size: .68rem; }
    .city-focus__amount strong { font-size: .93rem; }
    .city-focus__amount span { font-size: .6rem; }
    .city-focus__actions { flex-direction: column; }
    .city-focus__actions > .btn { width: 100%; }
    .recent-strip > .wrap { padding-left: 0; padding-right: 0; }
    .recent-purchase { flex-basis: 200px; }
    .home-ranking--simple { padding-bottom: 14px; }
    .wrap.home-profile-ranking {
        padding-right: 18px;
        padding-bottom: 14px;
        padding-left: 18px;
    }
    .home-profile-row {
        grid-template-columns: 26px 44px minmax(0, 1fr) auto;
        gap: 8px;
        height: 68px;
        padding: 11px;
        border-radius: 13px;
    }
    .home-profile-row__avatar {
        width: 44px;
        height: 44px;
        border-radius: 13px;
    }
    .home-profile-row__avatar .ico {
        width: 19px;
        height: 19px;
    }
    .home-profile-row__identity > strong {
        font-size: .97rem;
    }
    .home-profile-row__identity > span {
        display: flex;
        gap: 4px;
        margin-top: 1px;
        font-size: .68rem;
    }
    .home-profile-row__info,
    .home-profile-row__info .ico {
        width: 13px;
        height: 13px;
    }
    .home-profile-row__stats strong {
        font-size: .94rem;
    }
    .home-profile-row__stats span {
        font-size: .62rem;
    }
}

[data-theme="light"] {
    color-scheme: light;

    --ink: #f7f2e8;
    --ink-2: #fffdf8;
    --surface: #fffdf9;
    --surface-2: #faf6ee;
    --surface-3: #f0e9df;
    --line: #e6ddd2;
    --line-strong: #d4c9bb;

    --text: #1a1a1f;
    --text-2: #5c5a62;
    --text-3: #9a979f;

    --gold: #d61f2c;
    --gold-2: #aa1420;
    --gold-soft: rgba(214, 31, 44, 0.08);
    --gold-line: rgba(214, 31, 44, 0.22);
    --accent-ink: #ffffff;
    --text-accent: #c71925;

    --crimson: #d85a68;
    --crimson-soft: rgba(216, 90, 104, 0.08);

    --mint: #25a06e;
    --mint-soft: rgba(37, 160, 110, 0.08);

    --heat-0: #fdebec;
    --heat-1: #fad9dc;
    --heat-2: #f5c2c7;
    --heat-3: #efa5ad;
    --heat-4: #e9848e;
    --heat-5: #df626e;
    --heat-6: #d64552;
    --heat-7: #c62f3c;
    --heat-8: #a91f2c;
    --heat-9: #86151f;
    --map-line: #ffffff;
    --marker-accent: #e4bd64;
    --marker-accent-2: #c79532;
    --marker-halo: rgba(228, 189, 100, 0.24);

    --shadow-sm: 0 1px 3px rgba(30, 24, 18, 0.05);
    --shadow: 0 8px 28px rgba(50, 35, 22, 0.07);
    --shadow-lg: 0 20px 50px rgba(50, 35, 22, 0.11);
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

[hidden] {
    display: none !important;
}

* {
    margin: 0;
    padding: 0;
}

html {
    -webkit-text-size-adjust: 100%;
    scroll-behavior: smooth;
    scroll-padding-top: calc(var(--header-h) + 16px);
    max-width: 100%;
    overflow-x: hidden;
    /* Şehir paneli açılırken body kaydırması kilitlenir. Gutter sabit
       kaldığı için sayfa ve sabit başlık yatayda zıplamaz. */
    scrollbar-gutter: stable;
}

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }

    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}

body {
    min-height: 100vh;
    width: 100%;
    max-width: 100%;
    display: flex;
    flex-direction: column;
    overflow-x: hidden;
    background: var(--ink);
    color: var(--text);
    font-family: var(--font);
    font-size: 15px;
    line-height: 1.55;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

/* Body bir flex sütunu olduğu için uzun bir min-content satırı tüm sayfayı
   genişletmemeli. Harita gibi kontrollü kaydırma alanları kendi
   kapsayıcılarında yatay kaydırılmaya devam eder. */
main {
    width: 100%;
    min-width: 0;
    max-width: 100%;
}

img,
svg {
    display: block;
    max-width: 100%;
}

.ico {
    width: 1.05em;
    height: 1.05em;
    flex: none;
    vertical-align: -0.16em;
}

.card__title .ico,
.section-head__title .ico {
    width: 17px;
    height: 17px;
    color: var(--gold);
}

.chip .ico {
    width: 11px;
    height: 11px;
}

.ticker__item .ico {
    width: 12px;
    height: 12px;
    color: var(--gold);
}

.city-row__sub .ico,
.city-row__reis .ico {
    width: 12px;
    height: 12px;
}

.steps .ico {
    width: 11px;
    height: 11px;
}

.field__hint .ico,
.hero__by .ico,
.breadcrumb .ico,
.footer-bottom .ico {
    width: 13px;
    height: 13px;
}

.timeline .ico,
.podium .ico {
    width: 14px;
    height: 14px;
    color: var(--gold);
}

.rule-card .ico,
.price-summary .ico,
.map-legend .ico {
    width: 14px;
    height: 14px;
}

a {
    color: inherit;
    text-decoration: none;
}

button,
input,
select,
textarea {
    font: inherit;
    color: inherit;
}

button {
    background: none;
    border: 0;
    cursor: pointer;
}

h1,
h2,
h3,
h4 {
    line-height: 1.16;
    letter-spacing: -0.02em;
    font-weight: 800;
}

h1 {
    font-size: clamp(1.85rem, 4.6vw, 3.05rem);
    letter-spacing: -0.035em;
}

h2 {
    font-size: clamp(1.2rem, 2.4vw, 1.6rem);
}

h3 {
    font-size: 1.02rem;
}

::selection {
    background: var(--gold);
    color: var(--accent-ink);
}

:focus-visible {
    outline: 2px solid var(--gold);
    outline-offset: 2px;
    border-radius: var(--radius-xs);
}

.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;
}

.skip-link {
    position: absolute;
    top: -60px;
    left: 12px;
    z-index: 200;
    padding: 10px 16px;
    background: var(--gold);
    color: var(--accent-ink);
    font-weight: 800;
    border-radius: 0 0 var(--radius) var(--radius);
    transition: top 0.18s var(--ease);
}

.skip-link:focus {
    top: 0;
}

.wrap {
    width: 100%;
    max-width: var(--wrap);
    margin-inline: auto;
    padding-inline: 16px;
}

/* Dutluktu referansındaki liste genişliği: dış kapsayıcı 752px, kart alanı 720px. */
.wrap.home-profile-ranking {
    max-width: 752px;
}

.wrap--narrow {
    max-width: 780px;
}

.mono {
    font-family: var(--mono);
    font-variant-numeric: tabular-nums;
}

.muted {
    color: var(--text-2);
}

.dim {
    color: var(--text-3);
}

.gold {
    color: var(--gold);
}

.stack {
    display: flex;
    flex-direction: column;
}

.row {
    display: flex;
    align-items: center;
}

.gap-4 { gap: 4px; }
.gap-6 { gap: 6px; }
.gap-8 { gap: 8px; }
.gap-10 { gap: 10px; }
.gap-12 { gap: 12px; }
.gap-16 { gap: 16px; }
.gap-20 { gap: 20px; }
.gap-24 { gap: 24px; }

.grow { flex: 1 1 auto; min-width: 0; }
.shrink-0 { flex-shrink: 0; }
.wrap-flex { flex-wrap: wrap; }
.between { justify-content: space-between; }
.center { justify-content: center; }
.items-start { align-items: flex-start; }
.text-center { text-align: center; }

.truncate {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.clamp-2 {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.hide-mobile { display: initial; }
.only-mobile { display: none; }

.card {
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-sm);
}

.card--pad {
    padding: 18px;
}

.card__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 14px 18px;
    border-bottom: 1px solid var(--line);
}

.card__title {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.95rem;
    font-weight: 800;
    letter-spacing: -0.01em;
}

.card__body {
    padding: 14px 16px;
}

.chip {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 3px 8px;
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    border-radius: 999px;
    background: var(--surface-3);
    border: 1px solid var(--line);
    color: var(--text-2);
    white-space: nowrap;
}

.chip--gold {
    background: var(--gold-soft);
    border-color: var(--gold-line);
    color: var(--gold);
}

.chip--crimson {
    background: var(--crimson-soft);
    border-color: var(--crimson);
    color: var(--crimson);
}

.chip--mint {
    background: var(--mint-soft);
    border-color: var(--mint);
    color: var(--mint);
}

.plate {
    display: inline-grid;
    place-items: center;
    min-width: 30px;
    height: 22px;
    padding-inline: 5px;
    font-family: var(--mono);
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    color: var(--text);
    background: var(--surface-3);
    border: 1px solid var(--line-strong);
    border-radius: 5px;
}

.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 9px 15px;
    font-size: 0.83rem;
    font-weight: 700;
    letter-spacing: -0.005em;
    border-radius: var(--radius-sm);
    border: 1px solid var(--line-strong);
    background: var(--surface-2);
    color: var(--text);
    cursor: pointer;
    transition: background 0.15s var(--ease), border-color 0.15s var(--ease), transform 0.08s var(--ease), color 0.15s var(--ease);
    white-space: nowrap;
}

.btn:hover {
    background: var(--surface-3);
    border-color: var(--line-strong);
}

.btn:active {
    transform: translateY(1px);
}

.btn:disabled {
    opacity: 0.5;
    cursor: not-allowed;
    transform: none;
}

.btn--gold {
    background: var(--gold);
    border-color: var(--gold-2);
    color: var(--accent-ink);
}

.btn--gold:hover {
    background: var(--gold-2);
    border-color: var(--gold-2);
}

.btn--ghost {
    background: transparent;
    border-color: var(--line);
    color: var(--text-2);
}

.btn--ghost:hover {
    color: var(--text);
    background: var(--surface-2);
}

.btn--danger {
    background: var(--crimson-soft);
    border-color: var(--crimson);
    color: var(--crimson);
}

.btn--danger:hover {
    background: var(--crimson-soft);
}

.btn--sm {
    padding: 6px 11px;
    font-size: 0.76rem;
    border-radius: var(--radius-xs);
}

.btn--lg {
    padding: 12px 22px;
    font-size: 0.95rem;
    border-radius: var(--radius);
}

.btn--block {
    width: 100%;
}

.btn--icon {
    padding: 8px;
    min-width: 34px;
}

.btn svg {
    width: 15px;
    height: 15px;
    flex-shrink: 0;
}

.field {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.field__label {
    font-size: 0.79rem;
    font-weight: 700;
    color: var(--text-2);
}

.field__hint {
    font-size: 0.73rem;
    color: var(--text-3);
    line-height: 1.45;
}

.input,
.select,
.textarea {
    width: 100%;
    padding: 10px 12px;
    font-size: 0.88rem;
    background: var(--ink-2);
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    color: var(--text);
    transition: border-color 0.15s var(--ease), background 0.15s var(--ease);
}

.input::placeholder,
.textarea::placeholder {
    color: var(--text-3);
}

.input:focus,
.select:focus,
.textarea:focus {
    outline: none;
    border-color: var(--gold-line);
    background: var(--surface);
}

.textarea {
    min-height: 78px;
    resize: vertical;
    line-height: 1.5;
}

.select {
    appearance: none;
    background-image: linear-gradient(45deg, transparent 50%, var(--text-3) 50%),
        linear-gradient(135deg, var(--text-3) 50%, transparent 50%);
    background-position: calc(100% - 16px) 50%, calc(100% - 11px) 50%;
    background-size: 5px 5px, 5px 5px;
    background-repeat: no-repeat;
    padding-right: 32px;
    cursor: pointer;
}

.input-group {
    display: flex;
    align-items: stretch;
    gap: 8px;
}

.input-money {
    position: relative;
    display: flex;
    align-items: center;
}

.input-money::before {
    content: "₺";
    position: absolute;
    left: 12px;
    font-family: var(--mono);
    font-weight: 700;
    color: var(--gold);
    pointer-events: none;
}

.input-money .input {
    padding-left: 26px;
    font-family: var(--mono);
    font-weight: 700;
}

.switch {
    display: flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
    user-select: none;
}

.switch input {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
}

.switch__track {
    position: relative;
    width: 40px;
    height: 22px;
    border-radius: 999px;
    background: var(--surface-3);
    border: 1px solid var(--line-strong);
    transition: background 0.16s var(--ease), border-color 0.16s var(--ease);
    flex-shrink: 0;
}

.switch__track::after {
    content: "";
    position: absolute;
    inset: 2px auto 2px 2px;
    width: 16px;
    border-radius: 50%;
    background: var(--text-2);
    transition: transform 0.16s var(--ease), background 0.16s var(--ease);
}

.switch input:checked + .switch__track {
    background: var(--gold-soft);
    border-color: var(--gold-line);
}

.switch input:checked + .switch__track::after {
    transform: translateX(18px);
    background: var(--gold);
}

.switch input:focus-visible + .switch__track {
    outline: 2px solid var(--gold);
    outline-offset: 2px;
}

.section-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 14px;
}

.section-head__title {
    display: flex;
    align-items: center;
    gap: 9px;
    font-size: 1.06rem;
    font-weight: 800;
    letter-spacing: -0.02em;
}

.section-head__title svg {
    width: 17px;
    height: 17px;
    color: var(--gold);
}

.eyebrow {
    font-size: 0.7rem;
    font-weight: 800;
    letter-spacing: 0.13em;
    text-transform: uppercase;
    color: var(--gold);
}

.site-header {
    position: sticky;
    top: 0;
    z-index: 60;
    height: var(--header-h);
    background: color-mix(in srgb, var(--ink) 86%, transparent);
    backdrop-filter: saturate(1.4) blur(14px);
    -webkit-backdrop-filter: saturate(1.4) blur(14px);
    border-bottom: 1px solid var(--line);
}

.site-header--minimal {
    position: relative;
    top: auto;
    background: transparent;
    border-bottom: 0;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}

@supports not (background: color-mix(in srgb, red 50%, blue)) {
    .site-header {
        background: var(--ink);
    }

    .site-header--minimal {
        background: transparent;
    }
}

.site-header__inner {
    height: 100%;
    display: flex;
    align-items: center;
    gap: 14px;
}

.site-header--minimal .site-header__inner {
    justify-content: center;
}

.site-header--minimal .brand {
    margin-inline: auto;
}

.brand {
    display: flex;
    align-items: center;
    gap: 8px;
    font-weight: 900;
    font-size: 1.02rem;
    letter-spacing: -0.03em;
    flex-shrink: 0;
}

.brand__image {
    display: block;
    width: auto;
    max-width: min(calc(var(--brand-logo-height, 46px) * 4), 52vw);
    max-height: calc(var(--header-h) - 12px);
    height: var(--brand-logo-height, 46px);
    object-fit: contain;
}

.brand__mark {
    width: 26px;
    height: 26px;
    flex-shrink: 0;
}

.brand__lol {
    color: var(--gold);
}

.nav {
    display: flex;
    align-items: center;
    gap: 2px;
    margin-left: 6px;
}

.nav__link {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 7px 11px;
    font-size: 0.84rem;
    font-weight: 600;
    color: var(--text-2);
    border-radius: 11px;
    transition: color 0.14s var(--ease), background 0.14s var(--ease);
}

.flag-tr {
    width: 18px;
    height: 12px;
    border-radius: 2px;
    flex-shrink: 0;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.08);
}

.nav__link:hover {
    color: var(--text);
    background: var(--surface-2);
}

.nav__link.is-active {
    color: var(--text);
    background: var(--surface-2);
    font-weight: 700;
}

.header-tools {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-left: auto;
}

.site-header .header-tools .chip {
    min-height: 36px;
    padding: 0 13px;
    gap: 7px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--surface-2) 92%, transparent);
    border-color: color-mix(in srgb, var(--line-strong) 74%, transparent);
    box-shadow: 0 2px 7px rgba(0, 0, 0, 0.05);
    font-size: 0.78rem;
}

.site-header .header-tools .btn {
    min-height: 36px;
    padding: 0 14px;
    gap: 8px;
    border-radius: 13px;
    border-color: color-mix(in srgb, var(--line-strong) 78%, transparent);
    font-size: 0.8rem;
    font-weight: 750;
    transition: transform 0.18s var(--ease), box-shadow 0.18s var(--ease), background 0.18s var(--ease), border-color 0.18s var(--ease), color 0.18s var(--ease);
}

.site-header .header-tools .btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 5px 13px rgba(0, 0, 0, 0.08);
}

.site-header .header-tools .btn--icon {
    width: 36px;
    min-width: 36px;
    padding: 0;
    border-radius: 13px;
}

.site-header .header-tools .btn svg {
    width: 17px;
    height: 17px;
}

.site-header .header-tools .btn--gold {
    min-height: 38px;
    padding-inline: 16px;
    background: var(--text-accent);
    border-color: color-mix(in srgb, var(--text-accent) 70%, #111);
    color: var(--accent-ink);
    box-shadow: 0 5px 12px color-mix(in srgb, var(--text-accent) 22%, transparent);
}

.site-header .header-tools .btn--gold:hover {
    background: color-mix(in srgb, var(--text-accent) 86%, #fff);
    border-color: var(--text-accent);
    color: var(--accent-ink);
    box-shadow: 0 7px 16px color-mix(in srgb, var(--text-accent) 29%, transparent);
}

.site-header .header-tools .live-dot {
    width: 8px;
    height: 8px;
}

.live-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--mint);
    box-shadow: 0 0 0 0 rgba(46, 174, 123, 0.6);
    animation: pulse 2.4s infinite;
    flex-shrink: 0;
}

@keyframes pulse {
    0% { box-shadow: 0 0 0 0 rgba(46, 174, 123, 0.55); }
    70% { box-shadow: 0 0 0 7px rgba(46, 174, 123, 0); }
    100% { box-shadow: 0 0 0 0 rgba(46, 174, 123, 0); }
}

.ticker {
    border-bottom: 1px solid var(--line);
    background: var(--ink-2);
}

.ticker__inner {
    display: flex;
    align-items: center;
    gap: 0;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    scrollbar-width: none;
    height: 38px;
    min-width: 0;
    max-width: 100%;
}

.ticker__inner::-webkit-scrollbar {
    display: none;
}

.ticker__item {
    display: flex;
    align-items: baseline;
    gap: 6px;
    padding-inline: 14px;
    font-size: 0.76rem;
    white-space: nowrap;
    border-right: 1px solid var(--line);
    height: 100%;
    align-items: center;
}

.ticker__item:first-child {
    padding-left: 0;
}

.ticker__item:last-child {
    border-right: 0;
}

.ticker__value {
    font-family: var(--mono);
    font-weight: 700;
    font-size: 0.83rem;
    color: var(--text);
    font-variant-numeric: tabular-nums;
}

.ticker__label {
    color: var(--text-3);
    font-weight: 600;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    font-size: 0.66rem;
}

.ticker__value--gold { color: var(--gold); }
.ticker__value--mint { color: var(--mint); }

.announce {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 8px 16px;
    background: var(--gold-soft);
    border-bottom: 1px solid var(--gold-line);
    color: var(--gold);
    font-size: 0.81rem;
    font-weight: 600;
    text-align: center;
}

.site-footer {
    margin-top: auto;
    border-top: 1px solid var(--line);
    background: var(--ink-2);
    padding: 34px 0 26px;
}

.footer-grid {
    display: grid;
    grid-template-columns: 1.6fr 1fr 1fr 1fr;
    gap: 30px;
    padding-bottom: 26px;
    border-bottom: 1px solid var(--line);
}

.footer-col__title {
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--text-3);
    margin-bottom: 11px;
}

.footer-col__links {
    display: flex;
    flex-direction: column;
    gap: 8px;
    list-style: none;
}

.footer-col__links a {
    font-size: 0.85rem;
    color: var(--text-2);
    transition: color 0.14s var(--ease);
}

.footer-col__links a:hover {
    color: var(--gold);
}

.footer-payment-trust {
    display: flex;
    align-items: center;
    gap: 9px;
    width: fit-content;
    max-width: 100%;
    margin-top: 14px;
    margin-left: auto;
    padding: 7px 10px;
    color: var(--text-2);
    background: color-mix(in srgb, var(--surface) 94%, var(--gold));
    border: 1px solid var(--line);
    border-radius: 999px;
}

.footer-payment-trust__icon {
    display: grid;
    flex: 0 0 26px;
    width: 26px;
    height: 26px;
    place-items: center;
    color: var(--gold);
    background: var(--gold-soft);
    border-radius: 50%;
}

.footer-payment-trust__icon .ico {
    width: 14px;
    height: 14px;
}

.footer-payment-trust strong {
    color: var(--text);
    font-weight: 800;
}

.footer-payment-trust p {
    color: var(--text-3);
    font-size: 0.72rem;
    line-height: 1.25;
    white-space: nowrap;
}

.footer-payment-trust__provider {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    margin-left: 3px;
    padding-left: 10px;
    border-left: 1px solid var(--line);
}

.footer-payment-trust__provider img {
    display: block;
    width: 64px;
    height: auto;
}

.footer-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
    padding-top: 20px;
    font-size: 0.79rem;
    color: var(--text-3);
}

.x-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 11px;
    border: 1px solid var(--line-strong);
    border-radius: 999px;
    font-weight: 700;
    font-size: 0.79rem;
    color: var(--text-2);
    transition: color 0.15s var(--ease), border-color 0.15s var(--ease), background 0.15s var(--ease);
}

.x-link:hover {
    color: var(--text);
    border-color: var(--gold-line);
    background: var(--gold-soft);
}

.x-link svg {
    width: 13px;
    height: 13px;
}

.maker-badge {
    position: fixed;
    right: max(18px, env(safe-area-inset-right));
    bottom: max(18px, env(safe-area-inset-bottom));
    z-index: 50;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    min-height: 48px;
    padding: 5px 6px 5px 15px;
    color: var(--text);
    background: color-mix(in srgb, var(--surface) 92%, transparent);
    border: 1px solid var(--line-strong);
    border-radius: 999px;
    box-shadow: var(--shadow);
    -webkit-backdrop-filter: blur(16px) saturate(135%);
    backdrop-filter: blur(16px) saturate(135%);
    transition: transform 0.18s var(--ease), border-color 0.18s var(--ease), box-shadow 0.18s var(--ease);
}

.maker-badge:hover {
    color: var(--text);
    border-color: var(--gold-line);
    box-shadow: var(--shadow-lg);
    transform: translateY(-2px);
}

.maker-badge:focus-visible {
    outline: 3px solid var(--gold-line);
    outline-offset: 3px;
}

.maker-badge__copy {
    display: flex;
    align-items: baseline;
    gap: 5px;
    white-space: nowrap;
    font-size: 0.8rem;
}

.maker-badge__label {
    color: var(--text-2);
    font-weight: 600;
}

.maker-badge__copy strong {
    color: var(--text-accent);
    font-weight: 800;
}

.maker-badge__avatar {
    position: relative;
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
}

.maker-badge__avatar > img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border: 2px solid var(--surface);
    border-radius: 50%;
    background: var(--surface-3);
}

.maker-badge__x {
    position: absolute;
    right: -2px;
    bottom: -2px;
    display: grid;
    width: 15px;
    height: 15px;
    place-items: center;
    color: var(--ink-2);
    background: var(--text);
    border: 2px solid var(--surface);
    border-radius: 50%;
}

.maker-badge__x svg {
    width: 7px;
    height: 7px;
}

.analytics-consent {
    position: fixed;
    z-index: 120;
    right: 18px;
    bottom: 18px;
    width: min(440px, calc(100vw - 36px));
    padding: 15px 16px;
    display: flex;
    align-items: flex-end;
    gap: 14px;
    color: var(--text);
    background: color-mix(in srgb, var(--surface) 96%, transparent);
    border: 1px solid var(--line-strong);
    border-radius: 16px;
    box-shadow: var(--shadow-lg);
    -webkit-backdrop-filter: blur(18px);
    backdrop-filter: blur(18px);
}
.analytics-consent > div:first-child { min-width: 0; flex: 1; }
.analytics-consent strong { display: block; font-size: .82rem; }
.analytics-consent p { margin-top: 4px; color: var(--text-3); font-size: .7rem; line-height: 1.45; }
.analytics-consent .btn { white-space: nowrap; }

.hero {
    position: relative;
    padding: 40px 0 26px;
    overflow: hidden;
}

.hero::before {
    content: "";
    position: absolute;
    top: -180px;
    left: 50%;
    transform: translateX(-50%);
    width: 780px;
    height: 340px;
    background: radial-gradient(ellipse at center, var(--gold-soft) 0%, transparent 68%);
    pointer-events: none;
    z-index: -1;
}

.hero__inner {
    display: grid;
    grid-template-columns: 1.35fr 1fr;
    gap: 34px;
    align-items: center;
}

.hero h1 {
    margin-bottom: 12px;
}

.hero h1 .accent {
    color: var(--gold);
}

.hero__lead {
    font-size: 1rem;
    color: var(--text-2);
    max-width: 52ch;
    margin-bottom: 20px;
}

.hero__lead-emphasis {
    text-decoration-line: underline;
    text-decoration-color: var(--gold);
    text-decoration-thickness: 2px;
    text-underline-offset: 3px;
}

.hero__actions {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    margin-bottom: 16px;
}

.hero__by {
    font-size: 0.79rem;
    color: var(--text-3);
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
}

.hero__by a {
    color: var(--gold);
    font-weight: 700;
}

.hero__by a:hover {
    text-decoration: underline;
}

.podium {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.podium__item {
    display: flex;
    align-items: center;
    gap: 11px;
    padding: 11px 13px;
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    transition: border-color 0.16s var(--ease), transform 0.16s var(--ease);
}

.podium__item:hover {
    border-color: var(--gold-line);
    transform: translateX(3px);
}

.podium__rank {
    display: grid;
    place-items: center;
    width: 27px;
    height: 27px;
    border-radius: 8px;
    font-family: var(--mono);
    font-size: 0.8rem;
    font-weight: 800;
    background: var(--surface-3);
    color: var(--text-2);
    flex-shrink: 0;
}

.podium__item:nth-child(1) .podium__rank {
    background: var(--gold);
    color: var(--accent-ink);
}

.podium__item:nth-child(2) .podium__rank {
    background: var(--surface-3);
    color: var(--text);
}

.podium__item:nth-child(3) .podium__rank {
    background: var(--surface-2);
    color: var(--text-2);
}

.podium__name {
    font-weight: 700;
    font-size: 0.92rem;
}

.podium__meta {
    font-size: 0.73rem;
    color: var(--text-3);
}

.podium__votes {
    margin-left: auto;
    text-align: right;
    flex-shrink: 0;
}

.podium__votes b {
    display: block;
    font-family: var(--mono);
    font-size: 1rem;
    font-weight: 800;
    color: var(--gold);
    line-height: 1.1;
}

.podium__votes span {
    font-size: 0.66rem;
    color: var(--text-3);
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.board {
    display: grid;
    grid-template-columns: minmax(0, 1.18fr) minmax(0, 1fr);
    gap: 18px;
    align-items: start;
    padding-bottom: 44px;
}

.board-main {
    display: flex;
    flex-direction: column;
    gap: 12px;
    min-width: 0;
    position: sticky;
    top: calc(var(--header-h) + 12px);
    z-index: 2;
}

.map-panel {
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--radius-lg);
    overflow: hidden;
    min-width: 0;
}

.region-bar {
    display: grid;
    grid-template-columns: 126px minmax(0, 1fr) 46px 44px;
    align-items: center;
    gap: 10px;
    padding: 3px 0;
    transition: color 0.14s var(--ease);
}

.region-bar:hover {
    color: var(--gold);
}

.region-bar__name {
    font-size: 0.79rem;
    font-weight: 600;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.region-bar__track {
    position: relative;
    height: 6px;
    border-radius: 999px;
    background: var(--surface-3);
    overflow: hidden;
}

.region-bar__track span {
    position: absolute;
    inset: 0 auto 0 0;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--gold-2), var(--gold));
}

.region-bar__value {
    font-size: 0.81rem;
    font-weight: 700;
    text-align: right;
    font-variant-numeric: tabular-nums;
}

.region-bar__share {
    font-size: 0.72rem;
    text-align: right;
    font-variant-numeric: tabular-nums;
}

.map-panel__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 12px 15px;
    border-bottom: 1px solid var(--line);
    flex-wrap: wrap;
}

.map-legend {
    display: flex;
    align-items: center;
    gap: 7px;
    font-size: 0.68rem;
    color: var(--text-3);
    font-weight: 600;
    letter-spacing: 0.03em;
}

.map-legend__bar {
    width: 88px;
    height: 8px;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--heat-1), var(--heat-5), var(--heat-9));
    border: 1px solid var(--line);
}

.map-wrap {
    position: relative;
    padding: 6px 10px 12px;
    overflow: hidden;
    isolation: isolate;
}

.map-zoom-stage {
    width: 100%;
    min-width: 0;
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    transition: width .22s var(--ease);
}

.map-zoom-stage .tr-map {
    display: block;
    flex: 0 0 auto;
}

.map-controls {
    position: absolute;
    z-index: 4;
    top: 18px;
    left: 18px;
    width: 46px;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    padding: 4px;
    background: color-mix(in srgb, var(--surface) 93%, transparent);
    border: 1px solid var(--line);
    border-radius: 16px;
    box-shadow: var(--shadow-md);
    backdrop-filter: blur(10px);
}

.map-control {
    display: grid;
    place-items: center;
    width: 36px;
    height: 36px;
    padding: 0;
    color: var(--text);
    background: transparent;
    border: 0;
    border-radius: 11px;
    cursor: pointer;
    transition: color .15s var(--ease), background .15s var(--ease), opacity .15s var(--ease);
}

.map-control + .map-control { border-top: 1px solid var(--line); border-radius: 0 0 10px 10px; }
.map-control:first-child { border-radius: 10px 10px 0 0; }
.map-control:hover { color: var(--text-accent); background: var(--gold-soft); }
.map-control:focus-visible { outline: 2px solid var(--text-accent); outline-offset: -2px; }
.map-control:disabled { opacity: .38; cursor: not-allowed; }
.map-control .ico { width: 20px; height: 20px; }

.map-control--fullscreen {
    position: absolute;
    z-index: 4;
    right: 18px;
    bottom: 18px;
    width: 42px;
    height: 42px;
    background: color-mix(in srgb, var(--surface) 93%, transparent);
    border: 1px solid var(--line);
    border-radius: 13px;
    box-shadow: var(--shadow-md);
    backdrop-filter: blur(10px);
}

.map-control--fullscreen:hover { background: var(--gold-soft); }

.tr-map {
    width: 100%;
    height: auto;
    overflow: visible;
}

.tr-city path {
    fill: var(--heat-0);
    stroke: var(--map-line);
    stroke-width: 0.7;
    stroke-linejoin: round;
    transition: fill 0.2s var(--ease);
}

.tr-city.heat-0 path { fill: var(--heat-0); }
.tr-city.heat-1 path { fill: var(--heat-1); }
.tr-city.heat-2 path { fill: var(--heat-2); }
.tr-city.heat-3 path { fill: var(--heat-3); }
.tr-city.heat-4 path { fill: var(--heat-4); }
.tr-city.heat-5 path { fill: var(--heat-5); }
.tr-city.heat-6 path { fill: var(--heat-6); }
.tr-city.heat-7 path { fill: var(--heat-7); }
.tr-city.heat-8 path { fill: var(--heat-8); }
.tr-city.heat-9 path { fill: var(--heat-9); }

.tr-city {
    cursor: pointer;
    outline: none;
}

.tr-city:hover path,
.tr-city:focus-visible path,
.tr-city.is-active path {
    fill: var(--heat-9);
    stroke: var(--text);
    stroke-width: 1;
}

.tr-city.is-voted path {
    stroke: var(--mint);
    stroke-width: 1.4;
}

.tr-city.is-highlight path {
    fill: var(--heat-9);
    stroke: var(--map-line);
    stroke-width: 1.1;
}

.tr-city.is-owned path {
    stroke-dasharray: none;
}

.tr-map__label {
    font-family: var(--mono);
    font-size: 5.4px;
    font-weight: 700;
    fill: var(--text-3);
    text-anchor: middle;
    pointer-events: none;
    user-select: none;
}

[data-theme="light"] .tr-map__label {
    fill: rgba(20, 22, 28, 0.45);
}

.tr-map--mini .tr-city path {
    stroke-width: 0.5;
    opacity: 0.72;
}

.tr-map--mini .tr-city.is-highlight path {
    fill: var(--text-accent);
    stroke: var(--text);
    stroke-width: 2;
    opacity: 1;
    filter: drop-shadow(0 3px 5px color-mix(in srgb, var(--text-accent) 45%, transparent));
}

.tr-map__focus {
    pointer-events: none;
}

.tr-map__focus-ring {
    fill: color-mix(in srgb, var(--text-accent) 13%, transparent);
    stroke: var(--text-accent);
    stroke-width: 2;
    vector-effect: non-scaling-stroke;
}

.tr-map__focus-dot {
    fill: var(--surface);
    stroke: var(--text-accent);
    stroke-width: 2;
    vector-effect: non-scaling-stroke;
}

.tr-map--mini {
    max-height: 190px;
}

.map-tip {
    position: fixed;
    z-index: 20;
    width: min(276px, calc(100vw - 24px));
    min-width: min(208px, calc(100vw - 24px));
    max-width: 276px;
    max-height: calc(100dvh - 24px);
    padding: 11px 13px;
    background: var(--surface-2);
    border: 1px solid var(--line-strong);
    border-radius: var(--radius);
    box-shadow: var(--shadow-lg);
    pointer-events: none;
    opacity: 0;
    overflow: visible;
    transform: scale(0.97);
    transition: opacity 0.13s var(--ease), transform 0.13s var(--ease);
}

.map-tip.is-open {
    opacity: 1;
    transform: scale(1);
    pointer-events: none;
}

.map-tip.is-open.is-below {
    transform: scale(1);
}

.map-tip.is-interactive {
    pointer-events: none;
}

.map-tip__head {
    display: flex;
    align-items: center;
    gap: 7px;
    margin-bottom: 7px;
}

.map-tip__name {
    font-weight: 800;
    font-size: 0.92rem;
}

.map-tip__stats {
    display: flex;
    gap: 14px;
    margin-bottom: 9px;
    font-size: 0.73rem;
    color: var(--text-3);
}

.map-tip__stats b {
    display: block;
    font-family: var(--mono);
    font-size: 0.9rem;
    color: var(--text);
}

.map-tip__reis {
    display: flex;
    align-items: center;
    gap: 7px;
    padding: 7px 9px;
    background: var(--gold-soft);
    border: 1px solid var(--gold-line);
    border-radius: var(--radius-xs);
    margin-bottom: 9px;
    font-size: 0.76rem;
    min-width: 0;
}

.map-tip__reis img {
    width: 15px;
    height: 15px;
    border-radius: 3px;
    flex-shrink: 0;
    object-fit: cover;
}

.map-tip__actions {
    display: flex;
    gap: 6px;
}

.tr-map__markers,
.map-reis-marker {
    pointer-events: none;
}

.map-reis-marker {
    opacity: 0.96;
    filter: drop-shadow(0 5px 8px rgba(0, 0, 0, 0.34));
    transition: opacity 0.18s var(--ease), filter 0.18s var(--ease);
}

.map-reis-marker.is-active {
    opacity: 1;
    filter: drop-shadow(0 7px 11px color-mix(in srgb, var(--marker-accent) 48%, rgba(0, 0, 0, 0.3)));
}

.map-reis-marker__halo {
    fill: var(--marker-halo);
}

.map-reis-marker__ring {
    fill: var(--marker-accent);
    stroke: color-mix(in srgb, var(--marker-accent) 58%, var(--text));
    stroke-width: 0.8;
}

.map-reis-marker__face {
    fill: #fff;
    stroke: rgba(255, 255, 255, 0.92);
    stroke-width: 1.2;
}

.map-reis-marker__image {
    clip-path: circle(12.5px at 12.5px 12.5px);
}

.map-reis-marker__monogram {
    fill: #111;
    font-family: var(--font);
    font-size: 11px;
    font-weight: 900;
    text-anchor: middle;
}

.map-reis-marker__crown {
    fill: var(--marker-accent);
    stroke: color-mix(in srgb, var(--marker-accent-2) 72%, #111);
    stroke-width: 0.8;
    stroke-linejoin: round;
}

.map-tip {
    width: min(268px, calc(100vw - 24px));
    min-width: min(220px, calc(100vw - 24px));
    max-width: 268px;
    padding: 12px 14px 11px;
    background: linear-gradient(145deg, color-mix(in srgb, var(--surface) 97%, transparent), color-mix(in srgb, var(--gold-soft) 34%, var(--surface)));
    border: 1px solid color-mix(in srgb, var(--gold) 24%, var(--line-strong));
    border-radius: 18px;
    box-shadow: 0 18px 48px rgba(34, 24, 18, 0.17), 0 3px 10px rgba(34, 24, 18, 0.08);
    backdrop-filter: blur(20px) saturate(140%);
    -webkit-backdrop-filter: blur(20px) saturate(140%);
    transform: translateY(5px) scale(0.97);
    transition: opacity 0.16s var(--ease), transform 0.2s var(--ease);
}

.map-tip::before {
    content: "";
    position: absolute;
    inset: 0 18px auto;
    height: 2px;
    border-radius: 999px;
    background: linear-gradient(90deg, transparent, var(--gold), transparent);
    opacity: .7;
    pointer-events: none;
}

.map-tip.is-open {
    transform: translateY(0) scale(1);
}

.map-tip__head {
    margin: 0;
    gap: 8px;
}

.map-tip__head .plate {
    width: 34px;
    min-width: 34px;
    height: 32px;
    padding: 0;
    display: grid;
    place-items: center;
    border-radius: 10px;
    background: color-mix(in srgb, var(--gold-soft) 80%, var(--surface));
    border-color: color-mix(in srgb, var(--gold) 34%, var(--line));
    color: var(--text-accent);
    font-size: .8rem;
    letter-spacing: .03em;
}

.map-tip__name {
    font-size: 1rem;
    font-weight: 850;
    letter-spacing: -.025em;
}

.map-tip__foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-top: 10px;
    padding-top: 9px;
    border-top: 1px solid color-mix(in srgb, var(--line) 78%, transparent);
}

.map-tip__votes {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: var(--text-2);
    font-size: 0.78rem;
}

.map-tip__votes .ico {
    width: 14px;
    color: var(--gold);
}

.map-tip__select {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 6px 8px;
    border: 1px solid color-mix(in srgb, var(--gold) 22%, var(--line));
    border-radius: 999px;
    background: var(--gold-soft);
    color: var(--text-accent);
    font-size: 0.76rem;
    font-weight: 800;
    line-height: 1;
}

.map-tip__select svg {
    width: 14px;
    height: 14px;
}

.city-sheet-backdrop {
    position: fixed;
    inset: 0;
    z-index: 90;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 22px;
    background: rgba(5, 5, 7, 0.42);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.22s var(--ease), visibility 0.22s var(--ease);
}

.city-sheet-backdrop.is-open {
    opacity: 1;
    visibility: visible;
}

.city-sheet {
    width: min(430px, 100%);
    min-width: 0;
    max-height: calc(100dvh - 44px);
    overflow-x: hidden;
    overflow-y: auto;
    background: color-mix(in srgb, var(--surface) 96%, transparent);
    border: 1px solid color-mix(in srgb, var(--gold) 26%, var(--line-strong));
    border-radius: 28px;
    box-shadow: 0 28px 90px rgba(0, 0, 0, 0.4);
    transform: translateY(20px) scale(0.985);
    opacity: 0;
    transition: transform 0.24s var(--ease), opacity 0.2s var(--ease);
}

.city-sheet-backdrop.is-open .city-sheet {
    transform: translateY(0) scale(1);
    opacity: 1;
}

.city-sheet__head {
    display: flex;
    align-items: center;
    gap: 13px;
    min-width: 0;
    padding: 22px 22px 18px;
    border-bottom: 1px solid var(--line);
}

.city-sheet__plate {
    display: grid;
    place-items: center;
    width: 50px;
    height: 46px;
    flex: 0 0 50px;
    border-radius: 15px;
    background: var(--gold-soft);
    border: 1px solid var(--gold-line);
    color: var(--text-accent);
    font-family: var(--mono);
    font-size: 1rem;
    font-weight: 900;
}

.city-sheet__title-row {
    display: flex;
    align-items: center;
    min-width: 0;
    gap: 10px;
}

.city-sheet__title-row h2 {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 1.42rem;
    line-height: 1.1;
    letter-spacing: -0.035em;
}

.city-sheet__rank {
    color: var(--text-3);
    font-family: var(--mono);
    font-weight: 800;
}

.city-sheet__tagline {
    margin-top: 5px;
    color: var(--text-3);
    font-size: 0.82rem;
}

.city-sheet__close {
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    margin-left: auto;
    flex: 0 0 42px;
    border-radius: 50%;
    background: var(--surface-2);
    color: var(--text-3);
    transition: background 0.16s var(--ease), color 0.16s var(--ease), transform 0.16s var(--ease);
}

.city-sheet__close:hover {
    background: var(--surface-3);
    color: var(--text);
    transform: rotate(4deg);
}

.city-sheet__close svg {
    width: 18px;
    height: 18px;
}

.city-sheet__body {
    display: grid;
    gap: 16px;
    min-width: 0;
    padding: 18px 22px 22px;
}

.city-sheet__quick {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-width: 0;
    flex-wrap: wrap;
    gap: 10px;
}

.city-sheet__quick button,
.city-sheet__quick a {
    display: inline-flex;
    align-items: center;
    min-width: 0;
    max-width: 100%;
    gap: 6px;
    min-height: 34px;
    color: var(--text-2);
    font-size: 0.8rem;
    font-weight: 750;
}

.city-sheet__detail {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.city-sheet__detail .ico {
    flex: 0 0 auto;
}

.city-sheet__districts {
    padding: 6px 11px;
    border: 1px solid var(--gold-line);
    border-radius: 999px;
    background: var(--gold-soft);
    color: var(--text-accent) !important;
}

.city-sheet__quick .ico {
    width: 15px;
}

.city-sheet__stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    border-block: 1px solid var(--line);
}

.city-sheet__stats > div {
    display: grid;
    gap: 4px;
    padding: 14px 12px;
    text-align: center;
}

.city-sheet__stats > div + div {
    border-left: 1px solid var(--line);
}

.city-sheet__stats span {
    color: var(--text-3);
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.city-sheet__stats strong {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    font-family: var(--mono);
    font-size: 0.98rem;
}

.city-sheet__stats .ico {
    width: 15px;
    color: var(--gold);
}

.city-sheet__vote {
    border-radius: 16px;
    box-shadow: 0 10px 24px color-mix(in srgb, var(--gold) 19%, transparent);
}

.city-sheet__vote.is-voted {
    background: var(--surface-3);
    color: var(--text);
    box-shadow: none;
}

.city-sheet__reis,
.city-sheet__empty {
    min-width: 0;
    padding: 17px;
    border: 1px solid var(--gold-line);
    border-radius: 20px;
    background: linear-gradient(145deg, var(--gold-soft), color-mix(in srgb, var(--surface-2) 92%, transparent));
}

.city-sheet__reis {
    display: grid;
    gap: 13px;
}

.city-sheet__reis-top,
.city-sheet__profile {
    display: flex;
    align-items: center;
    min-width: 0;
    gap: 11px;
}

.city-sheet__reis-label {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--text-accent);
    font-size: 0.72rem;
    font-weight: 850;
    letter-spacing: 0.055em;
    text-transform: uppercase;
}

.city-sheet__reis-label .ico {
    width: 15px;
}

.city-sheet__reis-price {
    margin-left: auto;
    padding: 5px 9px;
    border: 1px solid var(--line);
    border-radius: 9px;
    background: var(--surface);
    font-family: var(--mono);
}

.city-sheet__profile img,
.city-sheet__avatar-fallback {
    width: 46px;
    height: 46px;
    flex: 0 0 46px;
    border-radius: 13px;
    object-fit: cover;
    background: var(--surface);
    border: 1px solid var(--line);
}

.city-sheet__avatar-fallback {
    display: grid;
    place-items: center;
    color: var(--gold);
}

.city-sheet__avatar-fallback .ico {
    width: 21px;
}

.city-sheet__profile h3 {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 1rem;
}

.city-sheet__profile p {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin-top: 3px;
    color: var(--text-3);
    font-size: 0.77rem;
    line-height: 1.35;
}

.city-sheet__take {
    border-color: var(--gold-line);
    color: var(--text-accent);
}

.city-sheet__empty {
    display: flex;
    align-items: center;
    gap: 12px;
}

.city-sheet__empty-icon {
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    flex: 0 0 44px;
    border-radius: 13px;
    background: var(--surface);
    color: var(--gold);
}

.city-sheet__empty-icon .ico {
    width: 20px;
}

.city-sheet__empty p {
    margin-top: 3px;
    color: var(--text-3);
    font-size: 0.76rem;
}

.city-sheet__empty .btn {
    margin-left: auto;
    white-space: nowrap;
}

.board-tabs {
    display: none;
    gap: 4px;
    padding: 4px;
    margin-bottom: 14px;
    background: var(--surface-2);
    border: 1px solid var(--line);
    border-radius: var(--radius);
}

.board-tabs button {
    flex: 1;
    padding: 8px;
    font-size: 0.83rem;
    font-weight: 700;
    color: var(--text-2);
    border-radius: var(--radius-xs);
    transition: background 0.15s var(--ease), color 0.15s var(--ease);
}

.board-tabs button.is-active {
    background: var(--surface);
    color: var(--text);
    box-shadow: var(--shadow-sm);
}

.board-side {
    display: flex;
    flex-direction: column;
    gap: 12px;
    min-width: 0;
}

.filters {
    display: flex;
    flex-direction: column;
    gap: 9px;
    min-width: 0;
}

.search-box {
    position: relative;
}

.search-box svg {
    position: absolute;
    left: 11px;
    top: 50%;
    transform: translateY(-50%);
    width: 15px;
    height: 15px;
    color: var(--text-3);
    pointer-events: none;
}

.search-box .input {
    padding-left: 33px;
}

.region-tabs {
    display: flex;
    gap: 5px;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    scrollbar-width: none;
    padding-bottom: 2px;

    /* Kaydırma kapsayıcısının min-content genişliği ebeveyni büyütmesin */
    min-width: 0;
    max-width: 100%;

    /* Sağ kenarda soluklaşma: şeridin kaydırılabilir olduğunu belli eder */
    -webkit-mask-image: linear-gradient(90deg, #000 0, #000 calc(100% - 28px), transparent 100%);
    mask-image: linear-gradient(90deg, #000 0, #000 calc(100% - 28px), transparent 100%);
}

.region-tabs::-webkit-scrollbar {
    display: none;
}

.region-tabs a,
.region-tabs button {
    padding: 5px 10px;
    font-size: 0.76rem;
    font-weight: 600;
    color: var(--text-2);
    background: var(--surface-2);
    border: 1px solid transparent;
    border-radius: 999px;
    white-space: nowrap;
    transition: all 0.14s var(--ease);
}

.region-tabs a:hover,
.region-tabs button:hover {
    color: var(--text);
    border-color: var(--line);
}

.region-tabs a.is-active,
.region-tabs button.is-active {
    background: var(--gold-soft);
    border-color: var(--gold-line);
    color: var(--gold);
    font-weight: 700;
}

.city-list {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 12px;
}

.city-row {
    position: relative;
    display: grid;
    grid-template-columns: 30px minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    padding: 12px 14px;
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    transition: border-color 0.16s var(--ease), background 0.16s var(--ease), box-shadow 0.16s var(--ease);
}

.city-row:hover {
    border-color: var(--line-strong);
    background: var(--surface-2);
    box-shadow: var(--shadow-sm);
}

.city-row.is-voted {
    border-color: var(--mint);
    background: var(--mint-soft);
}

.city-row.is-top {
    border-color: var(--gold-line);
}

.city-row__rank {
    display: grid;
    place-items: center;
    width: 30px;
    height: 30px;
    border-radius: 9px;
    font-family: var(--mono);
    font-size: 0.79rem;
    font-weight: 800;
    background: var(--surface-3);
    color: var(--text-2);
    border: 1px solid var(--line);
}

.city-row.is-top:nth-child(1) .city-row__rank,
.city-row__rank.rank-1 {
    background: var(--gold);
    color: var(--accent-ink);
    border-color: var(--gold-2);
}

.city-row__rank.rank-2 {
    background: var(--surface-3);
    color: var(--text);
    border-color: var(--line-strong);
}

.city-row__rank.rank-3 {
    background: var(--surface-2);
    color: var(--text-2);
    border-color: var(--line);
}

.city-row__main {
    min-width: 0;
}

.city-row__title {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 2px;
}

.city-row__name {
    font-weight: 700;
    font-size: 0.93rem;
    letter-spacing: -0.01em;
    transition: color 0.14s var(--ease);
}

.city-row__name:hover {
    color: var(--gold);
}

.city-row__bar {
    position: relative;
    height: 3px;
    border-radius: 999px;
    background: var(--surface-3);
    overflow: hidden;
    margin: 4px 0 6px;
}

.city-row__bar span {
    position: absolute;
    inset: 0 auto 0 0;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--gold-2), var(--gold));
    transition: width 0.5s var(--ease);
}

.city-row.is-voted .city-row__bar span {
    background: var(--mint);
}

.city-row__sub {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.74rem;
    color: var(--text-3);
    min-width: 0;
}

.city-row__reis-label {
    flex: 0 0 auto;
    color: var(--text-2);
    font-size: .64rem;
    font-weight: 850;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.city-row__reis {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    min-width: 0;
    max-width: 100%;
    color: var(--gold);
    font-weight: 700;
}

.city-row__reis img {
    width: 13px;
    height: 13px;
    border-radius: 3px;
    object-fit: cover;
    flex-shrink: 0;
    background: var(--surface-3);
}

.city-row__reis:hover {
    text-decoration: underline;
}

.city-row__aside {
    display: flex;
    align-items: center;
    gap: 8px;
}

.city-row__votes {
    text-align: right;
    min-width: 46px;
}

.city-row__votes b {
    display: block;
    font-family: var(--mono);
    font-size: 0.95rem;
    font-weight: 800;
    line-height: 1.1;
    font-variant-numeric: tabular-nums;
}

.city-row__votes span {
    font-size: 0.63rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--text-3);
}

.vote-btn {
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    border-radius: var(--radius-xs);
    border: 1px solid var(--line-strong);
    background: var(--surface-2);
    color: var(--text-2);
    transition: all 0.15s var(--ease);
    flex-shrink: 0;
}

.vote-btn svg {
    width: 16px;
    height: 16px;
}

.vote-btn:hover {
    border-color: var(--mint);
    color: var(--mint);
    background: var(--mint-soft);
}

.vote-btn.is-voted {
    border-color: var(--mint);
    background: var(--mint);
    color: var(--accent-ink);
}

.vote-btn:disabled {
    opacity: 0.45;
    cursor: not-allowed;
}

.reis-btn {
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    border-radius: var(--radius-xs);
    border: 1px solid var(--gold-line);
    background: var(--gold-soft);
    color: var(--gold);
    transition: all 0.15s var(--ease);
    flex-shrink: 0;
}

.reis-btn svg {
    width: 15px;
    height: 15px;
}

.reis-btn:hover {
    background: var(--gold);
    color: var(--accent-ink);
    border-color: var(--gold);
}

.list-divider {
    display: flex;
    align-items: center;
    gap: 11px;
    padding: 6px 2px;
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--text-3);
}

.list-divider::before,
.list-divider::after {
    content: "";
    flex: 1;
    height: 1px;
    background: var(--line);
}

.empty {
    padding: 34px 20px;
    text-align: center;
    color: var(--text-3);
    font-size: 0.88rem;
}

.empty svg {
    width: 30px;
    height: 30px;
    margin: 0 auto 10px;
    color: var(--line-strong);
}

.city-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
}

.city-card {
    display: flex;
    flex-direction: column;
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--radius-lg);
    padding: 18px 20px 16px;
    transition: border-color 0.16s var(--ease), box-shadow 0.16s var(--ease);
}

.city-card:hover {
    border-color: var(--line-strong);
    box-shadow: var(--shadow);
}

.city-card.is-voted {
    border-color: var(--mint);
    background: var(--mint-soft);
}

.city-card__head {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 14px;
    padding-bottom: 14px;
    border-bottom: 1px solid var(--line);
}

.city-card__name {
    font-weight: 800;
    font-size: 1.02rem;
    letter-spacing: -0.02em;
    transition: color 0.14s var(--ease);
}

.city-card__name:hover {
    color: var(--gold);
}

.city-card__price {
    margin-left: auto;
    font-weight: 800;
    font-size: 0.9rem;
    color: var(--text-2);
    flex-shrink: 0;
}

.city-card__reis {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin-bottom: 16px;
    flex: 1;
}

.city-card__reis img {
    width: 28px;
    height: 28px;
    border-radius: 7px;
    object-fit: cover;
    flex-shrink: 0;
    background: var(--surface-3);
    margin-top: 1px;
}

.city-card__reis-icon {
    display: grid;
    place-items: center;
    width: 28px;
    height: 28px;
    border-radius: 7px;
    background: var(--gold-soft);
    border: 1px solid var(--gold-line);
    color: var(--gold);
    flex-shrink: 0;
    margin-top: 1px;
}

.city-card__reis-icon .ico {
    width: 14px;
    height: 14px;
}

.city-card__reis-info {
    min-width: 0;
    flex: 1;
}

.city-card__reis-title {
    display: flex;
    align-items: center;
    gap: 4px;
    font-weight: 700;
    font-size: 0.88rem;
    color: var(--text);
    max-width: 100%;
}

.city-card__reis-title:hover {
    color: var(--gold);
}

.city-card__reis-title .ico {
    width: 10px;
    height: 10px;
    color: var(--text-3);
    flex-shrink: 0;
}

.city-card__reis-desc {
    font-size: 0.79rem;
    color: var(--text-3);
    line-height: 1.45;
    margin-top: 2px;
}

.city-card__empty {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 14px;
    background: var(--gold-soft);
    border: 1px dashed var(--gold-line);
    border-radius: var(--radius);
    margin-bottom: 16px;
    font-size: 0.82rem;
    color: var(--gold);
    font-weight: 600;
    flex: 1;
}

.city-card__empty-icon {
    display: grid;
    place-items: center;
    width: 28px;
    height: 28px;
    border-radius: 7px;
    background: var(--gold-soft);
    border: 1px solid var(--gold-line);
    color: var(--gold);
    flex-shrink: 0;
}

.city-card__empty-icon .ico {
    width: 14px;
    height: 14px;
}

.city-card__foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding-top: 12px;
    border-top: 1px solid var(--line);
    margin-top: auto;
}

.city-card__votes {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 0.78rem;
}

.city-card__votes .ico {
    width: 12px;
    height: 12px;
}

.city-card__votes b {
    font-family: var(--mono);
    font-weight: 700;
    color: var(--text-2);
    font-variant-numeric: tabular-nums;
}

.city-card__devral {
    font-size: 0.78rem;
    padding: 6px 12px;
}

.modal-backdrop {
    position: fixed;
    inset: 0;
    z-index: 100;
    display: grid;
    place-items: center;
    padding: 16px;
    background: rgba(4, 5, 7, 0.72);
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.18s var(--ease), visibility 0.18s var(--ease);
}

.modal-backdrop.is-open {
    opacity: 1;
    visibility: visible;
}

.modal {
    width: 100%;
    max-width: 480px;
    max-height: calc(100vh - 32px);
    display: flex;
    flex-direction: column;
    background: var(--surface);
    border: 1px solid var(--line-strong);
    border-radius: var(--radius-xl);
    box-shadow: var(--shadow-lg);
    transform: translateY(14px) scale(0.98);
    transition: transform 0.2s var(--ease);
    overflow: hidden;
}

.modal-backdrop.is-open .modal {
    transform: translateY(0) scale(1);
}

.modal__head {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    min-width: 0;
    padding: 17px 18px 14px;
    border-bottom: 1px solid var(--line);
}

.modal__head > .grow,
.modal__body > * {
    min-width: 0;
}

.modal__title {
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 1.04rem;
    font-weight: 800;
    letter-spacing: -0.02em;
}

.modal__sub {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 0.78rem;
    color: var(--text-3);
    margin-top: 2px;
}

.modal__close {
    margin-left: auto;
    display: grid;
    place-items: center;
    width: 30px;
    height: 30px;
    border-radius: var(--radius-xs);
    color: var(--text-3);
    flex-shrink: 0;
    transition: background 0.14s var(--ease), color 0.14s var(--ease);
}

.modal__close:hover {
    background: var(--surface-3);
    color: var(--text);
}

.modal__close svg {
    width: 16px;
    height: 16px;
}

.modal__body {
    padding: 16px 18px;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.modal__foot {
    padding: 14px 18px 17px;
    border-top: 1px solid var(--line);
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.steps {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.7rem;
    font-weight: 700;
    color: var(--text-3);
}

.steps span {
    display: grid;
    place-items: center;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: var(--surface-3);
    font-family: var(--mono);
    font-size: 0.66rem;
}

.steps span.is-done {
    background: var(--gold);
    color: var(--accent-ink);
}

.price-summary {
    display: flex;
    flex-direction: column;
    gap: 7px;
    padding: 12px 13px;
    background: var(--ink-2);
    border: 1px solid var(--line);
    border-radius: var(--radius);
}

.price-summary__row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    font-size: 0.82rem;
    color: var(--text-2);
}

.price-summary__row b {
    font-family: var(--mono);
    font-weight: 700;
    color: var(--text);
}

.price-summary__row--total {
    padding-top: 8px;
    border-top: 1px dashed var(--line-strong);
    font-weight: 700;
    color: var(--text);
}

.price-summary__row--total b {
    font-size: 1.16rem;
    color: var(--gold);
}

.price-summary__row--credit b {
    color: var(--mint);
}

.preview-card {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 11px 12px;
    background: var(--ink-2);
    border: 1px dashed var(--gold-line);
    border-radius: var(--radius);
    min-width: 0;
}

.preview-card__icon {
    width: 32px;
    height: 32px;
    border-radius: 7px;
    background: var(--surface-3);
    object-fit: cover;
    flex-shrink: 0;
}

.preview-card__title {
    font-weight: 700;
    font-size: 0.87rem;
}

.preview-card__desc {
    font-size: 0.74rem;
    color: var(--text-3);
}

.alert {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    padding: 10px 12px;
    border-radius: var(--radius-sm);
    font-size: 0.81rem;
    line-height: 1.45;
    border: 1px solid;
}

.alert svg {
    width: 15px;
    height: 15px;
    flex-shrink: 0;
    margin-top: 2px;
}

.alert--error {
    background: var(--crimson-soft);
    border-color: var(--crimson);
    color: var(--crimson);
}

.alert--ok {
    background: var(--mint-soft);
    border-color: var(--mint);
    color: var(--mint);
}

.alert--warn,
.alert--warning {
    background: var(--gold-soft);
    border-color: var(--gold-line);
    color: var(--gold);
}

.alert--info {
    background: var(--surface-2);
    border-color: var(--line);
    color: var(--text-2);
}

.alert--success {
    background: var(--mint-soft);
    border-color: var(--mint);
    color: var(--mint);
}

.reclaim-list {
    display: flex;
    flex-direction: column;
    gap: 7px;
    max-height: 190px;
    overflow-y: auto;
}

.reclaim-item {
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 9px 10px;
    background: var(--ink-2);
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    text-align: left;
    width: 100%;
    transition: border-color 0.14s var(--ease), background 0.14s var(--ease);
    min-width: 0;
}

.reclaim-item:hover {
    border-color: var(--gold-line);
    background: var(--gold-soft);
}

.reclaim-item img {
    width: 22px;
    height: 22px;
    border-radius: 5px;
    flex-shrink: 0;
    object-fit: cover;
    background: var(--surface-3);
}

.modal--reign {
    max-width: 820px;
    border-radius: 30px;
    background: color-mix(in srgb, var(--surface) 97%, transparent);
    box-shadow: 0 34px 110px rgba(0, 0, 0, 0.48);
}

.modal--reign .modal__head {
    align-items: center;
    padding: 22px 26px 19px;
}

.modal__crown-badge {
    display: grid;
    place-items: center;
    width: 56px;
    height: 56px;
    flex: 0 0 56px;
    border: 1px solid var(--gold-line);
    border-radius: 17px;
    background: var(--gold-soft);
    color: var(--gold);
}

.modal__crown-badge .ico {
    width: 27px;
    height: 27px;
}

.modal--reign .modal__title {
    margin-top: 5px;
    font-size: 1.42rem;
    line-height: 1.1;
}

.modal--reign .modal__sub {
    margin-top: 5px;
    font-size: 0.82rem;
}

.modal--reign .modal__close {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: var(--surface-2);
}

.modal--reign .modal__body {
    padding: 22px 26px;
}

.modal--reign .modal__foot {
    padding: 16px 26px 22px;
}

.modal--reign .steps {
    font-size: 0.67rem;
    letter-spacing: 0.025em;
}

.reis-url-step {
    display: grid;
    gap: 18px;
}

.reis-url-step__intro {
    display: flex;
    align-items: center;
    gap: 13px;
    padding: 16px 17px;
    border: 1px solid var(--line);
    border-radius: 18px;
    background: var(--surface-2);
}

.reis-url-step__intro > span {
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
    border-radius: 13px;
    background: var(--gold-soft);
    color: var(--gold);
}

.reis-url-step__intro > div {
    min-width: 0;
}

.reis-url-step__intro .ico {
    width: 20px;
}

.reis-url-step__intro strong {
    font-size: 0.94rem;
}

.reis-url-step__intro p {
    margin-top: 3px;
    color: var(--text-3);
    font-size: 0.78rem;
}

.modal--reign[data-step="url"] .modal__foot {
    padding-top: 12px;
    border-top-color: transparent;
}

.modal--reign[data-step="url"] .modal__body {
    padding-bottom: 8px;
}

.reis-details-grid {
    display: grid;
    grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr);
    gap: 14px;
}

.reis-details-grid__wide {
    grid-column: 1 / -1;
}

.reis-preview {
    display: grid;
    align-content: center;
    gap: 12px;
    border-style: solid;
    border-color: var(--gold-line);
    background: linear-gradient(145deg, var(--gold-soft), var(--surface-2));
}

.reis-preview__label {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--text-accent);
    font-size: 0.67rem;
    font-weight: 850;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.reis-preview__label .ico {
    width: 14px;
}

.reis-preview__profile {
    display: flex;
    align-items: center;
    gap: 11px;
}

.reis-preview .preview-card__icon {
    width: 40px;
    height: 40px;
    border-radius: 11px;
}

.reis-bid-field {
    margin-top: 18px;
    padding: 16px;
    border: 1px solid var(--line);
    border-radius: 18px;
    background: var(--surface-2);
}

.reis-bid-controls {
    display: flex;
    align-items: stretch;
    gap: 7px;
    margin-top: 9px;
    overflow-x: auto;
    scrollbar-width: thin;
    padding-bottom: 2px;
}

.reis-bid-controls .input-money {
    width: 116px;
    min-width: 116px;
}

.reis-bid-controls .btn {
    min-width: max-content;
    padding-inline: 13px;
}

.modal--reign .price-summary {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin-top: 12px !important;
    padding: 0;
    background: transparent;
    border: 0;
}

.modal--reign .price-summary__row {
    display: grid;
    gap: 5px;
    padding: 12px 13px;
    background: var(--surface-2);
    border: 1px solid var(--line);
    border-radius: 14px;
}

.modal--reign .price-summary__row--total {
    padding-top: 12px;
    border: 1px solid var(--gold-line);
    background: var(--gold-soft);
}

.modal--reign .modal__foot > .btn--gold {
    min-height: 54px;
    border-radius: 16px;
    box-shadow: 0 12px 28px color-mix(in srgb, var(--gold) 18%, transparent);
}

.modal--reign .modal__foot > .btn--gold:disabled {
    box-shadow: none;
}

.shopier-payment-backdrop {
    z-index: 110;
}

.shopier-payment-modal {
    width: min(760px, 100%);
    max-width: 760px;
    height: min(780px, calc(100vh - 32px));
    height: min(780px, calc(100dvh - 32px));
    max-height: none;
}

.shopier-payment-modal__head {
    align-items: center;
    flex: 0 0 auto;
}

.shopier-payment-frame-wrap {
    position: relative;
    flex: 1 1 auto;
    min-height: 0;
    background: #fff;
}

.shopier-payment-frame-wrap iframe {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 520px;
    border: 0;
    background: #fff;
}

.shopier-payment-loading {
    position: absolute;
    inset: 0;
    z-index: 1;
    display: grid;
    place-items: center;
    padding: 24px;
    color: #667085;
    background: #fff;
    pointer-events: none;
    transition: opacity .18s ease, visibility .18s ease;
}

.shopier-payment-loading.is-hidden {
    opacity: 0;
    visibility: hidden;
}

.shopier-payment-foot {
    flex: 0 0 auto;
    padding: 12px 18px 16px;
    border-top: 1px solid var(--line);
}

.shopier-payment-foot__copy {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}

.shopier-payment-foot__copy .field__hint {
    margin: 0;
}

.shopier-payment-fallback {
    flex: 0 0 auto;
    color: var(--muted);
    font-size: .78rem;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.shopier-payment-fallback:hover {
    color: var(--gold);
}

@media (max-width: 640px) {
    .shopier-payment-backdrop {
        padding: 8px;
    }

    .shopier-payment-modal {
        width: 100%;
        height: calc(100vh - 16px);
        height: calc(100dvh - 16px);
        border-radius: 22px;
    }

    .shopier-payment-modal__head {
        padding: 14px 14px 12px;
    }

    .shopier-payment-modal__head .modal__title {
        font-size: 1rem;
    }

    .shopier-payment-frame-wrap iframe {
        min-height: 0;
    }

    .shopier-payment-foot__copy {
        align-items: flex-start;
        flex-direction: column;
    }
}

.page-head {
    padding: 30px 0 22px;
    border-bottom: 1px solid var(--line);
    margin-bottom: 24px;
}

.breadcrumb {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
    font-size: 0.76rem;
    color: var(--text-3);
    margin-bottom: 11px;
}

.breadcrumb a:hover {
    color: var(--gold);
}

.breadcrumb__sep {
    opacity: 0.5;
}

.stat-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: 10px;
}

.stat-tile {
    padding: 16px 18px;
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--radius);
}

.stat-tile__label {
    font-size: 0.66rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--text-3);
    margin-bottom: 5px;
}

.stat-tile__value {
    font-family: var(--mono);
    font-size: 1.32rem;
    font-weight: 800;
    line-height: 1.1;
    letter-spacing: -0.02em;
}

.stat-tile__value--gold { color: var(--gold); }
.stat-tile__value--mint { color: var(--mint); }
.stat-tile__value--crimson { color: var(--crimson); }

.stat-tile__meta {
    font-size: 0.72rem;
    color: var(--text-3);
    margin-top: 3px;
}

.city-hero {
    display: grid;
    grid-template-columns: 1fr 300px;
    gap: 26px;
    align-items: start;
    padding: 26px 0;
}

.city-hero__plate {
    display: inline-grid;
    place-items: center;
    width: 58px;
    height: 44px;
    background: var(--gold);
    color: var(--accent-ink);
    font-family: var(--mono);
    font-size: 1.32rem;
    font-weight: 800;
    border-radius: var(--radius-xs);
    margin-bottom: 12px;
}

.city-hero__tagline {
    font-size: 1.02rem;
    color: var(--text-2);
    margin-bottom: 18px;
    max-width: 56ch;
}

.reis-banner {
    display: flex;
    align-items: center;
    gap: 13px;
    padding: 15px 17px;
    background: var(--gold-soft);
    border: 1px solid var(--gold-line);
    border-radius: var(--radius-lg);
    min-width: 0;
}

.reis-banner__icon {
    width: 44px;
    height: 44px;
    border-radius: 11px;
    object-fit: cover;
    background: var(--surface-3);
    flex-shrink: 0;
}

.reis-banner__label {
    font-size: 0.67rem;
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--gold);
    margin-bottom: 2px;
}

.reis-banner__title {
    font-size: 1.06rem;
    font-weight: 800;
    letter-spacing: -0.02em;
    margin-bottom: 2px;
}

.reis-banner__title a:hover {
    color: var(--gold);
}

.reis-banner__desc {
    font-size: 0.81rem;
    color: var(--text-2);
}

.reis-banner--empty {
    background: var(--surface);
    border-style: dashed;
}

.timeline {
    display: flex;
    flex-direction: column;
}

.timeline__item {
    display: flex;
    gap: 12px;
    padding: 11px 0;
    border-bottom: 1px solid var(--line);
    min-width: 0;
}

.timeline__item:last-child {
    border-bottom: 0;
}

.timeline__dot {
    position: relative;
    width: 9px;
    flex-shrink: 0;
    display: flex;
    justify-content: center;
    padding-top: 6px;
}

.timeline__dot::before {
    content: "";
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--gold);
    flex-shrink: 0;
    z-index: 1;
}

.timeline__dot::after {
    content: "";
    position: absolute;
    top: 14px;
    bottom: -12px;
    width: 1px;
    background: var(--line);
}

.timeline__item:last-child .timeline__dot::after {
    display: none;
}

.timeline__price {
    margin-left: auto;
    font-family: var(--mono);
    font-weight: 800;
    color: var(--gold);
    flex-shrink: 0;
}

.data-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.85rem;
}

.data-table th {
    padding: 9px 11px;
    text-align: left;
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    color: var(--text-3);
    border-bottom: 1px solid var(--line);
    white-space: nowrap;
}

.data-table td {
    padding: 10px 11px;
    border-bottom: 1px solid var(--line);
    vertical-align: middle;
}

.data-table tbody tr:hover {
    background: var(--surface-2);
}

.data-table tbody tr:last-child td {
    border-bottom: 0;
}

.table-scroll {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.prose {
    max-width: 74ch;
}

.prose h2 {
    margin: 30px 0 11px;
    font-size: 1.24rem;
}

.prose h3 {
    margin: 22px 0 8px;
    font-size: 1rem;
}

.prose p {
    margin-bottom: 13px;
    color: var(--text-2);
    line-height: 1.68;
}

.prose ul,
.prose ol {
    margin: 0 0 15px 20px;
    color: var(--text-2);
}

.prose li {
    margin-bottom: 7px;
    line-height: 1.62;
}

.prose strong {
    color: var(--text);
    font-weight: 700;
}

.prose a {
    color: var(--gold);
    text-decoration: underline;
    text-underline-offset: 2px;
}

.prose code {
    font-family: var(--mono);
    font-size: 0.86em;
    padding: 2px 5px;
    background: var(--surface-2);
    border: 1px solid var(--line);
    border-radius: 4px;
}

.page-intro {
    padding: 30px 0 18px;
    border-bottom: 1px solid var(--line);
    background: var(--ink-2);
}

.page-intro .eyebrow { margin-bottom: 10px; }
.page-intro h1 { max-width: 18ch; margin-bottom: 12px; }

.page-intro p:last-child {
    max-width: 62ch;
    color: var(--text-2);
    font-size: .94rem;
    line-height: 1.65;
}

.page-stack {
    margin-top: 20px;
    margin-bottom: 44px;
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.content-card { padding: 22px; }
.content-card.prose { max-width: none; }
.content-card.prose h2:first-child { margin-top: 0; }

.contact-card {
    max-width: 560px;
    padding: 28px;
}

.contact-card .feature__icon { margin-bottom: 15px; }
.contact-card h2 { margin-bottom: 8px; }

.contact-card p {
    max-width: 52ch;
    margin-bottom: 18px;
    color: var(--text-2);
}

.filter-bar {
    display: grid;
    grid-template-columns: minmax(220px, 1fr) minmax(150px, .55fr) minmax(150px, .55fr) auto;
    gap: 8px;
    padding: 9px;
}

.filter-bar .input,
.filter-bar .select { background: transparent; }

.tab-links {
    display: inline-flex;
    gap: 2px;
    padding: 3px;
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    background: var(--surface-2);
}

.tab-links a {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 7px 13px;
    border-radius: 5px;
    color: var(--text-3);
    font-size: .8rem;
    font-weight: 700;
    transition: color 0.14s var(--ease), background 0.14s var(--ease);
}

.tab-links a:hover {
    color: var(--text-2);
    background: var(--surface-3);
}

.tab-links a.is-active {
    color: var(--text);
    background: var(--surface);
    box-shadow: var(--shadow-sm);
}

.tab-links a .ico {
    width: 12px;
    height: 12px;
}

.tab-links a.is-active .ico {
    color: var(--gold);
}

.page-columns {
    display: grid;
    grid-template-columns: minmax(0, 1.25fr) minmax(280px, .75fr);
    gap: 14px;
    margin: 18px 0 60px;
}

.city-map {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 12px;
}

.form-stack {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.rule-card {
    display: flex;
    gap: 13px;
    padding: 15px 16px;
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    margin-bottom: 10px;
}

.rule-card__num {
    display: grid;
    place-items: center;
    width: 26px;
    height: 26px;
    border-radius: 8px;
    background: var(--gold-soft);
    border: 1px solid var(--gold-line);
    color: var(--gold);
    font-family: var(--mono);
    font-size: 0.79rem;
    font-weight: 800;
    flex-shrink: 0;
}

.rule-card h3 {
    margin-bottom: 5px;
    font-size: 0.95rem;
}

.rule-card p {
    font-size: 0.85rem;
    color: var(--text-2);
    line-height: 1.6;
}

.feature-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(232px, 1fr));
    gap: 12px;
}

.feature {
    padding: 17px;
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--radius-lg);
}

.feature__icon {
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    border-radius: 10px;
    background: var(--gold-soft);
    border: 1px solid var(--gold-line);
    color: var(--gold);
    margin-bottom: 11px;
}

.feature__icon svg {
    width: 17px;
    height: 17px;
}

.feature h3 {
    margin-bottom: 6px;
    font-size: 0.96rem;
}

.feature p {
    font-size: 0.84rem;
    color: var(--text-2);
    line-height: 1.6;
}

.price-tiers {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 11px;
}

.price-tier {
    padding: 17px;
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--radius-lg);
    text-align: center;
}

.price-tier--featured {
    border-color: var(--gold-line);
    background: var(--gold-soft);
}

.price-tier__name {
    font-size: 0.7rem;
    font-weight: 800;
    letter-spacing: 0.09em;
    text-transform: uppercase;
    color: var(--text-3);
    margin-bottom: 7px;
}

.price-tier__price {
    font-family: var(--mono);
    font-size: 2rem;
    font-weight: 800;
    color: var(--gold);
    line-height: 1;
    margin-bottom: 7px;
}

.price-tier__desc {
    font-size: 0.78rem;
    color: var(--text-3);
    line-height: 1.5;
}

.result {
    max-width: 520px;
    margin: 60px auto;
    text-align: center;
}

.result__icon {
    display: grid;
    place-items: center;
    width: 62px;
    height: 62px;
    margin: 0 auto 20px;
    border-radius: 50%;
    background: var(--gold-soft);
    border: 1px solid var(--gold-line);
    color: var(--gold);
}

.result__icon svg {
    width: 28px;
    height: 28px;
}

.result__icon--ok {
    background: var(--mint-soft);
    border-color: var(--mint);
    color: var(--mint);
}

.result h1 {
    font-size: 1.7rem;
    margin-bottom: 11px;
}

.result p {
    color: var(--text-2);
    margin-bottom: 22px;
}

.result--with-card {
    max-width: 620px;
    margin-top: 42px;
}

.share-success {
    margin: 28px auto 26px;
    padding: 14px;
    text-align: left;
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow);
}

.share-success__head {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 5px 6px 13px;
}

.share-success__head > span {
    display: grid;
    place-items: center;
    width: 36px;
    height: 36px;
    color: var(--gold);
    background: var(--gold-soft);
    border: 1px solid var(--gold-line);
    border-radius: 50%;
}

.share-success__head svg {
    width: 18px;
    height: 18px;
}

.share-success h2 {
    margin: 0;
    font-size: 1rem;
}

.share-success__head p,
.share-success__hint {
    margin: 2px 0 0;
    font-size: 0.77rem;
    color: var(--text-3);
}

.share-success__preview {
    margin: 0;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: calc(var(--radius) - 2px);
    background: #111114;
}

.share-success__preview img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 4 / 5;
    object-fit: cover;
}

.share-success__actions {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 7px;
    margin-top: 12px;
}

.share-success__actions .btn {
    justify-content: center;
    padding-inline: 8px;
    font-size: 0.78rem;
}

.share-success__actions .btn svg {
    width: 15px;
    height: 15px;
}

.share-success__hint {
    margin: 12px 5px 2px;
    text-align: center;
    line-height: 1.45;
}

@media (max-width: 520px) {
    .share-success__actions {
        grid-template-columns: 1fr;
    }
}

.toast-stack {
    position: fixed;
    bottom: 18px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 120;
    display: flex;
    flex-direction: column-reverse;
    gap: 8px;
    width: calc(100% - 32px);
    max-width: 400px;
    pointer-events: none;
}

.toast {
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 11px 14px;
    background: var(--surface-2);
    border: 1px solid var(--line-strong);
    border-radius: var(--radius);
    box-shadow: var(--shadow-lg);
    font-size: 0.85rem;
    font-weight: 600;
    pointer-events: auto;
    animation: toast-in 0.24s var(--ease);
}

.toast.is-leaving {
    animation: toast-out 0.2s var(--ease) forwards;
}

.toast--ok { border-color: var(--mint); }
.toast--error { border-color: var(--crimson); }
.toast--gold { border-color: var(--gold-line); }

@keyframes toast-in {
    from { opacity: 0; transform: translateY(14px) scale(0.97); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes toast-out {
    to { opacity: 0; transform: translateY(8px) scale(0.98); }
}

.feed-stack {
    position: fixed;
    top: calc(var(--header-h) + 12px);
    right: 14px;
    z-index: 55;
    display: flex;
    flex-direction: column;
    gap: 8px;
    width: 290px;
    pointer-events: none;
}

.feed-card {
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 10px 12px;
    background: var(--surface-2);
    border: 1px solid var(--gold-line);
    border-radius: var(--radius);
    box-shadow: var(--shadow-lg);
    pointer-events: auto;
    animation: feed-in 0.28s var(--ease);
    min-width: 0;
}

.feed-card img {
    width: 26px;
    height: 26px;
    border-radius: 6px;
    object-fit: cover;
    flex-shrink: 0;
    background: var(--surface-3);
}

.feed-card__label {
    font-size: 0.64rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--gold);
}

.feed-card__text {
    font-size: 0.79rem;
    font-weight: 600;
}

@keyframes feed-in {
    from { opacity: 0; transform: translateX(18px); }
    to { opacity: 1; transform: translateX(0); }
}

.flash-up {
    animation: flash-up 0.7s var(--ease);
}

@keyframes flash-up {
    0% { color: var(--mint); transform: scale(1.14); }
    100% { color: inherit; transform: scale(1); }
}

.gold,
.brand__lol,
.eyebrow,
.ticker__value--gold,
.announce,
.footer-col__links a:hover,
.hero h1 .accent,
.hero__by a,
.podium__votes b,
.region-bar:hover,
.region-tabs a.is-active,
.region-tabs button.is-active,
.city-row__name:hover,
.city-row__reis,
.city-card__name:hover,
.city-card__reis-title:hover,
.city-card__empty,
.price-summary__row--total b,
.breadcrumb a:hover,
.stat-tile__value--gold,
.reis-banner__label,
.reis-banner__title a:hover,
.timeline__price,
.prose a,
.price-tier__price,
.feed-card__label {
    color: var(--text-accent);
}

.hero__center {
    max-width: 760px;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.hero__center .hero__lead {
    max-width: 66ch;
    margin-inline: auto;
    margin-bottom: 12px;
}

.hero-benefits {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0 0 14px;
    padding: 0;
    list-style: none;
}

.hero-benefits li {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 34px;
    padding: 7px 11px;
    color: var(--text-2);
    background: color-mix(in srgb, var(--surface) 84%, transparent);
    border: 1px solid var(--line);
    border-radius: 999px;
    box-shadow: 0 6px 18px color-mix(in srgb, var(--ink) 4%, transparent);
    font-size: .74rem;
    white-space: nowrap;
}

.hero-benefits .ico {
    width: 14px;
    height: 14px;
    color: var(--gold);
    flex: 0 0 14px;
}

.hero-benefits strong {
    color: var(--text);
    font-weight: 800;
}

.purchase-faq {
    display: grid;
    grid-template-columns: minmax(230px, .72fr) minmax(0, 1.55fr);
    gap: 18px;
    margin: 0;
    padding: 18px;
    border: 1px solid var(--line);
    border-radius: 22px;
    background: var(--surface);
    box-shadow: var(--shadow-sm);
}

.purchase-faq__intro {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 5px 7px;
}

.purchase-faq__icon {
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
    color: var(--gold);
    border: 1px solid var(--gold-line);
    border-radius: 13px;
    background: var(--gold-soft);
}

.purchase-faq__icon .ico { width: 20px; height: 20px; }
.purchase-faq__intro .eyebrow { margin-bottom: 4px; }

.purchase-faq__intro h2 {
    margin: 0;
    color: var(--text);
    font-size: 1.04rem;
    line-height: 1.25;
    letter-spacing: -.02em;
}

.purchase-faq__intro p:not(.eyebrow) {
    margin-top: 6px;
    color: var(--text-3);
    font-size: .73rem;
    line-height: 1.5;
}

.purchase-faq__items {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    /* Açılan cevap kendi yüksekliğini alsın; yanındaki kapalı kart boş yere
       büyüyüp tasarımı bozmasın. */
    align-items: start;
}

.purchase-faq__item {
    min-width: 0;
    align-self: start;
    border: 1px solid var(--line);
    border-radius: 13px;
    background: var(--surface-2);
    transition: border-color .16s var(--ease), background .16s var(--ease);
}

.purchase-faq__item[open] {
    border-color: color-mix(in srgb, var(--gold) 32%, var(--line));
    background: color-mix(in srgb, var(--surface-2) 94%, var(--gold) 6%);
}

.purchase-faq__item summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    min-height: 42px;
    padding: 9px 11px;
    color: var(--text);
    font-size: .76rem;
    font-weight: 780;
    line-height: 1.3;
    list-style: none;
    cursor: pointer;
}

.purchase-faq__item summary::-webkit-details-marker { display: none; }

.purchase-faq__toggle {
    position: relative;
    width: 16px;
    height: 16px;
    flex: 0 0 16px;
    border-radius: 50%;
    background: var(--surface-3);
}

.purchase-faq__toggle::before,
.purchase-faq__toggle::after {
    content: "";
    position: absolute;
    top: 7px;
    left: 4px;
    width: 8px;
    height: 1.5px;
    border-radius: 99px;
    background: var(--text-2);
}

.purchase-faq__toggle::after {
    transform: rotate(90deg);
    transition: transform .16s var(--ease);
}

.purchase-faq__item[open] .purchase-faq__toggle::after { transform: rotate(0); }

.purchase-faq__item p {
    padding: 0 11px 11px;
    color: var(--text-2);
    font-size: .7rem;
    line-height: 1.48;
}

.purchase-faq__item p strong {
    color: var(--text-accent);
    font-weight: 900;
}

.reclaim-difference-note {
    display: flex;
    align-items: flex-start;
    gap: 7px;
    margin-top: 10px;
    padding: 9px 11px;
    color: var(--text-2);
    border: 1px solid var(--gold-line);
    border-radius: 11px;
    background: var(--gold-soft);
    font-size: .73rem;
    line-height: 1.45;
}

.reclaim-difference-note .ico {
    width: 14px;
    height: 14px;
    margin-top: 2px;
    color: var(--gold);
    flex: 0 0 14px;
}

.reclaim-difference-note strong {
    color: var(--text-accent);
    font-weight: 900;
}

.home-stage {
    max-width: 1120px;
    display: grid;
    gap: 18px;
    padding-bottom: 48px;
}

.home-stage .map-panel {
    border-radius: 24px;
    box-shadow: 0 18px 52px color-mix(in srgb, var(--gold) 8%, transparent);
}

.home-stage .map-panel__head {
    padding: 20px 24px;
}

.home-stage .map-wrap {
    min-height: 560px;
    padding: 38px 42px 52px;
    display: grid;
    place-items: center;
}

.home-stage .tr-map {
    width: min(100%, 980px);
    display: block;
}

.daily-reis {
    position: relative;
    display: grid;
    grid-template-columns: 58px minmax(0, 1fr) auto;
    align-items: center;
    gap: 16px;
    margin: 0 24px 12px;
    padding: 17px 18px;
    overflow: hidden;
    border: 1px solid color-mix(in srgb, var(--gold) 34%, var(--line));
    border-radius: 20px;
    background:
        radial-gradient(circle at 92% 10%, color-mix(in srgb, var(--gold) 13%, transparent), transparent 34%),
        color-mix(in srgb, var(--surface-2) 92%, var(--gold) 8%);
    box-shadow: 0 12px 32px color-mix(in srgb, var(--gold) 8%, transparent);
}

.daily-reis::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    border-radius: inherit;
    box-shadow: inset 0 1px rgba(255,255,255,.08);
}

.daily-reis__badge {
    position: absolute;
    top: -22px;
    right: 104px;
    display: grid;
    place-items: center;
    width: 72px;
    height: 72px;
    color: color-mix(in srgb, var(--gold) 16%, transparent);
    transform: rotate(10deg);
}

.daily-reis__badge .ico { width: 72px; height: 72px; }

.daily-reis__avatar,
.daily-reis__avatar > span {
    position: relative;
    z-index: 1;
    display: grid;
    place-items: center;
    width: 58px;
    height: 58px;
    flex: 0 0 auto;
    overflow: hidden;
    color: var(--gold);
    border: 2px solid color-mix(in srgb, var(--gold) 72%, white);
    border-radius: 50%;
    background: var(--surface);
    box-shadow: 0 5px 18px color-mix(in srgb, var(--gold) 22%, transparent);
}

.daily-reis__avatar img { width: 100%; height: 100%; object-fit: cover; }
.daily-reis__avatar .ico { width: 24px; height: 24px; }
.daily-reis__body { position: relative; z-index: 1; min-width: 0; }

.daily-reis__eyebrow {
    display: flex;
    align-items: center;
    gap: 7px;
    margin-bottom: 4px;
    color: var(--text-3);
    font-size: .72rem;
    font-weight: 750;
}

.daily-reis__eyebrow strong {
    color: var(--text-accent);
    font-size: .73rem;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.daily-reis__eyebrow a { color: var(--gold); }
.daily-reis__eyebrow a:hover { text-decoration: underline; }

.daily-reis__name {
    display: inline-flex;
    align-items: center;
    max-width: 100%;
    gap: 6px;
    color: var(--text);
    font-size: 1.08rem;
    font-weight: 850;
}

.daily-reis__name .ico { width: 14px; height: 14px; color: var(--text-3); }
.daily-reis__body p,
.daily-reis__empty-copy p {
    overflow: hidden;
    margin: 3px 0 0;
    color: var(--text-2);
    font-size: .78rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.daily-reis__amount {
    position: relative;
    z-index: 1;
    display: grid;
    min-width: 116px;
    padding: 11px 15px;
    text-align: right;
    border: 1px solid color-mix(in srgb, var(--gold) 26%, var(--line));
    border-radius: 15px;
    background: color-mix(in srgb, var(--surface) 90%, transparent);
}

.daily-reis__amount span {
    color: var(--text-3);
    font-size: .58rem;
    font-weight: 750;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.daily-reis__amount strong {
    color: var(--text-accent);
    font-family: var(--font-mono);
    font-size: 1.45rem;
    line-height: 1.15;
}

.daily-reis--empty { grid-template-columns: minmax(0, 1fr) auto; }
.daily-reis__empty-copy { position: relative; z-index: 1; }
.daily-reis__empty-copy h3 { margin: 0; font-size: 1rem; }
.daily-reis--empty > .btn { position: relative; z-index: 1; }

.daily-reis-note {
    margin: 0 27px 18px;
    color: var(--text-3);
    font-size: .68rem;
}

.reign-hub {
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: 22px;
    overflow: hidden;
    box-shadow: var(--shadow-sm);
}

.reign-hub__top {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 16px;
    padding: 10px 18px 0;
    border-bottom: 1px solid var(--line);
}

.reign-tabs {
    display: flex;
    align-items: stretch;
    gap: 4px;
}

.reign-tabs button {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 48px;
    padding: 0 12px;
    color: var(--text-3);
    font-weight: 750;
    border: 0;
    border-bottom: 2px solid transparent;
    background: transparent;
    cursor: pointer;
}

.reign-tabs button.is-active {
    color: var(--text);
    border-bottom-color: var(--gold);
}

.reign-tabs button > span {
    padding: 2px 7px;
    border-radius: 999px;
    background: var(--surface-3);
    color: var(--text-2);
    font-family: var(--mono);
    font-size: .7rem;
}

.reign-tabs em {
    position: absolute;
    top: 1px;
    right: -4px;
    padding: 2px 6px;
    border-radius: 4px;
    background: var(--gold);
    color: var(--accent-ink);
    font: 800 .58rem/1 var(--sans);
    letter-spacing: .05em;
    text-transform: uppercase;
    transform: rotate(-6deg);
}

.reign-sort {
    display: flex;
    align-items: center;
    gap: 3px;
    padding: 4px;
    margin-bottom: 10px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: var(--surface-2);
}

.reign-sort button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    min-height: 36px;
    padding: 0 12px;
    border: 0;
    border-radius: 10px;
    background: transparent;
    color: var(--text-2);
    font: inherit;
    font-size: .76rem;
    font-weight: 750;
    white-space: nowrap;
    cursor: pointer;
    transition: color 160ms ease, background 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.reign-sort button:hover {
    color: var(--text);
    background: var(--surface-3);
}

.reign-sort button:active { transform: translateY(1px); }
.reign-sort button .ico { width: 15px; height: 15px; }
.reign-sort button[data-reign-sort="wealthy"] .ico { color: var(--text-accent); }
.reign-sort button[data-reign-sort="budget"] .ico { color: var(--mint); }

.reign-sort button.is-active {
    color: var(--ink);
    background: var(--text);
    box-shadow: var(--shadow-sm);
}

.reign-sort button.is-active .ico { color: inherit; }

.reign-hub__note {
    color: var(--text-3);
    font-size: .78rem;
}

.reign-hub__panel {
    padding: 16px 18px 12px;
}

.reign-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.reign-mini {
    min-width: 0;
    padding: 12px;
    border: 1px solid color-mix(in srgb, var(--line) 54%, var(--reign-tone) 46%);
    border-radius: 14px;
    background: color-mix(in srgb, var(--surface-2) 68%, var(--reign-tone) 32%);
    box-shadow: 0 3px 0 color-mix(in srgb, var(--reign-tone) 24%, transparent);
    transition: background 160ms ease, border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.reign-mini:nth-child(6n + 1) { --reign-tone: #f2c94c; }
.reign-mini:nth-child(6n + 2) { --reign-tone: #5fc49b; }
.reign-mini:nth-child(6n + 3) { --reign-tone: #6da9e8; }
.reign-mini:nth-child(6n + 4) { --reign-tone: #c19adf; }
.reign-mini:nth-child(6n + 5) { --reign-tone: #f39a6b; }
.reign-mini:nth-child(6n + 6) { --reign-tone: #e685a7; }

.reign-mini:hover {
    background: color-mix(in srgb, var(--surface-2) 56%, var(--reign-tone) 44%);
    border-color: color-mix(in srgb, var(--line-strong) 42%, var(--reign-tone) 58%);
    box-shadow: 0 5px 14px color-mix(in srgb, var(--reign-tone) 25%, transparent);
    transform: translateY(-1px);
}

.reign-mini__top {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px;
}

.reign-mini__top strong {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: .84rem;
}

.reign-mini__top > .mono {
    color: var(--gold);
    font-size: .76rem;
}

.reign-mini__owner {
    display: flex;
    align-items: center;
    gap: 9px;
    min-width: 0;
}

.reign-mini__owner img {
    border-radius: 8px;
    object-fit: cover;
    background: var(--surface-3);
}

.reign-mini__owner > span:not(.reign-mini__empty) {
    min-width: 0;
    flex: 1;
}

.reign-mini__owner > .btn {
    flex-shrink: 0;
    border-color: color-mix(in srgb, var(--reign-tone) 68%, var(--line) 32%);
    background: color-mix(in srgb, var(--surface) 48%, var(--reign-tone) 52%);
    color: color-mix(in srgb, var(--text) 68%, var(--reign-tone) 32%);
    font-weight: 800;
    box-shadow: 0 2px 0 color-mix(in srgb, var(--reign-tone) 25%, transparent);
    transition: background 160ms ease, border-color 160ms ease, box-shadow 160ms ease, color 160ms ease, transform 160ms ease;
}

.reign-mini__owner > .btn .ico {
    color: color-mix(in srgb, var(--text) 56%, var(--reign-tone) 44%);
}

.reign-mini__owner > .btn:hover {
    border-color: color-mix(in srgb, var(--reign-tone) 74%, var(--line-strong) 26%);
    background: color-mix(in srgb, var(--surface) 44%, var(--reign-tone) 56%);
    color: var(--text);
    box-shadow: 0 4px 10px color-mix(in srgb, var(--reign-tone) 26%, transparent);
    transform: translateY(-1px);
}

.reign-mini__owner b,
.reign-mini__owner small {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.reign-mini__owner b { font-size: .8rem; }
.reign-mini__owner small { color: var(--text-3); font-size: .68rem; }

.reign-mini__empty {
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1;
    color: var(--text-3);
    font-size: .76rem;
}

.reign-hub__all {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 5px;
    padding: 12px 2px 2px;
    color: var(--text-2);
    font-size: .76rem;
    font-weight: 700;
}

.district-picker {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr) auto;
    align-items: end;
    gap: 10px;
    margin-bottom: 14px;
    padding: 14px;
    border: 1px solid var(--gold-line);
    border-radius: 14px;
    background: var(--gold-soft);
}

.district-picker label > span {
    display: block;
    margin-bottom: 5px;
    color: var(--text-2);
    font-size: .7rem;
    font-weight: 750;
}

.district-empty {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    min-height: 90px;
    padding: 18px;
    color: var(--text-3);
}

.district-empty > svg { color: var(--gold); width: 24px; height: 24px; }
.district-empty strong, .district-empty span { display: block; }
.district-empty strong { color: var(--text); margin-bottom: 3px; }

.home-ranking {
    max-width: 1120px;
    padding-bottom: 48px;
}

.city-list--wide .city-row {
    padding-inline: 16px;
}

.city-list__more {
    display: flex;
    justify-content: center;
    padding: 0 12px 4px;
}

.city-list__more .btn {
    min-width: 176px;
}

.district-link-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.district-owner-card {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    margin-top: 18px;
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: var(--surface-2);
}

.district-owner-card img,
.district-owner-card__fallback { width: 40px; height: 40px; object-fit: cover; border-radius: 10px; }
.district-owner-card__fallback { display: grid; place-items: center; color: var(--gold); background: var(--gold-soft); }
.district-owner-card__fallback .ico { width: 20px; height: 20px; }
.district-owner-card strong, .district-owner-card small { display: block; }
.district-owner-card small { color: var(--text-3); margin-top: 2px; }

@media (max-width: 1080px) {
    .hero__inner {
        grid-template-columns: 1fr;
        gap: 24px;
    }

    .city-hero {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 960px) {
    /* minmax(0, 1fr) şart: düz "1fr" izin alt sınırını içeriğin min-content
       genişliğine bağlar ve yatay kaydırmalı şeritler (bölge sekmeleri) izi
       viewport'un ötesine taşırır. */
    .board {
        grid-template-columns: minmax(0, 1fr);
    }

    .board-tabs {
        display: flex;
    }

    .board-main {
        position: static;
    }

    .board[data-view="list"] .board-main { display: none; }
    .board[data-view="map"] .board-side { display: none; }

    .footer-grid {
        grid-template-columns: 1fr 1fr;
        gap: 24px;
    }

    .purchase-faq {
        grid-template-columns: minmax(0, 1fr);
    }

    .purchase-faq__intro {
        align-items: center;
    }
}

@media (max-width: 720px) {
    :root {
        --header-h: max(52px, calc(var(--brand-logo-height, 46px) + 12px));
    }

    body {
        font-size: 14.5px;
    }

    .hide-mobile { display: none; }
    .only-mobile { display: initial; }

    .nav {
        display: none;
    }

    .hero {
        padding: 26px 0 20px;
    }

    .home-stage .map-panel__head {
        padding: 14px 15px;
    }

    .home-stage .map-wrap {
        min-height: clamp(360px, 105vw, 430px);
        padding: 24px 0 34px;
        display: flex;
        align-items: center;
        justify-content: flex-start;
        overflow-x: auto;
        overflow-y: hidden;
        overscroll-behavior-inline: contain;
        scroll-behavior: smooth;
        scrollbar-width: none;
        -webkit-overflow-scrolling: touch;
        touch-action: pan-x pan-y;
        cursor: grab;
    }

    .home-stage .map-wrap:active {
        cursor: grabbing;
    }

    .home-stage .map-wrap::-webkit-scrollbar {
        display: none;
    }

    .home-stage .tr-map {
        flex: 0 0 auto;
        width: clamp(590px, 162vw, 700px);
        max-width: none;
        margin-inline: 12px;
    }

    .daily-reis {
        grid-template-columns: 48px minmax(0, 1fr);
        gap: 11px;
        margin: 0 10px 10px;
        padding: 14px;
        border-radius: 17px;
    }

    .daily-reis__avatar,
    .daily-reis__avatar > span {
        width: 48px;
        height: 48px;
    }

    .daily-reis__eyebrow {
        flex-wrap: wrap;
    }

    .daily-reis__amount {
        grid-column: 1 / -1;
        display: flex;
        align-items: center;
        justify-content: space-between;
        min-width: 0;
        text-align: left;
    }

    .daily-reis__amount strong {
        font-size: 1.25rem;
    }

    .daily-reis__body p,
    .daily-reis__empty-copy p {
        display: -webkit-box;
        overflow: hidden;
        white-space: normal;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
    }

    .daily-reis--empty {
        grid-template-columns: minmax(0, 1fr);
    }

    .daily-reis--empty > .btn {
        width: 100%;
    }

    .daily-reis-note {
        margin: 0 13px 15px;
        line-height: 1.5;
    }

    .reign-hub__top {
        display: block;
        padding: 0 10px 9px;
    }

    .reign-hub__note { display: none; }
    .reign-tabs { overflow-x: auto; }
    .reign-tabs button { white-space: nowrap; padding-inline: 9px; }
    .reign-sort {
        width: 100%;
        margin-top: 7px;
        margin-bottom: 0;
        overflow-x: auto;
        scrollbar-width: none;
    }
    .reign-sort::-webkit-scrollbar { display: none; }
    .reign-sort button {
        flex: 1 0 auto;
        min-height: 34px;
        padding-inline: 9px;
        font-size: .71rem;
    }
    .reign-hub__panel { padding: 12px 10px; }
    .reign-grid { grid-template-columns: minmax(0, 1fr); }
    .district-picker { grid-template-columns: minmax(0, 1fr); }
    .district-picker .btn { width: 100%; }

    .hero__lead {
        font-size: 0.93rem;
    }

    .hero-benefits {
        gap: 6px;
        margin-bottom: 12px;
    }

    .hero-benefits li {
        min-height: 30px;
        padding: 6px 9px;
        font-size: .68rem;
    }

    .purchase-faq {
        gap: 11px;
        margin: 0;
        padding: 12px;
        border-radius: 17px;
    }

    .purchase-faq__intro {
        padding: 2px;
    }

    .purchase-faq__icon {
        width: 38px;
        height: 38px;
        flex-basis: 38px;
    }

    .purchase-faq__intro h2 { font-size: .94rem; }
    .purchase-faq__intro p:not(.eyebrow) { display: none; }
    .purchase-faq__items { grid-template-columns: minmax(0, 1fr); }
    .purchase-faq__item summary { min-height: 40px; }

    .feed-stack {
        left: 14px;
        right: 14px;
        width: auto;
    }

    .city-row {
        grid-template-columns: 27px minmax(0, 1fr) auto;
        gap: 9px;
        padding: 10px 11px;
    }

    .city-row__votes {
        min-width: 38px;
    }

    .modal {
        max-width: 100%;
        border-radius: var(--radius-lg);
    }

    .city-sheet-backdrop {
        align-items: flex-end;
        padding: 12px 10px max(10px, env(safe-area-inset-bottom));
    }

    .city-sheet {
        width: 100%;
        max-height: min(82dvh, 720px);
        border-radius: 24px;
        transform: translateY(34px) scale(0.99);
    }

    .city-sheet-backdrop.is-open .city-sheet {
        transform: translateY(0) scale(1);
    }

    .city-sheet__head {
        padding: 17px 16px 14px;
    }

    .city-sheet__body {
        padding: 14px 16px 18px;
    }

    .city-sheet__empty {
        align-items: flex-start;
        flex-wrap: wrap;
    }

    .city-sheet__empty .btn {
        width: 100%;
        margin-left: 0;
    }

    .modal--reign {
        max-height: calc(100dvh - 20px);
        border-radius: 24px;
    }

    .modal--reign .modal__head {
        padding: 17px 16px 14px;
    }

    .modal__crown-badge {
        width: 46px;
        height: 46px;
        flex-basis: 46px;
        border-radius: 14px;
    }

    .modal--reign .modal__title {
        font-size: 1.14rem;
    }

    .modal--reign .modal__body,
    .modal--reign .modal__foot {
        padding-inline: 16px;
    }

    .reis-details-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .reis-details-grid__wide {
        grid-column: auto;
    }

    .modal--reign .price-summary {
        grid-template-columns: minmax(0, 1fr);
    }

    .reis-url-step .input-group {
        align-items: stretch;
        flex-direction: column;
    }

    .reis-url-step .input-group .btn {
        width: 100%;
    }

    .footer-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .footer-payment-trust {
        gap: 7px;
        justify-content: center;
        margin-inline: auto;
        padding: 7px 9px;
    }

    .footer-payment-trust p {
        max-width: 25ch;
        white-space: normal;
    }

    .footer-payment-trust__provider img {
        width: 56px;
    }

    .page-head {
        padding: 22px 0 18px;
    }

    .result {
        margin: 36px auto;
    }

    .page-intro {
        padding: 24px 0 16px;
    }

    .page-stack {
        margin-top: 18px;
        margin-bottom: 40px;
        gap: 14px;
    }

    .reigns-page {
        min-width: 0;
        overflow: hidden;
    }

    .reigns-page .stat-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 6px;
    }

    .reigns-page .stat-tile {
        min-width: 0;
        padding: 11px 9px;
    }

    .reigns-page .stat-tile__value {
        font-size: 1rem;
    }

    .reigns-toolbar {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        align-items: stretch;
        min-width: 0;
    }

    .reigns-toolbar .tab-links {
        display: flex;
        width: 100%;
        max-width: 100%;
        overflow-x: auto;
        overscroll-behavior-x: contain;
        scrollbar-width: none;
    }

    .reigns-toolbar .tab-links::-webkit-scrollbar { display: none; }

    .reigns-toolbar .tab-links a {
        flex: 0 0 auto;
        padding-inline: 10px;
        white-space: nowrap;
    }

    .reigns-toolbar .search-box {
        width: 100%;
        max-width: none !important;
        margin-left: 0 !important;
    }

    .content-card,
    .contact-card {
        padding: 17px;
    }

    .filter-bar {
        grid-template-columns: 1fr;
    }

    .page-columns {
        grid-template-columns: 1fr;
        margin-top: 12px;
        margin-bottom: 40px;
    }

    .city-grid {
        grid-template-columns: 1fr;
    }

    .city-card {
        min-width: 0;
        overflow: hidden;
        padding: 14px 16px 12px;
    }

    .city-card__head,
    .city-card__reis,
    .city-card__reis-info,
    .city-card__foot {
        min-width: 0;
    }

    .city-card__name,
    .city-card__reis-title,
    .city-card__reis-desc {
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .city-card__name,
    .city-card__reis-title {
        white-space: nowrap;
    }

    .city-card__foot {
        display: grid;
        grid-template-columns: auto minmax(0, 1fr);
    }

    .city-card__devral {
        justify-self: end;
        max-width: 100%;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
}

@media (max-width: 420px) {
    .ticker__item {
        padding-inline: 10px;
    }

    .city-row__aside .reis-btn {
        display: none;
    }

    .maker-badge {
        right: max(10px, env(safe-area-inset-right));
        bottom: max(10px, env(safe-area-inset-bottom));
        min-height: 44px;
        gap: 8px;
        padding: 4px 5px 4px 11px;
    }

    .maker-badge__copy {
        font-size: 0.74rem;
    }

    .maker-badge__avatar {
        width: 32px;
        height: 32px;
        flex-basis: 32px;
    }
}

/* Şehir sıralaması: şehirleri tek bakışta karşılaştıran geniş kart düzeni. */
.leaderboard-page {
    max-width: 1040px;
}

.leaderboard-controls {
    padding: 18px 20px 14px;
    overflow: hidden;
}

.leaderboard-controls__top,
.leaderboard-controls__form {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}

.leaderboard-controls__top {
    margin-bottom: 14px;
}

.leaderboard-controls__top h2 {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 1.18rem;
    letter-spacing: -.035em;
}

.leaderboard-controls__top h2 .ico {
    width: 19px;
    height: 19px;
    color: var(--gold);
}

.leaderboard-controls__form {
    align-items: stretch;
}

.leaderboard-controls__form .search-box {
    flex: 1 1 340px;
}

.leaderboard-controls__form .select {
    width: 170px;
    flex: 0 0 170px;
}

.leaderboard-controls__form .btn {
    flex: 0 0 auto;
}

.leaderboard-controls__regions {
    margin-top: 14px;
    padding-top: 12px;
    border-top: 1px solid var(--line);
}

.leaderboard-list {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

/* Sıra numarası için ayrılan sol oluk kart gövdesinin dışında kalır.
   Filtre kutusunu gövdeyle aynı kenarlara hizalayalım. */
@media (min-width: 721px) {
    .leaderboard-page > .leaderboard-controls {
        margin-left: 54px;
    }

    .home-ranking__controls {
        margin-right: 12px;
        margin-left: 66px;
    }
}

.leaderboard-card {
    --board-bg: var(--surface);
    --board-line: var(--line);
    --board-accent: var(--gold);
    --board-accent-soft: var(--gold-soft);
    position: relative;
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr);
    gap: 10px;
    align-items: stretch;
}

.leaderboard-card--tone-1 {
    --board-bg: color-mix(in srgb, var(--mint-soft) 72%, var(--surface));
    --board-line: color-mix(in srgb, var(--mint) 36%, var(--line));
    --board-accent: var(--mint);
    --board-accent-soft: var(--mint-soft);
}

.leaderboard-card--tone-2 {
    --board-bg: color-mix(in srgb, #ffb27f 19%, var(--surface));
    --board-line: color-mix(in srgb, #ff8a3d 45%, var(--line));
    --board-accent: #f07b27;
    --board-accent-soft: rgba(240, 123, 39, .12);
}

.leaderboard-card--tone-3 {
    --board-bg: color-mix(in srgb, #ffd57b 22%, var(--surface));
    --board-line: color-mix(in srgb, #f0ac2f 44%, var(--line));
    --board-accent: #d98d13;
    --board-accent-soft: rgba(217, 141, 19, .12);
}

.leaderboard-card--tone-4 {
    --board-bg: color-mix(in srgb, var(--gold-soft) 78%, var(--surface));
    --board-line: color-mix(in srgb, var(--gold) 34%, var(--line));
    --board-accent: var(--gold);
    --board-accent-soft: var(--gold-soft);
}

.leaderboard-card--tone-5 {
    --board-bg: color-mix(in srgb, var(--crimson-soft) 72%, var(--surface));
    --board-line: color-mix(in srgb, var(--crimson) 38%, var(--line));
    --board-accent: var(--crimson);
    --board-accent-soft: var(--crimson-soft);
}

.leaderboard-card__rank {
    align-self: center;
    color: var(--board-accent);
    font-family: var(--mono);
    font-size: .93rem;
    font-weight: 900;
    text-align: center;
    letter-spacing: -.05em;
}

.leaderboard-card__panel {
    min-width: 0;
    padding: 17px 19px 15px;
    background: var(--board-bg);
    border: 1px solid var(--board-line);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-sm);
    transition: transform .18s var(--ease), box-shadow .18s var(--ease), border-color .18s var(--ease);
}

.leaderboard-card:hover .leaderboard-card__panel {
    transform: translateY(-1px);
    border-color: color-mix(in srgb, var(--board-accent) 62%, var(--board-line));
    box-shadow: var(--shadow);
}

.leaderboard-card.is-voted .leaderboard-card__panel {
    border-color: var(--mint);
    box-shadow: 0 0 0 3px var(--mint-soft), var(--shadow-sm);
}

.leaderboard-card__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}

.leaderboard-card__city,
.leaderboard-card__actions,
.leaderboard-card__votes,
.leaderboard-card__owner,
.leaderboard-card__vacant,
.leaderboard-card__history-row {
    display: flex;
    align-items: center;
}

.leaderboard-card__city {
    min-width: 0;
    flex-wrap: wrap;
    gap: 9px;
}

.leaderboard-card__plate {
    display: inline-grid;
    place-items: center;
    min-width: 35px;
    height: 29px;
    padding-inline: 7px;
    color: var(--board-accent);
    background: var(--board-accent-soft);
    border: 1px solid color-mix(in srgb, var(--board-accent) 32%, transparent);
    border-radius: 8px;
    font-family: var(--mono);
    font-size: .75rem;
    font-weight: 850;
}

.leaderboard-card__name {
    color: var(--text);
    font-size: 1.17rem;
    font-weight: 850;
    letter-spacing: -.035em;
}

.leaderboard-card__name:hover {
    color: var(--board-accent);
}

.leaderboard-card__districts {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    min-height: 27px;
    padding: 3px 9px;
    color: var(--board-accent);
    background: var(--surface);
    border: 1px solid color-mix(in srgb, var(--board-accent) 35%, var(--line));
    border-radius: 999px;
    font-size: .69rem;
    font-weight: 800;
}

.leaderboard-card__districts:hover {
    background: var(--board-accent-soft);
}

.leaderboard-card__districts .ico {
    width: 13px;
    height: 13px;
}

.leaderboard-card__actions {
    flex: 0 0 auto;
    gap: 12px;
}

.leaderboard-card__votes {
    gap: 7px;
    color: var(--text-3);
    white-space: nowrap;
}

.leaderboard-card__votes strong {
    color: var(--text);
    font-family: var(--mono);
    font-size: .82rem;
    font-weight: 850;
}

.leaderboard-card__votes span {
    font-size: .75rem;
}

.leaderboard-vote,
.leaderboard-reign {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: 38px;
    padding: 7px 13px;
    border-radius: 999px;
    font: inherit;
    font-size: .76rem;
    font-weight: 850;
    cursor: pointer;
    transition: background .15s var(--ease), color .15s var(--ease), border-color .15s var(--ease), transform .15s var(--ease);
}

.leaderboard-vote {
    color: var(--board-accent);
    background: var(--board-accent-soft);
    border: 1px solid color-mix(in srgb, var(--board-accent) 36%, var(--line));
}

.leaderboard-vote:hover,
.leaderboard-vote.is-voted {
    color: #fff;
    background: var(--board-accent);
    border-color: var(--board-accent);
}

.leaderboard-vote .ico {
    width: 15px;
    height: 15px;
}

.leaderboard-card__bar {
    position: relative;
    height: 5px;
    margin: 13px 0 12px;
    overflow: hidden;
    background: color-mix(in srgb, var(--board-accent) 13%, var(--surface));
    border-radius: 999px;
}

.leaderboard-card__bar span {
    position: absolute;
    inset: 0 auto 0 0;
    min-width: 10px;
    background: var(--board-accent);
    border-radius: inherit;
}

.leaderboard-card__owner-label {
    display: flex;
    align-items: center;
    gap: 5px;
    margin-bottom: 7px;
    color: var(--board-accent);
    font-size: .69rem;
    font-weight: 800;
}

.leaderboard-card__owner-label .ico {
    width: 13px;
    height: 13px;
}

.leaderboard-card__owner {
    min-width: 0;
    gap: 11px;
    padding: 10px 11px;
    background: color-mix(in srgb, var(--surface) 84%, transparent);
    border: 1px solid color-mix(in srgb, var(--board-accent) 13%, var(--line));
    border-radius: 12px;
}

.leaderboard-card__avatar {
    width: 40px;
    height: 40px;
    flex: 0 0 40px;
    display: grid;
    place-items: center;
    overflow: hidden;
    color: var(--board-accent);
    background: var(--board-accent-soft);
    border-radius: 10px;
}

.leaderboard-card__avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.leaderboard-card__avatar .ico {
    width: 20px;
    height: 20px;
}

.leaderboard-card__owner-copy {
    min-width: 0;
    flex: 1 1 auto;
    color: var(--text);
}

.leaderboard-card__owner-copy:hover strong {
    color: var(--board-accent);
}

.leaderboard-card__owner-copy strong,
.leaderboard-card__owner-copy span {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.leaderboard-card__owner-copy strong {
    font-size: .84rem;
}

.leaderboard-card__owner-copy span {
    margin-top: 2px;
    color: var(--text-3);
    font-size: .7rem;
}

.leaderboard-reign {
    flex: 0 0 auto;
    color: var(--board-accent);
    background: var(--surface);
    border: 1px solid color-mix(in srgb, var(--board-accent) 24%, var(--line));
}

.leaderboard-reign:hover {
    color: #fff;
    background: var(--board-accent);
    border-color: var(--board-accent);
    transform: translateY(-1px);
}

.leaderboard-reign .ico {
    width: 14px;
    height: 14px;
}

.leaderboard-card__vacant {
    justify-content: space-between;
    gap: 14px;
    padding: 10px 11px;
    background: color-mix(in srgb, var(--surface) 84%, transparent);
    border: 1px dashed color-mix(in srgb, var(--board-accent) 30%, var(--line));
    border-radius: 12px;
}

.leaderboard-card__vacant > div {
    min-width: 0;
}

.leaderboard-card__vacant strong,
.leaderboard-card__vacant span {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.leaderboard-card__vacant strong {
    color: var(--text-2);
    font-size: .78rem;
}

.leaderboard-card__vacant span {
    margin-top: 2px;
    color: var(--text-3);
    font-size: .69rem;
}

.leaderboard-reign--vacant {
    background: var(--board-accent-soft);
}

.leaderboard-card__history {
    margin-top: 9px;
    color: var(--text-3);
    font-size: .68rem;
}

.leaderboard-card__history-label {
    display: block;
    margin-bottom: 4px;
}

.leaderboard-card__history-row {
    justify-content: space-between;
    gap: 10px;
    padding: 5px 8px;
    background: color-mix(in srgb, var(--surface) 60%, transparent);
    border-radius: 7px;
}

.leaderboard-card__history-row .mono {
    flex: 0 0 auto;
    color: var(--text-3);
}

.leaderboard-card__history-more {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    margin-top: 5px;
    color: var(--board-accent);
    font-weight: 750;
}

.leaderboard-card__history-more .ico {
    width: 12px;
    height: 12px;
}

@media (max-width: 720px) {
    .leaderboard-page > .leaderboard-controls {
        margin-left: 35px;
    }

    .home-ranking__controls {
        margin-right: 12px;
        margin-left: 47px;
    }

    .leaderboard-controls__form {
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    }

    .leaderboard-controls__form .search-box,
    .leaderboard-controls__form .btn {
        grid-column: 1 / -1;
    }

    .leaderboard-controls__form .select {
        width: 100%;
        flex-basis: auto;
    }

    .leaderboard-card {
        grid-template-columns: 30px minmax(0, 1fr);
        gap: 5px;
        min-width: 0;
        max-width: 100%;
    }

    .leaderboard-card__panel {
        width: 100%;
        max-width: 100%;
        padding: 14px 13px 13px;
    }

    .leaderboard-card__head {
        min-width: 0;
        max-width: 100%;
        align-items: flex-start;
        flex-direction: column;
        gap: 10px;
    }

    .leaderboard-card__city {
        width: 100%;
        max-width: 100%;
    }

    .leaderboard-card__name {
        min-width: 0;
        max-width: 100%;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .leaderboard-card__actions {
        min-width: 0;
        max-width: 100%;
        width: 100%;
        justify-content: space-between;
    }

    .leaderboard-card__owner {
        align-items: flex-start;
        flex-wrap: wrap;
    }

    .leaderboard-card__owner-copy {
        max-width: none;
    }

    .leaderboard-card__owner .leaderboard-reign {
        width: 100%;
        max-width: 100%;
    }

    .leaderboard-card__vacant {
        min-width: 0;
        max-width: 100%;
        align-items: flex-start;
        flex-direction: column;
    }

    .leaderboard-card__vacant > div {
        width: 100%;
        max-width: 100%;
    }

    .leaderboard-card__vacant strong,
    .leaderboard-card__vacant span {
        max-width: 100%;
    }

    .leaderboard-card__vacant .leaderboard-reign {
        width: 100%;
        max-width: 100%;
    }

    .leaderboard-card__history-row > .truncate {
        min-width: 0;
    }
}

@media (max-width: 420px) {
    .leaderboard-controls {
        padding-inline: 13px;
    }

    .leaderboard-controls__top h2 {
        font-size: 1rem;
    }

    .leaderboard-card__rank {
        font-size: .78rem;
    }

    .leaderboard-card__name {
        font-size: 1.03rem;
    }

    .leaderboard-card__votes {
        gap: 4px;
    }

    .leaderboard-vote {
        min-height: 35px;
        padding-inline: 10px;
    }
}

@media print {
    .site-header,
    .ticker,
    .site-footer,
    .board-tabs,
    .vote-btn,
    .reis-btn,
    .toast-stack,
    .feed-stack,
    .maker-badge {
        display: none !important;
    }

    body {
        background: #fff;
        color: #000;
    }
}

.admin-body,
.admin-auth-body {
    --admin-orange: #f08a3a;
    --admin-orange-soft: rgba(240, 138, 58, 0.10);
    --admin-orange-line: rgba(240, 138, 58, 0.28);
    background:
        radial-gradient(circle at 78% -20%, rgba(240, 138, 58, 0.07), transparent 34rem),
        var(--ink);
}

.admin-body {
    display: block;
    min-width: 320px;
}

.admin-auth-body {
    display: grid;
    place-items: center;
    padding: 34px 18px;
}

.admin-auth-shell {
    width: min(100%, 430px);
}

.admin-auth-brand,
.admin-brand {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    font-weight: 900;
    letter-spacing: -0.04em;
}

.admin-auth-brand {
    width: 100%;
    justify-content: center;
    margin-bottom: 20px;
    font-size: 1.26rem;
}

.admin-auth-brand .ico,
.admin-brand > .ico {
    color: var(--admin-orange);
}

.admin-auth-brand span span,
.admin-brand > span span {
    color: var(--admin-orange);
}

.admin-auth-card {
    padding: 28px;
    background: color-mix(in srgb, var(--surface) 94%, transparent);
    border: 1px solid var(--line-strong);
    border-radius: 20px;
    box-shadow: 0 28px 80px rgba(0, 0, 0, 0.28);
    backdrop-filter: blur(16px);
}

.admin-auth-card__head {
    display: flex;
    gap: 14px;
    margin-bottom: 24px;
}

.admin-auth-card__icon {
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    flex: none;
    color: var(--admin-orange);
    background: var(--admin-orange-soft);
    border: 1px solid var(--admin-orange-line);
    border-radius: 12px;
}

.admin-auth-card__icon .ico {
    width: 20px;
    height: 20px;
}

.admin-auth-card h1 {
    margin: 2px 0 4px;
    font-size: 1.45rem;
    letter-spacing: -0.035em;
}

.admin-auth-card__head p:last-child,
.admin-auth-foot {
    color: var(--text-3);
    font-size: .8rem;
}

.admin-auth-foot {
    margin-top: 16px;
    text-align: center;
}

.admin-topbar {
    position: sticky;
    top: 0;
    z-index: 80;
    border-bottom: 1px solid var(--line);
    background: color-mix(in srgb, var(--ink) 88%, transparent);
    backdrop-filter: blur(20px);
}

.admin-topbar__inner {
    width: min(100%, 1480px);
    min-height: 68px;
    margin: auto;
    padding: 9px 20px;
    display: flex;
    align-items: center;
    gap: 22px;
}

.admin-brand {
    flex: none;
    font-size: 1.03rem;
}

.admin-brand small {
    margin-left: 2px;
    padding-left: 10px;
    border-left: 1px solid var(--line-strong);
    color: var(--text-3);
    font-size: .66rem;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.admin-nav {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 3px;
    overflow-x: auto;
    scrollbar-width: none;
}

.admin-nav::-webkit-scrollbar { display: none; }

.admin-nav__link {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 8px 10px;
    color: var(--text-3);
    font-size: .78rem;
    font-weight: 700;
    border-radius: 8px;
    white-space: nowrap;
    transition: color .15s ease, background .15s ease;
}

.admin-nav__link:hover {
    color: var(--text);
    background: var(--surface-2);
}

.admin-nav__link.is-active {
    color: var(--text);
    background: var(--surface-3);
}

.admin-nav__link.is-active .ico {
    color: var(--admin-orange);
}

.admin-user {
    margin-left: auto;
    display: flex;
    align-items: center;
    gap: 6px;
}

.admin-user__account {
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 5px 8px;
    border-radius: 9px;
}

.admin-user__account:hover,
.admin-user__account.is-active { background: var(--surface-2); }

.admin-user__avatar,
.admin-profile__avatar {
    display: grid;
    place-items: center;
    color: var(--accent-ink);
    background: var(--gold);
    font-family: var(--mono);
    font-weight: 900;
    border-radius: 9px;
}

.admin-user__avatar { width: 34px; height: 34px; }
.admin-user__account > span:last-child { display: flex; flex-direction: column; line-height: 1.25; }
.admin-user__account strong { font-size: .76rem; }
.admin-user__account small { color: var(--text-3); font-size: .66rem; }

.admin-main { padding: 30px 0 70px; }
.admin-container { width: min(100%, 1320px); margin: auto; padding-inline: 20px; }

.admin-page-head {
    min-height: 74px;
    margin-bottom: 22px;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 20px;
}

.admin-page-head h1 {
    margin: 3px 0 3px;
    font-size: clamp(1.7rem, 2.6vw, 2.35rem);
    line-height: 1.1;
    letter-spacing: -0.05em;
}

.admin-page-head h1 .plate { vertical-align: .28em; }
.admin-page-head p:last-child { color: var(--text-2); font-size: .88rem; }

.admin-alert {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 14px;
    padding: 11px 13px;
    color: var(--text-2);
    background: var(--surface-2);
    border: 1px solid var(--line);
    border-radius: 9px;
    font-size: .82rem;
}

.admin-alert--success { color: var(--mint); border-color: color-mix(in srgb, var(--mint) 40%, var(--line)); background: var(--mint-soft); }
.admin-alert--warning { color: var(--admin-orange); border-color: var(--admin-orange-line); background: var(--admin-orange-soft); }
.admin-alert--error { color: var(--crimson); border-color: color-mix(in srgb, var(--crimson) 42%, var(--line)); background: var(--crimson-soft); }

.admin-stat-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    margin-bottom: 14px;
}

.admin-stat-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }

.admin-stat {
    min-height: 114px;
    padding: 17px 18px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: 13px;
    box-shadow: var(--shadow-sm);
}

.admin-stat > span {
    color: var(--text-3);
    font-size: .66rem;
    font-weight: 800;
    letter-spacing: .09em;
    text-transform: uppercase;
}

.admin-stat strong {
    font-family: var(--mono);
    font-size: 1.65rem;
    line-height: 1;
    letter-spacing: -.05em;
}

.admin-stat strong em { color: var(--text-3); font-size: .8rem; font-style: normal; }
.admin-stat small { color: var(--text-3); font-size: .7rem; }
.admin-accent { color: var(--admin-orange) !important; }

.admin-grid { display: grid; gap: 14px; margin-bottom: 14px; }
.admin-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.admin-grid--form { grid-template-columns: minmax(0, 1.6fr) minmax(290px, .7fr); }
.admin-grid--votes { grid-template-columns: minmax(0, 1.6fr) minmax(300px, .65fr); }

.admin-panel {
    margin-bottom: 14px;
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: 13px;
    box-shadow: var(--shadow-sm);
    overflow: hidden;
}

.admin-grid > .admin-panel { margin-bottom: 0; }

.admin-panel__head {
    min-height: 62px;
    padding: 13px 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    border-bottom: 1px solid var(--line);
}

.admin-panel__head h2 {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: .91rem;
    letter-spacing: -.02em;
}

.admin-panel__head h2 .ico { color: var(--admin-orange); }
.admin-panel__head p { margin-top: 2px; color: var(--text-3); font-size: .7rem; }
.admin-panel__head > a { color: var(--admin-orange); font-size: .73rem; font-weight: 800; }
.admin-panel__body { padding: 17px; }
.admin-brand-assets { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; }
.admin-brand-asset { min-width: 0; padding: 14px; background: var(--surface-2); border: 1px solid var(--line); border-radius: 11px; }
.admin-brand-asset__top { min-height: 66px; display: flex; align-items: center; gap: 12px; margin-bottom: 14px; }
.admin-brand-asset__top h3 { font-size: .83rem; letter-spacing: -.015em; }
.admin-brand-asset__top p { margin-top: 3px; color: var(--text-3); font-size: .68rem; line-height: 1.4; }
.admin-brand-asset__preview { display: grid; place-items: center; flex: none; width: 66px; height: 66px; padding: 9px; background: var(--ink-2); border: 1px solid var(--line-strong); border-radius: 11px; overflow: hidden; }
.admin-brand-asset__preview img { display: block; max-width: 100%; max-height: 100%; object-fit: contain; }
.admin-brand-asset__preview--logo img { width: 100%; height: 100%; }
.admin-brand-asset__preview--favicon img { width: 42px; height: 42px; }
.admin-file-input { padding: 7px; font-size: .76rem; cursor: pointer; }
.admin-file-input::file-selector-button { margin: -1px 9px -1px -1px; padding: 6px 9px; color: var(--text-2); background: var(--surface-3); border: 1px solid var(--line-strong); border-radius: 6px; font: inherit; font-weight: 700; cursor: pointer; }
.admin-brand-size-control { display: flex; align-items: center; gap: 8px; }
.admin-brand-size-control .input { width: 112px; }
.admin-brand-size-control > span { color: var(--text-3); font: 700 .76rem var(--mono); }
.admin-brand-asset__remove { margin-top: 13px; padding-top: 12px; border-top: 1px solid var(--line); }
.admin-city-price { margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--line); }
.admin-city-price__head { margin-bottom: 11px; }
.admin-city-price__head h3 { font-size: .82rem; letter-spacing: -.015em; }
.admin-city-price__head p { margin-top: 3px; color: var(--text-3); font-size: .7rem; }
.admin-city-price__note { display: block; margin-top: 10px; color: var(--text-3); font-size: .68rem; line-height: 1.45; }
.admin-panel__meta { padding: 8px 16px; color: var(--text-3); border-top: 1px solid var(--line); font-size: .7rem; }
.admin-funnel-details { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(260px, .75fr); border-top: 1px solid var(--line); }
.admin-funnel-details__section { min-width: 0; padding: 12px 16px; }
.admin-funnel-details__section + .admin-funnel-details__section { border-left: 1px solid var(--line); }
.admin-funnel-details__head { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; margin-bottom: 5px; font-size: .74rem; }
.admin-funnel-details__head small { color: var(--text-3); font-size: .64rem; }
.admin-funnel-row { min-height: 38px; display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: 10px; border-bottom: 1px solid var(--line); font-size: .7rem; }
.admin-funnel-row:last-child { border-bottom: 0; }
.admin-funnel-row > span { min-width: 0; display: flex; flex-direction: column; }
.admin-funnel-row > span strong,
.admin-funnel-row > span small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.admin-funnel-row > span small { color: var(--text-3); font-size: .63rem; }
.admin-funnel-row em { color: var(--text-3); font-size: .64rem; font-style: normal; white-space: nowrap; }
.admin-funnel-empty { padding: 8px 0 2px; color: var(--text-3); font-size: .68rem; }

.admin-list { display: flex; flex-direction: column; }
.admin-list__row { min-height: 58px; padding: 10px 15px; display: flex; align-items: center; gap: 10px; border-bottom: 1px solid var(--line); font-size: .78rem; }
.admin-list__row:last-child { border-bottom: 0; }
a.admin-list__row:hover { background: var(--surface-2); }
.admin-list__row > span.grow { display: flex; flex-direction: column; min-width: 0; }
.admin-list__row small { color: var(--text-3); font-size: .68rem; }

.admin-health-grid { padding: 9px 15px; }
.admin-health { min-height: 42px; display: grid; grid-template-columns: 9px 1fr auto; align-items: center; gap: 9px; border-bottom: 1px solid var(--line); font-size: .77rem; }
.admin-health:last-child { border-bottom: 0; }
.admin-health strong { color: var(--text-3); font-size: .68rem; }
.admin-status { width: 7px; height: 7px; border-radius: 50%; background: var(--text-3); box-shadow: 0 0 0 4px color-mix(in srgb, var(--text-3) 12%, transparent); }
.admin-status.is-ok { background: var(--mint); box-shadow: 0 0 0 4px var(--mint-soft); }
.admin-status.is-warn { background: var(--admin-orange); box-shadow: 0 0 0 4px var(--admin-orange-soft); }

.admin-table-link { display: inline-flex; align-items: center; gap: 8px; }
.admin-table-link:hover strong,
.admin-table-link:hover { color: var(--admin-orange); }
.admin-table-link > span:last-child { display: flex; flex-direction: column; }
.admin-table-link small,
.admin-table-sub { display: block; margin-top: 2px; color: var(--text-3); font-size: .66rem; font-weight: 500; }

.admin-filters {
    padding: 14px 16px;
    display: flex;
    align-items: flex-end;
    gap: 10px;
}

.admin-filters .field:not(.grow) { min-width: 170px; }
.admin-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; }
.admin-form-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }

.admin-detail { min-height: 42px; display: flex; align-items: center; justify-content: space-between; gap: 12px; border-bottom: 1px solid var(--line); font-size: .78rem; }
.admin-detail:last-child { border-bottom: 0; }
.admin-detail > span { color: var(--text-3); }

.admin-disclosure > summary {
    min-height: 68px;
    padding: 14px 17px;
    display: flex;
    align-items: center;
    gap: 12px;
    cursor: pointer;
    list-style: none;
}
.admin-disclosure > summary::-webkit-details-marker { display: none; }
.admin-disclosure > summary > .ico:first-child { color: var(--admin-orange); }
.admin-disclosure > summary > span { display: flex; flex-direction: column; flex: 1; }
.admin-disclosure > summary small { color: var(--text-3); font-size: .7rem; }
.admin-disclosure[open] > summary { border-bottom: 1px solid var(--line); }
.admin-disclosure[open] > summary > .ico:last-child { transform: rotate(90deg); }

.admin-tabs { padding: 8px; display: flex; gap: 3px; border-bottom: 1px solid var(--line); overflow-x: auto; }
.admin-tabs a { padding: 6px 10px; color: var(--text-3); border-radius: 7px; font-size: .74rem; font-weight: 700; white-space: nowrap; }
.admin-tabs a:hover { color: var(--text); background: var(--surface-2); }
.admin-tabs a.is-active { color: var(--text); background: var(--surface-3); }

.admin-card-list { padding: 10px; display: flex; flex-direction: column; gap: 8px; }
.admin-record { border: 1px solid var(--line); border-radius: 10px; overflow: hidden; }
.admin-record__head { min-height: 58px; padding: 10px 12px; display: flex; align-items: center; gap: 12px; background: var(--surface-2); }
.admin-record__head small { display: block; color: var(--text-3); font-size: .67rem; }
.admin-record__form { padding: 12px; display: grid; grid-template-columns: 1fr 1.3fr 1fr auto; gap: 8px; align-items: start; }
.admin-record__form .textarea { grid-column: 1 / -2; min-height: 58px; }
.admin-record__danger { padding: 9px 12px; display: flex; align-items: center; justify-content: flex-end; gap: 14px; border-top: 1px solid var(--line); }

.admin-integration { margin-bottom: 14px; padding: 10px 13px; display: flex; align-items: center; gap: 9px; color: var(--text-2); background: var(--surface); border: 1px solid var(--line); border-radius: 10px; font-size: .75rem; }
.admin-integration.is-ready { border-color: color-mix(in srgb, var(--mint) 30%, var(--line)); }
.admin-integration.is-warn { border-color: var(--admin-orange-line); }

.admin-region-list { padding: 10px 15px; }
.admin-region-list > div { min-height: 50px; display: grid; grid-template-columns: 118px 1fr 45px; align-items: center; gap: 10px; border-bottom: 1px solid var(--line); font-size: .73rem; }
.admin-region-list > div:last-child { border-bottom: 0; }
.admin-region-list > div > span:first-child { display: flex; flex-direction: column; }
.admin-region-list small { color: var(--text-3); font-size: .65rem; }
.admin-region-list .grow { height: 5px; background: var(--surface-3); border-radius: 99px; overflow: hidden; }
.admin-region-list i { display: block; height: 100%; background: var(--admin-orange); border-radius: inherit; }

.admin-savebar { position: sticky; bottom: 14px; z-index: 20; padding: 10px 12px 10px 16px; display: flex; align-items: center; justify-content: space-between; gap: 14px; color: var(--text-3); background: color-mix(in srgb, var(--surface) 92%, transparent); border: 1px solid var(--line-strong); border-radius: 12px; box-shadow: var(--shadow); backdrop-filter: blur(16px); font-size: .76rem; }

.admin-profile { display: flex; align-items: center; gap: 12px; padding-bottom: 14px; border-bottom: 1px solid var(--line); }
.admin-profile__avatar { width: 48px; height: 48px; font-size: 1.15rem; }
.admin-profile > div { flex: 1; display: flex; flex-direction: column; }
.admin-profile small { color: var(--text-3); }
.admin-file-icon { display: grid; place-items: center; width: 34px; height: 34px; color: var(--admin-orange); background: var(--admin-orange-soft); border-radius: 8px; }

.admin-pagination { padding: 12px 15px; display: flex; justify-content: center; gap: 5px; border-top: 1px solid var(--line); }
.admin-pagination a { display: grid; place-items: center; min-width: 32px; height: 32px; color: var(--text-3); border: 1px solid var(--line); border-radius: 7px; font-family: var(--mono); font-size: .72rem; }
.admin-pagination a:hover { color: var(--text); background: var(--surface-2); }
.admin-pagination a.is-active { color: var(--accent-ink); background: var(--gold); border-color: var(--gold); }

@media (max-width: 1120px) {
    .admin-user__account > span:last-child,
    .admin-brand small { display: none; }
    .admin-record__form { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .admin-record__form .textarea { grid-column: 1 / -1; }
}

@media (max-width: 900px) {
    .admin-topbar__inner { flex-wrap: wrap; gap: 7px 12px; }
    .admin-brand { order: 1; }
    .admin-user { order: 2; }
    .admin-nav { order: 3; width: 100%; padding-top: 3px; border-top: 1px solid var(--line); }
    .admin-nav__link { flex: 0 0 auto; }
    .admin-main { padding-top: 22px; }
    .admin-stat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .admin-grid--2,
    .admin-grid--form,
    .admin-grid--votes { grid-template-columns: 1fr; }
    .admin-funnel-details { grid-template-columns: 1fr; }
    .admin-funnel-details__section + .admin-funnel-details__section { border-top: 1px solid var(--line); border-left: 0; }
    .admin-form-grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 640px) {
    .admin-topbar__inner,
    .admin-container { padding-inline: 12px; }
    .admin-auth-card { padding: 22px 18px; }
    .admin-page-head { align-items: flex-start; flex-direction: column; }
    .admin-page-head > .row { flex-wrap: wrap; }
    .admin-stat-grid,
    .admin-stat-grid--3,
    .admin-stat-grid--4 { grid-template-columns: 1fr 1fr; }
    .admin-stat { min-height: 100px; }
    .admin-filters { align-items: stretch; flex-direction: column; }
    .admin-filters .field:not(.grow) { min-width: 0; }
    .admin-form-grid,
    .admin-form-grid--4 { grid-template-columns: 1fr; }
    .admin-brand-assets { grid-template-columns: 1fr; }
    .admin-record__head { align-items: flex-start; flex-wrap: wrap; }
    .admin-record__form { grid-template-columns: 1fr; }
    .admin-record__form .textarea { grid-column: auto; }
    .admin-record__danger { align-items: stretch; flex-direction: column; }
    .admin-integration { flex-wrap: wrap; }
    .admin-savebar { align-items: stretch; flex-direction: column; }
    .admin-savebar .btn { width: 100%; }
}

@media (max-width: 410px) {
    .admin-stat-grid,
    .admin-stat-grid--3,
    .admin-stat-grid--4 { grid-template-columns: 1fr; }
    .admin-user__account { display: none; }
}

.city-hero__region { font-size: 1rem; }
.city-history { margin-top: 10px; }
.city-detail-columns { margin-top: 24px; }

.district-explorer {
    --district-0: #fce8ea;
    --district-1: #f9d2d6;
    --district-2: #f3b5bc;
    --district-3: #ec929c;
    --district-4: #e56d79;
    --district-5: #d94350;
    margin-top: 24px;
    overflow: hidden;
    border-radius: var(--radius-xl);
}

:root:not([data-theme="light"]) .district-explorer {
    --district-0: #30171a;
    --district-1: #421b20;
    --district-2: #582027;
    --district-3: #71262f;
    --district-4: #902e39;
    --district-5: #b63a46;
}

.district-explorer__head,
.district-reis-panel__head,
.district-directory__toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 22px;
}

.district-explorer__head {
    min-height: 102px;
    padding: 20px 24px;
    border-bottom: 1px solid var(--line);
}

.district-explorer__head .eyebrow,
.district-directory__toolbar .eyebrow {
    display: block;
    margin-bottom: 3px;
    color: var(--gold);
    font-family: var(--mono);
    font-size: .67rem;
    font-weight: 800;
    letter-spacing: .1em;
    text-transform: uppercase;
}

.district-explorer__head .card__title { font-size: 1.15rem; }
.district-explorer__head p,
.district-reis-panel__head p { margin-top: 3px; color: var(--text-3); font-size: .78rem; }

.district-map-legend { display: flex; align-items: center; gap: 14px; color: var(--text-3); font-size: .72rem; font-weight: 700; white-space: nowrap; }
.district-map-legend span { display: inline-flex; align-items: center; gap: 6px; }
.district-map-legend i { width: 12px; height: 12px; background: var(--district-2); border: 1px solid var(--line-strong); border-radius: 4px; }
.district-map-legend i.is-owned { background: var(--gold); border-color: var(--gold); box-shadow: 0 0 0 3px var(--gold-soft); }

.district-map-layout {
    min-height: 560px;
    padding: 24px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 300px;
    gap: 22px;
    align-items: start;
    background:
        radial-gradient(circle at 45% 45%, var(--gold-soft), transparent 36%),
        var(--surface-2);
}

.district-map-viewport {
    min-width: 0;
    min-height: 510px;
    display: grid;
    place-items: center;
    overflow: auto hidden;
    overscroll-behavior-inline: contain;
    scrollbar-width: thin;
}

.district-map-canvas { width: 100%; min-width: 620px; }
.district-map { width: 100%; height: auto; max-height: 620px; display: block; overflow: visible; }
.district-map__area { cursor: pointer; outline: none; }
.district-map__area path {
    fill: var(--district-0);
    stroke: color-mix(in srgb, var(--surface) 82%, transparent);
    stroke-width: 1.5;
    vector-effect: non-scaling-stroke;
    transition: fill .18s var(--ease), filter .18s var(--ease), stroke .18s var(--ease);
}
.district-map__area.district-heat-1 path { fill: var(--district-1); }
.district-map__area.district-heat-2 path { fill: var(--district-2); }
.district-map__area.district-heat-3 path { fill: var(--district-3); }
.district-map__area.district-heat-4 path { fill: var(--district-4); }
.district-map__area.district-heat-5 path { fill: var(--district-5); }
.district-map__area.is-owned path { filter: saturate(1.14); }
.district-map__area:hover path,
.district-map__area:focus-visible path { fill: color-mix(in srgb, var(--gold) 78%, #fff); stroke: var(--gold-2); stroke-width: 2.8; filter: drop-shadow(0 6px 10px var(--gold-soft)); }
.district-map__area.is-selected path { fill: var(--gold); stroke: var(--text); stroke-width: 3; filter: drop-shadow(0 8px 14px var(--gold-line)); }

.district-map__labels,
.district-map__markers { pointer-events: none; }
.district-map__labels text {
    fill: var(--text);
    stroke: color-mix(in srgb, var(--surface) 88%, transparent);
    stroke-width: 3px;
    paint-order: stroke fill;
    text-anchor: middle;
    dominant-baseline: central;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: -.02em;
}

.district-map-marker__halo { fill: var(--marker-halo); }
.district-map-marker__ring { fill: var(--marker-accent); stroke: var(--surface); stroke-width: 2; }
.district-map-marker__face { fill: var(--surface); }
.district-map-marker image { clip-path: circle(12px); }
.district-map-marker text { fill: var(--text); text-anchor: middle; font-size: 11px; font-weight: 900; }
.district-map-marker__crown { fill: var(--marker-accent); stroke: var(--marker-accent-2); stroke-width: 1; }

.district-map-selection {
    position: sticky;
    top: calc(var(--header-h) + 18px);
    min-height: 250px;
    padding: 18px;
    background: color-mix(in srgb, var(--surface) 94%, transparent);
    border: 1px solid var(--line-strong);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow);
    backdrop-filter: blur(18px);
}

.district-map-selection__empty { min-height: 212px; display: flex; align-items: center; justify-content: center; flex-direction: column; text-align: center; }
.district-map-selection__empty strong { margin-top: 10px; font-size: 1rem; }
.district-map-selection__empty p { max-width: 190px; margin-top: 4px; color: var(--text-3); font-size: .75rem; }
.district-map-selection__icon,
.district-map-selection__vacant-icon { width: 42px; height: 42px; display: grid; place-items: center; color: var(--gold); background: var(--gold-soft); border-radius: 13px; }
.district-map-selection__vacant-icon .ico { width: 20px; height: 20px; }
.district-map-selection__top { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; }
.district-map-selection__kicker { color: var(--gold); font-size: .66rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.district-map-selection h3 { margin-top: 1px; font-size: 1.42rem; letter-spacing: -.045em; }
.district-map-selection__reis { min-height: 74px; margin-top: 17px; padding: 12px; display: flex; align-items: center; gap: 10px; background: var(--surface-2); border: 1px solid var(--line); border-radius: 12px; }
.district-map-selection__reis img { width: 42px; height: 42px; object-fit: cover; border-radius: 12px; }
.district-map-selection__reis > div { min-width: 0; flex: 1; }
.district-map-selection__reis span { display: block; color: var(--text-3); font-size: .66rem; }
.district-map-selection__reis strong { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .84rem; }
.district-map-selection__price { color: var(--gold); font-family: var(--mono); font-size: .86rem; }
.district-map-selection__actions { margin-top: 13px; display: grid; grid-template-columns: .8fr 1.2fr; gap: 8px; }
.district-map-selection__actions .btn { min-width: 0; padding-inline: 10px; }

.district-reis-panel { margin-top: 18px; overflow: hidden; border-radius: var(--radius-xl); }
.district-reis-panel__head { min-height: 86px; padding: 16px 20px; border-bottom: 1px solid var(--line); }
.district-reis-panel__head .card__title { flex-wrap: wrap; }
.count-pill { padding: 3px 7px; color: var(--gold); background: var(--gold-soft); border-radius: 99px; font-family: var(--mono); font-size: .68rem; }
.district-sort { padding: 4px; display: flex; gap: 3px; background: var(--surface-2); border: 1px solid var(--line); border-radius: 11px; }
.district-sort button { min-height: 34px; padding: 5px 11px; display: inline-flex; align-items: center; gap: 6px; color: var(--text-3); background: transparent; border: 0; border-radius: 8px; font: inherit; font-size: .71rem; font-weight: 800; cursor: pointer; white-space: nowrap; }
.district-sort button:hover { color: var(--text); }
.district-sort button.is-active { color: var(--accent-ink); background: var(--text); box-shadow: var(--shadow-sm); }
[data-theme="light"] .district-sort button.is-active { color: #fff; background: #19191d; }

.district-owner-grid { max-height: 470px; padding: 14px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; overflow-y: auto; }
.district-reis-card { padding: 13px; background: var(--surface-2); border: 1px solid var(--line); border-radius: 12px; transition: border-color .18s var(--ease), transform .18s var(--ease); }
.district-reis-card:hover { border-color: var(--gold-line); transform: translateY(-1px); }
.district-reis-card__head,
.district-reis-card__profile { display: flex; align-items: center; gap: 10px; }
.district-reis-card__head { justify-content: space-between; padding-bottom: 9px; border-bottom: 1px solid var(--line); font-size: .78rem; }
.district-reis-card__head span { color: var(--gold); font-family: var(--mono); }
.district-reis-card__profile { padding-top: 10px; }
.district-reis-card__profile img,
.district-reis-card__fallback { width: 38px; height: 38px; flex: 0 0 38px; object-fit: cover; border-radius: 10px; }
.district-reis-card__fallback { display: grid; place-items: center; color: var(--gold); background: var(--gold-soft); }
.district-reis-card__profile b,
.district-reis-card__profile small { display: block; max-width: 230px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.district-reis-card__profile b { font-size: .8rem; }
.district-reis-card__profile small { color: var(--text-3); font-size: .66rem; }
.district-reis-empty { min-height: 140px; padding: 24px; display: flex; align-items: center; justify-content: center; gap: 13px; text-align: left; }
.district-reis-empty > span { width: 44px; height: 44px; display: grid; place-items: center; color: var(--gold); background: var(--gold-soft); border-radius: 13px; }
.district-reis-empty p { color: var(--text-3); font-size: .75rem; }

.district-directory { margin-top: 28px; }
.district-directory__toolbar { margin-bottom: 14px; }
.district-directory__toolbar h2 { font-size: 1.35rem; letter-spacing: -.04em; }
.district-search { width: min(390px, 46%); min-height: 44px; padding: 0 13px; display: flex; align-items: center; gap: 9px; background: var(--surface); border: 1px solid var(--line); border-radius: 12px; }
.district-search:focus-within { border-color: var(--gold); box-shadow: 0 0 0 3px var(--gold-soft); }
.district-search .ico { color: var(--text-3); }
.district-search input { min-width: 0; flex: 1; color: var(--text); background: transparent; border: 0; outline: 0; font: inherit; }
.district-search input::placeholder { color: var(--text-3); }
.district-directory__list { display: grid; gap: 9px; }
.district-directory-row { min-height: 102px; padding: 13px 15px; display: grid; grid-template-columns: 48px minmax(0, 1fr) auto; align-items: center; gap: 14px; background: var(--surface); border: 1px solid var(--line); border-radius: 14px; box-shadow: var(--shadow-sm); }
.district-directory-row:hover { border-color: var(--gold-line); }
.district-directory-row__rank { color: var(--text-3); font-family: var(--mono); font-size: .78rem; font-weight: 800; }
.district-directory-row__main { min-width: 0; display: grid; grid-template-columns: minmax(160px, .6fr) minmax(180px, 1fr); align-items: center; gap: 14px; }
.district-directory-row__title strong,
.district-directory-row__title small,
.district-directory-row__owner b,
.district-directory-row__owner small { display: block; }
.district-directory-row__title strong { font-size: .92rem; }
.district-directory-row__title small { margin-top: 2px; color: var(--text-3); font-size: .68rem; }
.district-directory-row__owner { min-width: 0; display: flex; align-items: center; gap: 9px; }
.district-directory-row__owner img { width: 34px; height: 34px; flex: 0 0 34px; object-fit: cover; border-radius: 9px; }
.district-directory-row__owner span { min-width: 0; }
.district-directory-row__owner b,
.district-directory-row__owner small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.district-directory-row__owner b { font-size: .78rem; }
.district-directory-row__owner small,
.district-directory-row__vacant { color: var(--text-3); font-size: .68rem; }
.district-directory-row__aside { display: flex; align-items: center; gap: 10px; }
.district-directory-row__aside > span { color: var(--gold); font-family: var(--mono); font-size: .84rem; }
.district-directory__no-result { padding: 32px; color: var(--text-3); text-align: center; }

@media (max-width: 900px) {
    .district-map-layout { grid-template-columns: 1fr; min-height: 0; }
    .district-map-selection { position: static; min-height: 0; }
    .district-map-selection__empty { min-height: 120px; }
    .district-owner-grid { grid-template-columns: 1fr; }
    .district-reis-panel__head { align-items: flex-start; flex-direction: column; }
    .district-sort { max-width: 100%; overflow-x: auto; }
}

@media (max-width: 640px) {
    .analytics-consent { right: 10px; bottom: 10px; width: calc(100vw - 20px); align-items: stretch; flex-direction: column; gap: 10px; }
    .analytics-consent .row { justify-content: flex-end; }
    .district-explorer { margin-inline: -12px; border-radius: 0; }
    .district-explorer__head { min-height: 0; padding: 16px; align-items: flex-start; flex-direction: column; }
    .district-map-legend { align-self: stretch; justify-content: flex-end; }
    .district-map-layout { padding: 12px; gap: 12px; }
    .district-map-viewport { min-height: 390px; display: block; padding-block: 10px; overflow-x: hidden; }
    .district-map-canvas { width: 100%; max-width: 100%; min-width: min(720px, 100%); }
    .district-map { max-height: 440px; }
    .district-map__labels text { font-size: 12px; }
    .district-map-selection { padding: 14px; }
    .district-map-selection__actions { grid-template-columns: 1fr; }
    .district-reis-panel { margin-inline: -4px; }
    .district-reis-panel__head { padding: 15px; }
    .district-owner-grid { max-height: 420px; padding: 10px; }
    .district-reis-card__profile { flex-wrap: wrap; }
    .district-reis-card__profile .btn { width: 100%; }
    .district-directory { margin-top: 24px; }
    .district-directory__toolbar { align-items: stretch; flex-direction: column; }
    .district-search { width: 100%; }
    .district-directory-row { grid-template-columns: 34px minmax(0, 1fr); gap: 10px; }
    .district-directory-row__main { grid-template-columns: 1fr; gap: 7px; }
    .district-directory-row__aside { grid-column: 2; justify-content: space-between; }
    .city-detail-columns { margin-top: 20px; }
}

/* Harita araçları, mobilde mevcut yatay kaydırmayı da koruyacak şekilde
   yakınlaştırılmış sahnenin tamamını erişilebilir bırakır. */
.map-wrap.is-zoomed,
.map-wrap:fullscreen,
.map-wrap:-webkit-full-screen {
    overflow: auto;
}

.map-wrap:fullscreen,
.map-wrap:-webkit-full-screen {
    min-height: 100dvh;
    padding: 46px;
    display: grid;
    place-items: center;
    background: var(--surface);
}

.map-wrap:fullscreen .map-zoom-stage,
.map-wrap:-webkit-full-screen .map-zoom-stage {
    max-width: 1280px;
}

.map-wrap:fullscreen .map-controls,
.map-wrap:-webkit-full-screen .map-controls {
    top: 28px;
    left: 28px;
}

.map-wrap:fullscreen .map-control--fullscreen,
.map-wrap:-webkit-full-screen .map-control--fullscreen {
    right: 28px;
    bottom: 28px;
}

/*
 * Türkiye plaka işareti
 *
 * Şehir kodları artık düz metin rozet yerine gerçek plaka oranlarına sahip
 * inline SVG olarak çizilir. Beyaz gövde ve mavi TR alanı, açık/koyu temada
 * okunaklı kalır; ölçüler bağlama göre küçültülerek mobil taşma engellenir.
 */
.tr-plate-svg {
    display: block;
    width: 78px;
    height: auto;
    max-width: 100%;
    flex: 0 0 auto;
    overflow: visible;
}

.tr-plate-svg__shadow {
    fill: rgba(24, 25, 29, .16);
}

.tr-plate-svg__outer {
    fill: #17191e;
}

.tr-plate-svg__body {
    fill: #fffdf8;
    stroke: #17191e;
    stroke-width: .7;
}

.tr-plate-svg__country {
    fill: #174ea6;
}

.tr-plate-svg__country-text {
    fill: #fff;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 15px;
    font-weight: 700;
    letter-spacing: .02em;
}

.tr-plate-svg__number {
    fill: #15171b;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 31px;
    font-weight: 800;
    letter-spacing: .04em;
}

.map-tip__plate {
    display: block;
    width: 64px;
    flex: 0 0 64px;
    line-height: 0;
}

.map-tip__plate-svg {
    width: 100%;
}

.city-focus__plate {
    width: 82px;
    height: auto;
    min-width: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: inherit;
    font: inherit;
}

.city-hero__plate {
    width: 104px;
    height: auto;
    margin-bottom: 12px;
}

.city-card__plate {
    width: 64px;
    height: auto;
}

.leaderboard-card__plate {
    width: 72px;
    height: auto;
    min-width: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: inherit;
    font: inherit;
}

.reign-mini__plate {
    width: 68px;
    height: auto;
}

@media (max-width: 720px) {
    .city-focus__plate { width: 76px; }
    .city-hero__plate { width: 92px; }
    .city-card__plate { width: 58px; }
    .leaderboard-card__plate { width: 64px; }
    .reign-mini__plate { width: 60px; }
}

.title-gold {
    background: linear-gradient(100deg, #a07d17 0%, #d4af37 25%, #fdf0b6 50%, #d4af37 75%, #a07d17 100%);
    background-size: 200% auto;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: #d4af37;
    animation: gold-shimmer 3.5s linear infinite;
}

@keyframes gold-shimmer {
    to {
        background-position: 200% center;
    }
}

.reis-gold-toggle {
    align-items: center;
}

.reis-gold-toggle__copy {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.reis-gold-toggle__copy strong {
    font-size: .9rem;
}

.reis-gold-toggle__copy small {
    color: var(--text-2);
    font-size: .76rem;
}

.reis-gold-toggle__copy b {
    color: #d4af37;
}

.avatar-gold {
    outline: 2px solid #fbd23c;
    outline-offset: 1px;
    box-shadow: 0 0 10px rgba(251, 210, 60, 0.75);
    animation: avatar-gold-pulse 2.4s ease-in-out infinite;
}

@keyframes avatar-gold-pulse {
    50% {
        box-shadow: 0 0 18px rgba(251, 210, 60, 0.95);
    }
}

.map-reis-marker--gold {
    filter: drop-shadow(0 0 4px rgba(251, 210, 60, 0.9));
    animation: map-marker-gold 2.2s ease-in-out infinite;
}

@keyframes map-marker-gold {
    50% {
        filter: drop-shadow(0 0 9px rgba(251, 210, 60, 1));
    }
}

.map-reis-marker--gold .map-reis-marker__ring {
    fill: #b8860b;
}

.map-reis-marker--gold .map-reis-marker__face {
    fill: #f7e9b0;
}

.district-map-marker--gold {
    filter: drop-shadow(0 0 4px rgba(251, 210, 60, 0.9));
    animation: map-marker-gold 2.2s ease-in-out infinite;
}

.district-map-marker--gold .district-map-marker__ring {
    fill: #b8860b;
}

.district-map-marker--gold .district-map-marker__face {
    fill: #f7e9b0;
}
