/* OYVRA feel layer — motion, atmosphere, swipe emotion */

.shell--discover .workspace {
  background:
    radial-gradient(900px 420px at 18% -10%, rgba(216,106,154,.16), transparent 55%),
    radial-gradient(700px 380px at 90% 8%, rgba(124,77,255,.12), transparent 50%),
    linear-gradient(180deg, #fbf8fc 0%, #f3eef8 100%);
}
.shell--home .workspace {
  background: var(--oyvra-background);
}
.shell--profile .workspace {
  background: var(--oyvra-background);
}
.shell--profile .pv-hero,
.shell--profile .pv-panel,
.shell--profile .pv-side {
  animation: oyvraFeedRise .5s cubic-bezier(.2,.8,.2,1) both;
}
.shell--profile .pv-panel:nth-of-type(1) { animation-delay: .05s; }
.shell--profile .pv-panel:nth-of-type(2) { animation-delay: .09s; }
.shell--profile .pv-panel:nth-of-type(3) { animation-delay: .13s; }
.shell--profile .pv-panel:nth-of-type(4) { animation-delay: .17s; }
.shell--profile .pv-panel:nth-of-type(5) { animation-delay: .21s; }
.shell--profile .pv-side:nth-child(1) { animation-delay: .08s; }
.shell--profile .pv-side:nth-child(2) { animation-delay: .12s; }
.shell--profile .pv-side:nth-child(3) { animation-delay: .16s; }
.shell--profile .pv-side:nth-child(4) { animation-delay: .2s; }
.shell--profile .pv-act { transition: transform .18s ease, box-shadow .18s ease; }
.shell--profile .pv-act:hover { transform: translateY(-2px); }
.shell--home .feed-card {
  animation: oyvraFeedRise .55s cubic-bezier(.2,.8,.2,1) both;
}
.shell--home .feed-card:nth-child(2) { animation-delay: .05s; }
.shell--home .feed-card:nth-child(3) { animation-delay: .1s; }
.shell--home .feed-card:nth-child(4) { animation-delay: .15s; }
.shell--home .feed-card:nth-child(5) { animation-delay: .2s; }
@keyframes oyvraFeedRise {
  from { opacity: 0; transform: translateY(16px) scale(.985); }
  to { opacity: 1; transform: none; }
}

.discover-shell { position: relative; }
.discover-glow {
  position: absolute;
  inset: -40px -20px auto;
  height: 280px;
  background: radial-gradient(closest-side, rgba(216,106,154,.22), transparent 70%);
  pointer-events: none;
  animation: oyvraGlowDrift 8s ease-in-out infinite alternate;
}
@keyframes oyvraGlowDrift {
  from { transform: translateX(-12px); opacity: .7; }
  to { transform: translateX(18px); opacity: 1; }
}

/* —— Discover filter bar (mockup) —— */
.disc-filterbar {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 18px;
  padding: 10px 12px;
  border-radius: 999px;
  background: #fff;
  border: 1px solid rgba(124, 77, 255, 0.08);
  box-shadow: 0 8px 28px rgba(37, 33, 43, 0.07);
}
.disc-tabs {
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 1;
  min-width: 0;
  overflow-x: auto;
  scrollbar-width: none;
}
.disc-tabs::-webkit-scrollbar { display: none; }
.disc-tab {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
  min-height: 40px;
  padding: 0 16px;
  border-radius: 999px;
  background: #f3f4f6;
  color: #4b5563;
  font-size: 14px;
  font-weight: 700;
  text-decoration: none;
  transition: background .15s ease, color .15s ease;
}
.disc-tab iconify-icon { color: inherit; }
.disc-tab:hover { background: #ebecef; color: #374151; }
.disc-tab.is-on {
  background: #f3e8ff;
  color: #6b21a8;
}
.disc-filters-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
  margin-left: auto;
  min-height: 40px;
  padding: 0 14px;
  border-radius: 999px;
  background: #fff;
  border: 1px solid #e5e7eb;
  color: #4b5563;
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
}
.disc-filters-btn.is-on,
.disc-filters-btn[aria-expanded="true"] {
  border-color: rgba(124, 77, 255, 0.35);
  color: #6b21a8;
}
.disc-filters-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 20px;
  height: 20px;
  padding: 0 6px;
  border-radius: 999px;
  background: var(--oyvra-primary, #7c4dff);
  color: #fff;
  font-size: 11px;
  font-weight: 800;
}
.disc-filters-panel {
  position: relative;
  z-index: 1;
  margin: -6px 0 18px;
  padding: 14px 16px 12px;
  border-radius: 20px;
  background: rgba(255,255,255,.85);
  border: 1px solid rgba(124, 77, 255, 0.1);
  box-shadow: 0 8px 24px rgba(37, 33, 43, 0.06);
}
.disc-filters-panel[hidden] { display: none !important; }
.disc-filters-form {
  display: grid;
  grid-template-columns: 1fr 1fr auto;
  gap: 10px 12px;
  align-items: end;
  margin-top: 8px;
}
.disc-filters-form .field { margin: 0; }
.disc-filters-form .field label { margin-bottom: 4px; font-size: 12px; }
.disc-filters-extra {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 14px;
  margin-top: 12px;
  padding-top: 10px;
  border-top: 1px solid var(--oyvra-border);
}
.disc-filters-extra a,
.disc-undo-inline button {
  font-size: 13px;
  font-weight: 700;
  color: var(--oyvra-primary);
  background: none;
  border: 0;
  padding: 0;
  cursor: pointer;
  text-decoration: none;
}
.disc-undo-inline { margin: 0; display: inline; }

.page--discover .discover-layout {
  grid-template-columns: minmax(0, 1.2fr) minmax(300px, 380px);
  gap: 22px;
  align-items: start;
}
.page--discover .discover-side .section-head h2,
.page--discover .side-head h2 {
  font-size: 16px;
  letter-spacing: -0.01em;
  margin: 0;
}

/* —— Card chrome —— */
.online-pill {
  position: absolute;
  top: 14px; left: 14px; z-index: 4;
  display: inline-flex; align-items: center; gap: 6px;
  min-height: 28px; padding: 0 10px; border-radius: 999px;
  background: rgba(12, 18, 12, .42);
  backdrop-filter: blur(10px);
  color: #fff; font-size: 12px; font-weight: 700;
}
.online-dot {
  width: 7px; height: 7px; border-radius: 50%;
  background: #22c55e;
  box-shadow: 0 0 0 3px rgba(34, 197, 94, .28);
}
.photo-count {
  position: absolute; top: 14px; right: 52px; z-index: 4;
  min-height: 28px; padding: 0 10px; border-radius: 999px;
  display: inline-flex; align-items: center;
  background: rgba(12, 8, 20, .4);
  backdrop-filter: blur(10px);
  color: #fff; font-size: 12px; font-weight: 700;
}
.card-more {
  position: absolute; top: 12px; right: 12px; z-index: 5;
  width: 42px; height: 42px; border-radius: 50%;
  display: grid; place-items: center;
  background: rgba(12, 8, 20, .38);
  backdrop-filter: blur(10px);
  color: #fff;
  pointer-events: auto;
}
.card-more iconify-icon { width: 22px; height: 22px; }
.photo-nav {
  position: absolute; top: 50%; z-index: 5;
  transform: translateY(-50%);
  width: 48px; height: 48px; border: 0; border-radius: 50%;
  display: grid; place-items: center;
  background: rgba(255,255,255,.94);
  color: var(--oyvra-text);
  box-shadow: 0 8px 22px rgba(20, 8, 30, .18);
  cursor: pointer;
  opacity: 0;
  pointer-events: auto;
  transition: opacity .2s ease;
}
.photo-nav iconify-icon { width: 24px; height: 24px; }
.swipe-card.is-top:hover .photo-nav,
.swipe-card.is-top:focus-within .photo-nav { opacity: 1; }
.photo-nav--prev { left: 12px; }
.photo-nav--next { right: 12px; }
.swipe-photo:has(.photo-count) .photo-pips { display: none; }

.disc-tags {
  display: flex; flex-wrap: wrap; gap: 6px;
  margin-top: 12px;
}
.disc-tag {
  display: inline-flex; align-items: center; gap: 6px;
  min-height: 32px; padding: 0 12px; border-radius: 999px;
  background: rgba(255,255,255,.16);
  border: 1px solid rgba(255,255,255,.22);
  color: #fff; font-size: 13px; font-weight: 700;
}
.disc-tag iconify-icon { width: 16px; height: 16px; }
.disc-tag--more { background: rgba(255,255,255,.1); }
.disc-meta {
  display: flex; flex-wrap: wrap; gap: 10px 16px; margin-top: 12px;
}
.disc-meta-item {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 13px; font-weight: 600; color: rgba(255,255,255,.9);
}
.disc-meta-item iconify-icon { width: 16px; height: 16px; }

/* Side cards */
.side-head {
  display: flex; align-items: center; justify-content: space-between;
  gap: 12px; margin: 0 0 14px;
}
.side-head h2 { font-size: 17px; }
.side-see-all {
  display: inline-flex; align-items: center; gap: 2px;
  font-size: 14px; font-weight: 700; color: var(--oyvra-primary);
  text-decoration: none; white-space: nowrap;
}
.side-see-all iconify-icon { width: 16px; height: 16px; }
.side-people {
  display: grid; grid-template-columns: 1fr 1fr; gap: 14px;
}
.side-card {
  position: relative;
  border-radius: 18px;
  overflow: hidden;
  background: #1a1220;
  box-shadow: 0 10px 26px rgba(28, 12, 40, .12);
  transition: transform .18s ease, box-shadow .18s ease;
}
.side-card:hover { transform: translateY(-2px); box-shadow: 0 14px 32px rgba(28, 12, 40, .16); }
.side-card__media {
  display: block;
  width: 100%;
  aspect-ratio: 3 / 4;
  overflow: hidden;
  position: relative;
  background: #2a2030;
}
.side-card__media img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
  display: block;
  transition: transform .45s ease;
}
.side-card:hover .side-card__media img { transform: scale(1.04); }
.side-card__like { position: absolute; top: 10px; right: 10px; z-index: 3; margin: 0; }
.side-card__like button {
  width: 38px; height: 38px; border: 0; border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center;
  line-height: 0;
  background: rgba(255,255,255,.95); color: #fd5068;
  box-shadow: 0 6px 16px rgba(20, 8, 30, .16); cursor: pointer;
}
.side-card__like button iconify-icon {
  display: block !important;
  width: 20px !important;
  height: 20px !important;
  font-size: 20px;
  line-height: 0;
}
.side-card__body {
  position: absolute; left: 0; right: 0; bottom: 0;
  padding: 36px 12px 12px;
  background: linear-gradient(180deg, transparent, rgba(12, 8, 20, .84));
  color: #fff; pointer-events: none;
}
.side-card__name {
  display: inline-flex; align-items: center; gap: 6px;
  color: #fff; text-decoration: none; font-size: 15px; font-weight: 800;
  pointer-events: auto; line-height: 1.2;
}
.side-online {
  width: 8px; height: 8px; border-radius: 50%;
  background: #22c55e; box-shadow: 0 0 0 2px rgba(34, 197, 94, .35);
}
.side-card__role { margin: 3px 0 0; font-size: 12px; font-weight: 600; opacity: .9; }
.side-card__tags { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 8px; }
.side-card__tags span {
  display: inline-flex; align-items: center; min-height: 24px; padding: 0 9px;
  border-radius: 999px; background: rgba(255,255,255,.18);
  border: 1px solid rgba(255,255,255,.2); font-size: 11px; font-weight: 700;
}
.recent-row {
  display: flex; gap: 12px; overflow-x: auto; padding: 2px;
  scrollbar-width: none;
}
.recent-row::-webkit-scrollbar { display: none; }
.recent-avatar {
  flex: 0 0 auto; width: 64px; text-align: center;
  text-decoration: none; color: var(--oyvra-text);
}
.recent-avatar img {
  width: 56px; height: 56px; border-radius: 50%; object-fit: cover;
  display: block; margin: 0 auto 6px;
  border: 2px solid transparent;
  box-shadow: 0 4px 12px rgba(28, 12, 40, .1);
}
.recent-avatar.is-active img,
.recent-avatar:hover img { border-color: var(--oyvra-primary); }
.recent-avatar span {
  display: block; font-size: 11px; font-weight: 700;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.page--discover .side-block + .side-block {
  margin-top: 6px; padding-top: 16px;
  border-top: 1px solid var(--oyvra-border);
}

.page--discover .feature-card {
  background: #1a1220;
  box-shadow: 0 24px 60px rgba(28, 12, 40, 0.22);
}
.page--discover .swipe-stack {
  position: relative;
  z-index: 1;
  width: 100%;
  height: clamp(500px, 60vh, 620px);
  overflow: visible;
  padding-bottom: 14px;
  box-sizing: content-box;
}
.page--discover .swipe-stack .swipe-card,
.page--discover .feature-card.swipe-card {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  min-height: 0;
  max-height: none;
  aspect-ratio: auto;
  border-radius: 26px;
  overflow: hidden;
}
.swipe-photo {
  position: absolute;
  inset: 0;
  z-index: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  isolation: isolate;
  contain: paint;
  background: #1a1220;
  border-radius: inherit;
}
.swipe-photo-layers {
  position: absolute;
  inset: 0;
  z-index: 0;
}
.swipe-photo-layer {
  position: absolute;
  inset: 0;
  background-color: #1a1220;
  background-size: cover;
  background-position: center top;
  background-repeat: no-repeat;
  opacity: 0;
  transition: opacity .28s ease;
}
.swipe-photo-layer.is-on {
  opacity: 1;
}
.swipe-photo img,
.swipe-photo .swipe-photo-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
  pointer-events: none;
  user-select: none;
  animation: none !important;
  transform: none !important;
  filter: none !important;
}
.swipe-photo:has(.swipe-photo-layers) .swipe-photo-img {
  opacity: 0;
  visibility: hidden;
}
.photo-pips {
  position: absolute; top: 14px; left: 14px; right: 14px;
  display: flex; gap: 4px; z-index: 3;
}
.photo-pips span {
  flex: 1; height: 3px; border-radius: 99px;
  background: rgba(255,255,255,.28);
}
.photo-pips span.is-on { background: #fff; }

.page--discover .feature-info {
  padding: 48px 22px 20px;
  background: linear-gradient(180deg, transparent 0%, rgba(12,8,20,.2) 32%, rgba(12,8,20,.88) 100%);
  pointer-events: none;
}
.feature-name-row {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
}
.page--discover .feature-info h2 {
  font-family: var(--oyvra-display);
  font-size: clamp(28px, 3.6vw, 38px);
  font-weight: 700;
  display: block;
  letter-spacing: -0.02em;
}
.page--discover .feature-info .role { margin-top: 4px; font-size: 14px; font-weight: 600; opacity: .9; }
.page--discover .feature-info .bio {
  margin-top: 10px; font-size: 14px; line-height: 1.45; max-width: 40ch; opacity: .94;
  -webkit-line-clamp: 2; display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden;
}
.why-line {
  margin-top: 10px;
  font-size: 12px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: rgba(255,230,245,.85);
}
.badge-fit { background: rgba(216,106,154,.95) !important; }

.swipe-mood {
  position: absolute;
  inset: -8% -6%;
  border-radius: 36px;
  opacity: 0;
  pointer-events: none;
  transition: opacity .2s ease, background .2s ease;
  z-index: 0;
}
.swipe-mood.is-on { opacity: 1; }
.swipe-mood.mood-like { background: radial-gradient(circle at 70% 40%, rgba(34,197,94,.22), transparent 55%); }
.swipe-mood.mood-pass { background: radial-gradient(circle at 30% 40%, rgba(239,68,68,.2), transparent 55%); }
.swipe-mood.mood-super { background: radial-gradient(circle at 50% 20%, rgba(59,130,246,.24), transparent 55%); }
.swipe-mood.mood-connect { background: radial-gradient(circle at 50% 80%, rgba(216,106,154,.24), transparent 55%); }

.swipe-burst {
  position: absolute;
  left: 50%; top: 42%;
  width: 0; height: 0;
  z-index: 8;
  pointer-events: none;
  opacity: 0;
}
.swipe-burst.is-on { opacity: 1; }
.swipe-burst span {
  position: absolute;
  left: 0; top: 0;
  font-size: 42px;
  color: #fff;
  animation: oyvraBurstOut .95s cubic-bezier(.15,.8,.2,1) forwards;
  animation-delay: calc(var(--i) * 35ms);
  text-shadow: 0 10px 24px rgba(0,0,0,.28);
}
@keyframes oyvraBurstOut {
  0% { opacity: 0; transform: rotate(var(--a)) translateY(0) scale(.4); }
  25% { opacity: 1; }
  100% { opacity: 0; transform: rotate(var(--a)) translateY(-180px) scale(1.45); }
}

.swipe-fx {
  position: absolute;
  inset: -8% -4%;
  z-index: 9;
  pointer-events: none;
  overflow: hidden;
  border-radius: 28px;
}
.fx-ring {
  position: absolute;
  width: 28px;
  height: 28px;
  margin: -14px 0 0 -14px;
  border-radius: 50%;
  border: 3px solid rgba(255,255,255,.9);
  animation: oyvraFxRing .85s ease-out forwards;
}
.fx-ring-like { border-color: rgba(253, 92, 138, .95); box-shadow: 0 0 32px rgba(253, 92, 138, .55); }
.fx-ring-super { border-color: rgba(96, 165, 250, .98); box-shadow: 0 0 36px rgba(96, 165, 250, .55); }
.fx-ring-connect { border-color: rgba(192, 132, 252, .98); box-shadow: 0 0 32px rgba(192, 132, 252, .5); }
.fx-ring-pass { border-color: rgba(251, 113, 133, .8); }
@keyframes oyvraFxRing {
  0% { opacity: .95; transform: scale(.35); }
  100% { opacity: 0; transform: scale(11); }
}

.fx-bit {
  position: absolute;
  left: 0; top: 0;
  font-size: calc(34px * var(--s, 1));
  line-height: 1;
  margin: 0;
  transform: translate(-50%, -50%);
  animation: oyvraFxBit var(--life, 1.15s) cubic-bezier(.12,.7,.2,1) forwards;
  animation-delay: var(--d, 0ms);
  text-shadow: 0 8px 20px rgba(20, 8, 30, .32);
  will-change: transform, opacity;
}
.fx-heart { filter: drop-shadow(0 6px 14px rgba(253, 92, 138, .45)); }
.fx-heart-sm { font-size: calc(26px * var(--s, 1)); }
.fx-star { filter: drop-shadow(0 6px 14px rgba(96, 165, 250, .45)); }
.fx-star-sm { font-size: calc(24px * var(--s, 1)); }
@keyframes oyvraFxBit {
  0% {
    opacity: 0;
    transform: translate(-50%, -50%) scale(.25) rotate(0deg);
  }
  18% { opacity: 1; }
  100% {
    opacity: 0;
    transform: translate(calc(-50% + var(--dx)), calc(-50% + var(--dy))) scale(calc(var(--s, 1) * 1.15)) rotate(var(--rot));
  }
}

.fx-float {
  position: absolute;
  font-size: calc(32px * var(--s, 1));
  line-height: 1;
  animation: oyvraFxFloat var(--life, 1.8s) ease-out forwards;
  animation-delay: var(--d, 0ms);
  text-shadow: 0 10px 22px rgba(20, 8, 30, .28);
  will-change: transform, opacity;
}
.fx-float-heart { filter: drop-shadow(0 6px 16px rgba(253, 92, 138, .5)); }
.fx-float-star { filter: drop-shadow(0 6px 16px rgba(251, 191, 36, .45)); }
.fx-match-rain {
  animation-name: oyvraFxRain;
  font-size: calc(36px * var(--s, 1));
}
@keyframes oyvraFxFloat {
  0% {
    opacity: 0;
    transform: translate(0, 24px) scale(.45);
  }
  15% { opacity: 1; }
  100% {
    opacity: 0;
    transform: translate(var(--sway, 0px), -220px) scale(calc(var(--s, 1) * 1.2)) rotate(14deg);
  }
}
@keyframes oyvraFxRain {
  0% {
    opacity: 0;
    transform: translate(0, -10px) scale(.45) rotate(-8deg);
  }
  12% { opacity: 1; }
  100% {
    opacity: 0;
    transform: translate(var(--sway, 0px), 120vh) scale(calc(var(--s, 1) * 1.15)) rotate(18deg);
  }
}

.swipe-burst.burst-like span { font-size: 48px; }
.swipe-burst.burst-super span { font-size: 44px; }
.swipe-burst.burst-connect span { font-size: 38px; }

.page--discover .swipe-card {
  transform-origin: 50% 100%;
  transform: translate3d(0, calc(var(--depth, 0) * 10px), 0) scale(calc(1 - var(--depth, 0) * 0.035));
  opacity: calc(1 - var(--depth, 0) * 0.08);
  transition: transform .38s cubic-bezier(.22,.82,.2,1), opacity .28s ease, box-shadow .28s ease;
  box-shadow: 0 18px 50px rgba(20, 8, 30, 0.18);
  pointer-events: none;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  background: #1a1220;
}
.page--discover .swipe-card.is-top {
  z-index: 4;
  opacity: 1;
  pointer-events: auto;
  transform: translate3d(0, 0, 0);
  box-shadow: 0 22px 56px rgba(20, 8, 30, 0.22);
}
.page--discover .swipe-card.is-dragging {
  animation: none !important;
  transition: none !important;
}
.page--discover .swipe-card.fly-left { animation: oyvraFlyLeft .42s cubic-bezier(.2,.7,.2,1) forwards; }
.page--discover .swipe-card.fly-right { animation: oyvraFlyRight .42s cubic-bezier(.2,.7,.2,1) forwards; }
.page--discover .swipe-card.fly-up { animation: oyvraFlyUp .42s cubic-bezier(.2,.7,.2,1) forwards; }
.page--discover .swipe-card.fly-down { animation: oyvraFlyDown .42s cubic-bezier(.2,.7,.2,1) forwards; }
@keyframes oyvraFlyLeft {
  to { transform: translate3d(-140%, 48px, 0) rotate(-28deg) scale(.94); opacity: 0; }
}
@keyframes oyvraFlyRight {
  to { transform: translate3d(140%, 48px, 0) rotate(28deg) scale(.94); opacity: 0; }
}
@keyframes oyvraFlyUp {
  to { transform: translate3d(0, -125%, 0) rotate(-10deg) scale(.96); opacity: 0; }
}
@keyframes oyvraFlyDown {
  to { transform: translate3d(0, 118%, 0) rotate(10deg) scale(.96); opacity: 0; }
}

.page--discover .swipe-stamp {
  top: 36px;
  padding: 10px 16px;
  font-size: 30px;
  border-radius: 14px;
  backdrop-filter: blur(2px);
}
.page--discover .stamp-like { color: #4ade80; border-color: #4ade80; background: rgba(20,40,20,.18); }
.page--discover .stamp-nope { color: #fb7185; border-color: #fb7185; background: rgba(40,10,16,.18); }
.page--discover .stamp-super { color: #60a5fa; border-color: #60a5fa; background: rgba(10,20,40,.2); }
.page--discover .stamp-connect { color: #f0a3c2; border-color: #f0a3c2; background: rgba(40,10,24,.2); }

.page--discover .swipe-actions--match {
  margin-top: 18px;
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  gap: 16px;
  max-width: 460px;
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  padding: 6px 4px 4px;
}
.page--discover .swipe-actions--match .act-wrap { margin: 0; display: contents; }
.page--discover .swipe-actions--match .act {
  flex: 0 0 auto;
  width: auto;
  max-width: none;
  gap: 8px;
}
.page--discover .swipe-actions--match .act span {
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: var(--oyvra-text-muted);
}
.page--discover .swipe-actions--match .act i,
.page--discover .swipe-actions--match .act--lg i {
  width: 68px;
  height: 68px;
  border-radius: 50%;
  background: #fff;
  border: 0;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  line-height: 0;
  box-shadow:
    0 2px 0 rgba(0,0,0,.04),
    0 12px 28px rgba(28, 12, 40, .14);
}
.page--discover .swipe-actions--match .act--lg i {
  width: 78px;
  height: 78px;
}
.page--discover .swipe-actions--match .act i > iconify-icon,
.page--discover .swipe-actions--match .act i > svg,
.page--discover .swipe-actions--match .act--lg i > iconify-icon,
.page--discover .swipe-actions--match .act--lg i > svg {
  display: block !important;
  width: 32px !important;
  height: 32px !important;
  min-width: 32px;
  min-height: 32px;
  font-size: 32px;
  line-height: 0;
  margin: 0;
  flex-shrink: 0;
}
.page--discover .swipe-actions--match .act--lg i > iconify-icon,
.page--discover .swipe-actions--match .act--lg i > svg {
  width: 38px !important;
  height: 38px !important;
  min-width: 38px;
  min-height: 38px;
  font-size: 38px;
}
.page--discover .swipe-actions--match .act.undo i { color: #f59e0b; }
.page--discover .swipe-actions--match .act.pass i { color: #fd5068; }
.page--discover .swipe-actions--match .act.super i { color: #3b82f6; }
.page--discover .swipe-actions--match .act.like i {
  color: #22c55e;
  background: #fff;
  box-shadow:
    0 0 0 4px rgba(34, 197, 94, .12),
    0 12px 28px rgba(34, 197, 94, .22);
}
.page--discover .swipe-actions--match .act.connect i { color: var(--oyvra-primary); }
.page--discover .swipe-actions--match .act:hover i {
  transform: translateY(-3px) scale(1.05);
}
.page--discover .swipe-actions--match .act.like:hover i {
  box-shadow:
    0 0 0 5px rgba(34, 197, 94, .16),
    0 14px 32px rgba(34, 197, 94, .28);
}
.page--discover .swipe-actions--match .act.pass:hover i {
  box-shadow:
    0 0 0 4px rgba(253, 80, 104, .12),
    0 12px 28px rgba(253, 80, 104, .22);
}
.page--discover .verify-dot {
  display: inline-flex;
  color: #3b82f6;
  filter: drop-shadow(0 1px 2px rgba(0,0,0,.25));
}
.page--discover .intent-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 10px;
  padding: 6px 12px;
  border-radius: 999px;
  background: rgba(0,0,0,.38);
  backdrop-filter: blur(8px);
  font-size: 12px;
  font-weight: 700;
  width: fit-content;
  max-width: 100%;
}
.page--discover .swipe-hint { margin-top: 10px; }
.page--discover .swipe-legend {
  list-style: none;
  margin: 14px auto 0;
  padding: 0;
  max-width: 420px;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 6px 14px;
  text-align: center;
}
.page--discover .swipe-legend li {
  font-size: 12px;
  color: var(--oyvra-muted, #6b6280);
  line-height: 1.35;
}
.page--discover .swipe-legend strong { color: var(--oyvra-text); font-weight: 700; }
.page--discover .swipe-legend a {
  color: var(--oyvra-primary);
  font-weight: 700;
  text-decoration: none;
}
.page--discover .swipe-legend a:hover { text-decoration: underline; }
.page--discover .swipe-hint {
  margin-top: 10px;
  animation: oyvraHintPulse 2.8s ease-in-out infinite;
}
@keyframes oyvraHintPulse {
  0%, 100% { opacity: .55; }
  50% { opacity: 1; }
}
.empty-pulse {
  width: 72px; height: 72px; margin: 0 auto 18px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(216,106,154,.35), transparent 70%);
  animation: oyvraEmptyBeat 1.6s ease-in-out infinite;
}
@keyframes oyvraEmptyBeat {
  0%, 100% { transform: scale(.9); opacity: .7; }
  50% { transform: scale(1.08); opacity: 1; }
}

.swipe-toast {
  background: linear-gradient(135deg, #22152f, #1a1224 60%) !important;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 18px !important;
  padding: 16px 20px !important;
  transform: translateX(-50%) translateY(16px) scale(.98);
  transition: opacity .25s ease, transform .25s cubic-bezier(.2,.9,.2,1) !important;
}
.swipe-toast.is-on { transform: translateX(-50%) translateY(0) scale(1) !important; }
.swipe-toast.toast-like strong { color: #86efac !important; }
.swipe-toast.toast-pass strong { color: #fda4af !important; }
.swipe-toast.toast-super strong { color: #93c5fd !important; }
.swipe-toast.toast-connect strong { color: #f9a8d4 !important; }
.swipe-toast span { font-size: 16px !important; }

.match-moment {
  position: fixed; inset: 0; z-index: 90;
  display: grid; place-items: center;
  background: rgba(16, 8, 24, .62);
  backdrop-filter: blur(10px);
  opacity: 0; pointer-events: none;
  transition: opacity .3s ease;
}
.match-moment.is-on { opacity: 1; pointer-events: auto; }
.match-moment[hidden] { display: none !important; }
.match-moment.is-on[hidden] { display: grid !important; }
.match-moment-inner {
  width: min(420px, calc(100vw - 32px));
  text-align: center;
  background: linear-gradient(180deg, #fff, #faf6fb);
  border-radius: 28px;
  padding: 28px 24px 24px;
  box-shadow: 0 30px 80px rgba(0,0,0,.28);
  animation: oyvraMatchPop .45s cubic-bezier(.2,.9,.2,1);
}
@keyframes oyvraMatchPop {
  from { transform: scale(.92) translateY(12px); opacity: 0; }
  to { transform: none; opacity: 1; }
}
.match-moment .eyebrow { margin-bottom: 12px; }
.match-moment h2 {
  font-family: var(--oyvra-display);
  font-size: 28px;
  margin-top: 12px;
}
.match-faces {
  display: flex; justify-content: center;
  margin: 8px 0;
}
.match-faces img {
  width: 92px; height: 92px; border-radius: 50%;
  object-fit: cover;
  border: 3px solid #fff;
  box-shadow: 0 10px 28px rgba(28,12,40,.2);
  animation: oyvraFaceIn .5s ease both;
}
@keyframes oyvraFaceIn {
  from { transform: scale(.8); opacity: 0; }
  to { transform: none; opacity: 1; }
}

.feed-card.is-locked .feed-veil {
  backdrop-filter: none;
}
.feed-card.is-locked .btn {
  box-shadow: 0 10px 24px rgba(124,77,255,.2);
}

@media (max-width: 1100px) {
  .page--discover .discover-layout {
    grid-template-columns: minmax(0, 1fr);
    width: 100%;
    max-width: 100%;
  }
  .page--discover .swipe-stack,
  .page--discover .feature-card.swipe-card {
    min-height: 0;
    height: clamp(440px, 54dvh, 560px);
  }
  .disc-filters-form { grid-template-columns: 1fr; }
}
@media (max-width: 1100px) {
  .disc-filterbar {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    border-radius: 18px;
    padding: 6px;
    flex-wrap: nowrap;
    width: 100%;
    max-width: 100%;
    overflow: hidden;
    gap: 8px;
  }
  .disc-tabs { width: auto; min-width: 0; }
  .disc-filters-btn { margin-left: 0; }
  .disc-tab {
    min-height: 36px;
    padding: 0 12px;
    font-size: 13px;
  }
  .page--discover .feature-info { padding: 28px 16px 16px; }
  .page--discover .feature-info h2 { font-size: clamp(24px, 7vw, 32px); }
  .page--discover .photo-nav { opacity: .85; }
  .page--discover .side-people { gap: 12px; }
  .page--discover .swipe-stack {
    height: clamp(420px, 52dvh, 520px);
  }
  .page--discover .swipe-stack .swipe-card,
  .page--discover .feature-card.swipe-card {
    height: 100%;
    min-height: 0;
  }
  .page--discover .swipe-actions--match {
    margin-top: 14px;
    gap: 12px;
    max-width: none;
  }
  .page--discover .swipe-actions--match .act i {
    width: 62px;
    height: 62px;
  }
  .page--discover .swipe-actions--match .act--lg i {
    width: 70px;
    height: 70px;
  }
  .page--discover .swipe-actions--match .act i > iconify-icon,
  .page--discover .swipe-actions--match .act i > svg {
    width: 28px !important;
    height: 28px !important;
    min-width: 28px;
    min-height: 28px;
    font-size: 28px;
  }
  .page--discover .swipe-actions--match .act--lg i > iconify-icon,
  .page--discover .swipe-actions--match .act--lg i > svg {
    width: 34px !important;
    height: 34px !important;
    min-width: 34px;
    min-height: 34px;
    font-size: 34px;
  }
  .shell--discover .page--discover {
    padding-top: 8px;
    padding-bottom: 4px;
  }
}
/* —— Networking —— */
.shell--networking .workspace {
  background:
    radial-gradient(900px 420px at 8% -10%, rgba(124,77,255,.09), transparent 58%),
    radial-gradient(700px 320px at 100% 0%, rgba(216,106,154,.08), transparent 55%),
    linear-gradient(180deg, #faf8fc 0%, #f4f0f7 100%);
}
.net-shell { position: relative; min-width: 0; }
.net-glow {
  position: absolute;
  inset: -48px -20px auto;
  height: 260px;
  background:
    radial-gradient(closest-side, rgba(124,77,255,.14), transparent 72%),
    radial-gradient(closest-side at 80% 35%, rgba(216,106,154,.1), transparent 70%);
  pointer-events: none;
  animation: oyvraGlowDrift 9s ease-in-out infinite alternate;
}
.net-head {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px 20px;
  margin-bottom: 18px;
  position: relative;
}
.net-title {
  margin: 0;
  font-family: var(--oyvra-display), Georgia, serif;
  font-size: clamp(30px, 3.4vw, 40px);
  font-weight: 700;
  letter-spacing: -.025em;
  color: var(--oyvra-text);
  line-height: 1.1;
}
.net-lede {
  margin-top: 8px;
  max-width: 46ch;
  font-size: 15px;
  color: var(--oyvra-text-secondary);
  line-height: 1.5;
}
.net-tabs { flex: 0 1 auto; }
.net-tabs .net-count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 20px;
  height: 20px;
  padding: 0 6px;
  margin-left: 4px;
  border-radius: 999px;
  background: #efe8ff;
  color: var(--oyvra-primary-dark);
  font-size: 11px;
  font-weight: 800;
  font-style: normal;
}
.net-search {
  position: relative;
  margin-bottom: 18px;
  min-height: 52px;
  padding-left: 16px;
  border-radius: 999px;
  border: 1px solid rgba(124,77,255,.08);
  background: #fff;
  box-shadow: 0 8px 24px rgba(60, 40, 90, .05);
}
.net-search iconify-icon { color: #9a93a8; }
.page--networking .net-grid {
  margin-top: 2px;
  gap: 20px;
}
.page--networking .net-card {
  display: flex;
  flex-direction: column;
  border-radius: 24px;
  overflow: hidden;
  border: 1px solid rgba(124,77,255,.07);
  background: #fff;
  box-shadow: 0 10px 28px rgba(55, 35, 85, .06);
  animation: oyvraFeedRise .55s cubic-bezier(.2,.8,.2,1) both;
  transition: transform .22s ease, box-shadow .22s ease;
}
.page--networking .net-card:nth-child(2) { animation-delay: .04s; }
.page--networking .net-card:nth-child(3) { animation-delay: .08s; }
.page--networking .net-card:nth-child(4) { animation-delay: .12s; }
.page--networking .net-card:nth-child(5) { animation-delay: .16s; }
.page--networking .net-card:nth-child(6) { animation-delay: .2s; }
.page--networking .net-card:nth-child(7) { animation-delay: .24s; }
.page--networking .net-card:nth-child(8) { animation-delay: .28s; }
.page--networking .net-card:nth-child(9) { animation-delay: .32s; }
.page--networking .net-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 18px 40px rgba(55, 35, 85, .1);
}
.net-card__media { position: relative; }
.net-card__photo {
  display: block;
  overflow: hidden;
  aspect-ratio: 1 / 1;
  background: var(--oyvra-surface-soft);
}
.page--networking .net-card__photo img,
.net-card__photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .5s ease;
}
.page--networking .net-card:hover .net-card__photo img { transform: scale(1.04); }
.net-status {
  position: absolute;
  top: 12px;
  left: 12px;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 26px;
  padding: 0 10px;
  border-radius: 999px;
  background: rgba(255,255,255,.92);
  color: #5c5668;
  font-size: 11px;
  font-weight: 700;
  box-shadow: 0 4px 14px rgba(20,12,32,.12);
  backdrop-filter: blur(8px);
}
.net-status i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #9aa0ae;
  flex-shrink: 0;
}
.net-status--on { color: #1f6b45; }
.net-status--on i {
  background: #22c55e;
  box-shadow: 0 0 0 3px rgba(34,197,94,.2);
}
.net-save {
  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border: 0;
  border-radius: 50%;
  background: rgba(255,255,255,.95);
  color: var(--oyvra-primary);
  box-shadow: 0 6px 16px rgba(20,12,32,.14);
  cursor: pointer;
  transition: transform .15s ease, background .15s ease;
}
.net-save:hover { transform: scale(1.06); background: #fff; }
.net-card__body {
  display: flex;
  flex-direction: column;
  flex: 1;
  padding: 14px 14px 16px;
  min-width: 0;
}
.net-card__body h3 {
  margin: 0;
  font-size: 17px;
  font-weight: 700;
  line-height: 1.25;
}
.net-card__body h3 a { color: inherit; text-decoration: none; }
.net-card__body h3 a:hover { color: var(--oyvra-primary-dark); }
.net-card__name {
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
}
.net-card__name h3 {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.net-verify {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  color: #4f7cff;
  line-height: 0;
}
.net-verify iconify-icon,
.net-verify .oy-ico {
  width: 18px !important;
  height: 18px !important;
  display: block;
  color: inherit;
}
.net-card__role {
  margin: 6px 0 0;
  font-size: 13px;
  font-weight: 500;
  color: var(--oyvra-text-secondary);
  line-height: 1.35;
}
.net-card__loc {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin: 5px 0 0;
  font-size: 12px;
  font-weight: 600;
  color: var(--oyvra-text-muted);
  line-height: 1.3;
}
.net-card__loc iconify-icon { flex-shrink: 0; color: var(--oyvra-text-muted); }
.net-skills {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 10px;
}
.net-skills span {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 0 10px;
  border-radius: 999px;
  background: #f3ecff;
  border: 0;
  font-size: 11px;
  font-weight: 600;
  color: #6b4fc4;
}
.net-mutual {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 12px;
  font-size: 12px;
  font-weight: 600;
  color: var(--oyvra-text-secondary);
}
.net-mutual__faces { display: flex; align-items: center; }
.net-mutual__faces img {
  width: 22px !important;
  height: 22px !important;
  border-radius: 50%;
  object-fit: cover;
  border: 2px solid #fff;
  margin-left: -7px;
  box-shadow: 0 1px 3px rgba(20,12,32,.12);
}
.net-mutual__faces img:first-child { margin-left: 0; }
.page--networking .connect-form { margin-top: auto; padding-top: 14px; }
.page--networking .connect-btn {
  width: 100%;
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  border-radius: 999px;
  font-weight: 700;
  transition: transform .15s ease, box-shadow .15s ease, background .15s ease, color .15s ease;
}
.page--networking .connect-btn iconify-icon { flex-shrink: 0; }
.page--networking .connect-btn:hover:not(.is-on):not(.is-connected) {
  transform: translateY(-1px);
  box-shadow: 0 12px 24px rgba(124,77,255,.3);
}
.page--networking .connect-btn.is-on {
  background: #efe8ff;
  color: var(--oyvra-primary-dark);
  box-shadow: none;
}
.page--networking .connect-btn.is-connected {
  background: #eef8f1;
  color: #1f7a45;
  box-shadow: none;
}
.net-empty {
  padding: 32px 26px;
  text-align: left;
  border-radius: 22px;
  animation: oyvraFeedRise .5s cubic-bezier(.2,.8,.2,1) both;
}
.net-empty__mark {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  margin-bottom: 12px;
  border-radius: 16px;
  background: linear-gradient(145deg, #f3ecff, #fceef5);
  color: var(--oyvra-primary);
}
.net-empty .h2 { margin: 8px 0 10px; }
.net-empty .body { margin-bottom: 18px; max-width: 42ch; }
.net-list { display: grid; gap: 12px; position: relative; }
.net-row {
  display: grid;
  grid-template-columns: 96px minmax(0, 1fr) auto;
  gap: 16px;
  align-items: center;
  padding: 14px;
  border-radius: 20px;
  background: #fff;
  border: 1px solid var(--oyvra-border);
  box-shadow: var(--oyvra-shadow-sm);
  animation: oyvraFeedRise .55s cubic-bezier(.2,.8,.2,1) both;
  transition: transform .2s ease, box-shadow .2s ease;
}
.net-row:nth-child(2) { animation-delay: .04s; }
.net-row:nth-child(3) { animation-delay: .08s; }
.net-row:nth-child(4) { animation-delay: .12s; }
.net-row:hover { transform: translateY(-2px); box-shadow: var(--oyvra-shadow-md); }
.net-row__photo {
  position: relative;
  display: block;
  border-radius: 16px;
  overflow: hidden;
  aspect-ratio: 1;
  background: var(--oyvra-surface-soft);
}
.net-row__photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .45s ease;
}
.net-row:hover .net-row__photo img { transform: scale(1.04); }
.net-row__body { min-width: 0; }
.net-row__body h3 {
  margin: 0;
  font-size: 17px;
  font-weight: 700;
  line-height: 1.25;
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}
.net-row__body h3 a { color: inherit; text-decoration: none; }
.net-row__body h3 a:hover { color: var(--oyvra-primary-dark); }
.net-row__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 14px;
  margin: 6px 0 0;
  font-size: 13px;
  color: var(--oyvra-text-secondary);
}
.net-row__meta span { display: inline-flex; align-items: center; gap: 5px; }
.net-row__meta iconify-icon { color: var(--oyvra-text-muted); }
.net-row__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  flex-shrink: 0;
  align-items: center;
}
.net-row__actions .btn { display: inline-flex; align-items: center; gap: 6px; }
.net-request-actions { display: flex; flex-wrap: wrap; gap: 8px; flex-shrink: 0; }
.net-rail { display: flex; flex-direction: column; gap: 14px; }
.net-promo {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 12px;
  align-items: center;
  padding: 16px;
  border-radius: 20px;
  background: linear-gradient(145deg, #f0e9ff 0%, #efe6ff 45%, #f7efff 100%);
  border: 1px solid rgba(124,77,255,.12);
  color: inherit;
  text-decoration: none;
  box-shadow: 0 8px 22px rgba(124,77,255,.08);
  transition: transform .18s ease, box-shadow .18s ease;
}
.net-promo:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 28px rgba(124,77,255,.12);
}
.net-promo__ico {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  border-radius: 14px;
  background: rgba(255,255,255,.75);
  color: var(--oyvra-primary);
}
.net-promo__copy strong {
  display: block;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.35;
  color: var(--oyvra-text);
}
.net-promo__copy p {
  margin: 4px 0 0;
  font-size: 12px;
  line-height: 1.4;
  color: var(--oyvra-text-secondary);
}
.net-promo__go {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: #fff;
  color: var(--oyvra-primary);
  box-shadow: 0 4px 12px rgba(60,40,90,.1);
}
.net-filter {
  padding: 0 !important;
  overflow: hidden;
  border-radius: 18px;
  animation: oyvraFeedRise .5s cubic-bezier(.2,.8,.2,1) both;
}
.net-filter__summary {
  list-style: none;
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 12px;
  align-items: center;
  padding: 14px 16px;
  cursor: pointer;
}
.net-filter__summary::-webkit-details-marker { display: none; }
.net-filter__ico {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 12px;
  background: #f3ecff;
  color: var(--oyvra-primary);
}
.net-filter__text { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.net-filter__text strong { font-size: 15px; font-weight: 700; color: var(--oyvra-text); }
.net-filter__text em { font-style: normal; font-size: 12px; color: var(--oyvra-text-muted); }
.net-filter__chev { display: inline-flex; color: var(--oyvra-text-muted); transition: transform .2s ease; }
.net-filter[open] .net-filter__chev { transform: rotate(180deg); }
.net-filter__form {
  display: grid;
  gap: 10px;
  padding: 14px 16px 16px;
  border-top: 1px solid var(--oyvra-border);
}
.net-howto-card { animation: oyvraFeedRise .5s cubic-bezier(.2,.8,.2,1) both; animation-delay: .06s; }
.net-howto-card__head {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 10px;
  align-items: center;
  margin-bottom: 12px;
}
.net-howto-card__head h3 { margin: 0; font-size: 15px; }
.net-howto-card__ico {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border-radius: 11px;
  background: #fff4d6;
  color: #c98a12;
}
.net-howto-card__go {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: var(--oyvra-surface-soft);
  color: var(--oyvra-text-secondary);
}
.net-howto { margin: 0; display: grid; gap: 10px; padding: 0; list-style: none; }
.net-howto li {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  font-size: 13px;
  line-height: 1.4;
  color: var(--oyvra-text-secondary);
}
.net-howto li iconify-icon { flex-shrink: 0; margin-top: 1px; color: var(--oyvra-primary); }
.net-quote {
  margin: 4px 2px 0;
  padding: 0;
  border: 0;
  font-family: var(--oyvra-display), Georgia, serif;
  font-size: 15px;
  font-style: italic;
  line-height: 1.45;
  color: var(--oyvra-text-secondary);
}
.net-quote cite {
  display: block;
  margin-top: 8px;
  font-family: inherit;
  font-size: 12px;
  font-style: normal;
  font-weight: 700;
  color: var(--oyvra-text-muted);
}
@media (max-width: 900px) {
  .net-head { align-items: flex-start; }
  .net-tabs { width: 100%; }
  .net-row { grid-template-columns: 80px minmax(0, 1fr); }
  .net-row__actions { grid-column: 1 / -1; }
  .net-row__actions .btn { flex: 1; justify-content: center; }
}
@media (max-width: 720px) {
  .net-lede { max-width: none; }
  .net-request-actions { width: 100%; }
  .net-request-actions .btn { flex: 1; }
}

/* —— Matches —— */
.match-shell { position: relative; min-width: 0; }
.match-glow {
  position: absolute;
  inset: -40px -20px auto;
  height: 240px;
  background: radial-gradient(closest-side, rgba(216,106,154,.16), transparent 70%),
    radial-gradient(closest-side at 80% 20%, rgba(124,77,255,.14), transparent 65%);
  pointer-events: none;
  animation: oyvraGlowDrift 10s ease-in-out infinite alternate;
}
.match-head {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: 14px 18px;
  margin-bottom: 14px;
  position: relative;
}
.match-title {
  margin: 2px 0 0;
  font-family: var(--oyvra-display), Georgia, serif;
  font-size: clamp(28px, 3.2vw, 36px);
  font-weight: 700;
  letter-spacing: -.02em;
  color: var(--oyvra-text);
  line-height: 1.15;
}
.match-lede {
  margin-top: 6px;
  max-width: 34ch;
  font-size: 15px;
  color: var(--oyvra-text-secondary);
  line-height: 1.45;
}
.match-tabs { flex: 0 1 auto; }
.match-count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 18px;
  height: 18px;
  padding: 0 5px;
  margin-left: 2px;
  border-radius: 999px;
  background: var(--oyvra-primary-soft);
  color: var(--oyvra-primary-dark);
  font-size: 10px;
  font-weight: 800;
  font-style: normal;
}
.match-count--accent {
  background: var(--oyvra-accent-soft);
  color: #a13d6a;
}
.match-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 16px;
  position: relative;
}
.match-view-toggle { flex: 0 0 auto; }
.match-view-toggle a { min-width: 42px; padding: 0 12px; }
.match-sort select {
  min-height: 40px;
  padding: 0 36px 0 14px;
  border-radius: 12px;
  border: 1px solid var(--oyvra-border);
  background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%236F6878' d='M2.5 4.5 6 8l3.5-3.5'/%3E%3C/svg%3E") no-repeat right 12px center;
  appearance: none;
  font: inherit;
  font-size: 13px;
  font-weight: 600;
  color: var(--oyvra-text);
  box-shadow: var(--oyvra-shadow-sm);
  cursor: pointer;
}
.match-list {
  display: grid;
  gap: 12px;
  position: relative;
}
.match-row {
  display: grid;
  grid-template-columns: 112px minmax(0, 1fr) auto;
  gap: 16px;
  align-items: stretch;
  padding: 14px;
  border-radius: 20px;
  background: #fff;
  border: 1px solid var(--oyvra-border);
  box-shadow: var(--oyvra-shadow-sm);
  overflow: hidden;
  isolation: isolate;
  animation: oyvraFeedRise .55s cubic-bezier(.2,.8,.2,1) both;
  transition: transform .2s ease, box-shadow .2s ease;
}
.match-row:nth-child(2) { animation-delay: .04s; }
.match-row:nth-child(3) { animation-delay: .08s; }
.match-row:nth-child(4) { animation-delay: .12s; }
.match-row:nth-child(5) { animation-delay: .16s; }
.match-row:hover {
  transform: translateY(-2px);
  box-shadow: var(--oyvra-shadow-md);
}
.match-row__photo {
  position: relative;
  display: block;
  border-radius: 16px;
  overflow: hidden;
  aspect-ratio: 1;
  background: var(--oyvra-surface-soft);
}
.match-row__photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 18%;
  transition: transform .45s ease;
}
.match-row:hover .match-row__photo img { transform: scale(1.04); }
.match-presence {
  position: absolute;
  right: 8px;
  bottom: 8px;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: #2ecc71;
  border: 2px solid #fff;
  box-shadow: 0 2px 6px rgba(37,33,43,.18);
}
.match-row__body { min-width: 0; display: flex; flex-direction: column; gap: 8px; }
.match-row__top {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-start;
}
.match-row__body h3 {
  margin: 0;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.25;
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}
.match-row__body h3 a {
  color: inherit;
  text-decoration: none;
}
.match-row__body h3 a:hover { color: var(--oyvra-primary-dark); }
.match-verify {
  display: inline-flex;
  color: #3b82f6;
  line-height: 0;
}
.match-row__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 14px;
  margin: 4px 0 0;
  font-size: 13px;
  color: var(--oyvra-text-secondary);
}
.match-row__meta span {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.match-row__meta iconify-icon { color: var(--oyvra-text-muted); }
.match-row__when {
  flex-shrink: 0;
  text-align: right;
  display: grid;
  gap: 4px;
  justify-items: end;
}
.match-row__when > span {
  font-size: 12px;
  font-weight: 600;
  color: var(--oyvra-text-muted);
}
.match-status {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 11px;
  font-weight: 700;
  font-style: normal;
  color: #1f9d57;
}
.match-row__bio {
  margin: 0;
  font-size: 13px;
  line-height: 1.45;
  color: var(--oyvra-text-secondary);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.match-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.match-tags span {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  min-height: 26px;
  padding: 0 10px;
  border-radius: 999px;
  background: var(--oyvra-primary-soft);
  border: 1px solid rgba(124,77,255,.12);
  font-size: 11px;
  font-weight: 600;
  color: var(--oyvra-primary-dark);
}
.match-tags--on-dark span {
  background: rgba(255,255,255,.16);
  border-color: rgba(255,255,255,.18);
  color: #fff;
  backdrop-filter: blur(6px);
}
.match-row__actions {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 8px;
  min-width: 132px;
}
.match-row__actions .btn,
.match-tile__actions .btn { width: 100%; justify-content: center; }
.match-row__actions--mobile { display: none; }
.match-row__actions--desk { display: flex; }
.match-row__actions .btn-soft,
.match-tile__actions .btn-soft {
  background: transparent;
  border: 1.5px solid rgba(124,77,255,.35);
  color: var(--oyvra-primary-dark);
}
.match-row__actions .btn-soft:hover,
.match-tile__actions .btn-soft:hover {
  background: var(--oyvra-primary-soft);
  border-color: var(--oyvra-primary);
}

.match-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  position: relative;
}
.match-tile {
  display: flex;
  flex-direction: column;
  height: auto;
  min-height: 0;
  border-radius: 20px;
  overflow: hidden;
  background: #fff;
  border: 1px solid var(--oyvra-border);
  box-shadow: var(--oyvra-shadow-sm);
  animation: oyvraFeedRise .55s cubic-bezier(.2,.8,.2,1) both;
  transition: transform .2s ease, box-shadow .2s ease;
}
.match-tile:nth-child(2) { animation-delay: .04s; }
.match-tile:nth-child(3) { animation-delay: .08s; }
.match-tile:nth-child(4) { animation-delay: .12s; }
.match-tile:nth-child(5) { animation-delay: .16s; }
.match-tile:hover {
  transform: translateY(-3px);
  box-shadow: var(--oyvra-shadow-md);
}
.match-tile__media {
  position: relative;
  display: block;
  aspect-ratio: 4 / 5;
  min-height: 280px;
  overflow: hidden;
  background: var(--oyvra-surface-soft);
  color: #fff;
}
.match-tile__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 18%;
  transition: transform .5s ease;
}
.match-tile:hover .match-tile__media img { transform: scale(1.05); }
.match-tile__heart {
  position: absolute;
  top: 10px;
  right: 10px;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: rgba(255,255,255,.92);
  color: var(--oyvra-accent);
  box-shadow: 0 4px 14px rgba(37,33,43,.16);
  line-height: 0;
}
.match-tile__fade {
  position: absolute;
  inset: auto 0 0;
  padding: 48px 12px 14px;
  background: linear-gradient(180deg, transparent 0%, rgba(28,18,36,.78) 55%, rgba(20,12,28,.92) 100%);
  display: grid;
  gap: 4px;
}
.match-tile__fade h3 {
  margin: 0;
  font-size: 16px;
  font-weight: 700;
  display: flex;
  align-items: center;
  gap: 5px;
  flex-wrap: wrap;
  color: #fff;
}
.match-tile__fade .match-verify { color: #93c5fd; }
.match-tile__fade p {
  margin: 0;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 12px;
  color: rgba(255,255,255,.88);
}
.match-tile__actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  padding: 10px;
}
.match-tile__actions .btn { width: 100%; justify-content: center; }

.match-empty {
  padding: 28px 24px;
  position: relative;
  animation: oyvraFeedRise .5s cubic-bezier(.2,.8,.2,1) both;
}
.match-empty .h2 { margin: 8px 0 10px; }
.match-empty .body { margin-bottom: 18px; max-width: 42ch; }

.match-footer {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin-top: 22px;
  padding: 18px 20px;
  border-radius: 18px;
  border: 1px solid rgba(124,77,255,.16);
  background: linear-gradient(110deg, #fff 0%, #f7f1ff 55%, #fdf0f6 100%);
  box-shadow: var(--oyvra-shadow-sm);
  position: relative;
  animation: oyvraFeedRise .5s cubic-bezier(.2,.8,.2,1) both;
}
.match-footer strong {
  display: block;
  font-size: 15px;
  font-weight: 700;
  color: var(--oyvra-text);
}
.match-footer p {
  margin: 4px 0 0;
  font-size: 13px;
  color: var(--oyvra-text-secondary);
}

@media (max-width: 1100px) {
  .match-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
  .match-head { align-items: flex-start; }
  .match-tabs { width: 100%; }
  .match-row {
    grid-template-columns: 96px minmax(0, 1fr);
  }
  .match-row__actions--desk { display: none; }
  .match-row__actions--mobile {
    display: grid;
    grid-template-columns: 1fr 1fr;
    margin-top: 4px;
  }
  .match-row__when { display: none; }
}
@media (max-width: 720px) {
  .match-lede { max-width: none; }
  .match-grid {
    grid-template-columns: 1fr;
    gap: 14px;
  }
  .match-row {
    grid-template-columns: 1fr;
    gap: 12px;
    padding: 12px;
    border-radius: 16px;
    overflow: hidden;
  }
  .match-row__photo {
    width: 100%;
    aspect-ratio: 4 / 3;
    max-height: 240px;
    border-radius: 14px;
  }
  .match-row__photo img { object-position: center 18%; }
  .match-row__body { min-width: 0; }
  .match-row__body h3 { font-size: 16px; }
  .match-row__bio { -webkit-line-clamp: 3; }
  .match-row__actions--mobile {
    display: grid;
    grid-template-columns: 1fr 1fr;
    min-width: 0;
  }
  .match-tile__media {
    min-height: 300px;
    aspect-ratio: 4 / 5;
  }
  .match-tile__actions { grid-template-columns: 1fr 1fr; }
  .match-footer { padding: 16px; }
}
/* —— Circles / Communities —— */
.shell--circles .workspace {
  background:
    radial-gradient(900px 420px at 6% -8%, rgba(124,77,255,.08), transparent 58%),
    radial-gradient(720px 340px at 100% 0%, rgba(216,106,154,.07), transparent 55%),
    linear-gradient(180deg, #fbfafc 0%, #f5f1f8 100%);
}
.shell--circles .page--circles {
  max-width: 1320px;
  align-items: start;
}
.shell--circles .page--circle-detail {
  max-width: 1280px;
  grid-template-columns: 1fr;
}
.cir-main { min-width: 0; }
.cir-intro { margin-bottom: 18px; }
.cir-title {
  margin: 0;
  font-family: var(--oyvra-display), Georgia, serif;
  font-size: clamp(32px, 3.6vw, 44px);
  font-weight: 700;
  letter-spacing: -.03em;
  line-height: 1.05;
  color: var(--oyvra-text);
}
.cir-lede {
  margin: 8px 0 0;
  font-size: 15px;
  color: var(--oyvra-text-secondary);
  line-height: 1.5;
}
.cir-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(220px, .95fr);
  gap: 0;
  min-height: 240px;
  margin-bottom: 28px;
  border-radius: 28px;
  overflow: hidden;
  background:
    linear-gradient(135deg, #f7ebe3 0%, #f3e4dc 42%, #efe0d8 100%);
  box-shadow: 0 16px 40px rgba(80, 50, 90, .08);
  position: relative;
}
.cir-hero-copy {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 36px 40px;
  position: relative;
  z-index: 1;
}
.cir-hero-copy h3 {
  margin: 0;
  font-family: var(--oyvra-display), Georgia, serif;
  font-size: clamp(26px, 2.8vw, 36px);
  font-weight: 700;
  letter-spacing: -.02em;
  line-height: 1.15;
  color: var(--oyvra-text);
}
.cir-hero-copy p {
  margin: 12px 0 22px;
  max-width: 38ch;
  font-size: 15px;
  line-height: 1.55;
  color: var(--oyvra-text-secondary);
}
.cir-hero-cta {
  align-self: flex-start;
  border-radius: 999px;
  padding: 0 22px;
  min-height: 46px;
  box-shadow: 0 10px 24px rgba(124, 77, 255, .28);
}
.cir-hero-visual {
  position: relative;
  min-height: 240px;
}
.cir-hero-visual img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.cir-hero-visual::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, #f3e4dc 0%, rgba(243,228,220,.35) 28%, transparent 55%);
  pointer-events: none;
  z-index: 1;
}
.cir-hero-script {
  position: absolute;
  right: 18px;
  top: 22px;
  z-index: 2;
  font-family: var(--oyvra-display), Georgia, serif;
  font-style: italic;
  font-weight: 600;
  font-size: 18px;
  line-height: 1.25;
  color: rgba(255,255,255,.95);
  text-shadow: 0 8px 24px rgba(40,20,60,.35);
  text-align: right;
}
.cir-hero-heart {
  position: absolute;
  right: 28px;
  bottom: 28px;
  z-index: 2;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: rgba(255,255,255,.88);
  color: var(--oyvra-accent);
  box-shadow: 0 8px 20px rgba(40,20,60,.15);
}
.cir-toolbar { margin-bottom: 18px; }
.cir-toolbar-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}
.cir-section-label {
  margin: 0;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 17px;
  font-weight: 700;
  color: var(--oyvra-text);
}
.cir-section-label iconify-icon { color: var(--oyvra-primary); }
.cir-sort { position: relative; }
.cir-sort summary {
  list-style: none;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 36px;
  padding: 0 12px;
  border-radius: 999px;
  border: 1px solid var(--oyvra-border);
  background: #fff;
  font-size: 13px;
  font-weight: 600;
  color: var(--oyvra-text-secondary);
  cursor: pointer;
}
.cir-sort summary::-webkit-details-marker { display: none; }
.cir-sort-menu {
  position: absolute;
  right: 0;
  top: calc(100% + 6px);
  z-index: 8;
  min-width: 140px;
  padding: 6px;
  border-radius: 14px;
  border: 1px solid var(--oyvra-border);
  background: #fff;
  box-shadow: var(--oyvra-shadow-md);
  display: grid;
}
.cir-sort-menu a {
  padding: 8px 10px;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 600;
  color: var(--oyvra-text);
}
.cir-sort-menu a:hover,
.cir-sort-menu a.is-on {
  background: var(--oyvra-primary-soft);
  color: var(--oyvra-primary-dark);
}
.cir-chips {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  padding-bottom: 4px;
  scrollbar-width: none;
}
.cir-chips::-webkit-scrollbar { display: none; }
.cir-chip {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  flex-shrink: 0;
  min-height: 38px;
  padding: 0 14px;
  border-radius: 999px;
  border: 1.5px solid var(--oyvra-border);
  background: #fff;
  color: var(--oyvra-text);
  font-size: 13px;
  font-weight: 600;
  transition: .15s ease;
}
.cir-chip iconify-icon { color: var(--oyvra-text-muted); }
.cir-chip:hover {
  border-color: rgba(124,77,255,.35);
  color: var(--oyvra-primary-dark);
}
.cir-chip.is-on {
  background: linear-gradient(180deg, #8A5FFF 0%, var(--oyvra-primary) 100%);
  border-color: transparent;
  color: #fff;
  box-shadow: 0 8px 18px rgba(124,77,255,.25);
}
.cir-chip.is-on iconify-icon { color: #fff; }
.cir-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}
.cir-card {
  display: flex;
  flex-direction: column;
  min-width: 0;
  color: inherit;
  transition: transform .18s ease, box-shadow .18s ease;
}
.cir-card:hover { transform: translateY(-3px); }
.cir-card-media {
  position: relative;
  border-radius: 22px;
  overflow: hidden;
  aspect-ratio: 4 / 3.2;
  background: #e8e2ef;
  box-shadow: 0 10px 28px rgba(60, 40, 90, .1);
}
.cir-card-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .35s ease;
}
.cir-card:hover .cir-card-media img { transform: scale(1.04); }
.cir-card-cat {
  position: absolute;
  top: 12px;
  left: 12px;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: rgba(255,255,255,.9);
  color: var(--oyvra-primary-dark);
  backdrop-filter: blur(8px);
  box-shadow: 0 4px 14px rgba(40,20,60,.12);
}
.cir-card-badge {
  position: absolute;
  top: 12px;
  right: 12px;
  padding: 5px 10px;
  border-radius: 999px;
  background: var(--oyvra-primary);
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .01em;
  box-shadow: 0 6px 16px rgba(124,77,255,.3);
}
.cir-card-members {
  position: absolute;
  left: 12px;
  right: 12px;
  bottom: 12px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  width: max-content;
  max-width: calc(100% - 24px);
  padding: 5px 10px 5px 6px;
  border-radius: 999px;
  background: rgba(28, 18, 40, .55);
  color: #fff;
  font-size: 12px;
  font-weight: 600;
  backdrop-filter: blur(8px);
}
.cir-avatar-stack {
  display: flex;
  align-items: center;
}
.cir-avatar-stack img,
.cir-avatar-more {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  border: 1.5px solid rgba(255,255,255,.85);
  object-fit: cover;
  margin-left: -7px;
  background: #ddd;
}
.cir-avatar-stack img:first-child,
.cir-avatar-stack .cir-avatar-more:first-child { margin-left: 0; }
.cir-avatar-stack--lg img,
.cir-avatar-stack--lg .cir-avatar-more {
  width: 36px;
  height: 36px;
  margin-left: -10px;
  border-width: 2px;
  border-color: #fff;
}
.cir-avatar-more {
  display: grid;
  place-items: center;
  background: var(--oyvra-primary-soft);
  color: var(--oyvra-primary-dark);
  font-size: 10px;
  font-weight: 800;
}
.cir-avatar-stack--lg .cir-avatar-more { font-size: 11px; }
.cir-card-body {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 14px 4px 4px;
}
.cir-card-copy { flex: 1; min-width: 0; }
.cir-card-copy h3 {
  margin: 0;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.25;
  color: var(--oyvra-text);
}
.cir-card-copy p {
  margin: 5px 0 0;
  font-size: 13px;
  line-height: 1.4;
  color: var(--oyvra-text-muted);
}
.cir-joined-tag {
  display: inline-flex;
  margin-top: 8px;
  padding: 3px 8px;
  border-radius: 999px;
  background: var(--oyvra-primary-soft);
  color: var(--oyvra-primary-dark);
  font-size: 11px;
  font-weight: 700;
}
.cir-card-go {
  flex-shrink: 0;
  width: 36px;
  height: 36px;
  margin-top: 2px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  border: 1.5px solid var(--oyvra-border);
  background: #fff;
  color: var(--oyvra-primary);
  transition: .15s ease;
}
.cir-card:hover .cir-card-go {
  background: var(--oyvra-primary);
  border-color: var(--oyvra-primary);
  color: #fff;
}
.cir-empty {
  grid-column: 1 / -1;
  display: grid;
  place-items: center;
  gap: 10px;
  padding: 48px 20px;
  text-align: center;
  border-radius: 22px;
  border: 1px dashed var(--oyvra-border);
  background: rgba(255,255,255,.7);
  color: var(--oyvra-text-secondary);
}
.cir-rail .rail-card { border-radius: 20px; }
.cir-rail-create { text-align: left; }
.cir-rail-ico {
  width: 42px;
  height: 42px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  margin-bottom: 12px;
  background: var(--oyvra-primary-soft);
  color: var(--oyvra-primary-dark);
}
.cir-create-btn {
  margin-top: 14px;
  border-radius: 999px;
  box-shadow: 0 10px 22px rgba(124,77,255,.22);
}
.cir-rail-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 4px;
}
.cir-rail-head h3 { margin-bottom: 0; }
.cir-rail-head a {
  font-size: 12px;
  font-weight: 700;
  color: var(--oyvra-primary);
}
.cir-trend-list { display: grid; gap: 4px; margin-top: 8px; }
.cir-trend-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 4px;
  border-radius: 12px;
  color: inherit;
}
.cir-trend-row:hover { background: var(--oyvra-surface-soft); }
.cir-trend-row img {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  object-fit: cover;
  flex-shrink: 0;
}
.cir-trend-row div { flex: 1; min-width: 0; }
.cir-trend-row strong {
  display: block;
  font-size: 14px;
  line-height: 1.25;
}
.cir-trend-row p {
  margin: 2px 0 0;
  font-size: 12px;
  color: var(--oyvra-text-muted);
}
.cir-trend-row iconify-icon { color: var(--oyvra-text-muted); flex-shrink: 0; }
.cir-quote {
  padding: 22px 18px;
  border-radius: 20px;
  text-align: center;
  background: linear-gradient(160deg, #fce8f1 0%, #f8dde8 55%, #f3d4e4 100%);
  color: var(--oyvra-text);
}
.cir-quote iconify-icon {
  color: var(--oyvra-accent);
  margin-bottom: 8px;
}
.cir-quote p {
  margin: 0;
  font-family: var(--oyvra-display), Georgia, serif;
  font-style: italic;
  font-size: 16px;
  line-height: 1.45;
  font-weight: 600;
}

/* Circle detail */
.cir-detail { min-width: 0; }
.cir-detail-hero {
  background: #fff;
  border: 1px solid var(--oyvra-border);
  border-radius: 24px;
  overflow: hidden;
  box-shadow: var(--oyvra-shadow-sm);
  margin-bottom: 22px;
}
.cir-detail-banner {
  position: relative;
  height: 220px;
  background: #ddd;
}
.cir-detail-banner img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.cir-detail-banner::after {
  content: "";
  position: absolute;
  inset: auto 0 0;
  height: 40%;
  background: linear-gradient(180deg, transparent, rgba(255,255,255,.95));
  pointer-events: none;
}
.cir-back {
  position: absolute;
  top: 16px;
  left: 16px;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 34px;
  padding: 0 12px;
  border-radius: 999px;
  background: rgba(255,255,255,.88);
  backdrop-filter: blur(8px);
  color: var(--oyvra-text);
  font-size: 13px;
  font-weight: 600;
  box-shadow: 0 6px 16px rgba(40,20,60,.12);
}
.cir-detail-identity {
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr);
  gap: 16px;
  padding: 0 22px 0;
  margin-top: -36px;
  position: relative;
  z-index: 1;
}
.cir-detail-avatar {
  width: 72px;
  height: 72px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: linear-gradient(160deg, #9b74ff, var(--oyvra-primary));
  color: #fff;
  border: 4px solid #fff;
  box-shadow: 0 8px 20px rgba(124,77,255,.25);
}
.cir-detail-heading {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px 18px;
  padding-top: 10px;
  padding-bottom: 4px;
}
.cir-detail-heading h1 {
  margin: 0;
  font-size: clamp(24px, 2.6vw, 30px);
  font-weight: 800;
  letter-spacing: -.02em;
  line-height: 1.15;
}
.cir-detail-stats {
  margin: 6px 0 0;
  font-size: 13px;
  color: var(--oyvra-text-muted);
  font-weight: 500;
}
.cir-detail-about {
  margin: 10px 0 0;
  max-width: 62ch;
  font-size: 14px;
  line-height: 1.5;
  color: var(--oyvra-text-secondary);
}
.cir-detail-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}
.cir-join-btn { border-radius: 999px; }
.cir-share-btn {
  border-radius: 999px;
  border-color: rgba(124,77,255,.35);
  color: var(--oyvra-primary-dark);
}
.cir-more-btn {
  width: 40px;
  min-height: 40px;
  padding: 0;
  border-radius: 50%;
  justify-content: center;
}
.cir-tabs {
  display: flex;
  gap: 4px;
  margin-top: 18px;
  padding: 0 18px;
  border-top: 1px solid var(--oyvra-border);
  overflow-x: auto;
  scrollbar-width: none;
}
.cir-tabs::-webkit-scrollbar { display: none; }
.cir-tabs a {
  flex-shrink: 0;
  padding: 14px 14px 12px;
  font-size: 14px;
  font-weight: 600;
  color: var(--oyvra-text-muted);
  border-bottom: 2.5px solid transparent;
}
.cir-tabs a.is-on {
  color: var(--oyvra-primary);
  border-bottom-color: var(--oyvra-primary);
}
.cir-detail-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) 300px;
  gap: 22px;
  align-items: start;
}
.cir-detail-feed { display: grid; gap: 14px; min-width: 0; }
.cir-composer {
  padding: 16px;
  border-radius: 20px;
}
.cir-composer-top {
  display: flex;
  gap: 12px;
  align-items: flex-start;
}
.cir-composer-input {
  flex: 1;
  min-height: 52px;
  resize: vertical;
  border: 0;
  outline: none;
  background: transparent;
  font: inherit;
  font-size: 14px;
  color: var(--oyvra-text);
  line-height: 1.45;
}
.cir-composer-input::placeholder { color: var(--oyvra-text-muted); }
.cir-composer-tools {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid var(--oyvra-border);
}
.cir-tool {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 32px;
  padding: 0 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 600;
  color: var(--oyvra-text-secondary);
  background: var(--oyvra-surface-soft);
}
.cir-tool iconify-icon { color: var(--oyvra-primary); }
.cir-post-btn { margin-left: auto; border-radius: 999px; }
.cir-join-nudge {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 16px 18px;
  border-radius: 18px;
}
.cir-join-nudge p { margin: 0; color: var(--oyvra-text-secondary); font-size: 14px; }
.cir-post {
  padding: 16px;
  border-radius: 20px;
}
.cir-post-head {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 10px;
}
.cir-post-meta { flex: 1; min-width: 0; }
.cir-post-name {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.cir-admin-pill {
  display: inline-flex;
  align-items: center;
  padding: 2px 8px;
  border-radius: 999px;
  background: var(--oyvra-primary-soft);
  color: var(--oyvra-primary-dark);
  font-size: 11px;
  font-weight: 700;
}
.cir-post-more {
  border: 0;
  background: transparent;
  color: var(--oyvra-text-muted);
  cursor: pointer;
  padding: 4px;
}
.cir-post-body {
  margin: 0;
  font-size: 15px;
  line-height: 1.55;
  color: var(--oyvra-text);
  white-space: pre-wrap;
}
.cir-post-media {
  margin-top: 12px;
  border-radius: 16px;
  overflow: hidden;
}
.cir-post-media img {
  width: 100%;
  max-height: 360px;
  object-fit: cover;
  display: block;
}
.cir-post-actions {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid var(--oyvra-border);
}
.cir-react {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 34px;
  padding: 0 10px;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: var(--oyvra-text-secondary);
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
}
.cir-react:hover { background: var(--oyvra-surface-soft); color: var(--oyvra-text); }
.cir-react-share { margin-left: auto; }
.cir-feed-empty,
.cir-panel {
  border-radius: 20px;
}
.cir-feed-empty {
  display: grid;
  place-items: center;
  gap: 8px;
  padding: 40px 20px;
  text-align: center;
  color: var(--oyvra-text-secondary);
  background: #fff;
  border: 1px dashed var(--oyvra-border);
}
.cir-about-list {
  list-style: none;
  margin: 14px 0 0;
  padding: 0;
  display: grid;
  gap: 10px;
}
.cir-about-list li {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 13px;
  color: var(--oyvra-text-secondary);
}
.cir-about-list iconify-icon { color: var(--oyvra-primary); flex-shrink: 0; }
.cir-about-list + form,
.cir-about-list + .btn,
.rail-card .cir-join-btn { margin-top: 16px; }
.cir-event-stack { display: grid; gap: 8px; margin-top: 8px; }
.cir-event-row {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 8px 0;
  color: inherit;
  border-bottom: 1px solid var(--oyvra-border);
}
.cir-event-row:last-child { border-bottom: 0; }
.cir-event-row--compact { padding: 6px 0; }
.cir-event-row div:nth-child(2) { flex: 1; min-width: 0; }
.cir-event-row strong {
  display: block;
  font-size: 14px;
  line-height: 1.25;
}
.cir-event-row p {
  margin: 3px 0 0;
  font-size: 12px;
  color: var(--oyvra-text-muted);
}
.cir-event-row iconify-icon { color: var(--oyvra-text-muted); flex-shrink: 0; }
.cir-event-date {
  width: 48px;
  height: 48px;
  border-radius: 14px;
  display: grid;
  place-content: center;
  text-align: center;
  background: linear-gradient(160deg, #f3e8ff, #fce8f3);
  color: var(--oyvra-primary-dark);
  flex-shrink: 0;
}
.cir-event-date strong {
  font-size: 16px;
  line-height: 1;
}
.cir-event-date span {
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .04em;
  margin-top: 2px;
}
.cir-member-list { display: grid; gap: 4px; margin-top: 8px; }
.cir-member-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 4px;
  border-radius: 12px;
  color: inherit;
}
.cir-member-row:hover { background: var(--oyvra-surface-soft); }
.cir-member-row div { flex: 1; min-width: 0; }
.cir-member-row strong { display: block; font-size: 14px; }
.cir-member-row p {
  margin: 2px 0 0;
  font-size: 12px;
  color: var(--oyvra-text-muted);
}
.cir-member-row iconify-icon { color: var(--oyvra-text-muted); }
.cir-topics {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 10px;
}
.cir-topic {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  padding: 0 12px;
  border-radius: 999px;
  background: var(--oyvra-surface-soft);
  border: 1px solid var(--oyvra-border);
  color: var(--oyvra-text);
  font-size: 12px;
  font-weight: 600;
}
@media (max-width: 1100px) {
  .cir-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cir-detail-grid { grid-template-columns: minmax(0, 1fr) 280px; }
}
@media (max-width: 900px) {
  .shell--circles .page--circles {
    grid-template-columns: 1fr;
  }
  .cir-hero {
    grid-template-columns: 1fr;
    min-height: 0;
  }
  .cir-hero-visual { min-height: 180px; }
  .cir-hero-visual::before {
    background: linear-gradient(180deg, #f3e4dc 0%, transparent 40%);
  }
  .cir-detail-grid { grid-template-columns: 1fr; }
  .cir-detail-rail { order: 2; }
}
@media (max-width: 640px) {
  .cir-grid { grid-template-columns: 1fr; }
  .cir-hero-copy { padding: 28px 22px 20px; }
  .cir-detail-identity {
    grid-template-columns: 56px minmax(0, 1fr);
    padding: 0 14px;
    margin-top: -28px;
  }
  .cir-detail-avatar { width: 56px; height: 56px; }
  .cir-detail-banner { height: 170px; }
  .cir-back span { display: none; }
  .cir-composer-tools .cir-tool span { /* keep icons */ }
  .cir-tool { font-size: 0; gap: 0; padding: 0 8px; }
  .cir-tool iconify-icon { font-size: 16px; }
}

@media (prefers-reduced-motion: reduce) {
  .discover-glow,
  .net-glow,
  .match-glow,
  .swipe-hint,
  .empty-pulse,
  .shell--home .feed-card,
  .page--networking .net-card,
  .match-row,
  .match-tile,
  .match-empty,
  .match-footer,
  .net-empty,
  .net-list,
  .net-row,
  .net-promo,
  .net-filter,
  .net-howto-card,
  .net-rail .rail-card,
  .cir-card,
  .cir-card-media img,
  .swipe-photo-layer,
  .swipe-card.is-top .swipe-photo img,
  .fx-bit,
  .fx-float,
  .fx-ring,
  .swipe-burst span { animation: none !important; }
  .swipe-fx { display: none; }
  .cir-card:hover { transform: none; }
  .cir-card:hover .cir-card-media img { transform: none; }
}

/* ===== Profile page redesign (pv-*) — plain workspace bg ===== */
.page--profile {
  align-items: start;
}
.page--profile .profile-main.pv {
  display: flex;
  flex-direction: column;
  gap: 16px;
  min-width: 0;
  width: 100%;
}
.pv-hero {
  display: grid;
  grid-template-columns: minmax(250px, 320px) minmax(0, 1fr);
  align-items: stretch;
  gap: 0;
  background: #fff;
  border: 1px solid var(--oyvra-border);
  border-radius: 24px;
  overflow: hidden;
  box-shadow: var(--oyvra-shadow-sm);
}
.pv-hero__media {
  position: relative;
  min-height: 360px;
  height: 100%;
  background: #efeaf5;
  align-self: stretch;
}
.pv-hero__img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  opacity: 0;
  transition: opacity .28s ease;
}
.pv-hero__img.is-on { opacity: 1; }
.pv-online {
  position: absolute;
  top: 14px;
  left: 14px;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 28px;
  padding: 0 11px;
  border-radius: 999px;
  background: rgba(255,255,255,.92);
  color: #2d6b52;
  font-size: 12px;
  font-weight: 700;
  box-shadow: 0 6px 16px rgba(0,0,0,.08);
}
.pv-online i {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #3aa981;
  box-shadow: 0 0 0 3px rgba(58,169,129,.22);
}
.pv-nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 2;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 0;
  background: rgba(255,255,255,.9);
  color: var(--oyvra-text);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  box-shadow: 0 6px 16px rgba(0,0,0,.12);
}
.pv-nav:hover { background: #fff; }
.pv-nav--prev { left: 10px; }
.pv-nav--next { right: 10px; }
.pv-nav iconify-icon { width: 18px; height: 18px; }
.pv-count {
  position: absolute;
  right: 12px;
  bottom: 12px;
  z-index: 2;
  min-height: 26px;
  padding: 0 10px;
  border-radius: 999px;
  background: rgba(20,16,28,.55);
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  backdrop-filter: blur(6px);
}
.pv-hero__body {
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 24px 24px 22px;
  min-width: 0;
  justify-content: space-between;
}
.pv-hero__top { min-width: 0; }
.pv-name-row {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.pv-name {
  margin: 0;
  font-family: var(--oyvra-display);
  font-size: clamp(26px, 3vw, 34px);
  font-weight: 600;
  letter-spacing: -0.02em;
  line-height: 1.1;
  color: var(--oyvra-text);
}
.pv-name span {
  font-weight: 500;
  color: var(--oyvra-text-secondary);
}
.pv-verified {
  display: inline-flex;
  color: #e85a9a;
}
.pv-verified iconify-icon { width: 22px; height: 22px; }
.pv-role {
  margin: 6px 0 0;
  font-size: 14px;
  font-weight: 600;
  color: var(--oyvra-text-secondary);
}
.pv-loc {
  margin: 6px 0 0;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  font-weight: 600;
  color: var(--oyvra-text-muted);
}
.pv-loc iconify-icon { width: 14px; height: 14px; }
.pv-facts {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}
.pv-fact {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 34px;
  padding: 0 12px;
  border-radius: 999px;
  background: #f7f2f8;
  border: 1px solid #efe8f1;
  color: var(--oyvra-text-secondary);
}
.pv-fact iconify-icon { width: 15px; height: 15px; color: #d86a9a; }
.pv-fact em {
  font-style: normal;
  font-size: 12px;
  font-weight: 700;
}
.pv-bio {
  margin: 0;
  font-size: 14px;
  line-height: 1.55;
  color: var(--oyvra-text-secondary);
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.pv-acts {
  display: flex;
  align-items: center;
  gap: 12px;
}
.pv-act {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  border: 1.5px solid var(--oyvra-border);
  background: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  color: var(--oyvra-text-secondary);
  box-shadow: 0 6px 16px rgba(37,33,43,.06);
}
.pv-act iconify-icon { width: 20px; height: 20px; }
.pv-act--pass:hover { border-color: rgba(217,75,99,.35); color: var(--oyvra-danger); background: #fff4f6; }
.pv-act--like {
  width: 56px;
  height: 56px;
  border: 0;
  color: #fff;
  background: linear-gradient(145deg, #ff6ea8 0%, #e84f8c 100%);
  box-shadow: 0 10px 24px rgba(232,79,140,.35);
}
.pv-act--like iconify-icon { width: 24px; height: 24px; }
.pv-act--star {
  color: #7c4dff;
  border-color: rgba(124,77,255,.28);
  background: #f6f1ff;
}
.pv-act--star:hover { background: #efe8ff; }
.pv-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.pv-tag {
  min-height: 30px;
  padding: 0 12px;
  border-radius: 999px;
  background: #f4f1f6;
  border: 1px solid #ece7f0;
  font-size: 12px;
  font-weight: 700;
  color: var(--oyvra-text-secondary);
  display: inline-flex;
  align-items: center;
}
.pv-panel {
  background: #fff;
  border: 1px solid var(--oyvra-border);
  border-radius: 20px;
  box-shadow: var(--oyvra-shadow-sm);
  padding: 18px 18px 16px;
  width: 100%;
  box-sizing: border-box;
}
.pv-panel__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 14px;
  min-height: 32px;
}
.pv-panel__head h3 {
  margin: 0;
  font-size: 16px;
  font-weight: 800;
  letter-spacing: -0.02em;
}
.pv-link {
  font-size: 13px;
  font-weight: 700;
  color: #d86a9a;
  text-decoration: none;
}
.pv-chip-soft {
  min-height: 28px;
  padding: 0 10px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  background: #fcebf3;
  color: #c45b88;
  font-size: 12px;
  font-weight: 700;
}
.pv-photo-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.pv-thumb {
  position: relative;
  width: calc((100% - 50px) / 6);
  min-width: 72px;
  max-width: 110px;
  margin: 0;
  padding: 0;
  border: 2px solid transparent;
  border-radius: 14px;
  overflow: hidden;
  aspect-ratio: 1;
  background: #f3eef7;
  cursor: pointer;
  flex: 0 0 auto;
}
.pv-thumb.is-on { border-color: #e85a9a; }
.pv-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .3s ease;
}
.pv-thumb:hover img { transform: scale(1.04); }
.pv-thumb__more {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(20,16,28,.45);
  color: #fff;
  font-size: 18px;
  font-weight: 800;
}
.pv-about {
  margin: 0 0 16px;
  font-size: 14px;
  line-height: 1.6;
  color: var(--oyvra-text-secondary);
}
.pv-detail-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px 20px;
  margin-bottom: 16px;
  align-items: start;
}
.pv-detail {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 10px;
  align-items: start;
  min-width: 0;
}
.pv-detail__ico {
  width: 34px;
  height: 34px;
  border-radius: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  background: #f7f1f8;
  color: #d86a9a;
}
.pv-detail__ico iconify-icon { width: 16px; height: 16px; }
.pv-detail__copy { min-width: 0; }
.pv-detail small {
  display: block;
  font-size: 11px;
  font-weight: 700;
  color: var(--oyvra-text-muted);
  text-transform: uppercase;
  letter-spacing: .04em;
}
.pv-detail strong {
  display: block;
  margin-top: 2px;
  font-size: 13px;
  font-weight: 700;
  color: var(--oyvra-text);
  line-height: 1.35;
  word-break: break-word;
}
.pv-script {
  margin: 8px 0 0;
  padding: 14px 16px;
  border-radius: 16px;
  background: linear-gradient(180deg, #fff7fb 0%, #fceef5 100%);
  border: 1px solid #f5dfea;
  font-family: var(--oyvra-display);
  font-style: italic;
  font-size: 17px;
  font-weight: 500;
  color: #c45b88;
  text-align: center;
  line-height: 1.4;
}
.pv-interest-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(118px, 1fr));
  gap: 10px;
  align-items: stretch;
}
.pv-interest {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 118px;
  padding: 16px 10px 14px;
  border-radius: 18px;
  border: 1px solid rgba(124,77,255,.08);
  background: linear-gradient(180deg, #fff 0%, #faf6fb 100%);
  text-align: center;
}
.pv-interest--t0 { background: linear-gradient(180deg, #fff7fb 0%, #fdeef6 100%); }
.pv-interest--t1 { background: linear-gradient(180deg, #f6f1ff 0%, #efe8ff 100%); }
.pv-interest--t2 { background: linear-gradient(180deg, #eff8ff 0%, #e6f2ff 100%); }
.pv-interest--t3 { background: linear-gradient(180deg, #f3fbf4 0%, #e8f6ea 100%); }
.pv-interest--t4 { background: linear-gradient(180deg, #fff8ee 0%, #fff1dc 100%); }
.pv-interest--t5 { background: linear-gradient(180deg, #fef3f0 0%, #fde8e4 100%); }
.pv-interest--t6 { background: linear-gradient(180deg, #f3f7ff 0%, #e8eeff 100%); }
.pv-interest--t7 { background: linear-gradient(180deg, #f7f4ff 0%, #efeafc 100%); }
.pv-interest__emoji {
  font-size: 34px;
  line-height: 1;
  filter: drop-shadow(0 4px 8px rgba(80, 40, 80, .08));
}
.pv-interest.is-shared { box-shadow: 0 0 0 2px rgba(232,90,154,.45); }
.pv-interest__meta {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  color: var(--oyvra-text, #2b2033);
  min-width: 0;
  width: 100%;
}
.pv-interest__ico {
  width: 22px;
  height: 22px;
  border-radius: 8px;
  background: rgba(255,255,255,.72);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  color: #8a4d7a;
}
.pv-interest__ico iconify-icon { width: 13px; height: 13px; }
.pv-interest__meta strong {
  font-size: 12px;
  font-weight: 800;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
}
.pv-shuffle {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 32px;
  padding: 0 12px;
  border-radius: 999px;
  border: 1px solid rgba(124,77,255,.2);
  background: #f6f1ff;
  color: #6b3fd6;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
}
.pv-shuffle iconify-icon { width: 15px; height: 15px; }
.pv-shuffle:hover { background: #efe8ff; }
.pv-starters {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  align-items: stretch;
}
.pv-starter {
  text-align: left;
  min-height: 88px;
  height: 100%;
  padding: 14px;
  border-radius: 14px;
  border: 1px solid #ebe3f2;
  background: #faf6fc;
  color: var(--oyvra-text);
  font-size: 13px;
  font-weight: 600;
  line-height: 1.45;
  cursor: pointer;
  transition: border-color .15s ease, background .15s ease, transform .15s ease;
  display: flex;
  align-items: flex-start;
}
.pv-starter:hover {
  background: #fff;
  border-color: rgba(124,77,255,.28);
  transform: translateY(-1px);
}
.pv-note {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
}
.pv-note .input {
  min-height: 48px;
  border-radius: 14px;
  width: 100%;
}
.pv-note-hints {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}
.pv-note-hint {
  max-width: 100%;
  min-height: 30px;
  padding: 0 12px;
  border-radius: 999px;
  border: 1px solid #efe8f1;
  background: #faf7fc;
  color: var(--oyvra-text-secondary);
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.pv-note-hint:hover {
  border-color: rgba(216,106,154,.35);
  color: #c45b88;
  background: #fff7fb;
}
.pv-rail {
  position: sticky;
  top: calc(var(--topbar) + 16px);
  align-self: start;
  gap: 12px;
  width: 100%;
  min-width: 0;
}
.pv-side {
  background: #fff;
  border: 1px solid var(--oyvra-border);
  border-radius: 18px;
  box-shadow: var(--oyvra-shadow-sm);
  padding: 16px;
  width: 100%;
  box-sizing: border-box;
}
.pv-side h3 {
  margin: 0 0 12px;
  font-size: 15px;
  font-weight: 800;
}
.pv-side--quote {
  background: linear-gradient(160deg, #fff0f6 0%, #fce4ef 100%);
  border-color: #f5d7e6;
  text-align: center;
  padding: 22px 18px;
}
.pv-side--quote p {
  margin: 0;
  font-family: var(--oyvra-display);
  font-style: italic;
  font-size: 16px;
  font-weight: 500;
  color: #c45b88;
  line-height: 1.4;
  overflow-wrap: anywhere;
}
.pv-look {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 8px;
}
.pv-look li {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr);
  gap: 10px;
  align-items: start;
  font-size: 13px;
  font-weight: 600;
  color: var(--oyvra-text);
  line-height: 1.4;
}
.pv-look__check {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: #fcebf3;
  color: #d86a9a;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.pv-look__check iconify-icon { width: 13px; height: 13px; }
.pv-side--compat { text-align: center; }
.pv-ring {
  --p: 70;
  --ring-size: 128px;
  --hole: 72%;
  position: relative;
  width: var(--ring-size);
  height: var(--ring-size);
  margin: 4px auto 10px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background:
    radial-gradient(closest-side, #fff var(--hole), transparent calc(var(--hole) + 1%)),
    conic-gradient(#e85a9a calc(var(--p) * 1%), #efe8f2 0);
  box-shadow: inset 0 0 0 1px #f3eaf1;
}
.pv-ring__score {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: calc(var(--ring-size) * 0.58);
  height: calc(var(--ring-size) * 0.58);
  border-radius: 50%;
  text-align: center;
  z-index: 1;
}
.pv-ring__score strong {
  display: block;
  margin: 0;
  font-size: 28px;
  font-weight: 800;
  letter-spacing: -0.03em;
  color: var(--oyvra-text);
  line-height: 1;
}
.pv-ring__label {
  display: block;
  margin: 0 auto 12px;
  font-size: 12px;
  font-weight: 700;
  color: #d86a9a;
  line-height: 1.2;
}
.pv-why {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 6px;
  text-align: left;
}
.pv-why li {
  padding: 8px 10px;
  border-radius: 10px;
  background: #faf7fc;
  border: 1px solid #efeaf4;
  font-size: 12px;
  font-weight: 600;
  color: var(--oyvra-text-secondary);
  overflow-wrap: anywhere;
}
.pv-safety { display: grid; gap: 8px; }
.pv-safety__btn {
  width: 100%;
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 0 14px;
  border-radius: 999px;
  border: 1.5px solid var(--oyvra-border);
  background: #fff;
  color: var(--oyvra-text);
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  transition: border-color .15s ease, background .15s ease, color .15s ease;
}
.pv-safety__btn iconify-icon {
  width: 16px;
  height: 16px;
  color: var(--oyvra-text-secondary);
}
.pv-safety__btn:hover {
  border-color: rgba(124,77,255,.3);
  background: var(--oyvra-primary-soft);
}
.pv-safety__btn--alert:hover {
  border-color: rgba(217,75,99,.35);
  background: #fff4f6;
  color: var(--oyvra-danger);
}
.pv-safety__btn--alert:hover iconify-icon { color: var(--oyvra-danger); }
.pv-similar {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 8px;
}
.pv-similar__row {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 8px;
  border-radius: 14px;
  text-decoration: none;
  color: inherit;
  transition: background .15s ease;
  min-width: 0;
}
.pv-similar__row:hover { background: #faf7fc; }
.pv-similar__row img {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  object-fit: cover;
  border: 2px solid #f5eaf1;
}
.pv-similar__row strong {
  display: block;
  font-size: 13px;
  font-weight: 800;
  color: var(--oyvra-text);
  line-height: 1.2;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.pv-similar__row span {
  display: block;
  margin-top: 2px;
  font-size: 11px;
  font-weight: 600;
  color: var(--oyvra-text-muted);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.pv-similar__heart {
  color: #e85a9a;
  display: inline-flex;
}
.pv-similar__heart iconify-icon { width: 16px; height: 16px; }
.pv-side--promo {
  display: block;
  text-decoration: none;
  background: linear-gradient(145deg, #8b5cf6 0%, #6d3fe0 55%, #5b2fd0 100%);
  border: 0;
  color: #fff;
  padding: 20px 18px;
  box-shadow: 0 12px 28px rgba(109,63,224,.28);
}
.pv-side--promo strong {
  display: block;
  font-size: 15px;
  font-weight: 800;
  line-height: 1.3;
}
.pv-side--promo span {
  display: block;
  margin-top: 6px;
  font-size: 12px;
  opacity: .88;
  line-height: 1.4;
}

@media (max-width: 1100px) {
  .pv-thumb { width: calc((100% - 30px) / 4); }
  .pv-interest-grid { grid-template-columns: repeat(auto-fill, minmax(108px, 1fr)); }
}
@media (max-width: 980px) {
  .pv-hero { grid-template-columns: 1fr; }
  .pv-hero__media {
    aspect-ratio: 4 / 5;
    max-height: 420px;
    width: 100%;
  }
  .pv-rail { position: static; }
}
@media (max-width: 720px) {
  .pv-detail-grid,
  .pv-starters { grid-template-columns: 1fr; }
  .pv-thumb { width: calc((100% - 20px) / 3); }
  .pv-note { grid-template-columns: 1fr; }
  .pv-interest-grid { grid-template-columns: repeat(auto-fill, minmax(100px, 1fr)); }
  .pv-starter { min-height: 72px; }
}

/* —— Travel —— */
.shell--travel .workspace {
  background:
    radial-gradient(920px 440px at 8% -10%, rgba(124,77,255,.09), transparent 58%),
    radial-gradient(700px 360px at 100% 4%, rgba(91,140,255,.07), transparent 52%),
    linear-gradient(180deg, #fbfafc 0%, #f4f1f8 100%);
}
.shell--travel .page--travel {
  max-width: 1320px;
  align-items: start;
  gap: 22px;
}
.trv-main { min-width: 0; }
.trv-intro {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 18px;
}
.trv-title {
  margin: 0;
  font-family: var(--oyvra-display), Georgia, serif;
  font-size: clamp(32px, 3.6vw, 44px);
  font-weight: 700;
  letter-spacing: -.03em;
  line-height: 1.05;
  color: var(--oyvra-text);
}
.trv-lede {
  margin: 8px 0 0;
  font-size: 15px;
  color: var(--oyvra-text-secondary);
  line-height: 1.5;
}
.trv-intro-script {
  margin: 0;
  flex-shrink: 0;
  max-width: 220px;
  text-align: right;
  font-family: var(--oyvra-script), cursive;
  font-size: clamp(22px, 2.2vw, 28px);
  font-weight: 600;
  line-height: 1.15;
  color: #8b7bb8;
  transform: rotate(-2deg);
}
.trv-script-heart {
  display: inline-flex;
  vertical-align: middle;
  color: var(--oyvra-accent);
  margin-left: 2px;
}
.trv-hero {
  position: relative;
  min-height: 280px;
  margin-bottom: 22px;
  border-radius: 28px;
  overflow: hidden;
  box-shadow: 0 18px 44px rgba(60, 40, 90, .14);
  isolation: isolate;
}
.trv-hero-bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: scale(1.02);
  transition: transform .7s ease;
}
.trv-hero:hover .trv-hero-bg { transform: scale(1.06); }
.trv-hero-shade {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(105deg, rgba(28, 18, 48, .72) 0%, rgba(28, 18, 48, .42) 42%, rgba(28, 18, 48, .18) 70%, rgba(28, 18, 48, .28) 100%);
  z-index: 1;
}
.trv-hero-copy {
  position: relative;
  z-index: 2;
  max-width: 520px;
  padding: 40px 44px;
  color: #fff;
}
.trv-hero-copy h3 {
  margin: 0;
  font-family: var(--oyvra-display), Georgia, serif;
  font-size: clamp(26px, 2.8vw, 36px);
  font-weight: 700;
  letter-spacing: -.02em;
  line-height: 1.15;
  text-transform: uppercase;
}
.trv-hero-copy h3 span {
  display: inline;
  font-size: .78em;
  font-weight: 600;
  letter-spacing: -.01em;
  text-transform: none;
  opacity: .96;
}
.trv-hero-copy p {
  margin: 14px 0 22px;
  max-width: 42ch;
  font-size: 15px;
  line-height: 1.55;
  color: rgba(255,255,255,.88);
}
.trv-hero-cta {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 46px;
  padding: 0 22px;
  border-radius: 999px;
  background: #fff;
  color: var(--oyvra-primary-dark);
  font-weight: 700;
  box-shadow: 0 10px 28px rgba(20, 12, 40, .22);
  transition: transform .18s ease, box-shadow .18s ease;
}
.trv-hero-cta:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 32px rgba(20, 12, 40, .28);
  color: var(--oyvra-primary-dark);
}
.trv-hero-script {
  position: absolute;
  right: 28px;
  bottom: 28px;
  z-index: 2;
  margin: 0;
  text-align: right;
  font-family: var(--oyvra-script), cursive;
  font-size: clamp(24px, 2.4vw, 32px);
  font-weight: 600;
  line-height: 1.15;
  color: rgba(255,255,255,.96);
  text-shadow: 0 8px 24px rgba(20, 10, 40, .35);
  transform: rotate(-3deg);
}
.trv-toolbar {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 22px;
}
.trv-search {
  flex: 1;
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 48px;
  padding: 0 16px;
  border-radius: 999px;
  border: 1px solid var(--oyvra-border);
  background: #fff;
  box-shadow: var(--oyvra-shadow-sm);
  color: var(--oyvra-text-muted);
}
.trv-search input {
  flex: 1;
  min-width: 0;
  border: 0;
  outline: 0;
  background: transparent;
  font: inherit;
  font-size: 14px;
  font-weight: 500;
  color: var(--oyvra-text);
}
.trv-search input::placeholder { color: var(--oyvra-text-muted); }
.trv-filters { position: relative; flex-shrink: 0; }
.trv-filters summary {
  list-style: none;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 48px;
  padding: 0 16px;
  border-radius: 999px;
  border: 1px solid var(--oyvra-border);
  background: #fff;
  box-shadow: var(--oyvra-shadow-sm);
  font-size: 14px;
  font-weight: 700;
  color: var(--oyvra-text);
  cursor: pointer;
}
.trv-filters summary::-webkit-details-marker { display: none; }
.trv-filters summary iconify-icon { color: var(--oyvra-text-secondary); }
.trv-filters-menu {
  position: absolute;
  right: 0;
  top: calc(100% + 8px);
  z-index: 12;
  min-width: 180px;
  padding: 8px;
  border-radius: 16px;
  border: 1px solid var(--oyvra-border);
  background: #fff;
  box-shadow: var(--oyvra-shadow-md);
  display: grid;
  gap: 2px;
}
.trv-filters-label {
  margin: 0;
  padding: 6px 10px 4px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--oyvra-text-muted);
}
.trv-filters-menu a {
  padding: 9px 10px;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 600;
  color: var(--oyvra-text);
}
.trv-filters-menu a:hover {
  background: var(--oyvra-primary-soft);
  color: var(--oyvra-primary-dark);
}
.trv-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 14px;
}
.trv-section-label {
  margin: 0;
  font-size: 18px;
  font-weight: 700;
  color: var(--oyvra-text);
}
.trv-see-all {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  font-size: 13px;
  font-weight: 700;
  color: var(--oyvra-primary);
}
.trv-see-all:hover { color: var(--oyvra-primary-dark); }
.trv-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}
.trv-card {
  display: block;
  border-radius: 22px;
  overflow: hidden;
  background: #fff;
  border: 1px solid rgba(234, 229, 239, .9);
  box-shadow: 0 10px 28px rgba(70, 45, 100, .07);
  transition: transform .2s ease, box-shadow .2s ease;
}
.trv-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 16px 36px rgba(70, 45, 100, .12);
}
.trv-card-media {
  position: relative;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  background: #efeaf5;
}
.trv-card-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .45s ease;
}
.trv-card:hover .trv-card-media img { transform: scale(1.05); }
.trv-fav {
  position: absolute;
  top: 12px;
  right: 12px;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: rgba(255,255,255,.92);
  color: var(--oyvra-text-muted);
  border: 0;
  box-shadow: 0 6px 16px rgba(30, 18, 50, .12);
  cursor: pointer;
  transition: color .15s ease, background .15s ease, transform .15s ease;
}
.trv-fav:hover { transform: scale(1.06); color: var(--oyvra-accent); }
.trv-fav.is-on {
  color: #fff;
  background: var(--oyvra-accent);
}
.trv-card-body { padding: 14px 16px 16px; }
.trv-card-body h3 {
  margin: 0 0 6px;
  font-size: 17px;
  font-weight: 700;
  color: var(--oyvra-text);
}
.trv-card-body p {
  margin: 0;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  font-weight: 600;
  color: var(--oyvra-text-muted);
}
.trv-card-body p iconify-icon { color: var(--oyvra-primary); }
.trv-empty {
  grid-column: 1 / -1;
  display: grid;
  place-items: center;
  gap: 10px;
  padding: 48px 24px;
  border-radius: 22px;
  border: 1px dashed var(--oyvra-border);
  background: rgba(255,255,255,.7);
  text-align: center;
  color: var(--oyvra-text-secondary);
}
.trv-empty iconify-icon { color: var(--oyvra-primary); }
.trv-rail { gap: 14px; }
.trv-rail .rail-card { border-radius: 20px; }
.trv-rail-promo {
  background:
    linear-gradient(160deg, #f3edff 0%, #faf7ff 55%, #fff 100%);
  border: 1px solid #e6ddff;
}
.trv-rail-ico {
  width: 42px;
  height: 42px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  margin-bottom: 12px;
  background: var(--oyvra-primary-soft);
  color: var(--oyvra-primary);
}
.trv-rail-ico--sm {
  width: 34px;
  height: 34px;
  border-radius: 12px;
  margin: 0;
}
.trv-rail-promo h3,
.trv-safety h3 {
  margin-bottom: 8px;
}
.trv-rail-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 4px;
}
.trv-rail-head h3 { margin-bottom: 0; }
.trv-rail-head a {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  font-size: 12px;
  font-weight: 700;
  color: var(--oyvra-primary);
  white-space: nowrap;
}
.trv-trip-list { display: grid; gap: 4px; margin-top: 8px; }
.trv-trip-row {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 8px;
  margin: 0 -4px;
  border-radius: 14px;
  color: inherit;
  transition: background .15s ease;
}
.trv-trip-row:hover { background: var(--oyvra-surface-soft); }
.trv-trip-row img {
  width: 48px;
  height: 48px;
  border-radius: 12px;
  object-fit: cover;
  flex-shrink: 0;
}
.trv-trip-row div { flex: 1; min-width: 0; }
.trv-trip-row strong {
  display: block;
  font-size: 14px;
  font-weight: 700;
  color: var(--oyvra-text);
}
.trv-trip-row p {
  margin: 3px 0 0;
  font-size: 12px;
  color: var(--oyvra-text-muted);
}
.trv-trip-row iconify-icon {
  color: var(--oyvra-text-muted);
  flex-shrink: 0;
}
.trv-safety-head {
  justify-content: flex-start;
  margin-bottom: 12px;
}
.trv-safety-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 10px;
}
.trv-safety-list li {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: 13px;
  font-weight: 600;
  color: var(--oyvra-text-secondary);
  line-height: 1.4;
}
.trv-check {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  flex-shrink: 0;
  background: var(--oyvra-primary-soft);
  color: var(--oyvra-primary);
  margin-top: 1px;
}
.trv-moment {
  position: relative;
  min-height: 200px;
  border-radius: 22px;
  overflow: hidden;
  box-shadow: 0 12px 30px rgba(60, 40, 90, .12);
}
.trv-moment img {
  width: 100%;
  height: 100%;
  min-height: 200px;
  object-fit: cover;
  display: block;
}
.trv-moment-shade {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 30%, rgba(20, 12, 40, .55) 100%);
}
.trv-moment-script {
  position: absolute;
  left: 18px;
  right: 18px;
  bottom: 18px;
  margin: 0;
  font-family: var(--oyvra-script), cursive;
  font-size: 26px;
  font-weight: 600;
  line-height: 1.15;
  color: #fff;
  text-shadow: 0 6px 18px rgba(10, 6, 24, .4);
}

@media (max-width: 1100px) {
  .trv-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 980px) {
  .trv-intro {
    flex-direction: column;
    align-items: flex-start;
  }
  .trv-intro-script { text-align: left; transform: none; }
  .trv-hero-copy { padding: 28px 24px; }
  .trv-hero-script {
    right: 18px;
    bottom: 18px;
    font-size: 22px;
  }
  .shell--travel .page--travel > .rail { display: none; }
}
@media (max-width: 720px) {
  .trv-grid { grid-template-columns: 1fr 1fr; gap: 12px; }
  .trv-toolbar { flex-wrap: wrap; }
  .trv-search { min-height: 44px; }
  .trv-filters summary { min-height: 44px; width: 100%; justify-content: center; }
  .trv-hero { min-height: 320px; }
  .trv-card-body { padding: 12px; }
  .trv-card-body h3 { font-size: 15px; }
}
@media (max-width: 520px) {
  .trv-grid { grid-template-columns: 1fr; }
}

/* —— Events —— */
.shell--events .workspace {
  background:
    radial-gradient(900px 420px at 4% -8%, rgba(124,77,255,.09), transparent 58%),
    radial-gradient(720px 360px at 100% 0%, rgba(216,106,154,.07), transparent 55%),
    linear-gradient(180deg, #fbfafc 0%, #f5f1f8 100%);
}
.shell--events .page--events {
  max-width: 1320px;
  align-items: start;
  gap: 22px;
}
.evt-main { min-width: 0; }
.evt-intro {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 22px;
}
.evt-kicker {
  margin: 0 0 6px;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--oyvra-primary);
}
.evt-title {
  margin: 0;
  font-family: var(--oyvra-display), Georgia, serif;
  font-size: clamp(30px, 3.5vw, 42px);
  font-weight: 700;
  letter-spacing: -.03em;
  line-height: 1.08;
  color: var(--oyvra-text);
}
.evt-lede {
  margin: 10px 0 0;
  font-size: 15px;
  font-weight: 600;
  color: var(--oyvra-text-secondary);
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.evt-lede-heart { color: var(--oyvra-primary); display: inline-flex; }
.evt-intro-aside {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 14px;
  flex-shrink: 0;
}
.evt-intro-script {
  margin: 0;
  text-align: right;
  font-family: var(--oyvra-script), cursive;
  font-size: clamp(22px, 2.2vw, 28px);
  font-weight: 600;
  line-height: 1.15;
  color: #8b7bb8;
  transform: rotate(-2deg);
}
.evt-script-heart {
  display: inline-flex;
  vertical-align: middle;
  color: var(--oyvra-accent);
}
.evt-host-btn {
  border-radius: 999px;
  min-height: 46px;
  padding: 0 20px;
  gap: 8px;
  box-shadow: 0 10px 24px rgba(124, 77, 255, .28);
}
.evt-controls { margin-bottom: 22px; }
.evt-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 14px;
}
.evt-tab {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 40px;
  padding: 0 16px;
  border-radius: 999px;
  border: 1.5px solid var(--oyvra-border);
  background: #fff;
  font-size: 13px;
  font-weight: 700;
  color: var(--oyvra-text-secondary);
  transition: background .15s ease, border-color .15s ease, color .15s ease;
}
.evt-tab em {
  font-style: normal;
  min-width: 20px;
  height: 20px;
  padding: 0 6px;
  border-radius: 999px;
  display: inline-grid;
  place-items: center;
  background: var(--oyvra-surface-soft);
  font-size: 11px;
  font-weight: 800;
  color: var(--oyvra-text-muted);
}
.evt-tab:hover {
  border-color: #d9cff8;
  color: var(--oyvra-primary-dark);
}
.evt-tab.is-on {
  background: var(--oyvra-primary);
  border-color: var(--oyvra-primary);
  color: #fff;
  box-shadow: 0 8px 20px rgba(124, 77, 255, .28);
}
.evt-tab.is-on em {
  background: rgba(255,255,255,.22);
  color: #fff;
}
.evt-tab-short { display: none; }
.evt-toolbar {
  display: flex;
  align-items: center;
  gap: 12px;
}
.evt-search {
  flex: 1;
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 48px;
  padding: 0 16px;
  border-radius: 999px;
  border: 1px solid var(--oyvra-border);
  background: #fff;
  box-shadow: var(--oyvra-shadow-sm);
  color: var(--oyvra-text-muted);
}
.evt-search input {
  flex: 1;
  min-width: 0;
  border: 0;
  outline: 0;
  background: transparent;
  font: inherit;
  font-size: 14px;
  font-weight: 500;
  color: var(--oyvra-text);
}
.evt-search input::placeholder { color: var(--oyvra-text-muted); }
.evt-filters { position: relative; flex-shrink: 0; }
.evt-filters summary {
  list-style: none;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 48px;
  padding: 0 16px;
  border-radius: 999px;
  border: 1px solid var(--oyvra-border);
  background: #fff;
  box-shadow: var(--oyvra-shadow-sm);
  font-size: 14px;
  font-weight: 700;
  color: var(--oyvra-text);
  cursor: pointer;
}
.evt-filters summary::-webkit-details-marker { display: none; }
.evt-filters summary iconify-icon { color: var(--oyvra-text-secondary); }
.evt-filters-menu {
  position: absolute;
  right: 0;
  top: calc(100% + 8px);
  z-index: 12;
  min-width: 180px;
  padding: 8px;
  border-radius: 16px;
  border: 1px solid var(--oyvra-border);
  background: #fff;
  box-shadow: var(--oyvra-shadow-md);
  display: grid;
  gap: 2px;
}
.evt-filters-label {
  margin: 0;
  padding: 6px 10px 4px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--oyvra-text-muted);
}
.evt-filters-menu a {
  padding: 9px 10px;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 600;
  color: var(--oyvra-text);
}
.evt-filters-menu a:hover,
.evt-filters-menu a.is-on {
  background: var(--oyvra-primary-soft);
  color: var(--oyvra-primary-dark);
}
.evt-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 14px;
}
.evt-section-label {
  margin: 0;
  font-size: 18px;
  font-weight: 700;
  color: var(--oyvra-text);
}
.evt-see-all {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  font-size: 13px;
  font-weight: 700;
  color: var(--oyvra-primary);
}
.evt-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}
.evt-card {
  display: flex;
  flex-direction: column;
  border-radius: 22px;
  overflow: hidden;
  background: #fff;
  border: 1px solid rgba(234, 229, 239, .9);
  box-shadow: 0 10px 28px rgba(70, 45, 100, .07);
  transition: transform .2s ease, box-shadow .2s ease;
}
.evt-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 16px 36px rgba(70, 45, 100, .12);
}
.evt-card-media {
  position: relative;
  display: block;
  aspect-ratio: 16 / 11;
  overflow: hidden;
  background: #efeaf5;
}
.evt-card-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .45s ease;
}
.evt-card:hover .evt-card-media img { transform: scale(1.05); }
.evt-card.is-past .evt-card-media img { filter: saturate(.85); }
.evt-featured {
  position: absolute;
  top: 12px;
  left: 12px;
  z-index: 2;
  padding: 5px 10px;
  border-radius: 999px;
  background: rgba(255,255,255,.94);
  color: var(--oyvra-primary-dark);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .02em;
  box-shadow: 0 6px 16px rgba(30, 18, 50, .12);
}
.evt-featured--past {
  color: var(--oyvra-text-secondary);
}
.evt-joined-pill {
  position: absolute;
  top: 12px;
  left: 12px;
  z-index: 2;
  margin-top: 30px;
  padding: 5px 10px;
  border-radius: 999px;
  background: rgba(58, 169, 129, .95);
  color: #fff;
  font-size: 11px;
  font-weight: 800;
}
.evt-card:has(.evt-featured) .evt-joined-pill { margin-top: 34px; }
.evt-fav {
  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 2;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: rgba(255,255,255,.92);
  color: var(--oyvra-text-muted);
  border: 0;
  box-shadow: 0 6px 16px rgba(30, 18, 50, .12);
  cursor: pointer;
  transition: color .15s ease, background .15s ease, transform .15s ease;
}
.evt-fav:hover { transform: scale(1.06); color: var(--oyvra-accent); }
.evt-fav.is-on {
  color: #fff;
  background: var(--oyvra-accent);
}
.evt-date {
  position: absolute;
  left: 12px;
  bottom: 12px;
  z-index: 2;
  min-width: 56px;
  padding: 8px 10px;
  border-radius: 14px;
  background: rgba(255,255,255,.95);
  text-align: center;
  box-shadow: 0 8px 20px rgba(30, 18, 50, .14);
  line-height: 1.05;
}
.evt-date span {
  display: block;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .04em;
  color: var(--oyvra-text-muted);
}
.evt-date strong {
  display: block;
  margin: 2px 0;
  font-size: 20px;
  font-weight: 800;
  color: var(--oyvra-text);
}
.evt-card-body {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 14px 16px 16px;
  flex: 1;
}
.evt-card-body h3 {
  margin: 0;
  font-size: 17px;
  font-weight: 700;
  line-height: 1.25;
}
.evt-card-body h3 a { color: var(--oyvra-text); }
.evt-card-body h3 a:hover { color: var(--oyvra-primary-dark); }
.evt-place {
  margin: 0;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  font-weight: 600;
  color: var(--oyvra-text-muted);
}
.evt-place iconify-icon { color: var(--oyvra-primary); flex-shrink: 0; }
.evt-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.evt-tags span {
  padding: 4px 10px;
  border-radius: 999px;
  background: var(--oyvra-primary-soft);
  color: var(--oyvra-primary-dark);
  font-size: 11px;
  font-weight: 700;
}
.evt-card-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-top: auto;
  padding-top: 6px;
}
.evt-going {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}
.evt-avatars {
  display: flex;
  align-items: center;
}
.evt-avatars img {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  object-fit: cover;
  border: 2px solid #fff;
  margin-left: -8px;
  background: #efeaf5;
}
.evt-avatars img:first-child { margin-left: 0; }
.evt-going span {
  font-size: 12px;
  font-weight: 700;
  color: var(--oyvra-text-muted);
  white-space: nowrap;
}
.evt-view {
  font-size: 13px;
  font-weight: 700;
  color: var(--oyvra-primary);
  white-space: nowrap;
}
.evt-view:hover { color: var(--oyvra-primary-dark); }
.evt-empty {
  grid-column: 1 / -1;
  display: grid;
  place-items: center;
  gap: 12px;
  padding: 48px 24px;
  border-radius: 22px;
  border: 1px dashed var(--oyvra-border);
  background: rgba(255,255,255,.7);
  text-align: center;
  color: var(--oyvra-text-secondary);
}
.evt-empty iconify-icon { color: var(--oyvra-primary); }
.evt-rail { gap: 14px; }
.evt-rail .rail-card { border-radius: 20px; }
.evt-why-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 10px;
}
.evt-why-list li {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 13px;
  font-weight: 600;
  color: var(--oyvra-text-secondary);
}
.evt-why-ico {
  width: 32px;
  height: 32px;
  border-radius: 10px;
  display: grid;
  place-items: center;
  flex-shrink: 0;
  background: var(--oyvra-primary-soft);
  color: var(--oyvra-primary);
}
.evt-travel {
  position: relative;
  min-height: 220px;
  border-radius: 22px;
  overflow: hidden;
  box-shadow: 0 12px 30px rgba(60, 40, 90, .12);
}
.evt-travel img {
  width: 100%;
  height: 100%;
  min-height: 220px;
  object-fit: cover;
  display: block;
}
.evt-travel-shade {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(20,12,40,.15) 10%, rgba(20,12,40,.62) 100%);
}
.evt-travel-copy {
  position: absolute;
  left: 16px;
  right: 16px;
  bottom: 16px;
  z-index: 1;
}
.evt-travel-script {
  margin: 0 0 12px;
  font-family: var(--oyvra-script), cursive;
  font-size: 26px;
  font-weight: 600;
  line-height: 1.15;
  color: #fff;
  text-shadow: 0 6px 18px rgba(10, 6, 24, .4);
}
.evt-travel-cta {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  min-height: 40px;
  padding: 0 14px;
  border-radius: 999px;
  background: #fff;
  color: var(--oyvra-primary-dark);
  font-size: 13px;
  font-weight: 700;
}
.evt-host-ico {
  width: 42px;
  height: 42px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  margin-bottom: 12px;
  background: var(--oyvra-primary-soft);
  color: var(--oyvra-primary);
}
.evt-host-rail-btn {
  margin-top: 12px;
  border-radius: 999px;
  gap: 8px;
  background: var(--oyvra-primary-soft);
  color: var(--oyvra-primary-dark);
  border: 0;
  font-weight: 700;
}
.evt-host-rail-btn:hover {
  background: #e5dbff;
  color: var(--oyvra-primary-dark);
}

@media (max-width: 1100px) {
  .evt-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 980px) {
  .evt-intro {
    flex-direction: column;
    align-items: stretch;
  }
  .evt-intro-aside {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
  }
  .evt-intro-script { text-align: left; transform: none; }
  .shell--events .page--events > .rail { display: none; }
}
@media (max-width: 720px) {
  .evt-title { font-size: 28px; }
  .evt-tab-full { display: none; }
  .evt-tab-short { display: inline; }
  .evt-toolbar { gap: 8px; }
  .evt-search { min-height: 44px; }
  .evt-filters summary {
    min-height: 44px;
    width: 44px;
    padding: 0;
    justify-content: center;
  }
  .evt-filters summary span,
  .evt-filters summary iconify-icon:last-child { display: none; }
  .evt-grid { grid-template-columns: 1fr; gap: 14px; }
  .evt-card-body { padding: 14px; }
  .evt-host-btn { width: 100%; justify-content: center; }
  .evt-intro-aside { flex-direction: column; align-items: stretch; gap: 12px; }
}


/* —— Safety Center —— */
.shell--safety .workspace {
  background:
    radial-gradient(900px 420px at 6% -10%, rgba(124,77,255,.1), transparent 58%),
    radial-gradient(680px 340px at 100% 0%, rgba(217,75,99,.06), transparent 52%),
    linear-gradient(180deg, #fbfafc 0%, #f4f1f8 100%);
}
.shell--safety .page--safety {
  max-width: 1280px;
  grid-template-columns: 1fr;
  align-items: start;
}
.safe-layout {
  display: grid;
  gap: 22px;
  min-width: 0;
  width: 100%;
}
.safe-hero {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}
.safe-kicker {
  margin: 0 0 8px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--oyvra-primary);
}
.safe-title {
  margin: 0;
  display: flex;
  align-items: center;
  gap: 12px;
  font-family: var(--oyvra-display), Georgia, serif;
  font-size: clamp(28px, 3.4vw, 40px);
  font-weight: 700;
  letter-spacing: -.03em;
  line-height: 1.1;
  color: var(--oyvra-text);
}
.safe-title-ico {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 14px;
  background: linear-gradient(145deg, #8A5FFF, var(--oyvra-primary));
  color: #fff;
  flex-shrink: 0;
  box-shadow: 0 10px 24px rgba(124,77,255,.28);
}
.safe-lede {
  margin: 10px 0 0;
  max-width: 46ch;
  font-size: 15px;
  color: var(--oyvra-text-secondary);
  line-height: 1.45;
}
.safe-hero-banner {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 12px 18px 12px 12px;
  border-radius: 999px;
  background:
    linear-gradient(120deg, rgba(240,235,255,.95), rgba(252,235,243,.7));
  border: 1px solid rgba(124,77,255,.12);
  box-shadow: var(--oyvra-shadow-sm);
  flex-shrink: 0;
}
.safe-hero-portrait {
  position: relative;
  width: 72px;
  height: 72px;
  flex-shrink: 0;
}
.safe-hero-portrait img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 50%;
  border: 3px solid #fff;
  box-shadow: 0 8px 20px rgba(92,53,214,.18);
}
.safe-hero-heart {
  position: absolute;
  right: -2px;
  bottom: -2px;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #fff;
  color: var(--oyvra-accent);
  box-shadow: 0 4px 12px rgba(37,33,43,.12);
}
.safe-hero-script {
  margin: 0;
  font-family: var(--oyvra-script), cursive;
  font-size: clamp(18px, 1.8vw, 24px);
  font-weight: 600;
  line-height: 1.2;
  color: #8b7bb8;
  max-width: 18ch;
}
.safe-script-heart {
  display: inline-flex;
  vertical-align: middle;
  color: var(--oyvra-accent);
}

.safe-body {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 1.15fr) minmax(240px, .78fr);
  gap: 18px;
  align-items: start;
}
.safe-card {
  background: var(--oyvra-surface);
  border: 1px solid var(--oyvra-border);
  border-radius: 22px;
  padding: 22px;
  box-shadow: var(--oyvra-shadow-sm);
  min-width: 0;
}
.safe-card-head {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 18px;
}
.safe-card-ico {
  width: 40px;
  height: 40px;
  border-radius: 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--oyvra-primary-soft);
  color: var(--oyvra-primary);
  flex-shrink: 0;
}
.safe-card-ico--shield {
  background: #efe9ff;
  color: var(--oyvra-primary-dark);
}
.safe-card-head h3 {
  margin: 0;
  font-size: 18px;
  font-weight: 700;
}
.safe-card-head p {
  margin: 4px 0 0;
  font-size: 13px;
  color: var(--oyvra-text-muted);
}
.safe-form .field { margin-bottom: 14px; }
.safe-optional {
  font-weight: 500;
  color: var(--oyvra-text-muted);
}
.safe-input {
  position: relative;
  display: flex;
  align-items: center;
}
.safe-input > iconify-icon {
  position: absolute;
  left: 14px;
  color: var(--oyvra-text-muted);
  pointer-events: none;
  z-index: 1;
}
.safe-input .input {
  width: 100%;
  padding-left: 42px;
  border-radius: 14px;
  min-height: 48px;
  background: #faf8fc;
}
.safe-input--phone .safe-cc {
  position: absolute;
  left: 12px;
  z-index: 1;
  font-size: 12px;
  font-weight: 700;
  color: var(--oyvra-text-secondary);
  white-space: nowrap;
  pointer-events: none;
}
.safe-input--phone > iconify-icon { left: 72px; }
.safe-input--phone .input { padding-left: 98px; }
.safe-form .textarea {
  width: 100%;
  border-radius: 14px;
  min-height: 88px;
  background: #faf8fc;
  resize: vertical;
}
.safe-switch {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin: 4px 0 16px;
  cursor: pointer;
  user-select: none;
}
.safe-switch input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
.safe-switch-ui {
  width: 44px;
  height: 26px;
  border-radius: 999px;
  background: #e5e0ec;
  position: relative;
  flex-shrink: 0;
  transition: background .2s ease;
  margin-top: 1px;
}
.safe-switch-ui::after {
  content: "";
  position: absolute;
  top: 3px;
  left: 3px;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 2px 6px rgba(37,33,43,.16);
  transition: transform .2s ease;
}
.safe-switch input:checked + .safe-switch-ui {
  background: linear-gradient(90deg, #8A5FFF, var(--oyvra-primary));
}
.safe-switch input:checked + .safe-switch-ui::after {
  transform: translateX(18px);
}
.safe-switch-copy {
  font-size: 13px;
  font-weight: 600;
  color: var(--oyvra-text-secondary);
  line-height: 1.35;
}
.safe-switch-copy em {
  font-style: normal;
  font-weight: 500;
  color: var(--oyvra-text-muted);
}
.safe-kinds {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 2px 0 14px;
}
.safe-kind {
  cursor: pointer;
}
.safe-kind input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
.safe-kind span {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 0 14px;
  border-radius: 999px;
  border: 1.5px solid var(--oyvra-border);
  background: #fff;
  font-size: 13px;
  font-weight: 600;
  color: var(--oyvra-text-secondary);
  transition: .15s ease;
}
.safe-kind.is-on span,
.safe-kind:has(input:checked) span {
  background: var(--oyvra-primary-soft);
  border-color: var(--oyvra-primary);
  color: var(--oyvra-primary-dark);
}
.safe-check { margin-bottom: 14px; }
.safe-submit {
  width: 100%;
  min-height: 48px;
  border-radius: 14px;
  justify-content: center;
  gap: 8px;
  font-weight: 700;
}
.safe-contact-list {
  list-style: none;
  margin: 16px 0 0;
  padding: 16px 0 0;
  border-top: 1px solid var(--oyvra-border);
  display: grid;
  gap: 10px;
}
.safe-contact-list li {
  display: flex;
  align-items: center;
  gap: 12px;
}
.safe-contact-avatar {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--oyvra-primary-soft);
  color: var(--oyvra-primary-dark);
  font-size: 13px;
  font-weight: 700;
  flex-shrink: 0;
}
.safe-contact-list strong {
  display: block;
  font-size: 14px;
}
.safe-contact-list p {
  margin: 2px 0 0;
  font-size: 12px;
  color: var(--oyvra-text-muted);
}

.safe-aside {
  display: grid;
  gap: 14px;
  min-width: 0;
}
.safe-emergency {
  border-radius: 20px;
  padding: 18px;
  background: linear-gradient(165deg, #fff5f6 0%, #ffe8ec 100%);
  border: 1px solid rgba(217,75,99,.14);
}
.safe-emergency-ico {
  width: 42px;
  height: 42px;
  border-radius: 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(217,75,99,.12);
  color: var(--oyvra-danger);
  margin-bottom: 10px;
}
.safe-emergency h3 {
  margin: 0 0 6px;
  font-size: 16px;
}
.safe-emergency p {
  margin: 0 0 14px;
  font-size: 13px;
  color: var(--oyvra-text-secondary);
  line-height: 1.4;
}
.safe-emergency-btn {
  width: 100%;
  justify-content: center;
  gap: 8px;
  min-height: 44px;
  border-radius: 12px;
  background: var(--oyvra-danger);
  color: #fff;
  font-weight: 700;
  border: 0;
}
.safe-emergency-btn:hover {
  filter: brightness(.96);
  color: #fff;
}
.safe-tools,
.safe-support {
  border-radius: 20px;
  padding: 16px;
  box-shadow: var(--oyvra-shadow-sm);
}
.safe-tools-title {
  margin: 0 0 8px;
  font-size: 14px;
  font-weight: 700;
}
.safe-tool-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 4px;
}
.safe-tool {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 8px;
  border-radius: 14px;
  color: inherit;
  text-decoration: none;
  transition: background .15s ease;
}
.safe-tool:hover { background: var(--oyvra-surface-soft); }
.safe-tool-ico {
  width: 36px;
  height: 36px;
  border-radius: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.safe-tool-ico--rose { background: #fde8ec; color: var(--oyvra-danger); }
.safe-tool-ico--amber { background: #fff1df; color: #c67a1a; }
.safe-tool-ico--mint { background: #e4f6ef; color: var(--oyvra-success); }
.safe-tool-ico--violet { background: var(--oyvra-primary-soft); color: var(--oyvra-primary); }
.safe-tool-copy { flex: 1; min-width: 0; }
.safe-tool-copy strong {
  display: block;
  font-size: 13px;
  font-weight: 700;
}
.safe-tool-copy small {
  display: block;
  margin-top: 2px;
  font-size: 11px;
  color: var(--oyvra-text-muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.safe-tool-chev { color: var(--oyvra-text-muted); flex-shrink: 0; }
.safe-support {
  display: grid;
  gap: 12px;
  justify-items: start;
}
.safe-support-ico {
  width: 40px;
  height: 40px;
  border-radius: 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--oyvra-primary-soft);
  color: var(--oyvra-primary);
}
.safe-support h3 { margin: 0 0 4px; font-size: 15px; }
.safe-support p {
  margin: 0;
  font-size: 12px;
  color: var(--oyvra-text-muted);
}

.safe-section-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}
.safe-section-head h3 {
  margin: 0;
  font-size: 18px;
  font-weight: 700;
}
.safe-section-meta {
  font-size: 12px;
  font-weight: 600;
  color: var(--oyvra-text-muted);
}
.safe-plan-list {
  display: grid;
  gap: 12px;
}
.safe-plan {
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr) auto;
  gap: 14px;
  align-items: start;
  padding: 14px;
  border-radius: 18px;
  background: var(--oyvra-surface);
  border: 1px solid var(--oyvra-border);
  box-shadow: var(--oyvra-shadow-sm);
}
.safe-plan-thumb {
  width: 72px;
  height: 72px;
  object-fit: cover;
  border-radius: 14px;
  background: var(--oyvra-surface-soft);
}
.safe-plan-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 4px;
}
.safe-plan-top h4 {
  margin: 0;
  font-size: 15px;
  font-weight: 700;
}
.safe-badge {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 0 10px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  flex-shrink: 0;
}
.safe-badge.is-planned {
  background: #e4f6ef;
  color: #1f7a5c;
}
.safe-badge.is-progress {
  background: var(--oyvra-primary-soft);
  color: var(--oyvra-primary-dark);
}
.safe-badge.is-done {
  background: #eceaf0;
  color: #6f6878;
}
.safe-badge.is-cancelled {
  background: #fde8ec;
  color: var(--oyvra-danger);
}
.safe-plan-meta {
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  color: var(--oyvra-text-muted);
}
.safe-plan-meta iconify-icon { color: var(--oyvra-primary); }
.safe-dot { opacity: .5; }
.safe-plan-notes {
  margin: 8px 0 0;
  font-size: 13px;
  color: var(--oyvra-text-secondary);
  line-height: 1.4;
}
.safe-plan-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 14px;
  margin-top: 10px;
}
.safe-link {
  appearance: none;
  border: 0;
  background: none;
  padding: 0;
  font: inherit;
  font-size: 13px;
  font-weight: 700;
  color: var(--oyvra-text-secondary);
  cursor: pointer;
  text-decoration: none;
}
.safe-link--primary { color: var(--oyvra-primary); }
.safe-link--danger { color: var(--oyvra-danger); }
.safe-link:hover { text-decoration: underline; }
.safe-link:disabled {
  cursor: default;
  opacity: .7;
  text-decoration: none;
}
.safe-plan-more { position: relative; }
.safe-plan-more summary {
  list-style: none;
  width: 36px;
  height: 36px;
  border-radius: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  color: var(--oyvra-text-muted);
}
.safe-plan-more summary::-webkit-details-marker { display: none; }
.safe-plan-more summary:hover { background: var(--oyvra-surface-soft); }
.safe-plan-menu {
  position: absolute;
  right: 0;
  top: calc(100% + 4px);
  z-index: 5;
  min-width: 160px;
  padding: 8px;
  border-radius: 14px;
  background: #fff;
  border: 1px solid var(--oyvra-border);
  box-shadow: var(--oyvra-shadow-md);
  display: grid;
  gap: 4px;
}
.safe-plan-menu button,
.safe-plan-menu p {
  appearance: none;
  border: 0;
  background: none;
  width: 100%;
  text-align: left;
  padding: 8px 10px;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 600;
  color: var(--oyvra-text);
  cursor: pointer;
  margin: 0;
}
.safe-plan-menu button:hover { background: var(--oyvra-surface-soft); }
.safe-plan-menu p {
  cursor: default;
  font-weight: 500;
  color: var(--oyvra-text-secondary);
  line-height: 1.35;
}
.safe-empty {
  display: grid;
  justify-items: center;
  gap: 10px;
  text-align: center;
  padding: 36px 20px;
  border-radius: 18px;
  border: 1.5px dashed var(--oyvra-border);
  background: rgba(255,255,255,.6);
  color: var(--oyvra-text-muted);
}
.safe-empty iconify-icon { color: var(--oyvra-primary); }
.safe-empty p { margin: 0; max-width: 36ch; font-size: 14px; }

.safe-blocked-list {
  display: grid;
  gap: 10px;
}
.safe-blocked-row {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  border-radius: 16px;
  background: var(--oyvra-surface);
  border: 1px solid var(--oyvra-border);
}
.safe-blocked-copy { flex: 1; min-width: 0; }
.safe-blocked-copy strong { display: block; font-size: 14px; }
.safe-blocked-copy p {
  margin: 2px 0 0;
  font-size: 12px;
  color: var(--oyvra-text-muted);
}

.safe-guide {
  padding: 18px 20px;
  border-radius: 18px;
  background: rgba(255,255,255,.72);
  border: 1px solid var(--oyvra-border);
}
.safe-guide h3 {
  margin: 0 0 10px;
  font-size: 15px;
}
.safe-guide ul {
  margin: 0;
  padding-left: 18px;
  display: grid;
  gap: 6px;
  color: var(--oyvra-text-secondary);
  font-size: 13px;
  line-height: 1.45;
}

.safe-tip {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 16px 18px;
  border-radius: 18px;
  background: linear-gradient(100deg, #f0ebff 0%, #f7f0ff 55%, #fcebf3 100%);
  border: 1px solid rgba(124,77,255,.12);
}
.safe-tip-ico {
  width: 40px;
  height: 40px;
  border-radius: 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #fff;
  color: var(--oyvra-primary);
  flex-shrink: 0;
  box-shadow: var(--oyvra-shadow-sm);
}
.safe-tip-copy { flex: 1; min-width: 0; }
.safe-tip-copy strong {
  display: block;
  font-size: 14px;
  margin-bottom: 2px;
}
.safe-tip-copy p {
  margin: 0;
  font-size: 13px;
  color: var(--oyvra-text-secondary);
}

@media (max-width: 1100px) {
  .safe-body {
    grid-template-columns: 1fr 1fr;
  }
  .safe-aside {
    grid-column: 1 / -1;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
@media (max-width: 860px) {
  .safe-hero {
    flex-direction: column;
    align-items: stretch;
  }
  .safe-hero-banner {
    border-radius: 20px;
    align-self: stretch;
  }
  .safe-body { grid-template-columns: 1fr; }
  .safe-aside { grid-template-columns: 1fr; }
  .safe-plan {
    grid-template-columns: 64px minmax(0, 1fr);
  }
  .safe-plan-more {
    grid-column: 2;
    justify-self: end;
  }
  .safe-tip {
    flex-wrap: wrap;
  }
}
@media (max-width: 520px) {
  .safe-card { padding: 18px 16px; }
  .safe-title { font-size: 26px; gap: 10px; }
  .safe-title-ico { width: 38px; height: 38px; border-radius: 12px; }
  .safe-plan-thumb { width: 56px; height: 56px; }
  .safe-hero-script { font-size: 18px; }
}

/* ===== Me / Your Profile page ===== */
.shell--me .workspace {
  background: var(--oyvra-background);
}
.shell--me .me-hero,
.shell--me .me-card,
.shell--me .me-side,
.shell--me .me-tabs {
  animation: oyvraFeedRise .48s cubic-bezier(.2,.8,.2,1) both;
}
.page--me {
  grid-template-columns: minmax(0, 1fr) minmax(260px, 300px);
  max-width: 1200px;
  align-items: start;
  gap: 20px;
}
.me-main {
  display: flex;
  flex-direction: column;
  gap: 16px;
  min-width: 0;
  width: 100%;
}
.me-kicker {
  margin: 0;
  font-size: 14px;
  font-weight: 500;
  color: var(--oyvra-text-secondary);
  line-height: 1.35;
}
.me-intro h2 {
  margin: 0 0 4px;
  font-family: var(--oyvra-display);
  font-size: clamp(26px, 3vw, 34px);
  font-weight: 600;
  letter-spacing: -0.02em;
  color: var(--oyvra-text);
}
.me-intro p {
  margin: 0;
  font-size: 14px;
  color: var(--oyvra-text-secondary);
}
.me-hero {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 18px;
  align-items: center;
  padding: 20px 22px;
  border-radius: 22px;
  background:
    radial-gradient(420px 180px at 92% 20%, rgba(124,77,255,.12), transparent 60%),
    linear-gradient(135deg, #f4efff 0%, #faf7ff 45%, #fff 100%);
  border: 1px solid rgba(124,77,255,.12);
  box-shadow: var(--oyvra-shadow-sm);
  overflow: hidden;
  position: relative;
}
.me-hero__avatar {
  position: relative;
  width: 96px;
  height: 96px;
  flex-shrink: 0;
}
.me-hero__avatar img {
  width: 96px;
  height: 96px;
  border-radius: 50%;
  object-fit: cover;
  border: 3px solid #fff;
  box-shadow: 0 8px 22px rgba(92,53,214,.16);
  display: block;
}
.me-hero__cam {
  position: absolute;
  right: 2px;
  bottom: 2px;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: #7c4dff;
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4px 12px rgba(124,77,255,.35);
  text-decoration: none;
}
.me-hero__cam iconify-icon { width: 15px; height: 15px; }
.me-hero__copy { min-width: 0; }
.me-hero__name {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.me-hero__name h3 {
  margin: 0;
  font-size: 22px;
  font-weight: 800;
  letter-spacing: -0.02em;
  color: var(--oyvra-text);
}
.me-hero__verified {
  display: inline-flex;
  color: #4f8cff;
}
.me-hero__verified iconify-icon { width: 20px; height: 20px; }
.me-hero__role {
  margin: 4px 0 0;
  font-size: 13px;
  font-weight: 600;
  color: var(--oyvra-text-secondary);
}
.me-hero__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 10px;
}
.me-hero__tags span,
.me-hero__tag-add {
  min-height: 28px;
  padding: 0 11px;
  border-radius: 999px;
  background: rgba(255,255,255,.82);
  border: 1px solid rgba(124,77,255,.14);
  font-size: 12px;
  font-weight: 700;
  color: var(--oyvra-text-secondary);
  display: inline-flex;
  align-items: center;
}
.me-hero__tag-add {
  width: 28px;
  padding: 0;
  justify-content: center;
  text-decoration: none;
  color: #7c4dff;
}
.me-hero__bio {
  margin: 10px 0 0;
  display: flex;
  gap: 8px;
  align-items: flex-start;
  font-size: 13px;
  line-height: 1.45;
  color: var(--oyvra-text-secondary);
}
.me-hero__bio iconify-icon {
  width: 16px;
  height: 16px;
  color: #7c4dff;
  margin-top: 2px;
  flex-shrink: 0;
}
.me-hero__side {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 12px;
  min-width: 160px;
}
.me-hero__script {
  margin: 0;
  font-family: var(--oyvra-display);
  font-style: italic;
  font-size: 15px;
  font-weight: 500;
  color: rgba(124,77,255,.55);
  text-align: right;
  max-width: 140px;
  line-height: 1.3;
}
.me-hero__public {
  white-space: nowrap;
}
.me-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 6px;
  border-radius: 16px;
  background: #fff;
  border: 1px solid var(--oyvra-border);
  box-shadow: var(--oyvra-shadow-sm);
}
.me-tab {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 40px;
  padding: 0 14px;
  border-radius: 12px;
  text-decoration: none;
  color: var(--oyvra-text-secondary);
  font-size: 13px;
  font-weight: 700;
  transition: background .15s ease, color .15s ease;
}
.me-tab iconify-icon { width: 16px; height: 16px; }
.me-tab:hover { background: #f6f2fb; color: var(--oyvra-text); }
.me-tab.is-on {
  background: #7c4dff;
  color: #fff;
  box-shadow: 0 8px 18px rgba(124,77,255,.28);
}
.me-card {
  background: #fff;
  border: 1px solid var(--oyvra-border);
  border-radius: 20px;
  box-shadow: var(--oyvra-shadow-sm);
  padding: 20px 20px 18px;
}
.me-card__head {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr);
  gap: 12px;
  align-items: start;
  margin-bottom: 18px;
}
.me-card__head--sub { margin-top: 8px; }
.me-card__head h3 {
  margin: 0 0 2px;
  font-size: 16px;
  font-weight: 800;
}
.me-card__head p {
  margin: 0;
  font-size: 13px;
  color: var(--oyvra-text-muted);
}
.me-card__ico {
  width: 40px;
  height: 40px;
  border-radius: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--oyvra-primary-soft);
  color: var(--oyvra-primary);
}
.me-card__ico iconify-icon { width: 18px; height: 18px; }
.me-grid {
  display: grid;
  gap: 14px;
  margin-bottom: 14px;
}
.me-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.me-card .field { margin-bottom: 14px; }
.me-card .field label em {
  font-style: normal;
  font-weight: 500;
  color: var(--oyvra-text-muted);
}
.me-card .input,
.me-card .select,
.me-card .textarea {
  border-radius: 14px;
  min-height: 46px;
}
.me-card .textarea { min-height: 110px; resize: vertical; }
.me-count {
  margin-top: 6px;
  text-align: right;
  font-size: 12px;
  font-weight: 600;
  color: var(--oyvra-text-muted);
}
.me-input-ico {
  position: relative;
}
.me-input-ico > iconify-icon {
  position: absolute;
  left: 14px;
  top: 50%;
  transform: translateY(-50%);
  width: 16px;
  height: 16px;
  color: var(--oyvra-text-muted);
  pointer-events: none;
  z-index: 1;
}
.me-input-ico .input { padding-left: 40px; }
.me-skill-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 8px;
}
.me-skill-tags span {
  min-height: 28px;
  padding: 0 10px;
  border-radius: 999px;
  background: var(--oyvra-primary-soft);
  color: var(--oyvra-primary-dark);
  font-size: 12px;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
}
.me-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: 8px;
  padding-top: 16px;
  border-top: 1px solid var(--oyvra-border);
}
.me-actions--split { justify-content: space-between; }
.me-label {
  margin: 4px 0 10px;
  font-size: 13px;
  font-weight: 700;
  color: var(--oyvra-text-secondary);
}
.me-upload {
  position: relative;
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  min-height: 52px;
  padding: 6px 14px 6px 6px;
  border: 1.5px solid var(--oyvra-border);
  border-radius: 16px;
  background: #fff;
  cursor: pointer;
  box-sizing: border-box;
}
.me-upload:hover,
.me-upload:focus-within {
  border-color: var(--oyvra-primary);
}
.me-upload__input {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  cursor: pointer;
  z-index: 2;
  font-size: 16px;
  touch-action: manipulation;
}
.me-upload__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  min-height: 36px;
  padding: 0 14px;
  border-radius: 10px;
  background: #f4f0fb;
  border: 1px solid rgba(124, 77, 255, .18);
  color: #5b3cc4;
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
}
.me-upload__meta {
  min-width: 0;
  font-size: 13px;
  font-weight: 600;
  color: var(--oyvra-text-muted);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.me-photo-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 16px;
  align-items: start;
}
.me-photo-grid > .caption {
  grid-column: 1 / -1;
  margin: 0;
}
.me-photo {
  margin: 0;
  position: relative;
  width: 100%;
  height: 0;
  padding-bottom: 100%;
  border-radius: 16px;
  overflow: hidden;
  border: 1px solid var(--oyvra-border);
  background: #f4f0f8;
}
.me-photo img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
  display: block;
}
.me-photo.is-main { box-shadow: 0 0 0 2px #7c4dff; }
.me-photo.is-pending { box-shadow: 0 0 0 2px rgba(124,77,255,.35); }
.me-photo-count {
  margin: 0 0 10px;
  font-size: 13px;
  font-weight: 800;
  color: var(--oyvra-ink, #2b2140);
}
.me-photo__badge {
  position: absolute;
  left: 8px;
  top: 8px;
  z-index: 2;
  min-height: 22px;
  padding: 0 8px;
  border-radius: 999px;
  background: rgba(124,77,255,.92);
  color: #fff;
  font-size: 11px;
  font-weight: 800;
  display: inline-flex;
  align-items: center;
}
.me-photo__badge[hidden] { display: none; }
.me-photo__bar {
  position: absolute;
  inset: auto 0 0;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
  padding: 22px 8px 8px;
  background: linear-gradient(180deg, transparent, rgba(28, 16, 48, .78));
}
.me-photo__main {
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  cursor: pointer;
}
.me-photo__main input { accent-color: #c4b5fd; margin: 0; }
.me-photo__remove {
  flex: none;
  width: 28px;
  height: 28px;
  border: 0;
  border-radius: 999px;
  background: rgba(255,255,255,.94);
  color: #5b21b6;
  font-size: 20px;
  line-height: 1;
  cursor: pointer;
}
.me-photo__remove:hover { background: #fff; }
.me-stock {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 12px;
  margin: 0 0 8px;
  align-items: stretch;
}
.me-stock__item {
  position: relative;
  display: block;
  width: 100%;
  height: 0;
  padding-bottom: 100%;
  margin: 0;
  border-radius: 16px;
  overflow: hidden;
  cursor: pointer;
  border: 2px solid transparent;
  background: #f6f1fb;
  box-sizing: border-box;
}
.me-stock__item input {
  position: absolute;
  opacity: 0;
  inset: 0;
  margin: 0;
  cursor: pointer;
  z-index: 2;
}
.me-stock__item img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
  display: block;
  pointer-events: none;
}
.me-stock__check {
  position: absolute;
  right: 6px;
  top: 6px;
  z-index: 3;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: #7c4dff;
  color: #fff;
  display: none;
  align-items: center;
  justify-content: center;
  pointer-events: none;
  box-shadow: 0 2px 8px rgba(92, 53, 214, .28);
}
.me-stock__check::after {
  content: "";
  width: 5px;
  height: 9px;
  margin-top: -1px;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}
.me-stock__item:hover {
  border-color: rgba(124, 77, 255, .35);
}
.me-stock__item:has(input:checked) {
  border-color: #7c4dff;
  box-shadow: 0 0 0 2px rgba(124,77,255,.18);
}
.me-stock__item:has(input:checked) .me-stock__check { display: inline-flex; }
.me-stock__item.is-in {
  opacity: .55;
  pointer-events: none;
}
.me-interest-group {
  margin: 0 0 16px;
}
.me-interest-group h4 {
  margin: 0 0 8px;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--oyvra-text-muted);
}
.me-interest-pick {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 8px;
}
.me-interest-chip {
  cursor: pointer;
}
.me-interest-chip input { position: absolute; opacity: 0; pointer-events: none; }
.me-interest-chip span {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 36px;
  padding: 0 12px;
  border-radius: 999px;
  border: 1.5px solid var(--oyvra-border);
  background: #fff;
  font-size: 13px;
  font-weight: 700;
  color: var(--oyvra-text-secondary);
  transition: border-color .15s ease, background .15s ease, color .15s ease;
}
.me-interest-chip span iconify-icon { width: 15px; height: 15px; }
.me-interest-chip:has(input:checked) span {
  border-color: rgba(124,77,255,.4);
  background: var(--oyvra-primary-soft);
  color: var(--oyvra-primary-dark);
}
.me-check { margin: 8px 0; }
.me-account-links {
  display: grid;
  gap: 6px;
  margin: 8px 0 4px;
}
.me-account-links a {
  display: grid;
  grid-template-columns: 20px minmax(0, 1fr) 16px;
  gap: 10px;
  align-items: center;
  min-height: 48px;
  padding: 0 12px;
  border-radius: 14px;
  text-decoration: none;
  color: var(--oyvra-text);
  font-size: 14px;
  font-weight: 700;
  border: 1px solid var(--oyvra-border);
  background: #fff;
}
.me-account-links a:hover { background: #faf7fc; }
.me-account-links a > iconify-icon:first-child {
  width: 18px;
  height: 18px;
  color: var(--oyvra-primary);
}
.me-account-links .chev {
  width: 16px;
  height: 16px;
  color: var(--oyvra-text-muted);
}
.me-rail {
  position: sticky;
  top: calc(var(--topbar) + 16px);
  align-self: start;
  gap: 12px;
  width: 100%;
}
.me-side {
  background: #fff;
  border: 1px solid var(--oyvra-border);
  border-radius: 18px;
  box-shadow: var(--oyvra-shadow-sm);
  padding: 16px;
}
.me-side h3 {
  margin: 0 0 8px;
  font-size: 15px;
  font-weight: 800;
}
.me-side .caption { margin: 0 0 12px; }
.me-complete-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 14px;
}
.me-complete-top p {
  margin: 4px 0 0;
  font-size: 12px;
  font-weight: 700;
  color: var(--oyvra-text-muted);
}
.me-complete-ring {
  --p: 0;
  width: 64px;
  height: 64px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  flex-shrink: 0;
  background:
    radial-gradient(closest-side, #fff 68%, transparent 69%),
    conic-gradient(#7c4dff calc(var(--p) * 1%), #efe8f8 0);
}
.me-complete-ring strong {
  font-size: 13px;
  font-weight: 800;
  color: var(--oyvra-text);
}
.me-checks {
  list-style: none;
  margin: 0 0 14px;
  padding: 0;
  display: grid;
  gap: 8px;
}
.me-checks li {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr);
  gap: 8px;
  align-items: center;
  font-size: 13px;
  font-weight: 600;
}
.me-checks a {
  color: var(--oyvra-text);
  text-decoration: none;
}
.me-checks a:hover { color: var(--oyvra-primary); }
.me-checks__ico {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #f3eef8;
  color: var(--oyvra-text-muted);
}
.me-checks__ico iconify-icon { width: 13px; height: 13px; }
.me-checks li.is-done .me-checks__ico {
  background: #ebe4ff;
  color: #7c4dff;
}
.me-checks li.is-done a { color: var(--oyvra-text-secondary); }
.btn-block { width: 100%; justify-content: center; }
.me-side--actions { padding: 12px; }
.me-quick {
  display: grid;
  grid-template-columns: 36px minmax(0, 1fr) 16px;
  gap: 10px;
  align-items: center;
  min-height: 48px;
  padding: 0 8px;
  border-radius: 12px;
  text-decoration: none;
  color: var(--oyvra-text);
  font-size: 13px;
  font-weight: 700;
}
.me-quick:hover { background: #faf7fc; }
.me-quick__ico {
  width: 36px;
  height: 36px;
  border-radius: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--oyvra-primary-soft);
  color: var(--oyvra-primary);
}
.me-quick__ico iconify-icon { width: 17px; height: 17px; }
.me-quick .chev {
  width: 16px;
  height: 16px;
  color: var(--oyvra-text-muted);
}
.me-side--promo {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  text-decoration: none;
  background: linear-gradient(160deg, #fff0f6 0%, #fce4ef 100%);
  border-color: #f5d7e6;
  color: inherit;
}
.me-side--promo-head {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}
.me-side--promo-ico {
  width: 36px;
  height: 36px;
  flex-shrink: 0;
  border-radius: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(255,255,255,.75);
  color: #d86a9a;
}
.me-side--promo-ico iconify-icon { width: 18px; height: 18px; }
.me-side--promo strong {
  display: block;
  min-width: 0;
  font-size: 15px;
  font-weight: 800;
  line-height: 1.2;
  color: var(--oyvra-text);
}
.me-side--promo-copy {
  display: block;
  margin-top: 8px;
  font-size: 12px;
  line-height: 1.4;
  color: var(--oyvra-text-secondary);
}
.me-side--promo em {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin-top: 10px;
  padding: 0;
  font-style: normal;
  font-size: 13px;
  font-weight: 800;
  line-height: 1.2;
  color: #c45b88;
  white-space: nowrap;
}
.me-side--promo em span { flex-shrink: 0; line-height: 1; }

@media (max-width: 980px) {
  .page--me { grid-template-columns: 1fr; }
  .me-rail { position: static; }
  .me-hero {
    grid-template-columns: auto minmax(0, 1fr);
  }
  .me-hero__side {
    grid-column: 1 / -1;
    align-items: flex-start;
    flex-direction: row;
    justify-content: space-between;
    min-width: 0;
  }
  .me-hero__script { text-align: left; }
}
@media (max-width: 720px) {
  .me-grid--2 { grid-template-columns: 1fr; }
  .me-stock { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .me-photo-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .me-tabs { overflow-x: auto; flex-wrap: nowrap; }
  .me-tab span { display: none; }
  .me-tab { width: 42px; padding: 0; justify-content: center; }
  .me-tab.is-on span { display: inline; }
  .me-tab.is-on { width: auto; padding: 0 12px; }
}


/* —— Help & Support —— */
.shell--help .workspace {
  background:
    radial-gradient(920px 440px at 4% -12%, rgba(124,77,255,.1), transparent 58%),
    radial-gradient(700px 360px at 100% 0%, rgba(216,106,154,.07), transparent 52%),
    linear-gradient(180deg, #fbfafc 0%, #f5f1f8 100%);
}
.shell--help .page--help {
  max-width: 1280px;
  grid-template-columns: 1fr;
  align-items: start;
}
.hs-layout {
  display: grid;
  gap: 28px;
  width: 100%;
  min-width: 0;
}
.hs-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(240px, .8fr);
  gap: 28px;
  align-items: center;
}
.hs-kicker {
  margin: 0 0 8px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--oyvra-text-muted);
}
.hs-title {
  margin: 0;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  font-family: var(--oyvra-display), Georgia, serif;
  font-size: clamp(32px, 4vw, 46px);
  font-weight: 700;
  letter-spacing: -.03em;
  line-height: 1.08;
  color: var(--oyvra-text);
}
.hs-title-heart {
  display: inline-flex;
  color: var(--oyvra-primary);
  filter: drop-shadow(0 6px 14px rgba(124,77,255,.35));
}
.hs-lede {
  margin: 12px 0 0;
  max-width: 42ch;
  font-size: 16px;
  color: var(--oyvra-text-secondary);
  line-height: 1.45;
}
.hs-search {
  margin-top: 22px;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 8px 8px 16px;
  border-radius: 999px;
  background: #fff;
  border: 1.5px solid var(--oyvra-border);
  box-shadow: var(--oyvra-shadow-sm);
  max-width: 560px;
}
.hs-search > iconify-icon {
  color: var(--oyvra-text-muted);
  flex-shrink: 0;
}
.hs-search input {
  flex: 1;
  min-width: 0;
  border: 0;
  background: transparent;
  font: inherit;
  font-size: 14px;
  color: var(--oyvra-text);
  outline: none;
  min-height: 40px;
}
.hs-search input::placeholder { color: var(--oyvra-text-muted); }
.hs-search-btn {
  flex-shrink: 0;
  min-height: 42px;
  padding: 0 20px;
  border-radius: 999px;
  font-weight: 700;
}
.hs-hero-art {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 220px;
}
.hs-hero-orb {
  width: min(220px, 100%);
  aspect-ratio: 1;
  border-radius: 50%;
  overflow: hidden;
  background:
    radial-gradient(circle at 30% 25%, #c4b5fd, transparent 45%),
    linear-gradient(160deg, #8A5FFF 0%, #6D4AFF 55%, #D86A9A 120%);
  box-shadow: 0 18px 40px rgba(92,53,214,.22);
  position: relative;
}
.hs-hero-orb img {
  position: absolute;
  inset: 10% 8% 0;
  width: 84%;
  height: 90%;
  object-fit: cover;
  object-position: center top;
  border-radius: 40% 40% 48% 48%;
  mix-blend-mode: normal;
}
.hs-hero-script {
  position: absolute;
  right: 0;
  top: 8%;
  margin: 0;
  text-align: right;
  font-family: var(--oyvra-script), cursive;
  font-size: clamp(20px, 2vw, 26px);
  font-weight: 600;
  line-height: 1.15;
  color: #8b7bb8;
  transform: rotate(-3deg);
}
.hs-script-heart {
  display: inline-flex;
  vertical-align: middle;
  color: var(--oyvra-accent);
}
.hs-hero-note {
  position: absolute;
  left: 4%;
  bottom: 12%;
  margin: 0;
  font-family: var(--oyvra-script), cursive;
  font-size: 20px;
  color: #a78bba;
  transform: rotate(-4deg);
}

.hs-popular-label {
  margin: 0 0 10px;
  font-size: 13px;
  font-weight: 700;
  color: var(--oyvra-text-secondary);
}
.hs-chips {
  display: flex;
  flex-wrap: nowrap;
  gap: 8px;
  overflow-x: auto;
  padding-bottom: 4px;
  scrollbar-width: none;
}
.hs-chips::-webkit-scrollbar { display: none; }
.hs-chip {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  min-height: 36px;
  padding: 0 14px;
  border-radius: 999px;
  border: 1.5px solid var(--oyvra-border);
  background: #fff;
  color: var(--oyvra-text-secondary);
  font-size: 13px;
  font-weight: 600;
  text-decoration: none;
  transition: .15s ease;
}
.hs-chip:hover {
  border-color: #d4c8f5;
  color: var(--oyvra-primary-dark);
}
.hs-chip.is-on {
  background: var(--oyvra-primary-soft);
  border-color: var(--oyvra-primary);
  color: var(--oyvra-primary-dark);
}

.hs-section-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 14px;
}
.hs-section-head h3 {
  margin: 0;
  font-size: 18px;
  font-weight: 700;
}
.hs-section-meta {
  font-size: 12px;
  font-weight: 600;
  color: var(--oyvra-text-muted);
}
.hs-topic-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}
.hs-topic-card {
  display: grid;
  gap: 8px;
  align-content: start;
  padding: 18px;
  border-radius: 18px;
  background: #fff;
  border: 1px solid var(--oyvra-border);
  box-shadow: var(--oyvra-shadow-sm);
  text-decoration: none;
  color: inherit;
  transition: transform .15s ease, box-shadow .15s ease;
  min-height: 168px;
}
.hs-topic-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--oyvra-shadow-md);
}
.hs-topic-ico {
  width: 44px;
  height: 44px;
  border-radius: 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.hs-topic-ico--sm { width: 34px; height: 34px; border-radius: 11px; }
.hs-topic-ico--violet { background: #efe9ff; color: var(--oyvra-primary); }
.hs-topic-ico--mint { background: #e4f6ef; color: var(--oyvra-success); }
.hs-topic-ico--sky { background: #e8f2ff; color: #3b82f6; }
.hs-topic-ico--rose { background: #fde8f0; color: var(--oyvra-accent); }
.hs-topic-ico--blue { background: #e8f0ff; color: #4f6bed; }
.hs-topic-ico--teal { background: #e6f7f5; color: #0d9488; }
.hs-topic-ico--green { background: #e7f7ed; color: #2f9e6a; }
.hs-topic-ico--amber { background: #fff1df; color: #c67a1a; }
.hs-topic-card strong {
  font-size: 15px;
  font-weight: 700;
}
.hs-topic-card p {
  margin: 0;
  font-size: 13px;
  color: var(--oyvra-text-muted);
  line-height: 1.4;
}
.hs-topic-link {
  margin-top: auto;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 13px;
  font-weight: 700;
  color: var(--oyvra-primary);
}
.hs-topic-list { display: none; }
.hs-topic-row {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px;
  border-radius: 16px;
  background: #fff;
  border: 1px solid var(--oyvra-border);
  text-decoration: none;
  color: inherit;
}
.hs-topic-row + .hs-topic-row { margin-top: 8px; }
.hs-topic-row-copy { flex: 1; min-width: 0; }
.hs-topic-row-copy strong { display: block; font-size: 14px; }
.hs-topic-row-copy small {
  display: block;
  margin-top: 2px;
  font-size: 12px;
  color: var(--oyvra-text-muted);
}
.hs-topic-chev { color: var(--oyvra-text-muted); flex-shrink: 0; }

.hs-articles { display: grid; gap: 18px; }
.hs-article-block {
  padding: 18px;
  border-radius: 20px;
  background: rgba(255,255,255,.78);
  border: 1px solid var(--oyvra-border);
  scroll-margin-top: 88px;
}
.hs-article-head {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 12px;
}
.hs-article-head h3 {
  margin: 0;
  font-size: 16px;
  font-weight: 700;
}
.hs-faq { display: grid; gap: 8px; }
.hs-faq-item {
  border: 1px solid var(--oyvra-border);
  border-radius: 14px;
  background: #fff;
  overflow: hidden;
}
.hs-faq-item summary {
  list-style: none;
  cursor: pointer;
  padding: 14px 16px;
  font-weight: 700;
  font-size: 14px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.hs-faq-item summary::-webkit-details-marker { display: none; }
.hs-faq-item summary::after {
  content: "";
  width: 8px;
  height: 8px;
  border-right: 2px solid var(--oyvra-text-muted);
  border-bottom: 2px solid var(--oyvra-text-muted);
  transform: rotate(45deg);
  flex-shrink: 0;
  margin-top: -4px;
  transition: transform .15s ease;
}
.hs-faq-item[open] summary::after {
  transform: rotate(225deg);
  margin-top: 4px;
}
.hs-faq-item p {
  margin: 0;
  padding: 0 16px 14px;
  font-size: 14px;
  color: var(--oyvra-text-secondary);
  line-height: 1.5;
}
.hs-empty {
  display: grid;
  justify-items: center;
  gap: 10px;
  text-align: center;
  padding: 40px 20px;
  border-radius: 18px;
  border: 1.5px dashed var(--oyvra-border);
  background: rgba(255,255,255,.65);
  color: var(--oyvra-text-muted);
}
.hs-empty iconify-icon { color: var(--oyvra-primary); }
.hs-empty p { margin: 0; max-width: 40ch; font-size: 14px; }

.hs-contact-grid {
  display: grid;
  grid-template-columns: 1.25fr .9fr .9fr;
  gap: 14px;
  align-items: start;
}
.hs-contact-card {
  padding: 20px;
  border-radius: 20px;
  background: #fff;
  border: 1px solid var(--oyvra-border);
  box-shadow: var(--oyvra-shadow-sm);
  display: grid;
  gap: 8px;
  align-content: start;
}
.hs-contact-card--wa {
  background: linear-gradient(165deg, #f3fff7 0%, #e9f9ef 100%);
  border-color: rgba(58,169,129,.18);
}
.hs-contact-ico {
  width: 42px;
  height: 42px;
  border-radius: 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--oyvra-primary-soft);
  color: var(--oyvra-primary);
  margin-bottom: 4px;
}
.hs-contact-ico--wa {
  background: #d9f5e6;
  color: #128C7E;
}
.hs-contact-card h4 {
  margin: 0;
  font-size: 16px;
  font-weight: 700;
}
.hs-contact-card > p {
  margin: 0 0 6px;
  font-size: 13px;
  color: var(--oyvra-text-secondary);
  line-height: 1.4;
}
.hs-form .field { margin-bottom: 12px; }
.hs-form .input,
.hs-form .select,
.hs-form .textarea {
  border-radius: 12px;
  background: #faf8fc;
}
.hs-from {
  margin: 0 0 12px;
  font-size: 12px;
  color: var(--oyvra-text-muted);
}
.hs-contact-cta {
  width: 100%;
  justify-content: center;
  gap: 6px;
  min-height: 46px;
  border-radius: 12px;
  font-weight: 700;
  background: linear-gradient(90deg, #8A5FFF, var(--oyvra-primary));
  border: 0;
}
.hs-wa-btn {
  width: 100%;
  justify-content: center;
  gap: 8px;
  min-height: 46px;
  border-radius: 12px;
  background: #25D366;
  color: #fff;
  font-weight: 700;
  border: 0;
}
.hs-wa-btn:hover { filter: brightness(.97); color: #fff; }
.hs-reach-list {
  list-style: none;
  margin: 8px 0 0;
  padding: 0;
  display: grid;
  gap: 10px;
}
.hs-reach-list li {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 13px;
  color: var(--oyvra-text-secondary);
}
.hs-reach-list iconify-icon { color: var(--oyvra-primary); flex-shrink: 0; }
.hs-reach-list a {
  color: var(--oyvra-primary-dark);
  font-weight: 600;
  text-decoration: none;
}
.hs-reach-list a:hover { text-decoration: underline; }

.hs-safety-banner {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 16px 18px;
  border-radius: 18px;
  background: linear-gradient(100deg, #f0ebff 0%, #f7f0ff 55%, #fcebf3 100%);
  border: 1px solid rgba(124,77,255,.12);
}
.hs-safety-ico {
  width: 40px;
  height: 40px;
  border-radius: 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #fff;
  color: var(--oyvra-primary);
  flex-shrink: 0;
  box-shadow: var(--oyvra-shadow-sm);
}
.hs-safety-copy { flex: 1; min-width: 0; }
.hs-safety-copy strong {
  display: block;
  font-size: 14px;
  margin-bottom: 2px;
}
.hs-safety-copy p {
  margin: 0;
  font-size: 13px;
  color: var(--oyvra-text-secondary);
}

@media (max-width: 1100px) {
  .hs-topic-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hs-contact-grid { grid-template-columns: 1fr 1fr; }
  .hs-contact-card--form { grid-column: 1 / -1; }
}
@media (max-width: 860px) {
  .hs-hero {
    grid-template-columns: 1fr;
    gap: 18px;
  }
  .hs-hero-art {
    order: -1;
    min-height: 180px;
  }
  .hs-hero-orb { width: 160px; }
  .hs-search {
    max-width: none;
    flex-wrap: wrap;
    border-radius: 18px;
    padding: 12px;
  }
  .hs-search-btn { width: 100%; }
  .hs-topic-grid { display: none; }
  .hs-topic-list { display: block; }
  .hs-contact-grid { grid-template-columns: 1fr; }
  .hs-contact-card--form { grid-column: auto; }
  .hs-safety-banner { flex-wrap: wrap; }
}
@media (max-width: 520px) {
  .hs-title { font-size: 28px; }
  .hs-hero-script { font-size: 18px; right: 4%; }
  .hs-article-block { padding: 14px; }
}

/* �� Settings / Privacy atelier �� */
.shell--safety .page--settings {
  max-width: 1280px;
  grid-template-columns: 1fr;
  align-items: start;
}
.set-layout {
  display: grid;
  grid-template-columns: minmax(240px, 300px) minmax(0, 1fr);
  gap: 22px;
  align-items: start;
  width: 100%;
  min-width: 0;
}
.set-nav {
  position: sticky;
  top: calc(var(--topbar) + 16px);
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 18px 14px 14px;
  border-radius: 24px;
  background: var(--oyvra-surface);
  border: 1px solid var(--oyvra-border);
  box-shadow: var(--oyvra-shadow-sm);
  min-width: 0;
}
.set-nav-head {
  padding: 4px 10px 12px;
}
.set-nav-head h2 {
  margin: 0;
  font-family: var(--oyvra-display), Georgia, serif;
  font-size: 22px;
  font-weight: 700;
  letter-spacing: -.02em;
  color: var(--oyvra-text);
}
.set-nav-head p {
  margin: 4px 0 0;
  font-size: 13px;
  color: var(--oyvra-text-muted);
  line-height: 1.35;
}
.set-nav-list {
  display: grid;
  gap: 2px;
}
.set-nav-link {
  display: grid;
  grid-template-columns: 36px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  min-height: 52px;
  padding: 8px 10px;
  border-radius: 14px;
  color: var(--oyvra-text-secondary);
  transition: background .18s ease, color .18s ease;
}
.set-nav-link:hover {
  background: rgba(124, 77, 255, .06);
  color: var(--oyvra-text);
}
.set-nav-link.is-on {
  background: var(--oyvra-primary-soft);
  color: var(--oyvra-primary-dark);
  box-shadow: inset 3px 0 0 var(--oyvra-primary);
}
.set-nav-ico {
  width: 36px;
  height: 36px;
  border-radius: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #f6f3fa;
  color: var(--oyvra-text-secondary);
  flex-shrink: 0;
}
.set-nav-link.is-on .set-nav-ico {
  background: #fff;
  color: var(--oyvra-primary);
  box-shadow: 0 2px 8px rgba(124, 77, 255, .12);
}
.set-nav-copy {
  display: grid;
  gap: 1px;
  min-width: 0;
}
.set-nav-copy strong {
  font-size: 14px;
  font-weight: 700;
  line-height: 1.2;
}
.set-nav-copy small {
  font-size: 11px;
  font-weight: 500;
  color: var(--oyvra-text-muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.set-nav-link.is-on .set-nav-copy small {
  color: rgba(95, 53, 214, .72);
}
.set-nav-chev {
  color: var(--oyvra-primary);
  flex-shrink: 0;
}
.set-nav-quote {
  margin-top: 10px;
  padding: 16px 14px;
  border-radius: 16px;
  background:
    radial-gradient(120px 80px at 90% 20%, rgba(216, 106, 154, .16), transparent 70%),
    linear-gradient(145deg, #fdf2f6 0%, #f5efff 100%);
  border: 1px solid rgba(216, 106, 154, .14);
}
.set-nav-quote p {
  margin: 0;
  font-family: var(--oyvra-display), Georgia, serif;
  font-size: 14px;
  font-style: italic;
  font-weight: 600;
  line-height: 1.4;
  color: #7a668f;
}

.set-main {
  display: grid;
  gap: 16px;
  min-width: 0;
}
.set-banner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
  padding: 16px 18px;
  border-radius: 18px;
  background: linear-gradient(120deg, rgba(240, 235, 255, .95), rgba(252, 235, 243, .75));
  border: 1px solid rgba(124, 77, 255, .14);
}
.set-banner strong {
  display: block;
  font-size: 15px;
}
.set-banner p {
  margin: 4px 0 0;
  font-size: 13px;
  color: var(--oyvra-text-secondary);
  max-width: 52ch;
}

.set-panel {
  background: var(--oyvra-surface);
  border: 1px solid var(--oyvra-border);
  border-radius: 24px;
  padding: 22px 24px 24px;
  box-shadow: var(--oyvra-shadow-sm);
  min-width: 0;
}
.set-panel-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 20px;
}
.set-panel-title {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  min-width: 0;
}
.set-panel-ico {
  width: 42px;
  height: 42px;
  border-radius: 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--oyvra-primary-soft);
  color: var(--oyvra-primary);
  flex-shrink: 0;
}
.set-panel-ico--lock {
  background: linear-gradient(145deg, #8A5FFF, var(--oyvra-primary));
  color: #fff;
  box-shadow: 0 8px 20px rgba(124, 77, 255, .28);
}
.set-panel-title h2 {
  margin: 0;
  font-size: 22px;
  font-weight: 700;
  letter-spacing: -.02em;
}
.set-panel-title p {
  margin: 4px 0 0;
  font-size: 13px;
  color: var(--oyvra-text-muted);
}
.set-script {
  margin: 2px 0 0;
  flex-shrink: 0;
  max-width: 14ch;
  text-align: right;
  font-family: var(--oyvra-script), cursive;
  font-size: 20px;
  font-weight: 600;
  line-height: 1.15;
  color: #c47898;
  transform: rotate(-4deg);
}
.set-script--wide {
  max-width: 18ch;
  color: #8b7bb8;
  transform: rotate(-3deg);
}
.set-script-heart {
  display: inline-flex;
  vertical-align: middle;
  color: var(--oyvra-accent);
}

.set-form .field {
  margin-bottom: 14px;
}
.set-form .field > label {
  display: block;
  margin-bottom: 6px;
  font-size: 13px;
  font-weight: 700;
  color: var(--oyvra-text-secondary);
}
.set-row-2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}
.set-input {
  position: relative;
  display: flex;
  align-items: center;
}
.set-input > iconify-icon {
  position: absolute;
  left: 14px;
  color: var(--oyvra-text-muted);
  pointer-events: none;
  z-index: 1;
}
.set-input .input,
.set-input .select {
  width: 100%;
  min-height: 48px;
  padding-left: 42px;
  border-radius: 14px;
  background: #faf8fc;
}
.set-input--select .select {
  padding-right: 36px;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%239A93A3' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 14px center;
}
.set-input-ok {
  position: absolute;
  right: 12px;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #e8f8ef;
  color: #1f9d5c;
}
.set-hint {
  margin: 6px 0 0;
  font-size: 12px;
  color: var(--oyvra-text-muted);
  line-height: 1.35;
}

.set-checks {
  display: grid;
  gap: 10px;
  margin: 4px 0 18px;
}
.set-check {
  display: flex;
  align-items: center;
  gap: 10px;
  cursor: pointer;
  user-select: none;
}
.set-check input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
.set-check-ui {
  width: 22px;
  height: 22px;
  border-radius: 7px;
  border: 1.5px solid #d5cfe0;
  background: #fff;
  position: relative;
  flex-shrink: 0;
  transition: background .18s ease, border-color .18s ease;
}
.set-check-ui::after {
  content: "";
  position: absolute;
  inset: 4px;
  border-radius: 3px;
  background: transparent;
  transition: background .18s ease;
}
.set-check input:checked + .set-check-ui {
  border-color: var(--oyvra-primary);
  background: linear-gradient(145deg, #8A5FFF, var(--oyvra-primary));
}
.set-check input:checked + .set-check-ui::after {
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23fff' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='3.5 8.5 6.5 11.5 12.5 4.5'/%3E%3C/svg%3E")
    center / 12px 12px no-repeat;
}
.set-check-copy {
  font-size: 14px;
  font-weight: 600;
  color: var(--oyvra-text);
}

.set-section {
  margin-bottom: 22px;
  padding-bottom: 6px;
  border-bottom: 1px solid rgba(37, 33, 43, .06);
}
.set-section:last-of-type {
  border-bottom: 0;
  margin-bottom: 8px;
}
.set-section-head {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 14px;
  color: var(--oyvra-primary);
}
.set-section-head h3 {
  margin: 0;
  font-size: 15px;
  font-weight: 700;
  color: var(--oyvra-text);
}

.set-switch {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin: 0 0 14px;
  cursor: pointer;
  user-select: none;
}
.set-switch input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
.set-switch-ui {
  width: 44px;
  height: 26px;
  border-radius: 999px;
  background: #e5e0ec;
  position: relative;
  flex-shrink: 0;
  transition: background .2s ease;
  margin-top: 1px;
}
.set-switch-ui::after {
  content: "";
  position: absolute;
  top: 3px;
  left: 3px;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 2px 6px rgba(37, 33, 43, .16);
  transition: transform .2s ease;
}
.set-switch input:checked + .set-switch-ui {
  background: linear-gradient(90deg, #8A5FFF, var(--oyvra-primary));
}
.set-switch input:checked + .set-switch-ui::after {
  transform: translateX(18px);
}
.set-switch input:disabled + .set-switch-ui {
  opacity: .55;
}
.set-switch-copy {
  display: grid;
  gap: 2px;
  min-width: 0;
  padding-top: 2px;
}
.set-switch-copy strong {
  font-size: 14px;
  font-weight: 700;
  color: var(--oyvra-text);
  line-height: 1.25;
}
.set-switch-copy em {
  font-style: normal;
  font-size: 12px;
  font-weight: 500;
  color: var(--oyvra-text-muted);
  line-height: 1.35;
}
.set-switch-copy strong em {
  font-style: normal;
  font-weight: 600;
  color: var(--oyvra-primary);
  font-size: 12px;
}

.set-premium-note {
  margin: 0 0 14px;
  font-size: 13px;
  color: var(--oyvra-text-secondary);
}
.set-premium-note a {
  color: var(--oyvra-primary);
  font-weight: 700;
}

.set-save-row {
  display: flex;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
  margin-top: 8px;
}
.set-save {
  min-height: 48px;
  padding: 0 22px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: linear-gradient(90deg, #8A5FFF, var(--oyvra-primary));
  box-shadow: 0 10px 24px rgba(124, 77, 255, .28);
}
.set-save-note {
  margin: 0;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  font-weight: 600;
  color: #1f9d5c;
}

.set-blocked {
  display: grid;
  gap: 12px;
  padding: 16px 18px;
  border-radius: 18px;
  background: var(--oyvra-surface);
  border: 1px solid var(--oyvra-border);
  box-shadow: var(--oyvra-shadow-sm);
}
.set-blocked-head {
  display: flex;
  align-items: center;
  gap: 12px;
}
.set-blocked-ico {
  width: 40px;
  height: 40px;
  border-radius: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #fdecef;
  color: var(--oyvra-danger);
  flex-shrink: 0;
}
.set-blocked-head h3 {
  margin: 0;
  font-size: 15px;
  font-weight: 700;
}
.set-blocked-head p {
  margin: 2px 0 0;
  font-size: 12px;
  color: var(--oyvra-text-muted);
}
.set-blocked-list {
  display: grid;
  gap: 8px;
}
.set-blocked-row {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  padding: 8px 10px;
  border-radius: 14px;
  background: #faf8fc;
}
.set-blocked-row .avatar {
  width: 40px;
  height: 40px;
}
.set-blocked-row strong {
  font-size: 14px;
}

.set-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}
.set-action {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 40px;
  padding: 0 14px;
  border-radius: 999px;
  border: 1px solid var(--oyvra-border);
  background: var(--oyvra-surface);
  color: var(--oyvra-text-secondary);
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  transition: border-color .18s ease, color .18s ease, background .18s ease;
}
.set-action:hover {
  border-color: rgba(124, 77, 255, .28);
  color: var(--oyvra-primary-dark);
  background: var(--oyvra-primary-soft);
}
.set-action--boost {
  border-color: rgba(124, 77, 255, .35);
  color: var(--oyvra-primary);
  background: linear-gradient(120deg, rgba(240, 235, 255, .9), rgba(252, 235, 243, .55));
}
.set-action--danger {
  border-color: rgba(217, 75, 99, .35);
  color: var(--oyvra-danger);
}
.set-action--danger:hover {
  background: #fdecef;
  border-color: rgba(217, 75, 99, .45);
  color: var(--oyvra-danger);
}

@media (max-width: 1100px) {
  .set-script { display: none; }
}
@media (max-width: 900px) {
  .set-layout { grid-template-columns: 1fr; }
  .set-nav { position: static; }
  .set-nav-list {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: minmax(160px, 1fr);
    overflow-x: auto;
    gap: 6px;
    padding-bottom: 4px;
    scrollbar-width: thin;
  }
  .set-nav-link {
    min-width: 168px;
  }
  .set-nav-quote { display: none; }
}
@media (max-width: 640px) {
  .set-panel { padding: 18px 16px 20px; }
  .set-row-2 { grid-template-columns: 1fr; }
  .set-save-row { flex-direction: column; align-items: flex-start; }
  .set-actions { gap: 6px; }
  .set-action { flex: 1 1 calc(50% - 6px); justify-content: center; }
}

/* �� Passport (settings atelier) �� */
.set-panel-ico--pass {
  background: linear-gradient(145deg, #8A5FFF, var(--oyvra-primary));
  color: #fff;
  box-shadow: 0 8px 20px rgba(124, 77, 255, .28);
}
.pass-panel { padding-bottom: 18px; }
.pass-active {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  margin-bottom: 18px;
  border-radius: 14px;
  background: linear-gradient(120deg, #eefaf3, #f3faf7);
  border: 1px solid rgba(31, 157, 92, .18);
}
.pass-active-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #1f9d5c;
  box-shadow: 0 0 0 4px rgba(31, 157, 92, .18);
  flex-shrink: 0;
}
.pass-active-copy {
  flex: 1;
  min-width: 0;
}
.pass-active-copy strong {
  display: block;
  font-size: 14px;
  font-weight: 700;
  color: #1a7a4a;
}
.pass-active-copy p {
  margin: 2px 0 0;
  font-size: 12px;
  color: #3d8f64;
}
.pass-end {
  min-height: 34px;
  padding: 0 14px;
  border-radius: 999px;
  border: 1.5px solid rgba(217, 75, 99, .45);
  background: #fff;
  color: var(--oyvra-danger);
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
  flex-shrink: 0;
}
.pass-end:hover {
  background: #fdecef;
}

.pass-form-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(180px, .9fr);
  gap: 18px;
  align-items: stretch;
  margin-bottom: 16px;
}
.pass-form-title {
  margin: 0 0 14px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 15px;
  font-weight: 700;
  color: var(--oyvra-text);
}
.pass-form-title iconify-icon { color: var(--oyvra-primary); }
.pass-form-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin-top: 6px;
}
.pass-cancel {
  min-height: 48px;
  border-radius: 999px;
  padding: 0 18px;
}

.pass-visual {
  position: relative;
  border-radius: 20px;
  overflow: hidden;
  min-height: 220px;
  box-shadow: 0 12px 28px rgba(92, 53, 214, .14);
}
.pass-visual img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  min-height: 220px;
}
.pass-visual-shade {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(37, 33, 43, .08) 0%, rgba(37, 33, 43, .55) 100%);
}
.pass-stamp {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 118px;
  height: 118px;
  margin: -59px 0 0 -59px;
  border-radius: 50%;
  border: 2px dashed rgba(255, 255, 255, .72);
  display: grid;
  place-items: center;
  text-align: center;
  transform: rotate(-12deg);
  background: rgba(255, 255, 255, .12);
  backdrop-filter: blur(2px);
}
.pass-stamp span {
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .06em;
  line-height: 1.35;
  color: #fff;
  text-transform: uppercase;
  max-width: 9ch;
}
.pass-visual-script {
  position: absolute;
  left: 16px;
  bottom: 14px;
  margin: 0;
  font-family: var(--oyvra-script), cursive;
  font-size: 22px;
  font-weight: 600;
  line-height: 1.15;
  color: #fff;
  text-shadow: 0 4px 16px rgba(37, 33, 43, .35);
}

.pass-locked {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
  padding: 18px;
  margin-bottom: 16px;
  border-radius: 18px;
  background: linear-gradient(120deg, rgba(240, 235, 255, .95), rgba(252, 235, 243, .7));
  border: 1px solid rgba(124, 77, 255, .14);
}
.pass-locked-ico {
  width: 44px;
  height: 44px;
  border-radius: 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #fff;
  color: var(--oyvra-primary);
  flex-shrink: 0;
}
.pass-locked strong {
  display: block;
  font-size: 15px;
}
.pass-locked p {
  margin: 4px 0 0;
  font-size: 13px;
  color: var(--oyvra-text-secondary);
  max-width: 42ch;
}
.pass-locked .set-save { margin-left: auto; }

.pass-how {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  padding: 14px 16px;
  margin-bottom: 18px;
  border-radius: 14px;
  background: linear-gradient(120deg, #f0f6ff, #f5f3ff);
  border: 1px solid rgba(99, 140, 220, .2);
}
.pass-how-ico {
  width: 36px;
  height: 36px;
  border-radius: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #fff;
  color: #4f74c8;
  flex-shrink: 0;
}
.pass-how strong {
  display: block;
  font-size: 13px;
  font-weight: 700;
  color: #3d5a99;
}
.pass-how p {
  margin: 3px 0 0;
  font-size: 12px;
  line-height: 1.4;
  color: #5a6f98;
}

.pass-history {
  margin-bottom: 14px;
}
.pass-history h3 {
  margin: 0 0 12px;
  font-size: 15px;
  font-weight: 700;
}
.pass-history-row {
  display: grid;
  grid-template-columns: 56px minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 10px 12px;
  border-radius: 16px;
  background: #faf8fc;
  border: 1px solid var(--oyvra-border);
}
.pass-history-row img {
  width: 56px;
  height: 56px;
  border-radius: 12px;
  object-fit: cover;
}
.pass-history-copy strong {
  display: block;
  font-size: 14px;
}
.pass-history-copy p {
  margin: 3px 0 0;
  font-size: 12px;
  color: var(--oyvra-text-muted);
}
.pass-badge {
  display: inline-flex;
  align-items: center;
  min-height: 26px;
  padding: 0 10px;
  border-radius: 999px;
  background: #e8f8ef;
  color: #1f9d5c;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .02em;
  text-transform: uppercase;
}
.pass-history-empty {
  margin: 0;
  padding: 14px;
  border-radius: 14px;
  background: #faf8fc;
  font-size: 13px;
  color: var(--oyvra-text-muted);
}

.pass-browse {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 48px;
  padding: 0 16px;
  border-radius: 14px;
  background: linear-gradient(120deg, rgba(240, 235, 255, .95), rgba(252, 235, 243, .65));
  border: 1px solid rgba(124, 77, 255, .14);
  color: var(--oyvra-primary-dark);
  font-size: 13px;
  font-weight: 700;
}
.pass-browse span { flex: 1; }
.pass-browse:hover {
  border-color: rgba(124, 77, 255, .28);
  background: var(--oyvra-primary-soft);
}

@media (max-width: 900px) {
  .pass-form-grid { grid-template-columns: 1fr; }
  .pass-visual { min-height: 180px; }
  .pass-visual img { min-height: 180px; }
}
@media (max-width: 640px) {
  .pass-active { flex-wrap: wrap; }
  .pass-locked .set-save { margin-left: 0; width: 100%; justify-content: center; }
  .pass-history-row { grid-template-columns: 48px minmax(0, 1fr); }
  .pass-badge { grid-column: 2; justify-self: start; }
}

/* —— Premium / Subscription atelier —— */
.prem-main { gap: 18px; }
.prem-hero {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(220px, .85fr);
  overflow: hidden;
  min-height: 220px;
  border-radius: 24px;
  background:
    radial-gradient(420px 220px at 18% 20%, rgba(168, 85, 247, .35), transparent 65%),
    linear-gradient(118deg, #1a1028 0%, #3b1d6b 48%, #6b2d8a 100%);
  box-shadow: 0 16px 40px rgba(58, 24, 110, .22);
  color: #fff;
}
.prem-hero-copy {
  position: relative;
  z-index: 2;
  display: grid;
  align-content: center;
  gap: 10px;
  padding: 28px 28px 28px 30px;
}
.prem-kicker {
  margin: 0;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: rgba(255, 232, 248, .88);
}
.prem-hero-copy h2 {
  margin: 0;
  font-family: var(--oyvra-display), Georgia, serif;
  font-size: clamp(26px, 3.2vw, 36px);
  font-weight: 700;
  letter-spacing: -.03em;
  line-height: 1.12;
}
.prem-hero-copy > p {
  margin: 0;
  max-width: 38ch;
  font-size: 14px;
  line-height: 1.45;
  color: rgba(255, 255, 255, .78);
}
.prem-hero-cta {
  margin-top: 8px;
  justify-self: start;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  padding: 0 18px;
  border: 0;
  border-radius: 999px;
  background: linear-gradient(120deg, #e879b8, #a855f7 55%, #7c3aed);
  color: #fff;
  font-weight: 700;
  box-shadow: 0 10px 28px rgba(168, 85, 247, .35);
  transition: transform .18s ease, filter .18s ease;
}
.prem-hero-cta:hover {
  filter: brightness(1.05);
  transform: translateY(-1px);
  color: #fff;
}
.prem-hero-media {
  position: relative;
  min-height: 220px;
}
.prem-hero-media img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 28%;
}
.prem-hero-shade {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(26, 16, 40, .92) 0%, rgba(26, 16, 40, .35) 42%, transparent 70%),
    linear-gradient(180deg, transparent 55%, rgba(26, 16, 40, .35));
  pointer-events: none;
}

.prem-plans,
.prem-compare {
  background: var(--oyvra-surface);
  border: 1px solid var(--oyvra-border);
  border-radius: 24px;
  padding: 22px 22px 24px;
  box-shadow: var(--oyvra-shadow-sm);
  min-width: 0;
}
.prem-section-head {
  margin-bottom: 18px;
}
.prem-section-head h3 {
  margin: 0;
  font-size: 20px;
  font-weight: 700;
  letter-spacing: -.02em;
}
.prem-section-head p {
  margin: 4px 0 0;
  font-size: 13px;
  color: var(--oyvra-text-muted);
}

.prem-plan-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}
.prem-card {
  position: relative;
  display: grid;
  gap: 10px;
  padding: 20px 18px 18px;
  border-radius: 20px;
  border: 1.5px solid rgba(124, 77, 255, .16);
  background: #fff;
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.prem-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 32px rgba(92, 53, 214, .1);
}
.prem-card.is-popular {
  border-color: transparent;
  background:
    linear-gradient(#fff, #fff) padding-box,
    linear-gradient(145deg, #c084fc, #7c3aed, #db2777) border-box;
  border: 2px solid transparent;
  box-shadow: 0 16px 36px rgba(124, 77, 255, .16);
}
.prem-badge {
  position: absolute;
  top: -11px;
  left: 50%;
  transform: translateX(-50%);
  padding: 4px 12px;
  border-radius: 999px;
  background: linear-gradient(120deg, #8b5cf6, #7c3aed);
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .02em;
  white-space: nowrap;
  box-shadow: 0 8px 18px rgba(124, 77, 255, .28);
}
.prem-card-term {
  margin: 4px 0 0;
  font-size: 13px;
  font-weight: 700;
  color: var(--oyvra-text-secondary);
}
.prem-card-price {
  margin: 0;
  display: flex;
  align-items: baseline;
  gap: 8px;
  flex-wrap: wrap;
}
.prem-card-price > span {
  font-family: var(--oyvra-display), Georgia, serif;
  font-size: 34px;
  font-weight: 700;
  letter-spacing: -.03em;
  line-height: 1;
  color: var(--oyvra-text);
}
.prem-card-price em {
  font-style: normal;
  font-size: 12px;
  font-weight: 700;
  color: #7c3aed;
  background: var(--oyvra-primary-soft);
  padding: 3px 8px;
  border-radius: 999px;
}
.prem-card-meta {
  margin: 0;
  font-size: 12px;
  color: var(--oyvra-text-muted);
}
.prem-card-perks {
  margin: 4px 0 6px;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 6px;
}
.prem-card-perks li {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: var(--oyvra-text-secondary);
}
.prem-card-perks iconify-icon { color: var(--oyvra-primary); flex-shrink: 0; }
.prem-cta-outline,
.prem-cta-solid {
  width: 100%;
  min-height: 44px;
  border-radius: 999px;
  font-weight: 700;
  justify-content: center;
}
.prem-cta-outline {
  background: #fff;
  border: 1.5px solid rgba(124, 77, 255, .28);
  color: var(--oyvra-primary-dark);
}
.prem-cta-outline:hover {
  background: var(--oyvra-primary-soft);
  border-color: rgba(124, 77, 255, .45);
  color: var(--oyvra-primary-dark);
}
.prem-cta-solid {
  border: 0;
  background: linear-gradient(120deg, #a855f7, #7c3aed);
  color: #fff;
  box-shadow: 0 10px 24px rgba(124, 77, 255, .28);
}
.prem-cta-solid:hover {
  filter: brightness(1.05);
  color: #fff;
}

.prem-compare-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(220px, 280px);
  gap: 16px;
  align-items: start;
}
.prem-table {
  display: grid;
  border: 1px solid var(--oyvra-border);
  border-radius: 16px;
  overflow: hidden;
}
.prem-table-head,
.prem-table-row {
  display: grid;
  grid-template-columns: minmax(0, 1.6fr) minmax(90px, .7fr) minmax(100px, .8fr);
  gap: 8px;
  align-items: center;
  padding: 12px 16px;
}
.prem-table-head {
  background: linear-gradient(120deg, #f7f3ff, #faf5fb);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--oyvra-text-muted);
}
.prem-table-row {
  border-top: 1px solid rgba(124, 77, 255, .08);
  font-size: 14px;
}
.prem-table-row:nth-child(even) {
  background: rgba(250, 247, 255, .55);
}
.prem-feat { font-weight: 600; color: var(--oyvra-text); }
.prem-free {
  color: var(--oyvra-text-muted);
  font-size: 13px;
  font-weight: 500;
}
.prem-dash {
  display: inline-block;
  color: #c4b8d4;
  font-weight: 700;
}
.prem-yes {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  font-weight: 700;
  color: var(--oyvra-primary-dark);
}
.prem-check {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(145deg, #a855f7, #7c3aed);
  color: #fff;
  box-shadow: 0 4px 12px rgba(124, 77, 255, .25);
}

.prem-aside {
  padding: 22px 20px;
  border-radius: 24px;
  background:
    radial-gradient(140px 100px at 90% 0%, rgba(232, 121, 184, .22), transparent 70%),
    linear-gradient(160deg, #faf5ff 0%, #f3e8ff 100%);
  border: 1px solid rgba(124, 77, 255, .14);
  box-shadow: var(--oyvra-shadow-sm);
}
.prem-aside-ico {
  width: 44px;
  height: 44px;
  border-radius: 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 12px;
  background: linear-gradient(145deg, #a855f7, #7c3aed);
  color: #fff;
  box-shadow: 0 10px 22px rgba(124, 77, 255, .28);
}
.prem-aside h3 {
  margin: 0;
  font-family: var(--oyvra-display), Georgia, serif;
  font-size: 20px;
  font-weight: 700;
  letter-spacing: -.02em;
}
.prem-aside > p {
  margin: 6px 0 14px;
  font-size: 13px;
  line-height: 1.4;
  color: var(--oyvra-text-secondary);
}
.prem-aside ul {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 10px;
}
.prem-aside li {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 13px;
  font-weight: 600;
  color: var(--oyvra-text);
}
.prem-aside li span {
  width: 30px;
  height: 30px;
  border-radius: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #fff;
  color: var(--oyvra-primary);
  box-shadow: 0 2px 8px rgba(124, 77, 255, .1);
  flex-shrink: 0;
}

.prem-trust {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}
.prem-trust-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 14px;
  border-radius: 16px;
  background: var(--oyvra-surface);
  border: 1px solid var(--oyvra-border);
  box-shadow: var(--oyvra-shadow-sm);
}
.prem-trust-item span {
  width: 36px;
  height: 36px;
  border-radius: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--oyvra-primary-soft);
  color: var(--oyvra-primary);
  flex-shrink: 0;
}
.prem-trust-item strong {
  font-size: 13px;
  font-weight: 700;
  line-height: 1.25;
  color: var(--oyvra-text);
}

@media (max-width: 1100px) {
  .prem-compare-row { grid-template-columns: 1fr; }
  .prem-trust { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
  .prem-hero { grid-template-columns: 1fr; }
  .prem-hero-media { min-height: 160px; order: -1; }
  .prem-hero-shade {
    background:
      linear-gradient(180deg, transparent 35%, rgba(26, 16, 40, .88)),
      linear-gradient(90deg, rgba(26, 16, 40, .2), transparent 60%);
  }
  .prem-hero-copy { padding: 22px 20px 24px; }
  .prem-plan-grid { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .prem-plans,
  .prem-compare { padding: 18px 16px 20px; }
  .prem-table-head,
  .prem-table-row {
    grid-template-columns: minmax(0, 1.4fr) minmax(72px, .65fr) minmax(78px, .75fr);
    padding: 11px 12px;
    font-size: 13px;
  }
  .prem-trust { grid-template-columns: 1fr; }
  .prem-card-price > span { font-size: 30px; }
}

/* —— Notifications —— */
.shell--notifications .workspace {
  background:
    radial-gradient(900px 420px at 4% -8%, rgba(124,77,255,.09), transparent 58%),
    radial-gradient(720px 360px at 100% 0%, rgba(216,106,154,.08), transparent 55%),
    linear-gradient(180deg, #fbfafc 0%, #f5f1f8 100%);
}
.shell--notifications .page--notifications {
  max-width: 1320px;
  align-items: start;
  gap: 22px;
}
.notif-main { min-width: 0; }
.notif-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 18px;
}
.notif-title {
  margin: 0;
  font-family: var(--oyvra-display), Georgia, serif;
  font-size: clamp(28px, 3.2vw, 38px);
  font-weight: 700;
  letter-spacing: -.03em;
  line-height: 1.08;
  color: var(--oyvra-text);
}
.notif-lede {
  margin: 8px 0 0;
  max-width: 42ch;
  font-size: 14px;
  line-height: 1.45;
  color: var(--oyvra-text-secondary);
}
.notif-head-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
}
.notif-mark {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 40px;
  padding: 0 14px;
  border-radius: 999px;
  border: 1.5px solid rgba(124, 77, 255, .28);
  background: #fff;
  color: var(--oyvra-primary);
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  transition: background .18s ease, border-color .18s ease, transform .18s ease;
}
.notif-mark:hover {
  background: var(--oyvra-primary-soft);
  border-color: rgba(124, 77, 255, .45);
  transform: translateY(-1px);
}
.notif-mark.is-done {
  border-color: var(--oyvra-border);
  color: var(--oyvra-text-muted);
  cursor: default;
}
.notif-gear {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  border: 1.5px solid var(--oyvra-border);
  background: #fff;
  color: var(--oyvra-text-secondary);
  transition: background .18s ease, color .18s ease, border-color .18s ease;
}
.notif-gear:hover {
  background: var(--oyvra-primary-soft);
  color: var(--oyvra-primary);
  border-color: rgba(124, 77, 255, .28);
}
.notif-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 16px;
}
.notif-chip {
  display: inline-flex;
  align-items: center;
  min-height: 36px;
  padding: 0 14px;
  border-radius: 999px;
  border: 1.5px solid var(--oyvra-border);
  background: #fff;
  color: var(--oyvra-text-secondary);
  font-size: 13px;
  font-weight: 700;
  transition: background .18s ease, color .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.notif-chip:hover {
  border-color: rgba(124, 77, 255, .28);
  color: var(--oyvra-primary);
}
.notif-chip.is-on {
  background: linear-gradient(135deg, #7c4dff, #9b6bff);
  border-color: transparent;
  color: #fff;
  box-shadow: 0 8px 18px rgba(124, 77, 255, .28);
}
.notif-list {
  display: grid;
  gap: 8px;
  animation: notifIn .45s ease both;
}
@keyframes notifIn {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: none; }
}
.notif-row {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 4px;
  border-radius: 18px;
  background: #fff;
  border: 1px solid rgba(124, 77, 255, .06);
  box-shadow: 0 6px 18px rgba(60, 40, 90, .04);
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.notif-row:hover {
  transform: translateY(-1px);
  box-shadow: 0 10px 24px rgba(60, 40, 90, .08);
}
.notif-row.is-unread {
  background: linear-gradient(90deg, rgba(252, 235, 243, .85), #fff 55%);
  border-color: rgba(216, 106, 154, .16);
}
.notif-row-link {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px;
  min-width: 0;
  padding: 14px 8px 14px 14px;
  color: inherit;
}
.notif-avatar {
  position: relative;
  width: 52px;
  height: 52px;
  flex-shrink: 0;
}
.notif-avatar img {
  width: 52px;
  height: 52px;
  border-radius: 50%;
  object-fit: cover;
  display: block;
  background: #efeaf5;
}
.notif-badge {
  position: absolute;
  right: -2px;
  bottom: -2px;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  border: 2px solid #fff;
  color: #fff;
}
.notif-badge--rose { background: linear-gradient(135deg, #e86a9a, #f08ab0); }
.notif-badge--violet { background: linear-gradient(135deg, #7c4dff, #9b6bff); }
.notif-badge--sky { background: linear-gradient(135deg, #4d8dff, #6aa4ff); }
.notif-badge--mint { background: linear-gradient(135deg, #2fbf7a, #4dd39a); }
.notif-badge--amber { background: linear-gradient(135deg, #f0a04b, #f5b96e); }
.notif-copy {
  min-width: 0;
  display: grid;
  gap: 3px;
}
.notif-copy strong {
  font-size: 14px;
  font-weight: 700;
  line-height: 1.3;
  color: var(--oyvra-text);
}
.notif-sub {
  font-size: 13px;
  line-height: 1.4;
  color: var(--oyvra-text-muted);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.notif-time {
  font-size: 12px;
  font-weight: 600;
  color: var(--oyvra-text-muted);
  white-space: nowrap;
  padding-right: 4px;
}
.notif-more {
  position: relative;
  margin-right: 10px;
}
.notif-more > summary {
  list-style: none;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  color: var(--oyvra-text-muted);
  cursor: pointer;
  transition: background .15s ease, color .15s ease;
}
.notif-more > summary::-webkit-details-marker { display: none; }
.notif-more > summary:hover,
.notif-more[open] > summary {
  background: var(--oyvra-primary-soft);
  color: var(--oyvra-primary);
}
.notif-more-menu {
  position: absolute;
  right: 0;
  top: calc(100% + 4px);
  z-index: 5;
  min-width: 150px;
  padding: 6px;
  border-radius: 14px;
  background: #fff;
  border: 1px solid var(--oyvra-border);
  box-shadow: 0 14px 30px rgba(60, 40, 90, .14);
  display: grid;
}
.notif-more-menu a {
  padding: 10px 12px;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 650;
  color: var(--oyvra-text);
}
.notif-more-menu a:hover {
  background: var(--oyvra-primary-soft);
  color: var(--oyvra-primary);
}
.notif-empty {
  display: grid;
  place-items: center;
  gap: 10px;
  padding: 56px 24px;
  border-radius: 22px;
  border: 1px dashed var(--oyvra-border);
  background: rgba(255,255,255,.75);
  text-align: center;
}
.notif-empty-ico {
  width: 56px;
  height: 56px;
  border-radius: 18px;
  display: grid;
  place-items: center;
  background: var(--oyvra-primary-soft);
  color: var(--oyvra-primary);
}
.notif-empty h3 {
  margin: 4px 0 0;
  font-size: 18px;
  font-weight: 700;
}
.notif-empty p {
  margin: 0;
  max-width: 34ch;
  font-size: 14px;
  color: var(--oyvra-text-secondary);
}
.notif-rail { gap: 14px; }
.notif-rail .rail-card { border-radius: 20px; }
.notif-promo {
  position: relative;
  min-height: 180px;
  border-radius: 22px;
  overflow: hidden;
  box-shadow: 0 12px 30px rgba(60, 40, 90, .12);
}
.notif-promo img {
  width: 100%;
  height: 100%;
  min-height: 180px;
  object-fit: cover;
  display: block;
}
.notif-promo-shade {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, transparent 30%, rgba(40, 20, 55, .72)),
    linear-gradient(90deg, rgba(124, 77, 255, .18), transparent 55%);
}
.notif-promo-script {
  position: absolute;
  left: 18px;
  right: 18px;
  bottom: 18px;
  margin: 0;
  font-family: var(--oyvra-script), cursive;
  font-size: clamp(22px, 2vw, 28px);
  font-weight: 600;
  line-height: 1.15;
  color: #fff;
  text-shadow: 0 6px 18px rgba(0,0,0,.25);
}
.notif-promo-script span {
  display: inline-flex;
  vertical-align: middle;
  color: #ffb7d0;
}
.notif-settings h3 { margin-bottom: 4px; }
.notif-settings > .body { margin-bottom: 12px; }
.notif-settings-list {
  display: grid;
  gap: 6px;
}
.notif-setting {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  padding: 10px;
  border-radius: 14px;
  transition: background .15s ease;
}
.notif-setting:hover { background: #faf8fc; }
.notif-setting-ico {
  width: 36px;
  height: 36px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  background: var(--oyvra-primary-soft);
  color: var(--oyvra-primary);
}
.notif-setting-ico--muted {
  background: #f1eef5;
  color: var(--oyvra-text-muted);
}
.notif-setting-copy {
  display: grid;
  gap: 2px;
  min-width: 0;
}
.notif-setting-copy strong {
  font-size: 13px;
  font-weight: 700;
  color: var(--oyvra-text);
}
.notif-setting-copy em {
  font-style: normal;
  font-size: 12px;
  font-weight: 700;
  color: #2fbf7a;
}
.notif-setting-copy em.is-off { color: var(--oyvra-text-muted); }
.notif-setting .chev { color: var(--oyvra-text-muted); }
.notif-cta {
  background:
    radial-gradient(240px 120px at 100% 0%, rgba(216,106,154,.12), transparent 60%),
    linear-gradient(180deg, #fbf8ff, #f7f2fb);
  text-align: left;
}
.notif-cta-ico {
  width: 44px;
  height: 44px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  margin-bottom: 12px;
  background: linear-gradient(135deg, #7c4dff, #c47dff);
  color: #fff;
  box-shadow: 0 10px 20px rgba(124, 77, 255, .28);
}
.notif-cta h3 { margin-bottom: 6px; }
.notif-cta .btn { margin-top: 14px; border-radius: 999px; }
.notif-quote {
  padding: 18px 18px 20px;
  border-radius: 20px;
  background:
    radial-gradient(180px 100px at 10% 0%, rgba(255, 183, 208, .45), transparent 70%),
    linear-gradient(160deg, #fff0f5, #fce8f1);
  border: 1px solid rgba(216, 106, 154, .14);
}
.notif-quote-heart {
  display: inline-flex;
  color: #e86a9a;
  margin-bottom: 8px;
}
.notif-quote p {
  margin: 0;
  font-family: var(--oyvra-script), cursive;
  font-size: 22px;
  font-weight: 600;
  line-height: 1.25;
  color: #7a4e6b;
}
.notif-row:nth-child(2) { animation-delay: .04s; }
.notif-row:nth-child(3) { animation-delay: .08s; }
.notif-row:nth-child(4) { animation-delay: .12s; }
.notif-row:nth-child(5) { animation-delay: .16s; }
.notif-row {
  animation: notifRowIn .4s ease both;
}
@keyframes notifRowIn {
  from { opacity: 0; transform: translateY(6px); }
  to { opacity: 1; transform: none; }
}

@media (max-width: 1100px) {
  .shell--notifications .page--notifications > .rail { display: none; }
}
@media (max-width: 720px) {
  .notif-head { flex-direction: column; align-items: stretch; }
  .notif-head-actions { justify-content: space-between; }
  .notif-row-link {
    grid-template-columns: auto minmax(0, 1fr);
    gap: 12px;
  }
  .notif-time {
    grid-column: 2;
    padding: 0;
  }
  .notif-mark span,
  .notif-mark { font-size: 12px; padding: 0 12px; }
}