/* OptiLink Indexer */
.ix-hero { display: flex; align-items: center; gap: 24px; padding: 22px 24px; border-radius: 22px; color: #fff;
  background: radial-gradient(120% 140% at 0% 0%, #4b3cff 0%, #2b1cf5 45%, #170f8a 100%); box-shadow: 0 30px 60px -30px rgba(43,28,245,.6); overflow: hidden; }
.ix-hero .eyebrow { color: rgba(255,255,255,.7); }
.ix-hero h2 { color: #fff; }
.ix-hero .muted { color: rgba(255,255,255,.78) !important; }
.ix-hero > div:first-child { flex: 1; min-width: 0; }
.ix-orbit { position: relative; width: 110px; height: 110px; flex: none; }
.ix-orbit span { position: absolute; inset: 0; display: grid; place-items: center; font-size: 2rem; }
.ix-orbit i { position: absolute; inset: 0; border-radius: 50%; border: 2px solid rgba(255,255,255,.35); animation: ixPulse 2.4s ease-out infinite; }
.ix-orbit i:nth-child(2) { animation-delay: .8s; } .ix-orbit i:nth-child(3) { animation-delay: 1.6s; }
@keyframes ixPulse { from { transform: scale(.35); opacity: 1; } to { transform: scale(1.15); opacity: 0; } }
@media (max-width: 640px) { .ix-orbit { display: none; } .ix-hero { padding: 18px; } }

.ix-list { margin: 14px 0; max-height: 460px; overflow: auto; border: 1px solid var(--line); border-radius: 14px; }
.ix-row { display: grid; grid-template-columns: 36px minmax(0, 1fr) 160px 120px; gap: 10px; align-items: center; padding: 10px 12px; border-bottom: 1px solid var(--line); transition: background .15s; }
.ix-row:last-child { border-bottom: 0; }
.ix-row.head { position: sticky; top: 0; z-index: 1; background: var(--surface); font-size: .78rem; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); font-weight: 700; }
.ix-row.on { background: color-mix(in srgb, var(--brand, #2b1cf5) 6%, transparent); }
.ix-row input { width: auto; }
.ix-url { min-width: 0; }
.ix-url a { display: block; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ix-url small { display: block; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.badge.df { background: color-mix(in srgb, #0e9f6e 15%, transparent); color: #0e9f6e; }
@media (max-width: 720px) { .ix-row { grid-template-columns: 30px minmax(0, 1fr); } .ix-row > span:nth-child(3), .ix-row > span:nth-child(4) { grid-column: 2; } .ix-row.head > span:nth-child(n+3) { display: none; } }
.ix-empty { padding: 34px 16px; text-align: center; } .ix-empty span { font-size: 2rem; }
.ix-export { display: flex; align-items: center; gap: 4px; flex-wrap: wrap; }

.ix-prog { height: 10px; border-radius: 999px; background: var(--line); overflow: hidden; margin: 14px 0 6px; }
.ix-prog i { display: block; height: 100%; width: 0; border-radius: inherit; background: linear-gradient(90deg, #2b1cf5, #19c39c); transition: width .5s cubic-bezier(.2,.8,.2,1); }
.ix-tiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 8px; margin-top: 14px; }
.ix-tile { display: flex; align-items: center; gap: 8px; padding: 9px 10px; border-radius: 12px; border: 1px solid var(--line); background: var(--surface); font-size: .84rem;
  animation: ixIn .35s both; animation-delay: calc(var(--i) * 12ms); transition: background .25s, border-color .25s, transform .25s; }
.ix-tile .nm { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ix-tile .st { font-weight: 700; font-size: .78rem; }
.ix-tile.s-sending { border-color: var(--brand, #2b1cf5); box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand, #2b1cf5) 15%, transparent); }
.ix-tile.s-sending .st::after { content: ''; display: inline-block; width: 10px; height: 10px; border: 2px solid currentColor; border-right-color: transparent; border-radius: 50%; animation: ixSpin .7s linear infinite; vertical-align: -1px; }
.ix-tile.s-ok { background: color-mix(in srgb, #0e9f6e 12%, var(--surface)); border-color: color-mix(in srgb, #0e9f6e 45%, transparent); transform: translateY(-1px); }
.ix-tile.s-ok .st { color: #0e9f6e; }
.ix-tile.s-fail { opacity: .5; } .ix-tile.s-fail .st { color: var(--muted); font-weight: 600; }
.ix-tile.s-skipped { opacity: .4; }
@keyframes ixIn { from { opacity: 0; transform: translateY(6px) scale(.97); } }
@keyframes ixSpin { to { transform: rotate(360deg); } }
.ix-confirm { display: flex; gap: 14px; align-items: flex-start; margin-top: 16px; padding: 16px; border-radius: 16px; background: color-mix(in srgb, #0e9f6e 10%, var(--surface)); animation: ixIn .5s both; }
.ix-confirm .big { font-size: 1.8rem; }

.ix-hrow { display: flex; align-items: center; gap: 10px; width: 100%; padding: 10px 8px; border: 0; border-bottom: 1px solid var(--line); background: none; text-align: left; font: inherit; color: inherit; cursor: pointer; border-radius: 10px; }
.ix-hrow:hover { background: color-mix(in srgb, var(--brand, #2b1cf5) 5%, transparent); }
.ix-hrow small { display: block; color: var(--muted); }
.ix-hrow .spacer { flex: 1; }
.ix-sgrp h4 { margin: 12px 0 6px; font-size: .9rem; } .ix-sgrp h4 small { color: var(--muted); font-weight: 500; }
.ix-sgrp > div { display: flex; flex-wrap: wrap; gap: 5px; }
.ix-chip { font-size: .74rem; padding: 3px 9px; border-radius: 999px; border: 1px solid var(--line); color: var(--muted); }
.ix-chip.online { border-color: color-mix(in srgb, #0e9f6e 50%, transparent); color: #0e9f6e; }
.ix-chip.resting { text-decoration: line-through; opacity: .6; }
.ix-svc { max-height: 360px; overflow: auto; }
@media (prefers-reduced-motion: reduce) { .ix-orbit i, .ix-tile, .ix-confirm { animation: none; } }
.ix-dots { display: flex; flex-wrap: wrap; gap: 5px; }
.ix-dots i { width: 10px; height: 10px; border-radius: 3px; background: var(--line); transition: background .3s, transform .3s; }
.ix-dots.big i { width: 16px; height: 16px; border-radius: 5px; }
.ix-dots i.on { background: #0e9f6e; transform: scale(1.08); }
.ix-dots i.go { background: var(--brand, #2b1cf5); animation: ixBlink .6s ease-in-out infinite alternate; }
.ix-dots i.off { opacity: .35; }
@keyframes ixBlink { to { opacity: .35; } }