.showcase-controls{display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:.55rem;margin:0 0 1.25rem}.showcase-controls[hidden]{display:none}.showcase-controls button{min-height:44px;padding:.65rem 1rem;border:1px solid var(--line);background:var(--sheet);color:var(--ink);font:inherit;font-size:.8rem;cursor:pointer}.showcase-controls button:hover{border-color:var(--accent)}.showcase-count{margin-inline-end:auto;font-variant-numeric:tabular-nums;letter-spacing:.14em;font-size:.85rem}
[data-showcase=true] .examples-sequence{display:grid;grid-template-columns:minmax(0,1fr);gap:0;border:1px solid var(--line);background:linear-gradient(120deg,var(--sheet),var(--paper));padding:clamp(1.1rem,3vw,3rem)}
[data-showcase=true] .example-pair{display:none;border:0;padding:0}
[data-showcase=true] .example-pair[data-current=true]{display:block;animation:case-enter .45s ease both}
@keyframes case-enter{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
[data-showcase=true] .example-pair:after{display:none}[data-showcase=true] .example-pair>header{font-size:.8rem;gap:1rem}[data-showcase=true] .example-languages{font-size:.75rem}
[data-showcase=true] .pair-text{padding-top:2rem;gap:clamp(1rem,3vw,3rem)}[data-showcase=true] .pair-text p{font-size:clamp(1.05rem,1.35vw,1.4rem);line-height:1.65;hyphens:none;overflow-wrap:break-word}[data-showcase=true] .pair-label{font-size:.72rem;color:var(--accent)}
[data-motion-allowed=false] .example-pair,[data-mode=low] .example-pair,[data-motion=reduce] .example-pair{animation:none!important}
@media(prefers-reduced-motion:reduce){[data-showcase=true] .example-pair{animation:none!important}}
@media(max-width:620px){.showcase-controls{justify-content:flex-start}.showcase-count{flex:1 0 100%}[data-showcase=true] .pair-text{padding-top:1.25rem}[data-showcase=true] .pair-text>div+div{border-top:1px solid var(--line);padding-top:1.25rem}}
.example-languages{white-space:normal;overflow-wrap:anywhere}
.example-jump{display:flex;align-items:center;flex-wrap:wrap;gap:.5rem;font-size:.78rem;max-width:100%;min-width:0}.example-jump select{max-width:100%;width:min(23rem,100%);min-width:0;min-height:44px;padding:.55rem;background:var(--sheet);color:var(--ink);border:1px solid var(--line);font:inherit}.example-origin{font-size:.8rem;line-height:1.6;color:var(--muted);max-width:85ch}.pair-text h4{font-size:1rem;line-height:1.4;margin:.8rem 0;overflow-wrap:anywhere}
.document-comparison{width:100%;table-layout:fixed;border-collapse:collapse;margin-top:1.5rem;text-align:start}
.document-comparison th{width:50%;text-align:start;padding:.85rem 1rem;background:var(--ink);color:var(--paper);font-size:.78rem;font-weight:600}
.document-comparison td{vertical-align:top;border:1px solid var(--line);padding:1rem}
.document-comparison tr:nth-child(even){background:color-mix(in srgb,var(--wash) 55%,transparent)}
.document-comparison p{font-size:.92rem;line-height:1.65;margin:0;overflow-wrap:anywhere}
.document-comparison small{display:block;margin-top:.55rem;font-size:.68rem;color:var(--muted)}
.mobile-pair-label{display:none}
@media(max-width:620px){.mobile-pair-label{display:block;font-size:.72rem;font-weight:600;color:var(--accent);margin-bottom:.6rem}}
.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
@media(max-width:620px){.document-comparison{table-layout:auto}.document-comparison thead{position:absolute;clip-path:inset(50%);width:1px;height:1px;overflow:hidden}.document-comparison tr{display:grid;margin-bottom:1rem;border:1px solid var(--line)}.document-comparison td{display:block;border:0;padding:.85rem}.document-comparison td+td{border-top:1px solid var(--line);background:color-mix(in srgb,var(--wash) 60%,transparent)}}
.example-topic{padding-top:1.4rem}.example-topic h3{font-size:clamp(1.15rem,1.7vw,1.65rem);line-height:1.35;margin:.45rem 0 0;text-wrap:balance}
.example-decision{border-top:1px solid var(--line);padding-top:1rem;margin-top:1.5rem;max-width:80ch}.example-decision p{font-size:.9rem;line-height:1.65;margin:.5rem 0 0;color:var(--muted)}
@media print{.showcase-controls{display:none!important}[data-showcase=true] .examples-sequence{display:block;padding:0}[data-showcase=true] .example-pair{display:block;animation:none;padding:1rem 0;break-inside:avoid}}
