.sv { display: inline-flex; align-items: center; gap: 6px; flex: none; }
.sv button { display: inline-flex; align-items: center; justify-content: center; gap: 5px; height: 32px; border: 1px solid var(--w-line, #dfe5ec); background: var(--w-surface, #fff); border-radius: 999px; cursor: pointer; padding: 0 10px; font: 600 12.5px "Instrument Sans", "InstrumentSans", system-ui, sans-serif; color: var(--w-text2, #4a5566); transition: background .15s, border-color .15s, color .15s; }
.sv .svf { width: 32px; padding: 0; }
.sv svg path { fill: none; stroke: #7a8594; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; transition: fill .15s, stroke .15s; }
.sv .svf:hover { border-color: #f1b8b8; background: var(--w-tint-bad, #fff7f7); } .sv .svf:hover path { stroke: #d93636; }
.sv .svf.on { background: var(--w-tint-bad, #fff1f1); border-color: #f3c2c2; } .sv .svf.on path { fill: #e02d2d; stroke: #e02d2d; }
.sv .svt:hover { border-color: #b8861f; color: var(--w-gold-text, #8a6414); } .sv .svt:hover path { stroke: #8a6414; }
.sv .svt.on { background: var(--w-strong, #0b1019); border-color: var(--w-text, #0b1019); color: var(--w-on-strong, #fff); } .sv .svt.on path { stroke: #e0b457; }
.sv button:active { transform: scale(.94); } .sv button:focus-visible { outline: 2px solid #2f6fb0; outline-offset: 2px; }
.svtoast { position: fixed; left: 50%; bottom: calc(18px + env(safe-area-inset-bottom, 0px)); transform: translate(-50%, 20px); opacity: 0; pointer-events: none; background: var(--w-strong, #0b1019); color: var(--w-on-strong, #fff); font: 14px "Instrument Sans", "InstrumentSans", system-ui, sans-serif; padding: 11px 16px; border-radius: 10px; box-shadow: 0 10px 30px rgba(0,0,0,.2); z-index: 60; transition: opacity .2s, transform .2s; max-width: calc(100% - 32px); }
.svtoast.in { opacity: 1; transform: translate(-50%, 0); pointer-events: auto; } .svtoast a { color: #e0b457; font-weight: 600; }
@media (prefers-reduced-motion: reduce) { .sv button, .svtoast { transition: none; } }

/* 0.9.10: add to pipeline */
.sv .svp { display: inline-flex; align-items: center; gap: 5px; } .sv .svp path, .sv .svp rect { fill: none; stroke: currentColor; stroke-width: 1.8; }
.sv .svp:hover { border-color: #2f6fb0; color: var(--w-link, #1d4f85); }
.sv .svp.on { background: var(--w-tint-info, #eaf2fb); border-color: #9cc0e6; color: var(--w-link, #1d4f85); }
html.nopipe .sv .svp { display: none !important; }
td .sv .svp span { display: none; } td .sv .svp { width: 32px; padding: 0; }