.grammar-layout{display:grid;grid-template-columns:260px minmax(0,1fr);gap:48px;padding-top:48px;padding-bottom:80px;align-items:start}.grammar-sidebar{position:sticky;top:100px}.grammar-sidebar-heading{margin-bottom:24px}.grammar-sidebar-heading h2{font-size:1.4rem;font-weight:800;margin-top:8px}.grammar-sidebar .accordion-item{border:0;border-bottom:1px solid #e9e9e9}.grammar-sidebar .accordion-button{padding:16px 12px;background:0 0;box-shadow:none;color:#222;font-size:.95rem}.grammar-sidebar .accordion-button strong{margin-right:8px}.grammar-sidebar .accordion-body{padding:0 8px 12px}.grammar-link{display:block;width:100%;padding:10px 12px;border:0;border-radius:8px;background:0 0;color:#666;text-align:left;font-size:.9rem;transition:background .2s,color .2s}.grammar-link:hover{background:#f5f5f5;color:#222}.grammar-link.active{background:#f0f4ff;color:#315bd6;font-weight:700}.grammar-content{min-width:0;max-width:820px;padding-top:12px}.grammar-content h1{margin:12px 0 8px;font-size:clamp(2rem, 4vw, 2.7rem);font-weight:800}.grammar-subtitle{color:#888;font-size:1.05rem;margin-bottom:36px}.grammar-article h2{margin-top:32px;margin-bottom:14px;font-size:1.25rem;font-weight:700}.grammar-article p{line-height:1.8;color:#555}.grammar-example{padding:18px 20px;margin-bottom:12px;border:1px solid #eaeaea;border-radius:12px}.grammar-example p{margin-bottom:5px;color:#222;font-weight:700}.grammar-example span{color:#888;font-size:.9rem}@media (max-width:767.98px){.grammar-layout{grid-template-columns:1fr;gap:32px;padding-top:24px}.grammar-sidebar{position:static}.grammar-content{padding-top:0}}.grammar-example-korean{display:flex;align-items:center;gap:10px}.grammar-example-korean p{margin:0}.tts-button{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border:1px solid #e5e7eb;border-radius:50%;background:#fff;color:#555;cursor:pointer;transition:.2s}.tts-button:hover{background:#f3f4f6;color:#111}.grammar-note{padding:12px 16px;background-color:#f8f9fa;border-left:3px solid #6c757d;border-radius:4px}.grammar-practice{margin-top:24px;padding:24px;border:1px solid #e5e7eb;border-radius:12px}.practice-header{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:14px}.practice-description{margin:0}.practice-progress{color:#6b7280;font-size:.9rem;white-space:nowrap}.practice-progress-bar{width:100%;height:6px;margin-bottom:28px;overflow:hidden;background:#e5e7eb;border-radius:10px}.practice-progress-fill{width:0;height:100%;background:#2563eb;border-radius:10px;transition:width .25s}.practice-instruction{margin-bottom:8px;color:#6b7280;font-size:.9rem}.practice-prompt{margin-bottom:24px;font-size:1.5rem;font-weight:600}.practice-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.practice-option{padding:14px;border:1px solid #d1d5db;border-radius:8px;background:#fff;font-size:1rem;cursor:pointer;transition:background .2s,border-color .2s}.practice-option:hover:not(:disabled){border-color:#2563eb;background:#eff6ff}.practice-option:disabled{cursor:default}.practice-option.correct{border-color:#16a34a;background:#f0fdf4;color:#15803d}.practice-option.incorrect{border-color:#dc2626;background:#fef2f2;color:#b91c1c}.practice-feedback{margin-top:20px;padding:16px;border-radius:8px;background:#f3f4f6}.practice-feedback-title{display:block;margin-bottom:6px}.practice-feedback-text{margin:0;line-height:1.6}.practice-next,.practice-retry{margin-top:20px;padding:12px 20px;border:none;border-radius:8px;background:#2563eb;color:#fff;font-size:.95rem;cursor:pointer}.practice-next:hover,.practice-retry:hover{background:#1d4ed8}.practice-result{padding:24px 0;text-align:center}.practice-result h3{margin-bottom:12px}.practice-result p{margin-bottom:0}@media (max-width:576px){.grammar-practice{padding:18px}.practice-options{grid-template-columns:1fr}}