/* v11.2.4 — Primary Provider Reactive Intelligence Network */
.provider-network{text-align:center;overflow:hidden;position:relative}
.provider-network h3{text-align:left}
.provider-visual{width:118px;height:92px;margin:7px auto 2px;position:relative;display:grid;place-items:center}
.provider-mark{position:relative;width:58px;height:58px;border:1px solid #28d9f066;border-radius:18px;display:grid;place-items:center;background:radial-gradient(circle,#0a3248,#03111d 70%);box-shadow:0 0 22px #1adcf033,inset 0 0 22px #19c9ef18;transition:.35s}
.provider-mark span,.provider-mark i,.provider-mark b{position:absolute;display:block;box-sizing:border-box}
.provider-orbit{position:absolute;border:1px solid #28d9f044;border-radius:50%;inset:8px;animation:providerSpin 8s linear infinite}
.provider-orbit.po2{inset:18px;border-style:dashed;border-color:#d9b54755;animation-direction:reverse;animation-duration:5.5s}
.provider-pulse{position:absolute;width:5px;height:5px;border-radius:50%;background:#31e4ff;box-shadow:0 0 14px #31e4ff;right:15px;top:45px;animation:providerPulse 1.4s ease-in-out infinite}
.provider-network>strong{display:block;font:700 8px/1.2 Arial;letter-spacing:1.7px;color:#e7fbff;margin-top:1px;text-transform:uppercase}
.provider-network>small{display:block;margin-top:5px!important;font-size:6px!important;letter-spacing:1px;color:#68bfd1!important}
.provider-dot{display:inline-block;width:4px;height:4px;border-radius:50%;background:#4ff2d2;box-shadow:0 0 8px #4ff2d2;margin-right:4px}

/* Abstract provider silhouettes — intentionally compact, monochrome holographic interpretations */
.provider-network[data-provider*="openrouter"] .provider-mark{border-radius:50%}
.provider-network[data-provider*="openrouter"] .provider-mark:before,
.provider-network[data-provider*="openrouter"] .provider-mark:after{content:"";position:absolute;width:33px;height:13px;border-top:3px solid #d9b547;border-bottom:3px solid #d9b547;transform:skewX(-28deg)}
.provider-network[data-provider*="openrouter"] .provider-mark:before{left:9px;top:15px}
.provider-network[data-provider*="openrouter"] .provider-mark:after{right:9px;bottom:15px;transform:skewX(-28deg) rotate(180deg)}

.provider-network[data-provider*="openai"] .provider-mark span{width:34px;height:34px;border:3px solid #7ff5e0;border-radius:45% 55% 45% 55%;transform:rotate(30deg)}
.provider-network[data-provider*="openai"] .provider-mark i{width:25px;height:25px;border:3px solid #7ff5e0;border-radius:50%;transform:rotate(-30deg)}

.provider-network[data-provider*="anthropic"] .provider-mark:before{content:"A";font:700 36px/1 Georgia;color:#e6c266;text-shadow:0 0 12px #e6c266}

.provider-network[data-provider*="gemini"] .provider-mark:before{content:"✦";font-size:39px;color:#71d9ff;text-shadow:0 0 12px #71d9ff}

.provider-network[data-provider*="nvidia"] .provider-mark:before{content:"◉";font-size:37px;color:#8ee65d;text-shadow:0 0 13px #8ee65d}
.provider-network[data-provider*="nvidia"] .provider-mark:after{content:"";position:absolute;width:31px;height:20px;border:3px solid #8ee65d;border-radius:50% 10% 50% 10%;transform:rotate(-12deg)}

.provider-network[data-provider*="deepseek"] .provider-mark:before{content:"⌁";font:700 43px/1 Arial;color:#5f9dff;text-shadow:0 0 13px #5f9dff;transform:rotate(-12deg)}

.provider-network[data-provider*="xai"] .provider-mark:before,
.provider-network[data-provider="x"] .provider-mark:before{content:"X";font:700 35px/1 Arial;color:#e8faff;text-shadow:0 0 12px #b9efff}

.provider-network[data-provider*="ollama"] .provider-mark:before{content:"◠";font:700 38px/1 Arial;color:#e8faff;transform:rotate(90deg);text-shadow:0 0 10px #c8f5ff}
.provider-network[data-provider*="ollama"] .provider-mark:after{content:"LOCAL";position:absolute;bottom:5px;font:5px monospace;letter-spacing:1px;color:#7ddced}

.provider-network[data-provider*="custom"] .provider-mark:before,
.provider-network[data-provider=""] .provider-mark:before{content:"AI";font:700 22px/1 Arial;letter-spacing:2px;color:#d9b547;text-shadow:0 0 12px #d9b547}

.provider-network.provider-changing .provider-mark{transform:scale(.82) rotate(12deg);opacity:.35}
@keyframes providerSpin{to{transform:rotate(360deg)}}@keyframes providerPulse{50%{transform:scale(2.2);opacity:.25}}