:root{--bg: #f9f9f9;--text: #333;--text-secondary: #666;--heading: #222;--input-bg: #fff;--input-border: #ccc;--card-shadow: rgba(0, 0, 0, .1);--card-hover: rgba(0, 123, 255, .06);--card-active: rgba(0, 123, 255, .1);--progress-bg: #ddd;--accent: #007bff;--accent-hover: #0056b3}[data-theme=dark]{--bg: #1a1a2e;--text: #e0e0e0;--text-secondary: #999;--heading: #f0f0f0;--input-bg: #16213e;--input-border: #444;--card-shadow: rgba(0, 0, 0, .3);--card-hover: rgba(0, 123, 255, .12);--card-active: rgba(0, 123, 255, .2);--progress-bg: #333;--accent: #4d9fff;--accent-hover: #3a7fdb}body{font-family:Libre Franklin,sans-serif;background-color:var(--bg);color:var(--text);transition:background-color .3s,color .3s}h1{font-family:Inter,sans-serif;color:var(--heading);font-size:2.8rem}.songTitle{font-size:2.2rem;font-weight:700;line-height:1.3;word-spacing:.4rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}.trackPosition{font-size:1rem;font-weight:400;color:var(--text-secondary);margin-left:.8rem}.cardTitle{font-size:1.4rem;font-weight:500;line-height:1.2;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.cardArtist{font-style:italic;font-size:1.2rem;font-weight:300;line-height:.1;padding-bottom:.5rem}.searchText{font-size:1.5rem;font-weight:300;line-height:1.1}.usedPlaylistName{font-size:1.2rem;font-weight:500;word-spacing:.3rem;line-height:1;font-style:medium}.navbar{display:flex;align-items:center;justify-content:space-between;padding:.6rem 1.2rem;border-bottom:1px solid var(--input-border);margin-bottom:1rem}.navBrand{display:flex;align-items:center;gap:.4rem;font-size:1.4rem;font-weight:600;cursor:pointer;color:var(--heading)}.navIcon{font-size:1.8rem;color:red}.navHomeBtn{font-size:.95rem;padding:.3rem .8rem;border-radius:4px;border:1px solid var(--input-border);background:var(--input-bg);color:var(--text);cursor:pointer;transition:background-color .2s}.navHomeBtn:hover{background:var(--card-hover)}.home{max-width:700px;margin:0 auto;padding:1rem}.sectionHeading{font-size:1.1rem;font-weight:500;color:var(--text-secondary);margin:1.5rem 0 .5rem}.playlistUsedSection{margin-top:.5rem}.usedContent{display:flex;align-items:center;gap:.8rem;cursor:pointer}.usedContent img{border-radius:4px;max-width:80px}.notFound{text-align:center;padding:4rem 1rem}.notFound h1{font-size:5rem;margin:0;color:var(--accent)}.notFoundText{font-size:1.3rem;color:var(--text-secondary);margin:.5rem 0 1.5rem}.themeToggle{position:fixed;top:1rem;right:1rem;font-size:1.6rem;background:var(--input-bg);border:1px solid var(--input-border);color:var(--text);border-radius:50%;width:2.5rem;height:2.5rem;display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:100;transition:background-color .3s,border-color .3s}.themeToggle:hover{background:var(--card-hover)}.inputSearch{font-size:1.4rem;padding:.5rem 1rem;margin:2rem 1rem;border-radius:8px;border:1px solid var(--input-border);background-color:var(--input-bg);color:var(--text);box-shadow:0 2px 4px var(--card-shadow)}.submitBtn{cursor:pointer;font-size:1.5rem;padding:.2rem .5rem;border-radius:4px;background-color:var(--accent);color:#fff;transition:background-color .3s ease}.submitBtn:hover{background-color:var(--accent-hover)}.cardContainer{max-height:400px;overflow-y:auto;margin:1rem;box-shadow:0 4px 8px var(--card-shadow)}.mediaButtons{font-size:5rem;cursor:pointer}.player{position:relative;width:100%;max-width:690px}iframe{width:100%;aspect-ratio:16 / 9;height:auto}.player:-webkit-full-screen{background:#000;display:flex;align-items:center;justify-content:center}.player:fullscreen{background:#000;display:flex;align-items:center;justify-content:center}.player:-webkit-full-screen iframe{width:100vw;height:100vh}.player:fullscreen iframe{width:100vw;height:100vh}.ulListCards{list-style:none;padding:0;margin:0}.cardContent{display:flex;align-items:center;gap:.8rem;padding:.5rem .8rem;cursor:pointer;transition:background-color .15s ease;border-left:3px solid transparent}.cardContent:hover{background-color:var(--card-hover)}.cardContent.playing{background-color:var(--card-active);border-left-color:var(--accent)}.cardContent img{border-radius:4px}.cardText{font-size:1.3rem;cursor:pointer;flex:1}.cardInsightBtn{width:1.4rem;height:1.4rem;border-radius:50%;border:1px solid var(--input-border);background:var(--input-bg);color:var(--text-secondary);font-size:.7rem;font-weight:600;font-style:italic;cursor:pointer;flex-shrink:0;transition:background-color .2s}.cardInsightBtn:hover{background:var(--card-hover);color:var(--accent)}.cardInsightExpanded{padding:.5rem .8rem .5rem 4rem;border-left:3px solid var(--accent);background:var(--card-hover)}.playlistUsed{display:flex;align-items:center;gap:1rem}.playlistUsedButton{height:30px;width:30px;border-radius:50%;background-color:var(--accent);color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background-color .3s ease,transform .2s ease}.playlistUsedButton:hover{background-color:var(--accent-hover);transform:scale(1.1)}.mainContent{display:flex;gap:1rem;padding:0 1rem}.spinner{display:inline-block;width:1em;height:1em;border:2px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:spin .6s linear infinite;vertical-align:middle}@keyframes spin{to{transform:rotate(360deg)}}.submitBtn:disabled{opacity:.7;cursor:not-allowed}.errorMsg{color:#d32f2f;font-size:1.1rem;margin:.5rem 1rem;font-weight:400}.progressContainer{display:flex;align-items:center;gap:.6rem;padding:.4rem 1rem;margin-top:.3rem}.progressBar{flex:1;height:6px;background:var(--progress-bg);border-radius:3px;cursor:pointer;position:relative}.progressFill{height:100%;background:var(--accent);border-radius:3px;transition:width .3s linear}.progressTime{font-size:.85rem;color:var(--text-secondary);min-width:3rem;text-align:center;font-variant-numeric:tabular-nums}.shortcutsOverlay{position:fixed;inset:0;background:rgba(0,0,0,.5);display:flex;align-items:center;justify-content:center;z-index:9999}.shortcutsPanel{background:var(--bg);color:var(--text);border-radius:10px;padding:1.5rem 2rem;min-width:280px;box-shadow:0 8px 24px #0000004d}.shortcutsPanel h3{margin:0 0 1rem;font-size:1.3rem;color:var(--heading)}.shortcutsList{list-style:none;padding:0;margin:0}.shortcutsList li{display:flex;justify-content:space-between;padding:.3rem 0;font-size:.95rem}.shortcutsList kbd{background:var(--progress-bg);padding:.15rem .5rem;border-radius:4px;font-family:monospace;font-size:.85rem;min-width:2rem;text-align:center}.shortcutsList span{color:var(--text-secondary)}@media (max-width: 768px){.mainContent{flex-direction:column;padding:0 .5rem}.player{max-width:100%}.cardContainer{max-height:250px;margin:.5rem 0}.mediaButtons{font-size:3rem;justify-content:center;display:flex;gap:.3rem}.songTitle{font-size:1.4rem;padding:0 .5rem}h1{font-size:1.8rem}.inputSearch{width:100%;box-sizing:border-box;margin:1rem 0}.playlistUsed{flex-wrap:wrap}}@keyframes hintFadeIn{0%{opacity:0;transform:translate(-50%) translateY(-8px)}to{opacity:1;transform:translate(-50%) translateY(0)}}.insightsPanel{margin:1rem;border:1px solid var(--input-border);border-radius:8px;overflow:hidden}.insightsTitle{font-weight:600;font-size:.95rem;padding:.6rem 1rem;color:var(--heading)}.insightsTabs{display:flex;align-items:center;border-bottom:1px solid var(--input-border);background:var(--input-bg)}.insightTab{padding:.6rem 1rem;border:none;background:none;color:var(--text-secondary);cursor:pointer;font-size:.95rem;transition:color .2s,border-bottom .2s;border-bottom:2px solid transparent}.insightTab.active{color:var(--accent);border-bottom-color:var(--accent);font-weight:500}.insightsContent{padding:1rem}.insightSection{margin-bottom:1rem}.insightBtn{padding:.4rem 1rem;border-radius:4px;border:none;background:var(--accent);color:#fff;cursor:pointer;font-size:.95rem;transition:background-color .2s}.insightBtn:hover{background:var(--accent-hover)}.insightBtnSmall{padding:.2rem .6rem;border-radius:3px;border:1px solid var(--input-border);background:var(--input-bg);color:var(--text);cursor:pointer;font-size:.8rem}.insightLoading{color:var(--text-secondary);font-style:italic;display:flex;align-items:center;gap:.5rem;padding:1rem 0}.overviewText{font-size:1rem;line-height:1.6;margin-bottom:.8rem}.overviewContent h4{margin:.8rem 0 .3rem;color:var(--heading);font-size:1rem}.insightList{margin:.3rem 0;padding-left:1.2rem}.insightList li{margin-bottom:.3rem;line-height:1.4}.watchOrderList{margin:.3rem 0;padding-left:1.2rem}.watchOrderList li{margin-bottom:.5rem;line-height:1.4}.watchTitle{font-weight:500;display:block}.watchReason{color:var(--text-secondary);font-size:.85rem;display:block}.topicTags{display:flex;flex-wrap:wrap;gap:.4rem;margin:.5rem 0}.topicTag{background:var(--card-hover);color:var(--accent);padding:.15rem .5rem;border-radius:12px;font-size:.8rem}.videoSummary{margin:.3rem 0;line-height:1.5;font-size:.9rem}.videosInsightList{display:flex;flex-direction:column;gap:.6rem}.videoInsightCard{padding:.6rem .8rem;border:1px solid var(--input-border);border-radius:6px;background:var(--input-bg)}.videoInsightHeader{display:flex;align-items:center;gap:.5rem;margin-bottom:.3rem}.videoInsightTitle{font-weight:500;font-size:.95rem;flex:1;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}.difficultyBadge{font-size:.7rem;padding:.1rem .4rem;border-radius:8px;font-weight:500;text-transform:uppercase;flex-shrink:0}.difficultyBadge.beginner{background:rgba(46,125,50,.1);color:#2e7d32}.difficultyBadge.intermediate{background:rgba(245,166,35,.15);color:#e68900}.difficultyBadge.advanced{background:rgba(198,40,40,.1);color:#c62828}.prereqText{font-size:.8rem;color:var(--text-secondary);margin:.3rem 0 0;font-style:italic}.searchInsightForm{display:flex;gap:.5rem;margin-bottom:.8rem}.insightSearchInput{flex:1;padding:.4rem .8rem;border-radius:4px;border:1px solid var(--input-border);background:var(--input-bg);color:var(--text);font-size:.95rem}.noResults{color:var(--text-secondary);font-style:italic}.searchResults{list-style:none;padding:0;margin:0}.searchResult{display:flex;gap:.8rem;padding:.6rem 0;border-bottom:1px solid var(--input-border)}.resultScore{min-width:2.5rem;text-align:center;font-weight:600;color:var(--accent);font-size:.9rem}.resultSnippet{margin:0 0 .2rem;line-height:1.4;font-size:.9rem}.resultVideoId{font-size:.75rem;color:var(--text-secondary)}
