.card { background:#fff; border:1px solid #e4e4e7; border-radius:1rem; padding:1.1rem; }
.label { font-size:.7rem; font-weight:600; letter-spacing:.06em; text-transform:uppercase; color:#71717a; display:block; }
.input { width:100%; border:1px solid #e4e4e7; border-radius:.75rem; padding:.55rem .8rem; font-size:.875rem; background:#fff; outline:none; transition:box-shadow .15s,border-color .15s; }
.input:focus { border-color:#6366f1; box-shadow:0 0 0 3px #e0e7ff; }

.chip { display:inline-flex; align-items:center; gap:.35rem; padding:.3rem .7rem; border-radius:999px; font-size:.78rem; font-weight:500; border:1px solid #e4e4e7; background:#fff; color:#52525b; cursor:pointer; transition:all .15s; }
.chip:hover { border-color:#a5b4fc; color:#4338ca; }
.chip.on { background:#4f46e5; border-color:#4f46e5; color:#fff; }

.tag { display:inline-block; padding:.15rem .55rem; border-radius:.5rem; font-size:.72rem; font-weight:500; background:#f4f4f5; color:#52525b; }
.tag.brand { background:#eef2ff; color:#4338ca; }
.tag.warn { background:#fef3c7; color:#92400e; }

#map path { stroke:#fff; stroke-width:1.2; stroke-linejoin:round; cursor:pointer; transition:fill .15s, opacity .15s; }
#map path:hover { opacity:.8; }
#map path.sel { stroke:#312e81; stroke-width:2; }

.job { transition:border-color .15s, box-shadow .15s; }
.job:hover { border-color:#c7d2fe; box-shadow:0 4px 16px -8px rgba(79,70,229,.25); }

.scroll-thin { scrollbar-width:thin; }
.fade-in { animation:fade .25s ease both; }
@keyframes fade { from { opacity:0; transform:translateY(4px); } to { opacity:1; transform:none; } }
