/* ARVIS komuta merkezi: müdür küre ortada, işçiler çevresinde; dar ekranda dikey hat. */
.hub{--hub-ink:#101c54;--hub-muted:#5e77a2;--hub-line:#dbe5f4;--hub-surface:#fff;--hub-soft:#f5f8fd;--hub-ok:#10b86d;--hub-warn:#e0a100;--hub-sleep:#aab5c8;--hub-accent:#3d5afe;position:relative;background:linear-gradient(180deg,#fbfdff,#f3f7fd);border:1px solid var(--hub-line);border-radius:24px;overflow:hidden;margin-block:18px}
.hub-fit{position:relative;width:100%;overflow:hidden}
.hub-stage{position:relative;width:1080px;height:660px;transform-origin:top left;background:radial-gradient(ellipse at 50% 50%,#e4ecff 0,transparent 58%)}
.hub-links{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.hub-link{stroke-width:2;fill:none}
.hub-link.on{stroke:color-mix(in srgb,var(--c) 55%,#dbe5f4);stroke-dasharray:6 8;animation:hub-flow 1.6s linear infinite}
.hub-link.idle{stroke:#d3dcea;stroke-dasharray:3 7}
.hub-link.hot{stroke:var(--c);stroke-width:3}
.hub-beam{stroke-width:4;stroke-linecap:round;fill:none;stroke-dasharray:900}
.hub-packet{filter:drop-shadow(0 0 6px currentColor)}
@keyframes hub-flow{to{stroke-dashoffset:-28}}
.hub-core{position:absolute;left:50%;top:50%;translate:-50% -50%;display:grid;justify-items:center;gap:6px;z-index:2}
.hub-orb{position:relative;width:240px;height:240px;display:grid;place-items:center;border:0;background:none;padding:0;cursor:pointer}
.hub-orb-rings{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none}
.hub-orb-rings i{position:absolute;width:200px;height:200px;border:1px solid #b8d9ff;border-radius:50%;animation:hub-spin 24s linear infinite}
.hub-orb-rings i:nth-child(2){width:168px;height:168px;border-style:dashed;border-color:#8d9dff;animation-direction:reverse;animation-duration:18s}
.hub-orb-rings i:nth-child(3){width:236px;height:236px;border-color:#d6e6ff;animation-duration:34s}
.hub-orb-rings i::after{content:'';position:absolute;top:12%;left:12%;width:7px;height:7px;border-radius:50%;background:#1a72ff;box-shadow:0 0 9px #1a72ff}
@keyframes hub-spin{to{rotate:360deg}}
.hub-core-name{border:0;background:none;display:grid;justify-items:center;cursor:pointer;padding:0;margin-top:-34px}
.hub-core-name strong{font-size:22px;color:var(--hub-ink);letter-spacing:.02em}
.hub-core-name small{font-size:13px;color:var(--hub-muted)}
.hub-summary{position:absolute;left:50%;top:50%;translate:-50% -50%;z-index:4;display:flex;gap:18px;background:var(--hub-surface);border:1px solid var(--hub-line);border-radius:16px;padding:12px 16px;box-shadow:0 12px 30px #1b2f6a1f;white-space:nowrap}
.hub-summary div{display:grid}.hub-summary b{font-size:17px;color:var(--hub-ink);font-variant-numeric:tabular-nums}.hub-summary b.warn{color:var(--hub-warn)}.hub-summary span{font-size:11px;color:var(--hub-muted)}
.hub-cards{position:absolute;inset:0}
.hub-worker{position:absolute;width:250px;translate:-50% -50%;display:grid;grid-template-columns:auto minmax(0,1fr);gap:11px;align-items:center;padding:12px 13px;background:var(--hub-surface);border:1px solid var(--hub-line);border-radius:16px;box-shadow:0 10px 26px #1b2f6a12;text-align:left;cursor:pointer;color:var(--hub-ink);font:inherit;transition:transform .25s,border-color .25s,box-shadow .25s;z-index:3}
.hub-worker:hover,.hub-worker:focus-visible{transform:translateY(-3px);border-color:color-mix(in srgb,var(--c) 45%,#dbe5f4);outline:none}
.hub-worker:focus-visible{box-shadow:0 0 0 3px color-mix(in srgb,var(--hub-accent) 35%,transparent)}
.hub-worker.flash{border-color:var(--c);box-shadow:0 0 0 4px color-mix(in srgb,var(--c) 18%,transparent),0 10px 26px #1b2f6a12}
.hub-worker.wait,.hub-worker.soon{background:var(--hub-soft);box-shadow:none}
.hub-worker.wait .worker-logo,.hub-worker.soon .worker-logo{filter:grayscale(1);opacity:.55}
.hub-ico{position:relative;display:grid;place-items:center}
.hub-ring{position:absolute;inset:-5px;border-radius:15px;padding:2px;background:conic-gradient(var(--c) calc(var(--p,0)*1%),color-mix(in srgb,var(--c) 14%,transparent) 0);-webkit-mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0)}
.hub-ring.tick{animation:hub-tick .7s ease-out}
@keyframes hub-tick{from{box-shadow:0 0 0 0 color-mix(in srgb,var(--c) 55%,transparent)}to{box-shadow:0 0 0 12px transparent}}
.hub-copy{display:grid;gap:2px;min-width:0}
.hub-top{display:flex;align-items:center;gap:8px;min-width:0}
.hub-top b{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hub-dot{margin-left:auto;flex:0 0 auto;width:9px;height:9px;border-radius:50%;background:var(--hub-sleep)}
.hub-dot.on{background:var(--hub-ok);box-shadow:0 0 0 3px #10b86d26}.hub-dot.wait{background:var(--hub-warn)}
.hub-status{font-size:12px;color:var(--hub-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hub-typing{display:inline-flex;gap:3px;margin-left:4px;vertical-align:middle}
.hub-typing i{width:4px;height:4px;border-radius:50%;background:var(--c);animation:hub-typing 1.2s infinite}
.hub-typing i:nth-child(2){animation-delay:.15s}.hub-typing i:nth-child(3){animation-delay:.3s}
@keyframes hub-typing{0%,60%,100%{opacity:.25;transform:none}30%{opacity:1;transform:translateY(-3px)}}
.hub-zz{position:absolute;right:14px;top:-12px;font-size:12px;font-weight:800;color:var(--hub-sleep);animation:hub-zz 3s ease-in-out infinite}
@keyframes hub-zz{0%{opacity:0;transform:translate(0,6px)}40%{opacity:1}100%{opacity:0;transform:translate(8px,-10px)}}
.hub-task{position:absolute;left:50%;top:-13px;translate:-50% 0;max-width:calc(100% - 16px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;background:var(--hub-accent);color:#fff;font-size:10.5px;font-weight:700;border-radius:999px;padding:3px 10px;box-shadow:0 6px 16px #3d5afe40;animation:hub-pop .35s ease-out}
@keyframes hub-pop{from{transform:scale(.6);opacity:0}}
.hub-ticker{display:flex;align-items:center;gap:14px;padding:12px 20px;border-top:1px solid var(--hub-line);background:var(--hub-soft);min-width:0}
.hub-ticker>span{flex:0 0 auto;font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--hub-muted)}
.hub-ticker ul{list-style:none;margin:0;padding:0;display:flex;gap:10px;overflow-x:auto;min-width:0;scrollbar-width:none}
.hub-ticker ul::-webkit-scrollbar{display:none}
.hub-ticker li{flex:0 0 auto;display:flex;align-items:center;gap:8px;background:var(--hub-surface);border:1px solid var(--hub-line);border-radius:999px;padding:6px 12px;font-size:12px;color:var(--hub-ink)}
.hub-ticker li i{width:8px;height:8px;border-radius:50%;background:var(--c)}
.hub-ticker li time{color:var(--hub-muted);font-variant-numeric:tabular-nums}
.hub-ticker li.hub-empty{color:var(--hub-muted)}
/* Dar ekran: küre üstte, işçiler soldaki dikey hatta. */
.hub.compact .hub-stage{width:auto;height:auto;transform:none;padding:16px 14px 18px;display:grid;gap:14px;background:none}
.hub.compact .hub-links{display:none}
.hub.compact .hub-core{order:-1;position:static;translate:none;grid-template-columns:auto 1fr;align-items:center;justify-items:start;gap:12px;background:var(--hub-surface);border:1px solid var(--hub-line);border-radius:20px;padding:12px 14px}
.hub.compact .hub-orb{width:96px;height:96px}
.hub.compact .hub-orb .core-logo{width:78px;height:78px;box-shadow:0 0 0 5px #dbeeff88,0 0 22px #4187ff80}
.hub.compact .hub-orb .core-logo>span{width:46px!important;height:40px!important;transform:translateY(-4px)}
.hub.compact .hub-orb-rings i{width:92px;height:92px}.hub.compact .hub-orb-rings i:nth-child(2){width:80px;height:80px}.hub.compact .hub-orb-rings i:nth-child(3){display:none}
.hub.compact .hub-core-name{margin:0;justify-items:start}
.hub.compact .hub-summary{position:static;translate:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;padding:0;background:none;border:0;box-shadow:none;white-space:normal}
.hub.compact .hub-summary[hidden]{display:grid!important}
.hub.compact .hub-summary div{background:var(--hub-surface);border:1px solid var(--hub-line);border-radius:14px;padding:9px 10px}
.hub.compact .hub-summary div:nth-child(n+4){display:none}
.hub.compact .hub-cards{position:relative;inset:auto;display:grid;gap:10px;padding-left:22px}
.hub.compact .hub-cards::before{content:'';position:absolute;left:8px;top:-14px;bottom:24px;width:2px;background:linear-gradient(var(--hub-accent),var(--hub-line))}
.hub.compact .hub-worker{position:relative;left:auto!important;top:auto!important;translate:none;width:auto}
.hub.compact .hub-worker::before{content:'';position:absolute;left:-14px;top:50%;width:14px;height:2px;background:var(--hub-line)}
.hub.compact .hub-worker.on::before{background:color-mix(in srgb,var(--c) 60%,var(--hub-line))}
.hub.compact .hub-worker::after{content:'';position:absolute;left:-19px;top:50%;width:10px;height:10px;margin-top:-5px;border-radius:50%;background:var(--hub-surface);border:2px solid var(--hub-line)}
.hub.compact .hub-worker.on::after{border-color:var(--c)}
.hub-rail-dot{position:absolute;left:4px;width:10px;height:10px;border-radius:50%;background:var(--c);box-shadow:0 0 10px var(--c);z-index:4;pointer-events:none}
.hub.compact .hub-ticker{padding:10px 14px}
@media (prefers-reduced-motion:reduce){.hub *,.hub *::before,.hub *::after{animation:none!important;transition:none!important}}
.hub .worker-logo.instagram{background:radial-gradient(circle at 30% 110%,#ffd676 0%,#ffbc54 23%,#fa394c 47%,#be05ba 72%,#5851db 97%)}
.hub .worker-logo.instagram img{width:24px;height:24px}

/* Küre yüklenene kadar eski logo yerine koyu neon küre silueti; sesli asistan 4 sn içinde gelmezse logo görünür. */
.hub-orb::before{content:'';position:absolute;width:56%;height:56%;border-radius:50%;background:radial-gradient(circle at 50% 38%,#1b2350 0%,#0a0d1c 62%,#05060d 100%);box-shadow:0 0 0 2px #7fe3ffaa,0 0 0 5px #4f7dff33,0 0 34px #3b6dffaa,0 0 70px #8a5cff55;animation:hub-orb-silhouette .3s ease 4s forwards}
.hub-orb>.hub-orb-rings,.hub-orb>.core-logo{opacity:0;animation:hub-orb-fallback .3s ease 4s forwards}
@keyframes hub-orb-silhouette{to{opacity:0}}
@keyframes hub-orb-fallback{to{opacity:1}}