.environment-indicator { display:inline-flex; align-items:center; gap:6px; flex:none; vertical-align:middle; padding:7px 10px; border:1px solid #c6d5de; border-radius:999px; color:#263b48; background:#e6edf1; font:750 10px/1.2 'Segoe UI',Arial,sans-serif; letter-spacing:.06em; white-space:nowrap; }
.environment-indicator::before { content:''; width:6px; height:6px; border-radius:50%; background:currentColor; }
.environment-indicator[data-environment="development"] { color:#174877; background:#e0efff; border-color:#91bde5; }
.environment-indicator[data-environment="staging"] { color:#644500; background:#fff1c5; border-color:#e6bd50; }
.environment-indicator[data-environment="production"] { color:#8e251d; background:#ffe2dc; border-color:#e69485; }
.signin-card .environment-indicator { margin:0 0 10px 8px; }
@media(max-width:700px) { .topbar .environment-indicator { font-size:9px; padding:6px 8px; } }