/* Conduit Wallet — Live Stream (2026-10-19) */
.sv-lock, .sv-lock body { overflow: hidden; }
.sv { position: fixed; inset: 0; z-index: 9100; background: radial-gradient(1200px 700px at 50% -10%, rgba(43,255,122,.12), transparent 60%), rgba(2,6,4,.86);
  backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); display: flex; justify-content: center; padding: 18px; color: #DFF7E8; font-family: 'JetBrains Mono', ui-monospace, monospace; }
.sv[hidden] { display: none; }
.sv-box { width: min(1200px, 100%); display: flex; flex-direction: column; gap: 12px; min-height: 0; }
.sv-sp { flex: 1; }

/* header */
.sv-top { display: flex; align-items: center; gap: 14px; padding: 14px 16px; border: 1px solid rgba(43,255,122,.35); border-radius: 14px;
  background: linear-gradient(135deg, rgba(13,23,18,.95), rgba(6,14,10,.95)); box-shadow: 0 0 30px rgba(43,255,122,.12), inset 0 0 40px rgba(43,255,122,.05); }
.sv-orb { position: relative; width: 54px; height: 54px; flex: none; display: grid; place-items: center; }
.sv-orb span { font-size: 26px; color: #2BFF7A; text-shadow: 0 0 12px #2BFF7A, 0 0 28px rgba(43,255,122,.7); z-index: 1; }
.sv-orb i { position: absolute; inset: 0; border-radius: 50%; border: 2px solid rgba(43,255,122,.55); animation: sv-ring 2.4s cubic-bezier(.2,.6,.3,1) infinite; }
.sv-orb i:nth-child(2) { animation-delay: .8s; } .sv-orb i:nth-child(3) { animation-delay: 1.6s; }
@keyframes sv-ring { from { transform: scale(.35); opacity: 1; } to { transform: scale(1.35); opacity: 0; } }
.sv-title h2 { margin: 0; font: 700 22px/1 'Chakra Petch', sans-serif; letter-spacing: .14em; color: #fff; }
.sv-title h2 em { font-style: normal; color: #2BFF7A; text-shadow: 0 0 14px rgba(43,255,122,.8); }
.sv-title div { font-size: 12px; color: #8FB7A0; margin-top: 6px; }
.sv-status.ok { color: #2BFF7A; } .sv-status.warn { color: #FFC24D; } .sv-status.bad { color: #FF5A6E; }
.sv-status.ok::before { content: "● "; animation: sv-blink 1.2s infinite; }
@keyframes sv-blink { 50% { opacity: .25; } }
.sv-chain { display: flex; gap: 3px; align-items: center; max-width: 220px; overflow: hidden; }
.sv-link { width: 6px; height: 14px; border-radius: 2px; background: #2BFF7A; box-shadow: 0 0 8px #2BFF7A; opacity: .9; animation: sv-pop .6s ease-out; flex: none; }
.sv-link:nth-child(n+4) { opacity: .45; box-shadow: none; } .sv-link:nth-child(n+10) { opacity: .2; }
@keyframes sv-pop { from { transform: scaleY(0); } to { transform: scaleY(1); } }
.sv-btn, .sv-x, .sv-chip { font: inherit; font-size: 12px; color: #DFF7E8; background: rgba(43,255,122,.06); border: 1px solid rgba(43,255,122,.35); border-radius: 999px; padding: 6px 12px; cursor: pointer; }
.sv-btn:hover, .sv-chip:hover { background: rgba(43,255,122,.16); }
.sv-x { width: 34px; height: 34px; padding: 0; font-size: 15px; border-color: rgba(255,90,110,.5); color: #FF8A98; }

/* tiles */
.sv-tiles { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 10px; }
.sv-tile { display: grid; grid-template-columns: 34px minmax(0, 1fr); column-gap: 10px; row-gap: 8px; align-items: center; padding: 12px; border-radius: 12px; border: 1px solid rgba(255,255,255,.07); background: linear-gradient(160deg, rgba(20,34,27,.92), rgba(9,17,13,.92)); min-width: 0; }
.sv-tile > div { min-width: 0; } .sv-tile b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sv-ti { width: 34px; height: 34px; flex: none; display: grid; place-items: center; border-radius: 9px; font-size: 17px; background: rgba(43,255,122,.1); border: 1px solid rgba(43,255,122,.3); }
.sv-tile b { display: block; font: 700 20px/1.1 'Chakra Petch', sans-serif; color: #fff; font-variant-numeric: tabular-nums; }
.sv-tile small { color: #7FA38E; font-size: 10.5px; text-transform: uppercase; letter-spacing: .08em; }
.sv-tile.big { border-color: rgba(43,255,122,.55); box-shadow: 0 0 24px rgba(43,255,122,.18); }
.sv-tile.big b { font-size: 28px; color: #2BFF7A; text-shadow: 0 0 14px rgba(43,255,122,.6); }
.sv-tile.warn .sv-ti { background: rgba(255,90,110,.1); border-color: rgba(255,90,110,.4); color: #FF5A6E; }
.sv-tile.ledger b { font-size: 16px; }
.sv-closetrack { grid-column: 1 / -1; height: 4px; border-radius: 9px; background: rgba(255,255,255,.08); overflow: hidden; }
.sv-closebar { display: block; height: 100%; width: 0; background: linear-gradient(90deg, #1E9E57, #2BFF7A); box-shadow: 0 0 10px #2BFF7A; }
.sv-closetxt { grid-column: 1 / -1; margin-top: -4px; }

/* graph */
.sv-graph { position: relative; height: 70px; border-radius: 12px; border: 1px solid rgba(255,255,255,.07); background: rgba(6,12,9,.85); padding: 6px 10px; }
.sv-graph small { position: absolute; left: 12px; top: 6px; color: #5E826D; font-size: 10px; letter-spacing: .08em; text-transform: uppercase; }
.sv-bars { width: 100%; height: 100%; display: block; }

/* filter bar */
.sv-bar { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.sv-chip.on { background: #2BFF7A; color: #04140A; border-color: #2BFF7A; font-weight: 700; box-shadow: 0 0 14px rgba(43,255,122,.5); }
.sv-legend { color: #5E826D; font-size: 11px; }

/* list */
.sv-list { flex: 1; min-height: 0; overflow-y: auto; display: flex; flex-direction: column; gap: 10px; padding-right: 4px; scrollbar-color: rgba(43,255,122,.35) transparent; }
.sv-empty { padding: 40px; text-align: center; color: #7FA38E; border: 1px dashed rgba(43,255,122,.3); border-radius: 12px; }
.sv-group { border-radius: 12px; border: 1px solid rgba(255,194,77,.45); background: linear-gradient(180deg, rgba(26,22,10,.65), rgba(10,14,11,.9)); overflow: hidden; animation: sv-in .35s ease-out; flex: none; }
.sv-group.is-ok { border-color: rgba(43,255,122,.4); background: linear-gradient(180deg, rgba(14,34,22,.75), rgba(9,15,12,.92)); }
.sv-group.is-bad { border-color: rgba(255,90,110,.5); }
.sv-group.single { border-style: dashed; }
@keyframes sv-in { from { opacity: 0; transform: translateY(-10px) scale(.98); } to { opacity: 1; transform: none; } }
.sv-ghead { display: flex; align-items: center; gap: 10px; padding: 9px 12px; background: rgba(255,255,255,.03); border-bottom: 1px solid rgba(255,255,255,.06); font-size: 12px; }
.sv-gico { width: 26px; height: 26px; display: grid; place-items: center; border-radius: 7px; font-size: 16px; color: #FFC24D; background: rgba(255,194,77,.12); border: 1px solid rgba(255,194,77,.4); }
.sv-group.is-ok .sv-gico { color: #2BFF7A; background: rgba(43,255,122,.12); border-color: rgba(43,255,122,.4); }
.sv-group:not(.is-ok):not(.is-bad) .sv-gico { animation: sv-spin 1.6s linear infinite; }
@keyframes sv-spin { to { transform: rotate(360deg); } }
.sv-ghead b { letter-spacing: .12em; color: #fff; }
.sv-count { color: #BFE6CD; } .sv-gmeta { color: #6F947F; font-size: 11px; }
.sv-clock { color: #FFC24D; font-variant-numeric: tabular-nums; min-width: 44px; text-align: right; }
.sv-group.is-ok .sv-clock { color: #7FA38E; }
.sv-pill { font-size: 10.5px; font-weight: 700; letter-spacing: .1em; padding: 3px 10px; border-radius: 999px; }
.sv-pill.flight { color: #1A1300; background: #FFC24D; box-shadow: 0 0 12px rgba(255,194,77,.6); animation: sv-blink 1s infinite; }
.sv-pill.ok { color: #04140A; background: #2BFF7A; box-shadow: 0 0 12px rgba(43,255,122,.6); }
.sv-pill.bad { color: #fff; background: #D9364B; }

.sv-rows { display: flex; flex-direction: column; }
.sv-row { display: grid; grid-template-columns: 28px 76px minmax(70px, 1.2fr) minmax(90px, 1fr) minmax(90px, 1fr) minmax(150px, 1.3fr); gap: 10px; align-items: center; padding: 7px 12px; font-size: 13px; border-top: 1px solid rgba(255,255,255,.035); position: relative; }
.sv-row::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: #FFC24D; opacity: .7; }
.sv-row.is-ok::before { background: #2BFF7A; } .sv-row.is-bad::before { background: #FF5A6E; }
.sv-ico { width: 26px; height: 26px; border-radius: 50%; object-fit: cover; background: #10261A; box-shadow: 0 0 0 1px rgba(43,255,122,.3); }
.sv-ico-sym, .sv-ico.bc-ico-txt { display: grid; place-items: center; font-size: 11px; font-weight: 700; color: #2BFF7A; }
.sv-side { font-size: 10.5px; font-weight: 700; letter-spacing: .1em; text-align: center; padding: 3px 0; border-radius: 6px; }
.sv-side.buy { color: #04140A; background: #2BFF7A; } .sv-side.sell { color: #fff; background: #FF5A6E; }
.sv-side.line { color: #9CC8FF; background: rgba(77,163,255,.15); border: 1px solid rgba(77,163,255,.4); }
.sv-side.fee { color: #FFC24D; background: rgba(255,194,77,.12); border: 1px solid rgba(255,194,77,.35); }
.sv-side.send, .sv-side.recv, .sv-side.pay, .sv-side.other { color: #DFF7E8; background: rgba(255,255,255,.08); }
.sv-name { font-weight: 700; color: #fff; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sv-xrp { color: #FF8A98; font-variant-numeric: tabular-nums; } .sv-tok { color: #2BFF7A; font-variant-numeric: tabular-nums; }
.sv-st { font-size: 12px; text-align: right; } .sv-st.flight { color: #FFC24D; } .sv-st.ok { color: #2BFF7A; } .sv-st.bad { color: #FF5A6E; }
.sv-flash { animation: sv-flash .9s ease-out; }
@keyframes sv-flash { from { background-color: rgba(43,255,122,.28); } to { background-color: transparent; } }

/* the button that opens it */
.stream-btn { position: relative; padding-left: 26px !important; color: #04140A !important; background: #2BFF7A !important; border-color: #2BFF7A !important; font-weight: 700; box-shadow: 0 0 16px rgba(43,255,122,.45); }
.stream-btn::before { content: ""; position: absolute; left: 10px; top: 50%; width: 8px; height: 8px; margin-top: -4px; border-radius: 50%; background: #04140A; box-shadow: 0 0 0 0 rgba(4,20,10,.6); animation: sv-dot 1.4s infinite; }
@keyframes sv-dot { 0% { box-shadow: 0 0 0 0 rgba(4,20,10,.6); } 100% { box-shadow: 0 0 0 8px rgba(4,20,10,0); } }

@media (max-width: 900px) { .sv-tiles { grid-template-columns: repeat(3, minmax(0, 1fr)); } .sv-chain { display: none; } }
@media (max-width: 640px) {
  .sv { padding: 8px; } .sv-box { gap: 8px; } .sv-legend { display: none; }
  .sv-tiles { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
  .sv-tile { grid-template-columns: minmax(0, 1fr); padding: 8px; row-gap: 4px; } .sv-ti { display: none; }
  .sv-tile b { font-size: 16px; } .sv-tile.big b { font-size: 20px; } .sv-tile small { font-size: 9px; letter-spacing: .04em; }
  .sv-graph { height: 52px; } .sv-orb { width: 40px; height: 40px; } .sv-top { padding: 10px; gap: 10px; }
  .sv-ghead { flex-wrap: wrap; gap: 6px; padding: 8px 10px; } .sv-gmeta { display: none; } .sv-pill { font-size: 9.5px; padding: 2px 8px; }
  .sv-row { grid-template-columns: 24px 54px 1fr 1fr; } .sv-row .sv-xrp { display: none; } .sv-st { grid-column: 3 / -1; text-align: left; }
  .sv-top { flex-wrap: wrap; } .sv-title h2 { font-size: 18px; }
}
@media (prefers-reduced-motion: reduce) { .sv *, .sv *::before { animation: none !important; } }

/* line race (2026-10-19) */
.sv-row { overflow: hidden; }
.sv-lane { position: absolute; left: 0; bottom: 0; height: 2px; width: 0; background: linear-gradient(90deg, rgba(255,194,77,.15), #FFC24D); box-shadow: 0 0 8px rgba(255,194,77,.7); transition: width .25s linear; }
.sv-lane::after { content: ""; position: absolute; right: -3px; top: -2px; width: 6px; height: 6px; border-radius: 50%; background: #FFE9B0; box-shadow: 0 0 10px #FFC24D; }
.sv-lane.ok { background: linear-gradient(90deg, rgba(43,255,122,.1), #2BFF7A); box-shadow: 0 0 10px rgba(43,255,122,.8); transition: width .35s cubic-bezier(.2,.9,.3,1.2); }
.sv-lane.ok::after, .sv-lane.bad::after { display: none; }
.sv-lane.bad { background: #FF5A6E; }
.sv-enter { animation: sv-race-in .45s cubic-bezier(.2,.9,.3,1.15) both; }
@keyframes sv-race-in { from { opacity: 0; transform: translateX(-40px); } to { opacity: 1; transform: none; } }
.sv-row.is-ok .sv-st { text-shadow: 0 0 10px rgba(43,255,122,.5); }

/* dropped Batches (2026-10-19) */
.sv-pill.drop { color: #DCE6E0; background: #4A5A52; }
.sv-group.is-drop { border-color: rgba(160,180,170,.35); background: linear-gradient(180deg, rgba(30,36,33,.7), rgba(12,15,13,.9)); opacity: .7; }
.sv-group.is-drop .sv-gico { animation: none; color: #9FB3A8; background: rgba(160,180,170,.1); border-color: rgba(160,180,170,.3); }
.sv-st.drop { color: #9FB3A8; } .sv-lane.drop { background: #5A6B62; box-shadow: none; } .sv-lane.drop::after { display: none; }
.sv-row.is-drop::before { background: #5A6B62; }

.sv-beat { color: #5E826D; }

/* rounds of singles (2026-10-19) */
.sv-group.round { border-color: rgba(77,163,255,.45); background: linear-gradient(180deg, rgba(10,22,34,.7), rgba(9,13,16,.92)); }
.sv-group.round .sv-gico { color: #4DA3FF; background: rgba(77,163,255,.12); border-color: rgba(77,163,255,.4); animation: none; }
.sv-group.round.is-ok { border-color: rgba(43,255,122,.4); }

/* 14:25: busy runs — older cards fold to their header (click to open), newest rows land on top */
.sv-group.folded .sv-rows { display: none; }
.sv-group.folded .sv-ghead { border-bottom: 0; }
.sv-ghead { cursor: pointer; user-select: none; }

/* big red stop (2026-10-20) */
.sv-stop { font: 800 15px/1 ui-monospace, "JetBrains Mono", Menlo, monospace; letter-spacing: .1em; color: #fff; background: #E0262E; border: 2px solid #FF5C5C; border-radius: 10px; padding: 12px 20px; cursor: pointer; box-shadow: 0 0 16px rgba(255,59,59,.45); }
.sv-stop:hover { background: #FF3B3B; } .sv-stop:active { transform: translateY(1px); }
@media (max-width: 640px) { .sv-stop { order: -1; width: 100%; padding: 14px; } }
