.shortener .input-row{flex-wrap:wrap;gap:4px 8px;padding:8px 10px}.shortener .input-row>input{flex:1;min-width:0}.shorten-slot{--action-pad:17px;--action-vpad:14px;--action-gap:14px;--action-height:51px;position:relative;display:inline-grid;flex:0 0 100%;width:100%;min-width:0;margin-top:2px;font:700 13px/1.3 var(--sans);vertical-align:middle}.shorten-measure{display:flex;align-items:center;gap:var(--action-gap);visibility:hidden;padding:var(--action-vpad) var(--action-pad);min-height:var(--action-height);border:1px solid transparent;white-space:nowrap;pointer-events:none}.shorten-measure::after{content:'';display:block;width:18px;height:18px;flex-shrink:0}.input-row .shorten-button{position:absolute;inset-block:0;right:0;width:100%;height:100%;min-height:0;margin:0;padding:0;overflow:hidden;transform:none;gap:0;transition:width .64s cubic-bezier(.68,0,.2,1),background .18s,box-shadow .18s}.input-row .shorten-button:hover{transform:none;box-shadow:0 0 0 3px #f18c4826}.shorten-label{position:absolute;left:var(--action-pad);top:50%;transform:translateY(-50%);white-space:nowrap;pointer-events:none;transition:opacity .18s .25s,transform .34s .12s cubic-bezier(.2,.65,.3,1)}.input-row .shorten-button>.icon{position:absolute;right:var(--action-pad);top:50%;transform:translateY(-50%);width:18px;height:18px;pointer-events:none}.shorten-slot.is-shortened .shorten-button{width:calc(var(--action-pad) * 2 + 20px)}.shorten-slot.is-shortened .shorten-label{opacity:0;transform:translate(10px,-50%);transition:opacity .12s,transform .25s}@media(max-width:1180px){.shorten-slot{--action-pad:12px;--action-gap:8px}}@media(min-width:761px) and (max-width:980px){.shorten-slot{--action-pad:15px;--action-vpad:10px;--action-height:44px}}@media(max-width:760px){.shorten-slot{--action-pad:13px;--action-vpad:12px;--action-gap:9px;--action-height:49px}}@media(max-width:390px){.shorten-slot{font-size:11px;--action-pad:12px;--action-vpad:11px}}@media(prefers-reduced-motion:no-preference){.button:not(.shorten-button)>.icon,.text-link>.icon,.try-case>.icon{transition:transform .22s ease}.button:not(.shorten-button):is(:hover,:focus-visible)>.icon,.text-link:is(:hover,:focus-visible)>.icon,.try-case:is(:hover,:focus-visible)>.icon{transform:translateX(3px)}.case-tabs button,.preview-tabs button{transition:background .18s,color .18s,transform .2s}.case-tabs button:hover,.preview-tabs button:hover{transform:translateY(-2px)}.promise-strip .zero{transition:transform .3s ease}.promise-strip p:hover .zero{transform:translateY(-2px) rotate(-6deg)}}.motion-toggle{display:inline-flex;align-items:center;gap:7px;min-height:44px;padding:5px 2px;background:0 0;color:var(--muted);font-size:10px;border-radius:5px}.motion-toggle .icon{width:13px;height:13px}.motion-toggle:hover{color:var(--ink)}.motion-toggle:disabled{opacity:1;cursor:default}:root[data-motion=paused]{scroll-behavior:auto}:root[data-motion=paused] *,:root[data-motion=paused] ::after,:root[data-motion=paused] ::before{animation:none!important;transition:none!important}:root[data-motion=paused] .back-top:hover,:root[data-motion=paused] .button:hover,:root[data-motion=paused] .button:not(.shorten-button)>.icon,:root[data-motion=paused] .case-tabs button,:root[data-motion=paused] .preview-tabs button,:root[data-motion=paused] .promise-strip .zero,:root[data-motion=paused] .text-link>.icon,:root[data-motion=paused] .tool>.icon,:root[data-motion=paused] .try-case>.icon{transform:none}@media(prefers-reduced-motion:reduce){.tool:is(:hover,:focus-within)>.icon{transform:none}}@media print{.motion-toggle{display:none}}