:root{--glass-bg: rgba(255,255,255,.95);--glass-border: rgba(255,255,255,.2);--shadow-lg: 0 10px 30px -5px rgba(212,175,55,.1);--accent-gradient: linear-gradient(135deg, #d4af37, #b8541a)}body.dark-mode{--glass-bg: rgba(34, 24, 28,.95);--glass-border: rgba(255,255,255,.05);--shadow-lg: 0 10px 30px -5px rgba(0,0,0,.3)}.topic-container{max-width:1100px;margin:2rem auto;padding:2.5rem 1.5rem;animation:fadeIn .5s ease-out}.topic-header{background:linear-gradient(135deg,#d4af3708,#5c1d3d08);border:1px solid rgba(212,175,55,.1);border-radius:1.25rem;padding:2.5rem;margin-bottom:2rem;text-align:center}.topic-header h1{font-family:Outfit,sans-serif;font-size:clamp(2rem,5vw,2.5rem);font-weight:800;background:var(--accent-gradient);-webkit-background-clip:text;-webkit-text-fill-color:transparent;margin-bottom:.75rem}.study-tabs{display:flex;flex-wrap:wrap;gap:.5rem;padding:.55rem;background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:1rem;margin-bottom:2rem;position:sticky;top:88px;z-index:100;backdrop-filter:blur(16px);justify-content:center}.tab-btn{border:none;background:transparent;color:#6e5f64;padding:.65rem 1.1rem;border-radius:999px;cursor:pointer;font-weight:600;font-size:.9rem;font-family:Outfit,sans-serif;display:inline-flex;align-items:center;gap:.5rem;transition:all .3s ease;white-space:nowrap}.tab-btn:hover{background:#d4af3714;color:#d4af37}.tab-btn.active{background:#b45309;color:#fff;box-shadow:0 8px 20px #d4af3740}.topic-content{min-height:400px}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}