.navigation-bar{display:flex;justify-content:space-between;align-items:center;background-color:#1a1a1a;border-bottom:2px solid #333;padding:.5rem 1rem;height:60px;position:sticky;top:0;z-index:1000;box-shadow:0 2px 4px #00000080}.nav-brand h1{margin:0;font-size:1.5rem;color:#0f0;text-shadow:0 0 10px rgba(0,255,0,.5)}.nav-status{display:flex;align-items:center;gap:1rem}.nav-model{font-weight:700;color:#0f0;font-size:1.1rem}.nav-serial{color:#999;font-size:.9rem}.nav-latency{color:#0cf;font-size:.9rem;padding:.2rem .5rem;background-color:#00ccff1a;border-radius:4px}.nav-connection{display:flex;align-items:center;gap:.5rem;padding-left:1rem;border-left:1px solid #333}.nav-connection .status-indicator{width:12px;height:12px;border-radius:50%;display:inline-block}.nav-connection .status-indicator.connected{background-color:#0f0;box-shadow:0 0 10px #0f0c}.nav-connection .status-indicator.disconnected{background-color:red;box-shadow:0 0 10px #f00c}.nav-connection .status-indicator.reconnecting{background-color:#fa0;animation:pulse 1s infinite}.nav-connection .status-indicator.radio-connecting{background-color:#fd0;animation:pulse-yellow 1s infinite}.nav-connection .status-text{color:#ccc;font-size:.9rem}.nav-connection .reconnect-message{color:#fa0;font-size:.85rem}@keyframes pulse{0%{opacity:1;box-shadow:0 0 10px #fa0c}50%{opacity:.6;box-shadow:0 0 5px #fa06}to{opacity:1;box-shadow:0 0 10px #fa0c}}@keyframes pulse-yellow{0%{opacity:1;box-shadow:0 0 10px #fd0c}50%{opacity:.6;box-shadow:0 0 5px #fd06}to{opacity:1;box-shadow:0 0 10px #fd0c}}@media (max-width: 768px){.navigation-bar{padding:.5rem;height:50px}.nav-brand h1{font-size:1.2rem}.nav-serial{display:none}.nav-status{gap:.5rem}}.radio-control{margin-top:2rem}.main-controls{grid-template-columns:2fr 1fr;margin-bottom:1rem}.sub-controls{grid-template-columns:2fr 1fr}.radio-info{text-align:center;margin-top:1rem;opacity:.7}@media (max-width: 768px){.main-controls,.sub-controls{grid-template-columns:1fr}}.frequency-control h3{margin:0;font-size:1.2rem}.frequency-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.vfo-indicator{padding:.25rem .75rem;background-color:#2196f3;color:#fff;border-radius:4px;font-size:.9rem;font-weight:500}.frequency-display{display:flex;align-items:center;gap:.5rem;margin-bottom:1rem;font-size:2rem}.frequency-input{flex:1;font-size:2rem;text-align:center;font-family:Courier New,monospace;padding:.5rem;background-color:#0000004d;border:2px solid transparent}.frequency-input:focus{border-color:#2196f3;outline:none}.frequency-unit{font-size:1.2rem;opacity:.7}.freq-step-button{padding:.5rem .75rem;font-size:1.2rem;min-width:auto}.frequency-controls{display:flex;justify-content:space-between;align-items:center;gap:1rem}.step-buttons{display:flex;gap:.5rem}.step-buttons button{padding:.4rem .8rem;font-size:.9rem}.vfo-swap-button{background-color:#ff9800;color:#fff}.vfo-swap-button:hover{background-color:#f57c00;border-color:#f57c00}.mode-control h3{margin-top:0;margin-bottom:1rem;font-size:1.2rem}.mode-buttons{display:grid;grid-template-columns:repeat(auto-fit,minmax(60px,1fr));gap:.5rem;margin-bottom:1.5rem}.mode-button{padding:.5rem;font-size:.9rem;background-color:#ffffff1a;border:1px solid rgba(255,255,255,.2)}.mode-button:hover{background-color:#fff3;border-color:#2196f3}.mode-button.active{background-color:#2196f3;color:#fff;border-color:#2196f3}.filter-section{margin-top:1rem}.filter-section label{display:block;font-size:.9rem;margin-bottom:.5rem;opacity:.7}.filter-buttons{display:flex;gap:.5rem}.filter-button{padding:.4rem .8rem;font-size:.85rem;background-color:#ffffff0d;border:1px solid rgba(255,255,255,.1)}.filter-button.active{background-color:#2196f34d;border-color:#2196f3;color:#2196f3}.ptt-control h3{margin-top:0;margin-bottom:1rem;font-size:1.2rem}.ptt-button{width:100%;height:120px;font-size:1.5rem;border-radius:12px;background-color:#4caf50;color:#fff;cursor:pointer;-webkit-user-select:none;user-select:none;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.5rem;transition:all .1s}.ptt-button:hover{background-color:#45a049;border-color:#45a049}.ptt-button:active,.ptt-button.transmitting{background-color:#f44336;border-color:#f44336;transform:scale(.98)}.ptt-button.transmitting:hover{background-color:#da190b;border-color:#da190b}.ptt-status{font-size:2rem;font-weight:700}.ptt-label{font-size:1rem;opacity:.9}.ptt-hint{text-align:center;margin-top:.5rem;font-size:.85rem;opacity:.6}.meter-display h3{margin-top:0;margin-bottom:1rem;font-size:1.2rem}.meter-container{margin-bottom:1rem}.meter-label{font-size:.9rem;font-weight:500;margin-bottom:.5rem;opacity:.8}.meter-bar-container{position:relative;margin-bottom:.5rem}.meter-scale{display:flex;justify-content:space-between;font-size:.7rem;opacity:.6;margin-bottom:.25rem}.meter-bar{height:20px;background-color:#ffffff1a;border-radius:4px;overflow:hidden;position:relative}.meter-fill{height:100%;transition:width .1s ease-out;border-radius:4px}.meter-fill.s-meter{background:linear-gradient(to right,#4caf50,#4caf50 60%,#ff9800,#f44336)}.meter-fill.power{background:linear-gradient(to right,#2196f3,#2196f3 50%,#ff9800 80%,#f44336)}.meter-value{font-size:1.2rem;font-weight:700;text-align:center;font-family:Courier New,monospace}.sub-meters{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:.75rem;padding-top:1rem;border-top:1px solid rgba(255,255,255,.1)}.sub-meter{display:flex;justify-content:space-between;align-items:center}.sub-meter-label{font-size:.85rem;opacity:.7}.sub-meter-value{font-size:.95rem;font-weight:500;font-family:Courier New,monospace}.status-indicators{display:flex;gap:1rem;margin-top:1rem;padding-top:1rem;border-top:1px solid rgba(255,255,255,.1)}.status-indicator{display:flex;align-items:center;gap:.5rem;padding:.25rem .75rem;border-radius:4px;background-color:#ffffff1a;transition:all .2s ease}.status-indicator.active{background-color:#4caf504d;box-shadow:0 0 10px #4caf5080}.status-label{font-size:.85rem;font-weight:600;opacity:.8}.status-value{font-size:.85rem;font-weight:500;font-family:Courier New,monospace}.waterfall-display{background-color:#000;border:1px solid #333;border-radius:4px;overflow:visible;position:relative}.waterfall-display>div:first-child{overflow:hidden}.spectrum-container{position:relative;border-bottom:1px solid #333}.waterfall-container{position:relative;overflow-y:auto;overflow-x:hidden;scrollbar-width:none;-ms-overflow-style:none;will-change:scroll-position;-webkit-overflow-scrolling:touch}.waterfall-container::-webkit-scrollbar{display:none}.spectrum-canvas,.waterfall-canvas{display:block;image-rendering:pixelated;image-rendering:-moz-crisp-edges;image-rendering:crisp-edges}.spectrum-canvas{background:linear-gradient(180deg,#111,#000)}.waterfall-canvas{background:#000;backface-visibility:hidden;transform:translateZ(0)}.overlay-canvas{display:block;z-index:10}.time-axis-canvas{display:block;will-change:transform}.waterfall-controls{padding:10px;background:#111;border-bottom:1px solid #333;position:relative;height:50px;box-sizing:border-box;overflow:visible}.color-map-button,.smoothing-button{background:#333;color:#fff;border:1px solid #555;padding:5px 15px;border-radius:4px;cursor:pointer;font-size:12px;margin-right:10px}.color-map-button:hover,.smoothing-button:hover{background:#444}.smoothing-button.active{background:#4a4;border-color:#6c6}.color-map-selector{position:absolute;bottom:100%;left:10px;background:#222;border:1px solid #444;border-radius:4px;box-shadow:0 -2px 10px #00000080;z-index:20;padding:5px;margin-bottom:5px}.color-map-option{display:flex;align-items:center;padding:5px;cursor:pointer;border-radius:3px;margin:2px 0}.color-map-option:hover{background:#333}.color-map-option.selected{background:#444;border:1px solid #666}.color-map-option img{margin-right:10px;border:1px solid #555}.color-map-option span{color:#fff;font-size:12px}.smoothing-settings{position:absolute;bottom:100%;left:150px;background:#222;border:1px solid #444;border-radius:4px;box-shadow:0 -2px 10px #00000080;z-index:20;padding:15px;min-width:250px;margin-bottom:5px}.smoothing-option{margin:10px 0;color:#fff;font-size:12px}.smoothing-option label{display:block;margin-bottom:5px}.smoothing-option input[type=checkbox]{margin-right:5px}.smoothing-option select{width:100%;background:#333;color:#fff;border:1px solid #555;padding:5px;border-radius:3px;font-size:12px}.smoothing-option input[type=range]{width:100%;margin-top:5px}.close-settings{margin-top:10px;background:#555;color:#fff;border:none;padding:5px 15px;border-radius:3px;cursor:pointer;font-size:12px;width:100%}.close-settings:hover{background:#666}.waterfall-fullwidth .waterfall-display{border-radius:0;border-left:none;border-right:none}.spectrum-control{background-color:#1e1e1e;border:1px solid #333;border-radius:8px;padding:15px;margin:10px}.spectrum-control-content .spectrum-control{margin:0;border:none;border-radius:0;background-color:transparent}.spectrum-control h3{margin:0 0 15px;color:#fff;font-size:16px;font-weight:700;border-bottom:1px solid #333;padding-bottom:10px}.control-section{margin-bottom:20px}.control-section h4{margin:0 0 10px;color:#ddd;font-size:14px;font-weight:400}.control-section h5{margin:15px 0 10px;color:#bbb;font-size:13px;font-weight:400;border-top:1px solid #444;padding-top:10px}.control-row{display:flex;align-items:center;gap:15px;margin-bottom:10px;flex-wrap:wrap}.control-row label{display:flex;align-items:center;gap:8px;color:#ccc;font-size:13px}.control-row label span{min-width:80px}.control-row input[type=number]{width:100px;padding:4px 8px;background-color:#2a2a2a;border:1px solid #444;border-radius:4px;color:#fff;font-size:13px}.control-row input[type=number]:focus{outline:none;border-color:#09f}.control-row select{padding:4px 8px;background-color:#2a2a2a;border:1px solid #444;border-radius:4px;color:#fff;font-size:13px;cursor:pointer}.control-row select:focus{outline:none;border-color:#09f}.toggle-btn{padding:4px 12px;background-color:#333;border:1px solid #555;border-radius:4px;color:#aaa;font-size:13px;cursor:pointer;transition:all .2s}.toggle-btn:hover{background-color:#404040}.toggle-btn.active{background-color:#09f;border-color:#09f;color:#fff}.mode-buttons,.speed-buttons{display:flex;gap:5px;flex-wrap:wrap}.mode-btn,.speed-btn{padding:6px 12px;background-color:#333;border:1px solid #555;border-radius:4px;color:#aaa;font-size:13px;cursor:pointer;transition:all .2s}.mode-btn:hover,.speed-btn:hover{background-color:#404040}.mode-btn.active,.speed-btn.active{background-color:#09f;border-color:#09f;color:#fff}.action-btn{padding:6px 12px;background-color:#555;border:1px solid #666;border-radius:4px;color:#fff;font-size:13px;cursor:pointer;transition:all .2s}.action-btn:hover{background-color:#666}.action-btn:active{background-color:#444}input[type=range]{-webkit-appearance:none;width:100%;height:6px;border-radius:3px;background:#333;outline:none;margin:10px 0}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:16px;height:16px;border-radius:50%;background:#09f;cursor:pointer}input[type=range]::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:#09f;cursor:pointer;border:none}@media (max-width: 768px){.control-row{flex-direction:column;align-items:stretch}.control-row label,.mode-buttons,.speed-buttons{justify-content:space-between}.mode-btn,.speed-btn{flex:1;min-width:80px}}.waterfall-fullwidth .spectrum-control{border-radius:0;border-left:none;border-right:none;margin-top:0}.audio-control{background-color:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:8px;padding:1.5rem;margin-top:1rem}.audio-control h3{margin-top:0;margin-bottom:1rem;color:#fff}.audio-controls{display:flex;align-items:center;gap:1rem;margin-bottom:1.5rem}.audio-button{padding:.75rem 1.5rem;font-size:1rem;border:none;border-radius:4px;background-color:#2196f3;color:#fff;cursor:pointer;transition:all .3s ease}.audio-button:hover{background-color:#1976d2}.audio-button.active{background-color:#f44336}.audio-button.active:hover{background-color:#d32f2f}.audio-status{font-size:.9rem;color:#ccc}.audio-levels{margin-bottom:1.5rem}.level-meter{margin-bottom:1rem}.level-meter label{display:block;margin-bottom:.5rem;font-size:.9rem;color:#ccc}.meter-bar{width:100%;height:20px;background-color:#0000004d;border-radius:10px;overflow:hidden;position:relative;margin-bottom:.25rem}.meter-fill{height:100%;transition:width .1s ease}.meter-fill.input{background:linear-gradient(90deg,#4caf50,#8bc34a 50%,#ffeb3b 80%,#ff5722)}.meter-fill.output{background:linear-gradient(90deg,#2196f3,#03a9f4 50%,#00bcd4 80%,#009688)}.level-db{font-size:.8rem;color:#999}.audio-settings{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.gain-control{display:flex;flex-direction:column;gap:.5rem}.gain-control label{font-size:.9rem;color:#ccc}.gain-control input[type=range]{width:100%;height:6px;background:#ffffff1a;border-radius:3px;outline:none;-webkit-appearance:none}.gain-control input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:16px;height:16px;background:#2196f3;border-radius:50%;cursor:pointer}.gain-control input[type=range]::-moz-range-thumb{width:16px;height:16px;background:#2196f3;border-radius:50%;cursor:pointer;border:none}.gain-control span{text-align:center;font-size:.9rem;color:#fff}.device-selector{display:flex;flex-direction:column;gap:.5rem}.device-selector label{font-size:.9rem;color:#ccc}.device-selector select{padding:.5rem;background-color:#ffffff1a;border:1px solid rgba(255,255,255,.2);border-radius:4px;color:#fff;font-size:.9rem}.device-selector select:disabled{opacity:.5;cursor:not-allowed}.audio-queue-info{display:flex;align-items:center;gap:1rem;padding:.75rem;background-color:#ffffff0d;border-radius:4px;margin-bottom:1rem}.audio-queue-info label{font-size:.9rem;color:#ccc}.queue-length{font-weight:700;color:#4caf50;font-size:1rem}.queue-length.warning{color:#ff9800;animation:pulse 1s infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.7}}.advanced-controls{background:#1a1a1a;border:1px solid #333;border-radius:8px;padding:20px;margin-top:20px}.advanced-controls h3{margin:0 0 20px;color:#fff;font-size:18px}.control-section{margin-bottom:25px;padding-bottom:20px;border-bottom:1px solid #333}.control-section:last-child{margin-bottom:0;padding-bottom:0;border-bottom:none}.control-section h4{margin:0 0 15px;color:#999;font-size:14px;text-transform:uppercase;letter-spacing:.5px}.button-group{display:flex;gap:8px;flex-wrap:wrap}.control-button,.vfo-button,.split-button,.rit-button,.filter-button,.att-button,.preamp-button,.agc-button,.step-button{padding:8px 16px;background:#333;border:1px solid #555;border-radius:4px;color:#fff;font-size:14px;cursor:pointer;transition:all .2s;white-space:nowrap}.control-button:hover,.vfo-button:hover,.split-button:hover,.rit-button:hover,.filter-button:hover,.att-button:hover,.preamp-button:hover,.agc-button:hover,.step-button:hover{background:#444;border-color:#4caf50}.control-button:active,.vfo-button:active,.split-button:active,.rit-button:active,.filter-button:active,.att-button:active,.preamp-button:active,.agc-button:active,.step-button:active{transform:scale(.98)}.vfo-button.active,.split-button.active,.rit-button.active,.filter-button.active,.att-button.active,.preamp-button.active,.agc-button.active,.step-button.active{background:#4caf50;border-color:#4caf50}.control-button:disabled{opacity:.5;cursor:not-allowed}.rit-offset{display:flex;align-items:center;gap:8px;margin-top:10px}.rit-offset-input{width:100px;padding:6px 10px;background:#222;border:1px solid #444;border-radius:4px;color:#fff;font-size:14px;text-align:right}.rf-controls{display:grid;grid-template-columns:1fr 1fr;gap:20px}.attenuator-group,.preamp-group{display:flex;flex-direction:column;gap:8px}.attenuator-group label,.preamp-group label{color:#999;font-size:12px;text-transform:uppercase}.power-control{display:flex;align-items:center;gap:15px}.power-slider{flex:1;height:6px;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#333;border-radius:3px;outline:none}.power-slider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:20px;height:20px;background:#4caf50;border-radius:50%;cursor:pointer;box-shadow:0 2px 4px #0000004d}.power-slider::-moz-range-thumb{width:20px;height:20px;background:#4caf50;border-radius:50%;border:none;cursor:pointer;box-shadow:0 2px 4px #0000004d}.power-value{min-width:50px;text-align:right;color:#4caf50;font-weight:700}.tuning-steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(70px,1fr))}.tuner-button{padding:.5rem 1rem;background:var(--card-bg);color:var(--text-color);border:1px solid var(--border-color);border-radius:4px;cursor:pointer;transition:all .2s;font-weight:500}.tuner-button:hover{background:var(--primary-color);color:#fff}.tuner-button.force{background:#ff6b6b;color:#fff;border-color:#ff5252}.tuner-button.force:hover{background:#ff5252}@media (max-width: 768px){.advanced-controls{padding:15px}.rf-controls{grid-template-columns:1fr}.button-group{flex-wrap:wrap}.control-button,.vfo-button,.split-button,.rit-button,.filter-button,.att-button,.preamp-button,.agc-button,.step-button{padding:10px 12px;font-size:13px}}.App{min-height:100vh;overflow-x:hidden}.App .navigation-bar{position:fixed;top:0;left:0;right:0;z-index:999}.App.with-audio-notice .navigation-bar{top:44px}.status-bar{padding:.5rem 1rem;background-color:#0003;border-radius:4px;margin-bottom:1rem;display:flex;align-items:center;font-size:.9em}.waterfall-section{margin-top:2rem}.waterfall-section h2{margin-bottom:1rem;font-size:1.5rem;color:#fff}.waterfall-fullwidth{position:relative;width:100vw;left:50%;right:50%;margin-left:-50vw;margin-right:-50vw;margin-top:60px;background-color:#000;border-bottom:2px solid #333}.App .waterfall-fullwidth.with-audio-notice{margin-top:104px}.spectrum-control-section{background-color:#1a1a1a;border-bottom:1px solid #333;width:100vw;position:relative;left:50%;right:50%;margin-left:-50vw;margin-right:-50vw;margin-top:0}.spectrum-control-toggle{width:100%;padding:.75rem 1rem;background-color:#242424;border:none;border-bottom:1px solid #333;color:#ccc;font-size:1rem;text-align:left;cursor:pointer;display:flex;align-items:center;gap:.5rem;transition:background-color .2s}.spectrum-control-toggle:hover{background-color:#2a2a2a}.spectrum-control-toggle .toggle-icon{display:inline-block;transition:transform .2s;font-size:.8rem}.spectrum-control-content{padding:1rem;background-color:#1a1a1a;animation:slideDown .3s ease-out}@keyframes slideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.mobile-connection-panel{padding:10px 0}.connection-form .form-group{margin-bottom:20px}.connection-form label{display:block;margin-bottom:8px;color:#999;font-size:14px}.mobile-select{width:100%;padding:12px;background:#222;border:1px solid #444;border-radius:8px;color:#fff;font-size:16px}.mobile-input{width:100%;padding:12px;background:#222;border:1px solid #444;border-radius:8px;color:#fff;font-size:16px;margin-top:8px}.button-group{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.rate-button{padding:10px;background:#333;border:1px solid #444;border-radius:6px;color:#fff;cursor:pointer;transition:all .2s}.rate-button.active{background:#4caf50;border-color:#4caf50}.connection-info .info-item{display:flex;justify-content:space-between;padding:8px 0;border-bottom:1px solid #333}.hint-list{list-style:none;padding:0;margin:0}.hint-list li{padding:8px 0;color:#999;font-size:14px}.mobile-radio-control{padding:10px 0}.frequency-display{display:flex;align-items:center;gap:10px;margin:15px 0}.frequency-unit{font-size:20px;color:#4caf50}.vfo-indicator{text-align:center;color:#666;font-size:14px}.mode-selector{display:grid;grid-template-columns:repeat(auto-fit,minmax(60px,1fr));gap:8px}.mode-button{padding:12px;background:#333;border:1px solid #444;border-radius:6px;color:#fff;cursor:pointer;transition:all .2s;font-weight:500}.mode-button.active{background:#4caf50;border-color:#4caf50}.meter-display{margin:15px 0}.meter-label{font-size:14px;color:#999;margin-bottom:5px}.meter-value{font-size:24px;font-weight:700;color:#4caf50;margin-bottom:10px}.meter-bar{height:20px;background:#222;border-radius:10px;overflow:hidden}.meter-bar-fill{height:100%;background:linear-gradient(to right,#4caf50,#8bc34a);transition:width .3s ease}.ptt-section{text-align:center}.ptt-hint{margin-top:10px;color:#666;font-size:14px}.mobile-audio-control{padding:10px 0}.streaming-status{display:flex;align-items:center;justify-content:center;gap:10px;margin-top:15px;color:#4caf50}.status-indicator.streaming{width:10px;height:10px;background:#4caf50;border-radius:50%;animation:pulse 2s infinite}.level-meter{margin:15px 0}.level-bar{height:30px;background:#222;border-radius:15px;overflow:hidden;margin-bottom:10px}.level-fill{height:100%;transition:width .1s ease}.level-fill.low{background:#4caf50}.level-fill.medium{background:#ff9800}.level-fill.high{background:#f44336}.level-value{text-align:center;font-size:18px;font-weight:700}.gain-control{display:flex;align-items:center;gap:15px;margin-top:15px}.gain-control label{flex-shrink:0;color:#999;font-size:14px}.gain-value{flex-shrink:0;width:40px;text-align:right;font-weight:700;color:#4caf50}.settings-toggle{width:100%;padding:12px;background:#333;border:1px solid #444;border-radius:8px;color:#fff;cursor:pointer;font-size:16px;text-align:left;display:flex;justify-content:space-between;align-items:center}.audio-settings{margin-top:15px;padding-top:15px;border-top:1px solid #333}.info-card{background:#4caf501a;border:1px solid #4CAF50}.info-list{list-style:none;padding:0;margin:0}.info-list li{padding:8px 0;color:#ccc;font-size:14px;line-height:1.5}.mobile-waterfall-container{background:#000;border-radius:8px;overflow:hidden;margin:10px}.waterfall-header{padding:10px;background:#1a1a1a;border-bottom:1px solid #333}.color-map-button-mobile{padding:8px 16px;background:#333;border:1px solid #444;border-radius:6px;color:#fff;font-size:14px;cursor:pointer}.color-map-selector-mobile{position:absolute;top:60px;left:10px;right:10px;background:#222;border:1px solid #444;border-radius:8px;padding:8px;display:grid;grid-template-columns:repeat(2,1fr);gap:8px;z-index:100;box-shadow:0 4px 12px #00000080}.color-map-option-mobile{padding:10px;background:#333;border:1px solid #444;border-radius:6px;color:#fff;cursor:pointer;text-align:center;font-size:14px}.color-map-option-mobile.active{background:#4caf50;border-color:#4caf50}.spectrum-canvas-mobile,.waterfall-canvas-mobile{display:block;width:100%;touch-action:none}.mobile-radio-control.landscape{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:10px}.mobile-radio-control.landscape .mobile-card{margin:0}.mobile-audio-control.landscape{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:10px}.mobile-audio-control.landscape .mobile-card{margin:0}@media screen and (max-width: 768px){.container{padding:10px;max-width:100%}h1{font-size:1.5rem;margin:10px 0}h2{font-size:1.2rem}button{min-height:44px;min-width:44px;padding:12px 16px;font-size:16px}input,select,textarea{font-size:16px;padding:12px}.card{margin:10px 0;padding:15px}.grid-container{display:flex;flex-direction:column;gap:10px}body{overflow-x:hidden}.scrollable{-webkit-overflow-scrolling:touch;overflow-y:auto}}@media screen and (max-width: 375px){.container{padding:5px}button{padding:10px 12px;font-size:14px}}@media screen and (min-width: 769px) and (max-width: 1024px){.container{padding:20px;max-width:900px}}@supports (-webkit-touch-callout: none){.container{padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right);padding-bottom:env(safe-area-inset-bottom)}button,a,.clickable{-webkit-tap-highlight-color:transparent}.scrollable{-webkit-overflow-scrolling:touch}.no-select{-webkit-touch-callout:none;-webkit-user-select:none}}@media screen and (orientation: landscape) and (max-height: 500px){.header{position:sticky;top:0;z-index:100;background:var(--bg-primary)}.waterfall-display{max-height:calc(100vh - 100px)}}@media (prefers-reduced-motion: reduce){*{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}:root{--mobile-header-height: 50px;--mobile-nav-height: 60px;--safe-area-top: env(safe-area-inset-top);--safe-area-bottom: env(safe-area-inset-bottom)}.app-mobile{height:100vh;height:calc(var(--vh, 1vh) * 100);display:flex;flex-direction:column;overflow:hidden}.mobile-header{position:fixed;top:0;left:0;right:0;height:var(--mobile-header-height);background:#1a1a1a;border-bottom:1px solid #333;z-index:1000;padding-top:var(--safe-area-top)}.header-content{height:100%;display:flex;align-items:center;justify-content:space-between;padding:0 15px}.mobile-header h1{font-size:1.2rem;margin:0;font-weight:500}.connection-status{display:flex;align-items:center;gap:8px;font-size:.9rem}.connection-status .status-indicator{width:10px;height:10px;border-radius:50%;display:inline-block}.connection-status .status-indicator.connected{background-color:#0f0;box-shadow:0 0 8px #0f0c}.connection-status .status-indicator.disconnected{background-color:red;box-shadow:0 0 8px #f00c}.connection-status .status-indicator.reconnecting{background-color:#fa0;animation:pulse 1s infinite}.connection-status .status-indicator.radio-connecting{background-color:#fd0;animation:pulse-yellow 1s infinite}.connection-status .reconnect-message{color:#fa0;font-size:.85rem}@keyframes pulse{0%{opacity:1;box-shadow:0 0 8px #fa0c}50%{opacity:.6;box-shadow:0 0 4px #fa06}to{opacity:1;box-shadow:0 0 8px #fa0c}}@keyframes pulse-yellow{0%{opacity:1;box-shadow:0 0 8px #fd0c}50%{opacity:.6;box-shadow:0 0 4px #fd06}to{opacity:1;box-shadow:0 0 8px #fd0c}}.mobile-main{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;padding-top:calc(var(--mobile-header-height) + var(--safe-area-top));padding-bottom:calc(var(--mobile-nav-height) + var(--safe-area-bottom));background:#0a0a0a}.mobile-bottom-nav{position:fixed;bottom:0;left:0;right:0;height:var(--mobile-nav-height);background:#1a1a1a;border-top:1px solid #333;display:flex;justify-content:space-around;align-items:center;z-index:1000;padding-bottom:var(--safe-area-bottom)}.nav-item{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:8px;border:none;background:none;color:#666;cursor:pointer;transition:color .2s;-webkit-tap-highlight-color:transparent}.nav-item.active{color:#4caf50}.nav-item:active{transform:scale(.95)}.nav-icon{font-size:24px;margin-bottom:4px}.nav-label{font-size:12px}.mobile-card{background:#1a1a1a;border-radius:12px;padding:16px;margin:10px;box-shadow:0 2px 8px #0000004d}.mobile-button{background:#333;color:#fff;border:none;border-radius:8px;padding:12px 24px;font-size:16px;font-weight:500;cursor:pointer;transition:all .2s;-webkit-tap-highlight-color:transparent;min-height:44px;width:100%}.mobile-button:active{transform:scale(.98);background:#444}.mobile-button.primary{background:#4caf50}.mobile-button.primary:active{background:#45a049}.mobile-button.danger{background:#f44336}.mobile-button.danger:active{background:#da190b}.ptt-button-mobile{width:120px;height:120px;border-radius:50%;font-size:24px;font-weight:700;margin:20px auto;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 12px #0006}.ptt-button-mobile.transmitting{background:#f44336;animation:pulse 1s infinite}@keyframes pulse{0%{box-shadow:0 0 #f44336b3}70%{box-shadow:0 0 0 20px #f4433600}to{box-shadow:0 0 #f4433600}}.frequency-input-mobile{background:#222;border:2px solid #444;border-radius:8px;padding:16px;font-size:24px;font-weight:700;text-align:center;color:#4caf50;width:100%;font-family:Courier New,monospace}.slider-mobile{width:100%;height:40px;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;outline:none}.slider-mobile::-webkit-slider-track{width:100%;height:8px;background:#333;border-radius:4px}.slider-mobile::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:32px;height:32px;background:#4caf50;border-radius:50%;cursor:pointer;margin-top:-12px}@media screen and (orientation: landscape){.mobile-main{display:flex;flex-direction:row}.mobile-card{flex:1;margin:10px 5px}.ptt-button-mobile{width:80px;height:80px;font-size:18px}}@media screen and (max-width: 320px){.mobile-header h1{font-size:1rem}.nav-icon{font-size:20px}.nav-label{font-size:10px}.frequency-input-mobile{font-size:20px}}@media screen and (min-width: 768px){.mobile-main{max-width:600px;margin:0 auto}.mobile-card{margin:15px;padding:20px}.ptt-button-mobile{width:150px;height:150px}}.mobile-loading{display:flex;align-items:center;justify-content:center;height:200px}.spinner{width:40px;height:40px;border:4px solid #333;border-top-color:#4caf50;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.mobile-error{background:#f443361a;border:1px solid #f44336;border-radius:8px;padding:12px;margin:10px;color:#f44336;text-align:center}.mobile-success{background:#4caf501a;border:1px solid #4CAF50;border-radius:8px;padding:12px;margin:10px;color:#4caf50;text-align:center}.notification-container{position:fixed;top:20px;right:20px;z-index:9999;max-width:400px;pointer-events:none}.notification{display:flex;align-items:center;gap:12px;padding:16px 20px;margin-bottom:12px;background:#2a2a2a;border-radius:8px;box-shadow:0 4px 12px #0000004d;color:#fff;font-size:14px;line-height:1.4;pointer-events:all;cursor:pointer;transition:all .3s ease;animation:slideIn .3s ease;border-left:4px solid}@keyframes slideIn{0%{transform:translate(100%);opacity:0}to{transform:translate(0);opacity:1}}.notification:hover{transform:translate(-5px);box-shadow:0 6px 16px #0006}.notification-success{border-left-color:#4caf50}.notification-error{border-left-color:#f44336}.notification-warning{border-left-color:#ff9800}.notification-info{border-left-color:#2196f3}.notification-icon{flex-shrink:0;width:24px;height:24px;display:flex;align-items:center;justify-content:center;border-radius:50%;font-weight:700;font-size:16px}.notification-success .notification-icon{background:#4caf50;color:#fff}.notification-error .notification-icon{background:#f44336;color:#fff}.notification-warning .notification-icon{background:#ff9800;color:#fff}.notification-info .notification-icon{background:#2196f3;color:#fff}.notification-message{flex:1;word-wrap:break-word}.notification-close{flex-shrink:0;width:24px;height:24px;background:none;border:none;color:#999;font-size:20px;cursor:pointer;display:flex;align-items:center;justify-content:center;border-radius:4px;transition:all .2s;margin-left:8px}.notification-close:hover{background:#ffffff1a;color:#fff}@media (max-width: 768px){.notification-container{top:10px;left:10px;right:10px;max-width:none}.notification{font-size:13px;padding:12px 16px}}:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-text-size-adjust:100%}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh}h1{font-size:2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}button:disabled{opacity:.5;cursor:not-allowed}input,select{padding:.5em;font-size:1em;border:1px solid #555;border-radius:4px;background-color:#1a1a1a;color:#ffffffde}.container{max-width:1280px;margin:0 auto;padding:2rem}.card{padding:1.5em;background-color:#1a1a1a;border-radius:8px;margin-bottom:1rem;border:1px solid #333}.grid{display:grid;gap:1rem}.flex{display:flex;gap:1rem;align-items:center}.status-indicator{width:12px;height:12px;border-radius:50%;display:inline-block;margin-right:.5rem}.status-indicator.connected{background-color:#4caf50}.status-indicator.disconnected{background-color:#f44336}.status-indicator.reconnecting{background-color:#ff9800;animation:blink 1s infinite}@keyframes blink{0%,50%,to{opacity:1}25%,75%{opacity:.3}}.reconnect-message{color:#ff9800;font-size:.9em}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}button{background-color:#f9f9f9}input,select{background-color:#f9f9f9;border-color:#ddd;color:#213547}.card{background-color:#f9f9f9;border-color:#ddd}}