/* A compact type vortex grows from beneath the existing gavel's striking block. */
.gavel-composition { --gavel-span:min(760px,calc(100vw - 32px)); position:relative; width:min(1000px,100%); height:calc(var(--gavel-span)*.5 + 340px); margin:0 auto 20px; isolation:isolate; }
.gavel-composition .gavel-stage { position:absolute; width:var(--gavel-span); left:50%; top:0; transform:translateX(-50%); }
.gavel-words { position:absolute; left:calc(50% - var(--gavel-span)*.055); top:calc(var(--gavel-span)*.5); width:min(620px,calc(100% - 24px - var(--gavel-span)*.11)); height:280px; transform:translateX(-50%); z-index:2; display:flex; align-content:center; align-items:center; justify-content:center; gap:2px 8px; flex-wrap:wrap; }
.outcome-word { min-height:38px; display:flex; align-items:center; justify-content:center; white-space:nowrap; padding:5px 7px; margin:0; border:0; background:none; color:#c4c0b6; font:400 20px/1.2 var(--sans); letter-spacing:-.45px; text-shadow:0 2px 9px #070808; }
button.outcome-word { cursor:pointer; }
.outcome-word[data-face=serif] { font-family:var(--serif); font-size:24px; }
.outcome-word[data-face=italic] { font-family:var(--serif); font-style:italic; color:#d6a47e; font-size:23px; }
.words-orbit-ready .outcome-word { position:absolute; left:50%; top:50%; transform-origin:center; will-change:transform; }
.words-orbit-ready.gavel-words-enabled .gavel-words { visibility:hidden; }
.words-orbit-ready.gavel-words-enabled[data-words-visible=true] .gavel-words { visibility:visible; }
.outcome-text { display:block; position:relative; pointer-events:none; }
.outcome-letter { --wave:0; --spread:0px; display:inline-block; white-space:pre; pointer-events:none; transform:translate(var(--spread),calc(var(--wave)*-5px)) scale(calc(1 + var(--wave)*.3)); transform-origin:50% 80%; filter:brightness(calc(1 + var(--wave)*.35)); }
.outcome-word:is(:hover,:focus-visible,[aria-pressed=true]),.outcome-word[data-active=true] { color:var(--amber); text-shadow:0 0 22px #e8aa7238,0 2px 7px #000; }
.outcome-word:focus-visible { outline:1px solid var(--amber); outline-offset:2px; border-radius:4px; }
.gavel-word-controls { position:absolute; left:calc(var(--gavel-span)*-.055); top:calc(var(--gavel-span)*.5 + 289px); width:100%; text-align:center; z-index:4; }
.gavel-motion-toggle { font:400 10px/1.4 var(--sans); color:#a9aaa3; border:0; border-bottom:1px solid #ffffff25; padding:6px 0; background:none; cursor:pointer; }
.gavel-motion-toggle:hover { color:var(--amber); }
.gavel-motion-toggle:focus-visible { outline:1px solid var(--amber); outline-offset:4px; }
.gavel-motion-toggle[hidden] { display:none; }
.gavel-interlude::before,.gavel-interlude::after { z-index:3; height:50px; }
@media(max-width:720px) {
 .gavel-composition { margin-bottom:12px; }
 .outcome-word { font-size:17px; }
 .outcome-word[data-face=serif] { font-size:21px; }
 .outcome-word[data-face=italic] { font-size:20px; }
 .gavel-interlude::before,.gavel-interlude::after { height:28px; }
}
/* A complete readable composition for motion/data preferences and no JavaScript. */
.gavel-static.gavel-composition { height:auto; padding-bottom:24px; }
.gavel-static .gavel-stage { position:relative; left:auto; transform:none; margin:auto; }
.gavel-static .gavel-words { position:relative; left:calc(var(--gavel-span)*-.055); top:auto; transform:none; height:auto; min-height:240px; margin:-45px auto 0; visibility:visible!important; }
.gavel-static.words-orbit-ready .outcome-word { position:relative; left:auto; top:auto; transform:none!important; opacity:.85!important; pointer-events:auto!important; }
.gavel-static .gavel-word-controls { position:relative; top:auto; margin-top:14px; }
@media(prefers-reduced-motion:reduce) { .outcome-letter { transform:none; filter:none; } }

.gavel-words-enabled:not([data-words-visible=true]) .gavel-word-controls { visibility:hidden; }