/* botgalaxy.ai preview t2223u: BOCC V2.8.1 outer frame (copied from The BOCC style.css) */
.sf-frame{display:none}
@media all{
 html::after{content:"";position:fixed;inset:3px;pointer-events:none;z-index:50;border:1px solid rgba(245,185,66,.9);box-shadow:0 0 8px rgba(245,185,66,.45),inset 0 0 10px rgba(245,185,66,.25)}
 .sf-frame{display:block;position:fixed;inset:0;pointer-events:none;z-index:49;
  background:
   linear-gradient(90deg,transparent 18%,rgba(245,185,66,.55) 30%,rgba(245,185,66,.55) 70%,transparent 82%) top 8px left 0/100% 1px no-repeat,
   linear-gradient(90deg,transparent 18%,rgba(245,185,66,.55) 30%,rgba(245,185,66,.55) 70%,transparent 82%) bottom 8px left 0/100% 1px no-repeat,
   linear-gradient(180deg,transparent 20%,rgba(245,185,66,.45) 35%,rgba(245,185,66,.45) 65%,transparent 80%) left 8px top 0/1px 100% no-repeat,
   linear-gradient(180deg,transparent 20%,rgba(245,185,66,.45) 35%,rgba(245,185,66,.45) 65%,transparent 80%) right 8px top 0/1px 100% no-repeat}
 .sf-c{position:absolute;width:96px;height:96px;overflow:visible;filter:drop-shadow(0 0 3px rgba(245,185,66,.7))}
 .sf-tl{top:0;left:0}.sf-tr{top:0;right:0;transform:scaleX(-1)}.sf-bl{bottom:0;left:0;transform:scaleY(-1)}.sf-br{bottom:0;right:0;transform:scale(-1,-1)}
 .sf-c path{fill:none;stroke-linecap:square}
 .sf-g{stroke:#F5B942;stroke-width:2.5}.sf-d{stroke:rgba(245,185,66,.45);stroke-width:1}.sf-g2{stroke:#F5B942;stroke-width:1.5}
 .sf-ckt{stroke:rgba(245,185,66,.35);stroke-width:.8}
 .sf-n{fill:#FFE3A1}.sf-n2{fill:rgba(255,227,161,.7)}
 .sf-node{position:absolute;top:50%;width:6px;height:48px;margin-top:-24px;border-radius:3px;background:linear-gradient(#F5B942,#FFE3A1,#F5B942);box-shadow:0 0 8px 2px rgba(245,185,66,.6);opacity:.9}
 .sf-l{left:3px}.sf-r{right:3px}
 .sf-star{position:absolute;width:2px;height:2px;border-radius:50%;background:#fff;box-shadow:0 0 4px 1px rgba(255,255,255,.6);animation:sf-tw 4s ease-in-out infinite}
 .s1{top:4px;left:28%}.s2{top:5px;right:22%;animation-delay:1.3s}.s3{bottom:4px;left:41%;animation-delay:2.1s}.s4{left:5px;top:28%;animation-delay:.7s}.s5{right:5px;bottom:30%;animation-delay:2.8s}
 /* line separator under the top bar, and a bigger BOCC logo */
 .app-strip{border-bottom:1px solid #F5B942;box-shadow:0 1px 6px rgba(245,185,66,.35);height:68px}
 .app-strip .sb-l img{height:58px}
}
@keyframes sf-tw{0%,100%{opacity:.25}50%{opacity:1}}
@media (prefers-reduced-motion:reduce){.sf-star{animation:none;opacity:.7}}
/* sci-fi frame v2: stronger panels, bigger corners, top and bottom tabs */
@media all{ /* bar and frame: browser tab too (Rob 11:57); lighter frame via html.is-tab */
 .sf-frame::before,.sf-frame::after{content:"";position:absolute;left:50%;width:220px;margin-left:-110px;height:7px;background:linear-gradient(90deg,transparent,rgba(245,185,66,.25) 15%,rgba(245,185,66,.25) 85%,transparent);clip-path:polygon(0 0,100% 0,94% 100%,6% 100%);box-shadow:0 0 6px rgba(245,185,66,.5)}
 .sf-frame::before{top:3px}.sf-frame::after{bottom:3px;transform:scaleY(-1)}
 .sf-c{width:132px;height:132px}
 .sf-g{stroke-width:3}
 .sf-node{width:5px;height:64px;margin-top:-32px;left:5px}.sf-r{left:auto;right:5px}
 .app-strip .sb-l img{height:56px}
 .cust-name{font-size:22px}
}
