@jjlmoya/utils-drones 1.12.0 → 1.13.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (4) hide show
  1. package/package.json +1 -1
  2. package/src/tool/antenna-length-calculator/antenna-length-calculator.css +40 -40
  3. package/src/tool/drone-flight-time/drone-flight-time-calculator.css +39 -39
  4. package/src/tool/gps-coordinates-converter/gps-coordinates-converter.css +26 -26
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@jjlmoya/utils-drones",
3
- "version": "1.12.0",
3
+ "version": "1.13.0",
4
4
  "type": "module",
5
5
  "main": "./src/index.ts",
6
6
  "types": "./src/index.ts",
package/src/tool/antenna-length-calculator/antenna-length-calculator.css CHANGED
@@ -20,8 +20,8 @@
20
20
  padding: 2.5rem 1.5rem;
21
21
  }
22
22
 
23
- :global([data-theme="dark"]) .antenna-calculator-ui,
24
- :global(.theme-dark) .antenna-calculator-ui {
23
+ [data-theme="dark"] .antenna-calculator-ui,
24
+ .theme-dark .antenna-calculator-ui {
25
25
  --antenna-bg: #1a1a1a;
26
26
  --antenna-bg-muted: #2d2d2d;
27
27
  --antenna-bg-surface: #3a3a3a;
@@ -80,8 +80,8 @@
80
80
  gap: 2.5rem;
81
81
  }
82
82
 
83
- :global([data-theme="dark"]) .antenna-calculator-ui .config-sidebar,
84
- :global(.theme-dark) .antenna-calculator-ui .config-sidebar {
83
+ [data-theme="dark"] .antenna-calculator-ui .config-sidebar,
84
+ .theme-dark .antenna-calculator-ui .config-sidebar {
85
85
  background: var(--antenna-bg-overlay);
86
86
  border-right-color: var(--antenna-border-light);
87
87
  }
@@ -97,8 +97,8 @@
97
97
  background: var(--antenna-bg);
98
98
  }
99
99
 
100
- :global([data-theme="dark"]) .antenna-calculator-ui .main-display,
101
- :global(.theme-dark) .antenna-calculator-ui .main-display {
100
+ [data-theme="dark"] .antenna-calculator-ui .main-display,
101
+ .theme-dark .antenna-calculator-ui .main-display {
102
102
  background: var(--antenna-bg);
103
103
  }
104
104
 
@@ -150,8 +150,8 @@
150
150
  box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.02);
151
151
  }
152
152
 
153
- :global([data-theme="dark"]) .antenna-calculator-ui .input-with-unit input,
154
- :global(.theme-dark) .antenna-calculator-ui .input-with-unit input {
153
+ [data-theme="dark"] .antenna-calculator-ui .input-with-unit input,
154
+ .theme-dark .antenna-calculator-ui .input-with-unit input {
155
155
  background: var(--antenna-input-bg);
156
156
  border-color: var(--antenna-border);
157
157
  color: var(--antenna-text);
@@ -210,15 +210,15 @@
210
210
  font-weight: 600;
211
211
  }
212
212
 
213
- :global([data-theme="dark"]) .antenna-calculator-ui select,
214
- :global(.theme-dark) .antenna-calculator-ui select {
213
+ [data-theme="dark"] .antenna-calculator-ui select,
214
+ .theme-dark .antenna-calculator-ui select {
215
215
  background: var(--antenna-bg-surface);
216
216
  color: var(--antenna-text);
217
217
  border-color: var(--antenna-border);
218
218
  }
219
219
 
220
- :global([data-theme="dark"]) .antenna-calculator-ui select option,
221
- :global(.theme-dark) .antenna-calculator-ui select option {
220
+ [data-theme="dark"] .antenna-calculator-ui select option,
221
+ .theme-dark .antenna-calculator-ui select option {
222
222
  background: var(--antenna-bg-surface);
223
223
  color: var(--antenna-text);
224
224
  }
@@ -242,8 +242,8 @@
242
242
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.02);
243
243
  }
244
244
 
245
- :global([data-theme="dark"]) .antenna-calculator-ui .preset-btn,
246
- :global(.theme-dark) .antenna-calculator-ui .preset-btn {
245
+ [data-theme="dark"] .antenna-calculator-ui .preset-btn,
246
+ .theme-dark .antenna-calculator-ui .preset-btn {
247
247
  background: var(--antenna-bg-surface);
248
248
  border-color: var(--antenna-border);
249
249
  color: var(--antenna-text);
@@ -257,8 +257,8 @@
257
257
  box-shadow: 0 10px 20px rgba(var(--antenna-primary-rgb), 0.1);
258
258
  }
259
259
 
260
- :global([data-theme="dark"]) .antenna-calculator-ui .preset-btn:hover,
261
- :global(.theme-dark) .antenna-calculator-ui .preset-btn:hover {
260
+ [data-theme="dark"] .antenna-calculator-ui .preset-btn:hover,
261
+ .theme-dark .antenna-calculator-ui .preset-btn:hover {
262
262
  background: var(--antenna-bg-muted);
263
263
  border-color: var(--antenna-primary);
264
264
  color: var(--antenna-primary);
@@ -293,8 +293,8 @@
293
293
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.04);
294
294
  }
295
295
 
296
- :global([data-theme="dark"]) .antenna-calculator-ui .radio-content,
297
- :global(.theme-dark) .antenna-calculator-ui .radio-content {
296
+ [data-theme="dark"] .antenna-calculator-ui .radio-content,
297
+ .theme-dark .antenna-calculator-ui .radio-content {
298
298
  background: var(--antenna-bg-surface);
299
299
  color: var(--antenna-text);
300
300
  }
@@ -308,8 +308,8 @@
308
308
  transform: scale(1.02);
309
309
  }
310
310
 
311
- :global([data-theme="dark"]) .antenna-calculator-ui .radio-card input:checked + .radio-content,
312
- :global(.theme-dark) .antenna-calculator-ui .radio-card input:checked + .radio-content {
311
+ [data-theme="dark"] .antenna-calculator-ui .radio-card input:checked + .radio-content,
312
+ .theme-dark .antenna-calculator-ui .radio-card input:checked + .radio-content {
313
313
  background: linear-gradient(135deg, rgba(58, 58, 58, 0.8), rgba(245, 158, 11, 0.1));
314
314
  color: var(--antenna-text);
315
315
  }
@@ -363,8 +363,8 @@
363
363
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.04);
364
364
  }
365
365
 
366
- :global([data-theme="dark"]) .antenna-calculator-ui .mega-result.glass,
367
- :global(.theme-dark) .antenna-calculator-ui .mega-result.glass {
366
+ [data-theme="dark"] .antenna-calculator-ui .mega-result.glass,
367
+ .theme-dark .antenna-calculator-ui .mega-result.glass {
368
368
  background: var(--antenna-bg-surface);
369
369
  border-color: var(--antenna-border);
370
370
  color: var(--antenna-text);
@@ -411,8 +411,8 @@
411
411
  overflow: hidden;
412
412
  }
413
413
 
414
- :global([data-theme="dark"]) .antenna-calculator-ui .visualizer-stage,
415
- :global(.theme-dark) .antenna-calculator-ui .visualizer-stage {
414
+ [data-theme="dark"] .antenna-calculator-ui .visualizer-stage,
415
+ .theme-dark .antenna-calculator-ui .visualizer-stage {
416
416
  background: radial-gradient(circle at center, rgba(255,255,255,0.03), transparent);
417
417
  border-color: var(--antenna-border);
418
418
  }
@@ -454,8 +454,8 @@
454
454
  stroke-dasharray: 4 4;
455
455
  }
456
456
 
457
- :global([data-theme="dark"]) .antenna-calculator-ui .measuring-line,
458
- :global(.theme-dark) .antenna-calculator-ui .measuring-line {
457
+ [data-theme="dark"] .antenna-calculator-ui .measuring-line,
458
+ .theme-dark .antenna-calculator-ui .measuring-line {
459
459
  stroke: rgba(255, 255, 255, 0.2);
460
460
  }
461
461
 
@@ -465,8 +465,8 @@
465
465
  border-radius: 24px;
466
466
  }
467
467
 
468
- :global([data-theme="dark"]) .antenna-calculator-ui .harmonics-container,
469
- :global(.theme-dark) .antenna-calculator-ui .harmonics-container {
468
+ [data-theme="dark"] .antenna-calculator-ui .harmonics-container,
469
+ .theme-dark .antenna-calculator-ui .harmonics-container {
470
470
  background: var(--antenna-bg-surface);
471
471
  }
472
472
 
@@ -488,8 +488,8 @@
488
488
  border: 1px solid var(--antenna-border-light);
489
489
  }
490
490
 
491
- :global([data-theme="dark"]) .antenna-calculator-ui .harmonic-card,
492
- :global(.theme-dark) .antenna-calculator-ui .harmonic-card {
491
+ [data-theme="dark"] .antenna-calculator-ui .harmonic-card,
492
+ .theme-dark .antenna-calculator-ui .harmonic-card {
493
493
  background: var(--antenna-bg-muted);
494
494
  border-color: var(--antenna-border);
495
495
  }
@@ -540,8 +540,8 @@
540
540
  transition: all 0.3s ease;
541
541
  }
542
542
 
543
- :global([data-theme="dark"]) .antenna-calculator-ui .ref-card,
544
- :global(.theme-dark) .antenna-calculator-ui .ref-card {
543
+ [data-theme="dark"] .antenna-calculator-ui .ref-card,
544
+ .theme-dark .antenna-calculator-ui .ref-card {
545
545
  background: var(--antenna-bg-surface);
546
546
  border-color: var(--antenna-border);
547
547
  }
@@ -582,8 +582,8 @@
582
582
  background: linear-gradient(90deg, transparent, var(--antenna-border-light), transparent);
583
583
  }
584
584
 
585
- :global([data-theme="dark"]) .antenna-calculator-ui .divider,
586
- :global(.theme-dark) .antenna-calculator-ui .divider {
585
+ [data-theme="dark"] .antenna-calculator-ui .divider,
586
+ .theme-dark .antenna-calculator-ui .divider {
587
587
  background: linear-gradient(90deg, transparent, var(--antenna-border), transparent);
588
588
  }
589
589
 
@@ -685,8 +685,8 @@
685
685
  box-shadow: 0 2px 5px rgba(0,0,0,0.02);
686
686
  }
687
687
 
688
- :global([data-theme="dark"]) .custom-select-premium,
689
- :global(.theme-dark) .custom-select-premium {
688
+ [data-theme="dark"] .custom-select-premium,
689
+ .theme-dark .custom-select-premium {
690
690
  background-color: rgba(15, 23, 42, 0.4);
691
691
  border-color: rgba(255,255,255,0.1);
692
692
  color: white;
@@ -705,8 +705,8 @@
705
705
  letter-spacing: 0.1em;
706
706
  }
707
707
 
708
- :global([data-theme="dark"]) .svg-label-text,
709
- :global(.theme-dark) .svg-label-text {
708
+ [data-theme="dark"] .svg-label-text,
709
+ .theme-dark .svg-label-text {
710
710
  fill: #666;
711
711
  }
712
712
  .antenna-calculator-ui .security-warning {
@@ -722,8 +722,8 @@
722
722
  transition: all 0.3s ease;
723
723
  }
724
724
 
725
- :global([data-theme="dark"]) .antenna-calculator-ui .security-warning,
726
- :global(.theme-dark) .antenna-calculator-ui .security-warning {
725
+ [data-theme="dark"] .antenna-calculator-ui .security-warning,
726
+ .theme-dark .antenna-calculator-ui .security-warning {
727
727
  background: rgba(239, 68, 68, 0.1);
728
728
  border-color: rgba(239, 68, 68, 0.3);
729
729
  }
package/src/tool/drone-flight-time/drone-flight-time-calculator.css CHANGED
@@ -24,8 +24,8 @@
24
24
  padding: 0 1.5rem;
25
25
  }
26
26
 
27
- :global([data-theme="dark"]) .flight-calculator-ui,
28
- :global(.theme-dark) .flight-calculator-ui {
27
+ [data-theme="dark"] .flight-calculator-ui,
28
+ .theme-dark .flight-calculator-ui {
29
29
  --dft-bg: #0f172a;
30
30
  --dft-bg-muted: #1e293b;
31
31
  --dft-bg-surface: #334155;
@@ -97,13 +97,13 @@
97
97
  background: linear-gradient(90deg, transparent, var(--dft-border-light), transparent);
98
98
  }
99
99
 
100
- .flight-calculator-ui :global(.tech-section) {
100
+ .flight-calculator-ui .tech-section {
101
101
  display: flex;
102
102
  flex-direction: column;
103
103
  gap: 2rem;
104
104
  }
105
105
 
106
- .flight-calculator-ui :global(.section-title) {
106
+ .flight-calculator-ui .section-title {
107
107
  font-size: 0.75rem;
108
108
  font-weight: 800;
109
109
  color: var(--dft-text-dim);
@@ -112,25 +112,25 @@
112
112
  margin-bottom: 0.5rem;
113
113
  }
114
114
 
115
- .flight-calculator-ui :global(.input-group) {
115
+ .flight-calculator-ui .input-group {
116
116
  display: flex;
117
117
  flex-direction: column;
118
118
  gap: 1rem;
119
119
  }
120
120
 
121
- .flight-calculator-ui :global(.label-row) {
121
+ .flight-calculator-ui .label-row {
122
122
  display: flex;
123
123
  justify-content: space-between;
124
124
  align-items: center;
125
125
  }
126
126
 
127
- .flight-calculator-ui :global(.input-group label) {
127
+ .flight-calculator-ui .input-group label {
128
128
  font-size: 0.8rem;
129
129
  font-weight: 800;
130
130
  color: var(--dft-text-muted);
131
131
  }
132
132
 
133
- .flight-calculator-ui :global(.value-badge) {
133
+ .flight-calculator-ui .value-badge {
134
134
  padding: 0.4rem 1rem;
135
135
  background: var(--dft-bg-surface);
136
136
  border-radius: 12px;
@@ -140,7 +140,7 @@
140
140
  box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.05);
141
141
  }
142
142
 
143
- .flight-calculator-ui :global(.tech-slider) {
143
+ .flight-calculator-ui .tech-slider {
144
144
  width: 100%;
145
145
  height: 6px;
146
146
  appearance: none;
@@ -151,11 +151,11 @@
151
151
  transition: all 0.3s ease;
152
152
  }
153
153
 
154
- .flight-calculator-ui :global(.tech-slider:hover) {
154
+ .flight-calculator-ui .tech-slider:hover {
155
155
  background: var(--dft-border-light);
156
156
  }
157
157
 
158
- .flight-calculator-ui :global(.tech-slider::-webkit-slider-thumb) {
158
+ .flight-calculator-ui .tech-slider::-webkit-slider-thumb {
159
159
  appearance: none;
160
160
  -webkit-appearance: none;
161
161
  width: 22px;
@@ -168,8 +168,8 @@
168
168
  transition: all 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275);
169
169
  }
170
170
 
171
- .flight-calculator-ui :global(.tech-select),
172
- .flight-calculator-ui :global(.tech-input) {
171
+ .flight-calculator-ui .tech-select,
172
+ .flight-calculator-ui .tech-input {
173
173
  width: 100%;
174
174
  padding: 1rem 1.25rem;
175
175
  background: var(--dft-bg-surface);
@@ -182,22 +182,22 @@
182
182
  cursor: pointer;
183
183
  }
184
184
 
185
- .flight-calculator-ui :global(.tech-select:focus),
186
- .flight-calculator-ui :global(.tech-input:focus) {
185
+ .flight-calculator-ui .tech-select:focus,
186
+ .flight-calculator-ui .tech-input:focus {
187
187
  outline: none;
188
188
  border-color: var(--dft-accent);
189
189
  background: var(--dft-bg);
190
190
  box-shadow: 0 0 0 4px var(--dft-accent-glow);
191
191
  }
192
192
 
193
- .flight-calculator-ui :global(.presets) {
193
+ .flight-calculator-ui .presets {
194
194
  display: flex;
195
195
  gap: 0.5rem;
196
196
  flex-wrap: wrap;
197
197
  margin-top: 0.5rem;
198
198
  }
199
199
 
200
- .flight-calculator-ui :global(.preset-btn) {
200
+ .flight-calculator-ui .preset-btn {
201
201
  padding: 0.5rem 1rem;
202
202
  background: var(--dft-bg-surface);
203
203
  border: 1px solid transparent;
@@ -209,28 +209,28 @@
209
209
  transition: all 0.2s;
210
210
  }
211
211
 
212
- .flight-calculator-ui :global(.preset-btn:hover) {
212
+ .flight-calculator-ui .preset-btn:hover {
213
213
  background: var(--dft-bg);
214
214
  border-color: var(--dft-accent);
215
215
  color: var(--dft-accent);
216
216
  transform: translateY(-2px);
217
217
  }
218
218
 
219
- .flight-calculator-ui :global(.hint) {
219
+ .flight-calculator-ui .hint {
220
220
  font-size: 0.7rem;
221
221
  color: var(--dft-text-dim);
222
222
  font-style: italic;
223
223
  line-height: 1.4;
224
224
  }
225
225
 
226
- .flight-calculator-ui :global(.dashboard-section) {
226
+ .flight-calculator-ui .dashboard-section {
227
227
  display: flex;
228
228
  flex-direction: column;
229
229
  align-items: center;
230
230
  gap: 3.5rem;
231
231
  }
232
232
 
233
- .flight-calculator-ui :global(.radial-container) {
233
+ .flight-calculator-ui .radial-container {
234
234
  position: relative;
235
235
  width: 320px;
236
236
  height: 320px;
@@ -239,20 +239,20 @@
239
239
  align-items: center;
240
240
  }
241
241
 
242
- .flight-calculator-ui :global(.radial-svg) {
242
+ .flight-calculator-ui .radial-svg {
243
243
  transform: rotate(-90deg);
244
244
  width: 100%;
245
245
  height: 100%;
246
246
  filter: drop-shadow(0 10px 30px rgba(var(--dft-accent-rgb), 0.15));
247
247
  }
248
248
 
249
- .flight-calculator-ui :global(.bg-circle) {
249
+ .flight-calculator-ui .bg-circle {
250
250
  fill: none;
251
251
  stroke: var(--dft-bg-surface);
252
252
  stroke-width: 10;
253
253
  }
254
254
 
255
- .flight-calculator-ui :global(.fg-circle) {
255
+ .flight-calculator-ui .fg-circle {
256
256
  fill: none;
257
257
  stroke: url("#statGradient");
258
258
  stroke-width: 10;
@@ -262,14 +262,14 @@
262
262
  transition: stroke-dashoffset 1s cubic-bezier(0.34, 1.56, 0.64, 1);
263
263
  }
264
264
 
265
- .flight-calculator-ui :global(.result-text) {
265
+ .flight-calculator-ui .result-text {
266
266
  position: absolute;
267
267
  display: flex;
268
268
  flex-direction: column;
269
269
  align-items: center;
270
270
  }
271
271
 
272
- .flight-calculator-ui :global(.time-primary) {
272
+ .flight-calculator-ui .time-primary {
273
273
  font-size: 7rem;
274
274
  font-weight: 950;
275
275
  color: var(--dft-text);
@@ -277,7 +277,7 @@
277
277
  line-height: 1;
278
278
  }
279
279
 
280
- .flight-calculator-ui :global(.time-label) {
280
+ .flight-calculator-ui .time-label {
281
281
  font-size: 1rem;
282
282
  font-weight: 850;
283
283
  color: var(--dft-text-muted);
@@ -286,14 +286,14 @@
286
286
  margin-top: 0.5rem;
287
287
  }
288
288
 
289
- .flight-calculator-ui :global(.secondary-stats) {
289
+ .flight-calculator-ui .secondary-stats {
290
290
  display: grid;
291
291
  grid-template-columns: repeat(3, 1fr);
292
292
  gap: 2rem;
293
293
  width: 100%;
294
294
  }
295
295
 
296
- .flight-calculator-ui :global(.stat-box) {
296
+ .flight-calculator-ui .stat-box {
297
297
  display: flex;
298
298
  flex-direction: column;
299
299
  align-items: center;
@@ -305,13 +305,13 @@
305
305
  transition: all 0.3s ease;
306
306
  }
307
307
 
308
- .flight-calculator-ui :global(.stat-box:hover) {
308
+ .flight-calculator-ui .stat-box:hover {
309
309
  transform: translateY(-5px);
310
310
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.04);
311
311
  border-color: var(--dft-accent);
312
312
  }
313
313
 
314
- .flight-calculator-ui :global(.stat-label) {
314
+ .flight-calculator-ui .stat-label {
315
315
  font-size: 0.75rem;
316
316
  font-weight: 800;
317
317
  color: var(--dft-text-dim);
@@ -319,26 +319,26 @@
319
319
  letter-spacing: 0.1em;
320
320
  }
321
321
 
322
- .flight-calculator-ui :global(.stat-value) {
322
+ .flight-calculator-ui .stat-value {
323
323
  font-size: 1.75rem;
324
324
  font-weight: 950;
325
325
  color: var(--dft-text);
326
326
  }
327
327
 
328
- .flight-calculator-ui :global(.chart-header) {
328
+ .flight-calculator-ui .chart-header {
329
329
  display: flex;
330
330
  justify-content: space-between;
331
331
  align-items: center;
332
332
  margin-bottom: 2rem;
333
333
  }
334
334
 
335
- .flight-calculator-ui :global(.chart-subtitle) {
335
+ .flight-calculator-ui .chart-subtitle {
336
336
  font-size: 0.85rem;
337
337
  font-weight: 700;
338
338
  color: var(--dft-text-muted);
339
339
  }
340
340
 
341
- .flight-calculator-ui :global(.chart-body) {
341
+ .flight-calculator-ui .chart-body {
342
342
  position: relative;
343
343
  height: 350px;
344
344
  width: 100%;
@@ -360,11 +360,11 @@
360
360
 
361
361
  @media (max-width: 600px) {
362
362
  .flight-calculator-ui { padding: 0.5rem; }
363
- .flight-calculator-ui :global(.secondary-stats) { grid-template-columns: 1fr; }
364
- .flight-calculator-ui :global(.radial-container) {
363
+ .flight-calculator-ui .secondary-stats { grid-template-columns: 1fr; }
364
+ .flight-calculator-ui .radial-container {
365
365
  width: 240px;
366
366
  height: 240px;
367
367
  }
368
- .flight-calculator-ui :global(.time-primary) { font-size: 4.5rem; }
369
- .flight-calculator-ui :global(.stat-box) { padding: 1.5rem; }
368
+ .flight-calculator-ui .time-primary { font-size: 4.5rem; }
369
+ .flight-calculator-ui .stat-box { padding: 1.5rem; }
370
370
  }
package/src/tool/gps-coordinates-converter/gps-coordinates-converter.css CHANGED
@@ -21,8 +21,8 @@
21
21
  padding: 0 1.5rem;
22
22
  }
23
23
 
24
- :global([data-theme="dark"]) .gps-converter-ui,
25
- :global(.theme-dark) .gps-converter-ui {
24
+ [data-theme="dark"] .gps-converter-ui,
25
+ .theme-dark .gps-converter-ui {
26
26
  --gps-bg: #0f172a;
27
27
  --gps-bg-muted: #1e293b;
28
28
  --gps-bg-surface: #334155;
@@ -93,13 +93,13 @@
93
93
  background: linear-gradient(90deg, transparent, var(--gps-border-light), transparent);
94
94
  }
95
95
 
96
- .gps-converter-ui :global(.tech-section) {
96
+ .gps-converter-ui .tech-section {
97
97
  display: flex;
98
98
  flex-direction: column;
99
99
  gap: 1.5rem;
100
100
  }
101
101
 
102
- .gps-converter-ui :global(.section-title) {
102
+ .gps-converter-ui .section-title {
103
103
  font-size: 0.75rem;
104
104
  font-weight: 800;
105
105
  color: var(--gps-text-muted);
@@ -107,7 +107,7 @@
107
107
  letter-spacing: 0.15em;
108
108
  }
109
109
 
110
- .gps-converter-ui :global(.field-label) {
110
+ .gps-converter-ui .field-label {
111
111
  font-size: 0.7rem;
112
112
  font-weight: 800;
113
113
  color: var(--gps-text-dim);
@@ -117,7 +117,7 @@
117
117
  display: block;
118
118
  }
119
119
 
120
- .gps-converter-ui :global(.tech-input) {
120
+ .gps-converter-ui .tech-input {
121
121
  width: 100%;
122
122
  padding: 1rem 1.25rem;
123
123
  background: var(--gps-bg-surface);
@@ -129,14 +129,14 @@
129
129
  transition: all 0.3s ease;
130
130
  }
131
131
 
132
- .gps-converter-ui :global(.tech-input:focus) {
132
+ .gps-converter-ui .tech-input:focus {
133
133
  outline: none;
134
134
  border-color: var(--gps-accent);
135
135
  box-shadow: 0 0 0 4px var(--gps-accent-glow);
136
136
  background: var(--gps-bg);
137
137
  }
138
138
 
139
- .gps-converter-ui :global(.mode-switch) {
139
+ .gps-converter-ui .mode-switch {
140
140
  display: flex;
141
141
  background: var(--gps-bg-surface);
142
142
  padding: 0.4rem;
@@ -144,7 +144,7 @@
144
144
  gap: 0.25rem;
145
145
  }
146
146
 
147
- .gps-converter-ui :global(.mode-btn) {
147
+ .gps-converter-ui .mode-btn {
148
148
  flex: 1;
149
149
  padding: 0.75rem;
150
150
  border-radius: 14px;
@@ -157,13 +157,13 @@
157
157
  transition: all 0.3s ease;
158
158
  }
159
159
 
160
- .gps-converter-ui :global(.mode-btn.active) {
160
+ .gps-converter-ui .mode-btn.active {
161
161
  background: var(--gps-bg);
162
162
  color: var(--gps-accent);
163
163
  box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1);
164
164
  }
165
165
 
166
- .gps-converter-ui :global(.map-container) {
166
+ .gps-converter-ui .map-container {
167
167
  max-width: 100%;
168
168
  height: 400px;
169
169
  border-radius: 32px;
@@ -172,13 +172,13 @@
172
172
  border: 1px solid var(--gps-border-light);
173
173
  }
174
174
 
175
- .gps-converter-ui :global(.results-area) {
175
+ .gps-converter-ui .results-area {
176
176
  display: grid;
177
177
  grid-template-columns: repeat(2, 1fr);
178
178
  gap: 2rem;
179
179
  }
180
180
 
181
- .gps-converter-ui :global(.result-box) {
181
+ .gps-converter-ui .result-box {
182
182
  background: var(--gps-bg-overlay);
183
183
  border: 1px solid var(--gps-border-light);
184
184
  border-radius: 28px;
@@ -189,19 +189,19 @@
189
189
  transition: all 0.3s ease;
190
190
  }
191
191
 
192
- .gps-converter-ui :global(.result-box:hover) {
192
+ .gps-converter-ui .result-box:hover {
193
193
  transform: translateY(-5px);
194
194
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.04);
195
195
  border-color: var(--gps-accent);
196
196
  }
197
197
 
198
- .gps-converter-ui :global(.res-header) {
198
+ .gps-converter-ui .res-header {
199
199
  display: flex;
200
200
  justify-content: space-between;
201
201
  align-items: center;
202
202
  }
203
203
 
204
- .gps-converter-ui :global(.copy-btn) {
204
+ .gps-converter-ui .copy-btn {
205
205
  background: var(--gps-bg-surface);
206
206
  border: 1px solid var(--gps-border);
207
207
  color: var(--gps-text-muted);
@@ -216,13 +216,13 @@
216
216
  transition: all 0.3s ease;
217
217
  }
218
218
 
219
- .gps-converter-ui :global(.copy-btn:hover) {
219
+ .gps-converter-ui .copy-btn:hover {
220
220
  background: var(--gps-accent);
221
221
  color: white;
222
222
  border-color: var(--gps-accent);
223
223
  }
224
224
 
225
- .gps-converter-ui :global(.val-display) {
225
+ .gps-converter-ui .val-display {
226
226
  font-size: 1.5rem;
227
227
  font-weight: 900;
228
228
  color: var(--gps-text);
@@ -230,7 +230,7 @@
230
230
  letter-spacing: -0.01em;
231
231
  }
232
232
 
233
- .gps-converter-ui :global(.history-item) {
233
+ .gps-converter-ui .history-item {
234
234
  padding: 1.25rem 1.5rem;
235
235
  background: var(--gps-bg-surface);
236
236
  border-radius: 20px;
@@ -241,33 +241,33 @@
241
241
  border: 1px solid transparent;
242
242
  }
243
243
 
244
- .gps-converter-ui :global(.history-item:hover) {
244
+ .gps-converter-ui .history-item:hover {
245
245
  background: var(--gps-bg);
246
246
  border-color: var(--gps-accent);
247
247
  transform: translateX(5px);
248
248
  }
249
249
 
250
- .gps-converter-ui :global(.hist-info) {
250
+ .gps-converter-ui .hist-info {
251
251
  display: flex;
252
252
  flex-direction: column;
253
253
  cursor: pointer;
254
254
  flex: 1;
255
255
  }
256
256
 
257
- .gps-converter-ui :global(.hist-coords) {
257
+ .gps-converter-ui .hist-coords {
258
258
  font-size: 0.9rem;
259
259
  font-weight: 800;
260
260
  color: var(--gps-text);
261
261
  }
262
262
 
263
- .gps-converter-ui :global(.hist-time) {
263
+ .gps-converter-ui .hist-time {
264
264
  font-size: 0.7rem;
265
265
  color: var(--gps-text-dim);
266
266
  font-weight: 700;
267
267
  text-transform: uppercase;
268
268
  }
269
269
 
270
- .gps-converter-ui :global(.action-btn) {
270
+ .gps-converter-ui .action-btn {
271
271
  background: var(--gps-bg-overlay);
272
272
  border: 1px solid var(--gps-border);
273
273
  padding: 0.6rem;
@@ -280,7 +280,7 @@
280
280
  transition: all 0.2s ease;
281
281
  }
282
282
 
283
- .gps-converter-ui :global(.no-history) {
283
+ .gps-converter-ui .no-history {
284
284
  text-align: center;
285
285
  padding: 3rem;
286
286
  color: var(--gps-text-dim);
@@ -302,5 +302,5 @@
302
302
  .gps-converter-ui { padding: 0.5rem; }
303
303
  .gps-converter-ui .config-sidebar,
304
304
  .gps-converter-ui .main-display { padding: 2rem 1.5rem; }
305
- .gps-converter-ui :global(.results-area) { grid-template-columns: 1fr; }
305
+ .gps-converter-ui .results-area { grid-template-columns: 1fr; }
306
306
  }