.signature-section{--sig-violet:255 72% 38%;--sig-deep:258 67% 24%;--sig-paper:0 0% 100%;--sig-mint:162 59% 77%;--sig-gold:43 96% 70%}.signature-intro{align-items:end;gap:1.5rem;display:grid}.signature-board{background:linear-gradient(120deg,hsl(var(--sig-violet)),hsl(var(--sig-deep)));color:hsl(var(--sig-paper));border-radius:1rem;padding:clamp(1.2rem,3vw,2.4rem)}.signature-board-head{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.75rem;display:flex}.signature-note{color:hsl(var(--sig-gold));align-items:center;gap:.5rem;font-weight:700;display:inline-flex}.signature-path{align-items:stretch;margin:2rem 0;display:flex}.signature-stop{flex:1;align-items:center;min-width:0;display:flex}.signature-node{border:1px solid #0000;border-radius:.8rem;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:.6rem;min-width:0;padding:.8rem .3rem;font-weight:700;display:flex}.signature-node:hover{background:hsl(var(--sig-paper)/.08)}.signature-node[aria-pressed=true]{background:hsl(var(--sig-paper)/.12);border-color:hsl(var(--sig-mint))}.signature-node:focus-visible,.signature-modes button:focus-visible{outline:3px solid hsl(var(--sig-gold));outline-offset:4px}.signature-icon{border:2px dashed hsl(var(--sig-mint)/.8);width:3.7rem;height:3.7rem;color:hsl(var(--sig-gold));border-radius:50%;place-items:center;display:grid}.signature-icon svg{width:1.8rem;height:1.8rem}.signature-arrow{width:1.3rem;color:hsl(var(--sig-mint));flex:none;margin:0 .3rem}.signature-detail{background:hsl(var(--sig-paper));color:hsl(var(--sig-deep));border-radius:.75rem;gap:1.1rem;min-height:13rem;padding:1.5rem;display:flex}.signature-detail-icon{flex:none;width:2rem;height:2rem;margin-top:.2rem}.signature-example{border-top:1px dashed hsl(var(--sig-violet)/.25);margin-top:1rem;padding-top:1rem;font-size:.9rem;line-height:1.65}.signature-footnote{opacity:.88;align-items:flex-start;gap:.5rem;margin-top:1rem;font-size:.8rem;line-height:1.5;display:flex}.signature-footnote svg{flex:none;margin-top:.15rem}.signature-classroom{gap:1.5rem;display:grid}.signature-modes{flex-wrap:wrap;gap:.5rem;display:flex}.signature-modes button{border:1px solid hsl(var(--border));border-radius:.6rem;align-items:center;gap:.5rem;min-height:44px;padding:.65rem 1rem;display:flex}.signature-modes button[aria-pressed=true]{background:hsl(var(--primary));color:hsl(var(--primary-foreground));border-color:hsl(var(--primary))}@media (width>=800px){.signature-intro{grid-template-columns:1.15fr 1fr;gap:3rem}.signature-classroom{grid-template-columns:1fr 1fr;align-items:center;gap:3rem}}@media (width<=580px){.signature-path{flex-wrap:wrap;gap:.5rem;margin:1.3rem 0}.signature-stop{flex:0 0 calc(33.333% - .34rem)}.signature-node{font-size:.78rem}.signature-arrow{display:none}.signature-icon{width:2.8rem;height:2.8rem}.signature-detail{min-height:20rem;padding:1.1rem}.signature-detail-icon{display:none}}@media (forced-colors:active){.signature-board,.signature-node,.signature-detail{border:1px solid canvastext}.signature-node[aria-pressed=true]{outline:2px solid highlight}}
