.rm { --rm-bronze: #c99451; container-type: inline-size; width: 100%; }
.rm-card {
  background: linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.045));
  border: 1px solid rgba(255,255,255,.07); border-radius: 14px;
  padding: clamp(12px, 2.4cqw, 28px); backdrop-filter: blur(6px);
}
.rm-fields { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); gap: 12px 16px; margin-bottom: clamp(12px, 2cqw, 22px); }
.rm-field { position: relative; min-width: 0; }
.rm-label { display: block; font: 400 .72rem/1 var(--sans, Inter, sans-serif); letter-spacing: .14em; text-transform: uppercase; color: #ecd0a9; margin-bottom: 8px; }
.rm-input {
  width: 100%; min-height: 48px; padding: 0 14px; color: #f4efe6; font: 300 1rem/1.2 var(--sans, Inter, sans-serif);
  background: rgba(0,0,0,.28); border: 1px solid rgba(255,255,255,.12); border-radius: 8px; outline: none;
  transition: border-color .2s, box-shadow .2s; text-overflow: ellipsis;
}
.rm-input::placeholder { color: #7f8176; }
.rm-input:hover { border-color: rgba(201,148,81,.45); }
.rm-input:focus { border-color: #c99451; box-shadow: 0 0 0 3px rgba(201,148,81,.22); }
.rm-list {
  position: absolute; z-index: 20; left: 0; right: 0; top: 100%; margin: 6px 0 0; padding: 6px; list-style: none;
  max-height: 340px; overflow-y: auto; background: rgba(22,29,21,.98); border: 1px solid rgba(236,208,169,.16);
  border-radius: 10px; box-shadow: 0 24px 50px rgba(0,0,0,.5);
}
.rm-list[hidden] { display: none; }
.rm-opt { display: grid; grid-template-columns: 1fr auto; gap: 0 12px; padding: 9px 10px; border-radius: 7px; cursor: pointer; }
.rm-opt.is-active, .rm-opt:hover { background: rgba(201,148,81,.16); }
.rm-opt-main { color: #fff2db; font-size: .93rem; line-height: 1.35; min-width: 0; overflow-wrap: anywhere; }
.rm-opt-code { color: #c99451; font-size: .78rem; letter-spacing: .06em; align-self: center; }
.rm-opt-sub { grid-column: 1 / -1; color: #a7a89c; font-size: .78rem; line-height: 1.35; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.rm-map { position: relative; width: 100%; aspect-ratio: 100 / 52; border-radius: 10px; overflow: hidden; background: #131a12; border: 1px solid rgba(255,255,255,.06); }
.rm-svg { display: block; width: 100%; height: 100%; }
.rm-loading { position: absolute; inset: 0; display: grid; place-items: center; text-align: center; padding: 16px; color: #a7a89c; font-size: .9rem; }
.rm-sphere { stroke: none; }
.rm-outline { fill: none; stroke: rgba(236,208,169,.22); stroke-width: 1; }
.rm-grat { fill: none; stroke: rgba(236,208,169,.05); stroke-width: .5; }
.rm-country { fill: #1e281c; stroke: rgba(236,208,169,.14); stroke-width: .4; transition: fill .45s ease; }
.rm-country.is-in { fill: #4a3624; }
.rm-range { stroke: #c99451; stroke-width: 1.1; stroke-opacity: .85; pointer-events: none; }
.rm-route { fill: none; stroke: #fff2db; stroke-width: 1.5; stroke-linecap: round; stroke-opacity: .95; filter: drop-shadow(0 0 3px rgba(201,148,81,.8)); }
.rm-route.is-draw { stroke-dasharray: 1; stroke-dashoffset: 1; animation: rm-draw .6s ease-out forwards; }
@keyframes rm-draw { to { stroke-dashoffset: 0; } }
.rm-dot { fill: #c99451; stroke: #fff2db; stroke-width: 1.4; }
.rm-mark.to .rm-dot { fill: #fff2db; stroke: #c99451; }
.rm-pulse { fill: none; stroke: #c99451; stroke-width: 1.5; transform-box: fill-box; transform-origin: center; animation: rm-pulse 2.4s ease-out infinite; }
@keyframes rm-pulse { 0% { transform: scale(1); opacity: .9; } 100% { transform: scale(4.2); opacity: 0; } }
.rm-tag { fill: #fff2db; font: 400 10px/1 var(--sans, Inter, sans-serif); letter-spacing: .08em; paint-order: stroke; stroke: #131a12; stroke-width: 3px; stroke-linejoin: round; }

.rm-readout { margin-top: clamp(12px, 2cqw, 22px); }
.rm-readout[hidden] { display: none; }
.rm-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 170px), 1fr)); gap: 10px; }
.rm-stat { display: flex; flex-direction: column; gap: 4px; padding: 12px 14px; background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.07); border-radius: 10px; min-width: 0; }
.rm-k { font-size: .7rem; letter-spacing: .1em; text-transform: uppercase; color: #a7a89c; line-height: 1.35; }
.rm-v { font: 400 clamp(1.25rem, 3.4cqw, 1.75rem)/1.15 var(--serif, "Gilda Display", serif); color: #fff2db; }
.rm-s { font-size: .82rem; color: #a7a89c; }
.rm-verdict { margin: 12px 0 0; font-size: .95rem; color: #ecd0a9; }
.rm-verdict.ok::before, .rm-verdict.warn::before { content: ""; display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin-right: 10px; vertical-align: 1px; }
.rm-verdict.ok::before { background: #c99451; box-shadow: 0 0 0 3px rgba(201,148,81,.25); }
.rm-verdict.warn::before { background: transparent; border: 1.5px solid #c99451; }
.rm-verdict.hint { color: #a7a89c; }
.rm-foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px 24px; margin-top: clamp(14px, 2cqw, 24px); padding-top: 16px; border-top: 1px solid rgba(255,255,255,.07); }
.rm-note { margin: 0; flex: 1 1 260px; color: #a7a89c; font-size: .82rem; line-height: 1.55; }
.rm-cta { flex: 0 0 auto; }
.rm-sr { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

@container (max-width: 420px) {
  .rm-cta { width: 100%; justify-content: center; text-align: center; }
  .rm-tag { font-size: 12px; }
}
@container (min-width: 1400px) { .rm-map { aspect-ratio: 100 / 48; } }
@media (prefers-reduced-motion: reduce) {
  .rm-pulse { animation: none; opacity: 0; }
  .rm-route.is-draw { animation: none; stroke-dashoffset: 0; }
  .rm-country, .rm-input { transition: none; }
}