/* =========================================================
   SeeYouIOS — Premium Live Operations Dashboard V3
   Scoped to .ov3-dashboard
   ========================================================= */

.ov3-dashboard{
 --ov3-bg:#070b14;
 --ov3-panel:rgba(10,16,29,.88);
 --ov3-panel-2:rgba(12,19,34,.72);
 --ov3-line:rgba(148,163,184,.095);
 --ov3-line-strong:rgba(148,163,184,.16);
 --ov3-text:#e7edf7;
 --ov3-muted:#627087;
 --ov3-muted-2:#8290a5;
 --ov3-cyan:#22d3ee;
 --ov3-blue:#60a5fa;
 --ov3-violet:#9b87f5;
 --ov3-green:#34d399;
 --ov3-amber:#fbbf24;
 --ov3-red:#fb7185;

 position:relative;
 isolation:isolate;
 width:100%;
 max-width:1600px;
 margin:0 auto;
 padding:4px 0 50px;
 color:var(--ov3-text);
}


.ov3-dashboard::before{
 content:"";
 pointer-events:none;
 position:absolute;
 z-index:-1;
 top:-70px;
 left:8%;
 width:44%;
 height:250px;
 border-radius:50%;
 background:
  radial-gradient(
   ellipse at center,
   rgba(34,211,238,.055),
   transparent 68%
  );
 filter:blur(10px);
}


.ov3-dashboard::after{
 content:"";
 pointer-events:none;
 position:absolute;
 z-index:-1;
 top:240px;
 right:3%;
 width:38%;
 height:320px;
 border-radius:50%;
 background:
  radial-gradient(
   ellipse at center,
   rgba(139,92,246,.045),
   transparent 68%
  );
 filter:blur(14px);
}


/* HERO */

.ov3-hero{
 display:flex;
 align-items:center;
 justify-content:space-between;
 gap:24px;
 margin-bottom:22px;
 padding:12px 3px 4px;
}


.ov3-eyebrow{
 display:flex;
 align-items:center;
 gap:8px;
 color:#607189;
 font-size:8px;
 font-weight:900;
 letter-spacing:.16em;
}


.ov3-eyebrow-pulse{
 width:7px;
 height:7px;
 border-radius:50%;
 background:var(--ov3-cyan);
 box-shadow:
  0 0 0 4px rgba(34,211,238,.07),
  0 0 18px rgba(34,211,238,.4);
 animation:
  ov3Pulse 2.2s ease-in-out infinite;
}


.ov3-hero h1{
 margin:7px 0 5px;
 color:#f5f8fc;
 font-size:30px;
 line-height:1.08;
 letter-spacing:-.052em;
 font-weight:900;
}


.ov3-hero h1 span{
 color:#91a4bf;
 font-weight:730;
}


.ov3-hero p{
 margin:0;
 max-width:660px;
 color:#63738a;
 font-size:10px;
 line-height:1.55;
}


.ov3-hero-state{
 display:flex;
 align-items:center;
 gap:8px;
}


.ov3-live-state,
.ov3-sync,
.ov3-clock{
 min-height:46px;
 display:flex;
 align-items:center;
 gap:9px;
 padding:0 12px;
 border:
  1px solid var(--ov3-line);
 border-radius:12px;
 background:
  linear-gradient(
   150deg,
   rgba(17,25,42,.78),
   rgba(7,12,23,.88)
  );
 backdrop-filter:blur(12px);
}


.ov3-live-state > span{
 width:8px;
 height:8px;
 flex:none;
 border-radius:50%;
 background:var(--ov3-green);
 box-shadow:
  0 0 0 4px rgba(52,211,153,.06),
  0 0 16px rgba(52,211,153,.26);
}


.ov3-live-state.offline > span{
 background:var(--ov3-red);
 box-shadow:
  0 0 0 4px rgba(251,113,133,.06);
}


.ov3-live-state small,
.ov3-sync small,
.ov3-clock small{
 display:block;
 color:#46566e;
 font-size:6px;
 font-weight:900;
 letter-spacing:.12em;
}


.ov3-live-state strong,
.ov3-sync strong,
.ov3-clock strong{
 display:block;
 margin-top:2px;
 color:#a9b8ca;
 font-size:8px;
 font-weight:900;
}


.ov3-live-state.online strong{
 color:#86efac;
}


.ov3-live-state.offline strong{
 color:#fda4af;
}


/* KPI */

.ov3-kpis{
 display:grid;
 grid-template-columns:
  repeat(4,minmax(0,1fr));
 gap:10px;
 margin-bottom:12px;
}


.ov3-kpi{
 position:relative;
 overflow:hidden;
 min-width:0;
 padding:16px 16px 13px;
 border:
  1px solid var(--ov3-line);
 border-radius:16px;
 background:
  linear-gradient(
   150deg,
   rgba(14,22,38,.88),
   rgba(7,12,23,.95)
  );
 color:var(--ov3-text);
 text-decoration:none!important;
 box-shadow:
  inset 0 1px 0 rgba(255,255,255,.015);
 transform:translateY(0);
 animation:
  ov3Rise .55s both;
 animation-delay:
  var(--delay,0ms);
 transition:
  transform .18s ease,
  border-color .18s ease,
  background .18s ease;
}


.ov3-kpi::before{
 content:"";
 position:absolute;
 inset:0;
 pointer-events:none;
 opacity:.36;
 background:
  radial-gradient(
   circle at 12% 0,
   currentColor,
   transparent 36%
  );
 mix-blend-mode:soft-light;
}


.ov3-kpi::after{
 content:"";
 position:absolute;
 left:0;
 top:0;
 bottom:0;
 width:2px;
 opacity:.55;
 background:currentColor;
}


.ov3-kpi:hover{
 transform:translateY(-2px);
 border-color:
  rgba(148,163,184,.18);
}


.ov3-cyan{
 color:var(--ov3-cyan);
}


.ov3-violet{
 color:var(--ov3-violet);
}


.ov3-emerald{
 color:var(--ov3-green);
}


.ov3-blue{
 color:var(--ov3-blue);
}


.ov3-kpi-head{
 position:relative;
 z-index:1;
 display:flex;
 align-items:center;
 justify-content:space-between;
 gap:10px;
}


.ov3-kpi-icon{
 width:32px;
 height:32px;
 display:grid;
 place-items:center;
 border:
  1px solid currentColor;
 border-radius:9px;
 background:
  rgba(255,255,255,.025);
 opacity:.82;
}


.ov3-kpi-icon svg{
 width:15px;
 height:15px;
 fill:none;
 stroke:currentColor;
 stroke-width:1.65;
 stroke-linecap:round;
 stroke-linejoin:round;
}


.ov3-kpi-live{
 color:#4e5d72;
 font-size:6px;
 font-weight:900;
 letter-spacing:.1em;
}


.ov3-kpi > strong{
 position:relative;
 z-index:1;
 display:block;
 margin-top:15px;
 overflow:hidden;
 color:#f3f6fb;
 font-size:24px;
 line-height:1;
 font-weight:920;
 letter-spacing:-.05em;
 text-overflow:ellipsis;
 white-space:nowrap;
}


.ov3-kpi-label{
 position:relative;
 z-index:1;
 margin-top:6px;
 color:#8795a9;
 font-size:8px;
 font-weight:780;
}


.ov3-kpi-bottom{
 position:relative;
 z-index:1;
 display:flex;
 align-items:flex-end;
 justify-content:space-between;
 gap:10px;
 margin-top:14px;
}


.ov3-kpi-bottom small{
 color:#4e5d72;
 font-size:6.5px;
}


.ov3-spark{
 width:82px;
 height:24px;
 flex:none;
 overflow:visible;
 color:currentColor;
}


/* PANELS */

.ov3-primary-grid{
 display:grid;
 grid-template-columns:
  minmax(0,1.95fr)
  minmax(280px,.82fr);
 gap:12px;
 margin-bottom:12px;
}


.ov3-secondary-grid{
 display:grid;
 grid-template-columns:
  repeat(2,minmax(0,1fr));
 gap:12px;
 margin-bottom:12px;
}


.ov3-tertiary-grid{
 display:grid;
 grid-template-columns:
  minmax(0,1.55fr)
  minmax(320px,.85fr);
 gap:12px;
}


.ov3-panel{
 min-width:0;
 overflow:hidden;
 border:
  1px solid var(--ov3-line);
 border-radius:17px;
 background:
  linear-gradient(
   155deg,
   rgba(10,16,29,.89),
   rgba(7,11,20,.95)
  );
 box-shadow:
  inset 0 1px 0 rgba(255,255,255,.012);
}


.ov3-panel-head{
 display:flex;
 align-items:flex-start;
 justify-content:space-between;
 gap:14px;
 min-height:67px;
 padding:14px 16px 12px;
 border-bottom:
  1px solid rgba(148,163,184,.07);
}


.ov3-section-tag{
 display:block;
 margin-bottom:4px;
 color:#45566e;
 font-size:6px;
 font-weight:900;
 letter-spacing:.15em;
}


.ov3-panel-head h2{
 margin:0;
 color:#dce5f2;
 font-size:12px;
 font-weight:900;
 letter-spacing:-.02em;
}


.ov3-panel-head p{
 margin:4px 0 0;
 color:#53637a;
 font-size:7px;
}


.ov3-head-link{
 align-self:center;
 color:#60728a!important;
 font-size:7px!important;
 font-weight:780!important;
 text-decoration:none!important;
 transition:color .15s ease;
}


.ov3-head-link:hover{
 color:#b8c5d5!important;
}


/* TRAFFIC */

.ov3-traffic-panel{
 min-height:445px;
}


.ov3-period-switch{
 align-self:center;
 display:flex;
 padding:3px;
 border:
  1px solid rgba(148,163,184,.08);
 border-radius:9px;
 background:
  rgba(2,6,23,.42);
}


.ov3-period-switch button{
 min-width:37px;
 height:28px;
 border:0;
 border-radius:6px;
 background:transparent;
 color:#53637a;
 font-size:6.5px;
 font-weight:900;
 cursor:pointer;
 transition:
  color .15s ease,
  background .15s ease;
}


.ov3-period-switch button.active{
 background:
  rgba(96,165,250,.09);
 color:#bfdbfe;
}


.ov3-chart-summary{
 display:flex;
 align-items:flex-end;
 justify-content:space-between;
 gap:15px;
 padding:16px 18px 4px;
}


.ov3-chart-summary > div:first-child span{
 display:block;
 color:#46566d;
 font-size:6px;
 font-weight:900;
 letter-spacing:.11em;
}


.ov3-chart-summary > div:first-child strong{
 display:block;
 margin-top:4px;
 color:#edf3fb;
 font-size:21px;
 font-weight:900;
 letter-spacing:-.04em;
}


.ov3-chart-legend{
 display:flex;
 gap:14px;
 color:#65758b;
 font-size:7px;
}


.ov3-chart-legend span{
 display:flex;
 align-items:center;
 gap:6px;
}


.ov3-chart-legend i{
 width:15px;
 height:2px;
 border-radius:999px;
}


.ov3-chart-legend i.incoming{
 background:var(--ov3-cyan);
 box-shadow:
  0 0 8px rgba(34,211,238,.35);
}


.ov3-chart-legend i.outgoing{
 background:var(--ov3-violet);
 box-shadow:
  0 0 8px rgba(155,135,245,.3);
}


.ov3-chart-shell{
 position:relative;
 height:292px;
 margin:0 10px;
 border-radius:12px;
 overflow:hidden;
 background:
  linear-gradient(
   rgba(148,163,184,.022) 1px,
   transparent 1px
  ),
  linear-gradient(
   90deg,
   rgba(148,163,184,.018) 1px,
   transparent 1px
  );
 background-size:
  38px 38px;
}


.ov3-chart{
 display:block;
 width:100%;
 height:100%;
 overflow:visible;
}


.ov3-chart text{
 font-family:
  Inter,
  ui-sans-serif,
  system-ui,
  sans-serif;
}


.ov3-chart .ov3-grid-line{
 stroke:
  rgba(148,163,184,.075);
 stroke-width:1;
 vector-effect:
  non-scaling-stroke;
}


.ov3-chart .ov3-grid-label{
 fill:#39485e;
 font-size:8px;
 font-weight:700;
}


.ov3-chart .ov3-x-label{
 fill:#425168;
 font-size:8px;
 font-weight:700;
}


.ov3-chart .ov3-area{
 fill:url(#ov3IncomingArea);
 opacity:.85;
}


.ov3-chart .ov3-line{
 fill:none;
 stroke-width:2.15;
 stroke-linecap:round;
 stroke-linejoin:round;
 vector-effect:
  non-scaling-stroke;
}


.ov3-chart .ov3-line.incoming{
 stroke:var(--ov3-cyan);
 filter:
  drop-shadow(
   0 0 5px rgba(34,211,238,.18)
  );
}


.ov3-chart .ov3-line.outgoing{
 stroke:var(--ov3-violet);
 filter:
  drop-shadow(
   0 0 4px rgba(155,135,245,.14)
  );
}


.ov3-chart .ov3-last-point{
 stroke-width:1.5;
 vector-effect:
  non-scaling-stroke;
}


.ov3-chart .ov3-last-point.incoming{
 fill:#07131b;
 stroke:var(--ov3-cyan);
}


.ov3-chart .ov3-last-point.outgoing{
 fill:#100d1b;
 stroke:var(--ov3-violet);
}


.ov3-chart-tooltip{
 position:absolute;
 z-index:10;
 min-width:118px;
 pointer-events:none;
 padding:8px 9px;
 border:
  1px solid rgba(148,163,184,.12);
 border-radius:9px;
 background:
  rgba(5,10,19,.95);
 backdrop-filter:blur(12px);
 box-shadow:
  0 12px 30px rgba(0,0,0,.28);
 color:#dbe5f1;
 font-size:7px;
 line-height:1.6;
}


.ov3-chart-tooltip strong{
 display:block;
 margin-bottom:3px;
 color:#f1f5f9;
 font-size:8px;
}


.ov3-chart-tooltip .in{
 color:#67e8f9;
}


.ov3-chart-tooltip .out{
 color:#c4b5fd;
}


.ov3-chart-foot{
 display:flex;
 justify-content:space-between;
 gap:12px;
 padding:6px 18px 14px;
 color:#3f4f65;
 font-size:6.5px;
}


/* HEALTH */

.ov3-health-overview{
 display:grid;
 grid-template-columns:
  124px minmax(0,1fr);
 align-items:center;
 gap:16px;
 padding:18px 16px 14px;
}


.ov3-health-ring{
 --health-pct:0;
 width:112px;
 height:112px;
 position:relative;
 display:grid;
 place-items:center;
 border-radius:50%;
 background:
  conic-gradient(
   var(--ov3-green)
   0
   calc(var(--health-pct) * 1%),
   rgba(148,163,184,.075)
   calc(var(--health-pct) * 1%)
   100%
  );
 box-shadow:
  0 0 36px rgba(52,211,153,.04);
 transition:
  background .5s ease;
}


.ov3-health-ring::before{
 content:"";
 position:absolute;
 inset:8px;
 border-radius:50%;
 background:
  linear-gradient(
   145deg,
   #0b1220,
   #070b14
  );
 border:
  1px solid rgba(148,163,184,.08);
}


.ov3-health-ring > div{
 position:relative;
 z-index:1;
 text-align:center;
}


.ov3-health-ring strong{
 display:block;
 color:#dff7ed;
 font-size:19px;
 font-weight:900;
 letter-spacing:-.04em;
}


.ov3-health-ring small{
 display:block;
 margin-top:2px;
 color:#4e665c;
 font-size:6px;
 font-weight:900;
 letter-spacing:.1em;
}


.ov3-health-stats{
 display:grid;
 gap:8px;
}


.ov3-health-stats > div{
 display:grid;
 grid-template-columns:
  8px 1fr auto;
 align-items:center;
 gap:7px;
 padding-bottom:7px;
 border-bottom:
  1px solid rgba(148,163,184,.055);
}


.ov3-health-stats > div:last-child{
 border:0;
 padding-bottom:0;
}


.ov3-health-stats i{
 width:6px;
 height:6px;
 border-radius:50%;
}


.ov3-health-stats i.healthy{
 background:var(--ov3-green);
}


.ov3-health-stats i.guarded{
 background:var(--ov3-violet);
}


.ov3-health-stats i.attention{
 background:var(--ov3-amber);
}


.ov3-health-stats span{
 color:#65758b;
 font-size:7px;
}


.ov3-health-stats strong{
 color:#cbd5e1;
 font-size:9px;
}


.ov3-health-list{
 padding:0 15px 12px;
}


.ov3-health-row{
 display:grid;
 grid-template-columns:
  8px minmax(0,1fr) auto;
 align-items:center;
 gap:8px;
 min-height:31px;
 border-bottom:
  1px solid rgba(148,163,184,.045);
}


.ov3-health-row:last-child{
 border-bottom:0;
}


.ov3-health-row > i{
 width:6px;
 height:6px;
 border-radius:50%;
}


.ov3-health-row > i.healthy{
 background:var(--ov3-green);
 box-shadow:
  0 0 9px rgba(52,211,153,.18);
}


.ov3-health-row > i.guarded{
 background:var(--ov3-violet);
}


.ov3-health-row > i.attention{
 background:var(--ov3-amber);
}


.ov3-health-row strong{
 display:block;
 overflow:hidden;
 color:#8797ab;
 font-size:7.5px;
 font-weight:790;
 text-overflow:ellipsis;
 white-space:nowrap;
}


.ov3-health-row small{
 color:#44536a;
 font-size:6px;
 text-transform:uppercase;
}


/* RECENT LISTS */

.ov3-list{
 padding:4px 14px 8px;
}


.ov3-list-row{
 display:grid;
 grid-template-columns:
  36px minmax(0,1fr) auto;
 align-items:center;
 gap:10px;
 min-height:58px;
 padding:6px 0;
 border-bottom:
  1px solid rgba(148,163,184,.05);
 color:inherit;
 text-decoration:none!important;
 transition:
  background .15s ease,
  transform .15s ease;
}


.ov3-list-row:last-child{
 border-bottom:0;
}


.ov3-list-row:hover{
 transform:translateX(2px);
}


.ov3-avatar{
 width:34px;
 height:34px;
 display:grid;
 place-items:center;
 border:
  1px solid rgba(96,165,250,.1);
 border-radius:10px;
 background:
  linear-gradient(
   145deg,
   rgba(96,165,250,.07),
   rgba(139,92,246,.055)
  );
 color:#a9bad0;
 font-size:8px;
 font-weight:900;
}


.ov3-row-main{
 min-width:0;
}


.ov3-row-main strong{
 display:block;
 overflow:hidden;
 color:#aebdce;
 font-size:8px;
 font-weight:820;
 text-overflow:ellipsis;
 white-space:nowrap;
}


.ov3-row-main small{
 display:block;
 margin-top:4px;
 overflow:hidden;
 color:#46566c;
 font-size:6.5px;
 text-overflow:ellipsis;
 white-space:nowrap;
}


.ov3-row-side{
 text-align:right;
}


.ov3-row-side strong{
 display:block;
 color:#bec9d8;
 font-size:8px;
}


.ov3-row-side small{
 display:block;
 margin-top:4px;
 color:#45566d;
 font-size:6px;
}


.ov3-badge{
 display:inline-flex;
 align-items:center;
 min-height:18px;
 padding:0 6px;
 border:
  1px solid rgba(148,163,184,.08);
 border-radius:999px;
 background:
  rgba(255,255,255,.02);
 color:#5f7087;
 font-size:5.5px;
 font-weight:900;
 text-transform:uppercase;
}


.ov3-badge.unread{
 border-color:
  rgba(34,211,238,.12);
 background:
  rgba(34,211,238,.055);
 color:#67e8f9;
}


.ov3-badge.activated{
 border-color:
  rgba(52,211,153,.12);
 background:
  rgba(52,211,153,.055);
 color:#6ee7b7;
}


.ov3-badge.pending{
 border-color:
  rgba(251,191,36,.12);
 background:
  rgba(251,191,36,.05);
 color:#fcd34d;
}


.ov3-badge.expired,
.ov3-badge.cancelled,
.ov3-badge.canceled,
.ov3-badge.rejected{
 border-color:
  rgba(251,113,133,.11);
 background:
  rgba(251,113,133,.04);
 color:#fda4af;
}


/* LIVE ACTIVITY */

.ov3-stream-live{
 align-self:center;
 display:inline-flex;
 align-items:center;
 gap:6px;
 color:#4f7a6b;
 font-size:6px;
 font-weight:900;
 letter-spacing:.12em;
}


.ov3-stream-live i{
 width:6px;
 height:6px;
 border-radius:50%;
 background:var(--ov3-green);
 box-shadow:
  0 0 10px rgba(52,211,153,.32);
 animation:
  ov3Pulse 2s ease-in-out infinite;
}


.ov3-activity{
 display:grid;
 grid-template-columns:
  repeat(4,minmax(0,1fr));
 gap:0;
}


.ov3-activity-item{
 min-width:0;
 min-height:112px;
 padding:15px;
 border-right:
  1px solid rgba(148,163,184,.05);
 border-bottom:
  1px solid rgba(148,163,184,.05);
}


.ov3-activity-item:nth-child(4n){
 border-right:0;
}


.ov3-activity-item:nth-last-child(-n+4){
 border-bottom:0;
}


.ov3-activity-type{
 display:flex;
 align-items:center;
 gap:6px;
 margin-bottom:12px;
}


.ov3-activity-type i{
 width:7px;
 height:7px;
 border-radius:50%;
 background:var(--ov3-cyan);
}


.ov3-activity-type.out i{
 background:var(--ov3-violet);
}


.ov3-activity-type span{
 color:#52637a;
 font-size:6px;
 font-weight:900;
 letter-spacing:.08em;
}


.ov3-activity-item strong{
 display:block;
 overflow:hidden;
 color:#9cabbf;
 font-size:8px;
 text-overflow:ellipsis;
 white-space:nowrap;
}


.ov3-activity-item small{
 display:block;
 margin-top:6px;
 color:#405067;
 font-size:6.5px;
 line-height:1.45;
}


/* POSTURE */

.ov3-posture-grid{
 display:grid;
 grid-template-columns:
  1fr 1fr;
 gap:7px;
 padding:14px;
}


.ov3-posture{
 display:grid;
 grid-template-columns:
  29px minmax(0,1fr) 7px;
 align-items:center;
 gap:8px;
 min-height:53px;
 padding:8px;
 border:
  1px solid rgba(148,163,184,.07);
 border-radius:10px;
 background:
  rgba(255,255,255,.012);
}


.ov3-posture > span{
 width:29px;
 height:29px;
 display:grid;
 place-items:center;
 border-radius:8px;
 background:
  rgba(96,165,250,.055);
 color:#617793;
 font-size:6px;
 font-weight:900;
}


.ov3-posture strong{
 display:block;
 color:#8c9bb0;
 font-size:7px;
}


.ov3-posture small{
 display:block;
 margin-top:3px;
 color:#405067;
 font-size:5.5px;
}


.ov3-posture > i{
 width:6px;
 height:6px;
 border-radius:50%;
 background:#334155;
}


.ov3-posture.good > i{
 background:var(--ov3-green);
 box-shadow:
  0 0 8px rgba(52,211,153,.22);
}


.ov3-posture.warn > i{
 background:var(--ov3-amber);
}


.ov3-quick-actions{
 display:grid;
 grid-template-columns:
  repeat(3,minmax(0,1fr));
 gap:7px;
 padding:0 14px 14px;
}


.ov3-quick-actions a{
 min-width:0;
 display:grid;
 grid-template-columns:
  28px minmax(0,1fr);
 align-items:center;
 gap:7px;
 min-height:49px;
 padding:8px;
 border:
  1px solid rgba(148,163,184,.07);
 border-radius:10px;
 background:
  rgba(255,255,255,.012);
 color:inherit;
 text-decoration:none!important;
 transition:
  border-color .15s ease,
  background .15s ease;
}


.ov3-quick-actions a:hover{
 border-color:
  rgba(96,165,250,.13);
 background:
  rgba(96,165,250,.025);
}


.ov3-quick-actions a > span{
 width:28px;
 height:28px;
 display:grid;
 place-items:center;
 border-radius:7px;
 background:
  rgba(96,165,250,.055);
 color:#647993;
 font-size:7px;
 font-weight:900;
}


.ov3-quick-actions strong{
 display:block;
 overflow:hidden;
 color:#8798ad;
 font-size:6.5px;
 text-overflow:ellipsis;
 white-space:nowrap;
}


.ov3-quick-actions small{
 display:block;
 margin-top:2px;
 overflow:hidden;
 color:#3d4d63;
 font-size:5px;
 text-overflow:ellipsis;
 white-space:nowrap;
}


/* EMPTY + SKELETON */

.ov3-empty{
 padding:28px 16px;
 color:#45556b;
 font-size:8px;
 text-align:center;
}


.ov3-loading-line{
 height:31px;
 margin-bottom:1px;
 border-radius:6px;
 background:
  linear-gradient(
   90deg,
   rgba(148,163,184,.025),
   rgba(148,163,184,.06),
   rgba(148,163,184,.025)
  );
 background-size:200% 100%;
 animation:
  ov3Shimmer 1.5s linear infinite;
}


/* ANIMATION */

@keyframes ov3Rise{

 from{
  opacity:0;
  transform:translateY(7px);
 }

 to{
  opacity:1;
  transform:translateY(0);
 }
}


@keyframes ov3Pulse{

 0%,
 100%{
  opacity:.65;
  transform:scale(.9);
 }

 50%{
  opacity:1;
  transform:scale(1.08);
 }
}


@keyframes ov3Shimmer{

 from{
  background-position:200% 0;
 }

 to{
  background-position:-200% 0;
 }
}


/* RESPONSIVE */

@media(max-width:1180px){

 .ov3-kpis{
  grid-template-columns:
   repeat(2,minmax(0,1fr));
 }

 .ov3-primary-grid,
 .ov3-tertiary-grid{
  grid-template-columns:1fr;
 }

 .ov3-health-panel{
  min-height:auto;
 }

 .ov3-health-list{
  display:grid;
  grid-template-columns:
   1fr 1fr;
  gap:0 14px;
 }
}


@media(max-width:760px){

 .ov3-dashboard{
  padding-bottom:30px;
 }

 .ov3-hero{
  align-items:flex-start;
  flex-direction:column;
 }

 .ov3-hero-state{
  width:100%;
  display:grid;
  grid-template-columns:
   1fr 1fr 1fr;
 }

 .ov3-live-state,
 .ov3-sync,
 .ov3-clock{
  min-width:0;
  padding:0 8px;
 }

 .ov3-hero h1{
  font-size:25px;
 }

 .ov3-secondary-grid{
  grid-template-columns:1fr;
 }

 .ov3-activity{
  grid-template-columns:
   1fr 1fr;
 }

 .ov3-activity-item:nth-child(4n){
  border-right:
   1px solid rgba(148,163,184,.05);
 }

 .ov3-activity-item:nth-child(2n){
  border-right:0;
 }

 .ov3-activity-item:nth-last-child(-n+4){
  border-bottom:
   1px solid rgba(148,163,184,.05);
 }

 .ov3-activity-item:nth-last-child(-n+2){
  border-bottom:0;
 }

 .ov3-chart-shell{
  height:245px;
 }

 .ov3-health-list{
  display:block;
 }
}


@media(max-width:520px){

 .ov3-kpis{
  grid-template-columns:1fr;
 }

 .ov3-kpi > strong{
  font-size:26px;
 }

 .ov3-hero-state{
  grid-template-columns:
   1fr 1fr;
 }

 .ov3-clock{
  display:none;
 }

 .ov3-health-overview{
  grid-template-columns:
   110px 1fr;
  gap:10px;
 }

 .ov3-health-ring{
  width:100px;
  height:100px;
 }

 .ov3-posture-grid{
  grid-template-columns:1fr;
 }

 .ov3-quick-actions{
  grid-template-columns:1fr;
 }

 .ov3-panel-head{
  min-height:62px;
  padding:12px;
 }

 .ov3-chart-summary{
  align-items:flex-start;
  flex-direction:column;
 }

 .ov3-chart-legend{
  width:100%;
  justify-content:flex-start;
 }

 .ov3-chart-shell{
  margin:0 4px;
 }
}


@media(prefers-reduced-motion:reduce){

 .ov3-dashboard *,
 .ov3-dashboard *::before,
 .ov3-dashboard *::after{
  animation:none!important;
  transition:none!important;
 }
}