:root {
    --radar-range-primary: #096D6D; --radar-range-secondary: #07385D; --radar-range-text-color: #1A202C;
    --radar-range-success: #28a745; --radar-range-danger: #dc3545; --radar-range-warning: #ffc107; --radar-range-info: #17a2b8;
    --radar-range-light-bg: #f8f9fa;
}
.radar-range-calculator-container { font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; color: var(--radar-range-text-color); }
.radar-range-card { border: none; border-radius: 12px; overflow: hidden; box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); }
.radar-range-header { background: linear-gradient(135deg, var(--radar-range-secondary) 0%, var(--radar-range-primary) 100%); color: #fff !important; padding-left: 1.5rem; border-bottom: 3px solid var(--radar-range-primary); }
.radar-range-header h4 { font-weight: 600; margin: 0; }
.form-control, .form-select { border: 1px solid #d1d5db; border-radius: 0.375rem; transition: all 0.2s ease; }
.form-control:focus, .form-select:focus { border-color: var(--radar-range-primary); box-shadow: 0 0 0 0.2rem rgba(9, 109, 109, 0.25); }
.input-group-sm .form-control, .input-group-sm .form-select { height: calc(1.8125rem + 2px); padding: 0.375rem 0.75rem; font-size: 0.875rem; }
.input-group-text { background-color: #e9ecef; border: 1px solid #d1d5db; }
.radar-range-btn-primary { background: linear-gradient(135deg, var(--radar-range-primary) 0%, var(--radar-range-secondary) 100%); border: none; color: #fff !important; transition: all 0.3s ease; padding: 0.75rem 2rem; font-weight: 600; border-radius: 0.5rem; }
.radar-range-btn-primary:hover { transform: translateY(-2px); box-shadow: 0 6px 20px rgba(7, 56, 93, 0.4); color: #fff !important; }
.radar-range-btn-primary:disabled { opacity: 0.7; cursor: not-allowed; transform: none; }
.radar-range-btn-loading { position: relative; color: transparent !important; }
.radar-range-btn-loading::after { content: ''; position: absolute; top: 50%; left: 50%; width: 20px; height: 20px; margin: -10px 0 0 -10px; border: 2px solid #ffffff; border-radius: 50%; border-right-color: transparent; animation: radar-range-spin 0.8s linear infinite; }
@keyframes radar-range-spin { to { transform: rotate(360deg); } }
.radar-range-text-primary { color: var(--radar-range-primary) !important; }
.radar-range-text-secondary { color: var(--radar-range-secondary) !important; }
.radar-range-output-panel { min-height: 100px; display: flex; flex-direction: column; justify-content: center; align-items: center; border-radius: 0.5rem; transition: all 0.3s ease; }
.radar-range-highlight-panel { background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%); border: 2px solid var(--radar-range-primary) !important; box-shadow: 0 4px 15px rgba(9, 109, 109, 0.15); }
.radar-range-output-value { background: linear-gradient(135deg, var(--radar-range-primary) 0%, var(--radar-range-secondary) 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; font-weight: 700 !important; }
.radar-visualization-container { border: 1px solid #dee2e6; }
.radar-sweep { background: linear-gradient(180deg, #1e3c72 0%, #2a5298 100%); border-radius: 50%; position: relative; }
.sweep-arm { transform-origin: bottom center; }
.coverage-circle { border: 2px dashed var(--radar-range-primary) !important; transition: all 0.5s ease; }
.blind-spots { background: rgba(220, 53, 69, 0.3) !important; transition: all 0.5s ease; }
.range-labels .badge { font-size: 0.75rem; box-shadow: 0 2px 4px rgba(0,0,0,0.3); }
.chart-container { background: var(--radar-range-light-bg); border-radius: 0.5rem; padding: 1rem; border: 1px solid #e9ecef; }
.form-text { font-size: 0.8rem; color: #6b7280; }
#radar-range-message { border-radius: 0.5rem; border: none; }
.spinner-border.radar-range-text-primary { color: var(--radar-range-primary) !important; }
@media (max-width: 767.98px) {
    .border-end { border-right: none !important; border-bottom: 1px solid #dee2e6; padding-bottom: 2rem; margin-bottom: 1rem; }
    .radar-range-output-value { font-size: 1.75rem !important; }
    .radar-sweep { width: 150px !important; height: 150px !important; }
}
@media (min-width: 768px) { .radar-range-output-value { font-size: 2.5rem; } }