.overlay-config-grid{display:grid;grid-template-columns:1fr 380px;gap:24px;padding:24px;max-width:1600px;margin:0 auto}@media(max-width:1200px){.overlay-config-grid{grid-template-columns:1fr}}.settings-section{margin-bottom:24px}.settings-section h2{font-size:1.25rem;font-weight:600;margin-bottom:16px;color:var(--text, #ffffff);border-bottom:1px solid var(--border-color, rgba(255, 255, 255, .1));padding-bottom:8px}.section-desc{font-size:.875rem;color:var(--text-secondary, rgba(255, 255, 255, .6));margin-bottom:16px}.toggle-row{display:flex;align-items:center;justify-content:space-between;padding:14px 0;gap:16px}.toggle-info{display:flex;flex-direction:column;gap:4px;flex:1}.toggle-text{font-weight:500;color:var(--text, #ffffff)}.toggle-description{font-size:.8125rem;color:var(--text-secondary, rgba(255, 255, 255, .6))}.settings-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:16px}.setting-item{display:flex;flex-direction:column;gap:6px}.setting-item label{font-size:.8125rem;font-weight:500;color:var(--text-secondary, rgba(255, 255, 255, .7))}.setting-item input[type=text],.setting-item input[type=number],.setting-item input[type=color],.setting-item select{padding:8px 12px;background:var(--bg-secondary, #1a1a2e);border:1px solid var(--border-color, rgba(255, 255, 255, .1));border-radius:6px;color:var(--text, #ffffff);font-size:.875rem;transition:border-color .2s}.setting-item input[type=text]:focus,.setting-item input[type=number]:focus,.setting-item select:focus{outline:none;border-color:var(--primary-color, #7bdcff)}.setting-item input[type=color]{height:40px;padding:4px;cursor:pointer}.setting-item input[type=range]{width:100%;cursor:pointer}.checkbox-label{display:flex;align-items:center;gap:8px;cursor:pointer;padding:8px 0}.checkbox-label input[type=checkbox]{width:18px;height:18px;cursor:pointer;accent-color:var(--primary-color, #7bdcff)}.checkbox-label span{font-size:.875rem;color:var(--text, #ffffff)}.feature-header{display:flex;align-items:center;gap:12px;margin-bottom:16px;padding:12px;background:var(--bg-secondary, rgba(26, 26, 46, .5));border-radius:8px}.feature-label{font-weight:500;color:var(--text, #ffffff)}.hotkeys-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:16px}.hotkey-item{display:flex;flex-direction:column;gap:6px}.hotkey-item label{font-size:.8125rem;font-weight:500;color:var(--text-secondary, rgba(255, 255, 255, .7))}.hotkey-item select{padding:8px 12px;background:var(--bg-secondary, #1a1a2e);border:1px solid var(--border-color, rgba(255, 255, 255, .1));border-radius:6px;color:var(--text, #ffffff);font-size:.875rem;cursor:pointer}.windows-list{display:flex;flex-direction:column;gap:12px}.window-item{padding:12px;background:var(--bg-secondary, rgba(26, 26, 46, .5));border-radius:8px;border:1px solid var(--border-color, rgba(255, 255, 255, .1))}.window-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}.window-title{font-weight:600;color:var(--text, #ffffff)}.window-actions{display:flex;gap:8px}.btn-icon{width:32px;height:32px;display:flex;align-items:center;justify-content:center;background:transparent;border:1px solid var(--border-color, rgba(255, 255, 255, .1));border-radius:6px;color:var(--text-secondary, rgba(255, 255, 255, .6));cursor:pointer;transition:background-color .2s,color .2s}.btn-icon:hover{background:var(--bg-tertiary, rgba(255, 255, 255, .05));color:var(--text, #ffffff)}.window-position,.window-size{display:flex;gap:12px}.window-position label,.window-size label{flex:1;display:flex;align-items:center;gap:8px;font-size:.8125rem;color:var(--text-secondary, rgba(255, 255, 255, .7))}.window-position input,.window-size input{width:60px;padding:4px 8px;background:var(--bg-primary, #0f0f23);border:1px solid var(--border-color, rgba(255, 255, 255, .1));border-radius:4px;color:var(--text, #ffffff);font-size:.8125rem}.presets-list{display:flex;flex-direction:column;gap:12px}.preset-card{display:flex;align-items:center;gap:12px;padding:12px;background:var(--bg-secondary, rgba(26, 26, 46, .5));border-radius:8px;border:1px solid var(--border-color, rgba(255, 255, 255, .1));transition:border-color .2s,background-color .2s}.preset-card:hover{border-color:var(--primary-color, #7bdcff);background:var(--bg-tertiary, rgba(255, 255, 255, .05))}.preset-icon{width:40px;height:40px;display:flex;align-items:center;justify-content:center;background:var(--bg-primary, #0f0f23);border-radius:8px;color:var(--primary-color, #7bdcff)}.preset-info{flex:1}.preset-info h3{font-size:.9375rem;font-weight:600;color:var(--text, #ffffff);margin:0 0 4px}.preset-info p{font-size:.75rem;color:var(--text-secondary, rgba(255, 255, 255, .6));margin:0}.badge{display:inline-block;padding:2px 8px;font-size:.6875rem;font-weight:600;border-radius:4px;margin-top:4px}.badge.custom{background:var(--accent-color, #e94560);color:#fff}.preset-card .btn{padding:6px 12px;font-size:.8125rem}.history-list{display:flex;flex-direction:column;gap:8px;max-height:300px;overflow-y:auto}.history-item{display:flex;align-items:center;justify-content:space-between;padding:10px 12px;background:var(--bg-secondary, rgba(26, 26, 46, .5));border-radius:6px;border:1px solid var(--border-color, rgba(255, 255, 255, .1))}.history-info{display:flex;flex-direction:column;gap:2px}.history-version{font-weight:600;color:var(--primary-color, #7bdcff);font-size:.8125rem}.history-type{font-size:.75rem;color:var(--text-secondary, rgba(255, 255, 255, .6));text-transform:capitalize}.history-date{font-size:.6875rem;color:var(--text-secondary, rgba(255, 255, 255, .5))}.history-desc{font-size:.75rem;color:var(--text, #ffffff)}.history-item .btn{padding:4px 10px;font-size:.75rem}.empty-state{text-align:center;padding:24px;color:var(--text-secondary, rgba(255, 255, 255, .5));font-size:.875rem}.actions-grid{display:flex;flex-direction:column;gap:10px}.actions-grid .btn{width:100%;display:flex;align-items:center;justify-content:center;gap:8px;padding:10px 16px;font-size:.875rem;font-weight:500;border-radius:6px;cursor:pointer;transition:background-color .2s;border:none}.btn-primary{background:var(--primary-color, #7bdcff);color:var(--bg-primary, #0f0f23)}.btn-primary:hover{background:var(--primary-hover, #5cc8f5)}.btn-secondary{background:var(--bg-secondary, #1a1a2e);color:var(--text, #ffffff);border:1px solid var(--border-color, rgba(255, 255, 255, .1))}.btn-secondary:hover{background:var(--bg-tertiary, rgba(255, 255, 255, .05));border-color:var(--primary-color, #7bdcff)}.btn-danger{background:var(--danger-color, #e94560);color:#fff}.btn-danger:hover{background:var(--danger-hover, #d63851)}.preview-container{padding:16px;background:var(--bg-secondary, rgba(26, 26, 46, .3));border-radius:8px;min-height:200px}.preview-window{background:#0f0f23e6;border:1px solid var(--primary-color, #7bdcff);border-radius:6px;overflow:hidden}.preview-title{padding:8px 12px;background:var(--primary-color, #7bdcff);color:var(--bg-primary, #0f0f23);font-weight:600;font-size:.8125rem}.preview-content{padding:8px}.preview-player{display:flex;justify-content:space-between;padding:6px 8px;font-size:.75rem;border-bottom:1px solid var(--border-color, rgba(255, 255, 255, .05))}.preview-player:last-child{border-bottom:none}.preview-name{color:var(--text, #ffffff)}.preview-health{color:var(--status-success)}.preview-distance{color:var(--text-secondary, rgba(255, 255, 255, .6))}.loading-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#000000b3;display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:1000;gap:16px}.loading-spinner{width:40px;height:40px;border:3px solid var(--border-color, rgba(255, 255, 255, .1));border-top-color:var(--primary-color, #7bdcff);border-radius:50%;animation:spin 1s linear infinite}.loading-overlay p{color:var(--text, #ffffff);font-size:.9375rem}.toast-container{position:fixed;top:80px;right:24px;z-index:1001;display:flex;flex-direction:column;gap:8px}.toast{padding:12px 20px;background:var(--bg-secondary, #1a1a2e);border:1px solid var(--border-color, rgba(255, 255, 255, .1));border-radius:8px;color:var(--text, #ffffff);font-size:.875rem;box-shadow:0 4px 12px #0000004d;animation:toast-in .3s ease-out}.toast-success{border-left:4px solid var(--status-success)}.toast-error{border-left:4px solid var(--status-danger)}.toast-exit{animation:toast-out .3s ease-in forwards}@keyframes toast-in{0%{opacity:0;transform:translate(100%)}to{opacity:1;transform:translate(0)}}@keyframes toast-out{0%{opacity:1;transform:translate(0)}to{opacity:0;transform:translate(100%)}}.page-header{display:flex;align-items:center;justify-content:space-between;padding:24px;margin-bottom:24px}.header-meta{display:flex;gap:12px}@media(max-width:768px){.overlay-config-grid{padding:16px;gap:16px}.settings-grid,.hotkeys-grid{grid-template-columns:1fr}.page-header{flex-direction:column;align-items:flex-start;gap:16px}}@media(prefers-reduced-motion:reduce){.loading-spinner,.toast,.toast-exit{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}
