.screenshot-manager{width:100%;height:100vh;display:flex;flex-direction:row;background:linear-gradient(135deg,#0f0f0f,#1a1a1a);color:#fff;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif}.sidebar{display:flex;flex-direction:column;background:#1a1a1a;border-right:1px solid #2a2a2a;width:280px;flex-shrink:0}.sidebar-header{display:flex;align-items:center;justify-content:space-between;padding:20px 16px;background:#242424;border-bottom:1px solid #2a2a2a}.sidebar-header h2{font-size:20px;font-weight:700;margin:0;color:#e0e0e0}.add-tab-btn{background:transparent;border:1px solid #333;color:#666;width:28px;height:28px;border-radius:6px;cursor:pointer;font-size:14px;display:flex;align-items:center;justify-content:center;transition:all .2s ease}.add-tab-btn:hover{background:#2a2a2a;border-color:#4a9eff;color:#4a9eff}.tabs-container{display:flex;flex-direction:column;gap:8px;padding:16px;overflow-y:auto;flex:1}.tabs{display:flex;flex-direction:column;gap:8px;padding:16px;background:linear-gradient(180deg,#1e1e1e,#181818);border-right:1px solid #333;box-shadow:4px 0 12px #0000004d;overflow-y:auto;width:280px;flex-shrink:0}.tab{display:flex;align-items:center;gap:8px;padding:12px 16px;background:#242424;border-radius:8px;cursor:pointer;transition:all .2s ease;border:1px solid transparent;width:100%}.tab:hover{background:#2a2a2a;border-color:#333}.tab.active{background:#2d2d2d;border-color:#4a9eff}.tab-button{background:none;border:none;color:inherit;font:inherit;cursor:pointer;padding:0;text-align:left;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tab-name{font-weight:500;user-select:none;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tab-edit{display:flex;gap:4px;align-items:center;width:100%}.tab-edit input{background-color:#333;border:1px solid #4a9eff;color:#fff;padding:4px 8px;border-radius:4px;font-size:14px;flex:1;min-width:0}.tab-edit input:focus{outline:none;border-color:#6bb3ff}.save-btn,.cancel-btn{padding:4px 8px;border:none;border-radius:4px;cursor:pointer;font-size:12px;transition:background-color .2s}.save-btn{background-color:#4caf50;color:#fff}.save-btn:hover{background-color:#45a049}.cancel-btn{background-color:#f44336;color:#fff}.cancel-btn:hover{background-color:#da190b}.delete-tab-btn{background:none;border:none;color:#999;cursor:pointer;font-size:18px;padding:0;width:20px;height:20px;display:flex;align-items:center;justify-content:center;border-radius:4px;transition:all .2s}.delete-tab-btn:hover{background-color:#f44336;color:#fff}.add-tab-btn{padding:12px 16px;background-color:#4a9eff;color:#fff;border:none;border-radius:8px;cursor:pointer;font-weight:500;transition:background-color .2s;text-align:center}.add-tab-btn:hover{background-color:#3a8eef}.main-content{flex:1;display:flex;flex-direction:column;overflow:hidden}.header-actions{display:flex;gap:12px;padding:20px 24px;background:#1e1e1e;border-bottom:1px solid #2a2a2a;flex-wrap:wrap;flex-shrink:0}.action-btn{padding:11px 22px;border:none;border-radius:8px;cursor:pointer;font-weight:600;font-size:14px;transition:all .2s ease;display:flex;align-items:center;gap:8px;white-space:nowrap;position:relative;overflow:hidden}.action-btn:before{content:"";position:absolute;top:50%;left:50%;width:0;height:0;border-radius:50%;background:#fff3;transform:translate(-50%,-50%);transition:width .6s,height .6s}.action-btn:hover:before{width:300px;height:300px}.action-btn:disabled{opacity:.4;cursor:not-allowed;transform:none!important}.download-btn{background:linear-gradient(135deg,#2196f3,#1976d2);color:#fff}.download-btn:hover:not(:disabled){background:linear-gradient(135deg,#1976d2,#1565c0);transform:translateY(-2px)}.pdf-btn{background:linear-gradient(135deg,#e91e63,#c2185b);color:#fff}.pdf-btn:hover:not(:disabled){background:linear-gradient(135deg,#c2185b,#ad1457);transform:translateY(-2px)}.export-btn{background:linear-gradient(135deg,#4caf50,#388e3c);color:#fff}.export-btn:hover:not(:disabled){background:linear-gradient(135deg,#388e3c,#2e7d32);transform:translateY(-2px)}.import-btn{background:linear-gradient(135deg,#ff9800,#f57c00);color:#fff}.import-btn:hover:not(:disabled){background:linear-gradient(135deg,#f57c00,#e65100);transform:translateY(-2px)}.autoscroll-inline{display:flex;align-items:center;gap:10px;margin-left:auto;border-left:1px solid #444;padding-left:16px}.autoscroll-btn{background:linear-gradient(135deg,#9c27b0,#7b1fa2);color:#fff}.autoscroll-btn:hover:not(:disabled){background:linear-gradient(135deg,#7b1fa2,#6a1b9a);transform:translateY(-2px)}.autoscroll-btn.active{background:linear-gradient(135deg,#ff5722,#e64a19);animation:pulse 2s infinite}.autoscroll-btn.active:hover:not(:disabled){background:linear-gradient(135deg,#e64a19,#d84315)}.speed-control-inline{display:flex;align-items:center;gap:8px}.speed-control-inline label{font-size:13px;color:#aaa;white-space:nowrap}.speed-control-inline .speed-value{font-weight:600;color:#4a9eff;min-width:40px;text-align:right}.speed-control-inline input[type=range]{width:100px;height:6px;background:#444;outline:none;border-radius:3px;cursor:pointer}.speed-control-inline input[type=range]:disabled{opacity:.4;cursor:not-allowed}.speed-control-inline input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:16px;height:16px;background:#4a9eff;cursor:pointer;border-radius:50%;transition:all .2s}.speed-control-inline input[type=range]::-webkit-slider-thumb:hover{background:#2d8ceb;transform:scale(1.1)}.speed-control-inline input[type=range]::-moz-range-thumb{width:16px;height:16px;background:#4a9eff;cursor:pointer;border:none;border-radius:50%;transition:all .2s}.speed-control-inline input[type=range]::-moz-range-thumb:hover{background:#2d8ceb;transform:scale(1.1)}.autoscroll-control{display:flex;align-items:center;gap:16px;padding:12px 16px;background-color:#4a9eff1a;border:1px solid #4a9eff;border-radius:8px;margin-bottom:16px;flex-wrap:wrap}.autoscroll-toggle{padding:10px 20px;border:2px solid #4a9eff;background-color:transparent;color:#4a9eff;border-radius:6px;cursor:pointer;font-weight:600;font-size:14px;transition:all .2s;display:flex;align-items:center;gap:8px}.autoscroll-toggle:hover{background-color:#4a9eff;color:#fff;transform:translateY(-1px)}.autoscroll-toggle.active{background-color:#4a9eff;color:#fff;animation:pulse 2s infinite}@keyframes pulse{0%,to{box-shadow:0 0 #4a9effb3}50%{box-shadow:0 0 0 8px #4a9eff00}}.speed-control{display:flex;align-items:center;gap:12px;flex:1;min-width:200px}.speed-control label{font-size:14px;font-weight:500;color:#e0e0e0}.speed-control input[type=range]{flex:1;height:6px;background:#333;border-radius:3px;outline:none;-webkit-appearance:none}.speed-control input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:18px;height:18px;background:#4a9eff;cursor:pointer;border-radius:50%;transition:all .2s}.speed-control input[type=range]::-webkit-slider-thumb:hover{background:#6bb3ff;transform:scale(1.2)}.speed-control input[type=range]:disabled{opacity:.5;cursor:not-allowed}.speed-control input[type=range]:disabled::-webkit-slider-thumb{cursor:not-allowed}.speed-value{font-weight:600;color:#4a9eff;min-width:40px;text-align:right}.autoscroll-hint{width:100%;font-size:12px;color:#aaa;text-align:center;padding-top:8px;border-top:1px solid rgba(74,158,255,.3)}.autoscroll-hint kbd{background-color:#333;border:1px solid #666;border-radius:4px;padding:2px 8px;font-family:monospace;font-size:11px;box-shadow:0 2px #222;color:#fff}.content{flex:1;overflow-y:auto;padding:24px}.song-info-section{background-color:#242424;border-radius:8px;margin-bottom:24px;border:1px solid #333;overflow:hidden}.toggle-details-btn{width:100%;padding:16px;background-color:transparent;color:#fff;border:none;text-align:left;font-size:16px;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:10px;transition:background-color .2s}.toggle-details-btn:hover{background-color:#2a2a2a}.song-details{padding:20px;border-top:1px solid #333;animation:slideDown .3s ease-out}@keyframes slideDown{0%{opacity:0;max-height:0}to{opacity:1;max-height:500px}}.detail-row{display:flex;flex-direction:column;gap:8px;margin-bottom:16px}.detail-row label{font-size:13px;font-weight:600;color:#bbb;text-transform:uppercase;letter-spacing:.5px}.detail-row input,.detail-row textarea{background-color:#1a1a1a;border:2px solid #333;color:#fff;padding:12px;border-radius:6px;font-size:14px;font-family:inherit;transition:border-color .2s}.detail-row input:focus,.detail-row textarea:focus{outline:none;border-color:#4a9eff}.detail-row textarea{resize:vertical;min-height:60px}.source-link{color:#4a9eff;text-decoration:none;font-size:13px;background-color:#4a9eff1a;border-radius:4px;display:inline-block;transition:all .2s;border:1px solid rgba(74,158,255,.3);position:relative;padding:8px 12px 8px 28px}.source-link:before{content:"↗";position:absolute;left:10px;font-size:14px;font-weight:700}.source-link:hover{background-color:#4a9eff33;border-color:#4a9eff;transform:translate(2px)}.instructions{background-color:#242424;padding:16px;border-radius:8px;margin-bottom:24px;border-left:4px solid #4a9eff}.instructions p{margin:8px 0;font-size:14px;color:#e0e0e0}.instructions kbd{background-color:#333;border:1px solid #666;border-radius:4px;padding:2px 8px;font-family:monospace;font-size:12px;box-shadow:0 2px #222;color:#fff}.empty-state{text-align:center;padding:80px 20px;color:#9e9e9e}.empty-state p{margin:12px 0;font-size:18px}.screenshots{display:flex;flex-direction:column;gap:24px}.screenshot-item{position:relative;background:#242424;border-radius:12px;overflow:hidden;border:1px solid #333;transition:all .2s ease}.screenshot-item:hover{border-color:#4a9eff;transform:translateY(-2px)}.screenshot-item:hover .delete-screenshot-btn{opacity:1}.screenshot-item img{width:100%;height:auto;display:block}.delete-screenshot-btn{position:absolute;top:12px;right:12px;background:#f44336e6;color:#fff;border:1px solid rgba(255,255,255,.2);width:36px;height:36px;border-radius:50%;cursor:pointer;font-size:18px;font-weight:700;display:flex;align-items:center;justify-content:center;opacity:0;transition:all .2s ease}.delete-screenshot-btn:hover{background:#d32f2f;transform:scale(1.1)}.content::-webkit-scrollbar{width:10px}.content::-webkit-scrollbar-track{background:#1a1a1a}.content::-webkit-scrollbar-thumb{background:#444;border-radius:5px}.content::-webkit-scrollbar-thumb:hover{background:#555}.tabs::-webkit-scrollbar{width:8px}.tabs::-webkit-scrollbar-track{background:#242424}.tabs::-webkit-scrollbar-thumb{background:#444;border-radius:4px}