.map-main { max-width: 1480px; margin: auto; padding: 44px clamp(20px,4vw,64px) 40px; }
.map-heading { display:flex;justify-content:space-between;align-items:end;gap:24px;margin-bottom:30px; }
.map-heading .small-label { color:var(--soft);letter-spacing:2px;font-size:10px; }
.map-heading h1 { font:clamp(58px,7vw,100px)/.94 var(--display);letter-spacing:-1px;margin:24px 0 0; }
.map-heading h1 em { font-style:normal;color:#d4b079; }
.map-heading-side { padding-bottom:4px; }
.map-heading-side p { color:var(--soft);line-height:1.8;font-size:14px;margin:0 0 18px; }
.map-account-link { display:flex;gap:38px;justify-content:space-between;font-size:12px;text-transform:uppercase;letter-spacing:1.1px;border-bottom:1px solid var(--line);padding-bottom:12px; }
.map-training-link { display:flex;gap:20px;justify-content:space-between;align-items:center;min-height:44px;font-size:12px;color:var(--soft); }
.map-toolbar { display:flex;align-items:center;justify-content:space-between;gap:12px;margin:28px 0 14px; }
.map-toolbar p { margin:0;font-size:11px;color:var(--soft); }
.map-mode { display:flex;gap:4px;padding:4px;border:1px solid var(--line); }
.map-mode button { min-height:40px;padding:10px 14px;background:none;border:0;color:var(--soft);font:12px var(--body);cursor:pointer; }
.map-mode [aria-pressed="true"] { color:var(--ink);background:var(--panel);box-shadow:inset 0 -2px #d4b079; }
.atlas-shell { --map-ink:#e9e9e7;--map-soft:#a3b0b5;--map-gold:#d4b079;display:grid;grid-template-columns:minmax(0,1fr) 310px;min-height:630px;border:1px solid #343c3f;background:#080f13;color:var(--map-ink);box-shadow:0 28px 90px #0002; }
.atlas-viewport { min-width:0;position:relative;min-height:630px;overflow:hidden;background:radial-gradient(ellipse at 48% 48%,#14242c 0,#070e14 65%); }
#world-map { position:absolute;inset:0; }
.atlas-hud { position:absolute;z-index:2;left:25px;right:25px;top:22px;display:flex;justify-content:space-between;gap:8px;pointer-events:none; }
.atlas-hud span { font:9px/1.5 var(--body);letter-spacing:1.8px;color:#bac3c6; }
.atlas-hud i { display:inline-block;width:5px;height:5px;background:#d4b079;margin-right:6px;box-shadow:0 0 10px #d4b079; }
.atlas-coordinates { position:absolute;bottom:22px;left:25px;pointer-events:none;margin:0;font:9px/1.4 monospace;letter-spacing:1px;color:#aab5bd; }
.map-stats { position:absolute;z-index:2;top:62px;left:25px;display:flex;gap:28px;pointer-events:none; }
.map-stats div { display:grid;gap:4px; }
.map-stats b { color:#e7dac3;font:34px/1 var(--display); }
.map-stats span { color:#b1babf;font:9px/1.4 var(--body);letter-spacing:1px;text-transform:uppercase; }
.atlas-controls { display:grid;position:absolute;z-index:2;right:22px;bottom:24px;border:1px solid #536167; }
.atlas-controls button { width:44px;min-height:44px;font:24px var(--body);color:#ddd;background:#0d1924e6;border:0;cursor:pointer; }
.atlas-controls button+button { border-top:1px solid #354650; }
.atlas-controls button:hover { color:#d4b079;background:#20313d; }
.city-panel { min-width:0;display:flex;flex-direction:column;background:#0e1519;border-left:1px solid #343c3f;padding:26px 24px; }
.city-panel button,.city-panel input { font-family:var(--body); }
#city-search { position:relative;margin-bottom:28px; }
#city-search label { display:block;font:17px var(--display);margin:0 0 12px;letter-spacing:.3px; }
.city-search-row { display:flex;align-items:stretch;border:1px solid #516168; }
.city-search-row input { color:#e9e9e7;min-width:0;width:100%;padding:12px;background:#080f13;border:0;border-radius:0;font-size:14px;min-height:46px; }
.city-search-row input::placeholder { color:#96a5ae;font-size:12px; }
.city-search-row button { border:0;background:#1b2930;color:#d4b079;width:44px;flex-shrink:0;font-size:22px;cursor:pointer; }
.map-small { color:var(--map-soft);font:12px/1.75 var(--body); }
#search-status { margin:7px 0 0;font-size:10px; }
#search-status:empty { display:none; }
.city-results { position:absolute;z-index:5;top:100%;left:0;right:0;margin:5px 0 0;padding:5px;list-style:none;max-height:360px;overflow:auto;border:1px solid #677984;background:#142129;box-shadow:0 12px 28px #0009; }
.city-results button { display:grid;gap:4px;color:#eee;text-align:left;background:none;border:0;border-bottom:1px solid #31404a;width:100%;padding:13px 8px;cursor:pointer; }
.city-results button:hover,.city-results button:focus-visible { background:#2a3c43; }
.city-results small { color:#b1bec4;font-size:10px;line-height:1.5; }
.panel-heading { display:flex;align-items:center;justify-content:space-between;color:#d4b079; }
.panel-heading .small-label { font-size:9px;letter-spacing:1.5px; }
.city-panel h2 { font:32px/1.04 var(--display);margin:16px 0 14px;overflow-wrap:anywhere; }
.city-list { display:grid;gap:0;max-height:262px;overflow:auto;margin-top:22px;scrollbar-width:thin;scrollbar-color:#46575f #0e1519; }
.city-list button { display:flex;justify-content:space-between;align-items:center;gap:12px;padding:15px 2px;min-height:58px;border:0;border-top:1px solid #29363c;background:none;color:#e7e7e7;text-align:left;cursor:pointer; }
.city-list button>span:first-child { display:grid;gap:4px;font-size:13px; }
.city-list small { color:#a7b7c0;font-size:10px; }
.city-list .city-number { color:#d4b079;display:flex;align-items:center;gap:12px;font-size:11px; }
.city-list button:hover { color:#d4b079; }
.map-back { color:#afc0c9;background:none;border:0;min-height:40px;padding:0;font-size:11px;text-align:left;cursor:pointer;text-decoration:underline;text-underline-offset:4px; }
#city-country { margin:16px 0 0;font-size:10px;color:#d4b079;letter-spacing:1.5px; }
#city-title { font-size:43px;margin:10px 0 8px; }
#city-region { margin:0; }
.city-count { color:#d4b079;font-size:12px;margin:20px 0 12px; }
.member-list { list-style:none;margin:0;padding:0;display:grid;gap:2px;max-height:218px;overflow:auto;scrollbar-width:thin; }
.member-list li { display:grid;grid-template-columns:31px minmax(0,1fr);align-items:center;gap:6px 12px;padding:9px 0;border-top:1px solid #29363c;font-size:13px;overflow-wrap:anywhere; }
.member-avatar { display:grid;place-items:center;width:31px;height:34px;flex-shrink:0;background:#273137;color:#d4b079;clip-path:polygon(12% 0,100% 0,100% 85%,88% 100%,0 100%,0 15%);font:18px var(--display); }
.member-report { grid-column:1 / -1;color:#adbac1;font-size:11px; }
.member-report summary { width:fit-content;min-height:32px;margin-left:auto;padding:7px 2px;cursor:pointer; }
.member-report form { display:grid;gap:10px;padding:12px 0 4px; }
.member-report label { font-size:11px; }
.member-report select { width:100%;min-width:0;min-height:44px;color:#e9e9e7;background:#142129;border:1px solid #516168;padding:8px;font:12px var(--body); }
.member-report button { min-height:44px;background:#273137;color:#e9e9e7;border:1px solid #516168;padding:10px;font:12px var(--body);cursor:pointer; }
.member-report button:disabled { opacity:.6;cursor:default; }
.report-status { margin:0;color:#d4b079;font-size:11px;line-height:1.6; }
.report-status:empty { display:none; }
.join-area { border-top:1px solid #35434a;margin-top:23px;padding-top:20px; }
.join-area p { color:#adbac1;font-size:12px;line-height:1.7;margin:0 0 14px; }
.join-area a,.join-area button { display:flex;align-items:center;justify-content:center;width:100%;min-height:44px;padding:12px;background:#d4b079;color:#151310;border:1px solid #d4b079;font:600 12px var(--body);cursor:pointer; }
.join-area button:disabled { opacity:.45;cursor:not-allowed; }
.join-consent { display:flex;align-items:start;gap:10px;color:#ced5d9;font-size:11px;line-height:1.7;margin-bottom:16px; }
.join-consent input { margin:4px 0 0;accent-color:#d4b079;width:16px;height:16px;flex-shrink:0; }
.my-city-area { display:flex;justify-content:space-between;gap:8px;padding-top:18px;margin-top:auto;border-top:1px solid #29363c; }
.my-city-area button { background:none;color:#d4b079;border:0;min-height:44px;font-size:11px;text-decoration:underline;text-underline-offset:4px;cursor:pointer; }
.map-feedback { font-size:12px;line-height:1.7;color:#d3c2a8;margin:14px 0; }
.map-feedback:empty { display:none; }
.map-feedback[data-error="true"] { color:#ffb5ac; }
.map-feedback a { text-decoration:underline;text-underline-offset:3px; }
.map-bottom { display:flex;justify-content:space-between;align-items:start;gap:18px;padding-top:16px;font-size:11px;color:var(--soft); }
.map-bottom p { margin:0;line-height:1.8; }
.map-legend-dot { width:7px;height:7px;display:inline-block;border-radius:50%;background:#d4b079;margin-right:7px; }
.map-attribution { text-align:right;font-size:9px; }
.map-attribution a { text-decoration:underline;text-underline-offset:2px; }
.map-loading { position:absolute;top:51%;left:50%;transform:translate(-50%,-50%);padding:12px 20px;background:#0e1519e8;color:#d4b079;font-size:12px; }
.map-fallback { position:absolute;top:40%;left:12%;right:12%;padding:28px;border:1px solid #526771;background:#0e1519;z-index:3;line-height:1.6;font-size:13px; }
.map-fallback button { background:#d4b079;color:#151310;border:0;padding:13px 18px;font:600 12px var(--body);cursor:pointer; }
.map-page [hidden] { display:none!important; }
.atlas-shell :focus-visible { outline:2px solid #ebca93;outline-offset:3px; }
:root[data-theme="light"] .map-heading h1 em { color:#805f26; }
@media(min-width:1500px) { .atlas-shell { grid-template-columns:minmax(0,1fr) 335px; } .atlas-viewport { min-height:680px; } }
@media(max-width:1000px) { .atlas-shell { grid-template-columns:minmax(0,1fr) 275px; } .city-panel { padding:24px 18px; } .map-stats { gap:18px;left:18px; } .atlas-hud { left:18px;right:18px; } .atlas-hud span:last-child { display:none; } }
@media(max-width:760px) { .map-main { padding-top:28px; } .map-heading { align-items:start; } .map-heading h1 { font-size:65px; } .map-heading-side { max-width:190px;align-self:end; } .map-heading-side p { font-size:12px; } .map-account-link { gap:8px;font-size:10px;line-height:1.5; } .atlas-shell { display:flex;flex-direction:column; } .atlas-viewport { min-height:460px; } .city-panel { border-left:0;border-top:1px solid #343c3f; } .city-list { grid-template-columns:repeat(2,minmax(0,1fr));gap:0 22px;max-height:230px; } .map-stats b { font-size:27px; } .map-stats span { font-size:8px; } .map-bottom { flex-direction:column; } .map-attribution { text-align:left; } .map-toolbar { align-items:start;flex-direction:column; } .map-toolbar p { font-size:10px; } }
@media(max-width:420px) { .map-heading { display:block; } .map-heading-side { max-width:none;display:flex;gap:15px;align-items:center;margin-top:20px; } .map-heading-side p { margin:0;flex:1; } .map-account-link { max-width:120px; } .atlas-viewport { min-height:390px; } .map-stats { top:53px;gap:18px; } .map-stats b { font-size:24px; } .atlas-hud span { font-size:8px; } .city-panel h2 { font-size:29px; } .city-list { grid-template-columns:1fr; } }
@media(max-width:760px) { .city-search-row input,.member-report select { font-size:16px; } .member-report summary { min-height:44px;padding:12px 2px; } }
