body { width: 430px; margin: 0; font: 13px/1.45 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; color: #e5e7eb; background: #0f172a; } main { padding: 14px; } h1 { margin: 0 0 12px; font-size: 18px; } label { display: grid; gap: 5px; margin: 8px 0; color: #cbd5e1; } input { box-sizing: border-box; width: 100%; padding: 7px 9px; border: 1px solid #334155; border-radius: 8px; color: #e5e7eb; background: #111827; outline: none; } input:focus { border-color: #38bdf8; box-shadow: 0 0 0 2px rgba(56,189,248,.18); } .row { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 8px; } .country-box { margin-top: 10px; padding: 10px; border: 1px solid #253244; border-radius: 10px; background: #111827; } .country-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 8px; } button { padding: 7px 10px; border: 1px solid #334155; border-radius: 8px; color: #e5e7eb; background: #1f2937; cursor: pointer; } button:hover { background: #273449; } button:disabled { opacity: .55; cursor: not-allowed; } .primary { background: #2563eb; border-color: #3b82f6; } .primary:hover { background: #1d4ed8; } .selected { display: flex; flex-wrap: wrap; gap: 6px; min-height: 25px; margin: 8px 0; } .chip { display: inline-flex; gap: 5px; align-items: center; padding: 4px 7px; border-radius: 999px; background: #0e7490; color: #ecfeff; } .chip button { padding: 0 3px; border: 0; background: transparent; } .country-list { max-height: 170px; overflow: auto; border: 1px solid #253244; border-radius: 8px; } .country-item { display: flex; justify-content: space-between; gap: 8px; width: 100%; padding: 7px 9px; border: 0; border-bottom: 1px solid #1f2937; border-radius: 0; background: #0b1220; text-align: left; } .country-item.selected-item { background: #123044; color: #bae6fd; } .country-id { color: #94a3b8; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; } .actions { display: grid; grid-template-columns: 1fr 1.4fr 1fr; gap: 8px; margin-top: 12px; } .current { margin-top: 12px; padding: 10px; border-radius: 10px; background: #020617; color: #cbd5e1; } code { color: #67e8f9; user-select: all; } .hint { margin: 7px 0 0; color: #94a3b8; font-size: 12px; }