#btn-ops { border-color: #297a82; color: #9fece5; white-space: nowrap; }
#agent-presence { position:fixed; z-index:110; top:88px; left:50%; transform:translateX(-50%); width:min(680px,calc(100vw - 700px)); min-width:380px; box-sizing:border-box; border:1px solid #335768; border-radius:12px; background:linear-gradient(135deg,#0d2433f5,#081722ed); color:#deedf5; font:12px/1.6 'Microsoft YaHei UI',sans-serif; box-shadow:0 12px 40px #0005; backdrop-filter:blur(12px); }
#agent-presence * { box-sizing:border-box; }
#agent-presence header { display:flex; align-items:center; justify-content:space-between; gap:8px; padding:11px 14px; border-bottom:1px solid #8ec7df20; }
#agent-presence header>div { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
#agent-presence header strong { font-size:14px; }
#agent-presence small { color:#91b8c8; font-size:10px; }
#agent-presence button { font:inherit; cursor:pointer; color:inherit; background:#173344; border:1px solid #406171; border-radius:5px; padding:3px 8px; }
#agent-presence button:hover { border-color:#7ce4d5; }
#agent-presence button:focus-visible,#agent-presence summary:focus-visible { outline:2px solid #91f3df; outline-offset:2px; }
#agent-presence button:disabled { opacity:.45; cursor:default; }
.agent-live-dot { width:7px; height:7px; border-radius:50%; background:#8ca4b0; }
.agent-live-dot.working { background:#66e4ca; box-shadow:0 0 9px #66e4ca66; }
.agent-presence-body { max-height:min(460px,calc(100dvh - 210px)); overflow:auto; }
#agent-presence[data-folded="true"] .agent-presence-body { display:none; }
.agent-cards { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:7px; padding:10px; }
#agent-presence .agent-card { display:flex; flex-direction:column; gap:8px; text-align:left; background:#102734; border-color:#32505e; padding:10px; min-height:100px; }
#agent-presence .agent-card.active { border-color:#3a9f98; background:#123333; }
.agent-card-name { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:4px; }
.agent-card-name b { font-size:12px; color:#d9f6f3; }
.agent-card-name em { font-size:10px; color:#93c9c6; font-style:normal; }
.agent-card>span:last-child { color:#a8c3ce; font-size:11px; }
.agent-human-line { margin:0 12px 10px; display:flex; align-items:center; justify-content:space-between; gap:6px; color:#ecd4a1; }
.agent-activity { border-top:1px solid #8ec7df20; padding:8px 12px; }
.agent-activity summary { cursor:pointer; white-space:nowrap; text-overflow:ellipsis; overflow:hidden; color:#a7c7d5; }
.agent-activity ol { list-style:none; margin:8px 0 0; padding:0; }
#agent-presence .agent-activity li button { display:grid; grid-template-columns:72px 1fr; gap:2px 8px; width:100%; text-align:left; margin:0 0 5px; padding:6px; background:#0b202c; border-color:transparent; }
.agent-activity time { grid-row:span 2; color:#809da9; font-size:10px; }
.agent-activity li span { color:#9ebfca; }
#agent-presence footer { font-size:10px; color:#849fab; padding:6px 12px 10px; display:flex; justify-content:space-between; align-items:center; gap:5px; }
#agent-presence .agent-presence-body>p { padding:12px; }
@media(max-width:1100px) { #agent-presence { top:auto; bottom:76px; width:400px; min-width:0; max-width:calc(100vw - 28px); } }
@media(max-width:520px) { #agent-presence { bottom:62px; width:calc(100vw - 24px); }.agent-cards { gap:4px; padding:7px; }#agent-presence .agent-card { padding:7px; }.agent-human-line { flex-wrap:wrap; } }
#ops-dialog { box-sizing: border-box; width: min(1180px, calc(100vw - 40px)); max-width: none; height: min(850px, calc(100dvh - 48px)); max-height: none; padding: 0; border: 1px solid #285465; border-radius: 14px; color: #deedf5; background: #091924; box-shadow: 0 24px 100px #0009; font: 14px/1.6 'Microsoft YaHei', sans-serif; overflow: hidden; }
#ops-dialog[open] { display: flex; flex-direction: column; }
#ops-dialog::backdrop { background: #020b13a8; backdrop-filter: blur(5px); }
#ops-dialog * { box-sizing: border-box; }
#ops-dialog button, #ops-dialog select, #ops-dialog textarea { font: inherit; color: inherit; }
#ops-dialog button { background: #102d3b; border: 1px solid #2d5768; border-radius: 6px; padding: 7px 12px; cursor: pointer; }
#ops-dialog button:hover { border-color: #54c9c2; background: #183f4c; }
#ops-dialog button:disabled { opacity: .4; cursor: default; }
#ops-dialog :focus-visible { outline: 2px solid #81e9dd; outline-offset: 3px; }
.ops-header { display: flex; justify-content: space-between; gap: 20px; padding: 20px 26px 14px; background: linear-gradient(110deg, #123441, #0a1b29); }
.ops-eyebrow { color: #75b8bd; letter-spacing: .1em; font-size: 11px; }
.ops-header h2 { margin: 3px 0; font-size: 24px; letter-spacing: .03em; }
.ops-header p { margin: 0; color: #9eb7c5; font-size: 12px; }
#ops-dialog .ops-close { align-self: flex-start; border: none; background: transparent; font-size: 28px; line-height: 1; }
.ops-summary { display: grid; grid-template-columns: repeat(7, 1fr); gap: 12px; margin: 16px 26px; }
.ops-summary > div { border-left: 2px solid #2b7f85; padding-left: 12px; }
.ops-summary span { display: block; color: #99afbf; font-size: 12px; }
.ops-summary strong { font: 27px/1.4 Consolas, monospace; color: #bcf4e8; }
.ops-toolbar { display: flex; justify-content: space-between; gap: 10px; margin: 0 26px; flex-wrap: wrap; }
.ops-toolbar > div { display: flex; flex-wrap: wrap; gap: 8px; }
.ops-automation { margin:0 26px 12px;padding:10px 12px;border:1px solid #28535e;border-radius:7px;background:#0c2831;max-height:220px;overflow:auto;flex-shrink:0; }
.ops-auto-controls {display:flex;align-items:center;flex-wrap:wrap;gap:7px;font-size:12px}.ops-auto-controls strong{margin-right:8px;color:#a8e4d5}.ops-auto-metrics{display:flex;gap:20px;flex-wrap:wrap;padding-top:8px;color:#9cbdc7;font-size:12px}.ops-auto-metrics b{color:#d4f3e8}.ops-automation details{font-size:11px;color:#92b4c0;margin-top:6px}.ops-automation p{margin:5px 0}.ops-escalation{border-left:2px solid #efb462;background:#342a1d;padding:10px;font-size:12px;color:#f1d4a1}
#ops-dialog button[data-action=demo], #ops-dialog button[data-action=complete] { color: #d3fff3; background: #14504e; border-color: #328d83; }
.ops-message { min-height: 24px; margin: 10px 26px; color: #a9d7d5; font-size: 12px; overflow-wrap: anywhere; }
.ops-tabs { display: flex; gap: 24px; padding: 0 26px; border-bottom: 1px solid #203e4d; }
#ops-dialog .ops-tabs button { background: transparent; border: 0; border-bottom: 2px solid transparent; border-radius: 0; padding: 9px 0; color: #91aebe; }
#ops-dialog .ops-tabs button.active { color: #9ef1df; border-bottom-color: #6bd5be; }
.ops-body { display: flex; flex: 1; min-height: 0; overflow: auto; }
.ops-ticket-list { width: 34%; flex-shrink: 0; padding: 16px; overflow-y: auto; border-right: 1px solid #203e4d; }
.ops-filter { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; color: #9db5c5; font-size: 12px; }
#ops-dialog select, #ops-dialog textarea { background: #0a202e; border: 1px solid #355464; border-radius: 5px; padding: 7px; }
#ops-dialog .ops-ticket { display: block; width: 100%; padding: 13px; text-align: left; margin-bottom: 9px; background: #0c2230; border-color: #243f4e; }
#ops-dialog .ops-ticket.selected { background: #12353e; border-color: #53a99f; }
.ops-ticket > strong { display: block; margin: 8px 0; font-weight: 500; }
.ops-ticket small, .ops-table-wrap small { display: block; color: #92acbd; font-size: 11px; overflow-wrap: anywhere; }
.ops-ticket-top { display: flex; justify-content: space-between; color: #a8c4ce; font-size: 11px; }
.ops-priority { color: #f3ca7b; }.ops-priority.P1 { color: #ff9691; }
.ops-detail { flex: 1; min-width: 0; padding: 22px 26px; overflow-y: auto; }
.ops-detail-heading { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; }
.ops-detail h3 { font-size: 19px; margin: 5px 0; }.ops-detail h4 { margin: 20px 0 8px; font-size: 14px; }
.ops-detail-heading button { flex-shrink: 0; font-size: 12px !important; }
.ops-location { color: #9ab8c5; font-size: 12px; overflow-wrap: anywhere; }
.ops-tags { display: flex; gap: 8px; }.ops-tags span { border: 1px solid #2b5361; border-radius: 4px; color: #a8d4d8; padding: 2px 8px; font-size: 11px; }
.ops-times { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; padding: 15px 0; border-bottom: 1px solid #213e4c; }
.ops-times dt { color: #8da9ba; font-size: 11px; }.ops-times dd { margin: 4px 0 0; font-size: 12px; }
.ops-reason { font-size: 12px; color: #a8becb; }.ops-assignment { display: flex; gap: 12px; }.ops-assignment label { display: grid; gap: 6px; flex: 1; color: #9bb9c8; font-size: 12px; }
.ops-actions { display: flex; gap: 10px; margin-top: 12px; }.ops-resolution { display: grid; gap: 7px; margin: 16px 0 10px; }.ops-result { padding: 12px; border-left: 2px solid #60bc9c; background: #12332e; white-space: pre-wrap; overflow-wrap: anywhere; }
.ops-history { list-style: none; padding: 0; }.ops-history li { display: grid; gap: 3px; border-left: 1px solid #33606b; padding: 0 0 15px 14px; font-size: 12px; overflow-wrap: anywhere; }.ops-history time { color: #80a3b2; font-size: 11px; }
.ops-table-wrap { width: 100%; padding: 15px 26px; overflow: auto; }.ops-table-wrap table { border-collapse: collapse; width: 100%; min-width: 740px; font-size: 12px; }.ops-table-wrap th { text-align: left; color: #8cafbd; font-weight: 500; }.ops-table-wrap td, .ops-table-wrap th { padding: 12px 10px; vertical-align: top; border-bottom: 1px solid #213e4c; }.ops-table-wrap td:first-child { width: 32%; }.ops-table-wrap td:nth-child(3) { width: 32%; }.ops-table-wrap p { margin: 4px 0; }.ops-disposition { color: #8fdbc3; }.ops-disposition.suppressed { color: #e3c58a; }
#ops-dialog .ops-link { background: transparent; border: 0; padding: 6px 0 0; text-align: left; color: #82cad3; font-size: 11px; }
.ops-incidents { width: 100%; padding: 20px 26px; overflow: auto; }.ops-incidents article { padding: 16px; border: 1px solid #2b4856; border-radius: 8px; margin-bottom: 12px; }.ops-incidents h3 { margin: 6px 0; font-size: 16px; }.ops-incidents p { color: #a1bbc9; font-size: 12px; }
.ops-empty { padding: 32px 16px; color: #8eacbd; }.ops-footer { border-top: 1px solid #213e4c; padding: 10px 26px; color: #8ba8b8; font-size: 11px; }
@media(max-width: 760px) { #ops-dialog { width: calc(100vw - 16px); height: calc(100dvh - 16px); }.ops-header { padding: 14px; }.ops-summary { margin: 12px 14px; grid-template-columns: repeat(3,1fr); gap: 8px; }.ops-toolbar, .ops-message { margin-left: 14px; margin-right: 14px; }.ops-tabs { padding: 0 14px; gap: 18px; }.ops-body { display: block; }.ops-ticket-list { width: 100%; max-height: 220px; border-right: 0; border-bottom: 1px solid #203e4d; }.ops-detail { overflow: visible; padding: 16px; }.ops-detail-heading { flex-wrap: wrap; }.ops-footer { padding: 8px 14px; }.ops-table-wrap { padding: 12px; } }
.ops-rack-view { width:100%; min-height:0; overflow:auto; padding:22px 26px; color:#bed0dc; }
.ops-rack-view h3 { margin:7px 0; color:#eef8ff; font-size:22px; }
.ops-rack-view p { margin:8px 0; font-size:12px; line-height:1.65; color:#a3bccb; }
.rack-intro { max-width:720px; padding:20px 0; }
.rack-intro label { display:grid; gap:8px; margin:22px 0 14px; font-size:12px; }
.rack-intro select { width:100%; padding:10px; border:1px solid #345366; border-radius:8px; background:#122534; color:#d8eaf5; }
.rack-source-header { display:flex; justify-content:space-between; align-items:center; gap:14px; flex-wrap:wrap; }
.rack-source-state { display:inline-block; margin-left:8px; color:#8be0c6; font-size:12px; font-weight:500; }
.rack-source-state.stale { color:#edbe82; }
.rack-readings { display:grid; grid-template-columns:1fr 1fr 1fr; gap:12px; margin:18px 0; }
.rack-readings > div { padding:16px; border:1px solid #29495c; border-radius:12px; background:rgba(73,132,157,.07); }
.rack-readings span { display:block; font-size:12px; color:#a5becd; }
.rack-readings strong { display:block; margin:10px 0 4px; font-size:32px; color:#c3f3f1; font-variant-numeric:tabular-nums; }
.rack-readings strong small { font-size:13px; font-weight:400; }
.rack-readings strong.rack-time { font-size:25px; }
.rack-readings p { margin:0; font-size:11px; }
.rack-readings.is-stale strong { color:#b6bec8; }
.rack-source-controls { display:flex; flex-wrap:wrap; gap:8px; }
.rack-source-proof { margin:18px 0; padding:15px 17px; border:1px solid #365369; border-radius:12px; background:rgba(93,135,180,.08); }
.rack-source-proof > div { display:flex; gap:14px; flex-wrap:wrap; justify-content:space-between; }
.rack-source-proof b { font-size:14px; color:#d4eafa; }.rack-source-proof span { font-size:12px; color:#99b7c9; }
.rack-source-charts { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.rack-source-charts article { min-width:0; border:1px solid #29495c; border-radius:12px; padding:12px; }
.rack-source-charts h4 { margin:0 0 8px; font-size:12px; color:#bbd3e0; }.rack-source-charts small { color:#7f9bab; }
.rack-source-charts svg { display:block; width:100%; height:auto; color:#8faabc; }
.rack-chart-empty { min-height:92px; display:grid; place-items:center; }
.ops-rack-view .rack-source-caption { font-size:11px; color:#89a4b6; margin-top:18px; }
@media(max-width:760px) { .ops-rack-view { padding:16px; }.rack-readings { grid-template-columns:1fr 1fr; }.rack-readings > div:last-child { grid-column:1/-1; }.rack-source-charts { grid-template-columns:1fr; } }

/* Interactive duty orb. Bloub geometry (c) 2026 Jérémy Perret, MIT; see licenses/bloub-MIT.txt. */
#agent-presence button.agent-duty-orb { display:inline-flex; align-items:center; justify-content:center; width:32px; height:32px; flex:0 0 32px; padding:0; margin:0; border:0; border-radius:50%; background:transparent; box-shadow:none; line-height:0; cursor:pointer; touch-action:manipulation; overflow:visible; }
#agent-presence button.agent-duty-orb svg { display:block; width:100%; height:100%; overflow:visible; filter:drop-shadow(0 0 5px #53f58b99) drop-shadow(0 0 11px #25dc6c55); transition:filter .16s ease; }
#agent-presence button.agent-duty-orb:hover { background:transparent; border:0; }
#agent-presence button.agent-duty-orb[data-hovered="true"] svg,#agent-presence button.agent-duty-orb:focus-visible svg { filter:drop-shadow(0 0 7px #9bffb4cc) drop-shadow(0 0 15px #25dc6c88); }
#agent-presence button.agent-duty-orb:focus-visible { outline:2px solid #b8ffd1; outline-offset:3px; }
@media(prefers-reduced-motion:reduce) { #agent-presence button.agent-duty-orb svg { transition:none; } }


/* Scoped modal hierarchy: no scene/model/material changes. */
#ops-dialog .ops-summary{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:12px 24px}
#ops-dialog .ops-kpi{position:relative;padding:13px 16px 12px 46px;border:1px solid #294354;border-radius:10px;background:linear-gradient(135deg,#112b3b,#0b202d);min-height:100px}
#ops-dialog .ops-kpi strong{font-size:30px;line-height:1.2;letter-spacing:-1px;color:#e7f4ff}
#ops-dialog .ops-kpi small{display:block;font-size:11px;color:#91a9ba}
#ops-dialog .ops-kpi-icon{position:absolute;left:14px;top:15px;width:23px;height:23px;border-radius:7px;text-align:center;background:#274d64;color:#bce5ff;font-weight:bold}
#ops-dialog .ops-kpi.attention{border-color:#6b4c31;background:linear-gradient(125deg,#30291f,#15242d)}
#ops-dialog .ops-kpi.attention strong{color:#ffd3a0}
#ops-dialog .ops-kpi.complete strong{color:#8ce0cb}
#ops-dialog .ops-stat-method{margin:0 24px 10px;font-size:12px;color:#9cb4c7}
#ops-dialog .ops-stat-method>summary{cursor:pointer}
#ops-dialog .ops-question{padding:15px;margin:12px 0 18px;background:#102838;border:1px solid #31546a;border-radius:10px}
#ops-dialog .ops-question>div:first-child{display:flex;justify-content:space-between;gap:12px;align-items:center}
#ops-dialog .ops-question small{font-size:11px;color:#9ab3c5}
#ops-dialog .ops-question-entry{display:flex;gap:8px;margin:10px 0 7px}
#ops-dialog .ops-question input{min-width:0;flex:1;padding:10px;border:1px solid #3a5a6f;border-radius:7px;background:#091c2a;color:#eef6ff;font:inherit}
#ops-dialog .ops-question-entry button{background:#275f82;border-color:#4589aa;min-width:68px}
#ops-dialog .ops-question-examples{display:flex;gap:7px;flex-wrap:wrap}
#ops-dialog .ops-question-examples button{padding:4px 9px;font-size:12px;background:#17384d;border-color:#31556f;color:#b5d5eb}
#ops-dialog .ops-question-answer{border-top:1px solid #365366;padding-top:12px;margin-top:12px;font-size:13px;overflow-wrap:anywhere}
#ops-dialog .ops-next-step{display:flex;flex-direction:column;gap:4px;padding:12px 15px;border-left:3px solid #76bbdc;background:#112b3a;border-radius:6px;margin:10px 0}
#ops-dialog .ops-next-step span{font-size:11px;color:#9cb9ce}#ops-dialog .ops-next-step strong{font-size:15px}#ops-dialog .ops-next-step small{color:#ffd0aa}
#ops-dialog .ops-evidence-fold{margin:12px 0;color:#bbcfdd}
@media(max-width:700px){#ops-dialog .ops-summary{grid-template-columns:repeat(2,minmax(0,1fr));margin:10px 14px}#ops-dialog .ops-kpi{padding-left:40px}#ops-dialog .ops-kpi strong{font-size:25px}.ops-question>div:first-child{flex-wrap:wrap}}
