/* Softparts · Dohľadateľnosť každého kusu — animovaná karta */
@font-face{font-family:'Plus Jakarta Sans';src:url(fonts/plus-jakarta-sans-latin-ext-400-normal.woff2) format('woff2');font-weight:400;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Plus Jakarta Sans';src:url(fonts/plus-jakarta-sans-latin-ext-500-normal.woff2) format('woff2');font-weight:500;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Plus Jakarta Sans';src:url(fonts/plus-jakarta-sans-latin-ext-600-normal.woff2) format('woff2');font-weight:600;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Plus Jakarta Sans';src:url(fonts/plus-jakarta-sans-latin-400-normal.woff2) format('woff2');font-weight:400}
@font-face{font-family:'Plus Jakarta Sans';src:url(fonts/plus-jakarta-sans-latin-500-normal.woff2) format('woff2');font-weight:500}
@font-face{font-family:'Plus Jakarta Sans';src:url(fonts/plus-jakarta-sans-latin-600-normal.woff2) format('woff2');font-weight:600}
@font-face{font-family:'JetBrains Mono';src:url(fonts/jetbrains-mono-latin-ext-500-normal.woff2) format('woff2');font-weight:500;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'JetBrains Mono';src:url(fonts/jetbrains-mono-latin-500-normal.woff2) format('woff2');font-weight:500}

.spt{position:relative;width:100%;aspect-ratio:2/1;overflow:hidden;background:#F4F4F5;container-type:inline-size}
.spt *{box-sizing:border-box;margin:0;padding:0}
.spt-stage{position:absolute;left:0;top:0;width:800px;height:400px;transform-origin:0 0;font-family:'Plus Jakarta Sans',system-ui,sans-serif;color:#0A0B0D;-webkit-font-smoothing:antialiased}
.spt canvas{position:absolute;inset:0;width:800px;height:400px;display:block}

/* thread + anchor */
.spt-thread{position:absolute;width:2px;margin-left:-1px;background:linear-gradient(to top,rgba(61,123,255,.35),#3D7BFF 35%,#8FB3FF);box-shadow:0 0 8px rgba(61,123,255,.85),0 0 22px rgba(61,123,255,.45);transform-origin:50% 100%;border-radius:2px}
.spt-dot{position:absolute;width:10px;height:10px;margin:-5px 0 0 -5px;border-radius:50%;background:#3D7BFF;box-shadow:0 0 0 4px rgba(61,123,255,.22),0 0 18px rgba(61,123,255,.9)}
.spt-dot::after{content:"";position:absolute;inset:-4px;border-radius:50%;border:1.5px solid rgba(61,123,255,.55);transform:scale(var(--ring,1));opacity:var(--ringo,0)}
.spt-ln{position:absolute;height:1.5px;margin-top:-.75px;background:#3D7BFF;transform-origin:0 50%}

/* card */
.spt-card{position:absolute;width:252px;padding:10px 12px;border-radius:16px;overflow:hidden;
  background:rgba(255,255,255,.66);backdrop-filter:blur(14px) saturate(1.25);-webkit-backdrop-filter:blur(14px) saturate(1.25);
  border:1px solid rgba(255,255,255,.8);box-shadow:0 20px 40px -18px rgba(20,30,60,.42),0 1px 0 rgba(255,255,255,.8) inset}
.spt-s{display:flex;align-items:center;gap:7px;height:24px;padding:0 9px;border-radius:9px;background:rgba(10,11,13,.06);font:500 10.5px/1 'JetBrains Mono',ui-monospace,monospace;color:#2A2E36;white-space:nowrap}
.spt-s .q{min-width:0}
.spt-s .q::after{content:"";display:inline-block;width:1px;height:11px;margin-left:1px;vertical-align:-1px;background:#3D7BFF;opacity:var(--caret,0)}
.spt-s .ph{color:#8A93A6}
.spt-s .st{margin-left:auto;display:flex;align-items:center;gap:5px;font:600 9px/1 'JetBrains Mono',ui-monospace,monospace;color:#3D7BFF;letter-spacing:.02em}
.spt-s .sp{width:9px;height:9px;border-radius:50%;border:1.5px solid rgba(61,123,255,.25);border-top-color:#3D7BFF}
.spt-rows{overflow:hidden}
.spt-r{display:grid;grid-template-columns:16px 1fr auto;gap:8px;align-items:center;height:27px;padding:0 1px;border-top:1px solid rgba(10,11,13,.08);font-size:10.5px;color:#56607A;white-space:nowrap}
.spt-r:first-child{border-top:0;margin-top:6px}
.spt-r b{font:500 10px/1 'JetBrains Mono',ui-monospace,monospace;color:#0A0B0D}
.spt-r svg{color:#3D7BFF}
.spt-ok{display:inline-flex;align-items:center;gap:5px;font:600 9.5px/1 'Plus Jakarta Sans',sans-serif;color:#12884F;background:rgba(18,136,79,.1);padding:4px 7px;border-radius:999px}
.spt-ok i{width:5px;height:5px;border-radius:50%;background:currentColor}
.spt-video{position:absolute;inset:0;width:800px;height:400px;object-fit:cover;display:block;background:#D3D4D6}
