/**
 * OVKON mark — brand icon (symbol only; not the logo lockup).
 * Default: ovkon-icon.png · Optional SVG for signal / experimental.
 */

.ov-mark {
  --ov-mark-size: 2.5rem;
  display: inline-grid;
  place-items: center;
  width: var(--ov-mark-size);
  height: var(--ov-mark-size);
  flex: 0 0 auto;
  line-height: 0;
  vertical-align: middle;
}

.ov-mark-svg {
  width: 100%;
  height: 100%;
  display: block;
  overflow: visible;
}

.ov-mark-figure {
  display: block;
  width: 100%;
  height: 100%;
}

.ov-mark-img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
  user-select: none;
  -webkit-user-drag: none;
}

.ov-mark--svg .ov-mark-figure,
.ov-mark--svg .ov-mark-shape {
  transform-origin: 60px 60px;
  transform-box: fill-box;
}

.ov-mark--img .ov-mark-figure,
.ov-mark--img .ov-mark-shape {
  transform-origin: center center;
  transform-box: border-box;
}

/* —— Variants —— */
.ov-mark--mono.ov-mark--svg .ov-mark-shape {
  fill: var(--ov-ink, #050505) !important;
}
.ov-mark--inverse.ov-mark--svg .ov-mark-shape {
  fill: var(--ov-white, #FFFFFF) !important;
}
.ov-mark--signal.ov-mark--svg .ov-mark-shape {
  fill: var(--ov-signal, #C8F547) !important;
}
.ov-mark--mono.ov-mark--img .ov-mark-img {
  filter: brightness(0);
}
.ov-mark--inverse.ov-mark--img .ov-mark-img {
  filter: brightness(0) invert(1);
}

/* —— States —— */
.ov-mark--idle .ov-mark-figure,
.ov-mark--orbit .ov-mark-figure {
  animation: ovMarkIdleSpin var(--ov-dur-orbit, 28s) linear infinite;
}
.ov-mark--idle .ov-mark-shape,
.ov-mark--orbit .ov-mark-shape {
  animation: ovMarkIdleBreath 4.5s var(--ov-ease, ease) infinite;
}

.ov-mark--pulse .ov-mark-figure,
.ov-mark--activation .ov-mark-figure {
  animation: ovMarkPulseSpin 2.4s linear infinite;
}
.ov-mark--pulse .ov-mark-shape,
.ov-mark--activation .ov-mark-shape {
  animation: ovMarkPulseScale 1.2s var(--ov-ease, ease) infinite;
}

.ov-mark--load .ov-mark-figure {
  animation: ovMarkLoadSpin 0.85s linear infinite;
}
.ov-mark--load .ov-mark-shape {
  opacity: 0.9;
  animation: ovMarkIdleBreath 1.4s var(--ov-ease, ease) infinite;
}

.ov-mark--depart .ov-mark-figure {
  animation: ovMarkDepartSpin 0.7s var(--ov-ease, ease) forwards;
}
.ov-mark--depart .ov-mark-shape {
  animation: ovMarkDepartCore 0.7s var(--ov-ease, ease) forwards;
}

.ov-mark--convergence .ov-mark-figure {
  animation: ovMarkConverge 0.8s var(--ov-ease, ease) forwards;
}
.ov-mark--convergence .ov-mark-shape {
  animation: ovMarkConvergeCore 0.8s var(--ov-ease, ease) forwards;
}

.ov-mark--core .ov-mark-figure {
  animation: ovMarkCoreSettle 0.9s var(--ov-ease, ease) forwards;
}
.ov-mark--core .ov-mark-shape {
  animation: ovMarkCoreHold 0.9s var(--ov-ease, ease) forwards;
}

.ov-mark--static .ov-mark-figure,
.ov-mark--static .ov-mark-shape,
.ov-mark--dormant .ov-mark-figure,
.ov-mark--dormant .ov-mark-shape {
  animation: none;
}

@keyframes ovMarkIdleSpin {
  to { transform: rotate(360deg); }
}
@keyframes ovMarkIdleBreath {
  0%, 100% { transform: scale(1); opacity: 1; }
  50% { transform: scale(1.03); opacity: 0.94; }
}
@keyframes ovMarkPulseSpin {
  to { transform: rotate(360deg); }
}
@keyframes ovMarkPulseScale {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.06); }
}
@keyframes ovMarkLoadSpin {
  to { transform: rotate(360deg); }
}
@keyframes ovMarkDepartSpin {
  to { transform: rotate(120deg) scale(1.25); opacity: 0; }
}
@keyframes ovMarkDepartCore {
  to { transform: scale(0.5); opacity: 0; }
}
@keyframes ovMarkConverge {
  0% { transform: rotate(0deg) scale(1); opacity: 1; }
  100% { transform: rotate(36deg) scale(0.82); opacity: 0.55; }
}
@keyframes ovMarkConvergeCore {
  0% { transform: scale(1); }
  100% { transform: scale(1.08); }
}
@keyframes ovMarkCoreSettle {
  to { transform: rotate(8deg) scale(0.92); opacity: 0.7; }
}
@keyframes ovMarkCoreHold {
  to { transform: scale(1); opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
  .ov-mark--idle .ov-mark-figure,
  .ov-mark--idle .ov-mark-shape,
  .ov-mark--orbit .ov-mark-figure,
  .ov-mark--orbit .ov-mark-shape,
  .ov-mark--pulse .ov-mark-figure,
  .ov-mark--pulse .ov-mark-shape,
  .ov-mark--activation .ov-mark-figure,
  .ov-mark--activation .ov-mark-shape,
  .ov-mark--load .ov-mark-figure,
  .ov-mark--load .ov-mark-shape,
  .ov-mark--depart .ov-mark-figure,
  .ov-mark--depart .ov-mark-shape,
  .ov-mark--convergence .ov-mark-figure,
  .ov-mark--convergence .ov-mark-shape,
  .ov-mark--core .ov-mark-figure,
  .ov-mark--core .ov-mark-shape {
    animation: none !important;
  }
}