/* Linewatch Ops Dashboard — full control-room vision */
:root {
  color-scheme: dark;
  --bg0: #05080e;
  --bg1: #0a101c;
  --bg2: #111a2a;
  --panel: #0c1422ee;
  --fg: #e8f0ff;
  --muted: #7a8ba8;
  --dim: #4a5a72;
  --line: #1c2a40;
  --neon: #00e5ff;
  --neon2: #7c5cff;
  --ok: #3dff9a;
  --work: #00e5ff;
  --err: #ff4d6d;
  --wait: #ffb020;
  --done: #7cffb2;
  --gold: #ffd56a;
  --warriors: #1d428a;
  --warriors-gold: #ffc72c;
  --font: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  --bot-pipeline: #00e5ff;
  --bot-website_specialist: #b388ff;
  --bot-website_feature_builder: #3dff9a;
  --bot-article_writer: #ff9f43;
  --bot-article_qc: #ff4ecd;
  --bot-social_monitor: #ffe066;
}

* { box-sizing: border-box; }
html, body {
  margin: 0;
  min-height: 100%;
  background:
    radial-gradient(ellipse 80% 50% at 50% -10%, #12203a 0%, transparent 55%),
    radial-gradient(ellipse 40% 30% at 90% 80%, #1a0a3a22 0%, transparent 50%),
    linear-gradient(180deg, var(--bg1), var(--bg0));
  color: var(--fg);
  font-family: var(--font);
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

body.night-shift {
  --bg0: #020306;
  --bg1: #05070c;
  --bg2: #080c14;
  --panel: #060a12f2;
  --fg: #b8c4d8;
  --muted: #5a6a80;
  --neon: #3a8a99;
  --neon2: #4a3a8a;
}
body.night-shift .floor-frame {
  box-shadow: inset 0 0 80px #000a, 0 0 0 1px #0a1520, 0 12px 40px #0008;
}
body.night-shift .bot-sprite .bot-body,
body.night-shift .bot-sprite .bot-head,
body.night-shift .bot-sprite .bot-limb {
  filter: brightness(0.35) contrast(1.2);
}
body.night-shift .station-light { opacity: 1; }
body.night-shift .bubble-group { opacity: 0.85; }
body.night-shift .break-room-zone { fill: #061018; stroke: #1a3040; }

/* —— top bar —— */
.top-bar {
  display: grid;
  grid-template-columns: minmax(160px, 220px) 1fr auto;
  gap: 1rem 1.25rem;
  align-items: center;
  padding: 0.85rem 1.25rem;
  border-bottom: 1px solid var(--line);
  background: linear-gradient(180deg, #0e1628cc, #0a101ccc);
  backdrop-filter: blur(8px);
}
.brand-block .tag {
  margin: 0 0 0.2rem;
  font-size: 0.65rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--dim);
}
.brand-block h1 {
  margin: 0;
  font-size: clamp(1.15rem, 2.5vw, 1.55rem);
  font-weight: 600;
  letter-spacing: -0.03em;
}
.neon {
  color: var(--neon);
  text-shadow: 0 0 12px #00e5ff66, 0 0 28px #00e5ff33;
}

.win-record {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  min-width: 0;
}
.wr-label {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.wr-title {
  font-size: 0.65rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--dim);
}
.wr-demo {
  font-size: 0.6rem;
  padding: 0.1rem 0.4rem;
  border-radius: 999px;
  background: #ffb02022;
  color: var(--wait);
  border: 1px solid #ffb02044;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.wr-periods {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}
.wr-period {
  background: var(--bg2);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0.35rem 0.55rem;
  min-width: 0;
  flex: 1 1 140px;
}
.wr-period h3 {
  margin: 0 0 0.25rem;
  font-size: 0.6rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--muted);
  font-weight: 500;
}
.wr-bots {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem 0.45rem;
  font-size: 0.68rem;
  font-variant-numeric: tabular-nums;
}
.wr-bot {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  padding: 0.1rem 0.35rem;
  border-radius: 4px;
  background: #0a1220;
  border-left: 2px solid var(--c, var(--neon));
}
.wr-bot .w { color: var(--ok); font-weight: 600; }
.wr-bot .l { color: var(--err); font-weight: 600; }
.wr-bot .sep { color: var(--dim); }

.top-controls {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 0.45rem;
}
.night-toggle {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  cursor: pointer;
  user-select: none;
  font-size: 0.75rem;
  color: var(--muted);
}
.night-toggle input { position: absolute; opacity: 0; width: 0; height: 0; }
.toggle-track {
  width: 36px;
  height: 20px;
  border-radius: 999px;
  background: #1a2438;
  border: 1px solid var(--line);
  position: relative;
  transition: background 0.25s;
}
.toggle-knob {
  position: absolute;
  top: 2px; left: 2px;
  width: 14px; height: 14px;
  border-radius: 50%;
  background: var(--muted);
  transition: transform 0.25s, background 0.25s;
}
.night-toggle input:checked + .toggle-track {
  background: #1a2840;
  border-color: #3a5080;
}
.night-toggle input:checked + .toggle-track .toggle-knob {
  transform: translateX(16px);
  background: #8aa0c0;
  box-shadow: 0 0 8px #8aa0c066;
}
.meta {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  font-size: 0.75rem;
  color: var(--muted);
}
.live-dot {
  width: 8px; height: 8px;
  border-radius: 50%;
  background: var(--dim);
  box-shadow: none;
}
.live-dot.on {
  background: var(--ok);
  box-shadow: 0 0 8px var(--ok);
  animation: pulse 1.6s ease infinite;
}
@keyframes pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.45; }
}

/* —— trophy shelf —— */
.trophy-shelf {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.45rem 1.25rem;
  border-bottom: 1px solid var(--line);
  background: linear-gradient(90deg, #12100a88, #0a101c88 40%, #12100a88);
  overflow-x: auto;
}
.shelf-label {
  flex-shrink: 0;
  font-size: 0.6rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--gold);
  text-shadow: 0 0 10px #ffd56a44;
}
.trophies {
  display: flex;
  gap: 0.5rem;
  align-items: center;
}
.trophy {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.15rem;
  min-width: 52px;
  padding: 0.25rem 0.4rem;
  border-radius: 8px;
  border: 1px solid #3a3020;
  background: #121008;
  opacity: 0.28;
  filter: grayscale(1);
  transition: opacity 0.4s, filter 0.4s, transform 0.3s, box-shadow 0.3s;
}
.trophy.earned {
  opacity: 1;
  filter: none;
  border-color: #ffd56a66;
  box-shadow: 0 0 14px #ffd56a33;
  transform: translateY(-1px);
}
.trophy .icon { font-size: 1.25rem; line-height: 1; }
.trophy .name {
  font-size: 0.55rem;
  color: var(--gold);
  letter-spacing: 0.04em;
  text-align: center;
  max-width: 64px;
}

/* —— layout —— */
.ops-layout {
  display: grid;
  grid-template-columns: 1fr minmax(260px, 340px);
  gap: 0;
  min-height: calc(100dvh - 11rem);
}
@media (max-width: 960px) {
  .top-bar { grid-template-columns: 1fr; }
  .top-controls { align-items: flex-start; }
  .ops-layout { grid-template-columns: 1fr; }
}

.board-wrap {
  padding: 0.85rem 1rem 1rem;
  border-right: 1px solid var(--line);
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
}
.floor-frame {
  position: relative;
  border-radius: 12px;
  border: 1px solid #1e3050;
  background: #060a12;
  box-shadow:
    0 0 0 1px #0a152844,
    0 0 40px #00e5ff0a,
    inset 0 0 60px #00101844;
  overflow: hidden;
  transition: box-shadow 0.4s, filter 0.4s;
}
.floor-frame.fx-buzzer {
  animation: buzzerFlash 0.9s ease;
}
@keyframes buzzerFlash {
  0%, 100% { box-shadow: 0 0 0 1px #1e3050, 0 0 40px #00e5ff0a; }
  15%, 45%, 75% { box-shadow: 0 0 0 2px #ff4d6d, 0 0 60px #ff4d6d88, inset 0 0 80px #ff002244; }
  30%, 60% { box-shadow: 0 0 0 2px #ffe066, 0 0 50px #ffe06666; }
}
.floor-frame.fx-warriors {
  animation: warriorsGold 2.2s ease;
}
@keyframes warriorsGold {
  0%, 100% { filter: none; box-shadow: 0 0 0 1px #1e3050, 0 0 40px #00e5ff0a; }
  25% { filter: hue-rotate(-15deg) saturate(1.4); box-shadow: 0 0 0 2px var(--warriors-gold), 0 0 50px #ffc72c66, inset 0 0 70px #1d428a55; }
  50% { filter: hue-rotate(10deg) saturate(1.6); box-shadow: 0 0 0 3px #1d428a, 0 0 70px #ffc72c88, inset 0 0 90px #ffc72c33; }
  75% { filter: hue-rotate(-5deg); box-shadow: 0 0 0 2px var(--warriors-gold), 0 0 40px #1d428a66; }
}
#floor {
  width: 100%;
  height: auto;
  display: block;
}
.floor-caption {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.35rem 0.75rem 0.5rem;
  font-size: 0.65rem;
  color: var(--dim);
  letter-spacing: 0.04em;
  border-top: 1px solid #152030;
  background: #080e18;
}

/* SVG stations */
.station-box {
  fill: #0e1828;
  stroke: #2a4060;
  stroke-width: 1.5;
  filter: url(#glow);
}
.station-box.lit {
  stroke: var(--neon);
  fill: #102030;
}
.station-label {
  fill: var(--dim);
  font-size: 9px;
  font-family: var(--font);
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.station-name {
  fill: var(--fg);
  font-size: 12px;
  font-family: var(--font);
  font-weight: 600;
}
.station-accent {
  stroke-width: 2;
  fill: none;
  opacity: 0.7;
}
.break-room-zone {
  fill: #0a1820;
  stroke: #1a4050;
  stroke-width: 1.5;
  stroke-dasharray: 6 4;
}
.break-room-label {
  fill: #4a8a9a;
  font-size: 11px;
  font-family: var(--font);
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.station-light {
  opacity: 0;
  transition: opacity 0.4s;
}
body.night-shift .station-light.on { opacity: 0.9; }

/* bots */
.bot-sprite {
  transition: transform 0.9s cubic-bezier(0.4, 0.1, 0.2, 1);
}
.bot-sprite .bot-body { transition: fill 0.3s, stroke 0.3s; }
.bot-sprite.moving .ball {
  animation: dribble 0.35s ease-in-out infinite;
}
.bot-sprite.moving .arm-dribble {
  animation: armDribble 0.35s ease-in-out infinite;
}
@keyframes dribble {
  0%, 100% { transform: translate(0, 0); }
  50% { transform: translate(0, 8px); }
}
@keyframes armDribble {
  0%, 100% { transform: rotate(0deg); }
  50% { transform: rotate(18deg); }
}
.bubble {
  fill: #0e1828ee;
  stroke: #3a5080;
  stroke-width: 1.25;
  filter: url(#softGlow);
}
.bubble.working { stroke: var(--work); }
.bubble.error { stroke: var(--err); }
.bubble.done { stroke: var(--done); }
.bubble.waiting { stroke: var(--wait); }
.bubble-text {
  fill: var(--fg);
  font-size: 9.5px;
  font-family: var(--font);
}
.bot-label {
  fill: var(--fg);
  font-size: 9px;
  font-family: var(--font);
  font-weight: 600;
  text-anchor: middle;
  letter-spacing: 0.02em;
}
.bot-state-ring {
  fill: none;
  stroke-width: 1.5;
  opacity: 0.8;
}

/* demo bar */
.demo-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.45rem;
}
.demo-label {
  font-size: 0.6rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--dim);
  margin-right: 0.25rem;
}
.btn-demo, .btn-neon {
  font-family: var(--font);
  font-size: 0.72rem;
  padding: 0.4rem 0.7rem;
  border-radius: 8px;
  border: 1px solid #2a4060;
  background: linear-gradient(180deg, #152038, #0e1628);
  color: var(--fg);
  cursor: pointer;
  transition: border-color 0.2s, box-shadow 0.2s, transform 0.15s;
}
.btn-demo:hover, .btn-neon:hover {
  border-color: var(--neon);
  box-shadow: 0 0 14px #00e5ff33;
  transform: translateY(-1px);
}
.btn-demo.gold:hover {
  border-color: var(--warriors-gold);
  box-shadow: 0 0 14px #ffc72c44;
}
.btn-demo.celebrate:hover {
  border-color: var(--gold);
  box-shadow: 0 0 16px #ffd56a44;
}

/* side panel */
.side-panel {
  display: flex;
  flex-direction: column;
  background: var(--panel);
  min-height: 0;
}
.fleet-panel, .chat-panel {
  padding: 0.9rem 1rem;
}
.fleet-panel {
  border-bottom: 1px solid var(--line);
  max-height: 42%;
  overflow: auto;
}
.chat-panel {
  flex: 1;
  min-height: 200px;
  display: flex;
  flex-direction: column;
}
.side-panel h2 {
  margin: 0 0 0.65rem;
  font-size: 0.65rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--dim);
  font-weight: 600;
}
.fleet {
  list-style: none;
  margin: 0;
  padding: 0;
}
.fleet li {
  display: grid;
  grid-template-columns: 10px 1fr;
  gap: 0.35rem 0.55rem;
  padding: 0.5rem 0;
  border-bottom: 1px solid #152030;
  font-size: 0.8rem;
}
.fleet .dot {
  width: 8px; height: 8px;
  border-radius: 50%;
  margin-top: 0.35rem;
  background: var(--dim);
  box-shadow: 0 0 6px transparent;
}
.fleet .dot.working { background: var(--work); box-shadow: 0 0 8px var(--work); }
.fleet .dot.done { background: var(--done); box-shadow: 0 0 6px var(--done); }
.fleet .dot.error { background: var(--err); box-shadow: 0 0 8px var(--err); }
.fleet .dot.waiting { background: var(--wait); box-shadow: 0 0 6px var(--wait); }
.fleet .dot.idle { background: var(--dim); }
.fleet .name { font-weight: 600; }
.fleet .name .state { font-weight: 400; color: var(--muted); font-size: 0.72rem; }
.fleet .msg { grid-column: 2; color: var(--muted); font-size: 0.72rem; line-height: 1.35; }

.chat-log {
  list-style: none;
  margin: 0;
  padding: 0;
  overflow: auto;
  flex: 1;
  font-family: var(--mono);
  font-size: 0.68rem;
  line-height: 1.45;
}
.chat-log li {
  padding: 0.4rem 0.5rem;
  margin-bottom: 0.3rem;
  border-radius: 6px;
  border-left: 3px solid var(--c, var(--neon));
  background: #0a1220aa;
  color: var(--muted);
}
.chat-log .who {
  color: var(--c, var(--fg));
  font-weight: 600;
}
.chat-log time {
  color: var(--dim);
  font-size: 0.62rem;
}
.chat-log .msg { color: var(--fg); }

.ops-footer {
  padding: 0.55rem 1.25rem 0.85rem;
  border-top: 1px solid var(--line);
  font-size: 0.7rem;
  color: var(--dim);
}
.ops-footer code { color: var(--muted); font-family: var(--mono); }

/* boss fight overlay */
.boss-overlay {
  position: fixed;
  inset: 0;
  z-index: 100;
  display: flex;
  align-items: center;
  justify-content: center;
  background: radial-gradient(circle at 50% 40%, #1a1030ee, #000c);
  animation: bossIn 0.45s ease;
}
.boss-overlay[hidden] { display: none !important; }
@keyframes bossIn {
  from { opacity: 0; }
  to { opacity: 1; }
}
.boss-card {
  text-align: center;
  padding: 2rem 2.5rem;
  border-radius: 16px;
  border: 1px solid #ffd56a88;
  background: linear-gradient(160deg, #1a1420, #0a101c);
  box-shadow: 0 0 60px #ffd56a44, 0 0 120px #7c5cff33;
  animation: bossPop 0.55s cubic-bezier(0.2, 1.4, 0.4, 1);
}
@keyframes bossPop {
  from { transform: scale(0.7); opacity: 0; }
  to { transform: scale(1); opacity: 1; }
}
.boss-trophy {
  font-size: 3.5rem;
  animation: trophySpin 1.2s ease;
  filter: drop-shadow(0 0 20px #ffd56a88);
}
@keyframes trophySpin {
  0% { transform: rotate(-20deg) scale(0.5); }
  60% { transform: rotate(12deg) scale(1.15); }
  100% { transform: rotate(0) scale(1); }
}
.boss-card h2 {
  margin: 0.5rem 0 0.35rem;
  font-size: 1.75rem;
  letter-spacing: 0.12em;
  color: var(--gold);
  text-shadow: 0 0 20px #ffd56a66;
}
.boss-card p {
  margin: 0 0 1.25rem;
  color: var(--muted);
  font-size: 0.9rem;
}

#fx-layer {
  pointer-events: none;
  position: fixed;
  inset: 0;
  z-index: 50;
  overflow: hidden;
}
.fx-spark {
  position: absolute;
  width: 6px; height: 6px;
  border-radius: 50%;
  background: var(--gold);
  box-shadow: 0 0 10px var(--gold);
  animation: sparkFly 1s ease-out forwards;
}
@keyframes sparkFly {
  to { transform: translate(var(--dx), var(--dy)) scale(0); opacity: 0; }
}

/* —— live pipeline strip —— */
.pipeline-strip {
  margin: 0 1.25rem 0.75rem;
  padding: 0.65rem 0.9rem 0.75rem;
  border-radius: 12px;
  border: 1px solid #1c3a55;
  background: linear-gradient(135deg, #0a1522ee, #0c1a2cee);
  box-shadow: inset 0 0 0 1px #00e5ff22, 0 4px 20px #0006;
}
.ps-head {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  margin-bottom: 0.45rem;
}
.ps-title {
  font-size: 0.68rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #7a8ba8;
  font-weight: 600;
}
.ps-mode {
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 0.15rem 0.45rem;
  border-radius: 999px;
  border: 1px solid #00e5ff66;
  color: #00e5ff;
  background: #00e5ff14;
}
.ps-mode.live {
  border-color: #ff4d6d88;
  color: #ff8fa3;
  background: #ff4d6d18;
}
.ps-live-tag {
  margin-left: auto;
  font-size: 0.62rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #3dff9a;
}
.ps-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 0.45rem;
}
.ps-cell {
  min-width: 0;
  padding: 0.35rem 0.45rem;
  border-radius: 8px;
  background: #060a12aa;
  border: 1px solid #1a2a40;
}
.ps-cell.ps-wide { grid-column: span 1; }
.ps-k {
  display: block;
  font-size: 0.58rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #5a6a80;
  margin-bottom: 0.15rem;
}
.ps-v {
  display: block;
  font-size: 0.78rem;
  color: #e8f0ff;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-variant-numeric: tabular-nums;
}
@media (max-width: 1100px) {
  .ps-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 700px) {
  .ps-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pipeline-strip { margin: 0 0.75rem 0.6rem; }
}

/* —— plain-English overview strip —— */
.ops-overview {
  margin: 0.75rem 1.25rem 0.65rem;
  padding: 0.85rem 1rem 1rem;
  border-radius: 14px;
  border: 1px solid #2a3f66;
  background:
    linear-gradient(135deg, #0e1a30ee, #0a1424f2),
    radial-gradient(ellipse 60% 80% at 0% 0%, #00e5ff14, transparent 55%);
  box-shadow: inset 0 0 0 1px #00e5ff18, 0 8px 28px #0007;
}
.ov-summary-wrap { margin-bottom: 0.75rem; }
.ov-kicker {
  margin: 0 0 0.35rem;
  font-size: 0.62rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--dim);
  font-weight: 600;
}
.ov-summary {
  margin: 0;
  font-size: clamp(0.95rem, 1.6vw, 1.12rem);
  line-height: 1.45;
  color: var(--fg);
  font-weight: 500;
  max-width: 72rem;
}
.ov-cards {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.65rem;
}
.ov-card {
  min-width: 0;
  padding: 0.65rem 0.75rem 0.7rem;
  border-radius: 10px;
  background: #060b14cc;
  border: 1px solid #1c2a44;
}
.ov-card[data-kind="build"] { border-top: 2px solid #3dff9a; }
.ov-card[data-kind="email"] { border-top: 2px solid #b388ff; }
.ov-card[data-kind="pipeline"] { border-top: 2px solid #00e5ff; }
.ov-card[data-kind="website"] { border-top: 2px solid #ff9f43; }
.ov-card h3 {
  margin: 0 0 0.35rem;
  font-size: 0.62rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--muted);
  font-weight: 600;
}
.ov-headline {
  margin: 0 0 0.45rem;
  font-size: 0.86rem;
  line-height: 1.35;
  color: var(--fg);
  font-weight: 600;
}
.ov-bullets, .ov-build-list {
  margin: 0;
  padding: 0;
  list-style: none;
}
.ov-bullets li, .ov-build-list li {
  font-size: 0.72rem;
  line-height: 1.35;
  color: var(--muted);
  padding: 0.12rem 0;
  border-top: 1px solid #15223866;
}
.ov-bullets li:first-child, .ov-build-list li:first-child { border-top: 0; }
.ov-build-list {
  max-height: 9.5rem;
  overflow-y: auto;
}
.ov-build-list li::before {
  content: "✓ ";
  color: var(--ok);
  font-weight: 700;
}
.ov-build-list li.building::before { content: "… "; color: var(--wait); }
.ov-build-list li.waiting::before { content: "○ "; color: var(--dim); }
.ov-build-list li.error::before { content: "! "; color: var(--err); }
@media (max-width: 1100px) {
  .ov-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 700px) {
  .ops-overview { margin: 0.6rem 0.75rem; }
  .ov-cards { grid-template-columns: 1fr; }
}