:root{--live-ok:#18794a;--live-bad:#b3372c;--live-wait:#8a98a1}
#live .live-card{border:1px solid #d7dfe3;border-radius:14px;padding:16px 18px;background:#fff;display:flex;flex-direction:column;gap:8px}
#live .live-card[data-state=live]{border-color:var(--live-ok);background:#f0f9f4}
#live .live-card[data-state=down]{border-color:var(--live-bad);background:#fdf3f1}
#live canvas{width:100%;height:56px;display:block}
#live p{margin:0}
#live .live-now{display:flex;align-items:center;gap:10px;font-size:18px}
#live .dot{width:12px;height:12px;border-radius:50%;background:var(--live-wait);flex:none}
#live [data-state=live] .dot{background:var(--live-ok);animation:livepulse 1.6s ease-out infinite}
#live [data-state=down] .dot{background:var(--live-bad)}
#live .live-server,#live .live-24{font-size:15px}
#live .live-note{font-size:13px;color:#566873}
#live .live-alert{margin-top:6px;display:flex;flex-direction:column;gap:6px}
#live .live-alert[hidden]{display:none}
#live .live-alert label{font-weight:600}
#live .live-alert div{display:flex;flex-wrap:wrap;gap:8px}
#live .live-alert input{flex:1 1 220px;min-width:0;padding:9px 11px;border:1px solid #c4ced3;border-radius:8px;font:inherit}
#live .live-alert button{padding:9px 16px;border:0;border-radius:8px;background:#1d6b5c;color:#fff;font:inherit;font-weight:600;cursor:pointer}
@keyframes livepulse{0%{box-shadow:0 0 0 0 rgba(24,121,74,.45)}100%{box-shadow:0 0 0 12px rgba(24,121,74,0)}}
@media (prefers-reduced-motion:reduce){#live [data-state=live] .dot{animation:none}}
.hub-table td:first-child{min-width:180px}.hub-table .dom{font-size:13px;color:#566873;overflow-wrap:anywhere}
.hub-nav{display:flex;flex-wrap:wrap;gap:8px 14px;margin:10px 0 18px}
.hub-links{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:8px;margin:12px 0 24px}
.hub-links a{display:block;padding:10px 12px;border:1px solid #d7dfe3;border-radius:10px;background:#fff;text-decoration:none}
nav[aria-label=Breadcrumb] a{text-decoration:underline}
