:root{--color-bg-primary: #0d1117;--color-bg-secondary: #161b22;--color-bg-tertiary: #1c2128;--color-bg-hover: #1f2937;--color-border: #21262d;--color-border-hover: #30363d;--color-accent: #58a6ff;--color-accent-hover: #79c0ff;--color-accent-muted: #1f6feb33;--color-text-primary: #f0f6fc;--color-text-secondary: #8b949e;--color-text-muted: #6e7681;--color-success: #3fb950;--color-warning: #d29922;--color-danger: #f85149;--color-purple: #bc8cff;--color-purple-muted: #8b5cf633;--font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans", Helvetica, Arial, sans-serif;--font-mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;--radius-sm: 6px;--radius-md: 8px;--radius-lg: 12px;--radius-full: 9999px;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .3);--shadow-md: 0 4px 12px rgba(0, 0, 0, .4);--shadow-lg: 0 8px 24px rgba(0, 0, 0, .5);--shadow-glow: 0 0 20px rgba(88, 166, 255, .15);--transition-fast: .15s ease;--transition-normal: .25s ease}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;scroll-behavior:smooth}body{font-family:var(--font-family);background-color:var(--color-bg-primary);color:var(--color-text-primary);line-height:1.6;min-height:100vh;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}#root{min-height:100vh;display:flex;flex-direction:column}a{color:var(--color-accent);text-decoration:none;transition:color var(--transition-fast)}a:hover{color:var(--color-accent-hover);text-decoration:underline}.header{background:var(--color-bg-secondary);border-bottom:1px solid var(--color-border);padding:12px 24px;position:sticky;top:0;z-index:100}.header-inner{max-width:1280px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:16px}.header-logo{display:flex;align-items:center;gap:10px;font-size:20px;font-weight:700;color:var(--color-text-primary);text-decoration:none}.header-logo:hover{text-decoration:none}.header-logo-icon{font-size:24px}.header-subtitle{font-size:13px;color:var(--color-text-secondary);font-weight:400}.container{max-width:1280px;margin:0 auto;padding:24px;flex:1}.card{background:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-md);transition:border-color var(--transition-fast),box-shadow var(--transition-fast)}.card:hover{border-color:var(--color-border-hover)}.card-interactive:hover{box-shadow:var(--shadow-glow);border-color:var(--color-accent);cursor:pointer}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:8px 16px;font-size:14px;font-weight:500;font-family:var(--font-family);border-radius:var(--radius-md);border:1px solid transparent;cursor:pointer;transition:all var(--transition-fast);text-decoration:none;line-height:1.4;white-space:nowrap}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:var(--color-accent);color:#fff;border-color:var(--color-accent)}.btn-primary:hover:not(:disabled){background:#4c94e0;border-color:#4c94e0}.btn-secondary{background:var(--color-bg-tertiary);color:var(--color-text-primary);border-color:var(--color-border)}.btn-secondary:hover:not(:disabled){background:var(--color-bg-hover);border-color:var(--color-border-hover)}.btn-danger{background:transparent;color:var(--color-danger);border-color:var(--color-border)}.btn-danger:hover:not(:disabled){background:#f851491a;border-color:var(--color-danger)}.btn-sm{padding:4px 10px;font-size:12px}.btn-icon{padding:6px;border:none;background:transparent;color:var(--color-text-secondary);cursor:pointer;border-radius:var(--radius-sm);transition:all var(--transition-fast);font-size:18px;display:inline-flex;align-items:center;justify-content:center}.btn-icon:hover{color:var(--color-text-primary);background:var(--color-bg-hover)}.input{width:100%;padding:8px 12px;font-size:14px;font-family:var(--font-family);background:var(--color-bg-primary);color:var(--color-text-primary);border:1px solid var(--color-border);border-radius:var(--radius-md);outline:none;transition:border-color var(--transition-fast),box-shadow var(--transition-fast)}.input:focus{border-color:var(--color-accent);box-shadow:0 0 0 3px var(--color-accent-muted)}.input::placeholder{color:var(--color-text-muted)}.tabs{display:flex;border-bottom:1px solid var(--color-border);gap:0;margin-bottom:20px}.tab{padding:10px 16px;font-size:14px;font-weight:500;color:var(--color-text-secondary);background:transparent;border:none;border-bottom:2px solid transparent;cursor:pointer;transition:all var(--transition-fast);font-family:var(--font-family)}.tab:hover{color:var(--color-text-primary)}.tab.active{color:var(--color-text-primary);border-bottom-color:var(--color-accent)}.badge{display:inline-flex;align-items:center;padding:2px 8px;font-size:11px;font-weight:600;border-radius:var(--radius-full);line-height:1.4;text-transform:uppercase;letter-spacing:.03em}.badge-word{background:var(--color-accent-muted);color:var(--color-accent)}.badge-idiom{background:var(--color-purple-muted);color:var(--color-purple)}.badge-auto{background:#3fb95026;color:var(--color-success)}.badge-manual{background:#8b949e26;color:var(--color-text-secondary)}.tag{display:inline-flex;align-items:center;gap:6px;padding:4px 12px;font-size:13px;background:var(--color-accent-muted);color:var(--color-accent);border:1px solid rgba(88,166,255,.3);border-radius:var(--radius-full);transition:all var(--transition-fast)}.tag-remove{background:none;border:none;color:var(--color-text-secondary);cursor:pointer;font-size:14px;padding:0;line-height:1;transition:color var(--transition-fast)}.tag-remove:hover{color:var(--color-danger)}.news-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:16px}.news-card{padding:20px;display:flex;flex-direction:column;gap:12px}.news-card-title{font-size:16px;font-weight:600;line-height:1.4;color:var(--color-text-primary)}.news-card-meta{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--color-text-secondary);flex-wrap:wrap}.news-card-domain{color:var(--color-text-muted)}.news-card-actions{margin-top:auto;padding-top:12px;border-top:1px solid var(--color-border)}.player-container{display:flex;flex-direction:column;gap:20px}.player-controls{background:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:20px;display:flex;flex-direction:column;gap:14px}.player-buttons{display:flex;align-items:center;justify-content:center;gap:16px}.player-btn-play{width:48px;height:48px;border-radius:50%;background:var(--color-accent);color:#fff;border:none;cursor:pointer;font-size:20px;display:flex;align-items:center;justify-content:center;transition:all var(--transition-fast)}.player-btn-play:hover{background:var(--color-accent-hover);transform:scale(1.05)}.player-progress{display:flex;align-items:center;gap:10px;font-size:12px;color:var(--color-text-secondary);font-family:var(--font-mono)}.player-progress-bar{flex:1;height:4px;background:var(--color-bg-primary);border-radius:2px;cursor:pointer;position:relative;overflow:hidden}.player-progress-fill{height:100%;background:var(--color-accent);border-radius:2px;transition:width .2s linear}.player-speed{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--color-text-secondary)}.player-speed-slider{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:120px;height:4px;background:var(--color-bg-primary);border-radius:2px;outline:none}.player-speed-slider::-webkit-slider-thumb{-webkit-appearance:none;width:14px;height:14px;border-radius:50%;background:var(--color-accent);cursor:pointer}.text-panels{display:grid;grid-template-columns:1fr 1fr;gap:16px}.text-panel{background:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:20px;max-height:60vh;overflow-y:auto}.text-panel-header{font-size:13px;font-weight:600;color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.05em;margin-bottom:16px;padding-bottom:8px;border-bottom:1px solid var(--color-border)}.sentence{padding:8px 0;line-height:1.8;font-size:15px;border-bottom:1px solid rgba(33,38,45,.5);transition:background var(--transition-fast)}.sentence:last-child{border-bottom:none}.sentence.highlighted{background:var(--color-accent-muted);border-radius:var(--radius-sm);padding:8px;margin:-2px -8px}.word-annotated{border-bottom:2px dotted var(--color-accent);cursor:pointer;transition:all var(--transition-fast);padding:0 1px}.word-annotated:hover{background:var(--color-accent-muted);border-radius:2px}.word-annotated.idiom{border-bottom-color:var(--color-purple)}.word-annotated.idiom:hover{background:var(--color-purple-muted)}.popover-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:999}.popover{position:fixed;z-index:1000;background:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);padding:16px;min-width:280px;max-width:360px;animation:popoverIn .15s ease}@keyframes popoverIn{0%{opacity:0;transform:translateY(-4px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}.popover-word{font-size:18px;font-weight:700;margin-bottom:6px}.popover-pos{font-size:12px;color:var(--color-text-muted);font-style:italic;margin-bottom:10px}.popover-meaning{font-size:15px;color:var(--color-text-primary);margin-bottom:10px;padding-bottom:10px;border-bottom:1px solid var(--color-border)}.popover-example{font-size:13px;color:var(--color-text-secondary);font-style:italic;line-height:1.5}.bottom-sheet-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000080;z-index:999;animation:fadeIn .15s ease}.bottom-sheet{position:fixed;bottom:0;left:0;right:0;z-index:1000;background:var(--color-bg-secondary);border-top:1px solid var(--color-border);border-radius:var(--radius-lg) var(--radius-lg) 0 0;padding:12px 20px 32px;animation:slideUp .25s ease}.bottom-sheet-handle{width:36px;height:4px;background:var(--color-border-hover);border-radius:2px;margin:0 auto 16px}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{transform:translateY(100%)}to{transform:translateY(0)}}.progress-container{display:flex;flex-direction:column;align-items:center;gap:16px;padding:40px}.spinner{width:32px;height:32px;border:3px solid var(--color-border);border-top-color:var(--color-accent);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.progress-text{font-size:14px;color:var(--color-text-secondary)}.section-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}.section-title{font-size:18px;font-weight:600}.empty-state{text-align:center;padding:48px 24px;color:var(--color-text-secondary)}.empty-state-icon{font-size:48px;margin-bottom:16px;opacity:.5}.empty-state-text{font-size:15px;max-width:400px;margin:0 auto}.back-link{display:inline-flex;align-items:center;gap:6px;font-size:14px;color:var(--color-text-secondary);margin-bottom:16px;cursor:pointer;background:none;border:none;font-family:var(--font-family);transition:color var(--transition-fast)}.back-link:hover{color:var(--color-accent)}@media(max-width:768px){.container{padding:16px}.header{padding:10px 16px}.header-subtitle{display:none}.news-grid,.text-panels{grid-template-columns:1fr}.player-buttons{gap:12px}.popover{display:none}}@media(min-width:769px){.bottom-sheet-overlay,.bottom-sheet{display:none}}