/* ticket-skeleton.css — the trade ticket's loading shape, as real markup (the SVG twin lives at
   the design notes (ticket-skeleton.svg) and is only for the spec). Blocks are .mk-shimmer from
   /motion-kit.css, so there is exactly one sheen definition on the site.
   Markup:
     <div class="tk-sk" aria-busy="true" aria-label="loading the ticket">
       <div class="tk-sk-seg"><i class="mk-shimmer"></i><i class="mk-shimmer"></i></div>
       <div class="tk-sk-field"><i class="mk-shimmer lbl"></i><i class="mk-shimmer box"></i></div>
       <div class="tk-sk-pre"><i class="mk-shimmer"></i><i class="mk-shimmer"></i><i class="mk-shimmer"></i><i class="mk-shimmer"></i></div>
       <div class="tk-sk-grid"><span><i class="mk-shimmer k"></i><i class="mk-shimmer v"></i></span> …×4</div>
       <i class="mk-shimmer tk-sk-go"></i>
     </div>
   When the data lands, swap the markup and put .mk-ready on the container (or call MK.ready(el)) — the real
   ticket fades up over the blocks in .24 s, so the swap reads as one motion rather than a flicker. */
.tk-sk{border:1px solid var(--line,#1f1f23);border-radius:16px;background:var(--panel,#0e0e10);overflow:hidden}
.tk-sk i{display:block}
.tk-sk-seg{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:16px;border-bottom:1px solid var(--hairline,#17171a)}
.tk-sk-seg i{height:34px;border-radius:8px}
.tk-sk-field{padding:14px 16px 0}
.tk-sk-field .lbl{height:12px;width:58px;border-radius:4px;margin-bottom:8px}
.tk-sk-field .box{height:46px;border-radius:10px}
.tk-sk-pre{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;padding:12px 16px 14px}
.tk-sk-pre i{height:28px;border-radius:999px}
.tk-sk-grid{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--hairline,#17171a)}
.tk-sk-grid>span{padding:12px 10px;border-right:1px solid var(--hairline,#17171a);display:flex;flex-direction:column;gap:6px}
.tk-sk-grid>span:last-child{border-right:0}
.tk-sk-grid .k{height:9px;width:34px;border-radius:3px}
.tk-sk-grid .v{height:13px;width:70%;border-radius:4px}
.tk-sk-go{height:44px;border-radius:999px;margin:14px}
/* the extension side panel is narrower: presets and metrics fall to two columns */
@media (max-width:400px){.tk-sk-pre,.tk-sk-grid{grid-template-columns:1fr 1fr}.tk-sk-grid>span:nth-child(2n){border-right:0}}
