.grammar-sidebar{width:300px;background:#fff;border:1px solid #e2e8f0;border-radius:16px;height:fit-content;display:flex;flex-direction:column;position:sticky;top:100px;max-height:calc(100vh - 120px);z-index:35;box-shadow:0 10px 30px -10px #0000000d;transition:width .3s cubic-bezier(.4,0,.2,1),transform .3s cubic-bezier(.4,0,.2,1),opacity .3s ease;overflow:hidden}.sidebar-header-wrapper{padding:1.25rem 1.25rem .75rem;background:#fff;flex-shrink:0;display:flex;flex-direction:column;gap:1rem;border-bottom:1px solid transparent;transition:border-color .2s;z-index:2}.grammar-sidebar.has-scroll .sidebar-header-wrapper{border-bottom-color:#f1f5f9}.sidebar-header{display:flex;align-items:center;justify-content:space-between}.sidebar-heading{display:flex;flex-direction:column}.sidebar-title{font-size:1.15rem;font-weight:700;color:#0f172a;margin:0;line-height:1.2}.sidebar-count{font-size:.8rem;color:#64748b;font-weight:500}.sidebar-toggle{display:flex;align-items:center;justify-content:center;width:32px;height:32px;background:transparent;border:1px solid transparent;color:#64748b;cursor:pointer;border-radius:8px;transition:all .2s ease}.sidebar-toggle:hover{background:#f1f5f9;color:#0f172a}.sidebar-search-wrapper{position:relative;display:flex;align-items:center;background:#f8fafc;border:1px solid #e2e8f0;border-radius:10px;padding:.6rem .75rem;gap:.5rem;transition:all .2s ease}.sidebar-search-wrapper:focus-within{background:#fff;border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a}.sidebar-search-icon{color:#94a3b8;flex-shrink:0}.sidebar-search-wrapper input{border:none;background:transparent;flex:1;font-size:.9rem;color:#0f172a;outline:none;width:100%;min-width:0}.sidebar-search-wrapper input::placeholder{color:#94a3b8}#sidebar-search-clear{background:none;border:none;padding:2px;cursor:pointer;color:#94a3b8;border-radius:50%;display:flex;transition:all .2s}#sidebar-search-clear:hover{background:#e2e8f0;color:#ef4444}#sidebar-search-clear:not(.active){display:none}.sidebar-content{flex:1;overflow-y:auto;overflow-x:hidden;padding:.5rem .75rem 1.5rem;display:flex;flex-direction:column;gap:1.5rem;scrollbar-width:thin;scrollbar-color:#cbd5e1 transparent}.sidebar-content::-webkit-scrollbar{width:5px}.sidebar-content::-webkit-scrollbar-track{background:transparent}.sidebar-content::-webkit-scrollbar-thumb{background-color:#cbd5e1;border-radius:10px}.sidebar-content::-webkit-scrollbar-thumb:hover{background-color:#94a3b8}.level-section{display:flex;flex-direction:column;gap:.5rem}.level-header{position:sticky;top:-.5rem;background:#fffffff2;backdrop-filter:blur(4px);z-index:5;display:flex;align-items:center;justify-content:space-between;padding:.5rem;margin:0 -.5rem;cursor:pointer;border-radius:8px;user-select:none}.level-header:hover{background:#f8fafc}.level-heading{display:flex;align-items:center;gap:.6rem}.level-pill{font-size:.7rem;font-weight:700;text-transform:uppercase;padding:.25rem .6rem;border-radius:6px;letter-spacing:.03em}.level-pill[data-level=beginner]{background:#ecfdf5;color:#047857;border:1px solid rgba(16,185,129,.2)}.level-pill[data-level=intermediate]{background:#eff6ff;color:#1d4ed8;border:1px solid rgba(59,130,246,.2)}.level-pill[data-level=advanced]{background:#fff7ed;color:#c2410c;border:1px solid rgba(249,115,22,.2)}.level-count{font-size:.75rem;color:#94a3b8}.level-toggle{color:#94a3b8;background:transparent;border:none;padding:4px;border-radius:4px;display:flex;transition:transform .3s ease}.level-toggle[aria-expanded=true]{transform:rotate(0)}.level-toggle[aria-expanded=false]{transform:rotate(-90deg)}.grammar-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:2px}.grammar-item{display:block;text-decoration:none;padding:.75rem 1rem;border-radius:8px;border-left:3px solid transparent;color:#334155;transition:all .2s cubic-bezier(.4,0,.2,1);position:relative}.grammar-item:hover{background:#f8fafc;color:#0f172a}.grammar-item.active{background:#f0f9ff;color:#0369a1;border-left-color:#0ea5e9;font-weight:500}.item-title{font-size:.95rem;margin-bottom:.2rem;display:block}.item-meta{display:flex;align-items:center;justify-content:space-between;gap:.5rem}.item-meaning{font-size:.8rem;color:#64748b;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.grammar-item.active .item-meaning{color:#38bdf8}.item-tags{display:flex;gap:.25rem}.item-tag{font-size:.65rem;background:#f1f5f9;color:#64748b;padding:1px 5px;border-radius:4px}.highlight-text{background:#fde0474d;color:#a16207;border-radius:2px;padding:0 2px;font-weight:600}.sidebar-empty{text-align:center;padding:3rem 1rem;color:#94a3b8}.sidebar-empty p{margin-top:.5rem;font-size:.9rem}.grammar-sidebar.collapsed{width:60px;padding:0;background:transparent;border-color:transparent;box-shadow:none;overflow:visible}.grammar-sidebar.collapsed .sidebar-header-wrapper{padding:.75rem;background:transparent;border:none;align-items:center}.grammar-sidebar.collapsed .sidebar-toggle{background:#fff;border:1px solid #e2e8f0;box-shadow:0 4px 6px -1px #0000001a;width:40px;height:40px}.grammar-sidebar.collapsed .sidebar-heading,.grammar-sidebar.collapsed .sidebar-search-wrapper,.grammar-sidebar.collapsed .sidebar-content,.grammar-sidebar.collapsed .level-section,.grammar-sidebar.collapsed .sidebar-empty{display:none!important}@media (max-width: 1024px){.grammar-sidebar{position:fixed;top:0;left:0;height:100vh;max-height:100vh;width:85%;max-width:320px;border-radius:0;transform:translate(-100%);border:none;z-index:150;box-shadow:none}.grammar-sidebar.open{transform:translate(0);box-shadow:none}.sidebar-header-wrapper{padding-top:1.5rem}.grammar-sidebar .sidebar-toggle{display:none}}