:root{--bg-primary:#0f0f13;--bg-secondary:#1a1a24;--bg-panel:#1e1e2ab3;--text-primary:#f8f8f8;--text-secondary:#a0a0b0;--accent-cyan:#00f2fe;--accent-purple:#9d4edd;--accent-pink:#ff0a54;--glass-border:#ffffff1a;--glass-shadow:0 8px 32px 0 #0000005e;--font-primary:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;--font-hanzi:"Noto Sans SC", "Microsoft YaHei", sans-serif}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-primary);background-color:var(--bg-primary);color:var(--text-primary);min-height:100vh;overflow-x:hidden}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:var(--bg-primary);border-left:1px solid #ffffff05}::-webkit-scrollbar-thumb{border:2px solid var(--bg-primary);background:#ffffff26;border-radius:6px}::-webkit-scrollbar-thumb:hover{background:var(--accent-purple)}.glass-panel{background:var(--bg-panel);-webkit-backdrop-filter:blur(12px);border:1px solid var(--glass-border);box-shadow:var(--glass-shadow)}.app-container{width:100vw;height:100vh;display:flex}.sidebar{border-right:1px solid var(--glass-border);background:var(--bg-secondary);flex-direction:column;align-items:center;width:80px;padding:24px 0;display:flex}.nav-icon{width:48px;height:48px;color:var(--text-secondary);cursor:pointer;border-radius:12px;justify-content:center;align-items:center;margin-bottom:16px;transition:all .2s;display:flex}.nav-icon:hover,.nav-icon.active{color:var(--accent-purple);background:#9d4edd26}.main-content{background:radial-gradient(circle at 50% 0,#1a1a24 0%,#0f0f13 100%);flex-direction:column;flex:1;min-width:0;display:flex;position:relative;overflow:hidden auto}.top-bar{flex-shrink:0;justify-content:space-between;align-items:center;height:70px;min-height:70px;padding:0 32px;display:flex}.top-bar h1{background:linear-gradient(90deg, var(--accent-cyan) 0%, var(--accent-purple) 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;font-size:1.5rem;font-weight:700}.horizontal-scroll{scroll-behavior:smooth;-webkit-overflow-scrolling:touch;flex-wrap:nowrap;gap:20px;width:100%;padding-bottom:20px;display:flex;overflow:auto hidden}.horizontal-scroll::-webkit-scrollbar{height:8px}.horizontal-scroll::-webkit-scrollbar-track{background:#ffffff0d;border-radius:4px}.horizontal-scroll::-webkit-scrollbar-thumb{background:var(--accent-purple);border-radius:4px}.horizontal-scroll::-webkit-scrollbar-thumb:hover{background:var(--accent-cyan)}.carousel-btn{background:var(--bg-panel);border:1px solid var(--glass-border);color:var(--text-primary);cursor:pointer;border-radius:50%;justify-content:center;align-items:center;width:40px;height:40px;transition:all .2s;display:flex}.carousel-btn:hover{background:var(--accent-purple);border-color:var(--accent-purple);transform:scale(1.1)}.video-container-wrapper{flex:1;justify-content:center;align-items:center;padding:20px;display:flex}.video-player-box{aspect-ratio:16/9;background:#000;border-radius:20px;width:100%;max-width:1000px;position:relative;overflow:hidden;box-shadow:0 20px 40px #00000080}video{object-fit:cover;width:100%;height:100%}.subtitle-overlay{pointer-events:none;z-index:10;justify-content:center;display:flex;position:absolute;bottom:20px;left:0;right:0}:fullscreen .subtitle-overlay{bottom:40px}:fullscreen .plain-subtitle{font-size:2.2rem!important}:fullscreen .pinyin{margin-bottom:6px!important;font-size:1.4rem!important}:fullscreen .hanzi{font-size:3rem!important}:fullscreen .translation-line{font-size:1.6rem!important}.subtitle-container{pointer-events:none;flex-direction:column;gap:12px;width:100%;display:flex}.hanzi-word{cursor:pointer;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);pointer-events:auto;background:#0006;border-radius:12px;flex-direction:column;align-items:center;padding:8px 12px;transition:transform .2s;display:flex}.hanzi-word:hover{border:1px solid var(--accent-purple);background:#9d4edd66;transform:scale(1.1)}.pinyin{color:var(--accent-cyan);margin-bottom:4px;font-size:1rem}.hanzi{font-family:var(--font-hanzi);color:#fff;text-shadow:2px 2px 4px #000c;font-size:2.5rem;font-weight:600}.translation-line{color:#fff;text-shadow:2px 2px 6px #000,-1px -1px #000,1px -1px #000,-1px 1px #000,1px 1px #000;white-space:normal;text-align:center;font-size:2rem;font-weight:600}.drama-card{cursor:pointer;border-radius:16px;flex:0 0 200px;min-width:200px;max-width:200px;transition:transform .3s cubic-bezier(.25,.46,.45,.94),box-shadow .3s;overflow:hidden}.drama-card:hover{border-color:var(--accent-cyan);transform:translateY(-8px)scale(1.02);box-shadow:0 15px 30px #00f2fe33}.drama-image-wrapper{width:100%;height:280px;overflow:hidden}.drama-image-wrapper img{object-fit:cover;width:100%;height:100%;transition:transform .5s}.drama-card:hover .drama-image-wrapper img{transform:scale(1.1)}.drama-info{padding:16px}.drama-title{white-space:nowrap;text-overflow:ellipsis;margin:0 0 8px;font-size:1.1rem;overflow:hidden}.drama-meta{color:var(--text-secondary);margin-bottom:12px;font-size:.9rem}.progress-bg{background:#ffffff1a;border-radius:2px;width:100%;height:4px;overflow:hidden}.progress-fill{background:var(--accent-cyan);height:100%;box-shadow:0 0 8px var(--accent-cyan)}.horizontal-scroll{scrollbar-width:none;gap:24px;margin-left:-20px;margin-right:-20px;padding:20px 20px 32px;display:flex;overflow-x:auto}.horizontal-scroll::-webkit-scrollbar{display:none}video::-webkit-media-controls-fullscreen-button{display:none}.word-tooltip{background:var(--bg-secondary);border:1px solid var(--accent-cyan);z-index:100;border-radius:12px;min-width:200px;margin-top:-20px;padding:16px;position:fixed;transform:translate(-50%,-100%);box-shadow:0 10px 30px #000c}.tooltip-header{justify-content:space-between;align-items:center;margin-bottom:12px;display:flex}.tooltip-hanzi{font-family:var(--font-hanzi);color:#fff;font-size:2rem}.tooltip-pinyin{color:var(--accent-cyan);font-size:1.1rem}.tooltip-translation{color:var(--text-secondary);margin-bottom:16px;font-size:1rem}.btn-save{background:linear-gradient(90deg, var(--accent-purple) 0%, var(--accent-pink) 100%);color:#fff;cursor:pointer;border:none;border-radius:8px;width:100%;padding:8px 16px;font-weight:600;transition:opacity .2s}.btn-save:hover{opacity:.9}.vocab-sidebar{border-left:1px solid var(--glass-border);flex-direction:column;flex-shrink:0;width:320px;display:flex}.vocab-header{border-bottom:1px solid var(--glass-border);padding:24px}.vocab-header h2{color:#fff;align-items:center;gap:8px;font-size:1.2rem;display:flex}.vocab-list{flex-direction:column;flex:1;gap:12px;padding:16px;display:flex;overflow-y:auto}.vocab-card{background:#ffffff08;border:1px solid #ffffff0d;border-radius:12px;flex-direction:row;justify-content:space-between;align-items:flex-start;gap:8px;padding:16px;transition:all .2s;display:flex}.vocab-card:hover{border-color:var(--accent-purple);background:#ffffff0d}.vocab-card .top-row{justify-content:space-between;align-items:center;display:flex}.vocab-card .v-hanzi{font-family:var(--font-hanzi);color:#fff;font-size:1.8rem}.vocab-card .v-pinyin{color:var(--accent-cyan)}.vocab-card .v-trans{color:var(--text-secondary);font-size:.9rem}:fullscreen .subtitle-overlay .pinyin{margin-bottom:6px!important;font-size:1.5rem!important}:fullscreen .subtitle-overlay .hanzi{font-size:3rem!important}:fullscreen .subtitle-overlay .translation-line{margin-top:24px!important;font-size:2.5rem!important}:fullscreen .subtitle-overlay .word-block{gap:8px!important;padding:4px 8px!important}:fullscreen .subtitle-overlay .plain-subtitle{font-size:2.2rem!important;line-height:1.4!important}:-webkit-full-screen .subtitle-overlay .pinyin{margin-bottom:6px!important;font-size:1.5rem!important}:-webkit-full-screen .subtitle-overlay .hanzi{font-size:3rem!important}:-webkit-full-screen .subtitle-overlay .translation-line{margin-top:24px!important;font-size:2.5rem!important}:-webkit-full-screen .subtitle-overlay .word-block{gap:8px!important;padding:4px 8px!important}:-webkit-full-screen .subtitle-overlay .plain-subtitle{font-size:2.2rem!important;line-height:1.4!important}.word-block,.plain-subtitle{pointer-events:auto}@keyframes slideUp{0%{opacity:0;transform:translate(-50%,20px)}to{opacity:1;transform:translate(-50%)}}@media (width<=950px){.app-container{flex-direction:column}.sidebar{border-right:none;border-bottom:1px solid var(--glass-border);flex-direction:row;width:100%;height:70px;padding:0 16px}.sidebar .nav-icon{margin-bottom:0;margin-top:0!important}.vocab-sidebar{border-left:none;border-top:1px solid var(--glass-border);width:100%;height:350px}}