@import url("https://fonts.googleapis.com/css2?family=Rajdhani:wght@400;500;600;700&display=swap");


@font-face {
  font-family: "Scratchmeow5";
  src:
    url("../fonts/Scratchmeow5-Regular.woff2") format("woff2"),
    url("../fonts/Scratchmeow5-Regular.ttf") format("truetype");
  font-display: swap;
  font-style: normal;
  font-weight: 400;
}

.app-sidebar .brand strong,
.app-sidebar .sidebar-nav a span {
  font-family: "Scratchmeow5", "Rajdhani", "Arial Narrow", Arial, sans-serif;
  font-weight: 400;
  font-synthesis: none;
}

.app-sidebar .brand strong {
  line-height: 1.05;
  letter-spacing: .025em;
}

.app-sidebar .sidebar-nav a span {
  min-width: 0;
  line-height: 1.12;
  letter-spacing: .01em;
}


.sidebar-nav a {
  gap: 10px;
  padding-inline: 12px;
  font-size: 20px;
  letter-spacing: 0;
}
.sidebar-nav a span {
  min-width: 0;
  max-width: 100%;
  white-space: nowrap;
}
.sidebar-nav a svg {
  width: 18px;
  height: 18px;
}

:root {
  --bg: #05040b;
  --bg-2: #090712;
  --panel: rgba(12, 9, 22, .94);
  --panel-2: rgba(18, 12, 31, .94);
  --line: rgba(202, 174, 255, .18);
  --line-strong: rgba(176, 105, 255, .48);
  --violet: #9d46ff;
  --violet-2: #6e26e8;
  --pink: #e95cff;
  --cyan: #62d9ff;
  --green: #73e7a5;
  --red: #ff416d;
  --text: #f7f1ff;
  --muted: #b9aecb;
  --soft: #867a99;
  --shadow: 0 20px 55px rgba(0, 0, 0, .36);
  --sidebar: 252px;
  --radius: 12px;
  --font: "Rajdhani", "Arial Narrow", Arial, sans-serif;
}

* { box-sizing: border-box; }
html { color-scheme: dark; background: var(--bg); scroll-behavior: smooth; }
body {
  margin: 0;
  min-width: 0;
  color: var(--text);
  font-family: var(--font);
  font-size: 17px;
  font-weight: 500;
  line-height: 1.45;
  background:
    radial-gradient(circle at 82% 4%, rgba(118, 32, 255, .16), transparent 29rem),
    radial-gradient(circle at 8% 60%, rgba(80, 16, 155, .12), transparent 32rem),
    linear-gradient(180deg, #07050e, #040309 75%);
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  opacity: .34;
  background-image:
    linear-gradient(rgba(255,255,255,.018) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.018) 1px, transparent 1px);
  background-size: 72px 72px;
  mask-image: linear-gradient(180deg, #000, transparent 78%);
}
img { max-width: 100%; }
a { color: inherit; text-decoration: none; }
button, input, textarea { font: inherit; }
button { color: inherit; }
[hidden] { display: none !important; }

.app-sidebar {
  position: fixed;
  inset: 0 auto 0 0;
  z-index: 60;
  display: flex;
  width: var(--sidebar);
  flex-direction: column;
  border-right: 1px solid var(--line);
  background: linear-gradient(180deg, rgba(7,5,15,.99), rgba(5,4,11,.98));
  box-shadow: 18px 0 54px rgba(0,0,0,.24);
}
.brand {
  display: flex;
  height: 78px;
  align-items: center;
  gap: 12px;
  padding: 0 24px;
  border-bottom: 1px solid var(--line);
  color: #fff;
  white-space: nowrap;
}
.brand img { width: 38px; height: 38px; border-radius: 50%; filter: drop-shadow(0 0 14px rgba(173,84,255,.48)); }
.brand strong { font-size: 1.58rem; font-weight: 700; letter-spacing: .03em; }
.sidebar-nav { display: grid; gap: 6px; padding: 20px 12px; }
.sidebar-nav a {
  position: relative;
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 10px;
  min-height: 48px;
  padding: 0 12px;
  border: 1px solid transparent;
  border-radius: 10px;
  color: #c7bdd5;
  font-size: 20px;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: uppercase;
  white-space: nowrap;
}
.sidebar-nav a svg { width: 18px; height: 18px; flex: 0 0 auto; stroke-width: 1.8; }
.sidebar-nav a .sidebar-image-icon {
  width: 26px;
  height: 26px;
  flex: 0 0 auto;
  object-fit: contain;
  filter: drop-shadow(0 0 10px rgba(157,70,255,.16));
}
.sidebar-nav a:hover { color: #fff; background: rgba(139,61,255,.1); border-color: rgba(180,115,255,.18); }
.sidebar-nav a.active {
  color: #fff;
  border-color: rgba(199,135,255,.72);
  background: linear-gradient(90deg, rgba(136,45,255,.42), rgba(113,23,218,.14));
  box-shadow: inset 3px 0 0 #c278ff, 0 0 24px rgba(122,34,255,.16);
}
.sidebar-footer { margin-top: auto; padding: 16px 20px 24px; color: var(--soft); }
.sidebar-chibi { display: block; width: 118px; margin: 0 auto 4px; opacity: .8; filter: drop-shadow(0 0 20px rgba(137,57,255,.3)); }
.sidebar-socials { display: flex; justify-content: center; gap: 12px; margin: 8px 0 13px; }
.sidebar-socials a { display: grid; width: 32px; height: 32px; place-items: center; border: 1px solid var(--line); border-radius: 9px; color: #d8c9eb; }
.sidebar-footer small { display: block; text-align: center; font-size: .75rem; }

.app-shell { min-width: 0; margin-left: var(--sidebar); }
.app-topbar {
  position: sticky;
  top: 0;
  z-index: 50;
  display: grid;
  min-height: 78px;
  grid-template-columns: minmax(240px, 480px) 1fr auto;
  align-items: center;
  gap: 18px;
  padding: 12px 26px;
  border-bottom: 1px solid var(--line);
  background: rgba(5,4,11,.88);
  backdrop-filter: blur(18px);
}
.mobile-menu { display: none !important; }
.mobile-brand { display: none; color: #fff; font-size: 1.15rem; font-weight: 700; letter-spacing: .04em; white-space: nowrap; }
.search-button {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 10px;
  width: 100%;
  min-height: 42px;
  padding: 0 14px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: rgba(255,255,255,.025);
  color: var(--soft);
  cursor: pointer;
}
.search-button span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.topbar-spacer { min-width: 0; }
.topbar-actions { display: flex; align-items: center; gap: 9px; }
.icon-button, .top-link, .live-chip {
  display: inline-flex;
  min-height: 40px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: rgba(255,255,255,.025);
  color: #e6dff2;
  font-weight: 600;
  white-space: nowrap;
}
.icon-button { width: 42px; padding: 0; cursor: pointer; }
.top-link, .live-chip { padding: 0 14px; }
.live-chip { border-color: rgba(168,88,255,.45); background: linear-gradient(135deg, rgba(145,48,255,.28), rgba(92,28,186,.16)); }
.live-chip.live { border-color: rgba(255,65,109,.62); box-shadow: 0 0 24px rgba(255,65,109,.16); }
.live-dot { width: 8px; height: 8px; border-radius: 50%; background: #81778c; }
.live-chip.live .live-dot { background: var(--red); box-shadow: 0 0 12px var(--red); }

.page-content { width: min(1540px, calc(100% - 42px)); margin: 0 auto; padding: 24px 0 50px; }
.page-title-row { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 18px; }
.page-title-row h1 { margin: 0; font-size: clamp(2rem, 3vw, 3rem); line-height: 1; font-weight: 700; letter-spacing: .015em; }
.page-title-row p { max-width: 760px; margin: 7px 0 0; color: var(--muted); }
.eyebrow { margin: 0 0 6px; color: #c98bff; font-size: .78rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }

.dashboard-top { display:grid; grid-template-columns:minmax(0,5fr) minmax(0,7fr); gap:16px; align-items:stretch; }
.dashboard-top > .panel { height:100%; }
.dashboard-columns { display:grid; grid-template-columns:minmax(280px,.85fr) minmax(440px,1.35fr) minmax(280px,.85fr); gap:16px; margin-top:16px; align-items:start; }
.dashboard-column { display:grid; gap:16px; align-content:start; min-width:0; }
.panel {
  position: relative;
  min-width: 0;
  align-self: start;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: linear-gradient(180deg, rgba(255,255,255,.025), transparent 35%), var(--panel);
  box-shadow: var(--shadow), inset 0 1px 0 rgba(255,255,255,.035);
}
.panel::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  box-shadow: inset 0 0 0 1px rgba(176,105,255,.025);
}
.panel-head { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 15px 17px; border-bottom: 1px solid var(--line); }
.panel-head h2 { margin: 0; font-size: 1.05rem; font-weight: 700; letter-spacing: .035em; text-transform: uppercase; }
.panel-head a, .panel-head button { border: 0; background: none; color: #bf77ff; font-size: .8rem; font-weight: 700; text-transform: uppercase; cursor: pointer; }
.panel-body { min-width: 0; padding: 17px; }

.live-panel { min-height:340px; }

.profile-layout { display: grid; grid-template-columns: 170px minmax(0,1fr); gap: 22px; align-items: center; min-height: 270px; }
.profile-avatar-wrap { position: relative; width: 154px; height: 154px; margin: auto; border-radius: 50%; padding: 5px; background: conic-gradient(from 10deg, #e05cff, #7b33ff, #56c8ff, #e05cff); box-shadow: 0 0 34px rgba(157,70,255,.26); }
.profile-avatar { width: 100%; height: 100%; border: 5px solid #0b0714; border-radius: 50%; object-fit: cover; background: #100a1b; }
.profile-copy { min-width: 0; }
.profile-copy h2 { margin: 0; font-size: clamp(2rem, 3vw, 2.85rem); line-height: 1; font-weight: 700; white-space: nowrap; }
.profile-copy .role { margin: 7px 0 13px; color: #d260ff; font-size: 1.18rem; font-weight: 600; }
.profile-copy .description { margin: 0; color: var(--muted); }
.tag-row { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
.tag { display: inline-flex; min-height: 28px; align-items: center; padding: 0 10px; border: 1px solid var(--line); border-radius: 6px; color: #d8c9e9; font-size: .76rem; font-weight: 600; text-transform: uppercase; }
.stat-strip { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); border-top: 1px solid var(--line); }
.stat-strip article { min-width: 0; padding: 14px 12px; text-align: center; border-right: 1px solid var(--line); }
.stat-strip article:last-child { border-right: 0; }
.stat-strip small { display: block; color: var(--soft); font-size: .72rem; text-transform: uppercase; }
.stat-strip strong { display: block; margin-top: 4px; font-size: 1.38rem; white-space: nowrap; }

.live-visual { position: absolute; inset: 0; background-position: center; background-size: cover; }
.live-visual::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(4,3,9,.9) 0%, rgba(4,3,9,.45) 54%, rgba(4,3,9,.16)), linear-gradient(0deg, rgba(4,3,9,.84), transparent 64%); }
.live-content { position: relative; z-index: 1; display: flex; min-height: 340px; flex-direction: column; justify-content: space-between; padding: 18px; }
.status-badge { display: inline-flex; width: fit-content; min-height: 30px; align-items: center; gap: 9px; padding: 0 11px; border: 1px solid var(--line); border-radius: 7px; background: rgba(5,3,10,.72); font-size: .8rem; font-weight: 700; text-transform: uppercase; }
.status-badge .dot { width: 9px; height: 9px; border-radius: 50%; background: #7f768b; }
.status-badge.live .dot { background: var(--red); box-shadow: 0 0 12px var(--red); }
.live-copy { max-width: 620px; }
.live-copy h2 { margin: 0 0 4px; font-size: clamp(1.75rem, 3vw, 2.6rem); line-height: 1.03; }
.live-copy p { margin: 0 0 14px; color: #cfc4dc; }
.button-row { display: flex; flex-wrap: wrap; gap: 9px; }
.button { display: inline-flex; min-height: 42px; align-items: center; justify-content: center; gap: 8px; padding: 0 15px; border: 1px solid var(--line); border-radius: 8px; background: rgba(255,255,255,.045); color: #fff; font-weight: 700; cursor: pointer; }
.button.primary { border-color: rgba(196,126,255,.66); background: linear-gradient(135deg, #8d31f5, #5d20c9); box-shadow: 0 0 24px rgba(132,42,255,.18); }
.button:hover { transform: translateY(-1px); border-color: var(--line-strong); }

.mini-list { display: grid; gap: 10px; }
.mini-media { display: grid; grid-template-columns: 112px minmax(0,1fr) auto; gap: 12px; align-items: center; min-width: 0; padding: 8px; border: 1px solid transparent; border-radius: 8px; cursor: pointer; }
.mini-media:hover { border-color: var(--line); background: rgba(255,255,255,.025); }
.mini-media img { width: 112px; height: 64px; object-fit: cover; border-radius: 6px; background: #100b18; }
.mini-media-copy { min-width: 0; }
.mini-media h3 { margin: 0; overflow: hidden; color: #f2eafa; font-size: .98rem; font-weight: 600; line-height: 1.2; text-overflow: ellipsis; white-space: nowrap; }
.mini-media p { margin: 5px 0 0; color: var(--soft); font-size: .78rem; }
.mini-media time { color: #b89dcf; font-size: .78rem; white-space: nowrap; }

.metric-row { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; margin-bottom: 12px; }
.metric { min-width: 0; padding: 12px; border: 1px solid var(--line); border-radius: 8px; background: rgba(255,255,255,.025); }
.metric small { display: block; color: var(--soft); font-size: .68rem; text-transform: uppercase; }
.metric strong { display: block; margin-top: 4px; overflow: hidden; font-size: 1.42rem; text-overflow: ellipsis; white-space: nowrap; }
.chart-wrap { min-height: 230px; }
.chart-wrap svg { display: block; width: 100%; height: 230px; overflow: visible; }
.chart-empty { display: grid; min-height: 210px; place-items: center; color: var(--soft); text-align: center; }

.steam-card { display: grid; gap: 14px; }
.steam-profile { display: grid; grid-template-columns: 78px minmax(0,1fr); gap: 13px; align-items: center; }
.steam-profile img { width: 78px; height: 78px; border: 1px solid var(--line); border-radius: 12px; object-fit: cover; }
.steam-profile h3 { margin: 0; font-size: 1.34rem; white-space: nowrap; }
.steam-profile p { margin: 4px 0 0; color: var(--muted); }
.info-pairs { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; }
.info-pairs div { min-width: 0; padding: 10px; border: 1px solid var(--line); border-radius: 7px; }
.info-pairs small { display: block; color: var(--soft); font-size: .67rem; text-transform: uppercase; }
.info-pairs strong { display: block; margin-top: 3px; overflow: hidden; font-size: .95rem; text-overflow: ellipsis; white-space: nowrap; }

.game-mix { display: grid; gap: 12px; }
.game-row { display: grid; grid-template-columns: minmax(110px, 1fr) minmax(120px, 2fr) auto; gap: 12px; align-items: center; }
.game-row strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.game-bar { height: 8px; overflow: hidden; border-radius: 99px; background: rgba(255,255,255,.055); }
.game-bar span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #7b2aea, #dc5cff); box-shadow: 0 0 16px rgba(173,72,255,.28); }
.game-row em { color: #c8b5d9; font-style: normal; }
.clip-category-row {
  grid-template-columns: 34px minmax(0,1fr) auto;
  min-height: 56px;
  padding: 8px 0;
}
.clip-category-row + .clip-category-row { border-top: 1px solid var(--line); }
.clip-category-rank {
  display: grid;
  width: 28px;
  height: 28px;
  place-items: center;
  border: 1px solid rgba(213,96,255,.5);
  border-radius: 50%;
  color: #f2d7ff;
  background: rgba(147,42,234,.16);
  font-size: .78rem;
  font-weight: 800;
}
.clip-category-copy { min-width: 0; }
.clip-category-copy strong,
.clip-category-copy small { display: block; }
.clip-category-copy small {
  margin-top: 3px;
  overflow: hidden;
  color: var(--muted);
  font-size: .76rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.clip-category-row em { font-size: .8rem; white-space: nowrap; }
.content-category-row { grid-template-columns:34px minmax(0,1fr) auto auto; }
.content-format-badge { padding:5px 8px;border:1px solid rgba(213,96,255,.42);border-radius:999px;background:rgba(147,42,234,.1);color:#eed8ff;font-size:.7rem;font-weight:800;white-space:nowrap; }
@media(max-width:700px){.content-category-row{grid-template-columns:34px minmax(0,1fr) auto}.content-category-row .content-format-badge{grid-column:2}.content-category-row em{grid-column:3;grid-row:1}}

.community-list { display: grid; gap: 9px; }
.community-person { display: grid; grid-template-columns: 38px minmax(0,1fr) auto; gap: 10px; align-items: center; }
.community-person img { width: 38px; height: 38px; border: 1px solid var(--line); border-radius: 50%; object-fit: cover; }
.community-person h3 { margin: 0; overflow: hidden; font-size: .95rem; text-overflow: ellipsis; white-space: nowrap; }
.community-person p { margin: 2px 0 0; overflow: hidden; color: var(--soft); font-size: .76rem; text-overflow: ellipsis; white-space: nowrap; }
.live-label { color: #ff6a8b; font-size: .72rem; font-weight: 700; text-transform: uppercase; }

.youtube-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; }
.youtube-card { min-width: 0; overflow: hidden; border: 1px solid var(--line); border-radius: 8px; background: rgba(255,255,255,.02); cursor: pointer; }
.youtube-card img { display: block; width: 100%; aspect-ratio: 16/9; object-fit: cover; }
.youtube-card div { padding: 9px; }
.youtube-card h3 { display: -webkit-box; margin: 0; overflow: hidden; font-size: .86rem; line-height: 1.2; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.youtube-card p { margin: 5px 0 0; color: var(--soft); font-size: .72rem; }

.page-grid { display: grid; grid-template-columns: repeat(12,minmax(0,1fr)); gap: 16px; }
.page-grid > .wide { grid-column: span 12; }
.page-grid > .two-thirds { grid-column: span 8; }
.page-grid > .one-third { grid-column: span 4; }
.page-grid > .half { grid-column: span 6; }
.hero-page { min-height: 260px; }
.hero-page .live-content { min-height: 260px; }
.media-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 13px; }
.media-card { min-width: 0; overflow: hidden; border: 1px solid var(--line); border-radius: 9px; background: var(--panel); cursor: pointer; }
.media-card img { display: block; width: 100%; aspect-ratio: 16/9; object-fit: cover; background: #100b18; }
.media-card-copy { padding: 12px; }
.media-card small { color: #c584ff; font-size: .68rem; text-transform: uppercase; }
.media-card h3 { display: -webkit-box; margin: 5px 0 7px; overflow: hidden; font-size: 1rem; line-height: 1.2; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }
.media-card p { margin: 0; color: var(--soft); font-size: .8rem; }

.playlist-category { margin-top: 18px; }
.playlist-category:first-child { margin-top: 0; }
.category-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 14px; margin-bottom: 10px; }
.category-head h2 { margin: 0; font-size: 1.4rem; }
.category-head p { margin: 4px 0 0; color: var(--muted); }
.playlist-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 13px; }
.playlist-card { min-width: 0; overflow: hidden; border: 1px solid var(--line); border-radius: 9px; background: var(--panel); }
.playlist-card img { display: block; width: 100%; aspect-ratio: 16/9; object-fit: cover; }
.playlist-card-copy { padding: 13px; }
.playlist-card h3 { margin: 0; font-size: 1.18rem; line-height: 1.15; }
.playlist-card p { display: -webkit-box; margin: 8px 0; overflow: hidden; color: var(--muted); font-size: .85rem; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.playlist-card-footer { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 12px; }
.playlist-card-footer span { color: var(--soft); font-size: .78rem; }

.recommendations-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 13px; }
.recommendation-card { display: grid; grid-template-columns: 74px minmax(0,1fr); gap: 13px; min-width: 0; padding: 14px; border: 1px solid var(--line); border-radius: 9px; background: var(--panel); }
.recommendation-card.live { border-color: rgba(255,65,109,.5); box-shadow: 0 0 24px rgba(255,65,109,.08); }
.recommendation-card img { width: 74px; height: 74px; border-radius: 50%; object-fit: cover; border: 1px solid var(--line); }
.recommendation-card h3 { margin: 0; overflow: hidden; font-size: 1.16rem; text-overflow: ellipsis; white-space: nowrap; }
.recommendation-card p { display: -webkit-box; margin: 4px 0 8px; overflow: hidden; color: var(--muted); font-size: .82rem; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.recommendation-meta { display: flex; flex-wrap: wrap; gap: 6px; color: var(--soft); font-size: .75rem; }

.steam-large { display: grid; grid-template-columns: 160px minmax(0,1fr); gap: 22px; align-items: center; }
.steam-large img { width: 160px; height: 160px; border: 1px solid var(--line); border-radius: 16px; object-fit: cover; }
.steam-large h2 { margin: 0; max-width: 100%; font-size: 2.05rem; white-space: normal; word-break: normal; overflow-wrap: normal; }
.settings-list { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.settings-list div { min-width: 0; padding: 12px; border: 1px solid var(--line); border-radius: 8px; background: rgba(255,255,255,.02); }
.settings-list small { display: block; color: var(--soft); text-transform: uppercase; }
.settings-list strong, .settings-list code { display: block; margin-top: 3px; color: #f4eaff; font-family: var(--font); font-size: 1rem; white-space: normal; word-break: normal; overflow-wrap: normal; }
.skin-form label { display: block; margin-bottom: 7px; color: #d8cbed; font-weight: 600; }
.skin-form textarea { width: 100%; min-height: 220px; resize: vertical; padding: 13px; border: 1px solid var(--line); border-radius: 8px; outline: 0; background: #080510; color: #f7f0ff; }
.skin-form textarea:focus { border-color: var(--line-strong); box-shadow: 0 0 0 3px rgba(157,70,255,.11); }

.copy-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:13px; align-items:start; }
.copy-card { min-width: 0; padding: 17px; border: 1px solid var(--line); border-radius: 9px; background: var(--panel); }
.copy-card h2 { margin: 0 0 8px; font-size: 1.3rem; }
.copy-card p { margin: 0; color: var(--muted); }

.loading, .empty, .error { display: grid; min-height: 110px; place-items: center; padding: 18px; color: var(--soft); text-align: center; }
.error { color: #ff9db2; }
.skeleton { position: relative; overflow: hidden; background: rgba(255,255,255,.045); }
.skeleton::after { content: ""; position: absolute; inset: 0; transform: translateX(-100%); animation: shimmer 1.3s infinite; background: linear-gradient(90deg, transparent, rgba(255,255,255,.06), transparent); }
@keyframes shimmer { to { transform: translateX(100%); } }

.search-modal, .media-modal {
  position: fixed;
  inset: 0;
  z-index: 200;
  display: grid;
  place-items: start center;
  padding: 8vh 18px 30px;
  background: rgba(2,1,6,.82);
  backdrop-filter: blur(12px);
}
.search-box { width: min(620px,100%); overflow: hidden; border: 1px solid var(--line-strong); border-radius: 12px; background: #0a0712; box-shadow: 0 30px 80px rgba(0,0,0,.55); }
.search-box input { width: 100%; height: 56px; padding: 0 17px; border: 0; border-bottom: 1px solid var(--line); outline: 0; background: transparent; color: #fff; font-size: 1.05rem; }
.search-results { display: grid; max-height: 52vh; overflow-y: auto; padding: 8px; }
.search-results a { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 11px 12px; border-radius: 8px; }
.search-results a:hover { background: rgba(157,70,255,.12); }
.media-dialog { width: min(1040px,100%); overflow: hidden; border: 1px solid var(--line-strong); border-radius: 12px; background: #07050d; box-shadow: 0 30px 90px rgba(0,0,0,.6); }
.media-dialog-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 13px 15px; border-bottom: 1px solid var(--line); }
.media-dialog-head h2 { margin: 0; overflow: hidden; font-size: 1.15rem; text-overflow: ellipsis; white-space: nowrap; }
.media-dialog iframe { display: block; width: 100%; aspect-ratio: 16/9; border: 0; background: #000; }

@media (max-width: 1220px) {
  .media-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
}
@media (max-width: 900px) {
  :root { --sidebar: 0px; }
  .app-sidebar { width: 252px; transform: translateX(-105%); transition: transform .22s ease; }
  body.nav-open .app-sidebar { transform: translateX(0); }
  body.nav-open::after { content: ""; position: fixed; inset: 0; z-index: 55; background: rgba(0,0,0,.58); }
  .app-shell { margin-left: 0; }
  .app-topbar { grid-template-columns: auto auto minmax(0,1fr) auto; padding: 10px 14px; }
  .mobile-menu { display: inline-flex !important; }
  .mobile-brand { display: inline-flex; align-items: center; }
  .topbar-spacer { display: none; }
  .top-link { display: none; }
  .page-content { width: min(100% - 24px, 1100px); padding-top: 16px; }
  .page-grid > .two-thirds, .page-grid > .one-third, .page-grid > .half { grid-column: span 12; }
  .media-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .playlist-grid, .recommendations-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 620px) {
  body { font-size: 16px; }
  .app-topbar { min-height: 66px; grid-template-columns: auto auto minmax(0,1fr) auto; gap: 8px; }
  .search-button { min-width: 0; }
  .search-button span { display: none; }
  .live-chip { width: 42px; padding: 0; }
  .live-chip span:last-child { display: none; }
  .page-title-row { align-items: flex-start; flex-direction: column; }
  .profile-layout { grid-template-columns: 1fr; text-align: center; }
  .profile-copy h2, .steam-large h2 { white-space: normal; overflow-wrap: normal; word-break: normal; }
  .profile-copy .description { max-width: 34rem; margin-inline: auto; }
  .tag-row, .button-row { justify-content: center; }
  .stat-strip { grid-template-columns: 1fr 1fr; }
  .stat-strip article:nth-child(2) { border-right: 0; }
  .stat-strip article:nth-child(-n/**/+2) { border-bottom: 1px solid var(--line); }
  .metric-row { grid-template-columns: 1fr; }
  .mini-media { grid-template-columns: 92px minmax(0,1fr); }
  .mini-media img { width: 92px; height: 54px; }
  .mini-media time { display: none; }
  .media-grid, .playlist-grid, .recommendations-grid, .youtube-grid, .copy-grid, .settings-list { grid-template-columns: 1fr; }
  .steam-large { grid-template-columns: 1fr; text-align: center; }
  .steam-large img { margin: auto; }
  .game-row { grid-template-columns: minmax(100px,1fr) minmax(80px,1.3fr) auto; }
  .panel-head { align-items: flex-start; }
  .panel-head h2 { font-size: .95rem; }
  .live-copy h2 { font-size: 1.7rem; }
  .button-row { align-items: stretch; flex-direction: column; }
  .button { width: 100%; }
}



.sidebar-socials a svg { width: 17px; height: 17px; stroke-width: 1.8; }
.page-footer { display:flex; align-items:center; justify-content:space-between; gap:20px; width:min(1540px,calc(100% - 42px)); margin:0 auto; padding:22px 0 34px; border-top:1px solid var(--line); color:var(--soft); }
.page-footer div { display:flex; align-items:center; gap:12px; }
.page-footer strong { color:#f4eaff; font-size:1.15rem; }
.page-footer nav { display:flex; flex-wrap:wrap; gap:15px; }
.page-footer a:hover, .text-link:hover { color:#d596ff; }
.panel-note { margin:0 0 13px; color:var(--soft); font-size:.86rem; line-height:1.45; }
.content-section { margin-top:16px; }
.split-columns { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:16px; align-items:start; }
.column-stack { display:grid; gap:16px; align-content:start; min-width:0; }
.code-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:13px; }
.code-card { min-width:0; padding:16px; border:1px solid var(--line); border-radius:9px; background:rgba(255,255,255,.02); }
.code-card-head { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
.code-card h3 { margin:0 0 8px; font-size:1.24rem; }
.code-card pre { margin:12px 0; padding:14px; overflow:auto; border:1px solid var(--line); border-radius:8px; background:#050309; white-space:pre; overflow-wrap:normal; word-break:normal; }
.code-card code { color:#eadfff; font-family:Consolas,"Courier New",monospace; font-size:.84rem; }
.code-card p { margin:0; color:var(--muted); }
.button.compact { min-height:36px; padding:0 12px; }
.explanation-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.explanation-grid > div { min-width:0; padding:13px; border:1px solid var(--line); border-radius:8px; background:rgba(255,255,255,.02); }
.explanation-grid code { display:block; color:#d99aff; font-family:Consolas,"Courier New",monospace; font-size:.85rem; white-space:normal; overflow-wrap:break-word; word-break:normal; }
.explanation-grid p { margin:7px 0 0; color:var(--muted); }
.crosshair-grid { display:grid; grid-template-columns:1fr; gap:13px; }
.crosshair-grid .code-card { display:grid; grid-template-columns:minmax(160px,.5fr) minmax(0,1fr) auto; align-items:center; gap:18px; }
.crosshair-grid .code-card code { display:block; min-width:0; overflow-x:auto; white-space:nowrap; overflow-wrap:normal; word-break:normal; font-size:1rem; }
.crosshair-grid .button { margin:0; }
.notice { margin:15px 0 0; padding:12px 14px; border:1px solid rgba(229,190,93,.25); border-radius:8px; background:rgba(229,190,93,.06); color:#efe2b3; }
.biography-panel { max-width:1200px; }
.biography-copy { max-width:980px; columns:1; }
.biography-copy p { margin:0 0 1.1em; break-inside:avoid; color:#d9cfe6; font-size:1.05rem; line-height:1.62; }
.biography-copy .still-cat { color:#d99aff; font-size:1.35rem; font-weight:700; }
.about-support-grid { margin-top:16px; }
.text-link, .clickable-card span { display:inline-block; margin-top:12px; color:#c77cff; font-weight:700; }
.tool-link-grid, .support-link-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:13px; align-items:start; }
.tool-link-card, .support-link-card { display:flex; min-width:0; gap:13px; padding:17px; border:1px solid var(--line); border-radius:9px; background:var(--panel); transition:border-color .16s ease, transform .16s ease; }
.tool-link-card:hover, .support-link-card:hover, .clickable-card:hover { transform:translateY(-2px); border-color:var(--line-strong); }
.tool-icon { display:grid; width:38px; height:38px; flex:0 0 auto; place-items:center; border:1px solid var(--line-strong); border-radius:9px; color:#d99aff; }
.tool-link-card h2, .support-link-card h2 { margin:0 0 7px; font-size:1.25rem; }
.tool-link-card p, .support-link-card p { margin:0; color:var(--muted); }
.tool-link-card span, .support-link-card span { display:inline-block; margin-top:11px; color:#c77cff; font-size:.84rem; font-weight:700; }
.project-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:13px; }
.project-grid article { padding:15px; border:1px solid var(--line); border-radius:8px; background:rgba(255,255,255,.02); }
.project-grid h3 { margin:0 0 8px; }
.project-grid p { color:var(--muted); }
.status-tag { color:#d99aff; font-size:.8rem; font-weight:700; text-transform:uppercase; }
.sponsor-copy { max-width:1150px; }
.sponsor-copy > p { color:#d9cfe6; font-size:1.03rem; line-height:1.58; }
.clickable-card { display:block; transition:border-color .16s ease, transform .16s ease; }
.games-panel .panel-body, .community-panel .panel-body { min-height:0; }
.game-mix { display:grid; gap:11px; }

@media (max-width: 1100px) {
  .tool-link-grid, .support-link-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .project-grid { grid-template-columns:1fr; }
}
@media (max-width: 900px) {
  .split-columns, .code-grid { grid-template-columns:1fr; }
  .crosshair-grid { grid-template-columns:1fr 1fr; }
  .page-footer { width:min(100% - 24px,1100px); }
}
@media (max-width: 620px) {
  .page-footer { align-items:flex-start; flex-direction:column; }
  .page-footer div { align-items:flex-start; flex-direction:column; gap:3px; }
  .biography-copy { columns:1; }
  .tool-link-grid, .support-link-grid, .crosshair-grid, .explanation-grid { grid-template-columns:1fr; }
  .steam-large h2 { font-size:1.65rem; }
}



.profile-copy .description { max-width:520px; font-size:1rem; line-height:1.5; }
.mini-game { display:inline-flex; margin-bottom:4px; color:#cc8cff; font-size:.68rem; font-weight:700; text-transform:uppercase; }
.metric-tabs { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin-bottom:12px; }
.metric-tab { min-width:0; padding:12px; border:1px solid var(--line); border-radius:8px; background:rgba(255,255,255,.025); color:var(--text); text-align:left; cursor:pointer; }
.metric-tab:hover,.metric-tab.active { border-color:var(--line-strong); background:linear-gradient(135deg,rgba(141,49,245,.18),rgba(255,255,255,.025)); }
.metric-tab small,.metric-tab span { display:block; color:var(--soft); font-size:.68rem; text-transform:uppercase; }
.metric-tab strong { display:block; margin:3px 0; font-size:1.42rem; }
.chart-point { fill:#e05cff; stroke:#fff; stroke-width:1.5; cursor:pointer; transition:r .15s ease,fill .15s ease; }
.chart-point:hover,.chart-point:focus { r:7; fill:#62d9ff; outline:none; }

.cs2-top-columns { margin-bottom:16px; }
.crosshair-grid .notice { grid-column:1/-1; }

.about-feature-grid { display:grid; grid-template-columns:minmax(0,1.55fr) minmax(280px,.75fr); gap:16px; align-items:start; }
.cat-family-feature { display:grid; grid-template-columns:minmax(260px,.75fr) minmax(0,1fr); align-items:stretch; min-height:420px; }
.cat-family-art { min-height:420px; overflow:hidden; background:radial-gradient(circle at 50% 35%,rgba(157,70,255,.28),transparent 55%); }
.cat-family-art img { width:100%; height:100%; object-fit:contain; object-position:center bottom; }
.cat-family-feature .panel-body { display:flex; flex-direction:column; justify-content:center; padding:32px; }
.cat-family-feature h2 { margin:0 0 12px; font-size:clamp(1.8rem,3vw,2.6rem); line-height:1.05; }
.cat-family-feature p:not(.eyebrow) { margin:0; color:#d9cfe6; font-size:1.08rem; line-height:1.62; }

.tools-board { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; align-items:stretch; }
.tool-card-pro { display:grid; grid-template-columns:72px minmax(0,1fr); gap:16px; min-width:0; height:100%; padding:18px; border:1px solid var(--line); border-radius:var(--radius); background:linear-gradient(135deg,rgba(157,70,255,.07),transparent 45%),var(--panel); box-shadow:var(--shadow); }
.tool-mark { display:grid; width:72px; height:72px; place-items:center; border:1px solid var(--line-strong); border-radius:16px; background:linear-gradient(135deg,rgba(157,70,255,.28),rgba(98,217,255,.08)); color:#fff; font-size:1.28rem; font-weight:700; letter-spacing:.04em; }
.tool-card-copy { display:flex; min-width:0; flex-direction:column; align-items:flex-start; }
.tool-card-copy h2 { margin:0 0 5px; font-size:1.35rem; }
.tool-card-copy p { margin:0 0 14px; color:var(--muted); }
.tool-card-copy .button { margin-top:auto; }

.project-showcase { display:grid; gap:16px; }
.project-feature { display:grid; grid-template-columns:90px minmax(0,1fr); gap:22px; padding:26px; border:1px solid var(--line); border-radius:var(--radius); background:linear-gradient(135deg,rgba(157,70,255,.11),transparent 42%),var(--panel); box-shadow:var(--shadow); }
.project-number { color:rgba(207,145,255,.42); font-size:3.2rem; font-weight:700; line-height:1; }
.project-feature h2 { margin:0 0 8px; font-size:clamp(1.55rem,2.6vw,2.25rem); }
.project-feature p:not(.eyebrow) { max-width:900px; margin:0; color:var(--muted); }
.project-points { display:flex; flex-wrap:wrap; gap:8px; margin:18px 0; }
.project-points span,.sponsor-tags span { padding:7px 10px; border:1px solid var(--line); border-radius:7px; color:#ded1ed; font-size:.8rem; font-weight:600; }

.support-hero { position:relative; display:grid; grid-template-columns:minmax(0,1fr) 310px; min-height:360px; align-items:center; gap:20px; overflow:hidden; padding:38px; border:1px solid var(--line); border-radius:var(--radius); background:radial-gradient(circle at 75% 35%,rgba(157,70,255,.32),transparent 30rem),linear-gradient(135deg,rgba(157,70,255,.16),rgba(8,6,15,.96)); box-shadow:var(--shadow); }
.support-hero h1 { max-width:720px; margin:0 0 10px; font-size:clamp(2.4rem,4.8vw,4.5rem); line-height:.96; }
.support-hero p:not(.eyebrow) { max-width:760px; color:#d8cde5; font-size:1.08rem; }
.support-hero img { align-self:end; width:100%; max-height:330px; object-fit:contain; object-position:center bottom; }
.support-action-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; align-items:start; }
.support-action { display:grid; grid-template-columns:54px minmax(0,1fr); gap:16px; min-height:220px; padding:22px; border:1px solid var(--line); border-radius:var(--radius); background:var(--panel); box-shadow:var(--shadow); transition:transform .16s ease,border-color .16s ease; }
.support-action:hover { transform:translateY(-3px); border-color:var(--line-strong); }
.support-action>span { color:#ca8bff; font-size:1.45rem; font-weight:700; }
.support-action h2 { margin:0 0 8px; font-size:1.65rem; }
.support-action p:not(.eyebrow) { margin:0; color:var(--muted); }
.support-action strong { display:block; margin-top:24px; color:#d693ff; }
.support-action.primary-action { background:linear-gradient(135deg,rgba(141,49,245,.22),rgba(12,9,22,.96)); }
.sponsor-layout { display:grid; grid-template-columns:minmax(0,1.55fr) minmax(280px,.65fr); gap:28px; align-items:start; }
.sponsor-copy { max-width:none; }
.sponsor-contact { display:grid; gap:16px; padding:20px; border:1px solid var(--line); border-radius:10px; background:rgba(157,70,255,.06); }
.sponsor-tags { display:flex; flex-wrap:wrap; gap:8px; }
.donation-terms { padding:18px 20px; border:1px solid var(--line); border-radius:10px; background:rgba(255,255,255,.02); }
.donation-terms h2 { margin:0 0 6px; font-size:1.15rem; }
.donation-terms p { margin:0; color:var(--muted); }

.medal-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; align-items:start; }
.medal-card { min-width:0; overflow:hidden; border:1px solid var(--line); border-radius:var(--radius); background:var(--panel); box-shadow:var(--shadow); }
.medal-player { position:relative; width:100%; aspect-ratio:16/9; overflow:hidden; background:#030205; }
.medal-player iframe { position:absolute; inset:0; width:100%; height:100%; border:0; }
.medal-card-copy { padding:18px; }
.medal-card-copy h2 { min-height:2.4em; margin:0 0 14px; font-size:1.35rem; line-height:1.2; }

.schedule-layout { display:grid; grid-template-columns:1fr 1fr; gap:16px; align-items:start; }
.schedule-list { display:grid; gap:10px; }
.schedule-item { display:grid; grid-template-columns:150px minmax(0,1fr) auto; gap:14px; align-items:center; padding:13px; border:1px solid var(--line); border-radius:8px; background:rgba(255,255,255,.02); }
.schedule-item time { color:#c78cff; font-size:.86rem; }
.schedule-item h3 { margin:0; font-size:1.05rem; }
.schedule-item p { margin:3px 0 0; color:var(--soft); font-size:.82rem; }
.schedule-item>span { color:#d7c4e8; font-size:.78rem; font-weight:700; }

.gallery-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.gallery-grid figure { margin:0; overflow:hidden; border:1px solid var(--line); border-radius:var(--radius); background:var(--panel); }
.gallery-grid img { display:block; width:100%; aspect-ratio:4/3; object-fit:contain; background:radial-gradient(circle,rgba(157,70,255,.18),transparent 60%); }
.gallery-grid figcaption { padding:13px; color:#dfd3ec; font-weight:600; }
.route-art { display:block; width:100%; max-height:520px; object-fit:cover; border-radius:9px; }
.route-copy { padding-top:18px; }

.page-content > * + * { margin-top:16px; }
.page-title-row + * { margin-top:0; }
.panel + .panel { margin-top:0; }
.copy-grid > *, .page-grid > *, .tool-link-grid > *, .support-link-grid > * { align-self:start; }

@media (max-width:1220px) {
  .dashboard-top { grid-template-columns:1fr; }
  .dashboard-columns { grid-template-columns:1fr 1fr; }
  .dashboard-column-wide { grid-column:1/-1; grid-row:1; }
  .medal-grid { grid-template-columns:1fr 1fr; }
}
@media (max-width:900px) {
  .dashboard-columns,.about-feature-grid,.support-hero,.sponsor-layout,.schedule-layout { grid-template-columns:1fr; }
  .dashboard-column-wide { grid-column:auto; grid-row:auto; }
  .tools-board,.support-action-grid { grid-template-columns:1fr 1fr; }
  .cat-family-feature { grid-template-columns:1fr; }
  .cat-family-art { min-height:300px; }
  .support-hero img { max-height:260px; }
  .crosshair-grid .code-card { grid-template-columns:1fr; align-items:start; }
  .crosshair-grid .button { width:auto; }
}
@media (max-width:620px) {
  .metric-tabs,.tools-board,.support-action-grid,.medal-grid,.gallery-grid { grid-template-columns:1fr; }
  .tool-card-pro,.project-feature,.support-action { grid-template-columns:1fr; }
  .tool-mark { width:58px; height:58px; }
  .project-number { font-size:2.2rem; }
  .support-hero { padding:24px; }
  .support-hero h1 { font-size:2.5rem; }
  .schedule-item { grid-template-columns:1fr; gap:5px; }
  .medal-card-copy h2 { min-height:0; }
}



.tool-logo-box {
  display:grid;
  width:72px;
  height:72px;
  place-items:center;
  overflow:hidden;
  border:1px solid var(--line-strong);
  border-radius:16px;
  background:linear-gradient(135deg,rgba(157,70,255,.22),rgba(98,217,255,.07));
}
.tool-logo {
  width:46px;
  height:46px;
  object-fit:contain;
  image-rendering:auto;
  filter:drop-shadow(0 0 12px rgba(168,88,255,.35));
}
.tool-actions { margin-top:auto; }
.tool-actions .button { margin-top:0; }


.project-intro-v4 {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  padding:15px 18px;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:linear-gradient(90deg,rgba(157,70,255,.1),rgba(255,255,255,.018));
  color:#e8def3;
}
.project-intro-v4 span { color:var(--muted); text-align:right; }
.project-grid-v4 {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:16px;
  align-items:start;
}
.project-card-v4 {
  align-self:start;
  min-width:0;
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:linear-gradient(145deg,rgba(157,70,255,.08),transparent 44%),var(--panel);
  box-shadow:var(--shadow);
  transition:transform .16s ease,border-color .16s ease;
}
.project-card-v4:hover { transform:translateY(-3px); border-color:var(--line-strong); }
.project-preview-v4 {
  display:block;
  width:100%;
  aspect-ratio:16/8.6;
  overflow:hidden;
  border-bottom:1px solid var(--line);
  background:#07050d;
}
.project-preview-v4 img { display:block; width:100%; height:100%; object-fit:cover; }
.project-body-v4 { padding:20px; }
.project-body-v4 h2 { margin:0 0 8px; font-size:clamp(1.5rem,2.3vw,2rem); line-height:1.08; }
.project-body-v4 > p:not(.eyebrow) { margin:0; color:var(--muted); line-height:1.55; }
.project-actions-v4 { display:flex; flex-wrap:wrap; gap:9px; margin-top:18px; }
.project-support-note { display:block; margin-top:9px; color:var(--soft); font-size:.76rem; }

@media (max-width:900px) {
  .project-grid-v4 { grid-template-columns:1fr; }
  .project-intro-v4 { align-items:flex-start; flex-direction:column; }
  .project-intro-v4 span { text-align:left; }
}
@media (max-width:620px) {
  .tool-logo-box { width:58px; height:58px; }
  .tool-logo { width:38px; height:38px; }
  .project-body-v4 { padding:17px; }
  .project-actions-v4 { flex-direction:column; }
  .project-actions-v4 .button { width:100%; }
}




body[data-page="games"] [data-playlists] {
  width: 100%;
}

body[data-page="games"] .playlist-category {
  width: 100%;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 11px;
  background: rgba(255, 255, 255, .015);
}

body[data-page="games"] .playlist-category + .playlist-category {
  margin-top: 18px;
}

body[data-page="games"] .category-head {
  margin-bottom: 14px;
}

body[data-page="games"] .playlist-grid {
  width: 100%;
  align-items: stretch;
}

body[data-page="games"] .playlist-grid-single {
  grid-template-columns: minmax(0, 1fr);
}

body[data-page="games"] .playlist-grid-two {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

body[data-page="games"] .playlist-grid-four {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

body[data-page="games"] .playlist-grid-many {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

body[data-page="games"] .playlist-card {
  height: 100%;
  background:
    linear-gradient(180deg, rgba(255,255,255,.025), transparent 44%),
    rgba(10, 7, 18, .96);
}

body[data-page="games"] .playlist-card-copy {
  display: flex;
  min-width: 0;
  height: 100%;
  flex-direction: column;
  padding: 16px;
}

body[data-page="games"] .playlist-card h3 {
  font-size: 1.32rem;
}

body[data-page="games"] .playlist-card-footer {
  margin-top: auto;
  padding-top: 12px;
}


body[data-page="games"] .playlist-grid-single .playlist-card {
  display: grid;
  grid-template-columns: minmax(340px, 1.18fr) minmax(280px, .82fr);
  min-height: 285px;
}

body[data-page="games"] .playlist-grid-single .playlist-card > a {
  display: block;
  min-width: 0;
  height: 100%;
}

body[data-page="games"] .playlist-grid-single .playlist-card img {
  width: 100%;
  height: 100%;
  min-height: 285px;
  aspect-ratio: auto;
  object-fit: cover;
}

body[data-page="games"] .playlist-grid-single .playlist-card-copy {
  justify-content: center;
  padding: clamp(22px, 3vw, 38px);
}

body[data-page="games"] .playlist-grid-single .playlist-card h3 {
  font-size: clamp(1.55rem, 2.3vw, 2.15rem);
}

body[data-page="games"] .playlist-grid-single .playlist-card p {
  display: block;
  margin: 12px 0;
  font-size: 1rem;
  line-height: 1.55;
  -webkit-line-clamp: unset;
}

@media (max-width: 1180px) {
  body[data-page="games"] .playlist-grid-many {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  body[data-page="games"] .playlist-grid-single .playlist-card {
    grid-template-columns: minmax(280px, 1fr) minmax(260px, .9fr);
  }
}

@media (max-width: 760px) {
  body[data-page="games"] .playlist-category {
    padding: 14px;
  }

  body[data-page="games"] .playlist-grid-single,
  body[data-page="games"] .playlist-grid-two,
  body[data-page="games"] .playlist-grid-four,
  body[data-page="games"] .playlist-grid-many {
    grid-template-columns: 1fr;
  }

  body[data-page="games"] .playlist-grid-single .playlist-card {
    display: block;
    min-height: 0;
  }

  body[data-page="games"] .playlist-grid-single .playlist-card img {
    height: auto;
    min-height: 0;
    aspect-ratio: 16 / 9;
  }

  body[data-page="games"] .playlist-grid-single .playlist-card-copy {
    padding: 16px;
  }

  body[data-page="games"] .playlist-grid-single .playlist-card h3 {
    font-size: 1.32rem;
  }
}



body[data-page="about"] .biography-panel,
body[data-page="about"] .biography-copy {
  width: 100%;
  max-width: none;
}

body[data-page="about"] .about-feature-grid {
  gap: 12px;
}

body[data-page="about"] .about-feature-grid > .column-stack {
  gap: 12px;
}

body[data-page="about"] .copy-card {
  height: auto;
  padding: 18px;
}

body[data-page="cs2"] .cs2-top-columns {
  gap: 14px;
}

body[data-page="cs2"] .column-stack {
  gap: 14px;
}

body[data-page="cs2"] .steam-action-row,
.dashboard-steam-buttons {
  margin-top: 16px;
}

body[data-page="cs2"] .steam-action-row .button,
.dashboard-steam-buttons .button {
  flex: 1 1 180px;
}

body[data-page="cs2"] .skin-yap-intro > p {
  margin: 0 0 10px;
  color: var(--muted);
}

body[data-page="cs2"] .skin-topic-row {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-bottom: 15px;
}

body[data-page="cs2"] .skin-topic-row span {
  padding: 6px 9px;
  border: 1px solid var(--line);
  border-radius: 7px;
  color: #dcccf0;
  font-size: .78rem;
  font-weight: 700;
}

body[data-page="cs2"] .skin-safety {
  margin: 12px 0 0;
  color: var(--soft);
  font-size: .8rem;
}

.steam-check-input-row {
  margin-bottom: 20px;
}

.steam-check-input-row label {
  display: block;
  margin-bottom: 8px;
  font-weight: 700;
}

.steam-check-input-row > div {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 9px;
}

.steam-check-input-row input {
  width: 100%;
  min-height: 44px;
  padding: 0 13px;
  border: 1px solid var(--line);
  border-radius: 8px;
  outline: none;
  background: #080510;
  color: var(--text);
}

.steam-check-input-row input:focus {
  border-color: var(--line-strong);
  box-shadow: 0 0 0 3px rgba(157,70,255,.12);
}

.steam-check-input-row [data-steam-tool-status] {
  min-height: 1.3em;
  margin: 7px 0 0;
  color: #c894f5;
  font-size: .8rem;
}

.cs2-tool-groups {
  display: grid;
  gap: 18px;
}

.cs2-tool-grid,
.cs2-link-card-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.cs2-service-card,
.cs2-link-card {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  min-width: 0;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: rgba(255,255,255,.022);
  color: var(--text);
  text-align: left;
  text-decoration: none;
  cursor: pointer;
  transition: transform .15s ease, border-color .15s ease, background .15s ease;
}

.cs2-service-card:hover,
.cs2-link-card:hover {
  transform: translateY(-2px);
  border-color: var(--line-strong);
  background: linear-gradient(135deg, rgba(157,70,255,.12), rgba(255,255,255,.025));
}

.cs2-service-card img,
.cs2-link-card img {
  width: 44px;
  height: 44px;
  border-radius: 10px;
  object-fit: contain;
  background: #fff;
}

.cs2-service-card span,
.cs2-link-card span {
  min-width: 0;
}

.cs2-service-card strong,
.cs2-link-card strong,
.cs2-service-card small,
.cs2-link-card small {
  display: block;
}

.cs2-service-card small,
.cs2-link-card small {
  margin-top: 3px;
  color: var(--soft);
  font-size: .76rem;
  line-height: 1.35;
}

.follow-platform-strip {
  width: min(1500px, calc(100% - 48px));
  margin: 22px auto 0;
  padding: 16px 18px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: linear-gradient(90deg, rgba(157,70,255,.12), rgba(255,255,255,.02));
}

.follow-platform-strip > strong {
  display: block;
  margin-bottom: 10px;
  font-size: .9rem;
  letter-spacing: .05em;
  text-transform: uppercase;
}

.follow-platform-strip nav {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
}

.follow-platform-strip a {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 38px;
  padding: 7px 11px;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--text);
  text-decoration: none;
  font-weight: 700;
}

.follow-platform-strip a:hover {
  border-color: var(--line-strong);
  background: rgba(157,70,255,.1);
}

.follow-platform-strip img {
  width: 20px;
  height: 20px;
  border-radius: 5px;
}

.twitch-live-embed-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(290px, 360px);
  min-height: 650px;
}

.twitch-player-frame,
.twitch-chat-frame {
  display: block;
  width: 100%;
  height: 650px;
  border: 0;
}

.medal-fallback,
.medal-grid > .empty {
  grid-column: 1 / -1;
  display: flex;
  justify-content: center;
  padding: 40px 20px;
}

@media (max-width: 980px) {
  .cs2-tool-grid,
  .cs2-link-card-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .twitch-live-embed-grid {
    grid-template-columns: 1fr;
  }

  .twitch-chat-frame {
    height: 500px;
  }
}

@media (max-width: 620px) {
  .cs2-tool-grid,
  .cs2-link-card-grid {
    grid-template-columns: 1fr;
  }

  .steam-check-input-row > div {
    grid-template-columns: 1fr;
  }

  .follow-platform-strip {
    width: calc(100% - 24px);
  }

  .follow-platform-strip nav {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .follow-platform-strip a {
    justify-content: flex-start;
  }
}



.medal-profile-panel {
  overflow: hidden;
}

.medal-profile-frame-wrap {
  min-height: 900px;
  background: #05030a;
}

.medal-profile-frame {
  display: block;
  width: 100%;
  height: 1100px;
  border: 0;
  background: #05030a;
}

.medal-profile-fallback {
  display: flex;
  justify-content: center;
  padding: 16px;
  border-top: 1px solid var(--line);
}

@media (max-width: 760px) {
  .medal-profile-frame-wrap {
    min-height: 720px;
  }

  .medal-profile-frame {
    height: 820px;
  }
}



.medal-profile-frame-wrap,
.medal-profile-frame,
.medal-profile-fallback {
  display: none !important;
}


body[data-page="support"] .support-action.primary-action {
  border-color: var(--line);
  background: rgba(255,255,255,.02);
  box-shadow: none;
}

@media (max-width: 620px) {
  .medal-external-content {
    grid-template-columns: 1fr;
    text-align: center;
  }

  .medal-external-logo {
    margin: 0 auto;
  }

  .medal-external-content .button-row {
    justify-content: center;
  }
}



.short-platform-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 11px;
}

.short-platform-card {
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr) auto;
  align-items: center;
  gap: 13px;
  min-width: 0;
  padding: 15px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background:
    linear-gradient(135deg, rgba(157,70,255,.08), transparent 58%),
    rgba(255,255,255,.018);
  color: var(--text);
  text-decoration: none;
  transition:
    transform .15s ease,
    border-color .15s ease,
    background .15s ease;
}

.short-platform-card:hover {
  transform: translateY(-2px);
  border-color: var(--line-strong);
  background:
    linear-gradient(135deg, rgba(157,70,255,.15), transparent 60%),
    rgba(255,255,255,.025);
}

.short-platform-card img {
  width: 48px;
  height: 48px;
  padding: 6px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #100b18;
  object-fit: contain;
}

.short-platform-card span {
  min-width: 0;
}

.short-platform-card strong,
.short-platform-card small {
  display: block;
}

.short-platform-card small {
  margin-top: 4px;
  color: var(--soft);
  line-height: 1.35;
}

.short-platform-card b {
  padding: 8px 11px;
  border: 1px solid var(--line);
  border-radius: 7px;
  color: #d9a9ff;
  font-size: .78rem;
  text-transform: uppercase;
}

@media (max-width: 760px) {
  .short-platform-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 430px) {
  .short-platform-card {
    grid-template-columns: 42px minmax(0, 1fr);
  }

  .short-platform-card img {
    width: 42px;
    height: 42px;
  }

  .short-platform-card b {
    grid-column: 2;
    justify-self: start;
  }
}



body[data-page="about"] .biography-panel,
body[data-page="about"] .biography-copy {
  width: 100%;
  max-width: none;
}

body[data-page="about"] .biography-copy {
  box-sizing: border-box;
}

body[data-page="about"] .biography-copy p {
  width: 100%;
  max-width: none;
}

body[data-page="about"] .about-feature-grid {
  gap: 12px;
}

body[data-page="about"] .about-feature-grid > .column-stack {
  gap: 12px;
}

body[data-page="about"] .copy-card {
  height: auto;
  padding: 18px;
}



@media (max-width: 760px) {
  body[data-page="games"] .playlist-grid {
    align-items: start;
  }

  body[data-page="games"] .playlist-card,
  body[data-page="games"] .playlist-grid-single .playlist-card,
  body[data-page="games"] .playlist-grid-two .playlist-card,
  body[data-page="games"] .playlist-grid-four .playlist-card,
  body[data-page="games"] .playlist-grid-many .playlist-card {
    display: block;
    height: auto !important;
    min-height: 0 !important;
  }

  body[data-page="games"] .playlist-card-image,
  body[data-page="games"] .playlist-grid-single .playlist-card > a {
    display: block;
    width: 100%;
    height: auto !important;
    min-height: 0 !important;
  }

  body[data-page="games"] .playlist-card img,
  body[data-page="games"] .playlist-grid-single .playlist-card img {
    display: block;
    width: 100%;
    height: auto !important;
    min-height: 0 !important;
    aspect-ratio: 16 / 9 !important;
    object-fit: cover;
  }

  body[data-page="games"] .playlist-card-copy,
  body[data-page="games"] .playlist-grid-single .playlist-card-copy {
    display: block;
    height: auto !important;
    min-height: 0 !important;
    padding: 14px;
  }

  body[data-page="games"] .playlist-card h3,
  body[data-page="games"] .playlist-grid-single .playlist-card h3 {
    font-size: 1.15rem;
    line-height: 1.25;
  }

  body[data-page="games"] .playlist-card p,
  body[data-page="games"] .playlist-grid-single .playlist-card p {
    display: -webkit-box;
    margin: 8px 0 12px;
    overflow: hidden;
    font-size: .88rem;
    line-height: 1.45;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
  }

  body[data-page="games"] .playlist-card-footer,
  body[data-page="games"] .playlist-grid-single .playlist-card-footer {
    margin-top: 0;
    padding-top: 0;
  }

  body[data-page="games"] .playlist-card-footer .button {
    width: auto;
    min-height: 38px;
    padding: 0 12px;
  }
}

@media (max-width: 620px) {
  .app-topbar {
    grid-template-columns: 42px minmax(0, 1fr) 42px auto;
    gap: 8px;
    padding: 10px 12px;
  }

  .mobile-brand {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .search-button {
    width: 42px;
    min-width: 42px;
    min-height: 42px;
    justify-content: center;
    padding: 0;
    color: #e6dff2;
    font-size: 1.1rem;
  }

  .search-button span:first-child {
    display: inline;
    overflow: visible;
  }

  .search-button span:last-child {
    display: none;
  }

  .topbar-actions {
    gap: 7px;
  }

  .live-chip,
  .icon-button {
    min-height: 42px;
  }

  body[data-page="cs2"] .steam-action-row {
    gap: 8px;
    margin-top: 12px;
  }

  body[data-page="cs2"] .steam-action-row .button,
  .dashboard-steam-buttons .button {
    flex: 0 0 auto !important;
    width: 100%;
    height: auto;
    min-height: 44px;
    padding: 10px 13px;
  }

  body[data-page="cs2"] .panel-body {
    padding: 14px;
  }

  body[data-page="cs2"] .settings-list div {
    padding: 13px;
  }

  body[data-page="games"] .panel-body {
    padding: 10px;
  }

  body[data-page="games"] .playlist-category {
    padding: 12px;
  }

  body[data-page="games"] .category-head {
    align-items: flex-end;
    gap: 12px;
    margin-bottom: 12px;
  }

  body[data-page="games"] .category-head h2 {
    font-size: 1.45rem;
  }

  body[data-page="games"] .category-head > span {
    flex: 0 0 auto;
    font-size: .92rem;
  }
}



.project-page-heading {
  margin-bottom: 16px;
}

.real-project {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 14px;
  background:
    radial-gradient(circle at 82% 5%, rgba(155, 62, 255, .13), transparent 30%),
    var(--panel);
  box-shadow: var(--shadow);
}

.real-project-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 28px;
  padding: clamp(22px, 4vw, 42px);
  border-bottom: 1px solid var(--line);
}

.real-project-header > div:first-child {
  max-width: 900px;
}

.real-project-header h2 {
  margin: 5px 0 12px;
  font-size: clamp(2rem, 4vw, 3.7rem);
  line-height: .98;
}

.real-project-lead {
  max-width: 900px;
  margin: 0;
  color: var(--muted);
  font-size: clamp(.98rem, 1.5vw, 1.12rem);
  line-height: 1.6;
}

.real-project-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 18px;
}

.real-project-badges span {
  padding: 7px 10px;
  border: 1px solid var(--line-strong);
  border-radius: 999px;
  background: rgba(145, 55, 255, .09);
  color: #ead9ff;
  font-size: .76rem;
  font-weight: 700;
}

.real-project-main-actions {
  display: flex;
  width: min(310px, 100%);
  flex: 0 0 auto;
  flex-direction: column;
  gap: 9px;
}

.project-download {
  min-height: 50px;
}

.wasd-live-demo {
  margin: clamp(16px, 3vw, 28px);
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #07040d;
  outline: none;
}

.wasd-live-demo:focus-visible {
  border-color: var(--line-strong);
  box-shadow: 0 0 0 3px rgba(155, 62, 255, .18);
}

.wasd-demo-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  padding: 18px 20px;
  border-bottom: 1px solid var(--line);
  background: rgba(255, 255, 255, .018);
}

.wasd-demo-heading h3 {
  margin: 3px 0 5px;
  font-size: 1.45rem;
}

.wasd-demo-heading p:not(.eyebrow) {
  max-width: 760px;
  margin: 0;
  color: var(--muted);
}

.wasd-demo-status {
  display: flex;
  align-items: center;
  flex: 0 0 auto;
  gap: 8px;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: #d8c6e9;
  font-size: .78rem;
  font-weight: 700;
}

.wasd-demo-frame {
  height: clamp(430px, 48vw, 720px);
  background:
    radial-gradient(circle at 50% 44%, rgba(133, 51, 239, .14), transparent 46%),
    #050209;
}

.wasd-demo-frame iframe {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
  background: transparent;
}

.wasd-demo-controls {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  padding: 15px;
  border-top: 1px solid var(--line);
  background: rgba(255, 255, 255, .018);
}

.wasd-demo-controls button {
  min-width: 58px;
  min-height: 42px;
  padding: 9px 13px;
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  background: linear-gradient(180deg, rgba(153, 56, 255, .2), rgba(153, 56, 255, .08));
  color: #fff;
  font: inherit;
  font-weight: 800;
  cursor: pointer;
}

.wasd-demo-controls button:hover,
.wasd-demo-controls button:focus-visible {
  border-color: #cf8dff;
  box-shadow: 0 0 16px rgba(157, 70, 255, .3);
}

.wasd-demo-controls .demo-control-secondary {
  background: rgba(255, 255, 255, .025);
  color: #ded1ed;
}

.real-project-information {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  padding: 0 clamp(16px, 3vw, 28px) 12px;
}

.project-info-panel,
.project-package-panel,
.project-verification-panel {
  border: 1px solid var(--line);
  border-radius: 11px;
  background: rgba(255, 255, 255, .015);
}

.project-info-panel {
  padding: clamp(18px, 2.5vw, 26px);
}

.project-info-panel h3,
.project-package-panel h3,
.project-verification-panel h3 {
  margin: 4px 0 12px;
  font-size: 1.35rem;
}

.project-info-panel ul {
  margin: 0;
  padding-left: 20px;
  color: var(--muted);
  line-height: 1.65;
}

.project-info-panel > p:not(.eyebrow) {
  color: var(--muted);
  line-height: 1.55;
}

.project-connection {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  margin-top: 16px;
}

.project-connection span {
  padding: 9px 11px;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--soft);
}

.project-connection strong {
  margin-left: 4px;
  color: #fff;
}

.idle-active-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
  margin: 14px 0;
}

.idle-active-grid div {
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: rgba(151, 58, 255, .055);
}

.idle-active-grid strong,
.idle-active-grid span {
  display: block;
}

.idle-active-grid span {
  margin-top: 5px;
  color: var(--muted);
  line-height: 1.4;
}

.project-package-panel,
.project-verification-panel {
  margin: 0 clamp(16px, 3vw, 28px) 12px;
  padding: clamp(18px, 2.6vw, 28px);
}

.project-package-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 9px;
}

.project-package-grid span {
  padding: 11px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255, 255, 255, .018);
  color: #e4daee;
}

.project-verification-stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 9px;
  margin: 14px 0;
}

.project-verification-stats div {
  padding: 15px;
  border: 1px solid var(--line);
  border-radius: 9px;
  text-align: center;
}

.project-verification-stats strong,
.project-verification-stats span {
  display: block;
}

.project-verification-stats strong {
  color: #db9eff;
  font-size: 1.45rem;
}

.project-verification-stats span {
  margin-top: 4px;
  color: var(--soft);
  font-size: .75rem;
  text-transform: uppercase;
}

.project-verification-panel > p {
  margin-bottom: 0;
  color: var(--muted);
}

.real-project-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 20px clamp(18px, 3vw, 30px);
  border-top: 1px solid var(--line);
  background: rgba(255, 255, 255, .018);
}

.real-project-footer strong,
.real-project-footer span {
  display: block;
}

.real-project-footer span {
  margin-top: 4px;
  color: var(--soft);
}

.project-footer-actions {
  display: flex;
  flex: 0 0 auto;
  gap: 9px;
}

@media (max-width: 900px) {
  .real-project-header {
    flex-direction: column;
  }

  .real-project-main-actions {
    width: 100%;
  }

  .real-project-information {
    grid-template-columns: 1fr;
  }

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

  .real-project-footer {
    align-items: flex-start;
    flex-direction: column;
  }
}

@media (max-width: 620px) {
  .real-project-header {
    padding: 18px;
  }

  .real-project-header h2 {
    font-size: 2.2rem;
  }

  .wasd-live-demo {
    margin: 12px;
  }

  .wasd-demo-heading {
    flex-direction: column;
    padding: 15px;
  }

  .wasd-demo-frame {
    height: 430px;
  }

  .wasd-demo-controls {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .wasd-demo-controls button {
    width: 100%;
  }

  .real-project-information {
    padding: 0 12px 12px;
  }

  .project-package-panel,
  .project-verification-panel {
    margin: 0 12px 12px;
  }

  .idle-active-grid,
  .project-package-grid,
  .project-verification-stats {
    grid-template-columns: 1fr;
  }

  .project-footer-actions {
    width: 100%;
    flex-direction: column;
  }

  .project-footer-actions .button {
    width: 100%;
  }
}



.project-jump-nav {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 16px;
}

.project-jump-nav a {
  display: block;
  min-width: 0;
  padding: 15px 17px;
  border: 1px solid var(--line);
  border-radius: 11px;
  background:
    linear-gradient(135deg, rgba(157,70,255,.095), transparent 60%),
    var(--panel);
  color: var(--text);
  text-decoration: none;
}

.project-jump-nav a:hover {
  border-color: var(--line-strong);
  transform: translateY(-1px);
}

.project-jump-nav strong,
.project-jump-nav span {
  display: block;
}

.project-jump-nav span {
  margin-top: 5px;
  color: var(--soft);
  line-height: 1.4;
}

.real-project + .real-project {
  margin-top: 18px;
}

.catmint-project {
  background:
    radial-gradient(circle at 88% 4%, rgba(113, 51, 255, .19), transparent 33%),
    radial-gradient(circle at 6% 42%, rgba(206, 105, 255, .07), transparent 25%),
    var(--panel);
}

.catmint-live-preview {
  margin: clamp(16px, 3vw, 28px);
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #08050d;
}

.catmint-demo-stage {
  display: grid;
  place-items: start center;
  height: min(900px, 72vh);
  min-height: 620px;
  overflow: auto;
  padding: 18px;
  background:
    radial-gradient(circle at 50% 15%, rgba(153, 83, 255, .13), transparent 36%),
    #050308;
}

.catmint-demo-stage iframe {
  display: block;
  width: min(470px, 100%);
  height: 1500px;
  border: 1px solid #4b396f;
  border-radius: 16px;
  background: #111219;
  box-shadow: 0 25px 70px rgba(0,0,0,.45);
}

.catmint-preview-fields {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 9px;
}

.catmint-preview-fields span {
  padding: 11px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(155, 67, 255, .055);
  color: #e5d9ef;
}

.catmint-safety-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin: 0 clamp(16px, 3vw, 28px) 12px;
}

.catmint-safety-grid > div {
  padding: clamp(18px, 2.5vw, 26px);
  border: 1px solid var(--line);
  border-radius: 11px;
  background: rgba(255,255,255,.015);
}

.catmint-safety-grid h3 {
  margin: 4px 0 10px;
  font-size: 1.35rem;
}

.catmint-safety-grid p:not(.eyebrow) {
  margin-bottom: 0;
  color: var(--muted);
  line-height: 1.6;
}

.project-download-dialog {
  width: min(520px, calc(100% - 28px));
  padding: 0;
  border: 1px solid var(--line-strong);
  border-radius: 14px;
  background:
    radial-gradient(circle at 90% 0, rgba(157,70,255,.2), transparent 36%),
    #100b18;
  color: var(--text);
  box-shadow: 0 30px 100px rgba(0,0,0,.72);
}

.project-download-dialog::backdrop {
  background: rgba(3, 2, 7, .78);
  backdrop-filter: blur(5px);
}

.project-download-dialog form {
  position: relative;
  padding: 28px;
}

.project-download-dialog h2 {
  margin: 5px 36px 10px 0;
  font-size: 1.75rem;
}

.project-download-dialog p:not(.eyebrow) {
  color: var(--muted);
  line-height: 1.55;
}

.dialog-close {
  position: absolute;
  top: 13px;
  right: 13px;
  width: 36px;
  height: 36px;
  border: 1px solid var(--line);
  border-radius: 50%;
  background: rgba(255,255,255,.025);
  color: #fff;
  font-size: 1.25rem;
  cursor: pointer;
}

.dialog-actions {
  display: grid;
  grid-template-columns: 1fr 1.25fr;
  gap: 9px;
  margin-top: 20px;
}

@media (max-width: 760px) {
  .project-jump-nav,
  .catmint-safety-grid {
    grid-template-columns: 1fr;
  }

  .catmint-preview-fields {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .catmint-demo-stage {
    height: 700px;
    min-height: 520px;
    padding: 10px;
  }
}

@media (max-width: 520px) {
  .catmint-preview-fields,
  .dialog-actions {
    grid-template-columns: 1fr;
  }

  .project-download-dialog form {
    padding: 22px 18px 18px;
  }
}



.catmint-live-preview {
  width: min(920px, calc(100% - 32px));
  margin: clamp(16px, 3vw, 28px) auto;
}

.catmint-demo-stage {
  height: 520px;
  min-height: 0;
  overflow: hidden;
  padding: 12px;
}

.catmint-demo-stage iframe {
  width: min(410px, 100%);
  height: 100%;
  min-height: 0;
}

.catmint-preview-actions {
  display: flex;
  align-items: center;
  flex: 0 0 auto;
  gap: 9px;
}

.compact-button {
  min-height: 36px;
  padding: 7px 11px;
  font-size: .78rem;
}

.project-verification-stats strong {
  overflow-wrap: anywhere;
}

@media (max-width: 760px) {
  .catmint-live-preview {
    width: calc(100% - 24px);
  }

  .catmint-demo-stage {
    height: 460px;
    padding: 8px;
  }

  .catmint-demo-stage iframe {
    width: 100%;
  }

  .catmint-preview-actions {
    width: 100%;
    align-items: stretch;
    flex-direction: column;
  }

  .catmint-preview-actions .wasd-demo-status,
  .catmint-preview-actions .button {
    width: 100%;
    justify-content: center;
  }
}



.wasd-media-preview {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(260px, 390px);
  align-items: center;
  gap: 24px;
  margin: clamp(16px, 3vw, 28px);
  padding: clamp(18px, 3vw, 28px);
  border: 1px solid var(--line);
  border-radius: 12px;
  background:
    radial-gradient(circle at 82% 40%, rgba(255, 0, 224, .12), transparent 35%),
    rgba(255, 255, 255, .015);
}

.wasd-media-copy h3 {
  margin: 4px 0 9px;
  font-size: clamp(1.35rem, 2vw, 1.8rem);
}

.wasd-media-copy p:not(.eyebrow) {
  max-width: 720px;
  margin: 0;
  color: var(--muted);
  line-height: 1.6;
}

.wasd-media-shell {
  display: grid;
  place-items: center;
  width: 100%;
  min-height: 300px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #020104;
  box-shadow: inset 0 0 40px rgba(255, 0, 225, .045);
}

.wasd-media-shell video {
  display: block;
  width: min(100%, 340px);
  height: auto;
  max-height: 360px;
  border-radius: 9px;
  background: #000;
  object-fit: contain;
}

@media (max-width: 820px) {
  .wasd-media-preview {
    grid-template-columns: 1fr;
  }

  .wasd-media-shell {
    min-height: 0;
  }
}

@media (max-width: 520px) {
  .wasd-media-preview {
    margin: 12px;
    padding: 15px;
  }

  .wasd-media-shell {
    padding: 8px;
  }

  .wasd-media-shell video {
    width: min(100%, 300px);
  }
}



.wasd-media-shell {
  position: relative;
  overflow: hidden;
}

.wasd-media-shell video {
  position: relative;
  z-index: 1;
}

.wasd-video-play {
  position: absolute;
  z-index: 3;
  top: 50%;
  left: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  min-width: 154px;
  min-height: 52px;
  padding: 11px 16px;
  border: 1px solid rgba(255, 0, 225, .72);
  border-radius: 999px;
  background: rgba(9, 4, 14, .9);
  color: #fff;
  font: inherit;
  cursor: pointer;
  transform: translate(-50%, -50%);
  box-shadow:
    0 0 0 4px rgba(255, 0, 225, .08),
    0 0 26px rgba(255, 0, 225, .25);
}

.wasd-video-play:hover,
.wasd-video-play:focus-visible {
  border-color: #ff67ec;
  box-shadow:
    0 0 0 4px rgba(255, 0, 225, .13),
    0 0 34px rgba(255, 0, 225, .38);
}

.wasd-video-play span {
  font-size: 1.15rem;
}

.wasd-media-shell.is-playing .wasd-video-play {
  top: 15px;
  left: auto;
  right: 15px;
  min-width: 44px;
  min-height: 36px;
  padding: 7px 10px;
  opacity: .18;
  transform: none;
}

.wasd-media-shell.is-playing .wasd-video-play strong {
  display: none;
}

.wasd-media-shell.is-playing .wasd-video-play:hover,
.wasd-media-shell.is-playing .wasd-video-play:focus-visible {
  opacity: 1;
}

.wasd-video-message {
  position: absolute;
  z-index: 2;
  right: 12px;
  bottom: 12px;
  left: 12px;
  margin: 0;
  padding: 7px 10px;
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 8px;
  background: rgba(5, 2, 8, .82);
  color: #d6cadf;
  font-size: .76rem;
  text-align: center;
  pointer-events: none;
}

.wasd-video-message[hidden] {
  display: none;
}

@media (max-width: 520px) {
  .wasd-video-play {
    min-width: 142px;
    min-height: 48px;
  }
}



.catmint-preview-actions .wasd-demo-status {
  width: 36px;
  min-width: 36px;
  height: 36px;
  min-height: 36px;
  justify-content: center;
  padding: 0;
  border-radius: 50%;
}

.catmint-preview-actions .wasd-demo-status .status-dot {
  width: 10px;
  height: 10px;
  margin: 0;
}

@media (max-width: 760px) {
  .catmint-preview-actions {
    width: auto;
    align-items: center;
    flex-direction: row;
  }

  .catmint-preview-actions .wasd-demo-status {
    width: 36px;
    min-width: 36px;
  }

  .catmint-preview-actions .button {
    width: auto;
  }
}



.project-engagement {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  padding-top: 4px;
}

.project-engagement > .button {
  grid-column: 1 / -1;
  width: 100%;
}

.project-heart,
.project-download-stat {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 40px;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: rgba(255,255,255,.02);
  color: #ded3e8;
  font: inherit;
}

.project-heart {
  cursor: pointer;
}

.project-heart:hover:not(:disabled),
.project-heart:focus-visible:not(:disabled),
.project-heart[aria-pressed="true"] {
  border-color: rgba(255, 91, 207, .72);
  color: #ff8ddd;
  box-shadow: 0 0 20px rgba(255, 63, 198, .15);
}

.project-heart:disabled {
  cursor: not-allowed;
  opacity: .48;
}

.project-heart-icon {
  font-size: 1.08rem;
}

.project-engagement strong {
  color: #fff;
}

.project-engagement.is-unavailable strong {
  color: var(--soft);
}

.project-qa {
  margin: 0 clamp(16px, 3vw, 28px) 12px;
  padding: clamp(18px, 2.8vw, 28px);
  border: 1px solid var(--line);
  border-radius: 11px;
  background:
    linear-gradient(135deg, rgba(157,70,255,.055), transparent 48%),
    rgba(255,255,255,.012);
}

.project-qa-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
}

.project-qa-heading h3 {
  margin: 4px 0 8px;
  font-size: 1.45rem;
}

.project-qa-heading p:not(.eyebrow) {
  max-width: 820px;
  margin: 0;
  color: var(--muted);
  line-height: 1.55;
}

.project-qa-heading > .button {
  flex: 0 0 auto;
}

.project-qa-tools {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(180px, 260px);
  gap: 10px;
  margin: 18px 0;
}

.project-qa-tools label,
.project-question-fields label,
.project-admin-login label,
.project-admin-controls label,
.project-admin-question label {
  display: grid;
  gap: 6px;
}

.project-qa-tools label > span,
.project-question-fields label > span,
.project-admin-login label > span,
.project-admin-controls label > span,
.project-admin-question label > span {
  color: #cfc1da;
  font-size: .78rem;
  font-weight: 700;
}

.project-qa-tools input,
.project-qa-tools select,
.project-question-fields input,
.project-question-fields select,
.project-question-fields textarea,
.project-admin-login input,
.project-admin-controls select,
.project-admin-question textarea {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #0b0711;
  color: #fff;
  font: inherit;
}

.project-qa-tools input,
.project-qa-tools select,
.project-question-fields input,
.project-question-fields select,
.project-admin-login input,
.project-admin-controls select {
  min-height: 43px;
  padding: 9px 11px;
}

.project-question-fields textarea,
.project-admin-question textarea {
  resize: vertical;
  padding: 11px;
  line-height: 1.5;
}

.project-qa-list {
  display: grid;
  gap: 10px;
}

.project-qa-empty {
  margin: 0;
  padding: 16px;
  border: 1px dashed var(--line);
  border-radius: 9px;
  color: var(--soft);
  text-align: center;
}

.project-question-card {
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: rgba(3, 2, 7, .38);
}

.project-question-card.is-pinned {
  border-color: rgba(189, 108, 255, .54);
  box-shadow: inset 3px 0 0 rgba(189, 108, 255, .65);
}

.project-question-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}

.project-question-badges {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 6px;
}

.project-question-badges span {
  padding: 5px 8px;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: #d9cae6;
  font-size: .7rem;
  font-weight: 700;
}

.project-question-text {
  margin: 12px 0;
  color: #fff;
  line-height: 1.55;
  white-space: pre-wrap;
}

.project-answer {
  padding: 13px 14px;
  border-left: 3px solid rgba(175, 80, 255, .75);
  border-radius: 0 8px 8px 0;
  background: rgba(158, 65, 255, .07);
}

.project-answer strong {
  color: #d69aff;
  font-size: .78rem;
}

.project-answer p {
  margin: 6px 0 0;
  color: #ded4e7;
  line-height: 1.55;
  white-space: pre-wrap;
}

.project-question-dialog {
  width: min(680px, calc(100% - 28px));
  max-height: calc(100vh - 28px);
  overflow: auto;
  padding: 0;
  border: 1px solid var(--line-strong);
  border-radius: 14px;
  background:
    radial-gradient(circle at 92% 0, rgba(157,70,255,.18), transparent 35%),
    #100b18;
  color: var(--text);
  box-shadow: 0 30px 100px rgba(0,0,0,.72);
}

.project-question-dialog::backdrop {
  background: rgba(3,2,7,.8);
  backdrop-filter: blur(5px);
}

.project-question-form {
  position: relative;
  padding: 28px;
}

.project-question-form h2 {
  margin: 5px 38px 10px 0;
}

.project-question-intro {
  color: var(--muted);
  line-height: 1.55;
}

.project-question-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin: 18px 0;
}

.project-question-wide {
  grid-column: 1 / -1;
}

.project-turnstile {
  min-height: 65px;
  margin: 8px 0 12px;
}

.project-question-status {
  min-height: 22px;
  margin: 8px 0 0;
  color: var(--soft);
}

.project-question-status[data-type="error"],
.project-admin-status[data-type="error"] {
  color: #ff8ba8;
}

.project-question-status[data-type="success"],
.project-admin-status[data-type="success"] {
  color: #8dffc2;
}


































.danger-button {
  border-color: rgba(255, 82, 118, .45) !important;
  color: #ff9db2 !important;
}



@media (max-width: 760px) {
  .project-qa-heading,
  .project-admin-header {
    flex-direction: column;
  }

  .project-qa-heading > .button {
    width: 100%;
  }

  .project-qa-tools,
  .project-question-fields,
  .project-admin-login,
  .project-admin-controls {
    grid-template-columns: 1fr;
  }

  .project-question-wide {
    grid-column: auto;
  }

  .project-question-card-head {
    align-items: flex-start;
    flex-direction: column;
  }

  .project-question-badges {
    justify-content: flex-start;
  }

  .project-question-form {
    padding: 22px 17px 18px;
  }
}



.project-engagement {
  position: relative;
  align-items: stretch;
  overflow: visible;
  row-gap: 10px;
}

.project-engagement > .compact-button {
  min-height: 44px;
  padding: 8px 12px;
  line-height: 1.25;
  white-space: normal;
}

.project-heart,
.project-download-stat {
  min-width: 0;
}

.project-heart span:last-child,
.project-download-stat span:last-child {
  white-space: nowrap;
}

.project-engagement.is-unavailable .project-heart,
.project-engagement.is-unavailable .project-download-stat {
  opacity: .62;
}

@media (max-width: 420px) {
  .project-engagement {
    grid-template-columns: 1fr;
  }

  .project-engagement > .button {
    grid-column: auto;
  }
}
.cat-signature{display:flex;justify-content:flex-end;padding:8px 10px 0}.cat-signature img{display:block;width:52px;max-width:12vw;height:auto;object-fit:contain;filter:drop-shadow(0 0 8px rgba(255,45,220,.22))}
.counter-subnav{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 22px;padding:10px;border:1px solid var(--border);border-radius:14px;background:rgba(16,10,28,.72)}.counter-subnav a{padding:10px 14px;border:1px solid var(--border);border-radius:10px;color:var(--text);font-weight:700;text-decoration:none}.counter-subnav a:hover{border-color:var(--purple);background:rgba(142,45,226,.16)}
body[data-page="counter-strike-personal"] .cs2-player-tools{display:none}
body[data-page="counter-strike-checker"] .page-content>*{display:none}body[data-page="counter-strike-checker"] .page-content>.page-title-row,body[data-page="counter-strike-checker"] .page-content>.counter-subnav,body[data-page="counter-strike-checker"] .page-content>.cs2-player-tools{display:block}
.project-jump-nav{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-bottom:22px}.project-jump-nav .project-overview-card{display:flex;flex-direction:column;min-height:100%;padding:0 0 18px;overflow:hidden}.project-overview-card>img{display:block;width:100%;height:220px;padding:14px;object-fit:contain;background:rgba(5,2,12,.82);border-bottom:1px solid var(--line)}.project-overview-card>strong,.project-overview-card>span:not(.project-overview-badges),.project-overview-card>b{margin-left:18px;margin-right:18px}.project-overview-card>strong{margin-top:14px;font-size:1.1rem}.project-overview-card>b{align-self:flex-start;margin-top:auto;padding-top:16px;color:#fff}.project-overview-badges{display:flex!important;flex-wrap:wrap;gap:6px;margin:14px 18px 0!important}.project-overview-badges em{padding:4px 8px;border:1px solid rgba(226,66,255,.55);border-radius:999px;color:#f5d7ff;font-size:.72rem;font-style:normal}.paws-preview{grid-template-columns:minmax(0,1.3fr) minmax(250px,360px);align-items:start}.paws-preview .wasd-media-copy ul{margin:18px 0;padding-left:20px;color:var(--muted);line-height:1.55}.paws-preview .wasd-media-copy li+li{margin-top:8px}.paws-preview .wasd-media-copy p:not(.eyebrow){margin-top:12px}.paws-preview .wasd-media-shell{min-height:0}.paws-preview .wasd-media-shell img{display:block;width:100%;max-width:310px;max-height:540px;object-fit:contain;border-radius:10px}@media(max-width:900px){.project-jump-nav{grid-template-columns:1fr}.project-overview-card>img{height:190px}.paws-preview{grid-template-columns:1fr}.paws-preview .wasd-media-shell img{max-height:480px}}
.project-jump-nav{grid-template-columns:repeat(3,minmax(0,1fr))!important}.project-jump-nav .project-overview-card>img{height:170px!important;max-height:170px!important;min-height:0!important}.project-jump-nav .project-overview-card{min-height:430px!important;max-height:430px!important}.project-overview-card>span:not(.project-overview-badges){display:-webkit-box!important;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.cat-signature img{width:56px!important;max-width:56px!important}@media(max-width:900px){.project-jump-nav{grid-template-columns:1fr!important}.project-jump-nav .project-overview-card{min-height:0!important;max-height:none!important}.project-jump-nav .project-overview-card>img{height:150px!important;max-height:150px!important}}


.project-jump-nav .project-overview-live{
  position:relative;
  display:block!important;
  width:100%;
  height:170px;
  min-height:170px;
  margin:0!important;
  overflow:hidden;
  border-bottom:1px solid var(--line);
  background:rgba(5,2,12,.82);
  -webkit-line-clamp:unset!important;
}
.project-jump-nav .project-overview-live iframe{
  display:block;
  width:100%;
  height:100%;
  border:0;
  pointer-events:none;
  background:#080510;
}
@media(max-width:900px){
  .project-jump-nav .project-overview-live{height:150px;min-height:150px}
}


body[data-page="projects"] .real-project{display:none}
body.project-catalogue-view .real-project{display:none}
.projects-made-note{display:flex;align-items:center;gap:14px;padding:12px 16px;border:1px solid var(--line);border-radius:10px;background:linear-gradient(90deg,rgba(157,70,255,.09),rgba(255,255,255,.018));color:var(--muted)}
.projects-made-note strong{flex:0 0 auto;color:#fff}
body.project-detail-view .project-jump-nav,body.project-detail-view .projects-made-note{display:none!important}
body.project-detail-view .real-project{display:none}
body.project-detail-view .real-project.is-active-project{display:block}
body[data-page="projects"] .real-project:target{display:block}
body[data-page="projects"]:has(.real-project:target) .real-project:not(:target){display:none}
body[data-page="projects"]:has(.real-project:target) .project-jump-nav,
body[data-page="projects"]:has(.real-project:target) .projects-made-note{display:none!important}
.project-detail-back{display:inline-flex;align-items:center;min-height:40px;margin-bottom:16px;padding:0 14px;border:1px solid var(--line);border-radius:8px;color:#fff;font-weight:700;text-decoration:none}
.project-detail-back:hover{border-color:var(--line-strong);background:rgba(157,70,255,.1)}
@media(max-width:700px){.projects-made-note{align-items:flex-start;flex-direction:column;gap:5px}}


.project-overview-card>.project-card-stats{display:flex!important;flex-wrap:wrap;gap:8px;margin:12px 18px 0!important;-webkit-line-clamp:unset!important;overflow:visible!important}
.project-card-stats>span{display:inline-flex!important;align-items:center;gap:4px;margin:0!important;padding:5px 8px;border:1px solid var(--line);border-radius:999px;color:var(--muted);font-size:.74rem;line-height:1}
.project-card-stats strong{color:#fff}
.project-overview-card>.project-card-author{display:block;margin:4px 18px 0;color:#dca6ff;font-size:.76rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase}
.project-overview-card>.project-card-open{display:inline-flex;align-items:center;justify-content:center;align-self:flex-start;min-height:38px;margin:16px 18px 0!important;padding:0 13px!important;border:1px solid rgba(197,91,255,.72);border-radius:8px;background:linear-gradient(135deg,rgba(154,48,232,.32),rgba(87,39,161,.22));box-shadow:0 0 18px rgba(174,49,255,.08);color:#fff!important;font-size:.86rem}
.project-overview-card:hover>.project-card-open{border-color:#d767ff;background:linear-gradient(135deg,rgba(176,54,255,.48),rgba(95,44,177,.32));box-shadow:0 0 22px rgba(174,49,255,.2)}
.paws-preview .wasd-media-shell iframe{display:block;width:100%;height:540px;border:0;border-radius:10px;background:#080510}
@media(max-width:900px){.paws-preview .wasd-media-shell iframe{height:480px}}


.project-overview-live-ticker,
.project-overview-live-popups {
  background:
    radial-gradient(circle at 50% 50%, rgba(143,53,234,.15), transparent 58%),
    #15111d;
}

.project-overview-live-popups iframe {
  background: transparent;
}

.ticker-project-preview {
  margin: 0 clamp(16px, 3vw, 28px) 18px;
  padding: clamp(18px, 2.5vw, 26px);
  border: 1px solid var(--line);
  border-radius: 12px;
  background:
    radial-gradient(circle at 88% 12%, rgba(143,53,234,.16), transparent 36%),
    rgba(255,255,255,.015);
}

.ticker-demo-stage {
  margin-top: 16px;
  overflow: hidden;
  border: 1px solid rgba(197,91,255,.42);
  border-radius: 12px;
  background: #25222b;
  box-shadow: inset 0 0 26px rgba(143,53,234,.12);
}

.ticker-demo-stage iframe {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
  background: transparent;
}

.ticker-demo-stage-short {
  height: 150px;
}

.ticker-demo-stage-popups {
  height: 360px;
}

.project-info-panel ol {
  margin: 0;
  padding-left: 22px;
  color: var(--muted);
  line-height: 1.65;
}

.project-info-panel li + li {
  margin-top: 5px;
}

.project-package-panel > div > p:not(.eyebrow) {
  max-width: 980px;
  color: var(--muted);
  line-height: 1.62;
}

@media(max-width:700px){
  .ticker-project-preview {
    margin-left: 12px;
    margin-right: 12px;
    padding: 15px;
  }

  .ticker-demo-stage-short {
    height: 126px;
  }

  .ticker-demo-stage-popups {
    height: 300px;
  }
}


.cs2-checker-head{align-items:center;padding:18px 20px}
.cs2-checker-head h2{margin:3px 0 0;font-size:1.35rem}
.checker-badges{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:7px}
.checker-badges span{padding:6px 9px;border:1px solid rgba(183,104,255,.42);border-radius:999px;background:rgba(157,70,255,.08);color:#e4d4f5;font-size:.72rem;font-weight:700}
.checker-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-bottom:22px}
.checker-steps>div{display:flex;align-items:flex-start;gap:11px;padding:14px;border:1px solid var(--line);border-radius:10px;background:linear-gradient(135deg,rgba(157,70,255,.07),rgba(255,255,255,.018))}
.checker-steps>div>strong{display:grid;flex:0 0 30px;width:30px;height:30px;place-items:center;border:1px solid rgba(189,115,255,.58);border-radius:50%;color:#fff;background:rgba(157,70,255,.16)}
.checker-steps span,.checker-steps b,.checker-steps small{display:block}
.checker-steps b{margin:1px 0 4px;color:#fff}
.checker-steps small{color:var(--soft);line-height:1.35}
.steam-check-input-row{padding:18px;border:1px solid rgba(167,84,255,.34);border-radius:11px;background:#090611}
.steam-check-help{display:block;margin-top:9px;color:var(--soft);line-height:1.45}
.cs2-group-head{display:flex;align-items:end;justify-content:space-between;gap:16px;margin-bottom:8px}
.cs2-group-head .eyebrow{margin:0}
.cs2-group-head small{color:var(--soft);font-size:.76rem;text-align:right}
@media(max-width:760px){.checker-steps{grid-template-columns:1fr}.cs2-checker-head,.cs2-group-head{align-items:flex-start;flex-direction:column}.checker-badges{justify-content:flex-start}.cs2-group-head small{text-align:left}}


.cs2-flex-slot{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 210px;align-items:center;min-height:280px;padding:26px;overflow:hidden;background:radial-gradient(circle at 88% 50%,rgba(166,64,255,.22),transparent 34%),linear-gradient(135deg,rgba(157,70,255,.105),rgba(255,255,255,.018) 56%,rgba(39,190,255,.055))}
.cs2-flex-slot::after{content:"";position:absolute;inset:14px;border:1px solid rgba(188,119,255,.12);border-radius:10px;pointer-events:none}
.cs2-flex-slot-copy{position:relative;z-index:2}
.cs2-flex-slot h2{margin:5px 0 10px;font-size:1.65rem}
.cs2-flex-slot p:not(.eyebrow){max-width:640px;margin:0;color:var(--muted);line-height:1.55}
.cs2-flex-slot>img{position:relative;z-index:1;display:block;width:190px;max-height:230px;justify-self:center;object-fit:contain;filter:drop-shadow(0 0 26px rgba(155,63,255,.38))}
.cs2-flex-slot-tags{display:flex;flex-wrap:wrap;gap:7px;margin:16px 0}
.cs2-flex-slot-tags span{padding:5px 8px;border:1px solid rgba(188,119,255,.42);border-radius:999px;color:#eadcff;font-size:.72rem;font-weight:700}
.cs2-flex-slot .button-row{justify-content:flex-start;margin-top:0}
@media(max-width:720px){.cs2-flex-slot{grid-template-columns:1fr;padding:22px;text-align:center}.cs2-flex-slot>img{grid-row:1;width:150px}.cs2-flex-slot-tags,.cs2-flex-slot .button-row{justify-content:center}}

body[data-page="counter-strike-personal"] .skin-yap-intro>p{margin:0 0 12px;color:var(--muted);line-height:1.5}
body[data-page="counter-strike-personal"] .skin-topic-row{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:15px}
body[data-page="counter-strike-personal"] .skin-topic-row span{padding:6px 9px;border:1px solid var(--line);border-radius:7px;color:#dcccf0;font-size:.78rem;font-weight:700}
body[data-page="counter-strike-personal"] .steam-action-row{margin-top:16px}


.cs2-identity-row>.column-stack{align-content:stretch}
.cs2-identity-row>.column-stack>.panel{height:100%}
.cs2-setup-row{align-items:stretch;margin-top:16px}
.cs2-setup-row>.panel{height:100%}



.cms-screenshot-section{margin-top:28px;padding:0;border:1px solid var(--border,#2c2041);border-radius:16px;background:var(--panel,#0d0917);overflow:hidden}.cms-screenshot-section .panel-head{padding:17px 19px;border-bottom:1px solid var(--border,#2c2041)}.cms-screenshot-section .panel-head h2{margin:0}.cms-screenshot-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px;padding:18px}.cms-screenshot-grid figure{margin:0;border:1px solid var(--border,#2c2041);border-radius:12px;overflow:hidden;background:#08050f}.cms-screenshot-grid img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover}.cms-screenshot-grid figcaption{display:grid;gap:5px;padding:12px 13px}.cms-screenshot-grid figcaption span{color:var(--muted,#ad9fc4);font-size:.92rem}







.language-flags{position:relative;z-index:70;display:inline-flex;align-items:center;gap:5px;padding:3px 5px;border:1px solid rgba(160,127,217,.25);border-radius:13px;background:rgba(13,10,24,.78);box-shadow:0 8px 24px rgba(0,0,0,.18);flex:0 0 auto;pointer-events:auto}
.language-flag{display:grid;place-items:center;width:36px;height:36px;cursor:pointer;pointer-events:auto;touch-action:manipulation;border-radius:10px;border:1px solid transparent;opacity:.68;transition:opacity .15s ease,transform .15s ease,border-color .15s ease,background .15s ease}
.language-flag:hover{opacity:1;transform:translateY(-1px);background:rgba(137,63,255,.12)}
.language-flag.active{opacity:1;border-color:#9d5cff;background:rgba(126,34,206,.22);box-shadow:0 0 0 1px rgba(157,92,255,.18),0 0 18px rgba(126,34,206,.25)}
.language-flag img{display:block;width:32px;height:32px;object-fit:contain;pointer-events:none}
.language-flags-fixed{position:fixed;z-index:50;top:16px;right:18px}
@media(max-width:760px){.language-flags{gap:2px;padding:2px 3px}.language-flag{width:30px;height:30px;border-radius:8px}.language-flag img{width:27px;height:27px}.topbar-actions .top-link{display:none}}


.stat-strip strong[data-profile-state]{font-size:clamp(.82rem,1.25vw,1.2rem);line-height:1.15;letter-spacing:-.015em;overflow:hidden;text-overflow:ellipsis}


.skin-yap-screenshot-mount:empty{display:none}
.skin-yap-screenshot-mount .cms-screenshot-section{margin-top:18px;border-radius:12px;background:rgba(8,5,15,.55)}
.skin-yap-screenshot-mount .cms-screenshot-section .panel-head{padding:12px 13px}
.skin-yap-screenshot-mount .cms-screenshot-section .panel-head h2{font-size:1rem}
.skin-yap-screenshot-mount .cms-screenshot-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;padding:12px}
.skin-yap-screenshot-mount .cms-screenshot-grid figure{border-radius:10px}
.skin-yap-screenshot-mount .cms-screenshot-grid figcaption{padding:9px 10px}
.cms-screenshot-grid a{display:block;position:relative}
.cms-screenshot-grid a:focus-visible{outline:2px solid #a855f7;outline-offset:2px}
.cms-screenshot-open-original{display:inline-flex;align-items:center;gap:5px;margin-top:4px;color:#c79cff;font-size:.78rem;font-weight:800;text-transform:uppercase;letter-spacing:.04em}
@media(max-width:520px){.skin-yap-screenshot-mount .cms-screenshot-grid{grid-template-columns:1fr}}


.steam-panel .panel-head h2{letter-spacing:.01em}
.skin-yap-gallery{border-color:rgba(168,85,247,.42)!important;background:linear-gradient(145deg,rgba(22,12,35,.96),rgba(8,5,15,.92))!important;box-shadow:0 18px 45px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.025)}
.skin-yap-gallery .panel-head{background:linear-gradient(90deg,rgba(126,34,206,.18),transparent);border-bottom-color:rgba(168,85,247,.24)!important}
.skin-yap-gallery .cms-screenshot-grid figure{transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease}
.skin-yap-gallery .cms-screenshot-grid figure:hover{transform:translateY(-2px);border-color:rgba(192,132,252,.55);box-shadow:0 15px 32px rgba(0,0,0,.28)}
.skin-yap-gallery .cms-screenshot-grid img{aspect-ratio:16/10}
.cms-screenshot-open-original{text-decoration:none}
.support-action strong{white-space:nowrap}
@media(max-width:520px){.support-action strong{white-space:normal}}



.project-engagement-error {
  grid-column: 1 / -1;
  display: block;
  margin: 0;
  padding: 7px 9px;
  border: 1px solid rgba(255, 104, 150, .32);
  border-radius: 8px;
  background: rgba(255, 62, 118, .07);
  color: #ffb5cf;
  font-size: .72rem;
  line-height: 1.35;
}


.language-flags{
  position:relative!important;
  z-index:10000!important;
  isolation:isolate;
  pointer-events:auto!important;
}
.language-flags .language-flag{
  position:relative;
  z-index:10001;
  pointer-events:auto!important;
  user-select:none;
  -webkit-user-drag:none;
}
.language-flags .language-flag img{pointer-events:none!important}



.site-screenshot-page-mount:empty,
.auto-screenshot-mount:empty,
.home-screenshot-mount:empty,
.cs2-screenshot-mount:empty { display: none; }

.site-screenshot-page-mount { min-width: 0; }
.auto-screenshot-mount { margin-top: 18px; }
.site-screenshot-gallery {
  margin-top: 0;
  border-color: rgba(168,85,247,.42) !important;
  background: linear-gradient(145deg,rgba(22,12,35,.96),rgba(8,5,15,.92)) !important;
  box-shadow: 0 18px 45px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.025);
}
.site-screenshot-gallery .panel-head {
  background: linear-gradient(90deg,rgba(126,34,206,.18),transparent);
  border-bottom-color: rgba(168,85,247,.24) !important;
}
.site-screenshot-gallery .cms-screenshot-grid figure {
  transition: transform .18s ease,border-color .18s ease,box-shadow .18s ease;
}
.site-screenshot-gallery .cms-screenshot-grid figure:hover {
  transform: translateY(-2px);
  border-color: rgba(192,132,252,.55);
  box-shadow: 0 15px 32px rgba(0,0,0,.28);
}
.site-screenshot-gallery .cms-screenshot-grid img { aspect-ratio: 16 / 10; }


.home-screenshot-mount { margin-top: 0; }
.home-screenshot-mount .cms-screenshot-grid { grid-template-columns: 1fr; }


.cs2-screenshot-mount { margin-top: 0; }
.cs2-screenshot-mount .cms-screenshot-section { border-radius: 14px; }
.cs2-screenshot-mount .cms-screenshot-grid { grid-template-columns: 1fr; }
.cs2-screenshot-mount .cms-screenshot-grid img { aspect-ratio: 16 / 9; }

@media (max-width: 760px) {
  .cms-screenshot-grid { grid-template-columns: 1fr; }
}


.seo-search-preview{display:grid;gap:5px;padding:16px 18px;border:1px solid #2f2343;border-radius:12px;background:#fff;color:#202124}.seo-preview-label{color:#746785;font-size:.78rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em}.seo-search-preview strong{color:#1a0dab;font:400 1.25rem/1.3 Arial,sans-serif}.seo-search-preview small{color:#188038;font:400 .88rem/1.35 Arial,sans-serif}.seo-search-preview p{margin:0;color:#4d5156;font:400 .9rem/1.45 Arial,sans-serif}














body[data-page="counter-strike-personal"] .cs2-identity-row{align-items:stretch}
body[data-page="counter-strike-personal"] .cs2-identity-row>.column-stack{display:block}
body[data-page="counter-strike-personal"] .cs2-identity-row>.column-stack>.panel{height:100%}
body[data-page="counter-strike-personal"]>.app-shell main.page-content>.cs2-screenshot-mount,
body[data-page="counter-strike-personal"] main.page-content>.cs2-screenshot-mount{width:100%;margin:18px 0 0}

.cms-screenshot-section{margin-top:18px}
.cms-screenshot-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.cms-screenshot-section.cms-shots-horizontal .cms-screenshot-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.cms-screenshot-section.cms-shots-square .cms-screenshot-grid{grid-template-columns:repeat(auto-fit,minmax(210px,1fr))}
.cms-screenshot-section.cms-shots-square .cms-screenshot-grid img{aspect-ratio:1/1}
.cms-screenshot-section.cms-shots-vertical .cms-screenshot-grid{grid-template-columns:1fr}
.cms-screenshot-section.cms-shots-vertical figure{display:grid;grid-template-columns:minmax(220px,38%) 1fr;align-items:stretch}
.cms-screenshot-section.cms-shots-vertical figure>a{min-height:190px}
.cms-screenshot-section.cms-shots-vertical img{height:100%;aspect-ratio:auto;object-fit:cover}
.cms-screenshot-section.cms-shots-featured .cms-screenshot-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.cms-screenshot-section.cms-shots-featured figure:first-child{grid-column:1/-1}
.cms-screenshot-section.cms-shots-featured figure:first-child img{aspect-ratio:21/9;max-height:620px}
.cms-screenshot-open-original{display:inline-flex;margin-top:5px;color:#c99cff;font-size:.78rem;font-weight:800;text-decoration:none}
@media(max-width:900px){.cms-screenshot-grid,.cms-screenshot-section.cms-shots-horizontal .cms-screenshot-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){.cms-screenshot-grid,.cms-screenshot-section.cms-shots-horizontal .cms-screenshot-grid,.cms-screenshot-section.cms-shots-featured .cms-screenshot-grid{grid-template-columns:1fr}.cms-screenshot-section.cms-shots-vertical figure{grid-template-columns:1fr}.cms-screenshot-section.cms-shots-featured figure:first-child{grid-column:auto}.cms-screenshot-section.cms-shots-featured figure:first-child img{aspect-ratio:16/9}}


































.cms-translation-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.cms-language-card{display:grid;grid-template-columns:1fr;gap:11px;margin:0;padding:15px;border:1px solid #34264b;border-radius:12px;background:#0c0814;min-width:0}
.cms-language-card legend{padding:0 8px;color:#d8b4fe;font-weight:900}
.cms-language-card label{min-width:0}.cms-language-card label.wide{grid-column:auto}
@media(max-width:820px){.cms-translation-grid{grid-template-columns:1fr}}


.seo-audit-box{margin-top:18px;padding:16px;border:1px solid #2d2142;border-radius:13px;background:#090610}
.seo-audit-head{display:flex;justify-content:space-between;gap:15px;align-items:flex-start}.seo-audit-head h3{margin:0 0 4px}.seo-audit-head p{margin:0;color:#a99bbd}
.seo-audit-summary{display:flex;justify-content:space-between;gap:15px;margin-top:14px;padding:12px;border-radius:9px;background:#100a1c}.seo-audit-summary span{color:#d8b4fe}
.seo-audit-list{display:grid;gap:8px;margin-top:10px}.seo-audit-list article{display:grid;grid-template-columns:minmax(170px,.7fr) 1.5fr minmax(180px,.8fr);gap:12px;padding:10px;border:1px solid #2d2142;border-radius:9px}.seo-audit-list article span{color:#ffb4c3}.seo-audit-list article small{color:#8f80a8;overflow-wrap:anywhere}
@media(max-width:760px){.seo-audit-head,.seo-audit-summary{flex-direction:column}.seo-audit-list article{grid-template-columns:1fr}}


.cms-dynamic-page-content{display:grid;gap:18px}
.cms-dynamic-body{white-space:pre-line;line-height:1.7;color:var(--muted)}
.cms-dynamic-body p{margin:0 0 1rem}

































































.cms-screenshot-grid figure{position:relative}
.cms-screenshot-edit-tools{position:absolute;z-index:25;top:8px;right:8px;display:flex;gap:6px;padding:5px;border:1px solid rgba(205,159,255,.6);border-radius:8px;background:rgba(7,4,12,.92);box-shadow:0 8px 24px rgba(0,0,0,.35)}
.cms-screenshot-edit-tools button{min-height:30px;padding:0 9px;border:1px solid #4b3670;border-radius:6px;background:#160d23;color:#f0e4ff;font:800 11px/1 system-ui,sans-serif;cursor:pointer}
.cms-screenshot-edit-tools .cms-screenshot-delete{border-color:#7f263b;background:#2a0c15;color:#ffb4c2}
.cms-screenshot-edit-tools button:hover{filter:brightness(1.18)}
.cms-screenshot-dragging{opacity:.4}
.cms-screenshot-drop-target{box-shadow:0 0 0 4px #b866ff!important}




.cms-screenshot-section.cms-shots-horizontal .cms-screenshot-grid img{aspect-ratio:16/9;height:auto;object-fit:cover}
.cms-screenshot-section.cms-shots-vertical .cms-screenshot-grid{grid-template-columns:repeat(auto-fit,minmax(190px,280px));justify-content:center}
.cms-screenshot-section.cms-shots-vertical figure{display:block;max-width:280px;width:100%}
.cms-screenshot-section.cms-shots-vertical figure>a{min-height:0}
.cms-screenshot-section.cms-shots-vertical img{width:100%;height:auto;aspect-ratio:9/16;object-fit:cover}
@media(max-width:620px){.cms-screenshot-section.cms-shots-vertical .cms-screenshot-grid{grid-template-columns:1fr}.cms-screenshot-section.cms-shots-vertical figure{max-width:none}}



.cms-screenshot-section .cms-screenshot-grid{
  grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));
}
.cms-screenshot-section.cms-shots-horizontal .cms-screenshot-grid{
  grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));
}
.cms-screenshot-section.cms-shots-horizontal .cms-screenshot-grid figure:only-child,
.cms-screenshot-section.cms-shots-natural .cms-screenshot-grid figure:only-child,
.cms-screenshot-section.cms-shots-featured .cms-screenshot-grid figure:only-child{
  grid-column:1/-1;
}
.cms-screenshot-section.cms-shots-horizontal .cms-screenshot-grid img{
  width:100%;aspect-ratio:16/9;height:auto;object-fit:cover;
}
.cms-screenshot-section.cms-shots-vertical .cms-screenshot-grid{
  grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),280px));
  justify-content:center;
}
.cms-screenshot-section.cms-shots-vertical .cms-screenshot-grid figure{
  width:100%;max-width:280px;display:block;
}
.cms-screenshot-section.cms-shots-vertical .cms-screenshot-grid img{
  width:100%;aspect-ratio:9/16;height:auto;object-fit:cover;
}
.cms-screenshot-section.cms-shots-square .cms-screenshot-grid{
  grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));
}
.cms-screenshot-section.cms-shots-square .cms-screenshot-grid img{aspect-ratio:1/1;object-fit:cover}
.cms-screenshot-section.cms-shots-natural .cms-screenshot-grid{
  grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));
}
.cms-screenshot-section.cms-shots-natural .cms-screenshot-grid a{
  display:grid;place-items:center;background:#050308;
}
.cms-screenshot-section.cms-shots-natural .cms-screenshot-grid img{
  width:100%;height:auto;max-height:72vh;aspect-ratio:auto;object-fit:contain;background:#050308;
}
.cms-screenshot-section.cms-shots-featured .cms-screenshot-grid{
  grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));
}
.cms-screenshot-section.cms-shots-featured .cms-screenshot-grid figure:first-child{grid-column:1/-1}
.cms-screenshot-section.cms-shots-featured .cms-screenshot-grid figure:first-child img{width:100%;aspect-ratio:21/9;max-height:620px;object-fit:cover}
.cms-screenshot-grid figure,.cms-screenshot-grid figcaption{min-width:0}
.cms-screenshot-grid figcaption strong,.cms-screenshot-grid figcaption span,.cms-screenshot-open-original{
  overflow-wrap:break-word;word-break:normal;hyphens:auto;
}
.cms-screenshot-grid figure:only-child figcaption{max-width:none}


.cms-screenshot-layout-toolbar{
  position:relative;z-index:40;display:grid;grid-template-columns:minmax(190px,1fr) minmax(170px,230px) minmax(170px,230px);gap:10px;
  align-items:end;padding:12px 14px;border-bottom:1px solid rgba(188,126,255,.45);
  background:linear-gradient(135deg,rgba(70,24,111,.98),rgba(13,8,22,.98));box-shadow:0 8px 24px rgba(0,0,0,.25);
  color:#f4eaff;font:700 12px/1.35 system-ui,sans-serif;cursor:default;
}
.cms-shot-toolbar-title strong,.cms-shot-toolbar-title small{display:block}
.cms-shot-toolbar-title strong{color:#fff;letter-spacing:.05em}
.cms-shot-toolbar-title small{margin-top:3px;color:#c8b5df;font-weight:500}
.cms-screenshot-layout-toolbar label{display:grid;gap:5px;color:#d8c9eb}
.cms-screenshot-layout-toolbar select{
  width:100%;min-height:36px;padding:7px 9px;border:1px solid #7652a2;border-radius:8px;background:#0a0611;color:#fff;font:700 12px/1.2 system-ui,sans-serif;
}
.cms-shot-toolbar-actions{grid-column:1/-1;display:flex;gap:7px;flex-wrap:wrap}
.cms-shot-toolbar-actions button{
  min-height:34px;padding:7px 10px;border:1px solid #75509f;border-radius:8px;background:#160d22;color:#f2e7ff;font:800 11px/1.15 system-ui,sans-serif;cursor:pointer;
}
.cms-shot-toolbar-actions button:hover{border-color:#c47aff;background:#28133f}
.cms-shot-toolbar-actions button.danger{margin-left:auto;border-color:#8c2d45;background:#2a0c15;color:#ffb9c6}


@media(max-width:760px){
  .cms-screenshot-layout-toolbar{grid-template-columns:1fr}
  .cms-shot-toolbar-actions{grid-column:auto}
  .cms-shot-toolbar-actions button.danger{margin-left:0}
}
























@media(max-width:720px){
  
  
  
}
@media(max-width:780px){
  
  
}

































.cms-selected-frame-controls{display:grid;gap:10px;padding:12px;border:1px solid #472d68;border-radius:10px;background:#0d0816}.cms-frame-readout{color:#d8c9eb;font-weight:800}.cms-frame-preset-row{display:grid;grid-template-columns:repeat(4,1fr);gap:7px}.cms-frame-preset-row button{min-height:40px;border:1px solid #543477;border-radius:8px;background:#160c24;color:#fff;font:900 14px/1 system-ui;cursor:pointer}.cms-frame-preset-row button:hover{border-color:#c06cff;background:#251139}










.cms-freeform-controls,.cms-screenshot-layout-toolbar{display:none!important}














.cms-screenshot-section.cms-shots-horizontal .cms-screenshot-grid{grid-template-columns:repeat(auto-fit,minmax(min(230px,100%),1fr))!important}
.cms-screenshot-section.cms-shots-vertical .cms-screenshot-grid{grid-template-columns:1fr!important}.cms-screenshot-section.cms-shots-vertical figure{display:block!important;max-width:none!important}.cms-screenshot-section.cms-shots-vertical figure>a{min-height:0!important}.cms-screenshot-section.cms-shots-vertical img{width:100%!important;height:auto!important;aspect-ratio:16/9!important;object-fit:contain!important;background:#050309}
.cms-screenshot-section.cms-shots-horizontal img,.cms-builder-grid.cms-freeform-grid .cms-screenshot-grid img{width:100%;height:auto;aspect-ratio:16/9;object-fit:contain;background:#050309}
.cms-screenshot-edit-tools{padding:3px!important}.cms-screenshot-edit-tools button{width:30px;min-width:30px;padding:0!important;font-size:17px!important}


.live-panel.is-live .live-visual{background-size:cover}.live-panel.is-offline .live-visual{background-size:cover}
















@media(max-width:760px){
  
  
}




















.cms-screenshot-section{container-type:inline-size}
.cms-screenshot-section .cms-screenshot-grid,
.home-screenshot-mount .cms-screenshot-grid,
.site-screenshot-gallery .cms-screenshot-grid{
  display:grid!important;
  grid-template-columns:repeat(12,minmax(0,1fr))!important;
  grid-auto-flow:row dense!important;
  gap:16px!important;
  align-items:stretch!important;
}
.cms-screenshot-grid>figure{
  grid-column:span var(--cms-shot-span,4)!important;
  min-width:0!important;
  width:auto!important;
  max-width:none!important;
  margin:0!important;
  overflow:hidden!important;
  display:flex!important;
  flex-direction:column!important;
  align-self:stretch!important;
}
.cms-screenshot-grid>figure>a:first-child{
  display:grid!important;
  place-items:center!important;
  width:100%!important;
  height:var(--cms-shot-height,220px)!important;
  min-height:100px!important;
  overflow:hidden!important;
  background:#050308!important;
}
.cms-screenshot-grid>figure>a:first-child>img{
  display:block!important;
  width:100%!important;
  height:100%!important;
  max-height:none!important;
  aspect-ratio:auto!important;
  object-fit:var(--cms-shot-fit,contain)!important;
  object-position:center!important;
  background:#050308!important;
}
.cms-screenshot-grid>figure>figcaption{flex:1 1 auto!important;min-width:0!important}
.cms-screenshot-section.cms-shots-vertical .cms-screenshot-grid>figure{grid-column:1/-1!important}
.cms-screenshot-section.cms-shots-vertical .cms-screenshot-grid>figure>a:first-child>img{object-fit:var(--cms-shot-fit,contain)!important}
.cms-screenshot-section.cms-shots-portrait .cms-screenshot-grid>figure>a:first-child{aspect-ratio:9/16!important;height:auto!important;min-height:280px!important;max-height:720px!important}
.cms-screenshot-section.cms-shots-portrait .cms-screenshot-grid>figure>a:first-child>img{object-fit:var(--cms-shot-fit,contain)!important}
.cms-screenshot-section.cms-shots-square .cms-screenshot-grid>figure>a:first-child{aspect-ratio:1/1!important;height:auto!important}
.cms-screenshot-section.cms-shots-natural .cms-screenshot-grid>figure>a:first-child{height:auto!important;min-height:120px!important}
.cms-screenshot-section.cms-shots-natural .cms-screenshot-grid>figure>a:first-child>img{height:auto!important;max-height:720px!important;object-fit:contain!important}
.cms-screenshot-section.cms-shots-featured .cms-screenshot-grid>figure:first-child{grid-column:1/-1!important}
.cms-screenshot-section.cms-shots-featured .cms-screenshot-grid>figure:first-child>a:first-child{min-height:340px!important}
@media(max-width:760px){.cms-screenshot-grid>figure{grid-column:1/-1!important}}



.cms-screenshot-edit-tools{top:7px!important;left:7px!important;right:auto!important;z-index:11020!important;padding:4px!important}
.cms-screenshot-edit-tools button{width:32px!important;height:32px!important;min-height:32px!important;padding:0!important;font-size:16px!important}
.cms-shot-size-readout{position:absolute;z-index:11010;right:8px;top:8px;padding:4px 7px;border:1px solid #8c55b8;border-radius:7px;background:rgba(10,5,16,.9);color:#f1e6ff;font:800 10px/1 system-ui;pointer-events:none}
.cms-shot-resize-handle{position:absolute;z-index:11030;width:13px;height:13px;border:2px solid #fff;border-radius:2px;background:#a83cff;box-shadow:0 0 0 2px #451263;touch-action:none}
.cms-shot-resize-handle[data-shot-resize="n"]{left:50%;top:-7px;transform:translateX(-50%);cursor:ns-resize}
.cms-shot-resize-handle[data-shot-resize="s"]{left:50%;bottom:-7px;transform:translateX(-50%);cursor:ns-resize}
.cms-shot-resize-handle[data-shot-resize="e"]{right:-7px;top:50%;transform:translateY(-50%);cursor:ew-resize}
.cms-shot-resize-handle[data-shot-resize="w"]{left:-7px;top:50%;transform:translateY(-50%);cursor:ew-resize}
.cms-shot-resize-handle[data-shot-resize="ne"]{right:-7px;top:-7px;cursor:nesw-resize}
.cms-shot-resize-handle[data-shot-resize="se"]{right:-7px;bottom:-7px;cursor:nwse-resize}
.cms-shot-resize-handle[data-shot-resize="sw"]{left:-7px;bottom:-7px;cursor:nesw-resize}
.cms-shot-resize-handle[data-shot-resize="nw"]{left:-7px;top:-7px;cursor:nwse-resize}
.cms-add-screenshot-button{margin-left:auto;width:34px;height:34px;border:1px solid #9a5fc7;border-radius:8px;background:#2b123e;color:#fff;font:900 22px/1 system-ui;cursor:pointer}
.cms-add-screenshot-button:hover{background:#481b68}


.cms-custom-block-body{display:grid;gap:14px;align-content:start}
.cms-custom-block-body>img{display:block;width:100%;height:100%;min-height:160px;object-fit:contain;border-radius:10px;background:#050308}














.template-original i:nth-child(1){grid-column:1/6;grid-row:1/3}.template-original i:nth-child(2){grid-column:6/13;grid-row:1/3}.template-original i:nth-child(3){grid-column:1/5;grid-row:3/7}.template-original i:nth-child(4){grid-column:5/9;grid-row:3/5}.template-original i:nth-child(5){grid-column:9/13;grid-row:3/5}.template-original i:nth-child(6){grid-column:5/13;grid-row:5/7}
.template-balanced i:nth-child(1){grid-column:1/6;grid-row:1/3}.template-balanced i:nth-child(2){grid-column:6/13;grid-row:1/3}.template-balanced i:nth-child(3){grid-column:1/7;grid-row:3/7}.template-balanced i:nth-child(4){grid-column:7/13;grid-row:3/7}
.template-media i:nth-child(1){grid-column:1/6;grid-row:1/3}.template-media i:nth-child(2){grid-column:6/13;grid-row:1/3}.template-media i:nth-child(3){grid-column:1/13;grid-row:3/5;background:#c468ff!important}.template-media i:nth-child(4){grid-column:1/13;grid-row:5/7}
.template-compact i:nth-child(1){grid-column:1/5;grid-row:1/3}.template-compact i:nth-child(2){grid-column:5/13;grid-row:1/3}.template-compact i:nth-child(3){grid-column:1/5;grid-row:3/7}.template-compact i:nth-child(4){grid-column:5/9;grid-row:3/7}.template-compact i:nth-child(5){grid-column:9/13;grid-row:3/7}





































.cms-direct-drag-surface{cursor:grab!important;user-select:none!important;touch-action:none!important}
.cms-direct-drag-surface:active{cursor:grabbing!important}














.cms-screenshot-visual-toolbar{display:flex!important;align-items:center!important;gap:5px!important;margin-left:auto!important;position:relative!important;z-index:10070!important}
.cms-screenshot-visual-toolbar button{display:grid!important;place-items:center!important;width:30px!important;height:30px!important;min-width:30px!important;padding:0!important;border:1px solid #654284!important;border-radius:7px!important;background:#12091d!important;color:#eadcff!important;font:900 15px/1 system-ui!important;cursor:pointer!important}
.cms-screenshot-visual-toolbar button:hover,.cms-screenshot-visual-toolbar button.active{border-color:#d28dff!important;background:#7928b8!important;color:#fff!important}
.cms-screenshot-visual-toolbar .cms-shot-toolbar-add{font-size:20px!important;background:#35104f!important}


.cms-screenshot-grid>figure{grid-column:span var(--cms-shot-effective-span,var(--cms-shot-span,4))!important}
.cms-screenshot-grid>figure>a:first-child>img{object-fit:var(--cms-shot-fit,contain)!important}





.live-panel.is-offline .live-visual{background-size:cover!important;background-position:center!important}
.live-panel.is-live .live-visual{background-size:cover!important;background-position:center!important}



.cms-admin-builder-panel,.site-admin-panel{background:linear-gradient(180deg,rgba(18,11,28,.98),rgba(8,5,14,.98));border:1px solid rgba(183,101,255,.25);box-shadow:0 22px 70px rgba(0,0,0,.35)}







.cms-translation-grid fieldset{border:1px solid rgba(183,101,255,.24)!important;border-radius:14px!important;background:linear-gradient(180deg,rgba(27,15,40,.9),rgba(10,6,16,.9))!important;padding:15px!important}


















@media(max-width:760px){
  
  
}


.seo-helper-card{grid-column:1/-1;display:grid;gap:14px;padding:16px;border:1px solid rgba(190,116,255,.32);border-radius:15px;background:linear-gradient(145deg,rgba(42,20,60,.78),rgba(11,7,18,.94));box-shadow:0 16px 44px rgba(0,0,0,.22)}
.seo-helper-top{display:grid;grid-template-columns:minmax(220px,1fr) auto;gap:10px;align-items:end}
.seo-helper-score{display:flex;align-items:center;gap:14px;padding:13px;border:1px solid rgba(190,116,255,.2);border-radius:12px;background:rgba(7,4,12,.52)}
.seo-helper-score strong{display:grid;place-items:center;width:66px;height:66px;border-radius:50%;background:conic-gradient(#a855f7 calc(var(--seo-score,0)*1%),#21152f 0);font-size:1.15rem;box-shadow:inset 0 0 0 7px #0b0712}
.seo-helper-results{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.seo-helper-check{display:flex;gap:9px;align-items:flex-start;padding:10px 11px;border:1px solid rgba(190,116,255,.18);border-radius:10px;background:rgba(8,5,14,.52)}
.seo-helper-check[data-ok="true"]{border-color:rgba(68,226,169,.34)}
.seo-helper-check[data-ok="false"]{border-color:rgba(255,112,145,.36)}
.seo-helper-files{display:flex;gap:9px;flex-wrap:wrap}
@media(max-width:760px){.seo-helper-top,.seo-helper-results{grid-template-columns:1fr}}


















@media(max-width:760px){
  
  
}



.app-sidebar .sidebar-nav a > span {
  font-family: "Scratchmeow5", "Rajdhani", "Arial Narrow", Arial, sans-serif !important;
  font-size: 20px !important;
  line-height: 1.08;
  letter-spacing: 0 !important;
}


@media (min-width: 901px) {
  :root {
    --sidebar: clamp(292px, 15vw, 310px);
  }

  .app-sidebar {
    width: var(--sidebar);
  }

  .app-shell {
    width: calc(100% - var(--sidebar));
    max-width: none;
    margin-left: var(--sidebar);
  }

  .page-content,
  .page-footer {
    width: calc(100% - clamp(28px, 2.4vw, 52px));
    max-width: none;
    margin-left: auto;
    margin-right: auto;
  }

  .app-sidebar .brand strong {
    font-size: 2rem;
  }

  .app-sidebar .sidebar-nav a {
    min-height: 54px;
    gap: 11px;
    padding-inline: 14px;
    font-size: 24px;
  }

  .app-sidebar .sidebar-nav a span {
    min-width: 0;
    max-width: 100%;
    white-space: nowrap;
    overflow: visible;
  }

  .app-sidebar .sidebar-nav a svg {
    width: 19px;
    height: 19px;
  }
}

@media (max-width: 900px) {
  .app-sidebar {
    width: min(310px, calc(100vw - 20px));
  }

  .app-sidebar .brand strong {
    font-size: 1.85rem;
  }

  .app-sidebar .sidebar-nav a {
    min-height: 52px;
    font-size: 22px;
  }
}


@media (min-width: 901px) {
  .app-sidebar .sidebar-nav a > span { font-size: 24px !important; }
}
@media (max-width: 900px) {
  .app-sidebar .sidebar-nav a > span { font-size: 22px !important; }
}


@media (min-width: 901px) {
  :root {
    --sidebar: clamp(330px, 18vw, 350px);
  }

  .app-sidebar .brand {
    min-height: 82px;
    padding-inline: 20px;
  }

  .app-sidebar .brand strong {
    font-family: "Scratchmeow5", "Rajdhani", "Arial Narrow", Arial, sans-serif !important;
    font-size: 2.35rem !important;
    line-height: 1 !important;
  }

  .app-sidebar .sidebar-nav {
    gap: 8px;
    padding: 20px 14px;
  }

  .app-sidebar .sidebar-nav a {
    min-height: 62px;
    gap: 12px;
    padding-inline: 15px;
  }

  .app-sidebar .sidebar-nav a > span {
    font-family: "Scratchmeow5", "Rajdhani", "Arial Narrow", Arial, sans-serif !important;
    font-size: clamp(28px, 1.65vw, 32px) !important;
    line-height: 1.02 !important;
    letter-spacing: 0 !important;
    white-space: nowrap;
    overflow: visible;
  }

  .app-sidebar .sidebar-nav a svg {
    width: 21px;
    height: 21px;
  }
}

@media (max-width: 900px) {
  .app-sidebar {
    width: min(340px, calc(100vw - 18px));
  }

  .app-sidebar .brand strong {
    font-size: 2.1rem !important;
  }

  .app-sidebar .sidebar-nav a {
    min-height: 58px;
    gap: 11px;
  }

  .app-sidebar .sidebar-nav a > span {
    font-family: "Scratchmeow5", "Rajdhani", "Arial Narrow", Arial, sans-serif !important;
    font-size: 22px !important;
    line-height: 1.02 !important;
    letter-spacing: 0 !important;
  }
}



:root {
  --sidebar-font-desktop: 24px;
  --sidebar-font-mobile: 22px;
  --sidebar-width-desktop: 300px;
  --sidebar-width-mobile: 290px;
  --sidebar-brand-desktop: 30px;
  --sidebar-brand-mobile: 28px;
}

@media (min-width: 901px) {
  :root {
    --sidebar: min(var(--sidebar-width-desktop), calc(100vw - 520px));
  }

  .app-sidebar .brand strong {
    font-family: "Scratchmeow5", "Rajdhani", "Arial Narrow", Arial, sans-serif !important;
    font-size: var(--sidebar-brand-desktop) !important;
    line-height: 1 !important;
  }

  .app-sidebar .sidebar-nav a {
    min-height: max(68px, calc(var(--sidebar-font-desktop) + 30px));
    height: auto;
    padding-block: 12px;
  }

  .app-sidebar .sidebar-nav a > span {
    flex: 1 1 auto;
    min-width: 0;
    font-family: "Scratchmeow5", "Rajdhani", "Arial Narrow", Arial, sans-serif !important;
    font-size: var(--sidebar-font-desktop) !important;
    line-height: 1.04 !important;
    letter-spacing: 0 !important;
    white-space: normal !important;
    overflow-wrap: normal;
    word-break: normal;
  }
}

@media (max-width: 900px) {
  .app-sidebar {
    width: min(var(--sidebar-width-mobile), calc(100vw - 18px));
  }

  .app-sidebar .brand strong {
    font-family: "Scratchmeow5", "Rajdhani", "Arial Narrow", Arial, sans-serif !important;
    font-size: var(--sidebar-brand-mobile) !important;
    line-height: 1 !important;
  }

  .app-sidebar .sidebar-nav a {
    min-height: max(64px, calc(var(--sidebar-font-mobile) + 28px));
    height: auto;
    padding-block: 11px;
  }

  .app-sidebar .sidebar-nav a > span {
    flex: 1 1 auto;
    min-width: 0;
    font-family: "Scratchmeow5", "Rajdhani", "Arial Narrow", Arial, sans-serif !important;
    font-size: var(--sidebar-font-mobile) !important;
    line-height: 1.04 !important;
    letter-spacing: 0 !important;
    white-space: normal !important;
    overflow-wrap: normal;
    word-break: normal;
  }
}

.site-design-controls {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 15px;
  grid-column: 1 / -1;
}
.site-design-control {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 74px;
  align-items: center;
  gap: 12px;
}
.site-design-control input[type="range"] {
  padding: 0;
  accent-color: #a855f7;
}
.site-design-control output {
  display: grid;
  min-height: 42px;
  place-items: center;
  border: 1px solid #3a2a53;
  border-radius: 10px;
  background: #0b0712;
  color: #fff;
  font-weight: 800;
}
.site-design-preview {
  grid-column: 1 / -1;
  display: grid;
  gap: 12px;
  padding: 18px;
  overflow: auto;
  border: 1px solid rgba(183,101,255,.3);
  border-radius: 14px;
  background: radial-gradient(circle at top left, rgba(126,34,206,.16), transparent 42%), #06040b;
}
.site-design-preview > small { color: #ad9fc4; }
.site-design-preview-sidebar {
  width: min(var(--preview-sidebar-width, 420px), 100%);
  padding: 14px;
  border: 1px solid rgba(202,174,255,.2);
  border-radius: 14px;
  background: linear-gradient(180deg, rgba(14,9,25,.98), rgba(7,4,13,.98));
}
.site-design-preview-brand {
  margin-bottom: 12px;
  padding: 12px 14px;
  font-family: "Scratchmeow5", "Rajdhani", "Arial Narrow", Arial, sans-serif;
  font-size: var(--preview-brand-size, 48px);
  line-height: 1;
  color: #fff;
}
.site-design-preview-link {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: max(68px, calc(var(--preview-font-size, 40px) + 30px));
  margin-top: 7px;
  padding: 10px 14px;
  border: 1px solid rgba(199,135,255,.35);
  border-radius: 10px;
  background: linear-gradient(90deg, rgba(136,45,255,.25), rgba(113,23,218,.08));
}
.site-design-preview-link i {
  width: 22px;
  flex: 0 0 auto;
  color: #b978ff;
  font: 700 20px/1 Arial, sans-serif;
  text-align: center;
}
.site-design-preview-link img {
  width: 26px;
  height: 26px;
  flex: 0 0 auto;
  object-fit: contain;
}
.site-design-preview-link span {
  min-width: 0;
  font-family: "Scratchmeow5", "Rajdhani", "Arial Narrow", Arial, sans-serif;
  font-size: var(--preview-font-size, 40px);
  line-height: 1.04;
  color: #fff;
  white-space: normal;
}
@media (max-width: 760px) {
  .site-design-controls { grid-template-columns: 1fr; }
}



:root {
  --sidebar-font-family: "Scratchmeow5", "Rajdhani", "Arial Narrow", Arial, sans-serif;
  --main-font-family: "Rajdhani", "Arial Narrow", Arial, sans-serif;
  --font: var(--main-font-family);
}



.app-sidebar .brand strong,
.app-sidebar .sidebar-nav a > span {
  font-family: var(--sidebar-font-family) !important;
  font-synthesis: none;
}

.site-font-admin-head {
  display: flex;
  grid-column: 1 / -1;
  justify-content: space-between;
  gap: 18px;
  align-items: flex-start;
  margin: 28px 0 14px;
  padding-top: 24px;
  border-top: 1px solid #2d2142;
}
.site-font-admin-head h3 { margin: 0 0 6px; font-size: 1.25rem; }
.site-font-admin-head p { max-width: 780px; margin: 0; color: #ad9fc4; }
.site-font-media-state {
  flex: 0 0 auto;
  padding: 8px 10px;
  border: 1px solid #5a3a25;
  border-radius: 999px;
  background: #1b120a;
  color: #ffd49a;
  font-size: .82rem;
  font-weight: 800;
}
.site-font-media-state[data-ready="true"] {
  border-color: #24614d;
  background: #091a14;
  color: #79f3c1;
}
.site-font-admin-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}
.site-font-form { align-content: start; }
.site-font-form-title {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  align-items: flex-start;
}
.site-font-form-title > div:first-child { min-width: 0; }
.site-font-form-title > div:first-child strong { display: block; color: #fff; font-size: 1.08rem; }
.site-font-form-title > div:first-child small { display: block; margin-top: 5px; color: #a99aba; }
.site-font-current {
  flex: 0 1 280px;
  min-width: 210px;
  padding: 11px 13px;
  border: 1px solid #4a3267;
  border-radius: 11px;
  background: #0d0817;
}
.site-font-current span,
.site-font-current strong,
.site-font-current small { display: block; }
.site-font-current span { color: #a78bfa; font-size: .72rem; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.site-font-current strong { margin-top: 4px; color: #fff; overflow-wrap: anywhere; }
.site-font-current small { margin-top: 3px; color: #9283a8; overflow-wrap: anywhere; }
.site-font-sample {
  min-height: 122px;
  padding: 16px;
  border: 1px solid rgba(187,112,255,.34);
  border-radius: 12px;
  background: radial-gradient(circle at top right, rgba(137,57,255,.17), transparent 48%), #08050f;
}
.site-font-sample > span { display: block; margin-bottom: 10px; color: #a78bfa; font: 800 .75rem/1 var(--font); letter-spacing: .08em; text-transform: uppercase; }
.site-font-sample > strong { display: block; color: #fff; overflow-wrap: anywhere; }
.site-font-sample p { margin: 8px 0 0; color: #b9acd0; }
.site-font-sample-sidebar > strong {
  font-family: var(--admin-sidebar-font-family, "Scratchmeow5", "Rajdhani", Arial, sans-serif);
  font-size: 28px;
  line-height: 1.12;
  font-weight: 400;
}
.site-font-sample-main > strong,
.site-font-sample-main > p {
  font-family: var(--admin-main-font-family, "Rajdhani", "Arial Narrow", Arial, sans-serif);
}
.site-font-sample-main > strong { font-size: 1.45rem; }

@media (max-width: 980px) {
  .site-font-admin-grid { grid-template-columns: 1fr; }
}
@media (max-width: 620px) {
  .site-font-admin-head,
  .site-font-form-title { flex-direction: column; }
  .site-font-current { width: 100%; min-width: 0; }
}


.site-design-preview-heading {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 16px;
}
.site-design-preview-heading strong,
.site-design-preview-heading small { display: block; }
.site-design-preview-heading strong { color: #fff; font-size: 1rem; }
.site-design-preview-heading small { margin-top: 4px; color: #ad9fc4; }
.site-design-preview-heading > span {
  flex: 0 0 auto;
  padding: 7px 10px;
  border: 1px solid rgba(168,85,247,.35);
  border-radius: 999px;
  color: #c9a7ff;
  font-size: .78rem;
  font-weight: 800;
}
.site-design-preview-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(360px, .85fr);
  gap: 18px;
  align-items: start;
}
.site-design-preview-card {
  min-width: 0;
  overflow: hidden;
  border: 1px solid rgba(202,174,255,.18);
  border-radius: 14px;
  background: #07050d;
}
.site-design-preview-card-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  padding: 11px 13px;
  border-bottom: 1px solid rgba(202,174,255,.15);
  background: #0d0916;
}
.site-design-preview-card-head strong { color: #fff; }
.site-design-preview-card-head small { color: #9f91b5; }
.site-design-desktop-stage {
  position: relative;
  display: flex;
  min-height: 520px;
  overflow: auto;
  background:
    linear-gradient(90deg, transparent 0 70%, rgba(140,60,255,.04)),
    #05040a;
}
.site-design-desktop-stage .site-design-preview-sidebar {
  flex: 0 0 auto;
  min-height: 520px;
  border-width: 0 1px 0 0;
  border-radius: 0;
}
.site-design-desktop-page {
  flex: 1 1 auto;
  min-width: 250px;
  padding: 28px;
}
.site-design-desktop-page span,
.site-design-phone-page span {
  display: block;
  border-radius: 7px;
  background: linear-gradient(90deg, rgba(157,70,255,.22), rgba(157,70,255,.05));
}
.site-design-desktop-page span:nth-child(1) { width: 55%; height: 28px; }
.site-design-desktop-page span:nth-child(2) { width: 88%; height: 150px; margin-top: 24px; }
.site-design-desktop-page span:nth-child(3) { width: 72%; height: 190px; margin-top: 16px; }
.site-design-preview-sidebar {
  box-sizing: border-box;
  width: min(var(--preview-sidebar-width, 300px), 100%);
}
.site-design-preview-brand,
.site-design-preview-link span {
  font-family: var(--admin-sidebar-font-family, "Scratchmeow5", "Rajdhani", Arial, sans-serif) !important;
  font-weight: 400;
  font-synthesis: none;
}
.site-design-preview-link.active {
  border-color: rgba(199,135,255,.75);
  background: linear-gradient(90deg, rgba(136,45,255,.44), rgba(113,23,218,.14));
  box-shadow: inset 3px 0 0 #c278ff, 0 0 20px rgba(122,34,255,.13);
}
.site-design-phone {
  width: min(390px, calc(100% - 24px));
  margin: 18px auto 22px;
  overflow: hidden;
  border: 7px solid #21182e;
  border-radius: 28px;
  background: #030207;
  box-shadow: 0 20px 50px rgba(0,0,0,.42);
}
.site-design-phone-status,
.site-design-phone-browser {
  display: flex;
  justify-content: space-between;
  align-items: center;
  color: #ddd4e8;
}
.site-design-phone-status {
  min-height: 28px;
  padding: 0 15px;
  background: #08050d;
  font: 700 11px/1 Arial, sans-serif;
}
.site-design-phone-browser {
  min-height: 42px;
  padding: 0 13px;
  border-top: 1px solid #261b35;
  border-bottom: 1px solid #261b35;
  background: #0d0915;
  font-size: .78rem;
}
.site-design-phone-browser span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.site-design-phone-screen {
  position: relative;
  height: 600px;
  overflow: hidden;
  background: radial-gradient(circle at top right, rgba(126,34,206,.18), transparent 38%), #05040a;
}
.site-design-phone-page { padding: 24px 18px; }
.site-design-phone-page span:nth-child(1) { width: 62%; height: 22px; }
.site-design-phone-page span:nth-child(2) { height: 128px; margin-top: 20px; }
.site-design-phone-page span:nth-child(3) { height: 170px; margin-top: 14px; }
.site-design-phone-shade {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,.58);
}
.site-design-preview-sidebar-mobile {
  position: absolute;
  inset: 0 auto 0 0;
  width: min(var(--preview-sidebar-width, 290px), calc(100% - 18px));
  max-width: calc(100% - 18px);
  height: 100%;
  overflow-y: auto;
  padding: 12px;
  border: 0;
  border-right: 1px solid rgba(202,174,255,.23);
  border-radius: 0;
  box-shadow: 18px 0 40px rgba(0,0,0,.42);
}
.site-design-preview-sidebar-mobile .site-design-preview-brand {
  position: sticky;
  top: -12px;
  z-index: 1;
  margin: -12px -12px 10px;
  padding: 20px 18px 16px;
  border-bottom: 1px solid rgba(202,174,255,.16);
  background: rgba(8,5,15,.97);
}
.site-design-preview-sidebar-mobile .site-design-preview-link {
  min-height: max(54px, calc(var(--preview-font-size, 22px) + 26px));
  padding: 9px 12px;
}
@media (max-width: 1120px) {
  .site-design-preview-grid { grid-template-columns: 1fr; }
}
@media (max-width: 620px) {
  .site-design-preview-heading { flex-direction: column; }
  .site-design-preview-heading > span { align-self: flex-start; }
  .site-design-preview { padding: 12px; }
  .site-design-phone { width: 100%; margin-inline: 0; }
  .site-design-phone-screen { height: 560px; }
}


.site-screenshot-layout-editor {
  min-width: 0;
  margin: 4px 0 8px;
  padding: 16px;
  border: 1px solid rgba(185, 111, 255, .38);
  border-radius: 14px;
  background: linear-gradient(145deg, rgba(93, 31, 148, .12), rgba(8, 5, 15, .78));
}
.site-screenshot-layout-editor legend {
  padding: 0 9px;
  color: #fff;
  font-weight: 800;
}
.site-screenshot-layout-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}
.site-screenshot-layout-grid label {
  min-width: 0;
}
.site-screenshot-layout-preview {
  display: grid;
  gap: 12px;
  margin-top: 16px;
  padding: 14px;
  border: 1px solid rgba(203, 151, 255, .24);
  border-radius: 12px;
  background: #07040d;
}
.site-screenshot-layout-preview-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}
.site-screenshot-layout-preview-head strong { color: #fff; }
.site-screenshot-layout-preview-head span {
  color: #cba7ed;
  font-size: .88rem;
}
.site-screenshot-layout-canvas {
  display: flex;
  min-height: 250px;
  align-items: flex-start;
  justify-content: center;
  padding: 18px;
  overflow: auto;
  border: 1px dashed rgba(189, 112, 255, .34);
  border-radius: 11px;
  background:
    linear-gradient(rgba(255,255,255,.018) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.018) 1px, transparent 1px),
    #050309;
  background-size: 28px 28px;
}
.site-screenshot-layout-frame {
  width: max(190px, min(var(--shot-admin-width, 33.333%), 100%));
  max-width: 780px;
  min-width: 0;
  margin: 0;
  overflow: hidden;
  border: 1px solid rgba(198, 139, 255, .42);
  border-radius: 12px;
  background: #0b0712;
  box-shadow: 0 14px 34px rgba(0,0,0,.28);
  transition: width .18s ease;
}
.site-screenshot-layout-image {
  display: grid;
  place-items: center;
  width: 100%;
  height: var(--shot-admin-height, 220px);
  min-height: 130px;
  max-height: 520px;
  overflow: hidden;
  background: #030207;
}
.site-screenshot-layout-frame[data-orientation="horizontal"] .site-screenshot-layout-image {
  height: auto;
  aspect-ratio: 16 / 9;
}
.site-screenshot-layout-frame[data-orientation="vertical"] {
  max-width: 430px;
}
.site-screenshot-layout-frame[data-orientation="vertical"] .site-screenshot-layout-image {
  height: auto;
  aspect-ratio: 9 / 16;
  max-height: 520px;
}
.site-screenshot-layout-frame[data-orientation="square"] {
  max-width: 560px;
}
.site-screenshot-layout-frame[data-orientation="square"] .site-screenshot-layout-image {
  height: auto;
  aspect-ratio: 1 / 1;
}
.site-screenshot-layout-frame[data-orientation="natural"] .site-screenshot-layout-image {
  height: var(--shot-admin-height, 320px);
}
.site-screenshot-layout-image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: var(--shot-admin-fit, contain);
  background: #030207;
}
.site-screenshot-layout-image > span {
  max-width: 280px;
  padding: 18px;
  color: #91849f;
  text-align: center;
}
.site-screenshot-layout-frame figcaption {
  display: grid;
  gap: 4px;
  padding: 11px 13px;
}
.site-screenshot-layout-frame figcaption strong { color: #fff; }
.site-screenshot-layout-frame figcaption span { color: #9e91ad; font-size: .84rem; }
@media (max-width: 900px) {
  .site-screenshot-layout-grid { grid-template-columns: 1fr; }
  .site-screenshot-layout-canvas { justify-content: flex-start; }
  .site-screenshot-layout-frame { width: min(100%, 520px); }
}


.cms-screenshot-grid > figure[data-screenshot-orientation="horizontal"] > a:first-child {
  height: auto !important;
  min-height: 0 !important;
  aspect-ratio: 16 / 9 !important;
}
.cms-screenshot-grid > figure[data-screenshot-orientation="vertical"] > a:first-child {
  height: auto !important;
  min-height: 0 !important;
  aspect-ratio: 9 / 16 !important;
}
.cms-screenshot-grid > figure[data-screenshot-orientation="square"] > a:first-child {
  height: auto !important;
  min-height: 0 !important;
  aspect-ratio: 1 / 1 !important;
}
.cms-screenshot-grid > figure[data-screenshot-orientation="natural"] > a:first-child {
  height: auto !important;
  min-height: 120px !important;
  aspect-ratio: auto !important;
}
.cms-screenshot-grid > figure[data-screenshot-orientation="natural"] > a:first-child > img {
  height: auto !important;
  max-height: 78vh !important;
  object-fit: contain !important;
}
.cms-screenshot-section .cms-screenshot-grid > figure[data-screenshot-orientation] {
  grid-column: span var(--cms-shot-effective-span, var(--cms-shot-span, 4)) !important;
}
@media (max-width: 760px) {
  .cms-screenshot-section .cms-screenshot-grid > figure[data-screenshot-orientation] {
    grid-column: 1 / -1 !important;
  }
}


.cms-screenshot-template-inspector,
.site-screenshot-template-picker {
  border: 1px solid rgba(180, 102, 255, .38);
  border-radius: 14px;
  background: linear-gradient(180deg, rgba(24, 12, 39, .96), rgba(9, 5, 16, .96));
  box-shadow: 0 18px 42px rgba(0, 0, 0, .25);
}
.cms-screenshot-template-inspector {
  margin: 14px 0;
  padding: 16px;
}
.cms-screenshot-template-head,
.site-screenshot-template-picker-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 14px;
}
.cms-screenshot-template-head h3,
.cms-screenshot-template-head p,
.site-screenshot-template-picker-head strong,
.site-screenshot-template-picker-head span { margin: 0; }
.cms-screenshot-template-head p,
.site-screenshot-template-picker-head span {
  display: block;
  margin-top: 4px;
  color: var(--muted);
}
.site-screenshot-template-picker { padding: 15px; }
.cms-screenshot-template-grid,
.site-screenshot-template-options {
  display: grid;
  grid-template-columns: repeat(4, minmax(145px, 1fr));
  gap: 10px;
}
.cms-screenshot-template-grid button,
.site-screenshot-template-options button {
  display: grid;
  min-width: 0;
  min-height: 142px;
  place-items: center;
  align-content: center;
  gap: 7px;
  padding: 12px 10px;
  border: 1px solid rgba(181, 113, 235, .3);
  border-radius: 12px;
  background: rgba(8, 5, 14, .88);
  color: #eee5fa;
  cursor: pointer;
  text-align: center;
}
.cms-screenshot-template-grid button:hover,
.cms-screenshot-template-grid button.active,
.site-screenshot-template-options button:hover,
.site-screenshot-template-options button.active {
  border-color: #c47bff;
  background: linear-gradient(145deg, rgba(123, 34, 198, .5), rgba(40, 14, 66, .88));
  box-shadow: 0 0 22px rgba(153, 54, 255, .2);
}
.cms-screenshot-template-grid button strong,
.site-screenshot-template-options button strong { color: #fff; }
.cms-screenshot-template-grid button small,
.site-screenshot-template-options button small { color: #cbb9dd; }
.shot-template-shape {
  position: relative;
  display: block;
  width: 84px;
  height: 48px;
  border: 2px solid #bc72ff;
  border-radius: 7px;
  background:
    linear-gradient(135deg, rgba(207, 124, 255, .72), rgba(89, 29, 145, .55)),
    #160c25;
  box-shadow: inset 0 0 0 3px rgba(5, 3, 10, .55), 0 0 14px rgba(147, 45, 240, .25);
}
.shot-template-shape::after {
  content: "";
  position: absolute;
  inset: 7px;
  border: 1px solid rgba(255,255,255,.45);
  border-radius: 3px;
}
.shot-template-shape.horizontal.small { width: 62px; height: 36px; }
.shot-template-shape.horizontal.medium { width: 82px; height: 46px; }
.shot-template-shape.horizontal.large { width: 106px; height: 54px; }
.shot-template-shape.vertical.small { width: 34px; height: 66px; }
.shot-template-shape.vertical.medium { width: 42px; height: 78px; }
.shot-template-shape.vertical.large { width: 50px; height: 92px; }
.shot-template-shape.square { width: 62px; height: 62px; }
.shot-template-shape.original {
  width: 80px;
  height: 54px;
  clip-path: polygon(0 10%, 100% 0, 92% 100%, 8% 88%);
}
.cms-screenshot-fit-choice {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 9px;
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid rgba(202,174,255,.14);
}
.cms-screenshot-fit-choice strong { margin-right: 6px; }
.cms-screenshot-fit-choice button {
  min-height: 38px;
  padding: 0 13px;
  border: 1px solid rgba(181, 113, 235, .35);
  border-radius: 9px;
  background: #100818;
  color: #e8dcf5;
  cursor: pointer;
}
.cms-screenshot-fit-choice button.active,
.cms-screenshot-fit-choice button:hover {
  border-color: #c47bff;
  background: #64249b;
  color: #fff;
}
.site-screenshot-layout-grid-simple { grid-template-columns: minmax(240px, 420px); margin-top: 14px; }
.site-screenshot-click-note {
  margin: 12px 0 18px;
  color: #c9b9da;
}


.cms-screenshot-visual-toolbar.cms-screenshot-add-only button.cms-shot-toolbar-add {
  width: auto !important;
  min-width: 132px !important;
  padding: 0 12px !important;
  font-size: 13px !important;
  white-space: nowrap;
}
.cms-screenshot-edit-tools-simple { gap: 6px !important; }
.cms-screenshot-edit-tools-simple .cms-screenshot-drag,
.cms-screenshot-edit-tools-simple .cms-screenshot-delete {
  width: 36px !important;
  height: 36px !important;
  min-width: 36px !important;
}



@media (max-width: 1050px) {
  .cms-screenshot-template-grid,
  .site-screenshot-template-options { grid-template-columns: repeat(2, minmax(135px, 1fr)); }
}
@media (max-width: 600px) {
  .cms-screenshot-template-grid,
  .site-screenshot-template-options { grid-template-columns: 1fr; }
  .cms-screenshot-template-head,
  .site-screenshot-template-picker-head { display: block; }
  .cms-screenshot-template-head .button { margin-top: 10px; }
}


.site-screenshot-groups-admin {
  margin-top: 26px;
  padding-top: 24px;
  border-top: 1px solid #34264b;
}
.site-screenshot-groups-head h3 { margin: 0 0 6px; font-size: 1.45rem; }
.site-screenshot-group-form { margin-top: 14px; }
.site-screenshot-group-template-fieldset,
.site-screenshot-group-picker-fieldset {
  grid-column: 1 / -1;
  margin: 0;
  padding: 16px;
  border: 1px solid #392851;
  border-radius: 13px;
  background: #08050f;
}
.site-screenshot-group-template-fieldset legend,
.site-screenshot-group-picker-fieldset legend { padding: 0 8px; color: #fff; font-weight: 800; }
.site-screenshot-group-templates {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 10px;
}
.site-screenshot-group-templates button {
  display: grid;
  gap: 7px;
  min-height: 132px;
  padding: 11px;
  border: 1px solid #3a2a53;
  border-radius: 11px;
  background: #0c0815;
  color: #d8cae9;
  text-align: left;
  cursor: pointer;
}
.site-screenshot-group-templates button:hover,
.site-screenshot-group-templates button.active {
  border-color: #b66cff;
  background: linear-gradient(145deg, rgba(137,45,255,.25), rgba(31,13,50,.92));
  box-shadow: 0 0 0 2px rgba(174,89,255,.11);
}
.site-screenshot-group-templates button strong { color: #fff; }
.site-screenshot-group-templates button small { color: #9f91b4; }
.group-template-demo {
  display: grid;
  grid-template-columns: repeat(var(--demo-cols, 3), minmax(0, 1fr));
  align-items: center;
  gap: 5px;
  min-height: 54px;
  padding: 6px;
  border: 1px solid rgba(198,151,255,.22);
  border-radius: 8px;
  background: #050308;
}
.group-template-demo.columns-2 { --demo-cols: 2; }
.group-template-demo.columns-3 { --demo-cols: 3; }
.group-template-demo.columns-4 { --demo-cols: 4; }
.group-template-demo i {
  display: block;
  border: 1px solid rgba(203,159,255,.4);
  border-radius: 4px;
  background: linear-gradient(135deg, #6422a8, #25103e);
}
.group-template-demo.horizontal i { aspect-ratio: 16 / 9; }
.group-template-demo.vertical i { width: 70%; justify-self: center; aspect-ratio: 9 / 16; }
.group-template-demo.square i { aspect-ratio: 1; }
.group-template-demo.natural i:nth-child(odd) { aspect-ratio: 16 / 9; }
.group-template-demo.natural i:nth-child(even) { width: 72%; justify-self: center; aspect-ratio: 9 / 16; }
.site-screenshot-group-manual { width: min(260px, 100%); margin-top: 14px; }
.site-screenshot-group-picker-head {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 12px;
  color: #b9acd0;
}
.site-screenshot-group-picker-head strong { color: #d9a9ff; }
.site-screenshot-group-picker {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 10px;
  max-height: 520px;
  overflow: auto;
}
.site-screenshot-group-choice {
  display: grid !important;
  grid-template-columns: auto 74px minmax(0, 1fr);
  align-items: center;
  gap: 9px !important;
  min-height: 86px;
  padding: 8px;
  border: 1px solid #35264b;
  border-radius: 10px;
  background: #0b0712;
  cursor: pointer;
}
.site-screenshot-group-choice.selected { border-color: #aa60ff; background: rgba(119,42,207,.18); }
.site-screenshot-group-choice input { width: auto !important; }
.site-screenshot-group-choice img { width: 74px; height: 66px; object-fit: contain; border-radius: 7px; background: #030205; }
.site-screenshot-group-choice span { display: grid; min-width: 0; gap: 3px; }
.site-screenshot-group-choice strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #fff; }
.site-screenshot-group-choice small { color: #9a8cae; font-weight: 500; }
.site-screenshot-group-admin-card { grid-template-columns: minmax(220px, 360px) 1fr; align-items: start; }
.site-screenshot-group-admin-preview {
  display: grid;
  grid-template-columns: repeat(var(--admin-group-columns, 3), minmax(0, 1fr));
  gap: 5px;
  min-height: 150px;
  padding: 8px;
  border: 1px solid #34264b;
  border-radius: 10px;
  background: #050308;
}
.site-screenshot-group-admin-preview img { display: block; width: 100%; height: 100%; max-height: 170px; object-fit: contain; border-radius: 5px; background: #090610; }
.site-screenshot-group-admin-preview.layout-horizontal img { aspect-ratio: 16 / 9; }
.site-screenshot-group-admin-preview.layout-vertical img { aspect-ratio: 9 / 16; }
.site-screenshot-group-admin-preview.layout-square img { aspect-ratio: 1; }
.site-screenshot-group-admin-preview.layout-natural img { height: auto; max-height: 180px; }

.cms-screenshot-block-layout {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 18px;
  padding: 18px;
  align-items: start;
}
.cms-screenshot-content-block {
  min-width: 0;
  grid-column: span var(--cms-screenshot-block-span, 12);
  border: 1px solid rgba(202,174,255,.18);
  border-radius: 13px;
  background: rgba(7,4,13,.82);
  overflow: hidden;
}
.cms-screenshot-individual-block .cms-screenshot-grid {
  grid-template-columns: minmax(0, 1fr) !important;
  padding: 0 !important;
  gap: 0 !important;
}
.cms-screenshot-individual-block .cms-screenshot-grid > figure {
  grid-column: 1 / -1 !important;
  border: 0 !important;
  border-radius: 0 !important;
}
.cms-screenshot-group-head { padding: 13px 15px 0; }
.cms-screenshot-group-head h3 { margin: 0; color: #fff; font-size: 1.1rem; }
.cms-screenshot-group-grid {
  display: grid;
  grid-template-columns: repeat(var(--cms-group-columns, 3), minmax(0, 1fr));
  gap: 12px;
  padding: 14px;
  align-items: start;
}
.cms-screenshot-group-grid figure {
  display: flex;
  min-width: 0;
  height: 100%;
  margin: 0;
  flex-direction: column;
  border: 1px solid rgba(202,174,255,.18);
  border-radius: 10px;
  overflow: hidden;
  background: #08050f;
}
.cms-screenshot-group-grid figure > a:first-child {
  display: grid;
  width: 100%;
  min-height: 0;
  place-items: center;
  overflow: hidden;
  background: #030205;
}
.cms-screenshot-group-grid figure > a:first-child > img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: var(--cms-group-fit, contain);
}
.cms-group-layout-horizontal .cms-screenshot-group-grid figure > a:first-child { aspect-ratio: 16 / 9; }
.cms-group-layout-vertical .cms-screenshot-group-grid figure > a:first-child { aspect-ratio: 9 / 16; max-height: 680px; }
.cms-group-layout-square .cms-screenshot-group-grid figure > a:first-child { aspect-ratio: 1; }
.cms-group-layout-natural .cms-screenshot-group-grid figure > a:first-child,
.cms-group-layout-mixed .cms-screenshot-group-grid figure > a:first-child { height: auto; min-height: 110px; }
.cms-group-layout-natural .cms-screenshot-group-grid figure > a:first-child > img,
.cms-group-layout-mixed .cms-screenshot-group-grid figure > a:first-child > img { height: auto; max-height: 680px; object-fit: contain; }
.cms-screenshot-group-grid figcaption { display: grid; gap: 4px; padding: 10px 11px; }
.cms-screenshot-group-grid figcaption strong { color: #fff; }
.cms-screenshot-group-grid figcaption span { color: var(--muted, #ad9fc4); font-size: .9rem; }
.cms-screenshot-group-grid .cms-screenshot-open-original { color: #c990ff; font-size: .82rem; }

@media (max-width: 980px) {
  .cms-screenshot-content-block { grid-column: 1 / -1; }
  .cms-screenshot-group-grid { grid-template-columns: repeat(var(--cms-group-columns-tablet, 2), minmax(0, 1fr)); }
}
@media (max-width: 680px) {
  .site-screenshot-group-admin-card { grid-template-columns: 1fr; }
  .site-screenshot-group-picker-head { display: grid; }
  .cms-screenshot-content-block { grid-column: 1 / -1 !important; }
  .cms-screenshot-group-grid { grid-template-columns: 1fr; }
  .cms-screenshot-block-layout { padding: 12px; gap: 12px; }
}
.site-screenshot-group-live-preview {
  margin-top: 2px;
  padding: 15px;
  border: 1px solid #392851;
  border-radius: 13px;
  background: radial-gradient(circle at top left, rgba(126,34,206,.13), transparent 45%), #07040d;
}
.site-screenshot-group-live-preview-head {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 12px;
}
.site-screenshot-group-live-preview-head strong { color: #fff; }
.site-screenshot-group-live-preview-head span { color: #a89ab9; }
.site-screenshot-group-live-preview-stage {
  width: var(--group-preview-box-width, 78%);
  max-width: 100%;
  padding: 10px;
  border: 1px solid rgba(190,125,255,.28);
  border-radius: 11px;
  background: #050308;
}
.site-screenshot-group-live-preview-stage[data-size="small"] { --group-preview-box-width: 38%; }
.site-screenshot-group-live-preview-stage[data-size="medium"] { --group-preview-box-width: 58%; }
.site-screenshot-group-live-preview-stage[data-size="large"] { --group-preview-box-width: 78%; }
.site-screenshot-group-live-preview-stage[data-size="full"] { --group-preview-box-width: 100%; }
.site-screenshot-group-live-preview-grid {
  display: grid;
  grid-template-columns: repeat(var(--group-preview-columns, 3), minmax(0, 1fr));
  gap: 8px;
}
.site-screenshot-group-live-preview-grid > p { grid-column: 1 / -1; margin: 0; padding: 34px 12px; text-align: center; color: #8f80a8; }
.site-screenshot-group-live-preview-grid figure { margin: 0; overflow: hidden; border: 1px solid rgba(202,174,255,.2); border-radius: 7px; background: #090610; }
.site-screenshot-group-live-preview-grid img { display: block; width: 100%; height: 100%; object-fit: var(--group-preview-fit, contain); }
.site-screenshot-group-live-preview-stage[data-layout="horizontal"] figure { aspect-ratio: 16 / 9; }
.site-screenshot-group-live-preview-stage[data-layout="vertical"] figure { aspect-ratio: 9 / 16; }
.site-screenshot-group-live-preview-stage[data-layout="square"] figure { aspect-ratio: 1; }
.site-screenshot-group-live-preview-stage[data-layout="natural"] figure,
.site-screenshot-group-live-preview-stage[data-layout="mixed"] figure { aspect-ratio: auto; }
.site-screenshot-group-live-preview-stage[data-layout="natural"] img,
.site-screenshot-group-live-preview-stage[data-layout="mixed"] img { height: auto; max-height: 360px; object-fit: contain; }
@media (max-width: 760px) {
  .site-screenshot-group-live-preview-head { display: grid; }
  .site-screenshot-group-live-preview-stage { width: 100%; }
  .site-screenshot-group-live-preview-grid { grid-template-columns: repeat(var(--group-preview-columns-mobile, 2), minmax(0, 1fr)); }
}
@media (max-width: 480px) {
  .site-screenshot-group-live-preview-grid { grid-template-columns: 1fr; }
}



.cms-screenshot-placeholder { display: none !important; }

main.page-content > .cms-screenshot-content-block {
  width: min(100%, var(--cms-original-block-width, 100%));
  max-width: 100%;
  margin: 18px 0 0;
}

.cms-screenshot-content-block {
  position: relative;
  min-width: 0;
  overflow: hidden;
  border: 1px solid rgba(202,174,255,.24);
  border-radius: 14px;
  background: rgba(7,4,13,.92);
}
.cms-screenshot-content-block .cms-screenshot-grid,
.cms-screenshot-content-block .cms-screenshot-group-grid { margin: 0; }
.cms-screenshot-individual-block .cms-screenshot-grid {
  display: block !important;
  padding: 0 !important;
}
.cms-screenshot-individual-block figure {
  display: flex !important;
  width: 100%;
  margin: 0 !important;
  flex-direction: column;
  border: 0 !important;
  border-radius: 0 !important;
  background: #06030b;
}
.cms-screenshot-individual-block figure > a:first-child {
  display: grid !important;
  width: 100% !important;
  min-height: 0 !important;
  max-height: none !important;
  place-items: center;
  overflow: hidden;
  background: #020104;
}
.cms-screenshot-individual-block figure > a:first-child > img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  max-height: none !important;
  aspect-ratio: auto !important;
  object-fit: var(--cms-shot-fit, contain) !important;
  background: #020104;
}
.cms-screenshot-individual-block figure[data-screenshot-orientation="horizontal"] > a:first-child {
  aspect-ratio: 16 / 9 !important;
}
.cms-screenshot-individual-block figure[data-screenshot-orientation="vertical"] > a:first-child {
  aspect-ratio: 9 / 16 !important;
  height: auto !important;
  max-height: none !important;
}
.cms-screenshot-individual-block figure[data-screenshot-orientation="square"] > a:first-child {
  aspect-ratio: 1 / 1 !important;
}
.cms-screenshot-individual-block figure[data-screenshot-orientation="natural"] > a:first-child {
  display: block !important;
  height: auto !important;
  min-height: 0 !important;
  aspect-ratio: auto !important;
}
.cms-screenshot-individual-block figure[data-screenshot-orientation="natural"] > a:first-child > img {
  width: 100% !important;
  height: auto !important;
  max-height: none !important;
  object-fit: contain !important;
}

.cms-screenshot-group-block .cms-screenshot-group-grid {
  display: grid !important;
  grid-template-columns: repeat(var(--cms-group-columns, 3), minmax(0, 1fr)) !important;
  gap: 12px;
  padding: 14px;
}
.cms-screenshot-group-block .cms-screenshot-group-grid figure > a:first-child {
  max-height: none !important;
}
.cms-screenshot-group-block.cms-group-layout-horizontal figure > a:first-child { aspect-ratio: 16 / 9 !important; }
.cms-screenshot-group-block.cms-group-layout-vertical figure > a:first-child {
  aspect-ratio: 9 / 16 !important;
  max-height: none !important;
}
.cms-screenshot-group-block.cms-group-layout-square figure > a:first-child { aspect-ratio: 1 / 1 !important; }
.cms-screenshot-group-block.cms-group-layout-natural figure > a:first-child,
.cms-screenshot-group-block.cms-group-layout-mixed figure > a:first-child { aspect-ratio: auto !important; height: auto !important; }
.cms-screenshot-group-block.cms-group-layout-natural figure > a:first-child > img,
.cms-screenshot-group-block.cms-group-layout-mixed figure > a:first-child > img { height: auto !important; max-height: none !important; object-fit: contain !important; }

.cms-screenshot-block-drag-handle {
  position: relative;
  z-index: 10050;
  display: none;
  min-height: 38px;
  align-items: center;
  justify-content: center;
  padding: 8px 12px;
  border-bottom: 1px solid rgba(206,153,255,.38);
  background: linear-gradient(90deg, rgba(125,39,195,.92), rgba(63,20,102,.92));
  color: #fff;
  font: 900 12px/1.2 system-ui,sans-serif;
  letter-spacing: .06em;
  cursor: grab;
  user-select: none;
}

.cms-screenshot-block-drag-handle:active { cursor: grabbing; }



.site-screenshot-logical-controls {
  display: grid;
  gap: 12px;
  padding: 15px;
  border: 1px solid rgba(180,102,255,.38);
  border-radius: 13px;
  background: #08050f;
}
.site-screenshot-logical-heading { display: grid; gap: 3px; }
.site-screenshot-logical-heading strong { color: #fff; }
.site-screenshot-logical-heading span { color: #a99ab9; }
.site-screenshot-choice-grid,
.site-screenshot-width-choice-grid,
.cms-screenshot-shape-grid,
.cms-screenshot-width-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
  gap: 9px;
}
.site-screenshot-choice-grid button,
.site-screenshot-width-choice-grid button,
.cms-screenshot-shape-grid button,
.cms-screenshot-width-grid button {
  display: grid;
  min-height: 92px;
  place-items: center;
  align-content: center;
  gap: 5px;
  padding: 10px;
  border: 1px solid rgba(181,113,235,.3);
  border-radius: 10px;
  background: #0b0712;
  color: #e9def5;
  cursor: pointer;
  text-align: center;
}
.site-screenshot-choice-grid button.active,
.site-screenshot-width-choice-grid button.active,
.cms-screenshot-shape-grid button.active,
.cms-screenshot-width-grid button.active,
.site-screenshot-choice-grid button:hover,
.site-screenshot-width-choice-grid button:hover,
.cms-screenshot-shape-grid button:hover,
.cms-screenshot-width-grid button:hover {
  border-color: #cd82ff;
  background: linear-gradient(145deg, rgba(126,38,203,.55), rgba(31,13,50,.96));
  box-shadow: 0 0 0 2px rgba(174,89,255,.12);
}
.cms-screenshot-shape-grid { margin-bottom: 12px; }
.cms-screenshot-width-grid { margin-bottom: 12px; grid-template-columns: repeat(6, minmax(64px, 1fr)); }

.site-screenshot-layout-frame[data-orientation="vertical"] .site-screenshot-layout-image {
  aspect-ratio: 9 / 16 !important;
  height: auto !important;
  max-height: 650px;
}
.site-screenshot-layout-frame[data-orientation="horizontal"] .site-screenshot-layout-image { aspect-ratio: 16 / 9 !important; height: auto !important; }
.site-screenshot-layout-frame[data-orientation="square"] .site-screenshot-layout-image { aspect-ratio: 1 / 1 !important; height: auto !important; }
.site-screenshot-layout-frame[data-orientation="natural"] .site-screenshot-layout-image { aspect-ratio: auto !important; height: auto !important; min-height: 180px; }

@media (max-width: 980px) {
  main.page-content > .cms-screenshot-content-block { width: 100% !important; }
  .cms-screenshot-group-block .cms-screenshot-group-grid { grid-template-columns: repeat(var(--cms-group-columns-tablet, 2), minmax(0,1fr)) !important; }
  .cms-screenshot-width-grid { grid-template-columns: repeat(3, minmax(80px,1fr)); }
}
@media (max-width: 680px) {
  .cms-screenshot-group-block .cms-screenshot-group-grid { grid-template-columns: 1fr !important; }
  .site-screenshot-choice-grid,.site-screenshot-width-choice-grid,.cms-screenshot-shape-grid,.cms-screenshot-width-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}


.site-screenshot-group-live-preview-stage[data-size="quarter"] { --group-preview-box-width: 25%; }
.site-screenshot-group-live-preview-stage[data-size="third"] { --group-preview-box-width: 33.333%; }
.site-screenshot-group-live-preview-stage[data-size="half"] { --group-preview-box-width: 50%; }
.site-screenshot-group-live-preview-stage[data-size="two-thirds"] { --group-preview-box-width: 66.667%; }
.site-screenshot-group-live-preview-stage[data-size="three-quarters"] { --group-preview-box-width: 75%; }



.chart-wrap { min-height: 176px !important; height: 176px !important; }
.chart-wrap svg { width: 100% !important; height: 176px !important; max-height: 176px !important; }
.analytics-panel .panel-body { padding-bottom: 12px !important; }
.dashboard-columns { align-items: stretch !important; }
.dashboard-column { align-content: start !important; min-height: 0 !important; }
@media (min-width: 1181px) {
  
  
  
}


.cms-pointer-reorder-target { outline: 3px solid #c46cff !important; outline-offset: 4px !important; }


.chart-wrap { min-height: 148px !important; height: 148px !important; }
.chart-wrap svg { width: 100% !important; height: 148px !important; max-height: 148px !important; }
.metric-tabs { margin-bottom: 8px !important; }

@media (min-width: 1181px) {
  .dashboard-columns { align-items: start !important; }
  .dashboard-column { display: grid !important; grid-template-rows: 350px 300px auto !important; gap: 14px !important; align-content: start !important; }
  .dashboard-column > article:nth-of-type(1) { height: 350px !important; min-height: 350px !important; overflow: hidden !important; }
  .dashboard-column > article:nth-of-type(2) { height: 300px !important; min-height: 300px !important; overflow: hidden !important; }
  .dashboard-column > article > .panel-body { min-height: 0 !important; overflow: auto !important; }
  .dashboard-column-wide .analytics-panel .panel-body { overflow: hidden !important; }
}



.cms-builder-direct-drag-handle.cms-pointer-dragging,
.cms-screenshot-block-drag-handle.cms-pointer-dragging { cursor: grabbing !important; }
.cms-section-dragging { opacity: .7 !important; box-shadow: 0 0 0 3px rgba(203,112,255,.7) !important; }
.cms-pointer-reorder-target { position: relative !important; outline: 3px solid #d17aff !important; outline-offset: 5px !important; }
.cms-pointer-reorder-target[data-cms-pointer-drop-side="before"]::before,
.cms-pointer-reorder-target[data-cms-pointer-drop-side="after"]::after {
  content: "DROP HERE";
  position: absolute;
  left: 8px;
  right: 8px;
  z-index: 30000;
  height: 5px;
  border-radius: 999px;
  background: #d17aff;
  color: #fff;
  font: 900 10px/1 system-ui,sans-serif;
  text-align: center;
  box-shadow: 0 0 16px rgba(209,122,255,.9);
}
.cms-pointer-reorder-target[data-cms-pointer-drop-side="before"]::before { top: -8px; }
.cms-pointer-reorder-target[data-cms-pointer-drop-side="after"]::after { bottom: -8px; }
.cms-screenshot-group-selected { outline: 3px solid #d58bff !important; outline-offset: 4px !important; }
.cms-screenshot-group-head { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 10px !important; }
.cms-screenshot-control-label { display: block; margin: 13px 0 8px; color: #fff; }



.sidebar-socials { gap: 7px !important; }
.sidebar-socials a { width: 30px !important; height: 30px !important; }
.metric-tabs { grid-template-columns: repeat(4,minmax(0,1fr)) !important; }
@media (max-width: 900px) { .metric-tabs { grid-template-columns: repeat(2,minmax(0,1fr)) !important; } }
@media (max-width: 560px) { .metric-tabs { grid-template-columns: 1fr !important; } }







@media (min-width: 1221px) {
  .dashboard-column { display: grid !important; grid-template-rows: 350px 300px auto !important; gap: 14px !important; align-content: start !important; }
  .dashboard-column > article:nth-of-type(1) { height: 350px !important; min-height: 350px !important; overflow: hidden !important; }
  .dashboard-column > article:nth-of-type(2) { height: 300px !important; min-height: 300px !important; overflow: hidden !important; }
}
@media (min-width: 901px) and (max-width: 1220px) {
  .dashboard-column:not(.dashboard-column-wide) { display: grid !important; grid-template-rows: 350px 300px auto !important; gap: 14px !important; align-content: start !important; }
  .dashboard-column:not(.dashboard-column-wide) > article:nth-of-type(1) { height: 350px !important; min-height: 350px !important; overflow: hidden !important; }
  .dashboard-column:not(.dashboard-column-wide) > article:nth-of-type(2) { height: 300px !important; min-height: 300px !important; overflow: hidden !important; }
  .dashboard-column-wide { grid-template-rows: none !important; }
  .dashboard-column-wide > article { height: auto !important; min-height: 0 !important; }
}



.site-screenshot-unified-workflow { display:grid; gap:22px; }
.site-screenshot-workflow-step {
  padding:18px;
  border:1px solid rgba(185,111,255,.34);
  border-radius:15px;
  background:linear-gradient(145deg,rgba(93,31,148,.10),rgba(8,5,15,.86));
}
.site-screenshot-workflow-step.site-screenshot-groups-admin { margin-top:0; padding-top:18px; border-top:1px solid rgba(185,111,255,.34); }
.site-screenshot-step-head { display:flex; align-items:flex-start; gap:12px; margin-bottom:15px; }
.site-screenshot-step-head > span { display:grid; width:34px; height:34px; flex:0 0 34px; place-items:center; border:1px solid #b66cff; border-radius:10px; background:rgba(137,45,255,.24); color:#fff; font-weight:900; }
.site-screenshot-step-head > div { min-width:0; flex:1; }
.site-screenshot-step-head h3 { margin:0 0 4px; color:#fff; font-size:1.3rem; }
.site-screenshot-step-head p { margin:0; color:#aa9abb; }
.site-screenshot-step-head > .button { margin-left:auto; }
.site-screenshot-unified-choice-fieldset { margin:0; padding:15px; border:1px solid #392851; border-radius:13px; background:#08050f; }
.site-screenshot-unified-choice-fieldset legend { padding:0 8px; color:#fff; font-weight:800; }
.site-screenshot-number-grid,.site-screenshot-shape-grid,.site-screenshot-box-width-grid { display:grid; gap:9px; }
.site-screenshot-number-grid { grid-template-columns:repeat(6,minmax(80px,1fr)); }
.site-screenshot-shape-grid { grid-template-columns:repeat(4,minmax(150px,1fr)); }
.site-screenshot-box-width-grid { grid-template-columns:repeat(6,minmax(90px,1fr)); }
.site-screenshot-number-grid button,.site-screenshot-shape-grid button,.site-screenshot-box-width-grid button {
  display:grid; min-height:82px; place-items:center; align-content:center; gap:5px; padding:10px;
  border:1px solid rgba(181,113,235,.3); border-radius:10px; background:#0b0712; color:#e9def5; cursor:pointer; text-align:center;
}
.site-screenshot-shape-grid button { min-height:126px; text-align:left; place-items:stretch; }
.site-screenshot-number-grid button.active,.site-screenshot-shape-grid button.active,.site-screenshot-box-width-grid button.active,
.site-screenshot-number-grid button:hover,.site-screenshot-shape-grid button:hover,.site-screenshot-box-width-grid button:hover {
  border-color:#cd82ff; background:linear-gradient(145deg,rgba(126,38,203,.55),rgba(31,13,50,.96)); box-shadow:0 0 0 2px rgba(174,89,255,.12);
}
.site-screenshot-number-grid button strong,.site-screenshot-box-width-grid button strong { color:#fff; font-size:1.35rem; }
.site-screenshot-number-grid button small,.site-screenshot-shape-grid button small,.site-screenshot-box-width-grid button small { color:#a99ab9; }
.site-screenshot-library-form { margin-bottom:0; }
@media (max-width:1100px) {
  .site-screenshot-number-grid,.site-screenshot-box-width-grid { grid-template-columns:repeat(3,minmax(90px,1fr)); }
  .site-screenshot-shape-grid { grid-template-columns:repeat(2,minmax(150px,1fr)); }
}
@media (max-width:650px) {
  .site-screenshot-workflow-step { padding:12px; }
  .site-screenshot-step-head { flex-wrap:wrap; }
  .site-screenshot-step-head > .button { width:100%; margin-left:46px; }
  .site-screenshot-number-grid,.site-screenshot-box-width-grid,.site-screenshot-shape-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}






.site-screenshot-box-length-grid,
.cms-screenshot-length-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(96px, 1fr));
  gap: 9px;
  margin-bottom: 12px;
}
.site-screenshot-box-length-grid button,
.cms-screenshot-length-grid button {
  display: grid;
  min-height: 76px;
  place-items: center;
  align-content: center;
  gap: 5px;
  padding: 10px;
  border: 1px solid rgba(181,113,235,.3);
  border-radius: 10px;
  background: #0b0712;
  color: #e9def5;
  cursor: pointer;
  text-align: center;
}
.site-screenshot-box-length-grid button.active,
.cms-screenshot-length-grid button.active,
.site-screenshot-box-length-grid button:hover,
.cms-screenshot-length-grid button:hover {
  border-color: #cd82ff;
  background: linear-gradient(145deg,rgba(126,38,203,.55),rgba(31,13,50,.96));
  box-shadow: 0 0 0 2px rgba(174,89,255,.12);
}
.site-screenshot-box-length-grid button strong,
.cms-screenshot-length-grid button strong { color: #fff; font-size: 1.08rem; }
.site-screenshot-box-length-grid button small,
.cms-screenshot-length-grid button small { color: #a99ab9; }
.site-screenshot-control-help { margin: 0 0 12px; color: #aa9abb; }


.cms-screenshot-group-block.cms-group-length-compact .cms-screenshot-group-grid figure > a:first-child {
  height: 170px !important;
  min-height: 170px !important;
  max-height: 170px !important;
  aspect-ratio: auto !important;
}
.cms-screenshot-group-block.cms-group-length-normal .cms-screenshot-group-grid figure > a:first-child {
  height: 300px !important;
  min-height: 300px !important;
  max-height: 300px !important;
  aspect-ratio: auto !important;
}
.cms-screenshot-group-block.cms-group-length-tall .cms-screenshot-group-grid figure > a:first-child {
  height: 480px !important;
  min-height: 480px !important;
  max-height: 480px !important;
  aspect-ratio: auto !important;
}
.cms-screenshot-group-block.cms-group-length-full .cms-screenshot-group-grid figure > a:first-child {
  height: clamp(620px, 80vh, 1100px) !important;
  min-height: clamp(620px, 80vh, 1100px) !important;
  max-height: none !important;
  aspect-ratio: auto !important;
}


.site-screenshot-group-live-preview-stage[data-length="compact"] figure {
  height: 86px !important;
  aspect-ratio: auto !important;
}
.site-screenshot-group-live-preview-stage[data-length="normal"] figure {
  height: 150px !important;
  aspect-ratio: auto !important;
}
.site-screenshot-group-live-preview-stage[data-length="tall"] figure {
  height: 250px !important;
  aspect-ratio: auto !important;
}
.site-screenshot-group-live-preview-stage[data-length="full"] figure {
  height: 390px !important;
  aspect-ratio: auto !important;
}

@media (max-width: 900px) {
  .site-screenshot-box-length-grid,
  .cms-screenshot-length-grid { grid-template-columns: repeat(3, minmax(90px,1fr)); }
  .cms-screenshot-group-block.cms-group-length-full .cms-screenshot-group-grid figure > a:first-child {
    height: min(78vh, 760px) !important;
    min-height: 520px !important;
  }
}
@media (max-width: 560px) {
  .site-screenshot-box-length-grid,
  .cms-screenshot-length-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .cms-screenshot-group-block.cms-group-length-compact .cms-screenshot-group-grid figure > a:first-child { height: 150px !important; min-height: 150px !important; }
  .cms-screenshot-group-block.cms-group-length-normal .cms-screenshot-group-grid figure > a:first-child { height: 260px !important; min-height: 260px !important; }
  .cms-screenshot-group-block.cms-group-length-tall .cms-screenshot-group-grid figure > a:first-child { height: 420px !important; min-height: 420px !important; }
}




.metric-tabs { grid-template-columns: repeat(3,minmax(0,1fr)) !important; margin-bottom:8px !important; }
.metric-tab em { display:block; margin-top:4px; color:var(--muted); font-size:.68rem; font-style:normal; }
.chart-wrap { width:100% !important; min-height:148px !important; height:148px !important; overflow:hidden !important; }
.chart-wrap svg { display:block !important; width:100% !important; height:148px !important; max-height:148px !important; overflow:visible !important; }
.analytics-panel .panel-body { display:flex !important; min-height:0 !important; flex-direction:column !important; overflow:hidden !important; padding-bottom:12px !important; }
@media (min-width:1221px) {
  .dashboard-column { grid-template-rows:350px 300px auto !important; }
  .dashboard-column > article:nth-of-type(1) { height:350px !important; min-height:350px !important; overflow:hidden !important; }
  .dashboard-column > article:nth-of-type(2) { height:300px !important; min-height:300px !important; overflow:hidden !important; }
}
@media (min-width:901px) and (max-width:1220px) {
  .dashboard-column:not(.dashboard-column-wide) { grid-template-rows:350px 300px auto !important; }
  .dashboard-column:not(.dashboard-column-wide) > article:nth-of-type(1) { height:350px !important; min-height:350px !important; overflow:hidden !important; }
  .dashboard-column:not(.dashboard-column-wide) > article:nth-of-type(2) { height:300px !important; min-height:300px !important; overflow:hidden !important; }
  .dashboard-column-wide .analytics-panel { min-height:350px !important; }
}
@media (max-width:900px) {
  .chart-wrap,.chart-wrap svg { min-height:148px !important; height:148px !important; max-height:148px !important; }
  .metric-tabs { grid-template-columns:1fr !important; }
}


.page-content { width:min(1540px,calc(100% - 42px)); margin-inline:auto; padding-top:24px; }
@media (max-width:900px) { .page-content { width:min(100% - 24px,1100px); padding-top:16px; } }


body[data-page="games"] [data-playlists] { width:100%; }
body[data-page="games"] .playlist-library { width:100%; padding:18px; border:1px solid var(--line); border-radius:11px; background:rgba(255,255,255,.015); }
body[data-page="games"] .playlist-library-head { display:flex; align-items:flex-end; justify-content:space-between; gap:16px; margin-bottom:14px; }
body[data-page="games"] .playlist-library-head h2 { margin:0; }
body[data-page="games"] .playlist-library-head span { color:var(--soft); font-size:.8rem; }
body[data-page="games"] .playlist-library-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; align-items:stretch; }
body[data-page="games"] .playlist-library-grid .playlist-card { display:flex !important; width:100% !important; max-width:none !important; min-height:0 !important; height:100% !important; flex-direction:column !important; }
body[data-page="games"] .playlist-library-grid .playlist-card-image { display:block; height:auto !important; }
body[data-page="games"] .playlist-library-grid .playlist-card img { width:100% !important; height:auto !important; min-height:0 !important; aspect-ratio:16/9 !important; object-fit:cover !important; }
body[data-page="games"] .playlist-library-grid .playlist-card-copy { display:flex !important; min-height:190px !important; height:100% !important; flex-direction:column !important; padding:16px !important; }
body[data-page="games"] .playlist-library-grid .playlist-card h3 { font-size:1.22rem !important; line-height:1.25 !important; }
body[data-page="games"] .playlist-library-grid .playlist-card p:not(.eyebrow) { display:-webkit-box !important; margin:8px 0 12px !important; overflow:hidden !important; line-height:1.45 !important; -webkit-box-orient:vertical !important; -webkit-line-clamp:3 !important; }
body[data-page="games"] .playlist-library-grid .playlist-card-footer { margin-top:auto !important; }
@media (max-width:760px) {
  body[data-page="games"] .playlist-library { padding:14px; }
  body[data-page="games"] .playlist-library-grid { grid-template-columns:1fr; }
}


.media-card[data-media-orientation="vertical"] > img,
.youtube-card[data-media-orientation="vertical"] > img { aspect-ratio:9/16 !important; object-fit:cover !important; }
.media-card[data-media-orientation="horizontal"] > img,
.youtube-card[data-media-orientation="horizontal"] > img { aspect-ratio:16/9 !important; object-fit:cover !important; }
.media-card[data-media-orientation="square"] > img,
.youtube-card[data-media-orientation="square"] > img { aspect-ratio:1/1 !important; object-fit:cover !important; }
.media-grid-videos { grid-template-columns:repeat(auto-fit,minmax(270px,1fr)) !important; }
.media-grid-shorts { grid-template-columns:repeat(auto-fill,minmax(170px,220px)) !important; justify-content:start; }
.media-grid-shorts .media-card { max-width:220px; }
.youtube-short-card { max-width:220px; }
.youtube-card small { display:block; margin-bottom:5px; color:#d88cff; font-size:.65rem; font-weight:800; text-transform:uppercase; }


.media-carousel-controls { display:flex; align-items:center; gap:8px; margin-left:auto; }
.media-carousel-button { display:grid; width:36px; height:36px; place-items:center; border:1px solid var(--line); border-radius:999px; background:rgba(255,255,255,.035); color:#fff; font-size:1.35rem; cursor:pointer; }
.media-carousel-button:hover { border-color:#bd70ff; background:rgba(157,70,255,.16); }
.media-carousel-track { display:grid !important; grid-template-columns:none !important; grid-auto-flow:column; grid-auto-columns:minmax(260px,31%); gap:14px; overflow-x:auto; overflow-y:hidden; scroll-behavior:smooth; scroll-snap-type:x mandatory; overscroll-behavior-inline:contain; scrollbar-width:thin; }
.media-carousel-track > .media-card { width:100% !important; max-width:none !important; scroll-snap-align:start; }
@media (max-width:900px) { .media-carousel-track { grid-auto-columns:minmax(250px,72%); } }
@media (max-width:560px) { .media-carousel-track { grid-auto-columns:88%; } }


.sidebar-socials { display:flex; flex-wrap:wrap; justify-content:center; gap:6px !important; }
.sidebar-socials a { width:29px !important; height:29px !important; }



.steam-card { gap: 16px !important; }
.steam-profile {
  grid-template-columns: 84px minmax(0,1fr) !important;
  column-gap: 16px !important;
  min-height: 84px;
  align-items: center !important;
}
.steam-profile > div { min-width: 0; display: grid; align-content: center; gap: 5px; }
.steam-profile img {
  width: 84px !important;
  height: 84px !important;
  box-sizing: border-box;
  padding: 3px;
  border: 2px solid rgba(192,132,252,.72) !important;
  border-radius: 13px !important;
  background: linear-gradient(145deg,rgba(126,34,206,.24),rgba(7,5,13,.96));
  box-shadow: 0 0 0 1px rgba(255,255,255,.04), 0 8px 22px rgba(0,0,0,.28), 0 0 18px rgba(168,85,247,.16);
  object-fit: cover;
}
.steam-profile h3 {
  margin: 0 !important;
  min-width: 0;
  overflow: hidden;
  font-size: 1.28rem !important;
  line-height: 1.16;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.steam-profile p {
  margin: 0 !important;
  color: var(--muted);
  line-height: 1.35;
  overflow-wrap: anywhere;
}
@media(max-width:520px){
  .steam-profile { grid-template-columns: 74px minmax(0,1fr) !important; column-gap: 13px !important; min-height:74px; }
  .steam-profile img { width:74px !important; height:74px !important; }
  .steam-profile h3 { font-size:1.12rem !important; }
}



body[data-page="dashboard"] {
  --dashboard-gap: 18px;
  --dashboard-panel-padding: 18px;
}


body[data-page="dashboard"] .page-content {
  width: min(1540px, calc(100% - 56px)) !important;
  padding-top: 26px !important;
}
body[data-page="dashboard"] .page-title-row { margin-bottom: 20px; }
body[data-page="dashboard"] .dashboard-top {
  gap: var(--dashboard-gap) !important;
}
body[data-page="dashboard"] .dashboard-columns {
  position: relative;
  isolation: isolate;
  gap: var(--dashboard-gap) !important;
  margin-top: var(--dashboard-gap) !important;
  align-items: start !important;
}
body[data-page="dashboard"] .dashboard-column {
  gap: var(--dashboard-gap) !important;
  grid-template-rows: none !important;
  align-content: start !important;
}


@media (min-width: 901px) {
  body[data-page="dashboard"] .dashboard-column > article:nth-of-type(1),
  body[data-page="dashboard"] .dashboard-column > article:nth-of-type(2),
  body[data-page="dashboard"] .dashboard-column-wide > article:nth-of-type(1),
  body[data-page="dashboard"] .dashboard-column-wide > article:nth-of-type(2) {
    height: auto !important;
    min-height: 0 !important;
  }
}


body[data-page="dashboard"] .panel {
  border-color: rgba(202,174,255,.25) !important;
  border-radius: 14px !important;
  box-shadow: 0 18px 48px rgba(0,0,0,.30), inset 0 1px 0 rgba(255,255,255,.04) !important;
}
body[data-page="dashboard"] .panel-head {
  min-height: 56px;
  padding: 16px 18px !important;
  gap: 16px !important;
}
body[data-page="dashboard"] .panel-body {
  padding: var(--dashboard-panel-padding) !important;
}
body[data-page="dashboard"] .panel-head h2 { line-height: 1.15; }


body[data-page="dashboard"] .clips-panel .panel-body {
  padding: 12px 14px 15px !important;
}
body[data-page="dashboard"] .mini-list { gap: 4px !important; }
body[data-page="dashboard"] .mini-media {
  grid-template-columns: 112px minmax(0,1fr) auto !important;
  gap: 13px !important;
  padding: 9px 8px !important;
}


body[data-page="dashboard"] .analytics-panel .panel-body {
  position: relative;
  z-index: 1;
  display: flex !important;
  min-height: 0 !important;
  flex-direction: column !important;
  padding: 16px 18px 18px !important;
  overflow: visible !important;
}
body[data-page="dashboard"] .analytics-panel .panel-head {
  position: relative;
  z-index: 2;
}
body[data-page="dashboard"] .metric-tabs {
  grid-template-columns: repeat(3,minmax(0,1fr)) !important;
  gap: 12px !important;
  margin-bottom: 12px !important;
}
body[data-page="dashboard"] .metric-tab {
  min-height: 84px;
  padding: 13px 14px !important;
  border-color: rgba(202,174,255,.28) !important;
  border-radius: 10px !important;
}
body[data-page="dashboard"] .chart-wrap {
  width: calc(100% - 8px) !important;
  min-height: 148px !important;
  height: 148px !important;
  margin-inline: 4px;
  overflow: visible !important;
}
body[data-page="dashboard"] .chart-wrap svg {
  width: 100% !important;
  min-height: 148px !important;
  height: 148px !important;
  max-height: 148px !important;
  overflow: visible !important;
}


body[data-page="dashboard"] .analytics-panel::before {
  content: "";
  position: absolute;
  right: -30px;
  bottom: -58px;
  z-index: 0;
  width: 190px;
  height: 230px;
  pointer-events: none;
  opacity: .12;
  background: url("../images/chibi/catmeow-chibi-ct1.png") center / contain no-repeat;
  filter: saturate(.75) drop-shadow(0 0 20px rgba(164,74,255,.22));
  transform: rotate(3deg);
}


body[data-page="dashboard"] .community-list { gap: 0 !important; }
body[data-page="dashboard"] .community-person {
  min-height: 48px;
  gap: 11px !important;
  padding: 5px 2px !important;
}
body[data-page="dashboard"] .community-person + .community-person {
  border-top: 1px solid rgba(202,174,255,.10);
}


body[data-page="dashboard"] .steam-panel .panel-body {
  padding: 18px 18px 20px !important;
}
body[data-page="dashboard"] .steam-card { gap: 17px !important; }
body[data-page="dashboard"] .steam-profile {
  grid-template-columns: 86px minmax(0,1fr) !important;
  column-gap: 18px !important;
  min-height: 86px !important;
}
body[data-page="dashboard"] .steam-profile img {
  width: 86px !important;
  height: 86px !important;
  padding: 4px !important;
  border: 2px solid rgba(196,126,255,.82) !important;
  border-radius: 14px !important;
}
body[data-page="dashboard"] .steam-profile > div { gap: 6px !important; }
body[data-page="dashboard"] .steam-profile h3 {
  font-size: 1.30rem !important;
  line-height: 1.18 !important;
}
body[data-page="dashboard"] .steam-profile p { line-height: 1.38 !important; }
body[data-page="dashboard"] .info-pairs { gap: 12px !important; }
body[data-page="dashboard"] .info-pairs div {
  padding: 12px 13px !important;
  border-color: rgba(202,174,255,.27) !important;
  border-radius: 9px !important;
}
body[data-page="dashboard"] .dashboard-steam-buttons {
  display: grid !important;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 10px !important;
  width: 100%;
}
body[data-page="dashboard"] .dashboard-steam-buttons .button {
  width: 100%;
  min-width: 0;
  min-height: 44px;
  padding-inline: 12px;
  line-height: 1.15;
  text-align: center;
}


body[data-page="dashboard"] .game-mix { gap: 0 !important; }
body[data-page="dashboard"] .clip-category-row {
  min-height: 62px !important;
  padding: 11px 0 !important;
  column-gap: 13px !important;
}
body[data-page="dashboard"] .youtube-grid { gap: 12px !important; }
body[data-page="dashboard"] .youtube-card {
  border-color: rgba(202,174,255,.27) !important;
  border-radius: 10px !important;
}
body[data-page="dashboard"] .youtube-card div { padding: 11px 12px 12px !important; }
body[data-page="dashboard"] .youtube-card h3 { font-size: .90rem !important; line-height: 1.25 !important; }
body[data-page="dashboard"] .youtube-card p { margin-top: 7px !important; }

@media (max-width: 1220px) {
  body[data-page="dashboard"] .page-content {
    width: min(100% - 36px, 1180px) !important;
  }
}
@media (max-width: 900px) {
  body[data-page="dashboard"] .page-content {
    width: min(100% - 24px, 1100px) !important;
    padding-top: 16px !important;
  }
  body[data-page="dashboard"] .analytics-panel::before { opacity: .08; right: -50px; }
  body[data-page="dashboard"] .metric-tabs { grid-template-columns: 1fr !important; }
}
@media (max-width: 560px) {
  body[data-page="dashboard"] .dashboard-steam-buttons { grid-template-columns: 1fr; }
  body[data-page="dashboard"] .steam-profile {
    grid-template-columns: 74px minmax(0,1fr) !important;
    column-gap: 14px !important;
    min-height: 74px !important;
  }
  body[data-page="dashboard"] .steam-profile img { width: 74px !important; height: 74px !important; }
  body[data-page="dashboard"] .analytics-panel::before { display: none; }
}



body[data-page="dashboard"] {
  --dashboard-gap-v158: 18px;
  --dashboard-pad-v158: 19px;
}

body[data-page="dashboard"] .page-content {
  width: min(1540px, calc(100% - 48px)) !important;
  padding: 24px 0 54px !important;
}


@media (min-width: 1180px) {
  
  
  
  
}

@media (min-width: 760px) and (max-width: 1179px) {
  
  
  
  
  
  
  
  
}

body[data-page="dashboard"] .dashboard-columns .panel {
  align-self: auto !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: hidden !important;
  border: 1px solid rgba(202,174,255,.30) !important;
  border-radius: 14px !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.027), transparent 34%),
    rgba(10,7,18,.97) !important;
  box-shadow: 0 16px 46px rgba(0,0,0,.32), inset 0 1px 0 rgba(255,255,255,.045) !important;
}
body[data-page="dashboard"] .dashboard-columns .panel::after {
  inset: 0 !important;
  border-radius: inherit !important;
  box-shadow: inset 0 0 0 1px rgba(190,119,255,.045) !important;
}
body[data-page="dashboard"] .dashboard-columns .panel-head {
  min-height: 55px !important;
  padding: 15px 17px !important;
}
body[data-page="dashboard"] .dashboard-columns .panel-body {
  box-sizing: border-box !important;
  min-height: 0 !important;
  max-height: none !important;
  padding: var(--dashboard-pad-v158) !important;
  overflow: visible !important;
}


body[data-page="dashboard"] .clips-panel .panel-body {
  padding: 13px 14px 15px !important;
}
body[data-page="dashboard"] .mini-list { gap: 7px !important; }
body[data-page="dashboard"] .mini-media {
  grid-template-columns: 104px minmax(0,1fr) auto !important;
  gap: 12px !important;
  padding: 8px !important;
  border-color: rgba(202,174,255,.10) !important;
  background: rgba(255,255,255,.012);
}
body[data-page="dashboard"] .mini-media img {
  width: 104px !important;
  height: 59px !important;
  border: 1px solid rgba(202,174,255,.20);
}
body[data-page="dashboard"] .mini-media h3 { white-space: normal !important; -webkit-line-clamp: 1; }


body[data-page="dashboard"] .analytics-panel .panel-body {
  position: relative !important;
  z-index: 1 !important;
  display: flex !important;
  flex-direction: column !important;
  padding: 16px 18px 17px !important;
  overflow: visible !important;
}
body[data-page="dashboard"] .metric-tabs {
  grid-template-columns: repeat(3,minmax(0,1fr)) !important;
  gap: 10px !important;
  margin: 0 0 10px !important;
}
body[data-page="dashboard"] .metric-tab {
  min-height: 78px !important;
  padding: 11px 12px !important;
  border: 1px solid rgba(202,174,255,.30) !important;
  border-radius: 10px !important;
  overflow: hidden;
}
body[data-page="dashboard"] .metric-tab strong {
  margin: 3px 0 4px !important;
  font-size: clamp(1.28rem, 1.7vw, 1.58rem) !important;
  line-height: 1 !important;
}
body[data-page="dashboard"] .metric-tab span {
  line-height: 1.18 !important;
  white-space: normal !important;
}
body[data-page="dashboard"] .chart-wrap {
  width: 100% !important;
  min-height: 188px !important;
  height: 188px !important;
  margin: 0 !important;
  overflow: visible !important;
}
body[data-page="dashboard"] .chart-wrap svg {
  display: block !important;
  width: 100% !important;
  min-height: 188px !important;
  height: 188px !important;
  max-height: 188px !important;
  overflow: visible !important;
}
body[data-page="dashboard"] .analytics-panel::before { display: none !important; }
body[data-page="dashboard"] .chart-point:hover,
body[data-page="dashboard"] .chart-point:focus { r: 6 !important; }


body[data-page="dashboard"] .steam-panel { isolation: isolate; }
body[data-page="dashboard"] .steam-panel::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  opacity: .62;
  background:
    linear-gradient(90deg, rgba(8,5,14,.88), rgba(10,6,18,.68) 56%, rgba(28,9,48,.58)),
    url("../images/brand/steam-profile-background.png") center 28% / cover no-repeat;
}
body[data-page="dashboard"] .steam-panel .panel-head,
body[data-page="dashboard"] .steam-panel .panel-body {
  position: relative;
  z-index: 1;
}
body[data-page="dashboard"] .steam-panel .panel-body {
  padding: 20px !important;
}
body[data-page="dashboard"] .steam-card {
  display: grid !important;
  gap: 16px !important;
}
body[data-page="dashboard"] .steam-profile {
  grid-template-columns: 92px minmax(0,1fr) !important;
  column-gap: 18px !important;
  align-items: center !important;
  min-height: 92px !important;
}
body[data-page="dashboard"] .steam-profile img {
  width: 92px !important;
  height: 92px !important;
  box-sizing: border-box !important;
  padding: 4px !important;
  border: 2px solid rgba(204,139,255,.86) !important;
  border-radius: 15px !important;
  background: linear-gradient(145deg,rgba(130,42,210,.27),rgba(7,5,13,.98));
  box-shadow: 0 0 0 1px rgba(255,255,255,.05), 0 10px 26px rgba(0,0,0,.32), 0 0 22px rgba(168,85,247,.17) !important;
}
body[data-page="dashboard"] .steam-profile > div {
  min-width: 0 !important;
  display: grid !important;
  gap: 7px !important;
  align-content: center !important;
}
body[data-page="dashboard"] .steam-profile h3 {
  margin: 0 !important;
  overflow: visible !important;
  font-size: clamp(1.18rem,1.6vw,1.42rem) !important;
  line-height: 1.14 !important;
  text-overflow: clip !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
}
body[data-page="dashboard"] .steam-profile p {
  margin: 0 !important;
  color: #c8b8d8 !important;
  line-height: 1.38 !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
}
body[data-page="dashboard"] .info-pairs {
  grid-template-columns: repeat(2,minmax(0,1fr)) !important;
  gap: 11px !important;
}
body[data-page="dashboard"] .info-pairs div {
  min-height: 63px !important;
  padding: 11px 12px !important;
  border: 1px solid rgba(202,174,255,.29) !important;
  border-radius: 9px !important;
  background: rgba(255,255,255,.017);
}
body[data-page="dashboard"] .info-pairs strong {
  overflow: visible !important;
  line-height: 1.24 !important;
  text-overflow: clip !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
}
body[data-page="dashboard"] .dashboard-steam-buttons {
  display: grid !important;
  grid-template-columns: repeat(2,minmax(0,1fr)) !important;
  gap: 10px !important;
  width: 100% !important;
  margin: 0 !important;
}
body[data-page="dashboard"] .dashboard-steam-buttons .button {
  box-sizing: border-box !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 46px !important;
  padding: 10px 12px !important;
  line-height: 1.16 !important;
  text-align: center !important;
  white-space: normal !important;
}


body[data-page="dashboard"] .community-list { gap: 0 !important; }
body[data-page="dashboard"] .community-person {
  min-height: 51px !important;
  padding: 6px 3px !important;
}
body[data-page="dashboard"] .community-person + .community-person {
  border-top: 1px solid rgba(202,174,255,.12);
}
body[data-page="dashboard"] .clip-category-row {
  min-height: 64px !important;
  padding: 11px 0 !important;
}


body[data-page="dashboard"] .youtube-panel .panel-body {
  padding: 16px !important;
}
body[data-page="dashboard"] .youtube-grid {
  grid-template-columns: repeat(2,minmax(0,1fr)) !important;
  gap: 11px !important;
  align-content: start !important;
}
body[data-page="dashboard"] .youtube-card {
  align-self: start !important;
  border: 1px solid rgba(202,174,255,.30) !important;
  border-radius: 10px !important;
  background: rgba(255,255,255,.017) !important;
}
body[data-page="dashboard"] .youtube-card div { padding: 10px 11px 11px !important; }
body[data-page="dashboard"] .youtube-card h3 {
  font-size: .89rem !important;
  line-height: 1.24 !important;
  -webkit-line-clamp: 2 !important;
}
body[data-page="dashboard"] .youtube-card p { margin-top: 6px !important; }
body[data-page="dashboard"] .youtube-card[data-media-orientation="vertical"] > img {
  width: 100% !important;
  max-height: 230px !important;
  aspect-ratio: 9 / 16 !important;
  object-fit: cover !important;
}

@media (max-width: 759px) {
  body[data-page="dashboard"] .page-content {
    width: min(100% - 22px, 720px) !important;
    padding-top: 15px !important;
  }
  body[data-page="dashboard"] .dashboard-columns {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
  }
  body[data-page="dashboard"] .dashboard-column {
    display: grid !important;
    grid-template-rows: none !important;
    gap: 14px !important;
  }
  body[data-page="dashboard"] .metric-tabs { grid-template-columns: 1fr !important; }
  body[data-page="dashboard"] .metric-tab { min-height: 69px !important; }
  body[data-page="dashboard"] .chart-wrap,
  body[data-page="dashboard"] .chart-wrap svg {
    min-height: 176px !important;
    height: 176px !important;
    max-height: 176px !important;
  }
  body[data-page="dashboard"] .steam-profile {
    grid-template-columns: 78px minmax(0,1fr) !important;
    column-gap: 14px !important;
    min-height: 78px !important;
  }
  body[data-page="dashboard"] .steam-profile img {
    width: 78px !important;
    height: 78px !important;
  }
  body[data-page="dashboard"] .dashboard-steam-buttons,
  body[data-page="dashboard"] .info-pairs,
  body[data-page="dashboard"] .youtube-grid { grid-template-columns: 1fr !important; }
  body[data-page="dashboard"] .steam-panel::before { opacity: .5; }
}


body[data-page="dashboard"] .home-screenshot-mount {
  width: 100% !important;
  margin-top: 30px !important;
}
@media (max-width: 759px) {
  body[data-page="dashboard"] .home-screenshot-mount { margin-top: 20px !important; }
}



body[data-page] {
  --site-edge: clamp(18px, 2vw, 32px);
  --section-gap: clamp(16px, 1.25vw, 20px);
  --panel-pad-x: clamp(16px, 1.15vw, 20px);
  --panel-pad-y: clamp(16px, 1.05vw, 19px);
  --inner-gap: clamp(10px, .85vw, 14px);
  --inner-pad: clamp(13px, .95vw, 17px);
}


body[data-page] .page-content {
  width: min(1540px, calc(100% - (var(--site-edge) * 2))) !important;
  padding-top: clamp(18px, 1.6vw, 26px) !important;
  padding-bottom: clamp(44px, 4vw, 64px) !important;
}
body[data-page] .page-title-row {
  margin-bottom: var(--section-gap) !important;
}
body[data-page] .content-section,
body[data-page] .site-screenshot-page-mount,
body[data-page] .project-screenshot-mount {
  margin-top: var(--section-gap) !important;
}


body[data-page] .panel {
  box-sizing: border-box !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  border-color: rgba(202,174,255,.28) !important;
  background-clip: padding-box !important;
}
body[data-page] .panel-head {
  box-sizing: border-box !important;
  min-height: 56px !important;
  padding: 15px var(--panel-pad-x) !important;
  gap: var(--inner-gap) !important;
}
body[data-page] .panel-head h1,
body[data-page] .panel-head h2,
body[data-page] .panel-head h3 {
  min-width: 0 !important;
  line-height: 1.18 !important;
  overflow-wrap: anywhere;
}
body[data-page] .panel-body {
  box-sizing: border-box !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  padding: var(--panel-pad-y) var(--panel-pad-x) !important;
  overflow: visible !important;
}
body[data-page] .panel-body > :first-child { margin-top: 0 !important; }
body[data-page] .panel-body > :last-child { margin-bottom: 0 !important; }


body[data-page] .dashboard-top,
body[data-page] .dashboard-columns,
body[data-page] .dashboard-column,
body[data-page] .page-grid,
body[data-page] .copy-grid,
body[data-page] .column-stack,
body[data-page] .media-grid,
body[data-page] .playlist-grid,
body[data-page] .recommendations-grid,
body[data-page] .tool-link-grid,
body[data-page] .support-link-grid,
body[data-page] .tools-board,
body[data-page] .project-grid,
body[data-page] .project-grid-v4,
body[data-page] .project-showcase,
body[data-page] .support-action-grid,
body[data-page] .medal-grid,
body[data-page] .gallery-grid,
body[data-page] .cs2-link-card-grid,
body[data-page] .cs2-tool-grid,
body[data-page] .real-project-information,
body[data-page] .project-package-grid,
body[data-page] .project-verification-stats,
body[data-page] .cms-screenshot-grid {
  gap: var(--section-gap) !important;
}
body[data-page] .dashboard-columns { margin-top: var(--section-gap) !important; }
body[data-page] .dashboard-column { align-content: start !important; }


body[data-page] :is(
  .metric,
  .metric-tab,
  .info-pairs > div,
  .copy-card,
  .recommendation-card,
  .tool-link-card,
  .support-link-card,
  .tool-card-pro,
  .project-grid > article,
  .project-card-v4,
  .project-feature,
  .project-overview-card,
  .project-info-panel,
  .project-package-panel,
  .project-verification-panel,
  .project-engagement,
  .project-qa,
  .support-action,
  .cs2-service-card,
  .cs2-link-card,
  .crosshair-card,
  .code-card,
  .real-project,
  .gallery-grid figure,
  .site-screenshot-gallery,
  .cms-screenshot-grid figure
) {
  box-sizing: border-box !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  border-color: rgba(202,174,255,.27) !important;
  background-clip: padding-box !important;
}

body[data-page] :is(
  .metric,
  .metric-tab,
  .info-pairs > div,
  .copy-card,
  .recommendation-card,
  .tool-link-card,
  .support-link-card,
  .tool-card-pro,
  .project-grid > article,
  .project-feature,
  .project-info-panel,
  .project-package-panel,
  .project-verification-panel,
  .project-engagement,
  .project-qa,
  .support-action,
  .cs2-service-card,
  .cs2-link-card,
  .crosshair-card,
  .code-card
) {
  padding: var(--inner-pad) !important;
}


body[data-page] .media-card,
body[data-page] .playlist-card,
body[data-page] .youtube-card,
body[data-page] .project-card-v4,
body[data-page] .project-overview-card,
body[data-page] .gallery-grid figure,
body[data-page] .cms-screenshot-grid figure {
  overflow: hidden !important;
}
body[data-page] .media-card-copy,
body[data-page] .playlist-card-copy,
body[data-page] .youtube-card > div,
body[data-page] .project-body-v4,
body[data-page] .gallery-grid figcaption,
body[data-page] .cms-screenshot-grid figcaption {
  padding: var(--inner-pad) !important;
}


body[data-page] :is(
  .panel,
  .panel-body,
  .copy-card,
  .tool-card-copy,
  .project-body-v4,
  .media-card-copy,
  .playlist-card-copy,
  .youtube-card > div,
  .project-info-panel,
  .project-package-panel,
  .project-verification-panel
) :is(h1,h2,h3,h4,p,span,strong,small,li) {
  max-width: 100%;
  overflow-wrap: anywhere;
}
body[data-page] .button,
body[data-page] button,
body[data-page] input,
body[data-page] textarea,
body[data-page] select {
  box-sizing: border-box !important;
  max-width: 100%;
}
body[data-page] .button {
  min-height: 42px !important;
  padding: 9px 14px !important;
  line-height: 1.2 !important;
  white-space: normal !important;
}
body[data-page] :is(
  .button-row,
  .tool-actions,
  .project-actions-v4,
  .real-project-main-actions,
  .project-footer-actions,
  .project-qa-tools,
  .dialog-actions,
  .dashboard-steam-buttons
) {
  gap: var(--inner-gap) !important;
}


body[data-page="dashboard"] .dashboard-column,
body[data-page="dashboard"] .dashboard-column > .panel,
body[data-page="dashboard"] .dashboard-columns .panel,
body[data-page="dashboard"] .steam-panel,
body[data-page="dashboard"] .analytics-panel,
body[data-page="dashboard"] .clips-panel,
body[data-page="dashboard"] .youtube-panel {
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
}
body[data-page="dashboard"] .dashboard-column {
  grid-template-rows: none !important;
}
body[data-page="dashboard"] .dashboard-columns .panel-body {
  padding: var(--panel-pad-y) var(--panel-pad-x) !important;
}
body[data-page="dashboard"] .mini-list,
body[data-page="dashboard"] .steam-card,
body[data-page="dashboard"] .game-mix,
body[data-page="dashboard"] .community-list {
  gap: var(--inner-gap) !important;
}
body[data-page="dashboard"] .mini-media {
  min-height: 76px !important;
  padding: 9px !important;
  gap: 13px !important;
  border: 1px solid rgba(202,174,255,.13) !important;
}
body[data-page="dashboard"] .metric-tabs {
  gap: var(--inner-gap) !important;
  margin-bottom: var(--inner-gap) !important;
}
body[data-page="dashboard"] .metric-tab {
  min-height: 82px !important;
  padding: 12px 13px !important;
  overflow: visible !important;
}
body[data-page="dashboard"] .analytics-panel .panel-body {
  padding-bottom: 18px !important;
}
body[data-page="dashboard"] .chart-wrap,
body[data-page="dashboard"] .chart-wrap svg {
  width: 100% !important;
  min-height: 176px !important;
  height: 176px !important;
  max-height: 176px !important;
  margin: 0 !important;
  overflow: visible !important;
}
body[data-page="dashboard"] .steam-panel .panel-body {
  padding: 20px !important;
}
body[data-page="dashboard"] .steam-card { gap: 17px !important; }
body[data-page="dashboard"] .steam-profile {
  grid-template-columns: 90px minmax(0,1fr) !important;
  gap: 18px !important;
  min-height: 90px !important;
}
body[data-page="dashboard"] .steam-profile img {
  width: 90px !important;
  height: 90px !important;
}
body[data-page="dashboard"] .info-pairs { gap: 12px !important; }
body[data-page="dashboard"] .info-pairs > div {
  min-height: 66px !important;
  padding: 12px 13px !important;
}
body[data-page="dashboard"] .dashboard-steam-buttons {
  display: grid !important;
  grid-template-columns: repeat(2,minmax(0,1fr)) !important;
  width: 100% !important;
  margin: 0 !important;
}
body[data-page="dashboard"] .dashboard-steam-buttons .button {
  width: 100% !important;
  min-width: 0 !important;
  min-height: 46px !important;
}
body[data-page="dashboard"] .youtube-grid { gap: 12px !important; }
body[data-page="dashboard"] .youtube-card > div { padding: 11px 12px 13px !important; }
body[data-page="dashboard"] .community-person,
body[data-page="dashboard"] .clip-category-row {
  box-sizing: border-box !important;
  min-height: 58px !important;
  padding: 9px 3px !important;
}


body[data-page] .site-screenshot-gallery .panel-body {
  padding: var(--panel-pad-y) var(--panel-pad-x) !important;
}
body[data-page] .cms-screenshot-grid figure figcaption {
  min-height: 0 !important;
  padding: 13px 14px 15px !important;
}

@media (max-width: 900px) {
  body[data-page] {
    --site-edge: 15px;
    --section-gap: 15px;
    --panel-pad-x: 16px;
    --panel-pad-y: 16px;
    --inner-pad: 14px;
  }
  body[data-page] .page-content {
    width: calc(100% - (var(--site-edge) * 2)) !important;
  }
}

@media (max-width: 560px) {
  body[data-page] {
    --site-edge: 11px;
    --section-gap: 13px;
    --panel-pad-x: 14px;
    --panel-pad-y: 14px;
    --inner-pad: 13px;
  }
  body[data-page] .panel-head {
    min-height: 52px !important;
    padding: 13px 14px !important;
  }
  body[data-page="dashboard"] .steam-profile {
    grid-template-columns: 76px minmax(0,1fr) !important;
    gap: 14px !important;
    min-height: 76px !important;
  }
  body[data-page="dashboard"] .steam-profile img {
    width: 76px !important;
    height: 76px !important;
  }
  body[data-page="dashboard"] .dashboard-steam-buttons,
  body[data-page="dashboard"] .info-pairs,
  body[data-page="dashboard"] .youtube-grid,
  body[data-page="dashboard"] .metric-tabs {
    grid-template-columns: 1fr !important;
  }
  body[data-page="dashboard"] .chart-wrap,
  body[data-page="dashboard"] .chart-wrap svg {
    min-height: 168px !important;
    height: 168px !important;
    max-height: 168px !important;
  }
}




body[data-page] {
  --site-edge: clamp(18px, 1.8vw, 30px);
  --section-gap: 18px;
  --inner-gap: 12px;
}

body[data-page] :is(
  .dashboard-top,
  .dashboard-columns,
  .dashboard-column,
  .recommendations-grid,
  .support-action-grid,
  .tools-board,
  .project-grid,
  .project-grid-v4,
  .media-grid,
  .playlist-grid,
  .youtube-grid,
  .gallery-grid,
  .copy-grid,
  .sponsor-layout
) {
  gap: var(--section-gap) !important;
}

body[data-page] .content-section,
body[data-page="dashboard"] .dashboard-columns,
body[data-page="dashboard"] .home-screenshot-mount {
  margin-top: var(--section-gap) !important;
}


body[data-page="support"] .support-action-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  align-items: stretch !important;
}
body[data-page="support"] .support-action {
  width: 100% !important;
  min-height: 0 !important;
  padding: 20px !important;
  gap: 16px !important;
}


body[data-page="dashboard"] .metric-tabs {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: var(--inner-gap) !important;
  margin-bottom: 10px !important;
}
body[data-page="dashboard"] .metric-tab {
  min-height: 72px !important;
  padding: 10px 11px !important;
  border: 1px solid rgba(202,174,255,.30) !important;
  border-radius: 10px !important;
  overflow: visible !important;
}
body[data-page="dashboard"] .metric-tab strong {
  margin: 2px 0 !important;
  font-size: clamp(1.15rem, 1.45vw, 1.34rem) !important;
  line-height: 1.06 !important;
}
body[data-page="dashboard"] .metric-tab span,
body[data-page="dashboard"] .metric-tab small {
  line-height: 1.16 !important;
}
body[data-page="dashboard"] .metric-tab-total {
  cursor: default !important;
  background: linear-gradient(135deg, rgba(93,39,150,.18), rgba(255,255,255,.02)) !important;
}
body[data-page="dashboard"] .analytics-panel .panel-body {
  padding: 14px 16px 15px !important;
}
body[data-page="dashboard"] .chart-wrap,
body[data-page="dashboard"] .chart-wrap svg {
  width: 100% !important;
  min-height: 132px !important;
  height: 132px !important;
  max-height: 132px !important;
  margin: 0 !important;
  overflow: visible !important;
}


@media (min-width: 1180px) {
  body[data-page="dashboard"] .youtube-card > img {
    height: 88px !important;
    aspect-ratio: auto !important;
    object-fit: cover !important;
  }
  body[data-page="dashboard"] .youtube-card > div {
    padding: 9px 10px 10px !important;
  }
  body[data-page="dashboard"] .youtube-card h3 {
    font-size: .84rem !important;
    line-height: 1.18 !important;
    -webkit-line-clamp: 2 !important;
  }
  body[data-page="dashboard"] .youtube-card p {
    margin-top: 4px !important;
    font-size: .72rem !important;
  }
}


body[data-page="recommendations"] .recommendation-card.live,
body[data-page="recommendations"] .recommendation-card.live:hover {
  border: 2px solid #ff4f9a !important;
  background: linear-gradient(135deg, rgba(255,79,154,.11), rgba(121,48,210,.08), var(--panel)) !important;
  box-shadow: 0 0 0 1px rgba(255,255,255,.035), 0 0 24px rgba(255,79,154,.20) !important;
}
body[data-page="recommendations"] .recommendation-card.live::after {
  content: "LIVE";
  position: absolute;
  top: 10px;
  right: 11px;
  padding: 3px 7px;
  border: 1px solid rgba(255,110,170,.75);
  border-radius: 999px;
  background: rgba(38,8,24,.92);
  color: #ff83b8;
  font-size: .67rem;
  font-weight: 800;
  letter-spacing: .06em;
}
body[data-page="recommendations"] .recommendation-card {
  position: relative !important;
}
body[data-page="dashboard"] .community-person.is-live {
  margin: 2px 0 !important;
  padding: 7px 8px !important;
  border: 1px solid rgba(255,79,154,.76) !important;
  border-radius: 9px !important;
  background: linear-gradient(90deg, rgba(255,79,154,.09), transparent 70%) !important;
  box-shadow: inset 3px 0 0 #ff4f9a, 0 0 15px rgba(255,79,154,.09) !important;
}

@media (max-width: 1179px) {
  body[data-page="dashboard"] .metric-tabs {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  body[data-page="dashboard"] .chart-wrap,
  body[data-page="dashboard"] .chart-wrap svg {
    min-height: 148px !important;
    height: 148px !important;
    max-height: 148px !important;
  }
}
@media (max-width: 760px) {
  body[data-page="support"] .support-action-grid {
    grid-template-columns: 1fr !important;
  }
}
@media (max-width: 560px) {
  body[data-page="dashboard"] .metric-tabs {
    grid-template-columns: 1fr !important;
  }
}



body[data-page="dashboard"] .platform-audience-stats {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
  margin:0 0 12px;
}
body[data-page="dashboard"] .audience-stat {
  display:flex;
  min-width:0;
  min-height:78px;
  flex-direction:column;
  justify-content:center;
  padding:12px 14px;
  border:1px solid rgba(202,174,255,.28);
  border-radius:10px;
  background:rgba(255,255,255,.025);
}
body[data-page="dashboard"] .audience-stat small {
  color:#cf8cff;
  font-size:.68rem;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
}
body[data-page="dashboard"] .audience-stat strong { margin:3px 0 1px; font-size:1.42rem; line-height:1; }
body[data-page="dashboard"] .audience-stat span { color:var(--soft); font-size:.76rem; line-height:1.25; }
body[data-page="dashboard"] .audience-stat-pending { border-style:dashed; opacity:.78; }
body[data-page="dashboard"] .audience-stat.is-unavailable strong { color:var(--soft); }


.media-grid-shorts {
  display:grid !important;
  grid-template-columns:repeat(auto-fill,minmax(178px,220px)) !important;
  align-items:start !important;
  justify-content:start !important;
  gap:14px !important;
}
.media-grid-shorts .media-card,
.media-card.media-card-vertical,
.media-card[data-media-orientation="vertical"],
.youtube-card.youtube-card-short,
.youtube-card[data-media-orientation="vertical"] {
  width:100% !important;
  max-width:220px !important;
  align-self:start !important;
}
.media-grid-shorts .media-card > img,
.media-card.media-card-vertical > img,
.media-card[data-media-orientation="vertical"] > img,
.youtube-card.youtube-card-short > img,
.youtube-card[data-media-orientation="vertical"] > img {
  width:100% !important;
  aspect-ratio:9/16 !important;
  object-fit:cover !important;
}
.media-grid-videos .media-card,
.media-card.media-card-horizontal,
.media-card[data-media-orientation="horizontal"] {
  width:100% !important;
  max-width:none !important;
}
.media-grid-videos .media-card > img,
.media-card.media-card-horizontal > img,
.media-card[data-media-orientation="horizontal"] > img {
  aspect-ratio:16/9 !important;
}
@media (max-width:760px) {
  body[data-page="dashboard"] .platform-audience-stats { grid-template-columns:1fr; }
  .media-grid-shorts { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
  .media-grid-shorts .media-card { max-width:none !important; }
}
@media (max-width:430px) {
  .media-grid-shorts { grid-template-columns:1fr !important; }
  .media-grid-shorts .media-card { width:min(100%,220px) !important; }
}



body[data-page="dashboard"] .page-content{width:min(1500px,calc(100% - 48px))!important;padding-top:22px!important}
body[data-page="dashboard"] .page-title-row{margin-bottom:18px!important}
body[data-page="dashboard"] .dashboard-top{grid-template-columns:minmax(360px,5fr) minmax(560px,7fr)!important;gap:16px!important}
body[data-page="dashboard"] .dashboard-columns{grid-template-columns:minmax(300px,.9fr) minmax(520px,1.45fr) minmax(300px,.9fr)!important;gap:16px!important;align-items:start!important}
body[data-page="dashboard"] .dashboard-column{gap:16px!important}
body[data-page="dashboard"] .panel-head{min-height:52px!important;padding:14px 16px!important}
body[data-page="dashboard"] .panel-body{padding:16px!important}


body[data-page="dashboard"] .clips-panel .panel-body{padding:10px 12px 13px!important}
body[data-page="dashboard"] .mini-list{display:grid!important;gap:8px!important}
body[data-page="dashboard"] .mini-media{display:grid!important;grid-template-columns:104px minmax(0,1fr) auto!important;align-items:center!important;gap:12px!important;min-height:78px!important;padding:8px!important;border:1px solid rgba(202,174,255,.16)!important;border-radius:9px!important;background:rgba(255,255,255,.018)!important}
body[data-page="dashboard"] .mini-media img{width:104px!important;height:58px!important;aspect-ratio:16/9!important;object-fit:cover!important;border-radius:7px!important}
body[data-page="dashboard"] .mini-media h3{margin:2px 0 3px!important;font-size:.94rem!important;line-height:1.16!important;display:-webkit-box!important;-webkit-line-clamp:2!important;-webkit-box-orient:vertical!important;overflow:hidden!important}
body[data-page="dashboard"] .mini-media p,body[data-page="dashboard"] .mini-media small{font-size:.72rem!important;line-height:1.25!important}


body[data-page="dashboard"] .profile-layout{grid-template-columns:96px minmax(0,1fr)!important;gap:20px!important;align-items:center!important}
body[data-page="dashboard"] .profile-avatar-wrap,body[data-page="dashboard"] .profile-avatar{width:96px!important;height:96px!important}
body[data-page="dashboard"] .profile-copy h2{font-size:1.8rem!important;line-height:1!important}
body[data-page="dashboard"] .steam-profile{grid-template-columns:82px minmax(0,1fr)!important;gap:17px!important;align-items:center!important}
body[data-page="dashboard"] .steam-profile img{width:82px!important;height:82px!important}
body[data-page="dashboard"] .dashboard-steam-buttons{grid-template-columns:1fr 1fr!important}


body[data-page="dashboard"] .analytics-panel .panel-body{padding:14px 16px 16px!important}
body[data-page="dashboard"] .metric-tabs{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:10px!important;margin:0 0 10px!important}
body[data-page="dashboard"] .metric-tab{min-height:82px!important;padding:12px!important;border-radius:9px!important}
body[data-page="dashboard"] .metric-tab strong{font-size:1.45rem!important}
body[data-page="dashboard"] .chart-wrap{width:100%!important;height:164px!important;min-height:164px!important;margin:0!important;padding:0 2px!important}
body[data-page="dashboard"] .chart-wrap svg{width:100%!important;height:164px!important;min-height:164px!important;max-height:164px!important}
body[data-page="dashboard"] .platform-audience-stats{display:none!important}
body[data-page="dashboard"] .platform-audience-inline{display:flex!important;align-items:stretch!important;justify-content:center!important;gap:0!important;margin-top:11px!important;padding-top:11px!important;border-top:1px solid rgba(202,174,255,.14)!important}
body[data-page="dashboard"] .platform-audience-item{display:flex!important;align-items:center!important;gap:9px!important;min-width:0!important;padding:0 18px!important}
body[data-page="dashboard"] .platform-audience-item+.platform-audience-item{border-left:1px solid rgba(202,174,255,.14)!important}
body[data-page="dashboard"] .platform-icon{display:grid!important;place-items:center!important;width:28px!important;height:28px!important;flex:0 0 28px!important;border:1px solid rgba(202,174,255,.28)!important;border-radius:50%!important;font-size:.76rem!important;font-weight:800!important;background:rgba(255,255,255,.035)!important}
body[data-page="dashboard"] .platform-audience-item.twitch .platform-icon{color:#bf8cff!important}
body[data-page="dashboard"] .platform-audience-item.youtube .platform-icon{color:#ff5e79!important}
body[data-page="dashboard"] .platform-audience-item.tiktok .platform-icon{color:#75f2ef!important}
body[data-page="dashboard"] .platform-audience-copy{display:grid!important;min-width:0!important;line-height:1.05!important}
body[data-page="dashboard"] .platform-audience-copy small{color:var(--muted)!important;font-size:.62rem!important;font-weight:700!important;text-transform:uppercase!important;letter-spacing:.07em!important}
body[data-page="dashboard"] .platform-audience-copy strong{font-size:1.02rem!important;line-height:1.1!important}
body[data-page="dashboard"] .platform-audience-copy span{color:var(--soft)!important;font-size:.62rem!important;white-space:nowrap!important}
body[data-page="dashboard"] .platform-audience-item.pending{opacity:.68!important}


body[data-page="dashboard"] .analytics-panel::before{display:none!important}


body[data-page="dashboard"] .youtube-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important}
body[data-page="dashboard"] .youtube-card{max-width:none!important}
body[data-page="dashboard"] .youtube-card>img{aspect-ratio:16/9!important;height:auto!important;object-fit:cover!important}

@media(max-width:1180px){body[data-page="dashboard"] .dashboard-columns{grid-template-columns:1fr 1.35fr!important}body[data-page="dashboard"] .dashboard-column:last-child{grid-column:1/-1!important;display:grid!important;grid-template-columns:1fr 1fr!important}}
@media(max-width:900px){body[data-page="dashboard"] .page-content{width:min(100% - 28px,900px)!important}body[data-page="dashboard"] .dashboard-top,body[data-page="dashboard"] .dashboard-columns{grid-template-columns:1fr!important}body[data-page="dashboard"] .dashboard-column:last-child{grid-column:auto!important;display:grid!important;grid-template-columns:1fr!important}body[data-page="dashboard"] .platform-audience-inline{flex-wrap:wrap!important;row-gap:10px!important}body[data-page="dashboard"] .platform-audience-item{padding:0 12px!important}}
@media(max-width:620px){body[data-page="dashboard"] .metric-tabs{grid-template-columns:1fr 1fr!important}body[data-page="dashboard"] .mini-media{grid-template-columns:92px minmax(0,1fr)!important}body[data-page="dashboard"] .mini-media>time,body[data-page="dashboard"] .mini-media>.mini-date{display:none!important}body[data-page="dashboard"] .platform-audience-inline{display:grid!important;grid-template-columns:1fr!important}body[data-page="dashboard"] .platform-audience-item{padding:8px 0!important}body[data-page="dashboard"] .platform-audience-item+.platform-audience-item{border-left:0!important;border-top:1px solid rgba(202,174,255,.12)!important}}



body[data-page="dashboard"] .dashboard-columns{
  display:grid!important;
  grid-template-columns:minmax(300px,.9fr) minmax(520px,1.45fr) minmax(300px,.9fr)!important;
  grid-template-rows:auto auto!important;
  gap:16px!important;
  align-items:stretch!important;
  margin-bottom:16px!important;
}
body[data-page="dashboard"] .dashboard-columns>.dashboard-column{display:contents!important}
body[data-page="dashboard"] .clips-panel{grid-column:1!important;grid-row:1!important;height:100%!important}
body[data-page="dashboard"] .steam-panel{grid-column:1!important;grid-row:2!important;height:100%!important}
body[data-page="dashboard"] .analytics-panel{grid-column:2!important;grid-row:1!important;height:100%!important}
body[data-page="dashboard"] .games-panel{grid-column:2!important;grid-row:2!important;height:100%!important}
body[data-page="dashboard"] .community-panel{grid-column:3!important;grid-row:1!important;height:100%!important}
body[data-page="dashboard"] .youtube-panel{grid-column:3!important;grid-row:2!important;height:100%!important}
body[data-page="dashboard"] .clips-panel .panel-body,
body[data-page="dashboard"] .analytics-panel .panel-body,
body[data-page="dashboard"] .community-panel .panel-body,
body[data-page="dashboard"] .steam-panel .panel-body,
body[data-page="dashboard"] .games-panel .panel-body,
body[data-page="dashboard"] .youtube-panel .panel-body{height:100%!important;box-sizing:border-box!important}
body[data-page="dashboard"] .home-screenshot-mount{margin-top:0!important;padding-top:0!important}
body[data-page="dashboard"] .site-screenshot-page-mount:empty{display:none!important}
@media(max-width:1180px){
 body[data-page="dashboard"] .dashboard-columns{grid-template-columns:1fr 1.35fr!important;grid-template-rows:auto auto auto!important}
 body[data-page="dashboard"] .clips-panel{grid-column:1!important;grid-row:1!important}
 body[data-page="dashboard"] .analytics-panel{grid-column:2!important;grid-row:1!important}
 body[data-page="dashboard"] .steam-panel{grid-column:1!important;grid-row:2!important}
 body[data-page="dashboard"] .games-panel{grid-column:2!important;grid-row:2!important}
 body[data-page="dashboard"] .community-panel{grid-column:1!important;grid-row:3!important}
 body[data-page="dashboard"] .youtube-panel{grid-column:2!important;grid-row:3!important}
}
@media(max-width:900px){
 body[data-page="dashboard"] .dashboard-columns{grid-template-columns:1fr!important;grid-template-rows:auto!important}
 body[data-page="dashboard"] .dashboard-columns>.dashboard-column{display:contents!important}
 body[data-page="dashboard"] .clips-panel,
 body[data-page="dashboard"] .analytics-panel,
 body[data-page="dashboard"] .community-panel,
 body[data-page="dashboard"] .steam-panel,
 body[data-page="dashboard"] .games-panel,
 body[data-page="dashboard"] .youtube-panel{grid-column:1!important;grid-row:auto!important}
}


@media (min-width: 1180px) {
  
  
  
  
  
  
  
  

  
  
  
}


body[data-page="dashboard"] .home-screenshot-mount,
body[data-page="dashboard"] [data-site-screenshots] {
  margin-top: 18px !important;
  margin-bottom: 0 !important;
}
body[data-page="dashboard"] .home-screenshot-mount + .content-section,
body[data-page="dashboard"] [data-site-screenshots] + .content-section {
  margin-top: 18px !important;
}


body[data-page="dashboard"] .platform-audience-inline {
  display: grid !important;
  grid-template-columns: repeat(3,minmax(0,1fr)) !important;
  gap: 10px !important;
  margin-top: 10px !important;
  padding-top: 10px !important;
  border-top: 1px solid rgba(202,174,255,.18) !important;
}
body[data-page="dashboard"] .platform-audience-item {
  min-width: 0 !important;
  display: grid !important;
  grid-template-columns: 30px minmax(0,1fr) !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 7px 8px !important;
  border: 1px solid rgba(202,174,255,.12) !important;
  border-radius: 9px !important;
  background: rgba(255,255,255,.012) !important;
}
body[data-page="dashboard"] .platform-audience-item .platform-icon {
  width: 30px !important;
  height: 30px !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 50% !important;
  border: 1px solid rgba(202,174,255,.28) !important;
}
body[data-page="dashboard"] .platform-audience-copy {
  display: grid !important;
  grid-template-columns: auto 1fr !important;
  column-gap: 6px !important;
  align-items: baseline !important;
}
body[data-page="dashboard"] .platform-audience-copy small { grid-column: 1; }
body[data-page="dashboard"] .platform-audience-copy strong { grid-column: 2; font-size: 1rem !important; }
body[data-page="dashboard"] .platform-audience-copy > span { grid-column: 1 / -1; opacity: .72; }

@media (max-width: 760px) {
  body[data-page="dashboard"] .platform-audience-inline { grid-template-columns: 1fr !important; }
}


@media (min-width:1180px){
  body[data-page="dashboard"] .page-content{
    width:min(1680px,calc(100% - 44px))!important;
  }
  body[data-page="dashboard"] .dashboard-top{
    grid-template-columns:minmax(430px,1.02fr) minmax(650px,1.58fr)!important;
    gap:18px!important;
  }
  
  body[data-page="dashboard"] .steam-panel .panel-body{
    padding:18px!important;
    display:flex!important;
    flex-direction:column!important;
    justify-content:space-between!important;
    gap:16px!important;
  }
  body[data-page="dashboard"] .steam-profile{
    grid-template-columns:98px minmax(0,1fr)!important;
    gap:20px!important;
  }
  body[data-page="dashboard"] .steam-profile img{
    width:98px!important;
    height:98px!important;
  }
  body[data-page="dashboard"] .steam-profile h3{font-size:1.36rem!important;line-height:1.1!important}
  body[data-page="dashboard"] .info-pairs{gap:12px!important}
  body[data-page="dashboard"] .info-pairs>div{min-height:86px!important;padding:15px!important}
  body[data-page="dashboard"] .dashboard-steam-buttons{gap:12px!important}
  body[data-page="dashboard"] .dashboard-steam-buttons .button{min-height:52px!important;padding:13px 12px!important}

  body[data-page="dashboard"] .games-panel .panel-body{
    display:flex!important;
    align-items:center!important;
    padding:18px!important;
  }
  body[data-page="dashboard"] .games-panel .game-mix{width:100%!important}

  body[data-page="dashboard"] .community-panel .panel-body,
  body[data-page="dashboard"] .youtube-panel .panel-body{padding:12px!important}
  body[data-page="dashboard"] .community-list{gap:0!important}
  body[data-page="dashboard"] .community-item{padding:10px 6px!important}
  body[data-page="dashboard"] .youtube-grid{grid-template-columns:1fr!important;gap:10px!important}
  body[data-page="dashboard"] .youtube-card{
    display:grid!important;
    grid-template-columns:112px minmax(0,1fr)!important;
    min-height:78px!important;
  }
  body[data-page="dashboard"] .youtube-card>img{
    width:112px!important;
    height:100%!important;
    min-height:78px!important;
    aspect-ratio:auto!important;
    object-fit:cover!important;
  }
  body[data-page="dashboard"] .youtube-card>div{padding:9px!important}
  body[data-page="dashboard"] .youtube-card h3{-webkit-line-clamp:2!important;font-size:.82rem!important}

  body[data-page="dashboard"] .home-screenshot-mount,
  body[data-page="dashboard"] [data-site-screenshots]{margin-top:14px!important}
}


body[data-page="dashboard"] .platform-audience-inline{
  display:flex!important;
  justify-content:center!important;
  align-items:center!important;
  gap:22px!important;
  padding:10px 0 0!important;
  margin-top:10px!important;
  border-top:1px solid rgba(202,174,255,.16)!important;
}
body[data-page="dashboard"] .platform-audience-item{
  display:flex!important;
  align-items:center!important;
  gap:8px!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
}
body[data-page="dashboard"] .platform-audience-item+.platform-audience-item{border-left:0!important}
body[data-page="dashboard"] .platform-audience-item .platform-icon{
  width:25px!important;height:25px!important;flex:0 0 25px!important;
  border-radius:50%!important;
}
body[data-page="dashboard"] .platform-audience-copy{
  display:grid!important;
  grid-template-columns:auto auto!important;
  column-gap:5px!important;
  align-items:baseline!important;
}
body[data-page="dashboard"] .platform-audience-copy small{grid-column:1!important}
body[data-page="dashboard"] .platform-audience-copy strong{grid-column:2!important;font-size:.94rem!important}
body[data-page="dashboard"] .platform-audience-copy>span{grid-column:1/-1!important;font-size:.58rem!important}
@media(max-width:760px){body[data-page="dashboard"] .platform-audience-inline{display:grid!important;grid-template-columns:1fr!important;gap:8px!important}}



@media (min-width:1181px){
 
 body[data-page="dashboard"] .steam-panel{min-height:410px!important}
 body[data-page="dashboard"] .games-panel{min-height:410px!important}
 body[data-page="dashboard"] .youtube-panel{min-height:410px!important}
}
body[data-page="dashboard"] .steam-card{display:flex!important;flex-direction:column!important;height:100%!important;padding:22px!important;gap:18px!important}
body[data-page="dashboard"] .steam-profile{display:grid!important;grid-template-columns:112px 1fr!important;align-items:center!important;gap:20px!important}
body[data-page="dashboard"] .steam-profile img{width:112px!important;height:112px!important;border-radius:18px!important}
body[data-page="dashboard"] .steam-profile h3{font-size:1.65rem!important;margin:0 0 4px!important}
body[data-page="dashboard"] .steam-card .info-pairs{margin-top:auto!important;grid-template-columns:1fr 1fr!important;gap:12px!important}
body[data-page="dashboard"] .steam-card .info-pairs>div{min-height:84px!important;padding:15px!important}
body[data-page="dashboard"] .dashboard-steam-buttons{grid-template-columns:1fr 1.15fr!important;margin-top:0!important}
body[data-page="dashboard"] .analytics-panel .metric-tab{cursor:default!important}
body[data-page="dashboard"] .analytics-panel .metric-tab:disabled{opacity:1!important}
body[data-page="dashboard"] .chart-wrap{min-height:260px!important}
body[data-page="dashboard"] [data-performance-chart]{width:100%!important;height:300px!important;display:block!important}
body[data-page="dashboard"] .games-panel .panel-body{padding:10px 18px!important}
body[data-page="dashboard"] .content-category-row{min-height:64px!important}
body[data-page="dashboard"] .youtube-panel .youtube-card{grid-template-columns:112px 1fr!important;min-height:86px!important}
body[data-page="dashboard"] .screenshots-panel{margin-top:16px!important}


body[data-page="dashboard"] .dashboard-columns{grid-template-columns:minmax(390px,1.14fr) minmax(500px,1.28fr) minmax(285px,.78fr)!important;gap:16px!important}
body[data-page="dashboard"] [data-chart-metric]{min-height:82px!important;padding:14px 16px!important}
body[data-page="dashboard"] .chart-wrap{height:132px!important;min-height:132px!important;max-height:132px!important;margin-top:6px!important}
body[data-page="dashboard"] [data-performance-chart],body[data-page="dashboard"] .chart-wrap svg{height:132px!important;min-height:132px!important;max-height:132px!important}
body[data-page="dashboard"] .steam-profile{grid-template-columns:132px minmax(0,1fr)!important;gap:22px!important;min-height:150px!important}
body[data-page="dashboard"] .steam-profile img{width:132px!important;height:132px!important;border-radius:20px!important}
body[data-page="dashboard"] .steam-profile h3{font-size:1.75rem!important}
body[data-page="dashboard"] [data-steam-panel] .panel-body{padding:20px!important}
@media(max-width:1180px){body[data-page="dashboard"] .dashboard-columns{grid-template-columns:1fr 1.25fr!important}}
@media(max-width:900px){body[data-page="dashboard"] .dashboard-columns{grid-template-columns:1fr!important}body[data-page="dashboard"] .steam-profile{grid-template-columns:96px 1fr!important}body[data-page="dashboard"] .steam-profile img{width:96px!important;height:96px!important}}









.cms-selected-frame-controls,.cms-screenshot-template-inspector{padding:12px!important}
.cms-screenshot-shape-grid,.cms-screenshot-width-grid,.cms-screenshot-length-grid{gap:7px!important}
.cms-screenshot-shape-grid button,.cms-screenshot-width-grid button,.cms-screenshot-length-grid button{min-height:68px!important;padding:8px!important}
.cms-screenshot-shape-grid small,.cms-screenshot-width-grid small,.cms-screenshot-length-grid small{font-size:.65rem!important}












.site-screenshot-group-picker{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:8px!important;max-height:360px!important}
.site-screenshot-group-choice{grid-template-columns:auto 58px minmax(0,1fr)!important;min-height:70px!important;padding:6px!important}
.site-screenshot-group-choice img{width:58px!important;height:52px!important}
.site-screenshot-group-live-preview-stage{max-height:300px!important;overflow:auto!important}
.site-screenshot-group-live-preview-grid img{max-height:210px!important}

@media(max-width:1180px){
  
  
  
  [data-screenshot-list].site-admin-media-list,.site-screenshot-group-picker{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media(max-width:720px){
  [data-screenshot-list].site-admin-media-list,.site-screenshot-group-picker{grid-template-columns:1fr!important}
  
  
}


@media (min-width: 1180px) {
  
  
  
  
  
  
  
  
  
}
body[data-page="dashboard"] .analytics-panel .panel-body{padding:12px 15px 12px!important}
body[data-page="dashboard"] .metric-tabs{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:8px!important;margin-bottom:7px!important}
body[data-page="dashboard"] .metric-tab{min-height:60px!important;padding:8px 9px!important;border-radius:9px!important}
body[data-page="dashboard"] .metric-tab small{font-size:.66rem!important}
body[data-page="dashboard"] .metric-tab strong{font-size:clamp(1.05rem,1.35vw,1.34rem)!important;margin:2px 0 2px!important}
body[data-page="dashboard"] .metric-tab span{font-size:.67rem!important;line-height:1.08!important}
body[data-page="dashboard"] .chart-wrap,
body[data-page="dashboard"] .chart-wrap svg{height:112px!important;min-height:112px!important;max-height:112px!important}
body[data-page="dashboard"] .platform-audience-inline{margin-top:7px!important;padding-top:7px!important;min-height:38px!important}
body[data-page="dashboard"] .platform-audience-item{padding:2px 8px!important}
body[data-page="dashboard"] .steam-panel .panel-body{padding:22px!important;display:grid!important;gap:18px!important;align-content:start!important}
body[data-page="dashboard"] .steam-profile{grid-template-columns:122px minmax(0,1fr)!important;gap:20px!important;align-items:center!important}
body[data-page="dashboard"] .steam-profile img{width:122px!important;height:122px!important;border-radius:20px!important}
body[data-page="dashboard"] .steam-profile h3{font-size:clamp(1.45rem,2vw,2rem)!important}
body[data-page="dashboard"] .steam-profile p{font-size:1rem!important}
body[data-page="dashboard"] .steam-card .info-pairs{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important}
body[data-page="dashboard"] .steam-card .info-pairs>div{min-height:76px!important;padding:14px!important}
body[data-page="dashboard"] .dashboard-steam-buttons{margin-top:auto!important}












@media (max-width:1179px){
 body[data-page="dashboard"] .metric-tabs{grid-template-columns:repeat(2,minmax(0,1fr))!important}
 body[data-page="dashboard"] .steam-profile{grid-template-columns:96px minmax(0,1fr)!important}
 body[data-page="dashboard"] .steam-profile img{width:96px!important;height:96px!important}
 
}



body[data-page="dashboard"] .analytics-panel .chart-wrap{
  width:calc(100% + 30px)!important;
  margin-left:-15px!important;
  margin-right:-15px!important;
  overflow:hidden!important;
}
body[data-page="dashboard"] .analytics-panel .chart-wrap svg{
  width:100%!important;
  display:block!important;
}

body[data-page="dashboard"] .analytics-body-clean{overflow:hidden!important}






.cs2-top-columns .cs2-screenshot-mount{margin-top:14px!important}
.cs2-top-columns .cs2-screenshot-mount:empty{display:none!important}


body[data-page="live"] [data-live-vods]{display:block!important;width:100%!important}
body[data-page="live"] [data-live-vods] .media-card{
  width:100%!important;max-width:none!important;display:grid!important;
  grid-template-columns:minmax(300px,42%) minmax(0,1fr)!important;
  min-height:250px!important;align-items:stretch!important;
}
body[data-page="live"] [data-live-vods] .media-card>img{
  width:100%!important;height:100%!important;min-height:250px!important;
  aspect-ratio:auto!important;object-fit:cover!important;
}
body[data-page="live"] [data-live-vods] .media-card-body{
  display:flex!important;flex-direction:column!important;justify-content:center!important;
  padding:24px!important;min-width:0!important;
}
body[data-page="live"] [data-live-clips]{grid-template-columns:repeat(3,minmax(0,1fr))!important}
@media(max-width:850px){
 body[data-page="live"] [data-live-vods] .media-card{grid-template-columns:1fr!important}
 body[data-page="live"] [data-live-vods] .media-card>img{height:auto!important;min-height:0!important;aspect-ratio:16/9!important}
 body[data-page="live"] [data-live-clips]{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media(max-width:560px){body[data-page="live"] [data-live-clips]{grid-template-columns:1fr!important}}







:root{--cms-layout-gap:16px;--cms-block-padding:18px}





























@container (max-width:520px){
  .steam-large{grid-template-columns:1fr!important;text-align:center!important}
  .steam-large>img{margin-inline:auto!important}
  .steam-large .info-pairs{grid-template-columns:1fr!important}
  .skin-yap-intro,.skin-form{min-width:0!important}
  .panel-head{align-items:flex-start!important;flex-wrap:wrap!important}
}

















@media(max-width:720px){
  
  
  
}








@media(max-width:900px){
  
  
}



body[data-page="dashboard"] .analytics-panel .chart-wrap{
  width:calc(100% + 44px)!important;
  margin-left:-22px!important;
  margin-right:-22px!important;
  padding:0!important;
  overflow:hidden!important;
}
body[data-page="dashboard"] .analytics-panel .chart-wrap svg{
  width:100%!important;
  max-width:none!important;
  display:block!important;
}


















@media(max-width:650px){
  
}
































@media(max-width:800px){
  
  
  
  
}













@media(max-width:900px){
  
  
}
























@media(max-width:700px){
  
  
  
  
}

































@media(max-width:700px){
  
  
  
  
}





































@media(max-width:900px){
  
}




@media(max-width:720px){
  
}




body[data-page="media"] [data-media-error]:empty{
  display:none!important;
  min-height:0!important;
  margin:0!important;
  padding:0!important;
}
body[data-page="media"] .page-title-row{margin-bottom:var(--section-gap)!important}
body[data-page="media"] .page-grid{margin-top:0!important}


body[data-page="dashboard"] .analytics-panel .chart-wrap{
  width:100%!important;
  margin:0!important;
  padding:0!important;
  overflow:hidden!important;
}
body[data-page="dashboard"] .analytics-panel .chart-wrap svg{
  display:block!important;
  width:100%!important;
  max-width:none!important;
  margin:0!important;
}


body[data-page="dashboard"] .steam-panel .panel-body{
  display:flex!important;
  flex-direction:column!important;
}
body[data-page="dashboard"] .steam-panel .steam-profile{
  flex:1 1 auto!important;
  align-content:start!important;
}
body[data-page="dashboard"] .steam-panel .steam-action-row{
  margin-top:auto!important;
}



body[data-page="counter-strike-personal"] .cs2-profile-primary { display:grid; gap:16px; margin:0 0 16px; }
body[data-page="counter-strike-personal"] .cs2-profile-primary > .panel, body[data-page="counter-strike-personal"] .cs2-skin-yap-section > .panel { width:100%; min-width:0; }
body[data-page="counter-strike-personal"] .cs2-skin-yap-section { margin:0 0 16px; }
body[data-page="counter-strike-personal"] .cs2-screenshot-mount { margin:0; }
.site-screenshot-box-order-list { display:grid; gap:10px; }
.site-screenshot-group-admin-card[draggable="true"] { cursor:grab; }
.site-screenshot-group-admin-card.dragging { opacity:.48; }
.site-screenshot-group-admin-card.drag-over { outline:2px solid var(--accent,#a855f7); outline-offset:3px; }
.site-screenshot-group-admin-preview { width:220px !important; min-height:84px !important; max-height:112px !important; overflow:hidden; }
.site-screenshot-group-admin-preview img { min-height:0 !important; max-height:52px !important; object-fit:contain !important; }
@media (max-width:800px){ .site-screenshot-group-admin-preview { width:100% !important; } }


body[data-page="dashboard"] .profile-avatar-wrap {
  box-sizing: border-box !important;
  overflow: hidden !important;
}
body[data-page="dashboard"] .profile-avatar-wrap > .profile-avatar {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  box-sizing: border-box !important;
  border-radius: 50% !important;
  object-fit: cover !important;
  object-position: center !important;
  clip-path: circle(50% at 50% 50%) !important;
}
@media (max-width: 620px) {
  body[data-page="dashboard"] .profile-avatar-wrap {
    width: 96px !important;
    height: 96px !important;
    padding: 4px !important;
    border-radius: 50% !important;
  }
  body[data-page="dashboard"] .profile-avatar-wrap > .profile-avatar {
    width: 100% !important;
    height: 100% !important;
    border-width: 4px !important;
  }
}


body[data-page="dashboard"] .metric-tabs{grid-template-columns:repeat(3,minmax(0,1fr));}
body[data-page="dashboard"] .metric-tab .metric-subline{display:block;margin-top:6px;color:#a996c2;font-size:10px;line-height:1.25;text-transform:none;letter-spacing:0;}
body[data-page="dashboard"] .metric-tab .metric-subline b{color:#f3eaff;font-size:11px;}
body[data-page="dashboard"] [data-tiktok-audience][hidden]{display:none!important;}
@media(max-width:760px){body[data-page="dashboard"] .metric-tabs{grid-template-columns:1fr 1fr;}body[data-page="dashboard"] .metric-tab[data-chart-metric="youtube"]{grid-column:1/-1;}}




@media (max-width: 760px) {
  body[data-page="dashboard"] .steam-panel {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
  }
  body[data-page="dashboard"] .steam-panel > .panel-body,
  body[data-page="dashboard"] .steam-panel .steam-card {
    display: grid !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
    align-content: start !important;
    gap: 22px !important;
  }
  body[data-page="dashboard"] .steam-panel .steam-card {
    padding: 24px 20px 22px !important;
  }
  body[data-page="dashboard"] .steam-panel .steam-profile {
    display: grid !important;
    grid-template-columns: 1fr !important;
    justify-items: center !important;
    gap: 15px !important;
    min-height: 0 !important;
    text-align: center !important;
  }
  body[data-page="dashboard"] .steam-panel .steam-profile img {
    width: 154px !important;
    height: 154px !important;
    margin: 0 auto !important;
    padding: 5px !important;
    border-radius: 24px !important;
    object-fit: cover !important;
  }
  body[data-page="dashboard"] .steam-panel .steam-profile > div {
    display: grid !important;
    justify-items: center !important;
    gap: 7px !important;
    width: 100% !important;
  }
  body[data-page="dashboard"] .steam-panel .steam-profile h3 {
    max-width: 100% !important;
    margin: 0 !important;
    font-size: clamp(1.35rem, 7vw, 1.8rem) !important;
    line-height: 1.12 !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
  }
  body[data-page="dashboard"] .steam-panel .steam-profile p {
    margin: 0 !important;
    text-align: center !important;
  }
  body[data-page="dashboard"] .steam-panel .steam-card .info-pairs {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px !important;
    margin: 0 !important;
  }
  body[data-page="dashboard"] .steam-panel .steam-card .info-pairs > div {
    min-height: 92px !important;
    padding: 15px 13px !important;
    display: grid !important;
    align-content: center !important;
  }
  body[data-page="dashboard"] .steam-panel .dashboard-steam-buttons {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 12px !important;
    margin: 0 !important;
    width: 100% !important;
  }
  body[data-page="dashboard"] .steam-panel .dashboard-steam-buttons .button {
    width: 100% !important;
    min-height: 54px !important;
    padding: 13px 14px !important;
    white-space: normal !important;
  }
}
@media (max-width: 390px) {
  body[data-page="dashboard"] .steam-panel .steam-profile img {
    width: 132px !important;
    height: 132px !important;
  }
  body[data-page="dashboard"] .steam-panel .steam-card .info-pairs {
    grid-template-columns: 1fr !important;
  }
}


body[data-page="support"] .support-tip-actions {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 12px !important;
  max-width: 620px !important;
  margin-top: 22px !important;
}
body[data-page="support"] .support-tip-actions .button {
  min-height: 58px !important;
  padding: 13px 20px !important;
  border: 1px solid rgba(211, 153, 255, .76) !important;
  border-radius: 12px !important;
  background: linear-gradient(135deg, #8d31f5, #5d20c9) !important;
  box-shadow: 0 12px 30px rgba(111, 32, 220, .28), inset 0 1px 0 rgba(255,255,255,.14) !important;
  color: #fff !important;
  font-size: 1.04rem !important;
  font-weight: 800 !important;
}
body[data-page="support"] .support-tip-actions .button:nth-child(2) {
  background: linear-gradient(135deg, rgba(109, 38, 202, .88), rgba(35, 17, 70, .96)) !important;
}
body[data-page="support"] .support-tip-actions .button:hover,
body[data-page="support"] .support-tip-actions .button:focus-visible {
  transform: translateY(-2px) !important;
  border-color: #e5b8ff !important;
  box-shadow: 0 16px 38px rgba(142, 49, 245, .38), 0 0 0 3px rgba(174, 91, 255, .14) !important;
}
body[data-page="support"] .support-hero > img {
  filter: drop-shadow(0 20px 32px rgba(0,0,0,.35)) drop-shadow(0 0 26px rgba(164,74,255,.25));
}
@media (max-width: 620px) {
  body[data-page="support"] .support-tip-actions {
    grid-template-columns: 1fr !important;
  }
}


.global-support-button {
  position: fixed;
  right: 18px;
  bottom: calc(18px + env(safe-area-inset-bottom, 0px));
  z-index: 48;
  display: grid;
  width: 72px;
  height: 72px;
  place-items: center;
  overflow: visible;
  border: 1px solid rgba(211, 153, 255, .68);
  border-radius: 23px;
  background: radial-gradient(circle at 45% 30%, rgba(142,49,245,.34), rgba(10,6,18,.96) 72%);
  box-shadow: 0 16px 40px rgba(0,0,0,.48), 0 0 0 4px rgba(133,44,233,.10), inset 0 1px 0 rgba(255,255,255,.10);
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.global-support-button img {
  display: block;
  width: 64px;
  height: 64px;
  object-fit: contain;
  pointer-events: none;
  filter: drop-shadow(0 5px 8px rgba(0,0,0,.28));
}
.global-support-button::after {
  content: attr(data-label);
  position: absolute;
  right: calc(100% + 10px);
  top: 50%;
  min-width: max-content;
  padding: 8px 11px;
  border: 1px solid rgba(211,153,255,.45);
  border-radius: 9px;
  background: rgba(9,5,17,.96);
  color: #f4e6ff;
  font-size: .80rem;
  font-weight: 800;
  line-height: 1;
  opacity: 0;
  pointer-events: none;
  transform: translate(8px,-50%);
  transition: opacity .16s ease, transform .16s ease;
  white-space: nowrap;
}
.global-support-button:hover,
.global-support-button:focus-visible {
  transform: translateY(-3px) scale(1.03);
  border-color: #e5b8ff;
  box-shadow: 0 20px 46px rgba(0,0,0,.52), 0 0 0 5px rgba(145,52,249,.16);
  outline: none;
}
.global-support-button:hover::after,
.global-support-button:focus-visible::after {
  opacity: 1;
  transform: translate(0,-50%);
}
@media (max-width: 900px) {
  .global-support-button {
    right: 12px;
    bottom: calc(12px + env(safe-area-inset-bottom, 0px));
    width: 60px;
    height: 60px;
    border-radius: 19px;
  }
  .global-support-button img {
    width: 54px;
    height: 54px;
  }
  .global-support-button::after { display: none; }
}
@media print {
  .global-support-button { display: none !important; }
}



.global-support-button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  width: auto !important;
  min-width: 158px !important;
  height: 62px !important;
  padding: 5px 16px 5px 6px !important;
  gap: 10px !important;
  overflow: hidden !important;
  border-radius: 20px !important;
  text-decoration: none !important;
}
.global-support-button img {
  flex: 0 0 auto !important;
  width: 50px !important;
  height: 50px !important;
  object-fit: contain !important;
}
.global-support-button span {
  display: block !important;
  color: #fff !important;
  font-size: .88rem !important;
  font-weight: 900 !important;
  line-height: 1.08 !important;
  letter-spacing: .015em !important;
  text-align: left !important;
  white-space: nowrap !important;
  text-shadow: 0 1px 10px rgba(0,0,0,.65) !important;
}
.global-support-button::after {
  content: none !important;
  display: none !important;
}
@media (max-width: 900px) {
  .global-support-button {
    right: 10px !important;
    bottom: calc(82px + env(safe-area-inset-bottom, 0px)) !important;
    min-width: 136px !important;
    height: 56px !important;
    padding: 4px 12px 4px 5px !important;
    gap: 7px !important;
    border-radius: 18px !important;
  }
  .global-support-button img {
    width: 46px !important;
    height: 46px !important;
  }
  .global-support-button span {
    max-width: 78px !important;
    font-size: .72rem !important;
    line-height: 1.05 !important;
    white-space: normal !important;
  }
}
@media (max-width: 360px) {
  .global-support-button {
    min-width: 124px !important;
    padding-right: 9px !important;
  }
  .global-support-button span { font-size: .67rem !important; }
}



.page-chibi-decoration {
  position: fixed;
  left: calc(var(--sidebar) + 18px);
  bottom: 18px;
  z-index: 12;
  display: block;
  width: 78px;
  height: 78px;
  object-fit: contain;
  opacity: .58;
  pointer-events: none;
  user-select: none;
  filter: drop-shadow(0 8px 18px rgba(0,0,0,.42)) drop-shadow(0 0 14px rgba(139,61,255,.22));
}
@media (max-width: 900px) {
  .page-chibi-decoration { display: none !important; }
}
@media print {
  .page-chibi-decoration { display: none !important; }
}



.page-footer {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  align-items: stretch !important;
  gap: 20px !important;
}

.page-footer .footer-social-grid {
  display: grid !important;
  width: min(860px, 100%);
  margin: 0 auto;
  grid-template-columns: repeat(8, minmax(0, 1fr));
  gap: 12px;
}

.page-footer .footer-social-link {
  grid-column: span 2;
  display: flex;
  min-width: 0;
  min-height: 72px;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 9px 13px;
  border: 1px solid var(--line);
  border-radius: 13px;
  background: linear-gradient(145deg, rgba(31, 18, 48, .9), rgba(9, 6, 17, .96));
  color: #f4eaff;
  font-weight: 700;
  text-decoration: none;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035);
  transition: transform .16s ease, border-color .16s ease, background .16s ease;
}

.page-footer .footer-social-link:nth-child(5) { grid-column: 2 / span 2; }
.page-footer .footer-social-link:nth-child(6) { grid-column: 4 / span 2; }
.page-footer .footer-social-link:nth-child(7) { grid-column: 6 / span 2; }

.page-footer .footer-social-link:hover,
.page-footer .footer-social-link:focus-visible {
  transform: translateY(-2px);
  border-color: var(--line-strong);
  background: linear-gradient(145deg, rgba(90, 30, 145, .25), rgba(9, 6, 17, .98));
  color: #fff;
}

.page-footer .footer-social-link img {
  display: block;
  width: 50px;
  height: 50px;
  flex: 0 0 50px;
  object-fit: contain;
}

.page-footer .footer-social-link span {
  min-width: 0;
  font-size: .95rem;
  line-height: 1;
  white-space: nowrap;
}

.page-footer .footer-meta-row {
  display: flex !important;
  width: 100%;
  align-items: center !important;
  justify-content: space-between;
  gap: 20px;
}

.page-footer .footer-meta-row > div {
  display: flex !important;
  align-items: center !important;
  flex-direction: row !important;
  gap: 12px !important;
}

.page-footer .footer-meta-row > nav {
  display: flex;
  flex-wrap: wrap;
  gap: 15px;
}

@media (max-width: 620px) {
  .page-footer {
    gap: 16px !important;
  }

  .page-footer .footer-social-grid {
    width: 100%;
    gap: 7px;
  }

  .page-footer .footer-social-link {
    min-height: 63px;
    gap: 5px;
    padding: 7px 4px;
    border-radius: 10px;
    flex-direction: column;
  }

  .page-footer .footer-social-link img {
    width: 38px;
    height: 38px;
    flex-basis: 38px;
  }

  .page-footer .footer-social-link span {
    font-size: .68rem;
  }

  .page-footer .footer-meta-row {
    align-items: flex-start !important;
    flex-direction: column;
  }

  .page-footer .footer-meta-row > div {
    align-items: flex-start !important;
    flex-direction: column !important;
    gap: 3px !important;
  }
}



.sidebar-footer {
  padding-left: 16px !important;
  padding-right: 16px !important;
}
.sidebar-footer .sidebar-socials,
.sidebar-footer .sidebar-socials-glossy {
  display: grid !important;
  grid-template-columns: repeat(4, 52px) !important;
  grid-auto-rows: 52px !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 8px !important;
  width: 232px !important;
  max-width: 100% !important;
  margin: 10px auto 12px !important;
}
.sidebar-footer .sidebar-socials a,
.sidebar-footer .sidebar-socials-glossy a {
  display: block !important;
  width: 52px !important;
  height: 52px !important;
  min-width: 52px !important;
  min-height: 52px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 15px !important;
  background: transparent !important;
  overflow: visible !important;
  line-height: 0 !important;
  box-shadow: none !important;
  transform: translateZ(0);
  transition: transform .16s ease, filter .16s ease !important;
}
.sidebar-footer .sidebar-socials a img,
.sidebar-footer .sidebar-socials-glossy a img {
  display: block !important;
  width: 52px !important;
  height: 52px !important;
  max-width: none !important;
  object-fit: contain !important;
  border-radius: 15px !important;
  filter: drop-shadow(0 5px 10px rgba(0,0,0,.38));
}
.sidebar-footer .sidebar-socials a svg,
.sidebar-footer .sidebar-socials-glossy a svg {
  display: none !important;
}
.sidebar-footer .sidebar-socials a:hover,
.sidebar-footer .sidebar-socials a:focus-visible,
.sidebar-footer .sidebar-socials-glossy a:hover,
.sidebar-footer .sidebar-socials-glossy a:focus-visible {
  transform: translateY(-2px) scale(1.04) !important;
  filter: brightness(1.08) !important;
  outline: 2px solid rgba(190, 90, 255, .7) !important;
  outline-offset: 2px !important;
}
.page-footer .footer-social-grid,
.global-support-button {
  display: none !important;
}
.page-footer .footer-meta-row {
  margin-top: 0 !important;
}
@media (max-width: 900px) {
  .sidebar-footer .sidebar-socials,
  .sidebar-footer .sidebar-socials-glossy {
    grid-template-columns: repeat(4, 48px) !important;
    grid-auto-rows: 48px !important;
    width: 216px !important;
    gap: 8px !important;
  }
  .sidebar-footer .sidebar-socials a,
  .sidebar-footer .sidebar-socials-glossy a,
  .sidebar-footer .sidebar-socials a img,
  .sidebar-footer .sidebar-socials-glossy a img {
    width: 48px !important;
    height: 48px !important;
    min-width: 48px !important;
    min-height: 48px !important;
  }
}



.wasd-family-intro { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:18px; align-items:center; margin:24px 0; padding:22px; border:1px solid rgba(181,120,255,.34); border-radius:22px; background:rgba(65,35,91,.38); }
.wasd-family-intro h3,.wasd-family-intro p { margin-top:0; }
.wasd-selected-status { grid-column:1/-1; min-height:1.4em; margin:0; color:#f0dfff; font-weight:700; }
.wasd-variant-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; margin:22px 0 30px; }
.wasd-variant-card { display:flex; flex-direction:column; gap:16px; min-width:0; padding:17px; border:1px solid rgba(185,123,255,.3); border-radius:24px; background:linear-gradient(165deg,rgba(47,28,68,.94),rgba(21,14,34,.96)); box-shadow:0 18px 42px rgba(0,0,0,.24); }
.wasd-variant-card > img { width:100%; aspect-ratio:5/3; object-fit:contain; background:#080510; border-radius:17px; border:1px solid rgba(255,255,255,.1); }
.wasd-variant-select { display:flex; gap:10px; align-items:center; padding:10px 12px; border-radius:14px; background:rgba(157,88,211,.16); cursor:pointer; }
.wasd-variant-select input { width:20px; height:20px; accent-color:#c477ff; }
.wasd-variant-copy { flex:1; }
.wasd-variant-copy h3 { margin:.2rem 0 .55rem; }
.wasd-variant-copy p:last-child { margin-bottom:0; }
.wasd-variant-actions { display:grid; gap:12px; }
.wasd-variant-actions .project-engagement { align-items:center; }
.wasd-variant-actions .compact-button { display:none; }
.catmint-wheel-preview { display:grid; grid-template-columns:minmax(0,1.5fr) minmax(260px,.75fr); gap:24px; align-items:center; margin:24px 0 30px; padding:18px; border:1px solid rgba(181,120,255,.3); border-radius:24px; background:rgba(39,23,57,.66); }
.catmint-wheel-preview img { width:100%; border-radius:18px; border:1px solid rgba(255,255,255,.1); }
@media (max-width:1050px) { .wasd-variant-grid { grid-template-columns:1fr; } .wasd-variant-card { display:grid; grid-template-columns:minmax(240px,.9fr) minmax(0,1.1fr); } .wasd-variant-card > .wasd-variant-select,.wasd-variant-card > .wasd-variant-actions { grid-column:1/-1; } }
@media (max-width:720px) { .wasd-family-intro,.catmint-wheel-preview,.wasd-variant-card { grid-template-columns:1fr; } .wasd-family-intro .button { width:100%; } }



.project-jump-nav .project-overview-live-wasd video {
  display:block; width:100%; height:100%; object-fit:contain; background:#080510; pointer-events:none;
}
.wasd-variant-card > img[data-full-key-preview] { object-fit:contain!important; background:#080510; }
.wasd-variant-actions > .button { justify-self:start; }



.project-overview-live-wasd { display:block; width:100%; aspect-ratio:16/9; overflow:hidden; background:#080510; }
.project-overview-live-wasd video { display:block!important; width:100%!important; height:100%!important; object-fit:contain!important; background:#080510; }
.wasd-variant-card [data-project-qa],
.wasd-variant-card [data-project-ask] { display:none!important; }
.wasd-shared-engagement .project-engagement-error { display:none!important; }



.project-overview-card.project-overview-card-static,
.project-jump-nav article.project-overview-card { color:inherit; text-decoration:none; }
.project-jump-nav article.project-overview-card:hover { transform:translateY(-2px); border-color:rgba(199,101,255,.58); }
.project-overview-live { position:relative; }
.real-media-badge { position:absolute!important; z-index:4; top:9px; left:9px; margin:0!important; padding:5px 8px; border:1px solid rgba(255,255,255,.28); border-radius:999px; background:rgba(7,3,13,.86); color:#fff; font-size:.68rem; font-weight:900; letter-spacing:.06em; pointer-events:none; }
.project-jump-nav .project-overview-live-wasd video { pointer-events:auto!important; }
.project-jump-nav .project-overview-live-wheel iframe { transform:scale(.34); transform-origin:top left; width:294%!important; height:294%!important; pointer-events:none; }
.project-overview-card>.project-card-open { text-decoration:none; }

.wasd-real-video-section { display:grid; grid-template-columns:minmax(260px,.72fr) minmax(320px,1.28fr); gap:24px; align-items:center; margin:24px 0 30px; padding:20px; border:1px solid rgba(181,120,255,.34); border-radius:24px; background:linear-gradient(150deg,rgba(62,34,88,.62),rgba(15,9,25,.9)); }
.wasd-real-video-copy h3 { margin:.2rem 0 .7rem; }
.wasd-real-video-copy p:last-child { margin-bottom:0; color:var(--muted); line-height:1.6; }
.wasd-real-video-frame { display:flex; align-items:center; justify-content:center; min-height:330px; border:1px solid rgba(255,255,255,.12); border-radius:18px; overflow:hidden; background:#050209; }
.wasd-real-video-frame video { display:block; width:100%; max-width:620px; max-height:520px; object-fit:contain; background:#050209; }

.wasd-actual-key-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; width:100%; padding:12px; border:1px solid rgba(255,255,255,.1); border-radius:18px; background:#080510; }
.wasd-actual-key-tile { position:relative; display:flex; align-items:center; justify-content:center; min-height:126px; overflow:hidden; border:1px solid rgba(184,104,255,.42); border-radius:14px; background:radial-gradient(circle at 50% 42%,rgba(102,71,127,.24),rgba(8,5,16,.96) 66%); }
.wasd-actual-key-tile:nth-child(n/**/+5) { grid-column:span 2; }
.wasd-actual-key-tile img { position:absolute; inset:18px 12px 10px; width:calc(100% - 24px); height:calc(100% - 28px); object-fit:contain; transition:opacity .16s ease,transform .16s ease; }
.wasd-actual-key-label { position:absolute; z-index:3; top:7px; left:8px; padding:3px 7px; border-radius:7px; background:#793eb0; color:#fff; font-size:.72rem; }
.wasd-key-active { opacity:0; }
.wasd-actual-key-tile:hover .wasd-key-active,.wasd-actual-key-tile:focus .wasd-key-active { opacity:1; transform:scale(1.035); }
.wasd-actual-key-tile:hover .wasd-key-idle,.wasd-actual-key-tile:focus .wasd-key-idle { opacity:0; }
.wasd-variant-actions>.button { width:100%; justify-content:center; min-height:46px; }

.catmint-wheel-real-preview { display:block!important; }
.catmint-wheel-real-copy { max-width:900px; margin:0 0 18px; }
.catmint-wheel-real-copy h3 { margin:.2rem 0 .6rem; }
.catmint-wheel-real-copy p:last-child { color:var(--muted); }
.catmint-wheel-real-grid { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(320px,.85fr); gap:20px; align-items:start; }
.catmint-wheel-real-frame { margin:0; overflow:hidden; border:1px solid rgba(190,116,255,.4); border-radius:18px; background:#080510; }
.catmint-wheel-real-frame iframe { display:block; width:100%; border:0; background:#080510; }
.catmint-wheel-real-frame-wheel iframe { height:720px; }
.catmint-wheel-real-frame-dock iframe { height:760px; }
.catmint-wheel-real-frame figcaption { padding:10px 13px; border-top:1px solid rgba(255,255,255,.1); color:#f3ddff; font-weight:800; text-align:center; }

@media(max-width:1050px){
 .wasd-real-video-section,.catmint-wheel-real-grid{grid-template-columns:1fr}
 .catmint-wheel-real-frame-wheel iframe{height:680px}
 .catmint-wheel-real-frame-dock iframe{height:760px}
}
@media(max-width:720px){
 .wasd-real-video-frame{min-height:260px}
 .wasd-actual-key-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .wasd-actual-key-tile:nth-child(n/**/+5){grid-column:span 1}
 .wasd-actual-key-tile{min-height:112px}
 .catmint-wheel-real-frame-wheel iframe{height:520px}
 .catmint-wheel-real-frame-dock iframe{height:680px}
}



.wasd-paw-video-preview {
  display:flex; align-items:center; justify-content:center; width:100%; min-height:260px;
  overflow:hidden; border:1px solid rgba(255,255,255,.12); border-radius:18px; background:#050209;
}
.wasd-paw-video-preview video {
  display:block; width:100%; height:auto; max-height:480px; object-fit:contain; background:#050209;
}
@media (max-width:720px){ .wasd-paw-video-preview{min-height:220px} }



.project-overview-live-wheel-pair { min-height: 250px; padding: 12px; background: #0c0914; }
.wheel-card-preview-pair { width:100%; min-height:220px; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:10px; align-items:stretch; }
.wheel-card-preview-pair > span { min-width:0; border:1px solid rgba(169,112,255,.38); border-radius:12px; overflow:hidden; background:#15111f; display:grid; place-items:center; }
.wheel-card-preview-pair iframe { width:100%; height:100%; border:0; display:block; background:#15111f; pointer-events:none; }
.wheel-card-preview-pair .wheel-card-wheel { aspect-ratio:1/1; }
.wheel-card-preview-pair .wheel-card-dock { aspect-ratio:520/760; }
.wasd-family-engagement { width:100%; }
.wasd-family-stat { cursor:default; }
.wasd-variant-engagement { margin-top:auto; }
.wasd-license-panel { margin:24px 0; border-color:rgba(255,0,245,.42); }
.wasd-variant-card { display:flex; flex-direction:column; }
.wasd-paw-video-preview video { width:100%; aspect-ratio:16/10; object-fit:contain; background:#050309; border-radius:12px; }
@media (max-width:720px){ .wheel-card-preview-pair{grid-template-columns:1fr 0.72fr; min-height:190px;} }



.project-stat-icon{display:block!important;width:34px!important;height:34px!important;min-width:34px!important;object-fit:contain!important;filter:drop-shadow(0 4px 9px rgba(126,45,255,.28));}
.project-heart-icon{display:none!important;}
.project-heart,.project-download-stat{gap:8px!important;min-height:56px!important;padding:8px 14px!important;}
.project-heart strong,.project-download-stat strong,.project-card-stats strong{font-size:1rem!important;color:#fff!important;}
.project-heart.is-hearted{border-color:rgba(255,91,207,.8)!important;box-shadow:0 0 22px rgba(255,63,198,.18)!important;}
.project-heart.is-hearted .project-stat-icon{filter:drop-shadow(0 0 10px rgba(255,74,208,.7)) brightness(1.12);}
.project-heart>span:last-child,.project-download-stat>span:last-child{display:none!important;}
.project-card-stats>span{min-width:66px;justify-content:center!important;padding:6px 10px!important;border-radius:12px!important;}
.project-card-stats .project-stat-icon{width:30px!important;height:30px!important;min-width:30px!important;}
.real-project-main-actions .project-engagement{margin-top:12px;}
.real-project-main-actions{gap:10px!important;}
.wasd-family-engagement{display:grid!important;grid-template-columns:1fr 1fr!important;gap:12px!important;margin-top:14px!important;}
.wasd-family-engagement .project-heart,.wasd-family-engagement .project-download-stat{min-width:0!important;}
.project-engagement-error{display:none!important;}
.project-overview-live-frame-pair{min-height:250px;padding:12px;background:#0c0914;}
.frame-card-preview-pair{width:100%;min-height:220px;display:grid;grid-template-columns:1fr .72fr;gap:10px;align-items:stretch;}
.frame-card-preview-pair>span{min-width:0;border:1px solid rgba(169,112,255,.38);border-radius:12px;overflow:hidden;background:#090610;display:grid;place-items:center;}
.frame-card-preview-pair iframe{width:100%;height:100%;border:0;display:block;background:#090610;pointer-events:none;}
.frame-card-preview-pair .frame-card-frame{aspect-ratio:16/9;}
.frame-card-preview-pair .frame-card-dock{aspect-ratio:520/760;}
.obs-frame-real-preview{margin:24px 0 30px;padding:20px;border:1px solid rgba(181,120,255,.34);border-radius:24px;background:linear-gradient(150deg,rgba(62,34,88,.62),rgba(15,9,25,.9));}
.obs-frame-preview-copy{max-width:900px;margin-bottom:18px;}
.obs-frame-preview-grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(320px,.75fr);gap:20px;align-items:start;}
.obs-frame-preview-grid figure{margin:0;overflow:hidden;border:1px solid rgba(190,116,255,.4);border-radius:18px;background:#080510;}
.obs-frame-preview-grid iframe{display:block;width:100%;border:0;background:#080510;}
.obs-frame-preview-grid figure:first-child iframe{height:560px;}
.obs-frame-preview-grid figure:last-child iframe{height:920px;}
.obs-frame-preview-grid figcaption{padding:10px 13px;border-top:1px solid rgba(255,255,255,.1);color:#f3ddff;font-weight:800;text-align:center;}
.obs-frame-setup{margin:24px 0;}
.obs-frame-setup ol{color:var(--muted);line-height:1.65;}
@media(max-width:1050px){.obs-frame-preview-grid{grid-template-columns:1fr}.obs-frame-preview-grid figure:last-child iframe{height:840px}}
@media(max-width:720px){.project-stat-icon{width:30px!important;height:30px!important;min-width:30px!important}.project-heart,.project-download-stat{min-height:50px!important}.frame-card-preview-pair{min-height:190px}.obs-frame-preview-grid figure:first-child iframe{height:360px}.obs-frame-preview-grid figure:last-child iframe{height:760px}}



.project-stat-icon{width:20px!important;height:20px!important;min-width:20px!important;max-width:20px!important;max-height:20px!important;object-fit:contain!important;flex:0 0 20px!important}
.project-card-stats .project-stat-icon{width:17px!important;height:17px!important;min-width:17px!important;max-width:17px!important;max-height:17px!important;flex-basis:17px!important}
.project-heart,.project-download-stat{gap:6px!important;min-height:42px!important;padding:6px 10px!important}
.project-card-stats>span{min-width:52px!important;gap:5px!important;padding:5px 8px!important}
.project-heart strong,.project-download-stat strong,.project-card-stats strong{font-size:.95rem!important;line-height:1!important}
.project-overview-live-frame-pair{min-height:220px!important}
.frame-card-preview-pair{grid-template-columns:minmax(0,1.35fr) minmax(125px,.65fr)!important;min-height:195px!important}
.frame-card-preview-pair .frame-card-frame{aspect-ratio:16/9!important}.frame-card-preview-pair .frame-card-dock{aspect-ratio:3/4!important}
@media(max-width:720px){.project-stat-icon{width:18px!important;height:18px!important;min-width:18px!important;max-width:18px!important;max-height:18px!important;flex-basis:18px!important}.project-card-stats .project-stat-icon{width:16px!important;height:16px!important;min-width:16px!important;max-width:16px!important;max-height:16px!important;flex-basis:16px!important}.project-heart,.project-download-stat{min-height:38px!important;padding:5px 8px!important}.frame-card-preview-pair{grid-template-columns:minmax(0,1.25fr) minmax(105px,.75fr)!important;min-height:175px!important}}


.frame-card-preview-pair .frame-card-frame{background:#000!important;padding:12px!important;}
.frame-card-preview-pair .frame-card-frame iframe{width:88%!important;height:88%!important;margin:auto!important;background:#000!important;border-radius:8px;}
.obs-frame-preview-grid figure:first-child{background:#000!important;}
.obs-frame-preview-grid figure:first-child iframe{display:block!important;width:min(86%,760px)!important;height:auto!important;aspect-ratio:16/9!important;margin:32px auto!important;background:#000!important;border-radius:10px;}
@media(max-width:720px){
 .frame-card-preview-pair .frame-card-frame{padding:8px!important;}
 .obs-frame-preview-grid figure:first-child iframe{width:90%!important;margin:20px auto!important;}
}



.project-stat-icon{
  width:22px!important;height:22px!important;min-width:22px!important;max-width:22px!important;
  max-height:22px!important;flex:0 0 22px!important;object-fit:contain!important;margin:0!important;
}
.project-card-stats .project-stat-icon{
  width:18px!important;height:18px!important;min-width:18px!important;max-width:18px!important;
  max-height:18px!important;flex-basis:18px!important;
}
.project-heart,.project-download-stat{
  display:inline-flex!important;align-items:center!important;justify-content:center!important;
  width:auto!important;min-width:58px!important;min-height:38px!important;padding:5px 9px!important;
  gap:5px!important;border-radius:999px!important;
}
.project-card-stats>span{
  display:inline-flex!important;align-items:center!important;justify-content:center!important;
  width:auto!important;min-width:50px!important;min-height:32px!important;padding:4px 8px!important;
  gap:4px!important;border-radius:999px!important;
}
.project-heart strong,.project-download-stat strong,.project-card-stats strong{
  font-size:.92rem!important;line-height:1!important;font-variant-numeric:tabular-nums!important;
}
.project-engagement{gap:8px!important;align-items:center!important;}


.project-static-preview{display:block;width:100%;height:100%;object-fit:contain;background:#080510;border:0;}
.project-overview-live>.project-static-preview{width:100%;height:100%;object-fit:cover;}
.project-overview-live-ticker>.project-static-preview,
.project-overview-live-popups>.project-static-preview{object-fit:contain;background:#080510;}
.wheel-card-preview-pair img,.frame-card-preview-pair img{width:100%;height:100%;object-fit:contain;background:#080510;display:block;}
.wheel-card-preview-pair .wheel-card-wheel img{object-fit:contain;background:#000;}
.wheel-card-preview-pair .wheel-card-dock img{object-fit:cover;object-position:top;background:#15111f;}
.frame-card-preview-pair .frame-card-frame{background:#000!important;padding:10px!important;}
.frame-card-preview-pair .frame-card-frame img{width:90%!important;height:auto!important;aspect-ratio:16/9;object-fit:contain;background:#000;margin:auto;}
.frame-card-preview-pair .frame-card-dock img{object-fit:cover;object-position:top;background:#15111f;}
.catmint-demo-stage>.project-static-preview{width:min(100%,560px);height:auto;max-height:900px;object-fit:cover;object-position:top;margin:0 auto;border-radius:14px;}
.obs-frame-preview-grid img{display:block;width:100%;height:auto;object-fit:contain;background:#080510;}
.obs-frame-preview-grid figure:first-child img{width:min(90%,900px);margin:28px auto;background:#000;border-radius:10px;}
.obs-frame-preview-grid figure:last-child img{max-height:980px;object-fit:contain;object-position:top;}
.catmint-wheel-preview-grid img,.wheel-live-preview-grid img{display:block;width:100%;height:auto;object-fit:contain;object-position:top;background:#15111f;}
.real-project-main-actions>a[href*="ko-fi.com"]{display:none!important;}

@media(max-width:720px){
  .project-stat-icon{width:20px!important;height:20px!important;min-width:20px!important;max-width:20px!important;flex-basis:20px!important;}
  .project-card-stats .project-stat-icon{width:17px!important;height:17px!important;min-width:17px!important;max-width:17px!important;flex-basis:17px!important;}
  .project-heart,.project-download-stat{min-width:52px!important;min-height:35px!important;padding:4px 7px!important;}
  .project-card-stats>span{min-width:47px!important;min-height:30px!important;padding:4px 7px!important;}
}



.frame-card-preview-pair .frame-card-frame{background:#000!important;padding:18px!important;display:flex!important;align-items:center!important;justify-content:center!important;}
.frame-card-preview-pair .frame-card-frame img{width:78%!important;height:auto!important;max-height:145px!important;object-fit:contain!important;background:#000!important;margin:auto!important;}
.obs-frame-preview-grid figure:first-child{background:#000!important;min-height:250px!important;display:flex!important;flex-direction:column!important;}
.obs-frame-preview-grid figure:first-child img{width:min(76%,700px)!important;height:auto!important;max-height:250px!important;object-fit:contain!important;background:#000!important;margin:auto!important;padding:24px 0!important;}
.obs-frame-preview-grid figure:first-child figcaption{margin-top:auto!important;}
@media(max-width:720px){
 .frame-card-preview-pair .frame-card-frame{padding:12px!important;}
 .frame-card-preview-pair .frame-card-frame img{width:82%!important;max-height:115px!important;}
 .obs-frame-preview-grid figure:first-child{min-height:190px!important;}
 .obs-frame-preview-grid figure:first-child img{width:82%!important;max-height:180px!important;padding:16px 0!important;}
}

/* v238: actual uploaded buttons, compact counters, real lazy previews, faster rendering. */
.project-card-stats,.project-engagement{align-items:center!important}
.project-card-stats>span,.project-heart,.project-download-stat{
  display:inline-flex!important;align-items:center!important;justify-content:center!important;
  width:auto!important;min-width:64px!important;min-height:44px!important;
  padding:5px 10px!important;gap:7px!important;border-radius:14px!important;
}
.project-card-stats .project-stat-icon{width:28px!important;height:28px!important;min-width:28px!important;max-width:28px!important;flex:0 0 28px!important}
.project-heart .project-stat-icon,.project-download-stat .project-stat-icon{width:32px!important;height:32px!important;min-width:32px!important;max-width:32px!important;flex:0 0 32px!important}
.project-card-stats strong,.project-heart strong,.project-download-stat strong{font-size:1rem!important;line-height:1!important;color:#fff!important}
.project-overview-live iframe.actual-project-preview-frame,.actual-project-preview-frame{
 display:block;width:100%;height:100%;min-height:220px;border:0;background:#0b0712;
}
.project-overview-live-pos iframe{min-height:260px}
.project-overview-live-asi iframe{min-height:260px}
.project-overview-live-ticker iframe{min-height:120px}
.project-overview-live-popups iframe{min-height:245px}
.actual-project-preview-shell{position:relative;width:100%;min-height:220px;background:#0b0712;overflow:hidden}
.actual-project-preview-shell::before{content:'Loading actual project preview…';position:absolute;inset:0;display:grid;place-items:center;color:#bbaad7;font-size:.82rem;z-index:0}
.actual-project-preview-shell iframe{position:relative;z-index:1}
.tool-logo[data-logo-src]:not([src]){visibility:hidden}
.tool-card-pro,.project-overview-card,.project-info-panel,.media-card,.game-card,.recommendation-card{content-visibility:auto;contain-intrinsic-size:300px}
.live-recommendations-shortcut{margin-left:0}
@media(max-width:720px){
 .project-card-stats>span,.project-heart,.project-download-stat{min-width:58px!important;min-height:40px!important;padding:4px 8px!important}
 .project-card-stats .project-stat-icon{width:25px!important;height:25px!important;min-width:25px!important;max-width:25px!important;flex-basis:25px!important}
 .project-heart .project-stat-icon,.project-download-stat .project-stat-icon{width:28px!important;height:28px!important;min-width:28px!important;max-width:28px!important;flex-basis:28px!important}
}

/* v243 — exact uploaded heart/download artwork, compact icon + real number only. */
.project-stat-icon{
  width:20px!important;height:20px!important;min-width:20px!important;max-width:20px!important;
  max-height:20px!important;flex:0 0 20px!important;object-fit:contain!important;margin:0!important;
}
.project-card-stats .project-stat-icon{
  width:17px!important;height:17px!important;min-width:17px!important;max-width:17px!important;
  max-height:17px!important;flex:0 0 17px!important;
}
.project-heart,.project-download-stat{
  width:auto!important;min-width:48px!important;min-height:34px!important;
  padding:4px 7px!important;gap:5px!important;border-radius:999px!important;
}
.project-card-stats>span{
  width:auto!important;min-width:43px!important;min-height:29px!important;
  padding:3px 6px!important;gap:4px!important;border-radius:999px!important;
}
.project-heart strong,.project-download-stat strong,.project-card-stats strong{
  font-size:.92rem!important;line-height:1!important;
}
.wasd-family-stat{cursor:default!important;}
@media(max-width:720px){
  .project-stat-icon{width:18px!important;height:18px!important;min-width:18px!important;max-width:18px!important;flex-basis:18px!important;}
  .project-card-stats .project-stat-icon{width:16px!important;height:16px!important;min-width:16px!important;max-width:16px!important;flex-basis:16px!important;}
}


/* v244: working WASD selection state only */
.wasd-variant-card.is-selected {
  border-color: rgba(211, 113, 255, .92) !important;
  box-shadow: 0 0 0 2px rgba(192, 83, 255, .22), 0 18px 42px rgba(0,0,0,.3) !important;
}
.wasd-variant-card.is-selected .wasd-variant-select {
  background: linear-gradient(135deg, rgba(133, 48, 188, .5), rgba(80, 30, 119, .55)) !important;
}
.wasd-variant-card.is-selected .wasd-variant-select span::after {
  content: " ✓";
  color: #f3c6ff;
  font-weight: 900;
}


/* v248 — dashboard audience row: lower, roomier, real platform icons */
body[data-page="dashboard"] .analytics-body-clean .chart-wrap{
  margin-bottom:0!important;
}
body[data-page="dashboard"] .platform-audience-inline{
  margin-top:24px!important;
  padding:18px 14px 4px!important;
  min-height:76px!important;
  display:grid!important;
  grid-template-columns:repeat(2,minmax(150px,220px))!important;
  justify-content:center!important;
  align-items:center!important;
  gap:16px 34px!important;
  border-top:1px solid rgba(202,174,255,.18)!important;
}
body[data-page="dashboard"] .platform-audience-item{
  min-height:52px!important;
  padding:8px 14px!important;
  gap:12px!important;
  border:1px solid rgba(202,174,255,.13)!important;
  border-radius:14px!important;
  background:rgba(255,255,255,.025)!important;
}
body[data-page="dashboard"] .platform-audience-item+.platform-audience-item{
  border-left:1px solid rgba(202,174,255,.13)!important;
}
body[data-page="dashboard"] .platform-audience-item .platform-icon{
  width:36px!important;height:36px!important;flex:0 0 36px!important;
  border:0!important;border-radius:9px!important;
  font-size:0!important;color:transparent!important;
  background-color:transparent!important;
  background-repeat:no-repeat!important;
  background-position:center!important;
  background-size:contain!important;
}
body[data-page="dashboard"] .platform-audience-item.twitch .platform-icon{background-image:url('../images/sidebar-social/twitch.png')!important}
body[data-page="dashboard"] .platform-audience-item.youtube .platform-icon{background-image:url('../images/sidebar-social/youtube.png')!important}
body[data-page="dashboard"] .platform-audience-item.tiktok .platform-icon{background-image:url('../images/sidebar-social/tiktok.png')!important}
body[data-page="dashboard"] .platform-audience-copy{display:grid!important;grid-template-columns:auto auto!important;column-gap:7px!important;align-items:baseline!important}
body[data-page="dashboard"] .platform-audience-copy small{grid-column:1!important}
body[data-page="dashboard"] .platform-audience-copy strong{grid-column:2!important;font-size:1.15rem!important}
body[data-page="dashboard"] .platform-audience-copy span{grid-column:1/-1!important;margin-top:1px!important}
@media(max-width:620px){
 body[data-page="dashboard"] .platform-audience-inline{grid-template-columns:1fr!important;gap:10px!important;padding-inline:0!important}
 body[data-page="dashboard"] .platform-audience-item{width:100%!important}
}

/* v249 — visible WASD variant engagement, responsive cards, black Wheel preview, roomier dashboard */
.wasd-variant-card [data-project-engagement]{
  display:flex!important;align-items:center!important;justify-content:flex-start!important;
  gap:9px!important;margin-top:auto!important;padding-top:10px!important;
  border-top:1px solid rgba(202,174,255,.14)!important;
}
.wasd-variant-card .project-engagement-error{display:block!important;flex-basis:100%;font-size:.72rem;color:#d9b7ef}
.wasd-variant-card [data-project-qa],.wasd-variant-card [data-project-ask]{display:none!important}
.wasd-variant-grid{grid-template-columns:repeat(3,minmax(250px,1fr))!important;gap:18px!important;align-items:stretch!important}
.wasd-variant-card{height:100%!important;min-width:0!important;padding:14px!important;gap:12px!important}
.wasd-variant-card>img{aspect-ratio:16/10!important;max-height:290px!important}
.wasd-family-intro{padding:20px!important;min-height:0!important}
.wasd-family-intro .button[data-wasd-download-selected]{align-self:center!important}
.wheel-card-preview-pair .wheel-card-wheel,
.wheel-card-preview-pair .wheel-card-wheel img,
.catmint-wheel-preview-grid,
.catmint-wheel-preview-grid img,
.wheel-live-preview-grid,
.wheel-live-preview-grid img{background:#000!important}
body[data-page="dashboard"] .analytics-body-clean{padding-bottom:28px!important}
body[data-page="dashboard"] .analytics-body-clean .analytics-kpis{margin-bottom:30px!important}
body[data-page="dashboard"] .analytics-body-clean .chart-wrap{margin-top:8px!important;min-height:180px!important}
body[data-page="dashboard"] .platform-audience-inline{margin-top:34px!important;padding:24px 18px 8px!important;gap:20px 42px!important}
body[data-page="dashboard"] .platform-audience-item{min-height:62px!important;padding:11px 16px!important}
@media(max-width:1050px){.wasd-variant-grid{grid-template-columns:repeat(2,minmax(260px,1fr))!important}}
@media(max-width:720px){
 .wasd-variant-grid{grid-template-columns:1fr!important;gap:14px!important}
 .wasd-variant-card{display:flex!important;padding:12px!important}
 .wasd-family-intro{padding:15px!important}
 body[data-page="dashboard"] .analytics-body-clean .analytics-kpis{margin-bottom:24px!important}
 body[data-page="dashboard"] .platform-audience-inline{margin-top:28px!important;padding-top:20px!important}
}

/* v251 final fixes */
.wasd-variant-card [data-project-engagement]{display:flex!important;align-items:center!important;gap:9px!important;flex-wrap:wrap!important;margin-top:auto!important;padding-top:10px!important;border-top:1px solid rgba(202,174,255,.14)!important}
.wasd-variant-card [data-project-heart]{display:inline-flex!important;align-items:center!important;cursor:pointer!important}
.wasd-variant-card [data-project-download-count]{display:inline!important}
.wheel-card-preview-pair .wheel-card-wheel,.wheel-card-preview-pair .wheel-card-wheel img,.catmint-wheel-real-frame-wheel,.catmint-wheel-real-frame-wheel img{background:#000!important}
.project-overview-live-frame-pair .frame-card-preview-pair>span,.project-overview-live-wheel-pair .wheel-card-preview-pair>span{background:#080510!important}

/* v252: actual clickable WASD per-variant heart and download controls */
.wasd-variant-engagement{display:flex!important;position:relative!important;z-index:5!important;pointer-events:auto!important}
.wasd-variant-engagement button{pointer-events:auto!important;position:relative!important;z-index:6!important}
.wasd-variant-engagement .project-heart,.wasd-variant-engagement .project-download-stat{cursor:pointer!important;appearance:none!important;-webkit-appearance:none!important}
.wasd-variant-engagement .project-heart:hover,.wasd-variant-engagement .project-download-stat:hover{border-color:rgba(255,91,207,.8)!important;box-shadow:0 0 18px rgba(255,63,198,.16)!important;transform:translateY(-1px)}

/* v253: unmistakable per-variant heart and download controls */
.wasd-variant-actions{display:grid!important;grid-template-columns:1fr!important;gap:10px!important;margin-top:auto!important}
.wasd-visible-counters{display:grid!important;grid-template-columns:1fr 1fr!important;gap:10px!important;width:100%!important;visibility:visible!important;opacity:1!important;position:relative!important;z-index:30!important;pointer-events:auto!important}
.wasd-visible-counters>button{display:flex!important;align-items:center!important;justify-content:center!important;gap:8px!important;min-height:44px!important;width:100%!important;padding:9px 12px!important;border:1px solid rgba(172,93,255,.75)!important;border-radius:10px!important;background:#120b1e!important;color:#fff!important;font:inherit!important;font-weight:800!important;cursor:pointer!important;pointer-events:auto!important;visibility:visible!important;opacity:1!important;position:relative!important;z-index:31!important}
.wasd-visible-counters>button:hover{border-color:#ff55d6!important;box-shadow:0 0 16px rgba(255,61,200,.2)!important;transform:translateY(-1px)}
.wasd-visible-counters>button:focus-visible{outline:3px solid rgba(255,90,220,.8)!important;outline-offset:2px!important}
.wasd-visible-counters img{display:block!important;width:18px!important;height:18px!important;object-fit:contain!important;flex:0 0 18px!important}
.wasd-visible-counters span{display:inline!important;font-size:.78rem!important;text-transform:uppercase!important;letter-spacing:.04em!important}
.wasd-visible-counters strong{display:inline!important;min-width:1.2em!important;text-align:center!important;font-size:.92rem!important;color:#fff!important}
.wasd-visible-heart.is-hearted{background:rgba(117,29,104,.65)!important;border-color:#ff55d6!important}
@media(max-width:430px){.wasd-visible-counters{grid-template-columns:1fr!important}}

/* v270: use the user's uploaded platform artwork; no text/emoji substitutes. */
body[data-page="dashboard"] .platform-audience-item .platform-icon{font-size:0!important;color:transparent!important;background-repeat:no-repeat!important;background-position:center!important;background-size:contain!important;border:0!important;border-radius:9px!important;width:36px!important;height:36px!important;flex:0 0 36px!important}
body[data-page="dashboard"] .platform-audience-item.twitch .platform-icon{background-image:url('../images/sidebar-social/twitch.png?v=270')!important}
body[data-page="dashboard"] .platform-audience-item.youtube .platform-icon{background-image:url('../images/sidebar-social/youtube.png?v=270')!important}
body[data-page="dashboard"] .platform-audience-item.tiktok .platform-icon{background-image:url('../images/sidebar-social/tiktok.png?v=270')!important}

/* v273 FINAL CARD LAYOUT CONSOLIDATION
   One authoritative dashboard-card layout. No fixed card heights, no clipped content. */
body[data-page="dashboard"] .dashboard-columns{
  display:grid!important;
  grid-template-columns:minmax(300px,.95fr) minmax(440px,1.3fr) minmax(300px,.95fr)!important;
  gap:18px!important;
  align-items:start!important;
}
body[data-page="dashboard"] .dashboard-column{
  display:grid!important;
  gap:18px!important;
  align-content:start!important;
  min-width:0!important;
}
body[data-page="dashboard"] .dashboard-columns .panel,
body[data-page="dashboard"] .clips-panel,
body[data-page="dashboard"] .steam-panel,
body[data-page="dashboard"] .analytics-panel,
body[data-page="dashboard"] .games-panel,
body[data-page="dashboard"] .community-panel,
body[data-page="dashboard"] .youtube-panel{
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
  overflow:visible!important;
  align-self:start!important;
}
body[data-page="dashboard"] .dashboard-columns .panel>.panel-body{
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
  overflow:visible!important;
  box-sizing:border-box!important;
}
body[data-page="dashboard"] .panel-head{
  min-height:54px!important;
  padding:14px 18px!important;
  gap:14px!important;
}
body[data-page="dashboard"] .panel-head h2,
body[data-page="dashboard"] .panel-head a{
  min-width:0!important;
}
body[data-page="dashboard"] .panel-head a{
  white-space:normal!important;
  text-align:right!important;
}

/* Steam card: ordered, evenly spaced, content-sized. */
body[data-page="dashboard"] .steam-panel>.panel-body.steam-card{
  display:grid!important;
  grid-template-rows:auto auto auto!important;
  gap:18px!important;
  padding:20px!important;
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
  overflow:visible!important;
  align-content:start!important;
}
body[data-page="dashboard"] .steam-panel .steam-profile{
  display:grid!important;
  grid-template-columns:112px minmax(0,1fr)!important;
  gap:20px!important;
  align-items:center!important;
  min-height:0!important;
  height:auto!important;
}
body[data-page="dashboard"] .steam-panel .steam-profile img{
  display:block!important;
  width:112px!important;
  height:112px!important;
  margin:0!important;
  padding:4px!important;
  border-radius:20px!important;
  object-fit:cover!important;
  box-sizing:border-box!important;
}
body[data-page="dashboard"] .steam-panel .steam-profile>div{
  display:grid!important;
  gap:7px!important;
  min-width:0!important;
  align-content:center!important;
}
body[data-page="dashboard"] .steam-panel .steam-profile h3{
  margin:0!important;
  max-width:100%!important;
  font-size:clamp(1.35rem,2vw,1.8rem)!important;
  line-height:1.12!important;
  white-space:normal!important;
  overflow-wrap:anywhere!important;
}
body[data-page="dashboard"] .steam-panel .steam-profile p{
  margin:0!important;
  line-height:1.4!important;
}
body[data-page="dashboard"] .steam-panel .info-pairs{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:12px!important;
  margin:0!important;
}
body[data-page="dashboard"] .steam-panel .info-pairs>div{
  display:grid!important;
  align-content:center!important;
  min-height:78px!important;
  padding:14px!important;
  box-sizing:border-box!important;
  overflow:visible!important;
}
body[data-page="dashboard"] .steam-panel .info-pairs strong{
  white-space:normal!important;
  overflow:visible!important;
  text-overflow:clip!important;
  overflow-wrap:anywhere!important;
}
body[data-page="dashboard"] .steam-panel .dashboard-steam-buttons{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:12px!important;
  margin:0!important;
  width:100%!important;
}
body[data-page="dashboard"] .steam-panel .dashboard-steam-buttons .button{
  width:100%!important;
  min-height:46px!important;
  padding:11px 14px!important;
  white-space:normal!important;
  text-align:center!important;
  line-height:1.25!important;
  box-sizing:border-box!important;
}

/* Other dashboard cards: content determines height and text may wrap. */
body[data-page="dashboard"] .clips-panel .panel-body,
body[data-page="dashboard"] .games-panel .panel-body,
body[data-page="dashboard"] .community-panel .panel-body,
body[data-page="dashboard"] .youtube-panel .panel-body{
  padding:16px!important;
}
body[data-page="dashboard"] .mini-media,
body[data-page="dashboard"] .game-row,
body[data-page="dashboard"] .community-person,
body[data-page="dashboard"] .youtube-card{
  min-width:0!important;
  max-width:100%!important;
}
body[data-page="dashboard"] .mini-media h3,
body[data-page="dashboard"] .game-row strong,
body[data-page="dashboard"] .community-person strong,
body[data-page="dashboard"] .youtube-card strong{
  white-space:normal!important;
  overflow:visible!important;
  text-overflow:clip!important;
  overflow-wrap:anywhere!important;
}
body[data-page="dashboard"] .analytics-panel .panel-body{
  display:grid!important;
  gap:16px!important;
  padding:16px!important;
  overflow:visible!important;
}
body[data-page="dashboard"] .analytics-panel .metric-tabs{
  gap:12px!important;
}
body[data-page="dashboard"] .analytics-panel .metric-tab{
  min-width:0!important;
  height:auto!important;
  min-height:126px!important;
  padding:14px!important;
  overflow:visible!important;
}
body[data-page="dashboard"] .analytics-panel .metric-tab span,
body[data-page="dashboard"] .analytics-panel .metric-tab small{
  white-space:normal!important;
  overflow-wrap:anywhere!important;
}
body[data-page="dashboard"] .analytics-panel .chart-wrap{
  min-height:230px!important;
  overflow:visible!important;
}
body[data-page="dashboard"] .platform-audience-inline{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:14px 22px!important;
  padding-top:14px!important;
}

@media(max-width:1180px){
  body[data-page="dashboard"] .dashboard-columns{
    grid-template-columns:minmax(300px,1fr) minmax(420px,1.25fr)!important;
  }
  body[data-page="dashboard"] .dashboard-column:last-child{
    grid-column:1/-1!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}
@media(max-width:900px){
  body[data-page="dashboard"] .dashboard-columns{
    grid-template-columns:1fr!important;
  }
  body[data-page="dashboard"] .dashboard-column:last-child{
    grid-column:auto!important;
    grid-template-columns:1fr!important;
  }
}
@media(max-width:620px){
  body[data-page="dashboard"] .steam-panel>.panel-body.steam-card{padding:18px!important;gap:16px!important}
  body[data-page="dashboard"] .steam-panel .steam-profile{
    grid-template-columns:1fr!important;
    justify-items:center!important;
    text-align:center!important;
  }
  body[data-page="dashboard"] .steam-panel .steam-profile img{
    width:132px!important;
    height:132px!important;
  }
  body[data-page="dashboard"] .steam-panel .steam-profile>div{justify-items:center!important}
  body[data-page="dashboard"] .steam-panel .info-pairs,
  body[data-page="dashboard"] .steam-panel .dashboard-steam-buttons{
    grid-template-columns:1fr!important;
  }
  body[data-page="dashboard"] .analytics-panel .metric-tabs{
    grid-template-columns:1fr!important;
  }
  body[data-page="dashboard"] .analytics-panel .metric-tab[data-chart-metric="youtube"]{grid-column:auto!important}
}


/* v275 — compact mobile-order Steam card; never squeeze the neighbouring dashboard card. */
body[data-page="dashboard"] article.steam-panel,
body[data-page="dashboard"] article.steam-panel > .panel-body.steam-card {
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
}
body[data-page="dashboard"] article.steam-panel > .panel-body.steam-card {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-rows: auto auto auto !important;
  align-content: start !important;
  align-items: stretch !important;
  gap: 14px !important;
  padding: 17px !important;
  overflow: visible !important;
}
body[data-page="dashboard"] article.steam-panel .steam-profile {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  justify-items: center !important;
  align-items: start !important;
  gap: 9px !important;
  min-height: 0 !important;
  text-align: center !important;
}
body[data-page="dashboard"] article.steam-panel .steam-profile img {
  width: 82px !important;
  height: 82px !important;
  min-width: 82px !important;
  max-width: 82px !important;
  padding: 3px !important;
  margin: 0 !important;
  border-radius: 16px !important;
  object-fit: cover !important;
}
body[data-page="dashboard"] article.steam-panel .steam-profile > div {
  display: grid !important;
  justify-items: center !important;
  align-content: start !important;
  gap: 4px !important;
  width: 100% !important;
  min-width: 0 !important;
}
body[data-page="dashboard"] article.steam-panel .steam-profile h3 {
  margin: 0 !important;
  font-size: clamp(1.2rem, 1.45vw, 1.48rem) !important;
  line-height: 1.12 !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
}
body[data-page="dashboard"] article.steam-panel .steam-profile p {
  margin: 0 !important;
  line-height: 1.35 !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
}
body[data-page="dashboard"] article.steam-panel .steam-card .info-pairs {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px !important;
  margin: 0 !important;
}
body[data-page="dashboard"] article.steam-panel .steam-card .info-pairs > div {
  min-height: 62px !important;
  padding: 11px 12px !important;
  align-content: center !important;
  gap: 4px !important;
}
body[data-page="dashboard"] article.steam-panel .dashboard-steam-buttons {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px !important;
  margin: 0 !important;
}
body[data-page="dashboard"] article.steam-panel .dashboard-steam-buttons .button {
  min-height: 43px !important;
  padding: 10px 11px !important;
  line-height: 1.2 !important;
  white-space: normal !important;
}
@media (max-width: 1260px) {
  body[data-page="dashboard"] .dashboard-columns {
    grid-template-columns: minmax(300px, .9fr) minmax(480px, 1.35fr) !important;
  }
  body[data-page="dashboard"] .dashboard-column:last-child {
    grid-column: 1 / -1 !important;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(300px, 1fr)) !important;
    gap: 16px !important;
  }
}
@media (max-width: 920px) {
  body[data-page="dashboard"] .dashboard-columns {
    grid-template-columns: minmax(0, 1fr) !important;
  }
  body[data-page="dashboard"] .dashboard-column:last-child {
    grid-column: auto !important;
    grid-template-columns: minmax(0, 1fr) !important;
  }
}
@media (max-width: 560px) {
  body[data-page="dashboard"] article.steam-panel > .panel-body.steam-card {
    gap: 13px !important;
    padding: 15px !important;
  }
  body[data-page="dashboard"] article.steam-panel .steam-profile img {
    width: 76px !important;
    height: 76px !important;
    min-width: 76px !important;
    max-width: 76px !important;
  }
  body[data-page="dashboard"] article.steam-panel .steam-card .info-pairs,
  body[data-page="dashboard"] article.steam-panel .dashboard-steam-buttons {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

/* v291: PawsOnStream catalogue preview is an inset box instead of sitting flush against the card edges. */
body[data-page="projects"] .project-overview-card[data-project-slug="pawsonstream"] > .project-overview-live-pos {
  box-sizing: border-box !important;
  width: calc(100% - 24px) !important;
  height: 158px !important;
  min-height: 158px !important;
  margin: 12px 12px 0 !important;
  overflow: hidden !important;
  border: 1px solid rgba(202, 174, 255, .42) !important;
  border-radius: 14px !important;
  background: #080510 !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.025), 0 8px 20px rgba(0,0,0,.24) !important;
}
body[data-page="projects"] .project-overview-card[data-project-slug="pawsonstream"] > .project-overview-live-pos iframe {
  border-radius: 12px !important;
}
@media (max-width: 900px) {
  body[data-page="projects"] .project-overview-card[data-project-slug="pawsonstream"] > .project-overview-live-pos {
    width: calc(100% - 20px) !important;
    height: 142px !important;
    min-height: 142px !important;
    margin: 10px 10px 0 !important;
  }
}


/* v305 — same Scratchmeow arrow as desktop, rotated upward for back-to-top */
.back-to-top-scratchmeow{
  display:none;position:fixed;right:max(16px,env(safe-area-inset-right));bottom:max(18px,calc(env(safe-area-inset-bottom) + 12px));
  z-index:68;width:48px;height:48px;padding:0;align-items:center;justify-content:center;
  border:1px solid rgba(205,126,255,.72);border-radius:14px;background:rgba(31,10,50,.94);color:#fff;
  box-shadow:0 0 20px rgba(172,68,255,.32);cursor:pointer;opacity:0;transform:translateY(14px);pointer-events:none;
  transition:opacity .18s ease,transform .18s ease,border-color .18s ease,background .18s ease;
}
.back-to-top-scratchmeow span{display:block;font-family:"Scratchmeow5","Rajdhani",sans-serif;font-size:38px;line-height:1;transform:rotate(-90deg);transform-origin:center;}
.back-to-top-scratchmeow:hover{border-color:#ed8cff;background:rgba(71,20,107,.97)}
.back-to-top-scratchmeow:focus-visible{outline:2px solid #f06cff;outline-offset:3px}
@media (max-width:900px){.back-to-top-scratchmeow{display:inline-flex}.back-to-top-scratchmeow.is-visible{opacity:1;transform:translateY(0);pointer-events:auto}body.nav-open .back-to-top-scratchmeow{opacity:0;pointer-events:none}}
@media (prefers-reduced-motion:reduce){.back-to-top-scratchmeow{transition:none}}

/* v315: keep sidebar footer visible on normal desktop/laptop heights */
@media (min-width: 901px) and (max-height: 1100px) {
  .app-sidebar .brand { min-height: 62px !important; padding-block: 6px !important; }
  .app-sidebar .sidebar-nav { gap: 3px !important; padding-block: 8px !important; }
  .app-sidebar .sidebar-nav a { min-height: 43px !important; padding-block: 5px !important; }
  .app-sidebar .sidebar-nav a > span { font-size: clamp(17px, 1.25vw, 21px) !important; }
  .app-sidebar .sidebar-footer { padding: 5px 10px 8px !important; }
  .app-sidebar .sidebar-chibi { width: 66px !important; margin-bottom: 0 !important; }
  .sidebar-footer .sidebar-socials,.sidebar-footer .sidebar-socials-glossy {grid-template-columns:repeat(4,31px)!important;grid-auto-rows:31px!important;width:142px!important;gap:5px!important;margin:3px auto 5px!important;}
  .sidebar-footer .sidebar-socials a,.sidebar-footer .sidebar-socials-glossy a,.sidebar-footer .sidebar-socials a img,.sidebar-footer .sidebar-socials-glossy a img {width:31px!important;height:31px!important;min-width:31px!important;min-height:31px!important;}
  .app-sidebar .sidebar-footer small { font-size: 10px !important; }
}

/* v329 — mobile project cards: one readable card per row */
@media screen and (max-width: 820px) {
  body[data-page="projects"] .project-jump-nav,
  body[data-page="projects"] .project-grid,
  body[data-page="projects"] .project-grid-v4,
  body[data-page="projects"] .projects-grid {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    width: 100% !important;
  }
  body[data-page="projects"] .project-overview-card,
  body[data-page="projects"] .project-card-v4,
  body[data-page="projects"] .project-grid > article {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
  }
}

/* ========================================================================== 
   v333 — C4TM30W BALANCED FLUID SITE SHELL
   Presentation-only. The page uses all available width AFTER the sidebar,
   with equal left/right breathing room. No project/download/data behavior.
   ========================================================================== */
:root {
  --c4-page-edge: clamp(22px, 1.65vw, 40px);
  --c4-page-top: clamp(18px, 1.4vw, 28px);
  --c4-section-gap: clamp(18px, 1.35vw, 30px);
  --c4-card-gap: clamp(12px, 1vw, 18px);
}

/* Desktop shell math: sidebar + remaining viewport, never a centered 1500px island. */
@media (min-width: 901px) {
  body[data-page] .app-shell {
    box-sizing: border-box !important;
    width: calc(100% - var(--sidebar)) !important;
    max-width: none !important;
    margin-left: var(--sidebar) !important;
    margin-right: 0 !important;
  }
}

/* Exact balanced content width inside the shell. The stronger selector is
   intentional so older page-specific !important width caps cannot win. */
body[data-page] main.page-content,
body[data-page] .page-footer {
  box-sizing: border-box !important;
  width: calc(100% - var(--c4-page-edge) - var(--c4-page-edge)) !important;
  max-width: none !important;
  min-width: 0 !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
body[data-page] main.page-content {
  padding-top: var(--c4-page-top) !important;
  padding-bottom: clamp(36px, 3vw, 54px) !important;
  container-type: inline-size;
  container-name: c4tm30w-page;
}

/* Consistent rhythm. */
body[data-page] main.page-content > * + * {
  margin-top: var(--c4-section-gap) !important;
}
body[data-page] :is(
  .dashboard-top,.dashboard-columns,.dashboard-column,.page-grid,.copy-grid,
  .column-stack,.media-grid,.playlist-grid,.recommendations-grid,.tool-link-grid,
  .support-link-grid,.tools-board,.project-grid,.project-grid-v4,.project-showcase,
  .project-jump-nav,.support-action-grid,.medal-grid,.gallery-grid,.cs2-link-card-grid,
  .cs2-tool-grid,.real-project-information,.project-package-grid,
  .project-verification-stats,.cms-screenshot-grid
) {
  gap: var(--c4-card-gap) !important;
}

/* Fill the available cells; only prose is intentionally width-limited. */
body[data-page] :is(
  .panel,.real-project,.project-overview-card,.project-card-v4,.tool-card-pro,
  .tool-link-card,.support-link-card,.project-info-panel,.project-package-panel,
  .project-verification-panel,.site-screenshot-gallery,.maker-project-page
) {
  min-width: 0 !important;
  max-width: none !important;
}
body[data-page] :is(
  .page-title-row > div:first-child > p:not(.eyebrow),
  .article-text,.reading-width,.long-description
) {
  max-width: 1000px;
}

/* Dashboard consumes the whole balanced content region. */
body[data-page="dashboard"] .dashboard-top,
body[data-page="dashboard"] .dashboard-columns {
  width: 100% !important;
  max-width: none !important;
}

/* Tablet: smaller but still equal page edges. */
@media (max-width: 900px) {
  :root {
    --c4-page-edge: clamp(16px, 2.6vw, 24px);
    --c4-page-top: clamp(14px, 2vw, 20px);
    --c4-section-gap: clamp(16px, 2.2vw, 22px);
    --c4-card-gap: clamp(12px, 2vw, 16px);
  }
  body[data-page] .app-shell {
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  body[data-page] main.page-content,
  body[data-page] .page-footer {
    width: calc(100% - var(--c4-page-edge) - var(--c4-page-edge)) !important;
    max-width: none !important;
    margin-inline: auto !important;
  }
}

/* Phone: compact equal edges and readable full-width cards. */
@media (max-width: 620px) {
  :root {
    --c4-page-edge: clamp(12px, 3.8vw, 16px);
    --c4-page-top: clamp(12px, 3vw, 18px);
    --c4-section-gap: clamp(14px, 3.5vw, 20px);
    --c4-card-gap: clamp(10px, 3vw, 14px);
  }
  .real-project-header,
  .panel-body,
  .project-info-panel,
  .project-package-panel,
  .project-verification-panel {
    padding-left: clamp(14px, 4vw, 18px) !important;
    padding-right: clamp(14px, 4vw, 18px) !important;
  }
}

/* Projects: never squeeze multiple project cards beside one another on phones. */
@media screen and (max-width: 820px) {
  body[data-page="projects"] :is(.project-jump-nav,.project-grid,.project-grid-v4,.projects-grid) {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    width: 100% !important;
  }
  body[data-page="projects"] :is(.project-overview-card,.project-card-v4,.project-grid > article) {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
  }
}


/* v334 — Tools categories: Scratchmeow5 uppercase headers + sidebar-style dividers. */
@font-face {
  font-family: "Scratchmeow5";
  src: url("../fonts/Scratchmeow5-Regular.ttf") format("truetype");
  font-display: swap; font-style: normal; font-weight: 400;
}
body[data-page="tools"] .tools-categories{display:flex!important;flex-direction:column;width:100%;min-width:0;gap:0!important}
body[data-page="tools"] .tools-category{width:100%;min-width:0;padding-block:clamp(14px,1.4vw,22px)}
body[data-page="tools"] .tools-category:first-child{padding-top:4px}
body[data-page="tools"] .tools-category-separated{position:relative;margin-top:clamp(4px,.6vw,8px);padding-top:clamp(22px,2vw,30px)}
body[data-page="tools"] .tools-category-separated::before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(186,102,255,.42),transparent)}
body[data-page="tools"] .tools-category-heading{display:flex;align-items:center;min-height:34px;margin:0 0 clamp(10px,1vw,14px)}
body[data-page="tools"] .tools-category-title{margin:0;font-family:"Scratchmeow5","Scratchmeow5","Rajdhani","Arial Narrow",Arial,sans-serif!important;font-size:clamp(22px,1.7vw,30px);line-height:1.05;font-weight:400!important;letter-spacing:.035em;text-transform:uppercase;color:#f4ecff;font-synthesis:none}
body[data-page="tools"] .tools-category-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(320px,100%),1fr));gap:clamp(12px,1.2vw,18px);width:100%;min-width:0}
body[data-page="tools"] .tools-category-grid>.tool-card-pro{width:100%;min-width:0;max-width:none!important}
@media(max-width:820px){body[data-page="tools"] .tools-category{padding-block:14px}body[data-page="tools"] .tools-category-separated{padding-top:20px;margin-top:2px}body[data-page="tools"] .tools-category-heading{margin-bottom:10px}body[data-page="tools"] .tools-category-title{font-size:24px}body[data-page="tools"] .tools-category-grid{grid-template-columns:minmax(0,1fr)!important;gap:12px}}


/* v335 — Tools priority order + compact footer rhythm.
   Keep the follow strip aligned to the same balanced page edges and remove
   the oversized dead zone below the final tool category. */
body[data-page="tools"] main.page-content {
  padding-bottom: clamp(14px, 1.25vw, 22px) !important;
}
body[data-page="tools"] .tools-category:last-child {
  padding-bottom: clamp(8px, .8vw, 14px) !important;
}
body[data-page="tools"] .follow-platform-strip {
  box-sizing: border-box !important;
  width: calc(100% - var(--c4-page-edge) - var(--c4-page-edge)) !important;
  max-width: none !important;
  margin: clamp(10px, 1vw, 16px) auto 0 !important;
}
body[data-page="tools"] .page-footer {
  margin-top: clamp(10px, 1vw, 16px) !important;
}
@media (max-width: 620px) {
  body[data-page="tools"] main.page-content { padding-bottom: 10px !important; }
  body[data-page="tools"] .tools-category:last-child { padding-bottom: 6px !important; }
  body[data-page="tools"] .follow-platform-strip {
    width: calc(100% - var(--c4-page-edge) - var(--c4-page-edge)) !important;
    margin-top: 10px !important;
  }
  body[data-page="tools"] .page-footer { margin-top: 10px !important; }
}


/* v345 — Site-wide branded headings: Scratchmeow5 + uppercase. */
@font-face{
  font-family:'Scratchmeow5';
  src:url('../fonts/Scratchmeow5-Regular.ttf') format('truetype');
  font-style:normal;
  font-weight:400;
  font-display:swap;
}
:where(
  h1,h2,h3,h4,h5,h6,
  .page-title,.section-title,.hero-title,.project-title,.maker-title,
  .real-project-header h1,.real-project-header h2,.real-project-header h3,
  .dashboard-section-title,.content-section-title,.tool-category-title,
  .tools-category-title,.category-title,.panel-title,.card-section-title,
  .quickGuide h2,.maker-project-page h1,.maker-project-page h2,.maker-project-page h3,
  .project-page h1,.project-page h2,.project-page h3,
  .page-content > header h1,.page-content > header h2,.page-content > header h3,
  main h1,main h2,main h3
){
  font-family:'Scratchmeow5',Inter,'Segoe UI',Arial,sans-serif !important;
  font-weight:400 !important;
  text-transform:uppercase !important;
  letter-spacing:.01em;
}


/* v346 — C4TM30W heading rule: every visible heading-like title uses Scratchmeow5 CAPS. */
html body h1,
html body h2,
html body h3,
html body h4,
html body h5,
html body h6,
html body .page-title,
html body .page-title-row h1,
html body .page-title-row h2,
html body .real-project-header h1,
html body .real-project-header h2,
html body .real-project-header h3,
html body .tools-category-title,
html body .tool-card-copy h2,
html body .tool-card-copy h3,
html body .recommendation-card h3,
html body .recommendation-card h2,
html body .counter-subnav a,
html body .cs2-service-card h2,
html body .cs2-service-card h3,
html body .cs2-group-head,
html body .panel-head h2,
html body .panel-head h3,
html body .project-card h2,
html body .project-card h3,
html body .project-overview-card h2,
html body .project-overview-card h3,
html body .game-card h2,
html body .game-card h3,
html body .media-card h2,
html body .media-card h3,
html body .playlist-card h2,
html body .playlist-card h3,
html body .copy-card h2,
html body .copy-card h3,
html body [class*="section-title"],
html body [class*="sectionTitle"],
html body [class*="card-title"],
html body [class*="cardTitle"] {
  font-family:'Scratchmeow5',Inter,'Segoe UI',Arial,sans-serif !important;
  font-weight:400 !important;
  text-transform:uppercase !important;
  letter-spacing:.02em !important;
  font-synthesis:none !important;
}


/* v347 — Correct semantic branding rule.
   Scratchmeow5 CAPS is for real headers/titles and project names.
   Program/tool names and creator/channel names are content names, not headers. */

/* Tool/program names: readable content font, preserve product capitalization. */
html body[data-page="tools"] .tool-card-copy h1,
html body[data-page="tools"] .tool-card-copy h2,
html body[data-page="tools"] .tool-card-copy h3,
html body[data-page="tools"] .tool-card-copy h4 {
  font-family:Inter,'Segoe UI',Arial,sans-serif !important;
  font-weight:700 !important;
  text-transform:none !important;
  letter-spacing:normal !important;
}

/* Recommended creator/channel names: readable content font, preserve their actual names. */
html body[data-page="recommendations"] .recommendation-card h1,
html body[data-page="recommendations"] .recommendation-card h2,
html body[data-page="recommendations"] .recommendation-card h3,
html body[data-page="recommendations"] .recommendation-card h4,
html body .creator-card .creator-name,
html body .recommendation-card .creator-name {
  font-family:Inter,'Segoe UI',Arial,sans-serif !important;
  font-weight:700 !important;
  text-transform:none !important;
  letter-spacing:normal !important;
}

/* Project names ARE headers, including project overview cards whose title is a <strong>. */
html body[data-page="projects"] .project-overview-card > strong,
html body[data-page="projects"] .project-card .project-name,
html body[data-page="projects"] .project-title,
html body [data-project-slug] > .project-name {
  font-family:'Scratchmeow5',Inter,'Segoe UI',Arial,sans-serif !important;
  font-weight:400 !important;
  text-transform:uppercase !important;
  letter-spacing:.02em !important;
  font-synthesis:none !important;
}


/* v348 — Readability scope for Scratchmeow5.
   Scratchmeow5 is reserved for short structural headers/project names.
   Sentence-like content titles stay in the normal readable UI font. */
html body .schedule-item h3,
html body .media-card h3,
html body .media-card-copy h3,
html body [data-live-page-title],
html body [data-media-youtube] .media-card h3,
html body [data-media-vods] .media-card h3,
html body [data-media-clips] .media-card h3,
html body [data-live-vods] .media-card h3,
html body [data-live-clips] .media-card h3 {
  font-family:Inter,'Segoe UI',Arial,sans-serif !important;
  font-weight:700 !important;
  text-transform:none !important;
  letter-spacing:normal !important;
  font-synthesis:auto !important;
}

/* Dynamic stream/VOD/video titles are content, even when rendered in heading elements. */
html body [data-live-page-title],
html body .schedule-item h3,
html body .media-card h3 {
  line-height:1.35 !important;
}

/* v349 — globally visible sidebar separators + compact 9-language dropdown. */
.sidebar-nav-divider{display:block!important;width:auto!important;height:1px!important;margin:8px 11px!important;background:linear-gradient(90deg,transparent 0%,rgba(186,102,255,.30) 8%,rgba(206,145,255,.82) 50%,rgba(186,102,255,.30) 92%,transparent 100%)!important;box-shadow:0 0 7px rgba(177,91,255,.16)!important;opacity:1!important;flex:0 0 auto!important}
.language-flags.language-dropdown{position:relative!important;display:block!important;padding:0!important;border:0!important;background:transparent!important;box-shadow:none!important;overflow:visible!important}
.language-current{display:flex;align-items:center;justify-content:center;gap:2px;width:43px;height:38px;padding:2px 4px;border:1px solid rgba(160,127,217,.35);border-radius:11px;background:rgba(13,10,24,.9);color:#e9dcff;cursor:pointer;box-shadow:0 7px 20px rgba(0,0,0,.18)}
.language-current:hover,.language-dropdown.open .language-current{border-color:#9d5cff;background:rgba(126,34,206,.18)}
.language-current img{display:block;width:30px;height:30px;object-fit:contain}.language-current-chevron{font-size:11px;line-height:1;transform:translateY(-1px)}
.language-menu{position:absolute;z-index:1000;top:calc(100% + 7px);right:0;display:none;width:max-content;min-width:205px;padding:6px;border:1px solid rgba(157,92,255,.46);border-radius:12px;background:#100b19;box-shadow:0 18px 44px rgba(0,0,0,.46)}
.language-dropdown.open .language-menu{display:grid;gap:2px}.language-menu-item{display:grid;grid-template-columns:30px minmax(0,1fr) 18px;align-items:center;gap:8px;min-height:38px;padding:5px 8px;border:1px solid transparent;border-radius:8px;color:#eee7f7;text-decoration:none!important;white-space:nowrap}.language-menu-item:hover{background:rgba(137,63,255,.12);border-color:rgba(157,92,255,.22)}.language-menu-item.active{background:rgba(126,34,206,.20);border-color:rgba(157,92,255,.42)}.language-menu-item img{width:26px;height:26px;object-fit:contain}.language-check{text-align:right;color:#c78cff;font-weight:900}@media(max-width:760px){.language-current{width:39px;height:34px;border-radius:9px}.language-current img{width:27px;height:27px}.language-menu{right:-4px;min-width:196px;max-height:min(68vh,420px);overflow:auto}}