*{box-sizing:border-box}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,Hiragino Sans GB,Microsoft YaHei,sans-serif;color:#1f2329;background:#f5f6f8}a{color:#3b82f6;text-decoration:none}.layout{min-height:100vh}.topbar{display:flex;align-items:center;gap:24px;padding:0 24px;height:56px;background:#fff;border-bottom:1px solid #e5e7eb;position:sticky;top:0;z-index:10}.brand{font-weight:700;font-size:16px}.nav{display:flex;gap:4px;flex:1}.nav-link{padding:8px 14px;border-radius:8px;color:#4b5563;font-size:14px}.nav-link.active{background:#eff6ff;color:#2563eb;font-weight:600}.user{display:flex;align-items:center;gap:12px}.user-email{font-size:13px;color:#6b7280}.series-picker{position:relative}.series-dropdown{position:absolute;top:calc(100% + 6px);right:0;min-width:180px;max-height:320px;overflow-y:auto;background:#fff;border:1px solid #e5e7eb;border-radius:10px;box-shadow:0 8px 24px #0000001a;padding:8px;z-index:20}.series-dropdown-title{font-size:12px;color:#9ca3af;padding:4px 8px 8px}.series-option{display:flex;align-items:center;gap:8px;padding:6px 8px;border-radius:6px;cursor:pointer;font-size:14px;color:#374151}.series-option:hover{background:#f3f4f6}.series-option input{cursor:pointer}.content{max-width:1280px;margin:0 auto;padding:24px 16px 64px}.page-title{font-size:22px;margin:0 0 16px}.card-list{display:flex;flex-direction:column;gap:12px}.card{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 20px;background:#fff;border-radius:12px;border:1px solid #eef0f3}.card-text{font-size:18px;font-weight:600;color:#1f2329}.card-translation{margin-top:4px;font-size:14px;color:#6b7280}.card-side{display:flex;align-items:center;gap:12px}.card-actions{display:flex;gap:8px}.tag{display:inline-block;padding:2px 10px;border-radius:999px;font-size:12px;white-space:nowrap}.tag-none{background:#f3f4f6;color:#6b7280}.tag-known{background:#dcfce7;color:#16a34a}.tag-learning{background:#fef3c7;color:#d97706}.tag-mastered{background:#dbeafe;color:#2563eb}.tag-quiz{background:#ede9fe;color:#7c3aed}.btn{display:inline-flex;align-items:center;justify-content:center;padding:9px 18px;border-radius:8px;border:1px solid #d1d5db;background:#fff;color:#374151;font-size:14px;cursor:pointer;transition:all .15s}.btn:hover{border-color:#9ca3af}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:#2563eb;border-color:#2563eb;color:#fff}.btn-primary:hover{background:#1d4ed8;border-color:#1d4ed8}.btn-outline{border-color:#2563eb;color:#2563eb}.btn-ghost{border:none;background:transparent;color:#6b7280}.btn-sm{padding:5px 12px;font-size:13px}.hint{padding:32px;text-align:center;color:#9ca3af;font-size:14px}.pagination{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:20px;padding-top:16px;border-top:1px solid #eef0f3}.pagination-info{font-size:13px;color:#6b7280}.pagination-btns{display:flex;align-items:center;gap:12px}.pagination-page{font-size:13px;color:#374151;min-width:56px;text-align:center}.error{color:#dc2626;font-size:14px;margin:8px 0}.ok{color:#16a34a;font-size:16px;font-weight:600}.auth-wrap{display:flex;justify-content:center;align-items:center;min-height:100vh;background:#f5f6f8}.auth-card{width:360px;padding:32px;background:#fff;border-radius:16px;border:1px solid #eef0f3;display:flex;flex-direction:column;gap:14px}.auth-card h2{margin:0 0 8px;text-align:center}.auth-card input{padding:10px 12px;border:1px solid #d1d5db;border-radius:8px;font-size:14px}.auth-link{text-align:center;font-size:13px;color:#6b7280}.page{display:flex;flex-direction:column;gap:12px}.detail-head{display:flex;align-items:center;justify-content:space-between;gap:16px}.detail-text{font-size:28px;margin:0}.detail-player{position:relative;background:#000;border-radius:12px;overflow:hidden}.player{width:100%;display:block}.player-empty{padding:48px;text-align:center;color:#6b7280;background:#fff;border-radius:12px;border:1px dashed #d1d5db}.subtitle{padding:14px 16px;background:#fff;border-radius:10px;border:1px solid #eef0f3;font-size:15px;color:#374151}.detail-actions{display:flex;gap:12px}.quiz-card{display:flex;flex-direction:column;gap:14px;padding:20px;background:#fff;border-radius:12px;border:1px solid #eef0f3}.quiz-card audio{width:100%}.input{padding:10px 12px;border:1px solid #d1d5db;border-radius:8px;font-size:15px}.quiz-result{display:flex;flex-direction:column;gap:12px;padding-top:12px;border-top:1px solid #eef0f3}.quiz-result-actions{display:flex;gap:12px}@media (min-width: 768px){.quiz-card .seg-player video{max-height:58vh}}.clip-panel{flex:1;overflow-y:auto;display:flex;flex-direction:column;gap:8px;padding:12px 12px 12px 18px}.clip-panel-title{font-size:14px;font-weight:600;color:#374151;padding:0 0 4px}.clip-item{display:flex;flex-direction:column;gap:4px;padding:12px 16px;text-align:left;background:#fff;border:1px solid #eef0f3;border-radius:10px;cursor:pointer;transition:all .15s}.clip-item:hover{border-color:#bfdbfe}.clip-item.active{border-color:#2563eb;background:#eff6ff}.clip-meta{font-size:12px;color:#2563eb;font-weight:600}.clip-text{font-size:14px;color:#374151}.lexeme-detail{display:flex;align-items:flex-start;gap:16px}.detail-left{flex:1;min-width:0;display:flex;flex-direction:column;gap:12px}.detail-right{position:sticky;top:76px;height:calc(100vh - 100px);flex-shrink:0;display:flex;flex-direction:column;background:#fff;border:1px solid #eef0f3;border-radius:12px;overflow:hidden}.drag-handle{position:absolute;left:0;top:0;bottom:0;width:6px;cursor:col-resize;z-index:5}.drag-handle:hover{background:#bfdbfe}.lexeme-mark{background:#fde68a;color:#92400e;padding:0 2px;border-radius:3px;font-weight:600}.clip-transition{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;background:#000000bf;color:#fff;z-index:10}.clip-transition-label{font-size:13px;opacity:.85}.clip-transition-title{font-size:16px;font-weight:600}.seg-player{background:#000;border-radius:12px;overflow:hidden}.seg-player video,.seg-player audio{width:100%;display:block;cursor:pointer}.seg-player video{aspect-ratio:16 / 9;object-fit:contain;background:#000}.seg-controls{display:flex;align-items:center;gap:12px;padding:10px 14px;background:#111827}.seg-btn{background:transparent;border:none;color:#fff;font-size:13px;cursor:pointer;padding:4px 8px;white-space:nowrap}.seg-progress{flex:1;height:6px;background:#fff3;border-radius:3px;cursor:pointer}.seg-progress-fill{height:100%;background:#3b82f6;border-radius:3px}.seg-time{font-size:12px;color:#d1d5db;white-space:nowrap;font-variant-numeric:tabular-nums}.type-filter{display:flex;gap:8px;margin-bottom:16px}.type-filter-item{padding:6px 16px;border-radius:999px;border:1px solid #d1d5db;background:#fff;color:#4b5563;font-size:14px;cursor:pointer}.type-filter-item.active{background:#2563eb;border-color:#2563eb;color:#fff}.tag-filter{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px}.tag-filter-item{padding:5px 14px;border-radius:999px;border:1px solid #d1d5db;background:#fff;color:#4b5563;font-size:13px;cursor:pointer}.tag-filter-item.active{background:#059669;border-color:#059669;color:#fff}.tag-filter-group{margin-bottom:12px}.tag-filter-label{font-size:13px;font-weight:600;color:#6b7280;margin-bottom:6px}.tag-filter-exclude.active{background:#dc2626;border-color:#dc2626;color:#fff}.lexeme-tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}.lexeme-tag{padding:2px 10px;border-radius:999px;background:#ecfdf5;border:1px solid #a7f3d0;color:#059669;font-size:12px}.unlearned-toggle{display:inline-flex;align-items:center;gap:6px;margin-bottom:16px;font-size:14px;color:#4b5563;cursor:pointer}.fav-star{color:#f59e0b;font-size:16px}.detail-head-side{display:flex;align-items:center;gap:12px}.fav-btn{padding:4px 12px;border-radius:8px;border:1px solid #fbbf24;background:#fff;color:#d97706;font-size:13px;cursor:pointer;white-space:nowrap}.fav-btn.active{background:#fef3c7;color:#b45309}.quiz-mode{display:flex;align-items:center;gap:16px;margin-bottom:16px;font-size:14px;color:#374151}.quiz-mode label{display:inline-flex;align-items:center;gap:4px;cursor:pointer}.quiz-choices{display:grid;grid-template-columns:1fr 1fr;gap:10px}.quiz-choice{padding:12px;border-radius:8px;border:1px solid #d1d5db;background:#fff;font-size:15px;cursor:pointer;text-align:center}.quiz-choice.active{border-color:#2563eb;background:#eff6ff;color:#2563eb;font-weight:600}.brand-short{display:none}@media (max-width: 768px){.brand-full{display:none}.brand-short{display:inline;font-size:14px;white-space:nowrap}.topbar{padding:0 10px;gap:6px}.nav{min-width:0;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}.nav::-webkit-scrollbar{display:none}.nav-link{padding:6px 10px;font-size:13px;white-space:nowrap;flex-shrink:0}.user{gap:4px;flex-shrink:0}.user-email{display:none}.topbar .btn-ghost{padding:6px 8px;font-size:13px}.content{padding:16px 12px 48px}.page-title{font-size:19px;margin-bottom:12px}.lexeme-detail{flex-direction:column}.detail-right{position:static;width:100%!important;height:auto;max-height:320px}.drag-handle{display:none}.clip-panel{padding:10px}.detail-text{font-size:22px}.detail-head{gap:10px}.card{padding:12px 14px;gap:10px}.card-text{font-size:16px}.detail-actions,.quiz-result-actions{flex-wrap:wrap}.detail-actions .btn{flex:1}.quiz-card{padding:14px}.quiz-choices{grid-template-columns:1fr}.auth-card{width:auto;max-width:360px;margin:0 16px;padding:24px 18px}.seg-controls{padding:8px 10px;gap:8px}.seg-time{display:none}.hint{padding:24px 16px}*{-webkit-tap-highlight-color:transparent}}.pron-list{display:flex;flex-direction:column;gap:16px}.pron-head h1{font-size:26px;margin:0 0 6px}.pron-subtitle{margin:0;color:#6b7280;font-size:14px}.pron-basics-toggle{padding:8px 14px;border:1px solid #e5e7eb;border-radius:8px;background:#f9fafb;color:#374151;cursor:pointer;font-size:14px}.pron-basics-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:12px;margin-top:12px}.basic-card{padding:14px 16px;background:#fff;border:1px solid #eef0f3;border-radius:10px}.basic-term{font-size:16px;font-weight:600;color:#111827;margin-bottom:6px}.basic-term-en{margin-left:8px;font-size:13px;font-weight:500;color:#6b7280}.basic-def{font-size:14px;color:#4b5563;line-height:1.6}.pron-skill-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px}.skill-card{display:flex;flex-direction:column;gap:6px;padding:18px;text-align:left;background:#fff;border:1px solid #eef0f3;border-radius:12px;cursor:pointer;transition:all .15s}.skill-card:hover{border-color:#bfdbfe;box-shadow:0 2px 8px #0000000a}.skill-cat{font-size:12px;color:#2563eb;font-weight:600}.skill-name{font-size:20px;font-weight:600;color:#111827}.skill-name-en{margin-left:8px;font-size:14px;font-weight:500;color:#6b7280}.skill-clip-count{font-size:13px;color:#6b7280}.pron-detail{display:flex;align-items:flex-start;gap:16px}.pron-detail .detail-right{width:360px}.breadcrumb{display:flex;align-items:center;gap:8px;font-size:14px;margin-bottom:4px}.breadcrumb-link{background:none;border:none;padding:0;color:#2563eb;cursor:pointer;font-size:14px;font-weight:600}.breadcrumb-link:hover{text-decoration:underline}.breadcrumb-sep{color:#9ca3af}.breadcrumb-current{color:#2563eb;font-weight:600}.pron-name-en{margin-left:10px;font-size:18px;font-weight:500;color:#6b7280}.pron-desc{display:flex;flex-direction:column;gap:12px;padding:16px 18px;background:#fff;border:1px solid #eef0f3;border-radius:12px}.pron-desc-p{margin:0;font-size:15px;color:#374151;line-height:1.7}@media (max-width: 768px){.pron-basics-grid,.pron-skill-grid{grid-template-columns:1fr}.pron-detail{flex-direction:column}}.pron-skill-detail{display:flex;flex-direction:column;gap:16px}.pron-pattern-section{display:flex;flex-direction:column;gap:12px}.pron-pattern-title{font-size:15px;font-weight:600;color:#374151}.pron-pattern-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:10px}.pattern-card{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:12px 16px;background:#fff;border:1px solid #eef0f3;border-radius:10px;cursor:pointer;transition:all .15s}.pattern-card:hover{border-color:#bfdbfe;background:#f8fafc}.pattern-text{font-size:16px;font-weight:600;color:#111827}.pattern-count{font-size:12px;color:#6b7280;white-space:nowrap}.search-box{position:relative}.search-input{width:100%;padding:10px 14px;border:1px solid #d1d5db;border-radius:8px;font-size:15px;outline:none}.search-input:focus{border-color:#2563eb}.search-results{position:absolute;top:100%;left:0;right:0;z-index:20;margin-top:4px;background:#fff;border:1px solid #eef0f3;border-radius:8px;box-shadow:0 4px 12px #00000014;max-height:320px;overflow-y:auto}.search-item{display:flex;align-items:baseline;gap:10px;width:100%;padding:10px 14px;text-align:left;background:none;border:none;cursor:pointer}.search-item:hover{background:#f8fafc}.search-item-text{font-size:15px;font-weight:600;color:#111827;flex-shrink:0}.search-item-trans{font-size:13px;color:#6b7280;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.search-row{display:flex;gap:8px}.search-row .search-input{flex:1}.search-list{display:flex;flex-direction:column;gap:8px;margin-top:12px}.search-list-item{display:flex;align-items:baseline;gap:12px;padding:12px 16px;text-align:left;background:#fff;border:1px solid #eef0f3;border-radius:10px;cursor:pointer;transition:all .15s}.search-list-item:hover{border-color:#bfdbfe;background:#f8fafc}.gap-picker{display:inline-flex;align-items:center;gap:6px}.gap-picker-label{font-size:14px;color:#6b7280}.gap-select{padding:6px 10px;border:1px solid #d1d5db;border-radius:6px;background:#fff;color:#374151;font-size:14px;cursor:pointer;outline:none}.gap-select:hover,.gap-select:focus{border-color:#2563eb}.toast{position:fixed;top:64px;left:50%;transform:translate(-50%);z-index:999;padding:10px 20px;border-radius:8px;font-size:15px;color:#fff;box-shadow:0 4px 16px #00000026;max-width:80vw;text-align:center}.toast-success{background:#16a34a}.toast-error{background:#dc2626}.toast-info{background:#2563eb}