.grammar-guide{max-width:1160px;margin:0 auto;padding:2.5rem 1.25rem;color:var(--color-ink);font-size:1.125rem;line-height:1.65}.grammar-guide section,.grammar-guide details{scroll-margin-top:7rem}.grammar-guide .guide-panel{padding:2rem;margin-bottom:1.5rem;border:1px solid #d7dfe8;border-radius:26px;background:linear-gradient(135deg,#fffdf7,#fff 65%,#edf5ff);box-shadow:0 12px 32px #17355208}.grammar-guide h1{font-size:clamp(2.7rem,6vw,5.2rem);line-height:1.05;max-width:20ch;margin:.5rem 0 1.4rem}.grammar-guide h2{font-size:clamp(1.8rem,3.5vw,3rem);line-height:1.15}.grammar-guide h3{font-size:1.35rem}.grammar-guide .guide-kicker{color:#164bc7;font-weight:700;letter-spacing:.08em;text-transform:uppercase}.grammar-guide .guide-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}.grammar-guide .guide-card{border:1px solid #d7dfe8;border-radius:18px;padding:1.2rem;background:#fff}.grammar-guide .guide-links{display:flex;flex-wrap:wrap;gap:.7rem}.grammar-guide a{color:#1246bc;text-underline-offset:.2em}.grammar-guide .guide-action{display:inline-block;border-radius:25px;padding:.6rem 1.1rem;background:#235ce0;color:white;text-decoration:none}.grammar-guide details{border:1px solid #d7dfe8;border-radius:18px;background:#fff;margin:.8rem 0;padding:1rem 1.2rem}.grammar-guide summary{font-size:1.35rem;font-weight:700;cursor:pointer;min-height:44px}.grammar-guide dl{display:grid;grid-template-columns:8rem minmax(0,1fr);gap:.4rem 1rem}.grammar-guide dt{font-weight:700}.grammar-guide dd{margin:0;overflow-wrap:anywhere}.grammar-guide .guide-warning{padding:1rem;border-left:4px solid #d7a000;background:#fff9e4;border-radius:8px}.grammar-guide .guide-example{border-left:4px solid #2c62de;background:#f1f6ff;padding:1rem;border-radius:8px}.grammar-guide .guide-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.75rem}.grammar-guide button{font:inherit;min-height:48px;border:1px solid #bdc9db;border-radius:16px;padding:.65rem 1rem;background:white;color:inherit;cursor:pointer;overflow-wrap:anywhere}.grammar-guide button:focus-visible,.grammar-guide a:focus-visible,.grammar-guide summary:focus-visible{outline:3px solid #194cdb;outline-offset:4px}.grammar-guide button[disabled]{opacity:.5;cursor:default}.grammar-guide .is-correct{background:#e4f8ed;border-color:#27965f;color:#145c36}.grammar-guide .is-wrong{background:#fff0f0;border-color:#d75050;color:#a41d1d}.grammar-guide .is-solution{background:#e0ecff;border-color:#3970eb;color:#1647ae}.grammar-guide .guide-feedback{padding:1rem;border-radius:14px;margin:1rem 0;background:#f1f3f5}.grammar-guide .guide-feedback.is-correct{background:#e4f8ed}.grammar-guide .guide-feedback.is-wrong{background:#fff0f0}.grammar-guide .guide-feedback.is-solution{background:#e0ecff}.grammar-guide .guide-actions{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:1rem}.grammar-guide blockquote{margin:1rem 0}.grammar-guide .guide-source-list li{margin-bottom:.7rem}.grammar-skip{position:absolute;top:-10rem;left:1rem;z-index:1000}.grammar-skip:focus{top:1rem;background:white;padding:1rem}.grammar-guide [hidden]{display:none!important}@media(max-width:680px){.grammar-guide{padding:1rem .65rem;font-size:1rem}.grammar-guide .guide-panel{padding:1.25rem 1rem}.grammar-guide .guide-grid{grid-template-columns:1fr}.grammar-guide .guide-options{grid-template-columns:1fr}.grammar-guide dl{grid-template-columns:1fr}.grammar-guide dt{margin-top:.6rem}.grammar-guide h1{font-size:2.75rem}}
.grammar-guide :is(h1,h2,h3,summary,p,li){overflow-wrap:anywhere;hyphens:auto}
.grammar-guide .guide-native-contrast{padding:1rem;border-left:4px solid #1682a8;background:#edf9fc;border-radius:8px}

/* Internal routes are links semantically, but must read visually as primary controls. */
.grammar-guide .guide-links a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 0.65rem 1rem;
  border: 1px solid #1647b8;
  border-radius: 16px;
  color: #fff;
  background: linear-gradient(135deg, #2563eb, #1647b8);
  box-shadow: 0 8px 20px rgba(22, 71, 184, 0.2);
  font-weight: 800;
  line-height: 1.15;
  text-align: center;
  text-decoration: none;
  transition: transform 150ms ease, box-shadow 150ms ease, background 150ms ease;
}

.grammar-guide .guide-links a:hover {
  color: #fff;
  background: linear-gradient(135deg, #1647b8, #0f357f);
  box-shadow: 0 11px 25px rgba(15, 53, 127, 0.26);
  transform: translateY(-1px);
}

.grammar-guide .guide-links a:active {
  transform: translateY(0);
}

@media (prefers-reduced-motion: reduce) {
  .grammar-guide .guide-links a {
    transition: none;
  }
}