.integration-watch-page{--signal-cyan:#55f4ff;--signal-blue:#6592ff;--signal-violet:#c17aff;--signal-green:#63f5c5;--signal-gold:#ffd07a;isolation:isolate;position:relative}.integration-watch-atmosphere:before{content:"";opacity:.19;background-image:linear-gradient(#55f4ff1f 1px,#0000 1px),linear-gradient(90deg,#55f4ff1a 1px,#0000 1px);background-size:5rem 5rem;position:absolute;inset:0;mask-image:radial-gradient(circle at 72% 10rem,#000,#0000 54rem)}.integration-watch-masthead{min-height:clamp(34rem,64vw,49rem)}.integration-watch-masthead:after{background:radial-gradient(circle at 77% 43%,#55f4ff2e,#0000 19rem),radial-gradient(circle at 78% 45%,#c17aff1f,#0000 31rem),linear-gradient(118deg,#0000 44%,#6592ff12)}.integration-orbit{aspect-ratio:1;filter:drop-shadow(0 0 2.3rem #55f4ff24);place-items:center;width:clamp(17rem,32vw,28rem);margin-inline:auto;display:grid;position:relative}.integration-orbit:before,.integration-orbit:after,.integration-orbit-ring,.integration-orbit-sweep{content:"";border-radius:50%;position:absolute}.integration-orbit:before{border:1px solid #55f4ff61;inset:2%;box-shadow:inset 0 0 3rem #55f4ff14,0 0 2rem #55f4ff14}.integration-orbit:after{border:1px dashed #c17aff70;inset:17%}.integration-orbit-ring-one{border:1px solid #0000;border-top-color:var(--signal-cyan);border-bottom-color:#6592ff73;animation:24s linear infinite integration-spin;inset:8%}.integration-orbit-ring-two{border:1px dotted #63f5c5b3;animation:16s linear infinite reverse integration-spin;inset:28%}.integration-orbit-sweep{background:conic-gradient(#55f4ff3d,#0000 19%,#0000);animation:9s linear infinite integration-spin;inset:3%;overflow:hidden;mask-image:radial-gradient(circle,#0000 0 43%,#000 44% 100%)}.integration-orbit img{z-index:2;filter:drop-shadow(0 0 1.4rem #55f4ff8c);width:42%;height:auto}.integration-orbit strong{z-index:3;color:#c9fbff;letter-spacing:.22em;text-transform:uppercase;background:#03091adb;border:1px solid #55f4ff4d;padding:.35rem .8rem;font-size:.65rem;position:absolute;bottom:6%}@keyframes integration-spin{to{transform:rotate(360deg)}}.integration-watch-dashboard{gap:clamp(1rem,2vw,1.6rem);padding-bottom:clamp(4rem,9vw,8rem);display:grid}.integration-watch-brief{background:linear-gradient(120deg,#050f26f5,#110927f0),radial-gradient(circle at 100% 0,#55f4ff21,#0000 55%);border-color:#55f4ff47;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:clamp(1rem,4vw,4rem);display:grid}.integration-watch-brief h2,.integration-run-ledger h2,.integration-system-card h2{margin:0}.integration-watch-brief p:last-child{max-width:54rem;color:var(--tr-color-muted);margin-bottom:0;line-height:1.7}.integration-watch-stamp{border-left:1px solid #55f4ff47;gap:.25rem;min-width:13rem;padding-left:1rem;display:grid}.integration-watch-stamp span,.integration-system-setup,.integration-system-observed{color:var(--tr-color-muted);letter-spacing:.1em;text-transform:uppercase;font-size:.7rem}.integration-watch-stamp time{color:#dffcff}.integration-state-legend{flex-wrap:wrap;gap:.55rem;padding:.15rem;display:flex}.integration-state-legend span{color:#aebbd9;letter-spacing:.09em;text-transform:uppercase;align-items:center;gap:.45rem;padding:.35rem .65rem;font-size:.7rem;display:inline-flex}.integration-state-legend i{background:currentColor;border-radius:50%;width:.45rem;height:.45rem;box-shadow:0 0 .75rem}.integration-state-legend .is-healthy{color:var(--signal-green)}.integration-state-legend .is-watch{color:var(--signal-gold)}.integration-state-legend .is-action{color:#ff7895}.integration-state-legend .is-unknown{color:#9fb1d9}.integration-state-legend .is-disabled{color:#7d719a}.integration-watch-message{min-height:1.5rem;margin:0}.integration-watch-message.is-error{color:#ffb1c3}.integration-system-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(.85rem,2vw,1.3rem);display:grid}.integration-system-card{--integration-tone:var(--signal-cyan);border:1px solid color-mix(in srgb, var(--integration-tone) 32%, transparent);background:linear-gradient(148deg, #061028f7, #0c081ff5), radial-gradient(circle at top right, color-mix(in srgb, var(--integration-tone) 14%, transparent), transparent 62%);clip-path:polygon(0 0,calc(100% - 1.2rem) 0,100% 1.2rem,100% 100%,1.2rem 100%,0 calc(100% - 1.2rem));grid-template-rows:auto auto auto 1fr auto;gap:.95rem;min-width:0;padding:clamp(1rem,2.4vw,1.6rem);display:grid;position:relative;overflow:hidden;box-shadow:inset 0 1px #ffffff0a,0 1rem 3rem #00000029}.integration-system-card:before{content:"";background:linear-gradient(90deg, var(--integration-tone), transparent 82%);height:2px;box-shadow:0 0 1.2rem var(--integration-tone);position:absolute;inset:0 0 auto}.integration-system-card.is-healthy{--integration-tone:var(--signal-green)}.integration-system-card.is-watch{--integration-tone:var(--signal-gold)}.integration-system-card.is-action{--integration-tone:#ff7895}.integration-system-card.is-unknown{--integration-tone:#9fb1d9}.integration-system-card.is-disabled{--integration-tone:#7d719a;opacity:.86}.integration-system-heading,.integration-system-heading>div,.integration-system-footer{justify-content:space-between;align-items:center;gap:.8rem;display:flex}.integration-system-heading>div{justify-content:flex-start;min-width:0}.integration-system-heading h2{font-size:clamp(1.1rem,2vw,1.45rem)}.integration-system-index{color:color-mix(in srgb, var(--integration-tone) 62%, white);font:700 .68rem/1 var(--tr-font-mono);letter-spacing:.12em}.integration-state-badge{border:1px solid color-mix(in srgb, var(--integration-tone) 45%, transparent);color:color-mix(in srgb, var(--integration-tone) 76%, white);letter-spacing:.11em;text-transform:uppercase;flex:none;padding:.3rem .55rem;font-size:.64rem}.integration-system-summary{color:#d5def3;margin:0;line-height:1.6}.integration-system-setup{color:color-mix(in srgb, var(--integration-tone) 65%, #9aa7c7);margin:0}.integration-system-metrics{grid-template-columns:repeat(3,minmax(0,1fr));gap:.55rem;margin:0;display:grid}.integration-system-metrics div{background:#0207157a;border:1px solid #839fdd26;min-width:0;padding:.7rem}.integration-system-metrics dt{color:var(--tr-color-muted);letter-spacing:.08em;text-transform:uppercase;font-size:.62rem}.integration-system-metrics dd{overflow-wrap:anywhere;color:#f2f6ff;font:700 1rem/1.2 var(--tr-font-chronicle);margin:.35rem 0 0}.integration-system-footer{border-top:1px solid #819ad824;align-items:flex-end;padding-top:.85rem}.integration-system-footer .text-button{flex:none}.integration-run-ledger{background:linear-gradient(140deg,#080f23f7,#150927f0);border-color:#c17aff40;overflow:hidden}.integration-run-ledger>header{border-bottom:1px solid #c17aff2e;grid-template-columns:minmax(0,.75fr) minmax(18rem,1fr);align-items:end;gap:clamp(1rem,4vw,4rem);padding-bottom:1rem;display:grid}.integration-run-ledger>header>p{color:var(--tr-color-muted);margin:0;line-height:1.6}.integration-run-list{display:grid}.integration-run-row{border-bottom:1px solid #829bd61f;grid-template-columns:minmax(12rem,1fr) minmax(7rem,.45fr) minmax(12rem,.7fr);align-items:center;gap:1rem;padding:.85rem 0;display:grid}.integration-run-row:last-child{border-bottom:0}.integration-run-system{gap:.2rem;display:grid}.integration-run-system span,.integration-run-time{color:var(--tr-color-muted);font-size:.76rem}.integration-run-state{color:#c7d4f4;letter-spacing:.08em;text-transform:uppercase;border:1px solid #6592ff3d;width:fit-content;padding:.25rem .5rem;font-size:.68rem}.integration-run-time{text-align:right}.integration-watch-boundary{border-left:2px solid var(--signal-violet);background:#100823c7;grid-template-columns:auto minmax(0,1fr);align-items:baseline;gap:1rem;padding:1rem 1.2rem;display:grid}.integration-watch-boundary p{color:var(--tr-color-muted);margin:0;line-height:1.6}.integration-empty{color:var(--tr-color-muted);margin:0;padding:1rem 0}@media (width<=900px){.integration-system-grid{grid-template-columns:1fr}.integration-watch-masthead{min-height:auto}}@media (width<=760px){.integration-watch-brief,.integration-run-ledger>header,.integration-watch-boundary,.integration-system-grid{grid-template-columns:1fr}.integration-watch-stamp{border-top:1px solid #55f4ff33;border-left:0;min-width:0;padding:.8rem 0 0}.integration-system-metrics{grid-template-columns:1fr}.integration-system-footer{flex-direction:column;align-items:flex-start}.integration-run-row{grid-template-columns:minmax(0,1fr) auto;gap:.55rem .8rem}.integration-run-time{text-align:left;grid-column:1/-1}.integration-orbit{width:min(18rem,84vw)}}@media (prefers-reduced-motion:reduce){.integration-orbit-ring,.integration-orbit-sweep{animation:none}}
