/* ══════════════════════════════════════════════════════════════════
   design-lint: allow hover-movement (Header.dc.html 10a — kullanıcının tasarımı)
   Yeni header. Kaynak: Claude Design projesi "Header.dc.html" 10a (canlı header), 11a/11b
   (oturum açık sağ uç) ve "1b Header - Mobil.dc.html" 1a/2a/2c/3a. Kurallar tasarım dosyasından
   aynen alındı; yalnız kapsam #t10/#t11 yerine .v2h (masaüstü) ve .v2m (mobil) oldu.
   Kabuk anahtarı: inc/design-preview.php (vgnw_v2_shell).
   ══════════════════════════════════════════════════════════════════ */
.v2h, .v2m, .v2h-dim {
  --mctr-red: #ED2C29; --mctr-red-dark: #9F1715; --mctr-red-soft: #FF8D86;
  --bg-1: #171615; --bg-2: #262423; --bg-2-alt: #2E2C2C; --bg-3: #3D3938;
  --bg-darker: #100F0E; --bg-darkest: #0A0909; --bg-button: #373432; --bg-card: #1E1C1B;
  --fg-1: #FFFFFF; --fg-2: rgba(255,255,255,.80); --fg-3: rgba(255,255,255,.66);
  --fg-muted: rgba(255,255,255,.50); --fg-faint: rgba(255,255,255,.40);
  --status-online: #18B122; --status-offline: #6B6B6B;
  --shadow-seat: inset 0 -5px 0 rgba(0,0,0,.15);
  --shadow-tag: 1.746px 1.746px 0 0 rgba(0,0,0,.30);
  --e9: cubic-bezier(.2,.8,.2,1);
}

/* ── kabuk içi sıfırlama (:where = sıfır özgüllük; tasarım kuralları her zaman kazanır) ── */
:where(.v2h, .v2m) { font-family: var(--font-body); font-size: 14px; line-height: 1.4; color: var(--fg-1); -webkit-font-smoothing: none; font-synthesis: none; }
:where(.v2h, .v2m) :where(*, *::before, *::after) { box-sizing: border-box; }
:where(.v2h, .v2m) :where(a) { color: inherit; text-decoration: none; }
:where(.v2h, .v2m) :where(a:hover) { color: #fff; }
:where(.v2h, .v2m) :where(img) { image-rendering: pixelated; display: block; max-width: none; }
:where(.v2h, .v2m) :where(img.ren) { image-rendering: auto; }
:where(.v2h, .v2m) :where(b, strong) { font-weight: 400; }
:where(.v2h, .v2m) :where(h3, h5, p) { margin: 0; font-weight: 400; }
:where(.v2h, .v2m) :where(button) { font: inherit; color: inherit; background: none; border: 0; padding: 0; margin: 0; cursor: pointer; text-align: inherit; -webkit-tap-highlight-color: transparent; }
:where(.v2h, .v2m) :where(input) { font: inherit; color: inherit; background: none; border: 0; outline: 0; margin: 0; padding: 0; min-width: 0; border-radius: 0; }
:where(.v2h, .v2m) :where(code, kbd) { font: inherit; }
:where(.v2h, .v2m) :where(:focus-visible) { outline: 2px solid #fff; outline-offset: 2px; }
.v2h [hidden], .v2m [hidden] { display: none !important; }

/* ── kit temel parçaları (kit.css) ── */
.v2h .k-wrap { width: min(1200px, calc(100% - 32px)); margin: 0 auto; }
.v2h .k-head { width: 36px; height: 36px; image-rendering: pixelated; flex: none; }
.v2h .k-btn, .v2m .k-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 40px; padding: 0 18px; border: 0; cursor: pointer; font-family: var(--font-pixel); font-size: 11px; letter-spacing: 1.6px; text-transform: uppercase; color: var(--fg-1); background: var(--bg-button); box-shadow: 0 3px 0 0 #232120; }
.v2h .k-btn:hover, .v2m .k-btn:hover { background: #45413f; }
.v2h .k-btn--red, .v2m .k-btn--red { background: var(--mctr-red); box-shadow: 0 4px 0 0 var(--mctr-red-dark); }
.v2h .k-btn--red:hover, .v2m .k-btn--red:hover { background: #d92421; }
.v2h .k-tag { display: inline-flex; align-items: center; height: 18px; padding: 0 6px; font-family: var(--font-pixel); font-size: 9px; letter-spacing: 1.2px; text-transform: uppercase; background: #0F0E0E; color: var(--fg-2); box-shadow: var(--shadow-tag); white-space: nowrap; }
.v2h .k-tag--line { background: transparent; box-shadow: inset 0 0 0 1px rgba(255,255,255,.16); }
.v2h .k-dot { width: 8px; height: 8px; background: var(--status-online); flex: none; }

/* ══ TASARIM DOSYASINDAN (Header.dc.html) ══════════════════════════ */
.v2h .k-page b, .v2h .k-page strong { font-weight: 400; }
.v2h .k-page img.ren { image-rendering: auto; }
.v2h .k-page :focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
.v2h .h-top { background: #100F0E; border-bottom: 1px solid rgba(255,255,255,.06); }
.v2h .h-top .k-wrap { display: flex; align-items: center; gap: 20px; height: 30px; font-family: var(--font-pixel); font-size: 9px; letter-spacing: 1.4px; text-transform: uppercase; color: rgba(255,255,255,.62); }
.v2h .h-top .sp { margin-left: auto; }
.v2h .h-bar { position: relative; z-index: 4; background: #141312; border-bottom: 2px solid #000; box-shadow: 0 2px 0 rgba(255,255,255,.04); }
.v2h .h-in { display: flex; align-items: stretch; gap: 26px; height: 60px; }
.v2h .h-logo { display: flex; align-items: center; flex: none; margin-right: 4px; }
.v2h .h-logo .mctr-grass { --mctr-grass-size: 40px; }
.v2h .h-nav { display: flex; align-items: stretch; gap: 30px; font-family: var(--font-pixel); font-size: 11px; letter-spacing: 1.6px; text-transform: uppercase; color: rgba(255,255,255,.9); }
.v2h .h-nl { position: relative; display: flex; align-items: center; gap: 7px; white-space: nowrap; transition: color 160ms ease, background 200ms ease; }
.v2h .h-car { width: 9px; height: 7px; transform: rotate(180deg); opacity: .85; transition: transform 240ms cubic-bezier(.2,.7,.2,1); }
.v2h .h-r { margin-left: auto; display: flex; align-items: center; gap: 20px; font-family: var(--font-pixel); font-size: 11px; letter-spacing: 1.6px; text-transform: uppercase; }
.v2h .h-r a { display: flex; align-items: center; gap: 7px; white-space: nowrap; }
.v2h .h-i16 { width: 16px; height: 16px; }
.v2h .h-sf { display: flex; align-items: center; gap: 8px; height: 36px; padding: 0 4px; color: rgba(255,255,255,.75); }
.v2h .h-sf:hover { color: #fff; }
.v2h .h-av { position: relative; width: 32px; height: 32px; flex: none; }
.v2h .h-av .k-head { width: 32px; height: 32px; }
.v2h .h-mega { position: absolute; left: 0; right: 0; top: 100%; z-index: 5; padding: 22px 0 26px; background: #262423; box-shadow: inset 0 -4px 0 rgba(0,0,0,.35), 0 4px 0 rgba(0,0,0,.35); font-family: var(--font-body); }
@media (prefers-reduced-motion: no-preference) {
  .v2h .h-mega { animation: megaIn 260ms cubic-bezier(.2,.7,.2,1) both; }
  @keyframes megaIn { from { opacity: 0; transform: translateY(-8px); } }
  @keyframes colIn { from { opacity: 0; transform: translateY(6px); } }
}
.v2h .nm-hd { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin: 0 0 12px; font-family: var(--font-pixel); font-size: 9px; letter-spacing: 1.4px; text-transform: uppercase; color: rgba(255,255,255,.62); }
.v2h .nm-hd a { white-space: nowrap; transition: color 160ms ease; }
.v2h .nm-hd a:hover { color: #fff; }
.v2h .at-f { display: flex; align-items: center; gap: 8px; height: 36px; padding: 0 10px; background: #0A0909; box-shadow: inset 0 0 0 1px rgba(255,255,255,.14); }
.v2h .at-f:focus-within { box-shadow: inset 0 0 0 1px #fff; }
.v2h .at-f img { width: 14px; height: 14px; opacity: .7; }
.v2h .at-f input { flex: 1; min-width: 0; height: 100%; padding: 0; border: 0; outline: 0; background: transparent; color: #fff; font-family: var(--font-body); font-size: 14px; }
.v2h .at-f input:focus-visible { outline: 0; }
.v2h .at-f input::placeholder { color: var(--fg-faint); }
@media (prefers-reduced-motion: no-preference) {
  .v2h .h-mega .nm > * { animation: colIn 420ms cubic-bezier(.2,.7,.2,1) both; }
  .v2h .h-mega .nm > *:nth-child(2) { animation-delay: 60ms; }
  .v2h .h-mega .nm > *:nth-child(3) { animation-delay: 120ms; }
  .v2h .h-mega .nm > *:nth-child(4) { animation-delay: 180ms; }
  .v2h .h-mega .nm > *:nth-child(5) { animation-delay: 240ms; }
  
  
  
  
}
.v2h .q-res { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-top: 12px; font-size: 12px; line-height: 1.35; color: var(--fg-2); }
.v2h .q-res a { flex: none; font-family: var(--font-pixel); font-size: 9px; letter-spacing: 1.2px; text-transform: uppercase; color: #fff; }
.v2h .q-well { display: grid; grid-template-columns: auto 30px auto; align-items: center; justify-content: center; gap: 14px; margin-top: 12px; padding: 14px; background: #141312; }
.v2h .q-cg { display: grid; grid-template-columns: repeat(3, 40px); }
.v2h .q-sl, .v2h .q-out { position: relative; display: grid; place-items: center; width: 40px; height: 40px; background: #262423; box-shadow: inset 2px 2px 0 #0A0909, inset -2px -2px 0 #3D3938; }
.v2h .q-sl img { width: 32px; height: 32px; }
.v2h .q-out { width: 56px; height: 56px; }
.v2h .q-out img { width: 32px; height: 32px; }
.v2h .q-out img.ren { width: 46px; height: 46px; }
.v2h .x-lk { font-family: var(--font-pixel); font-size: 9px; letter-spacing: 1.4px; text-transform: uppercase; color: rgba(255,255,255,.62); white-space: nowrap; transition: color 160ms ease; }
.v2h .x-lk:hover { color: #fff; }
.v2h .x-ey { font-family: var(--font-pixel); font-size: 8px; letter-spacing: 1.3px; text-transform: uppercase; color: rgba(255,255,255,.72); }
.v2h .xt-r { display: grid; grid-template-columns: 36px minmax(0, 1fr) 52px 48px; gap: 14px; align-items: center; padding: 11px 10px; border-bottom: 1px solid rgba(255,255,255,.06); transition: background 200ms ease; }
.v2h .xt-r:hover { background: #2E2C2C; }
.v2h .xt-r > img { width: 36px; height: 36px; }
.v2h .xt-r b { display: block; font-size: 14px; line-height: 1.25; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.v2h .xt-r small { display: block; margin-top: 4px; font-size: 11px; color: var(--fg-muted); }
.v2h .xt-n { display: grid; justify-items: center; padding: 5px 0 4px; background: #1E1C1B; }
.v2h .xt-n b { font-size: 15px; line-height: 1; }
.v2h .xt-n small { margin-top: 3px; font-family: var(--font-pixel); font-size: 7px; letter-spacing: 1px; text-transform: uppercase; }
.v2h .xt-r em { font-style: normal; font-size: 11px; color: var(--fg-muted); text-align: right; white-space: nowrap; }
.v2h .xt-pod { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: end; gap: 6px; }
.v2h .xt-p { display: grid; justify-items: center; gap: 5px; text-align: center; }
.v2h .xt-p img { width: 40px; height: 40px; }
.v2h .xt-p.p1 img { width: 52px; height: 52px; }
.v2h .xt-p b { font-size: 12px; line-height: 1.1; }
.v2h .xt-p small { font-family: var(--font-pixel); font-size: 8px; letter-spacing: 1px; color: var(--fg-muted); }
.v2h .xt-p i { display: grid; place-items: center; width: 100%; margin-top: 4px; background: #1E1C1B; box-shadow: inset 0 3px 0 rgba(255,255,255,.06); font-style: normal; font-family: var(--font-display); font-size: 22px; color: rgba(255,255,255,.35); }
.v2h .xt-p.p1 i { height: 68px; color: var(--mctr-red); }
.v2h .xt-p.p2 i { height: 48px; }
.v2h .xt-p.p3 i { height: 34px; }
.v2h .xt-clw { margin-top: 18px; padding-top: 14px; border-top: 1px solid rgba(255,255,255,.08); }
.v2h .xt-cl { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; }
.v2h .xt-cl a { display: grid; justify-items: center; gap: 6px; padding: 8px 2px; text-align: center; transition: background 200ms ease; }
.v2h .xt-cl a:hover { background: #2E2C2C; }
.v2h .xt-cl img { box-sizing: border-box; width: 44px; height: 44px; padding: 5px; background: #1B1A19; border: 1px solid rgba(255,255,255,.16); object-fit: contain; image-rendering: auto; }
.v2h .xt-cl span { font-size: 11px; line-height: 1.15; }
.v2h .xt-cl small { font-family: var(--font-pixel); font-size: 7px; letter-spacing: 1px; color: var(--fg-muted); }
.v2h .xs { display: grid; grid-template-columns: minmax(0, 1fr) 316px; gap: 28px; }
.v2h .xs-n { font-family: var(--font-display); font-size: 20px; line-height: 1; color: rgba(255,255,255,.4); text-align: center; }
.v2h .xs-s { display: grid; grid-template-columns: 40px minmax(0, 1fr); gap: 12px; align-items: center; min-width: 0; }
.v2h .xs-s img { width: 40px; height: 40px; }
.v2h .xs-s b { display: block; font-size: 14px; }
.v2h .xs-s small { display: block; margin-top: 3px; font-size: 11px; color: var(--fg-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.v2h .xs-ip { display: flex; align-items: center; gap: 6px; min-width: 0; }
.v2h .xs-ip code { flex: 1; min-width: 0; height: 30px; padding: 0 10px; background: #0A0909; font-family: var(--font-pixel); font-size: 9px; line-height: 30px; letter-spacing: 1px; color: var(--fg-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.v2h .xs-ip button { flex: none; height: 30px; padding: 0 10px; border: 0; background: #373432; box-shadow: 0 3px 0 #232120; font-family: var(--font-pixel); font-size: 9px; letter-spacing: 1.2px; color: #fff; cursor: pointer; transition: background 160ms ease; }
.v2h .xs-ip button:hover { background: #45413f; }
.v2h .xs-ip button[data-on="1"] { background: var(--status-online); box-shadow: 0 3px 0 #0d6b13; }
.v2h .xd { display: grid; gap: 22px; }
.v2h .xd-cats { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; }
.v2h .xd-c { position: relative; overflow: hidden; display: block; height: 172px; padding: 16px; background: var(--bg-card); border: 2px solid #000; transition: background 200ms ease; }
.v2h .xd-c:hover { background: #2A2726; }
.v2h .xd-c b { position: relative; z-index: 1; display: block; font-size: 17px; line-height: 1.15; }
.v2h .xd-c small { position: relative; z-index: 1; display: block; margin-top: 6px; max-width: 150px; font-size: 11px; line-height: 1.35; color: var(--fg-muted); }
.v2h .xd-c img { position: absolute; right: -18px; bottom: -34px; width: 124px; transition: transform 300ms cubic-bezier(.2,.7,.2,1); }
.v2h .xd-c:hover img { transform: translateY(-6px); }
.v2h .xd-row { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px 20px; min-height: 112px; align-content: start; }
.v2h .xd-m { display: grid; grid-template-columns: 40px minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 8px; transition: background 200ms ease; }
.v2h .xd-m:hover { background: #2E2C2C; }
.v2h .xd-m img { width: 40px; height: 40px; image-rendering: auto; }
.v2h .xd-m b { display: block; font-size: 14px; }
.v2h .xd-m small { display: block; margin-top: 3px; font-size: 11px; color: var(--fg-muted); }
.v2h .xa-f { position: relative; overflow: hidden; padding: 20px; background: var(--bg-card); border: 2px solid #000; }
.v2h .xa-f > .art { position: absolute; right: -22px; top: -16px; width: 96px; pointer-events: none; }
.v2h .xa-f > :not(.art) { position: relative; z-index: 1; }
.v2h .xa-f h5 { margin: 6px 0 14px; max-width: 260px; font-family: var(--font-display); font-size: 26px; line-height: 1; font-weight: 400; text-transform: uppercase; }
.v2h .xa-g { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.v2h .xa-t { position: relative; display: grid; grid-template-columns: 52px minmax(0, 1fr); gap: 14px; align-items: center; padding: 14px 16px; background: #1E1C1B; box-shadow: inset 0 0 0 1px rgba(255,255,255,.05); transition: background 200ms ease, box-shadow 200ms ease; }
.v2h .xa-t:hover { background: #2A2726; box-shadow: inset 0 0 0 1px rgba(255,255,255,.14); }
.v2h .xa-t > img { width: 52px; height: 52px; }
.v2h .xa-t > img.i { width: 40px; height: 40px; justify-self: center; }
.v2h .xa-t.soon > img { filter: grayscale(1) brightness(.75); }
.v2h .xa-t b { display: block; font-size: 15px; line-height: 1.2; }
.v2h .xa-t small { display: block; margin-top: 4px; font-size: 11px; line-height: 1.35; color: var(--fg-muted); }
.v2h .xa-st { position: absolute; top: 10px; right: 12px; display: flex; align-items: center; gap: 6px; font-family: var(--font-pixel); font-size: 8px; letter-spacing: 1.2px; text-transform: uppercase; color: var(--fg-muted); }
.v2h .xa-st .k-dot { width: 6px; height: 6px; }
.v2h .yi-t { display: grid; grid-template-columns: 32px minmax(0, 1fr) 12px; gap: 14px; align-items: center; padding: 10px 8px; border-bottom: 1px solid rgba(255,255,255,.06); transition: background 200ms ease; }
.v2h .yi-t:hover { background: #2E2C2C; }
.v2h .yi-t img { width: 32px; height: 32px; }
.v2h .yi-t b { display: block; font-family: var(--font-display); font-size: 18px; line-height: 1; font-weight: 400; text-transform: uppercase; }
.v2h .yi-t small { display: block; margin-top: 5px; font-size: 11px; color: var(--fg-muted); }
.v2h .yi-t i { font-style: normal; color: transparent; transition: color 160ms ease, transform 200ms ease; }
.v2h .yi-t:hover i { color: #fff; transform: translateX(2px); }
.v2h .yq { overflow: hidden; background: var(--bg-card); border: 2px solid #000; }
.v2h .yq-cv { position: relative; display: block; height: 96px; overflow: hidden; }
.v2h .yq-cv > img.bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; image-rendering: auto; transition: transform 500ms cubic-bezier(.2,.7,.2,1); }
.v2h .yq-cv:hover > img.bg { transform: scale(1.04); }
.v2h .yq-cv::after { content: ""; position: absolute; z-index: 1; inset: 0; background: linear-gradient(180deg, rgba(10,9,9,.15), rgba(10,9,9,.9)); }
.v2h .yq-cv .art { position: absolute; z-index: 2; right: 10px; top: 10px; width: 56px; }
.v2h .yq-ti { position: absolute; z-index: 2; left: 16px; right: 80px; bottom: 12px; display: grid; gap: 5px; }
.v2h .yq-ti b { font-family: var(--font-display); font-size: 24px; line-height: 1; font-weight: 400; text-transform: uppercase; color: #fff; }
.v2h .yq-bd { padding: 12px 16px 16px; }
.v2h .yq-q { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin: 0 0 10px; font-size: 15px; line-height: 1.3; }
.v2h .yq-q small { flex: none; font-family: var(--font-pixel); font-size: 9px; letter-spacing: 1px; color: var(--fg-muted); }
.v2h .yq-a { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.v2h .yq-res { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-top: 12px; font-size: 12px; line-height: 1.35; color: var(--fg-2); }
.v2h .yq-res a { flex: none; font-family: var(--font-pixel); font-size: 9px; letter-spacing: 1.2px; text-transform: uppercase; color: #fff; }
.v2h .ys-r { display: grid; grid-template-columns: 28px minmax(0, 1fr) 84px 128px 240px; gap: 16px; align-items: center; }
.v2h .ys-r { padding: 9px 10px; border-bottom: 1px solid rgba(255,255,255,.06); transition: background 200ms ease; }
.v2h .ys-r:hover { background: #2E2C2C; }
.v2h .ys-r[data-off="1"] { opacity: .45; }
.v2h .ys-v { font-family: var(--font-pixel); font-size: 9px; letter-spacing: 1px; color: var(--fg-3); }
.v2h .ys-on { display: flex; align-items: center; gap: 7px; white-space: nowrap; }
.v2h .ys-pg { flex: none; width: 20px; height: 16px; image-rendering: pixelated; }
.v2h .ys-on b { font-size: 15px; color: #fff; }
.v2h .ys-on small { font-size: 11px; color: var(--fg-muted); }
.v2h .ys-ft { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; padding: 12px 10px 0; font-size: 12px; color: var(--fg-muted); }
.v2h .ys-fl { display: flex; gap: 24px; }
.v2h .ya { display: grid; grid-template-columns: 420px minmax(0, 1fr); gap: 18px 32px; }
.v2h .q-out em { position: absolute; right: 4px; bottom: 1px; font-style: normal; font-size: 13px; color: #fff; text-shadow: 2px 2px 0 #3F3F3F; }
.v2h .zt { display: grid; grid-template-columns: 384px minmax(0, 1fr) 300px; gap: 32px; }
.v2h .zt .xt-p { position: relative; }
.v2h .zt .xt-p img { transition: transform 260ms cubic-bezier(.2,.8,.2,1); }
.v2h .zt .xt-p:hover img { transform: translateY(-8px); }
.v2h .zt .xt-p i { transition: background 200ms ease, color 200ms ease, box-shadow 200ms ease; }
.v2h .zt .xt-p:hover i { background: #2E2C2C; color: #fff; box-shadow: inset 0 3px 0 rgba(255,255,255,.12); }
.v2h .zt .xt-p.p1:hover i { background: var(--mctr-red); color: #fff; }
.v2h .zt .xt-p em { position: absolute; z-index: 2; left: 50%; top: -24px; padding: 3px 7px; background: #0A0909; font-style: normal; font-family: var(--font-pixel); font-size: 8px; letter-spacing: 1px; text-transform: uppercase; color: #fff; white-space: nowrap; opacity: 0; transform: translate(-50%, 4px); transition: opacity 160ms ease, transform 200ms ease; pointer-events: none; }
.v2h .zt .xt-p:hover em { opacity: 1; transform: translate(-50%, 0); }
.v2h .zt .xt-p::after { content: ""; position: absolute; z-index: 2; left: 50%; top: 2px; width: 70px; height: 40px; margin-left: -35px; background: url("../images/mc/particle/glitter_3.png") 4px 6px / 12px 12px no-repeat, url("../images/mc/particle/glitter_1.png") 54px 16px / 10px 10px no-repeat, url("../images/mc/particle/glitter_5.png") 30px 0 / 8px 8px no-repeat; image-rendering: pixelated; opacity: 0; pointer-events: none; }
@media (prefers-reduced-motion: no-preference) {
  .v2h .zt .xt-p:hover::after { animation: ptSpark 900ms steps(6) infinite; }
  @keyframes ptSpark { 0% { opacity: 0; transform: translateY(6px); } 40% { opacity: 1; } 100% { opacity: 0; transform: translateY(-8px); } }
}
.v2h .zi { display: grid; grid-template-columns: 270px minmax(0, 1fr) 340px; gap: 32px; }
.v2h .zi-r { display: grid; grid-template-columns: 92px minmax(0, 1fr); gap: 14px; align-items: center; padding: 8px; border-bottom: 1px solid rgba(255,255,255,.06); transition: background 200ms ease; }
.v2h .zi-r:hover { background: #2E2C2C; }
.v2h .zi-th { position: relative; display: grid; place-items: center; width: 92px; height: 60px; overflow: hidden; background: #141312; }
.v2h .zi-th img.bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; image-rendering: auto; transition: transform 400ms ease; }
.v2h .zi-r:hover .zi-th img.bg { transform: scale(1.06); }
.v2h .zi-th img.ren { width: 46px; height: 46px; }
.v2h .zi-r .x-ey { display: block; color: var(--fg-muted); }
.v2h .zi-r b { display: block; margin-top: 4px; font-size: 14px; line-height: 1.25; }
.v2h .zi-r small { display: block; margin-top: 4px; font-size: 11px; color: var(--fg-muted); }
.v2h .zq-b { display: grid; grid-template-columns: 22px minmax(0, 1fr) 24px; grid-template-rows: auto 1fr; gap: 8px; min-height: 76px; padding: 10px; border: 0; background: #2E2C2C; box-shadow: 0 3px 0 #141312; color: var(--fg-2); font-family: var(--font-body); font-size: 12px; line-height: 1.3; text-align: left; cursor: pointer; transition: background 160ms ease, color 160ms ease, opacity 200ms ease; }
.v2h .zq-l { grid-column: 1; grid-row: 1; display: grid; place-items: center; width: 22px; height: 22px; background: #141312; font-family: var(--font-pixel); font-size: 9px; color: #fff; }
.v2h .zq-b img { grid-column: 3; grid-row: 1; width: 24px; height: 24px; }
.v2h .zq-b > span:last-child { grid-column: 1 / -1; grid-row: 2; align-self: end; }
.v2h .zq-b { transition: background .12s, transform .12s, box-shadow .12s; }
.v2h .zq-b:hover { background: #4A4542; color: #fff; transform: translateY(-2px); box-shadow: 0 5px 0 #000, inset 0 0 0 2px rgba(255,255,255,.18); }
.v2h .zq-b:hover .zq-l { background: var(--mctr-red); }
.v2h .zq-b:active { transform: translateY(1px); box-shadow: 0 1px 0 #000; }
.v2h .zq-b[data-on="1"] { background: var(--mctr-red); box-shadow: 0 3px 0 var(--mctr-red-dark); color: #fff; }
.v2h .zq-b[data-ok="1"] { background: var(--status-online); box-shadow: 0 3px 0 #0d6b13; color: #fff; }
.v2h .zq-b[data-on="1"] .zq-l, .v2h .zq-b[data-ok="1"] .zq-l { background: rgba(0,0,0,.28); }
.v2h .zq-b[data-off="1"] { opacity: .4; }
.v2h .za-col { display: flex; flex-direction: column; }
.v2h .xd-m img.px { image-rendering: pixelated; }
.v2h .zn { display: grid; grid-template-columns: 44px minmax(0, 1fr) auto; gap: 14px; align-items: center; margin-top: 10px; padding: 14px 10px; background: #1E1C1B; }
.v2h .zn > img { width: 20px; height: 20px; justify-self: center; }
.v2h .zn b { display: block; font-size: 14px; line-height: 1.2; }
.v2h .zn small { display: block; margin-top: 4px; font-size: 11px; line-height: 1.35; color: var(--fg-muted); }
.v2h .zn .k-btn { min-height: 32px; padding: 0 14px; font-size: 10px; }
.v2h .zn[data-on="1"] .k-btn { background: #373432; box-shadow: 0 4px 0 #232120; }
.v2h .zc-r { display: flex; flex-direction: column; }
.v2h .tl9 { flex: 1; display: flex; flex-direction: column; }
.v2h .zr { display: grid; grid-template-columns: minmax(0, 1fr); gap: 18px; }
.v2h .zr-in { grid-column: 1 / -1; display: flex; align-items: center; gap: 14px; height: 60px; padding: 0 16px 0 18px; background: #0A0909; box-shadow: inset 0 0 0 2px rgba(255,255,255,.18); transition: box-shadow 160ms ease; }
.v2h .zr-in:focus-within { box-shadow: inset 0 0 0 2px #fff; }
.v2h .zr-in > img { width: 20px; height: 20px; }
.v2h .zr-in input { flex: 1; min-width: 0; height: 100%; padding: 0; border: 0; outline: 0; background: transparent; color: #fff; font-family: var(--font-body); font-size: 22px; }
.v2h .zr-in input:focus-visible { outline: 0; }
.v2h .zr-in input::placeholder { color: var(--fg-faint); }
.v2h .zr-clr { padding: 0; border: 0; background: transparent; font-family: var(--font-pixel); font-size: 9px; letter-spacing: 1.2px; text-transform: uppercase; color: var(--fg-muted); cursor: pointer; }
.v2h .zr-clr:hover { color: #fff; }
.v2h .zr-in kbd { padding: 4px 7px; box-shadow: inset 0 0 0 1px rgba(255,255,255,.3); font-family: var(--font-pixel); font-size: 8px; letter-spacing: 1px; color: rgba(255,255,255,.7); }
.v2h .zr-res { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px 28px; align-content: start; min-height: 200px; margin-top: 14px; }
.v2h .zr-g[data-wide="1"] { grid-column: 1 / -1; }
.v2h .zr-g[data-wide="1"] .zr-rows { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 28px; }
.v2h .zr-bt { display: grid; grid-template-columns: 1fr 1fr; gap: 36px; padding-top: 16px; border-top: 1px solid rgba(255,255,255,.08); }
.v2h .zr-bt .nm-hd { margin: 0 0 8px; }
.v2h .zr-pw { display: flex; flex-wrap: wrap; gap: 4px 24px; }
.v2h .zr-pl, .v2h .zr-k2 { display: inline-flex; align-items: center; gap: 8px; height: 28px; padding: 0; border: 0; background: transparent; color: var(--fg-2); font-family: var(--font-body); font-size: 14px; cursor: pointer; transition: color 160ms ease; }
.v2h .zr-pl img { width: 12px; height: 12px; opacity: .55; transition: opacity 160ms ease; }
.v2h .zr-k2 img { width: 20px; height: 20px; }
.v2h .zr-pl:hover, .v2h .zr-k2:hover { color: #fff; }
.v2h .zr-pl:hover img { opacity: 1; }
.v2h .zr-more { padding: 0; border: 0; background: transparent; font-family: var(--font-pixel); font-size: 9px; letter-spacing: 1.4px; text-transform: uppercase; color: rgba(255,255,255,.62); cursor: pointer; }
.v2h .zr-more:hover { color: #fff; }
.v2h .zr-r { display: grid; grid-template-columns: 32px minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 8px 10px; transition: background 200ms ease; }
.v2h .zr-r:hover { background: #2E2C2C; }
.v2h .zr-r > img { width: 32px; height: 32px; }
.v2h .zr-r b { display: block; font-size: 14px; line-height: 1.25; color: var(--fg-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.v2h .zr-r b .hl, .v2h .zr-r small .hl { color: #fff; background: rgba(237,44,41,.42); }
.v2h .zr-r small { display: block; margin-top: 3px; font-size: 11px; color: var(--fg-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.v2h .zr-r em { font-style: normal; font-family: var(--font-pixel); font-size: 8px; letter-spacing: 1px; text-transform: uppercase; color: var(--fg-muted); white-space: nowrap; }
.v2h .xa-f:has(.zw) { display: flex; flex-direction: column; }
.v2h .zw { flex: 1; grid-template-columns: auto 40px auto; align-content: center; gap: 18px; padding: 18px; }
.v2h .zw .q-cg { grid-template-columns: repeat(3, 60px); }
.v2h .zw .q-sl { width: 60px; height: 60px; }
.v2h .zw .q-sl img { width: 48px; height: 48px; }
.v2h .zw .q-out { width: 84px; height: 84px; }
.v2h .zw .q-out img { width: 48px; height: 48px; }
.v2h .zw .q-out img.ren { width: 66px; height: 66px; }
.v2h .zw .q-out em { right: 6px; bottom: 3px; font-size: 16px; }
.v2h .xa-f:has(.zw) > .art { width: 128px; right: -24px; top: -26px; }
.v2h .xa-f:has(.zw) > h5 { margin-bottom: 52px; }
.v2h .nm-r { font-family: var(--font-pixel); font-size: 9px; letter-spacing: 1.4px; text-transform: uppercase; color: rgba(255,255,255,.62); white-space: nowrap; }
.v2h .col8 { display: flex; flex-direction: column; }
.v2h .col8 > :last-child { flex: 1; }
.v2h .nm-hd { align-items: center; min-height: 20px; margin-bottom: 14px; }
.v2h .zt, .v2h .zi, .v2h .xs, .v2h .ya { column-gap: 32px; }
.v2h .yi-t { padding: 13px 8px; }
.v2h .yq-cv { height: 84px; }
.v2h .zq-b { min-height: 64px; }
.v2h .xd { gap: 0; }
.v2h .xd-cats { margin-bottom: 24px; }
.v2h .zr-res { margin-top: 0; }
.v2h .xa-f:has(.zw) > .art { width: 112px; right: -22px; top: -24px; }
.v2h .xa-f:has(.zw) > h5 { margin: 0 0 58px; }
.v2h .sg9 { display: flex; flex-wrap: wrap; gap: 4px; min-width: 0; }
.v2h .sgt { display: inline-flex; align-items: center; gap: 8px; height: 32px; padding: 0 12px; border: 0; background: transparent; font-family: var(--font-pixel); font-size: 10px; letter-spacing: 1.4px; text-transform: uppercase; color: var(--fg-muted); box-shadow: inset 0 0 0 1px rgba(255,255,255,.16); white-space: nowrap; cursor: pointer; transition: color 240ms cubic-bezier(.22,.61,.36,1), box-shadow 240ms cubic-bezier(.22,.61,.36,1), background 240ms ease; }
.v2h .sgt:hover { color: #fff; box-shadow: inset 0 0 0 1px rgba(255,255,255,.4); }
.v2h .sgt[data-on="1"] { background: #fff; color: #111; box-shadow: none; }
.v2h .sgt small { font-family: var(--font-body); font-size: 12px; letter-spacing: 0; text-transform: none; opacity: .7; }
.v2h .sgt[data-zero="1"]:not([data-on="1"]) { opacity: .4; }
.v2h .nm-hd { min-height: 32px; align-items: center; margin-bottom: 13px; }
.v2h .xt-r, .v2h .zi-r, .v2h .yi-t, .v2h .zr-r { padding-left: 0; padding-right: 0; border-bottom: 0; border-top: 1px solid rgba(255,255,255,.08); }
.v2h .xd-m { padding: 14px 0; border-top: 1px solid rgba(255,255,255,.08); }
.v2h .xd-row { gap: 0 48px; border-bottom: 1px solid rgba(255,255,255,.08); }
.v2h .xt-r:hover, .v2h .zi-r:hover, .v2h .yi-t:hover, .v2h .zr-r:hover, .v2h .xd-m:hover, .v2h .ys-r:hover { background: transparent; }
.v2h .xt-r b, .v2h .zi-r b, .v2h .yi-t b, .v2h .zr-r b, .v2h .xd-m b, .v2h .xa-t b { transition: color 240ms ease; }
.v2h .xt-r:hover b, .v2h .zi-r:hover b, .v2h .yi-t:hover b, .v2h .zr-r:hover b, .v2h .xd-m:hover b, .v2h .xa-t:hover b { color: var(--mctr-red-soft); }
.v2h .yq { box-shadow: inset -4px 4px 0 rgba(255,255,255,.08), inset 5px 0 0 rgba(0,0,0,.3), inset 0 -6px 0 rgba(0,0,0,.3); }
.v2h .zt { grid-template-columns: 260px minmax(0, 1fr) 300px; }
.v2h .fs9 { position: relative; overflow: hidden; min-height: 240px; }
.v2h .col8 > .fs9 { flex: 1 1 auto; }
.v2h .col8 > .fs9-cta { flex: none; }
.v2h .fs9-cta { display: flex; align-items: center; justify-content: flex-start; gap: 12px; min-height: 48px; margin: 12px 0 4px; padding: 0 20px; background: #2E2B2A; box-shadow: inset 0 0 0 1px rgba(255,255,255,.12), 0 4px 0 #0A0909; color: #fff; font-family: var(--font-pixel); font-size: 12px; letter-spacing: 1.8px; text-transform: uppercase; white-space: nowrap; transition: background 160ms cubic-bezier(.22,.61,.36,1), transform 160ms cubic-bezier(.22,.61,.36,1), box-shadow 160ms cubic-bezier(.22,.61,.36,1); }
.v2h .fs9-cta:hover { background: #3A3635; color: #fff; transform: translateY(-2px); box-shadow: inset 0 0 0 1px rgba(255,255,255,.2), 0 6px 0 #0A0909; }
.v2h .fs9-cta:active { transform: translateY(2px); box-shadow: inset 0 0 0 1px rgba(255,255,255,.2), 0 2px 0 #0A0909; }
.v2h .fs9-cta b { display: flex; }
.v2h .fs9-cta b img { width: 18px; height: 18px; image-rendering: pixelated; }
.v2h .fs9-cta span { font: inherit; letter-spacing: inherit; }
.v2h .fs9-cta i { display: none; }
.v2h .fs9-cta img { width: 18px; height: 18px; image-rendering: pixelated; transition: transform 200ms ease; }
.v2h .fs9-cta:hover img { transform: rotate(-10deg); }
.v2h .fs9-tr { display: flex; height: 100%; transition: transform 420ms cubic-bezier(.2,.8,.2,1); }
.v2h .fs9-c { position: relative; overflow: hidden; flex: 0 0 100%; box-sizing: border-box; display: grid; align-content: start; gap: 10px; height: 100%; padding: 20px 20px 0; background: #1E1C1B; border: 2px solid #000; transition: background-color 260ms cubic-bezier(.2,.8,.2,1); }
.v2h .fs9-c::after { content: ""; position: absolute; inset: 0; z-index: 3; pointer-events: none; box-shadow: inset -4px 4px 0 rgba(255,255,255,.09), inset 5px 0 0 rgba(0,0,0,.36), inset 0 -6px 0 rgba(0,0,0,.36); }
.v2h .fs9-c:hover { background: #252321; }
.v2h .fs9-c h3 { position: relative; z-index: 2; margin: 0; font-family: var(--font-body); font-size: 20px; line-height: 1.1; font-weight: 400; color: #fff; }
.v2h .fs9-c span { position: relative; z-index: 2; font-family: var(--font-pixel); font-size: 9px; letter-spacing: 1.4px; text-transform: uppercase; color: rgba(255,255,255,.64); text-shadow: 1px 1px 0 rgba(0,0,0,.6); }
.v2h .fs9-c span b { font-weight: 400; color: #fff; }
.v2h .fs9-c p { position: relative; z-index: 2; max-width: 300px; margin: 0; font-size: 12px; line-height: 1.45; color: rgba(255,255,255,.55); text-wrap: pretty; }
.v2h .fs9-c img { position: absolute; z-index: 1; left: 50%; top: 136px; bottom: auto; width: 104%; transform: translateX(-50%); transition: transform 420ms cubic-bezier(.2,.8,.2,1); }
.v2h .fs9-c:hover img { transform: translate(-50%, -6px); }
.v2h .xa-g { gap: 0 32px; }
.v2h .xa-t { padding: 16px 0; background: transparent; box-shadow: none; border-top: 1px solid rgba(255,255,255,.08); }
.v2h .xa-t:hover { background: transparent; box-shadow: none; }
.v2h .xa-st { top: 16px; right: 0; }
.v2h .zn { margin-top: 16px; padding: 16px 20px; background: #1E1C1B; box-shadow: inset 0 0 0 1px rgba(255,255,255,.1), 0 4px 0 rgba(0,0,0,.35); }
.v2h .tq9 { display: flex; align-items: center; gap: 10px; }
.v2h .tq9 > button { display: grid; place-items: center; width: 20px; height: 20px; padding: 0; border: 0; background: transparent; color: rgba(255,255,255,.62); font-family: var(--font-body); font-size: 16px; line-height: 1; cursor: pointer; transition: color 160ms ease; }
.v2h .tq9 > button:hover { color: #fff; }
.v2h .tq9-d { display: flex; align-items: center; gap: 6px; }
.v2h .tq9-d button { width: 8px; height: 8px; padding: 0; border: 0; background: rgba(255,255,255,.22); cursor: pointer; transition: background 160ms ease, transform 160ms ease; }
.v2h .tq9-d button:hover { background: rgba(255,255,255,.55); }
.v2h .tq9-d button[data-on="1"] { background: #fff; transform: scale(1.25); }
.v2h .yi-t b { font-size: 20px; line-height: 1.15; letter-spacing: .5px; }
.v2h .yi-t:hover b { color: #fff; }
.v2h .yi-t i { color: transparent; }
.v2h .yi-t:hover i { color: var(--mctr-red-soft); }
.v2h .ys-r { grid-template-columns: 28px minmax(0, 1fr) 110px 120px 230px; }
.v2h .sk9g { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.v2h .sk9c { position: relative; overflow: hidden; display: grid; align-content: start; gap: 6px; height: 104px; padding: 12px 14px; background: #1E1C1B; border: 2px solid #000; transition: background-color 260ms cubic-bezier(.2,.8,.2,1); }
.v2h .sk9c::after { content: ""; position: absolute; inset: 0; z-index: 3; pointer-events: none; box-shadow: inset -4px 4px 0 rgba(255,255,255,.09), inset 5px 0 0 rgba(0,0,0,.36), inset 0 -6px 0 rgba(0,0,0,.36); }
.v2h .sk9c:hover { background: #252321; }
.v2h .sk9c b { position: relative; z-index: 2; font-size: 16px; line-height: 1.1; font-weight: 400; color: #fff; }
.v2h .sk9c small { position: relative; z-index: 2; font-family: var(--font-pixel); font-size: 8px; letter-spacing: 1.2px; text-transform: uppercase; color: rgba(255,255,255,.64); text-shadow: 1px 1px 0 rgba(0,0,0,.6); }
.v2h .sk9c img { position: absolute; z-index: 1; right: -16px; bottom: -26px; width: 92px; transition: transform 420ms cubic-bezier(.2,.8,.2,1); }
.v2h .sk9c:hover img { transform: translateY(-6px); }
.v2h .sk9c img.px { right: -4px; bottom: -8px; width: 68px; image-rendering: pixelated; transform: rotate(-12deg); }
.v2h .sk9c:hover img.px { transform: rotate(-12deg) translateY(-6px); }
.v2h .xa-f:has(.zw) > h5 { margin: 0 0 14px; }
.v2h .xa-f:has(.zw) > .art { z-index: 0; width: 150px; right: -30px; top: -30px; opacity: .85; }
.v2h .xt-r { grid-template-columns: 36px minmax(0, 1fr) 44px; }
.v2h .xt-n { width: 44px; height: 44px; padding: 0; align-content: center; box-sizing: border-box; }
.v2h .xs .nm-hd .sg9 { flex-wrap: nowrap; }
.v2h .xs .nm-hd .sgt { padding: 0 10px; }
.v2h .fs9-cta i::before { content: ""; display: block; width: 10px; height: 10px; background: currentColor; clip-path: polygon(4px 0, 6px 0, 6px 2px, 8px 2px, 8px 4px, 10px 4px, 10px 6px, 8px 6px, 8px 8px, 6px 8px, 6px 10px, 4px 10px, 4px 6px, 0 6px, 0 4px, 4px 4px); }
.v2h .tw9 { display: grid; grid-template-columns: minmax(0, 1fr) 340px; column-gap: 32px; }
.v2h .tw9-m { display: flex; flex-direction: column; gap: 22px; min-width: 0; }
.v2h .ie9 { min-width: 0; }
.v2h .ie9 .zi-r { grid-template-columns: 128px minmax(0, 1fr); gap: 16px; align-items: start; padding: 12px 0; }
.v2h .ie9 .zi-th { width: 128px; height: 80px; }
.v2h .ie9-t { display: flex; flex-direction: column; align-items: flex-start; gap: 7px; min-width: 0; }
.v2h .ie9-c { display: inline-flex; align-items: center; height: 20px; padding: 0 7px; background: rgba(255,255,255,.1); font-family: var(--font-pixel); font-size: 9px; letter-spacing: 1.2px; text-transform: uppercase; color: #fff; }
.v2h .ie9-c[data-k="h"] { background: rgba(237,44,41,.18); color: #FF8D86; }
.v2h .ie9-c[data-k="r"] { background: oklch(0.72 0.15 150 / .18); color: oklch(0.82 0.14 150); }
.v2h .ie9-c[data-k="g"] { background: oklch(0.72 0.12 240 / .2); color: oklch(0.82 0.1 240); }
.v2h .ie9 .zi-r b { margin: 0; font-size: 18px; line-height: 1.25; font-weight: 400; color: #fff; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; text-wrap: pretty; }
.v2h .ie9-a { display: flex; align-items: center; gap: 6px; font-size: 12px; line-height: 1; color: var(--fg-muted); white-space: nowrap; }
.v2h .ie9-a img { width: 18px; height: 18px; image-rendering: pixelated; }
.v2h .ie9-a i { font-style: normal; }
.v2h .xt-cl img { padding: 0; object-fit: cover; }
.v2h .zr-r em.zr-pn { display: inline-flex; align-items: center; gap: 6px; font-family: var(--font-body); font-size: 13px; letter-spacing: 0; text-transform: none; color: #fff; font-variant-numeric: tabular-nums; }
.v2h .zr-pn img { width: 16px; height: 16px; image-rendering: pixelated; }
.v2h .zr .zr-res { align-items: start; min-height: 0; }
.v2h .zr .zr-r > .xt-n { width: 44px; height: 44px; padding: 0; align-content: center; box-sizing: border-box; }
.v2h .zr .zr-r > .xt-n b { font-size: 15px; line-height: 1; color: #fff; }
.v2h .zr .zr-r > .xt-n small { font-size: 7px; line-height: 1.4; }
.v2h .zr .zr-g > .nm-hd { margin-bottom: 0; }
.v2h .zr .zr-g .zr-r:first-child { padding-top: 4px; border-top: 0; }
.v2h .tv9-r { display: grid; grid-template-columns: 28px minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 10px 0; border-top: 1px solid rgba(255,255,255,.08); }
.v2h .tv9-r > img { width: 28px; height: 28px; image-rendering: pixelated; opacity: .85; }
.v2h .tv9-r:hover > img { opacity: 1; }
.v2h .tv9-r > a:first-of-type { min-width: 0; }
.v2h .tv9-r > a:first-of-type b { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; font-size: 14px; line-height: 1.25; font-weight: 400; color: var(--fg-2); overflow: hidden; text-wrap: pretty; transition: color 160ms ease; }
.v2h .tv9-r > a:first-of-type:hover b { color: #fff; }
.v2h .tv9-r small { display: block; margin-top: 3px; font-size: 11px; color: var(--fg-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.v2h .tv9-r small em { font-style: normal; color: #fff; }
.v2h .tv9 { display: inline-flex; align-items: center; height: 24px; padding: 0 8px; font-family: var(--font-pixel); font-size: 8px; letter-spacing: 1px; text-transform: uppercase; color: #fff; white-space: nowrap; box-shadow: inset 0 0 0 1px rgba(255,255,255,.24); transition: background 200ms cubic-bezier(.2,0,0,1), color 200ms cubic-bezier(.2,0,0,1); }
.v2h .tv9:hover { background: rgba(255,255,255,.06); box-shadow: inset 0 0 0 1px rgba(255,255,255,.5); }
.v2h .tw9-g { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1px; background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.1); }
.v2h .tw9-c { position: relative; display: grid; grid-template-columns: 40px minmax(0, 1fr); gap: 14px; align-items: center; min-height: 72px; padding: 14px 16px; background: #262423; transition: background 200ms cubic-bezier(.2,0,0,1); }
.v2h .tw9-c:hover { background: #2F2C2B; }
.v2h .tw9-c::after { content: ""; position: absolute; right: 16px; top: 50%; margin-top: -4px; width: 7px; height: 7px; border: solid #fff; border-width: 2px 2px 0 0; opacity: 0; transform: translateX(-8px) rotate(45deg); transition: opacity 200ms cubic-bezier(.2,0,0,1), transform 260ms cubic-bezier(.2,0,0,1); }
.v2h .tw9-c:hover::after { opacity: 1; transform: translateX(-2px) rotate(45deg); }
.v2h .tw9-c > img { transition: opacity 200ms cubic-bezier(.2,0,0,1), transform 260ms cubic-bezier(.2,0,0,1); }
.v2h .tw9-c:hover > img { transform: translateY(-2px); }
.v2h .tw9-c > img { width: 40px; height: 40px; image-rendering: pixelated; opacity: .85; transition: opacity 200ms cubic-bezier(.2,0,0,1); }
.v2h .tw9-c:hover > img { opacity: 1; }
.v2h .tw9-c > span { min-width: 0; }
.v2h .tw9-c b { display: block; font-size: 16px; line-height: 1.2; font-weight: 400; color: #fff; }
.v2h .tw9-c small { display: block; margin-top: 4px; font-size: 12px; line-height: 1.35; color: var(--fg-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.v2h .yq-cv > img.bg, .v2h .yq-ti b { animation: tqFade 420ms ease both; }
@keyframes tqFade { from { opacity: .35; } }
.v2h .zt-r { display: flex; flex-direction: column; }
.v2h .zt-r > .fs9-cta { margin-top: auto; }
.v2h .zt-r > .xt-clw { margin-bottom: 16px; }
.v2h .zt-m { display: flex; flex-direction: column; }
.v2h .zt-m > .nm-hd > .sg9 { flex: 1; }
.v2h .zt-m .sg9 > .sgt { flex: 1 1 auto; justify-content: center; }
.v2h .zt-m > .xt-r { flex: 1 1 0; padding-top: 6px; padding-bottom: 6px; }
.v2h .zt-m > .xt-r:last-child { border-bottom: 1px solid rgba(255,255,255,.08); }
.v2h .tq9 > button { font-size: 0; display: flex; align-items: center; justify-content: center; }
.v2h .tq9 > button::before { content: ""; width: 6px; height: 6px; border: solid currentColor; border-width: 2px 2px 0 0; }
.v2h .tq9 > button:first-child::before { transform: rotate(-135deg); margin-left: 3px; }
.v2h .tq9 > button:last-child::before { transform: rotate(45deg); margin-right: 3px; }
.v2h .sk9c img.sw1 { right: 2px; bottom: -6px; width: 64px; transform: none; }
.v2h .sk9c img.sw2 { right: 2px; bottom: -6px; width: 64px; transform: scaleX(-1); }
.v2h .sk9c:hover img.sw1 { transform: translate(4px, -6px) rotate(6deg); }
.v2h .sk9c:hover img.sw2 { transform: scaleX(-1) translate(4px, -6px) rotate(6deg); }
.v2h .xd-m { grid-template-columns: 26px 40px minmax(0, 1fr) auto; }
.v2h .xd-row { grid-template-rows: repeat(3, auto); grid-auto-flow: column; }
.v2h .xd-rk { font-family: var(--font-display); font-size: 22px; line-height: 1; color: rgba(255,255,255,.35); text-align: center; }
.v2h .xd-rk[data-top="1"] { color: #fff; }
.v2h .yi-t { grid-template-columns: 32px minmax(0, 1fr) 12px; gap: 14px; padding: 10px 10px; transition: background 200ms ease; }
.v2h .yi-t b { font-size: 18px; }
.v2h .zi-r { grid-template-columns: 76px minmax(0, 1fr); gap: 12px; padding: 9px 0; }
.v2h .zi-th { width: 76px; height: 48px; }
.v2h .zi-r b { margin-top: 3px; font-size: 13px; }
.v2h .zi-r small { margin-top: 3px; }
.v2h .yi-t img { width: 32px; height: 32px; transition: transform 240ms cubic-bezier(.22,.61,.36,1); }
.v2h .yi-t:hover { background: rgba(255,255,255,.04); }
.v2h .yi-t:hover img { transform: translateY(-3px) rotate(-8deg); }
.v2h .yi-t:hover b { color: #fff; }
.v2h .yi-t i { color: transparent; }
.v2h .yi-t:hover i { color: #fff; transform: translateX(2px); }


.v2h .yq9 { display: flex; flex-direction: column; }
.v2h .yq9 > .yq-bd { flex: 1; display: flex; flex-direction: column; }
.v2h .yq9 .yq-res { margin-top: auto; padding-top: 12px; }
.v2h .yq9 > .yq-bd { padding-top: 16px; }
.v2h .yq9 .yq-ti { right: 16px; }
.v2h .yq9 .yq-q { margin-bottom: 14px; font-size: 20px; line-height: 1.25; color: #fff; text-wrap: pretty; }
.v2h .yq9 .yq-a { grid-template-columns: minmax(0, 1fr); gap: 6px; }
.v2h .yq9 .zq-b { grid-template-columns: 22px minmax(0, 1fr) 24px; grid-template-rows: auto; align-items: center; min-height: 48px; padding: 10px 12px; text-align: left; }
.v2h .yq9 .zq-b > span:last-child { grid-column: 2; grid-row: 1; align-self: center; }
.v2h .tq9 { align-self: center; }
.v2h .tq9 > button::before { margin: 0 !important; }
.v2h .tq9-d button { width: 6px; height: 6px; }
.v2h .tq9-d button[data-on="1"] { transform: none; background: #fff; }
.v2h .xd-c { height: 196px; }
.v2h .zn > img { transform-origin: 50% 10%; }
.v2h .zn:hover > img { animation: bellRing 900ms ease-in-out infinite; }
@keyframes bellRing { 0%, 100% { transform: rotate(0); } 15% { transform: rotate(16deg); } 30% { transform: rotate(-14deg); } 45% { transform: rotate(10deg); } 60% { transform: rotate(-6deg); } 75% { transform: rotate(2deg); } }
@media (prefers-reduced-motion: reduce) {
  .v2h .zn:hover > img { animation: none; }
}
.v2h .xd-c small { max-width: 170px; font-size: 12px; line-height: 1.45; }
.v2h .xd-c img { right: -62px; bottom: -70px; width: 172px; transition: transform 360ms cubic-bezier(.2,.8,.2,1); }
.v2h .xd-c:hover img { transform: translate(-6px, -8px); }
.v2h .ys-r { grid-template-columns: 28px minmax(0, 1fr) 96px 104px 272px; }
.v2h .xs-ip button { position: relative; width: 30px; padding: 0; font-size: 0; }
.v2h .xs-ip button::before, .v2h .xs-ip button::after { content: ""; position: absolute; width: 8px; height: 8px; border: 2px solid #fff; }
.v2h .xs-ip button::before { left: 8px; top: 8px; }
.v2h .xs-ip button::after { left: 12px; top: 12px; background: #373432; }
.v2h .xs-ip button:hover::after { background: #45413f; }
.v2h .xs-ip button[data-on="1"]::before { left: 10px; top: 7px; width: 6px; height: 11px; border-width: 0 2px 2px 0; transform: rotate(45deg); }
.v2h .xs-ip button[data-on="1"]::after { display: none; }
.v2h .q7 { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr) 320px; gap: 32px; }
.v2h .q7 > div { display: flex; flex-direction: column; min-width: 0; }
.v2h .q7-v { flex: 1; display: grid; grid-template-rows: repeat(3, minmax(0, 1fr)); gap: 12px; }
.v2h .q7-vi { display: grid; grid-template-columns: 170px minmax(0, 1fr); gap: 14px; align-items: center; min-height: 0; }
.v2h .q7-th { position: relative; display: block; height: 100%; min-height: 84px; overflow: hidden; background: #0A0909; box-shadow: inset 0 0 0 1px rgba(255,255,255,.06); }
.v2h .q7-th img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; image-rendering: auto; transition: transform 500ms cubic-bezier(.2,.8,.2,1); }
.v2h .q7-vi:hover .q7-th img { transform: scale(1.05); }
.v2h .q7-th em { position: absolute; right: 6px; bottom: 6px; display: flex; align-items: center; height: 18px; padding: 0 5px; background: rgba(10,9,9,.86); font-style: normal; font-family: var(--font-pixel); font-size: 8px; letter-spacing: 1px; color: #fff; }
.v2h .q7-th i { position: absolute; left: 50%; top: 50%; display: grid; place-items: center; width: 34px; height: 34px; margin: -17px 0 0 -17px; background: var(--mctr-red); box-shadow: 0 3px 0 var(--mctr-red-dark); opacity: 0; transition: opacity 200ms ease; }
.v2h .q7-vi:hover .q7-th i { opacity: 1; }
.v2h .q7-th i::after { content: ""; margin-left: 3px; border-left: 10px solid #fff; border-top: 6px solid transparent; border-bottom: 6px solid transparent; }
.v2h .q7-vi b { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-size: 15px; line-height: 1.3; font-weight: 400; color: #fff; transition: color 240ms ease; }
.v2h .q7-vi:hover b { color: var(--mctr-red-soft); }
.v2h .q7-vi small { display: flex; align-items: center; gap: 8px; margin-top: 8px; font-size: 12px; color: var(--fg-muted); }
.v2h .q7-vi small img { width: 18px; height: 18px; }
.v2h .q7-r > .fs9-cta { margin: 0; }
.v2h .q7-ls { flex: 1; margin-bottom: 12px; border-bottom: 1px solid rgba(255,255,255,.08); }
.v2h .q7-p { display: block; padding: 11px 0; border-top: 1px solid rgba(255,255,255,.08); }
.v2h .q7-h { display: flex; align-items: center; gap: 8px; min-width: 0; font-size: 12px; color: var(--fg-muted); }
.v2h .q7-h img { width: 20px; height: 20px; flex: none; }
.v2h .q7-h b { font-weight: 400; color: #fff; white-space: nowrap; }
.v2h .q7-h b.to { color: var(--mctr-red-soft); }
.v2h .q7-h i { font-style: normal; font-size: 14px; color: var(--fg-faint); }
.v2h .q7-h em { margin-left: auto; font-style: normal; font-size: 11px; white-space: nowrap; color: var(--fg-muted); }
.v2h .q7-x { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; margin-top: 8px; font-size: 14px; line-height: 1.3; color: #fff; transition: color 240ms ease; }
.v2h .q7-p:hover .q7-x { color: var(--mctr-red-soft); }
.v2h .q7-a { flex: 1; min-height: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.v2h .q7-col { display: flex; flex-direction: column; gap: 10px; min-height: 0; }
.v2h .q7-mo { position: relative; display: block; flex: 1 1 0; min-height: 0; overflow: hidden; background: #0A0909; box-shadow: inset 0 0 0 1px rgba(255,255,255,.06); }
.v2h .q7-mo > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; image-rendering: auto; transition: transform 500ms cubic-bezier(.2,.8,.2,1); }
.v2h .q7-mo:hover > img { transform: scale(1.04); }
.v2h .q7-mb { position: absolute; z-index: 2; left: 6px; right: 6px; bottom: 6px; display: flex; align-items: center; gap: 6px; height: 24px; padding: 0 8px 0 4px; background: rgba(10,9,9,.86); font-size: 11px; color: #fff; opacity: 0; transform: translateY(4px); transition: opacity 200ms ease, transform 200ms ease; }
.v2h .q7-mb img { width: 16px; height: 16px; }
.v2h .q7-mb em { display: inline-flex; align-items: center; gap: 4px; margin-left: auto; font-style: normal; }
.v2h .q7-mb em img { width: 11px; height: 11px; }
.v2h .q7-mo:hover .q7-mb { opacity: 1; transform: none; }
.v2h .h-r a .h-i16 { transition: transform 320ms var(--e9); }
.v2h :is(.xt-r, .zi-r, .yi-t, .zr-r, .xd-m, .xa-t, .tv9-r, .q7-vi) > :not(.xt-n) > b, .v2h .xs-s b, .v2h .q7-x { transition: color 240ms ease, translate 360ms var(--e9); }
.v2h :is(.xt-r, .zi-r, .yi-t, .zr-r, .xd-m, .xa-t, .tv9-r, .q7-vi):hover > :not(.xt-n) > b, .v2h .ys-r:hover .xs-s b, .v2h .q7-p:hover .q7-x { translate: 4px 0; }
.v2h .ys-r:hover .xs-s b { color: var(--mctr-red-soft); }
.v2h :is(.xd-m, .xa-t, .tv9-r, .zr-r, .tw9-c, .zr-k2) > img, .v2h .yi-t img { transition: transform 320ms var(--e9), opacity 200ms ease, filter 200ms ease; }
.v2h :is(.xd-m, .xa-t, .tv9-r, .zr-r, .tw9-c, .zr-k2):hover > img { transform: translateY(-3px); }
.v2h .xt-r > img, .v2h .q7-h img, .v2h .ie9-a img, .v2h .q7-vi small img, .v2h .xs-s img, .v2h .xt-cl img { transition: transform 320ms var(--e9); }
.v2h .xt-r:hover > img, .v2h .q7-p:hover .q7-h img, .v2h .zi-r:hover .ie9-a img, .v2h .q7-vi:hover small img, .v2h .ys-r:hover .xs-s img, .v2h .xt-cl a:hover img { transform: translateY(-3px); }
.v2h .sgt { box-shadow: inset 0 0 0 1px rgba(255,255,255,.16), inset 0 0 0 0 rgba(255,255,255,0); transition: color 240ms var(--e9), box-shadow 360ms var(--e9), background 240ms ease, scale 160ms var(--e9); }
.v2h .sgt:hover { box-shadow: inset 0 0 0 1px rgba(255,255,255,.4), inset 0 -34px 0 0 rgba(255,255,255,.07); }
.v2h .sgt:active { scale: .95; }
.v2h .sgt[data-on="1"], .v2h .sgt[data-on="1"]:hover { background: transparent; color: #111; box-shadow: inset 0 0 0 1px #fff, inset 0 -34px 0 0 #fff; }
.v2h .tq9-d button { transition: width 360ms var(--e9), background 200ms ease; }
.v2h .tq9-d button[data-on="1"] { width: 18px; }
.v2h .tq9 > button { transition: color 160ms ease, translate 220ms var(--e9); }
.v2h .tq9 > button:first-child:hover { translate: -2px 0; }
.v2h .tq9 > button:last-child:hover { translate: 2px 0; }
.v2h .q7-th i { scale: .7; transition: opacity 200ms ease, scale 320ms var(--e9); }
.v2h .q7-vi:hover .q7-th i { scale: 1; }
.v2h .xt-p i { transform-origin: 50% 100%; transition: background 240ms ease; }
.v2h .xt-p:hover i { background: #2A2726; }
.v2h .zn > img { transform-origin: 50% 12%; }
@media (prefers-reduced-motion: no-preference) {
  .v2h .ys-r:hover .ys-pg { animation: ping9 900ms steps(1, end); }
  .v2h .sgt[data-on="1"] { animation: chip9 320ms var(--e9); }
  .v2h .xs-ip button[data-on="1"] { animation: chip9 320ms var(--e9); }
  .v2h .xt-p:hover img { animation: jump9 460ms cubic-bezier(.3,0,.3,1); }
  .v2h .q7-mo:hover .q7-mb em img { animation: beat9 640ms var(--e9) 160ms; }
  .v2h .fs9-cta:hover img { animation: wig9 560ms var(--e9); }
  .v2h .zn:hover > img { animation: ring9 760ms var(--e9); }
  .v2h .zn[data-on="1"] > img { animation: ring9b 760ms var(--e9); }
  .v2h .k-dot { animation: live9 1.8s ease-out infinite; }
  .v2h .h-mega :nth-child(1) { --i: 0; }
  .v2h .h-mega :nth-child(2) { --i: 1; }
  .v2h .h-mega :nth-child(3) { --i: 2; }
  .v2h .h-mega :nth-child(4) { --i: 3; }
  .v2h .h-mega :nth-child(5) { --i: 4; }
  .v2h .h-mega :nth-child(6) { --i: 5; }
  .v2h .h-mega :nth-child(7) { --i: 6; }
  .v2h .h-mega :nth-child(8) { --i: 7; }
  .v2h .h-mega :nth-child(9) { --i: 8; }
  .v2h .h-mega :nth-child(10) { --i: 9; }
  .v2h .h-mega :nth-child(11) { --i: 10; }
  .v2h .h-mega :nth-child(12) { --i: 11; }
  
  
  @keyframes col9 { from { opacity: 0; translate: 0 10px; } }
  @keyframes in9 { from { opacity: 0; translate: 0 8px; } }
  @keyframes inC9 { from { opacity: 0; translate: 0 14px; scale: .96; } }
  @keyframes pod9 { from { scale: 1 0; } }
  @keyframes rA { from { opacity: 0; translate: -10px 0; } }
  @keyframes rB { from { opacity: 0; translate: -10px 0; } }
  @keyframes uA { from { opacity: 0; translate: 0 8px; } }
  @keyframes uB { from { opacity: 0; translate: 0 8px; } }
  @keyframes iA { from { opacity: 0; scale: 1.1; } }
  @keyframes iB { from { opacity: 0; scale: 1.1; } }
  @keyframes chip9 { from { scale: .9; } }
  @keyframes jump9 { 0%, 100% { translate: 0 0; } 40% { translate: 0 -10px; } }
  @keyframes wig9 { 0%, 100% { rotate: 0deg; } 25% { rotate: -16deg; } 55% { rotate: 10deg; } 80% { rotate: -4deg; } }
  @keyframes ring9 { 0%, 100% { rotate: 0deg; } 15% { rotate: 14deg; } 35% { rotate: -12deg; } 55% { rotate: 8deg; } 75% { rotate: -4deg; } }
  @keyframes ring9b { 0%, 100% { rotate: 0deg; } 15% { rotate: 14deg; } 35% { rotate: -12deg; } 55% { rotate: 8deg; } 75% { rotate: -4deg; } }
  @keyframes beat9 { 0%, 100% { scale: 1; } 30% { scale: 1.4; } 60% { scale: .92; } }
  @keyframes live9 { 0% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--status-online) 60%, transparent); } 100% { box-shadow: 0 0 0 6px color-mix(in srgb, var(--status-online) 0%, transparent); } }
  @keyframes ping9 { 0% { content: url("../images/mc/gui/sprites/server_list/pinging_1.png"); } 16% { content: url("../images/mc/gui/sprites/server_list/pinging_2.png"); } 32% { content: url("../images/mc/gui/sprites/server_list/pinging_3.png"); } 48% { content: url("../images/mc/gui/sprites/server_list/pinging_4.png"); } 64% { content: url("../images/mc/gui/sprites/server_list/pinging_5.png"); } 80%, 100% { content: url("../images/mc/gui/sprites/server_list/ping_5.png"); } }
}
.v2h .h-nav .h-nl { isolation: isolate; margin: 0 -16px -2px; padding: 0 16px 2px; }
.v2h .h-nl::before { content: ""; position: absolute; inset: 0; z-index: -1; background: #262423; transform: scaleY(0); transform-origin: 50% 100%; transition: transform 320ms var(--e9); }
.v2h .h-nl:hover::before, .v2h .h-nl[data-on="1"]::before { transform: none; }
.v2h .h-nl[data-on="1"] { color: #fff; }
.v2h .h-nl[data-on="1"] .h-car { transform: none; opacity: 1; }
.v2h .h-r { align-self: stretch; align-items: stretch; gap: 0; }
.v2h .h-r > a { position: relative; isolation: isolate; align-self: stretch; height: auto; margin: 0 0 -2px; padding: 0 16px 2px; color: rgba(255,255,255,.75); transition: color 200ms ease; }
.v2h .h-r > a:last-child { margin-right: -16px; }
.v2h .h-r > a::before { content: ""; position: absolute; inset: 0; z-index: -1; background: #262423; transform: scaleY(0); transform-origin: 50% 100%; transition: transform 320ms var(--e9); }
.v2h .h-r > a:first-child .h-i16 { transition: rotate 380ms cubic-bezier(.3,1.35,.5,1); }
.v2h .h-r > a:first-child:hover .h-i16, .v2h .h-r > a[data-on="1"] .h-i16 { rotate: 90deg; }
.v2h .h-r > a:last-child .h-i16 { position: relative; z-index: 1; }
.v2h .h-r > a:last-child::after { content: ""; position: absolute; z-index: 0; left: 2px; top: calc(50% - 6px); width: 10px; height: 10px; background: currentColor; clip-path: polygon(4px 0, 6px 0, 6px 2px, 8px 2px, 8px 4px, 10px 4px, 10px 6px, 8px 6px, 8px 8px, 6px 8px, 6px 10px, 4px 10px, 4px 6px, 0 6px, 0 4px, 4px 4px); opacity: 0; pointer-events: none; }
@media (prefers-reduced-motion: no-preference) {
  .v2h .h-r > a:last-child:hover::after { animation: enter9 1100ms var(--e9) infinite; }
  .v2h .h-r > a:last-child:hover .h-i16 { animation: gulp9 1100ms var(--e9) infinite; }
  @keyframes enter9 { 0% { opacity: 0; translate: -6px 0; } 25% { opacity: 1; translate: 2px 0; } 60% { opacity: 1; translate: 12px 0; } 78%, 100% { opacity: 0; translate: 18px 0; } }
  @keyframes gulp9 { 0%, 55%, 100% { scale: 1; } 70% { scale: 1.15; } }
}
.v2h .h-top .k-wrap { align-items: stretch; }
.v2h .h-top a { position: relative; isolation: isolate; display: flex; align-items: center; margin: 0 -10px; padding: 0 10px; transition: color 200ms ease; }
.v2h .h-top a::before { content: ""; position: absolute; inset: 0; z-index: -1; background: #262423; transform: scaleY(0); transform-origin: 50% 0; transition: transform 280ms var(--e9); }
.v2h .h-top a:hover { color: #fff; }
.v2h .h-top a:hover::before { transform: none; }
.v2h .h-r > a:hover, .v2h .h-r > a[data-on="1"] { color: #fff; }
.v2h .h-r > a:hover::before, .v2h .h-r > a[data-on="1"]::before { transform: none; }
.v2h .lv-p { animation: none; padding: 0; overflow: hidden; transition: height 380ms var(--e9), box-shadow 200ms ease; }
.v2h .lv-p[data-open="0"] { height: 0 !important; box-shadow: none; transition: height 280ms var(--e9), box-shadow 160ms ease 180ms; }
.v2h .lv-l { position: absolute; left: 0; right: 0; top: 0; padding: 22px 0 26px; opacity: 0; visibility: hidden; pointer-events: none; transition: opacity 180ms ease, translate 380ms var(--e9), visibility 0s linear 380ms; }
.v2h .lv-l[data-st="l"] { translate: -36px 0; }
.v2h .lv-l[data-st="r"] { translate: 36px 0; }
.v2h .lv-l[data-st="on"] { opacity: 1; visibility: visible; pointer-events: auto; translate: 0 0; transition: opacity 280ms ease 60ms, translate 440ms var(--e9), visibility 0s; }
.v2h .lv-l .nm > * { animation: none; }
@media (prefers-reduced-motion: no-preference) {
  .v2h .lv-l[data-on="1"] .nm > * { animation: col9 520ms var(--e9) backwards; animation-delay: calc(40ms + var(--i, 0) * 60ms); }
  .v2h .lv-l[data-on="1"] :is(.xt-r, .zi-r, .yi-t, .zr-r, .xd-m, .xa-t, .tv9-r, .q7-p, .q7-vi, .ys-r, .zr-pl, .zr-k2) { animation: in9 460ms var(--e9) backwards; animation-delay: calc(140ms + var(--i, 0) * 40ms); }
  .v2h .lv-l[data-on="1"] :is(.sk9c, .xd-c, .tw9-c, .q7-mo, .xt-cl a, .fs9-cta, .zq-b, .xt-p) { animation: inC9 560ms var(--e9) backwards; animation-delay: calc(160ms + var(--i, 0) * 50ms); }
  .v2h .lv-l[data-on="1"] .xt-p i { animation: pod9 620ms var(--e9) backwards; }
  .v2h .lv-l[data-on="1"] .xt-p.p3 i { animation-delay: 260ms; }
  .v2h .lv-l[data-on="1"] .xt-p.p2 i { animation-delay: 380ms; }
  .v2h .lv-l[data-on="1"] .xt-p.p1 i { animation-delay: 500ms; }
  .v2h .lv-l[data-on="1"] [data-v="a"] > :is(.xt-r, .ys-r, .xd-m, .xa-t), .v2h .lv-l[data-on="1"] [data-v="a"] .zr-g { animation: rA 420ms var(--e9) backwards; animation-delay: calc(var(--i, 0) * 35ms); }
  .v2h .lv-l[data-on="1"] [data-v="b"] > :is(.xt-r, .ys-r, .xd-m, .xa-t), .v2h .lv-l[data-on="1"] [data-v="b"] .zr-g { animation: rB 420ms var(--e9) backwards; animation-delay: calc(var(--i, 0) * 35ms); }
  .v2h .lv-l[data-on="1"] .yq9[data-v="a"] .yq-cv > img.bg { animation: iA 640ms var(--e9) backwards; }
  .v2h .lv-l[data-on="1"] .yq9[data-v="b"] .yq-cv > img.bg { animation: iB 640ms var(--e9) backwards; }
  .v2h .lv-l[data-on="1"] .yq9[data-v="a"] :is(.yq-ti, .yq-q) { animation: uA 420ms var(--e9) backwards; }
  .v2h .lv-l[data-on="1"] .yq9[data-v="b"] :is(.yq-ti, .yq-q) { animation: uB 420ms var(--e9) backwards; }
  .v2h .lv-l[data-on="1"] .yq9[data-v="a"] .zq-b { animation: uA 380ms var(--e9) backwards; animation-delay: calc(120ms + var(--i, 0) * 40ms); }
  .v2h .lv-l[data-on="1"] .yq9[data-v="b"] .zq-b { animation: uB 380ms var(--e9) backwards; animation-delay: calc(120ms + var(--i, 0) * 40ms); }
}

.v2h .nbd { position: absolute; right: -7px; bottom: -6px; z-index: 2; font-family: var(--font-body); font-size: 17px; font-style: normal; line-height: 1; letter-spacing: 0; text-transform: none; color: #fff; text-shadow: 2px 0 0 #000, -2px 0 0 #000, 0 2px 0 #000, 0 -2px 0 #000, 2px 2px 0 #000; pointer-events: none; }
.v2h .h-nav .h-nl { isolation: isolate; margin: 0 -16px -2px; padding: 0 16px 2px; }
.v2h .h-nl::before, .v2h .h-r > a::before { content: ""; position: absolute; inset: 0; z-index: -1; background: #262423; transform: scaleY(0); transform-origin: 50% 100%; transition: transform 320ms var(--e9); }
.v2h .h-nl:hover::before, .v2h .h-r > a:hover::before, .v2h .h-r > a[data-on="1"]::before { transform: none; }
.v2h .h-top .k-wrap { align-items: stretch; }
.v2h .h-top a { position: relative; isolation: isolate; display: flex; align-items: center; margin: 0 -10px; padding: 0 10px; transition: color 200ms ease; }
.v2h .h-top a::before { content: ""; position: absolute; inset: 0; z-index: -1; background: #262423; transform: scaleY(0); transform-origin: 50% 0; transition: transform 280ms var(--e9); }
.v2h .h-top a:hover { color: #fff; }
.v2h .h-top a:hover::before { transform: none; }
.v2h .h-r { align-self: stretch; align-items: stretch; gap: 0; }
.v2h .h-r > a { position: relative; isolation: isolate; align-self: stretch; height: auto; margin: 0 0 -2px; padding: 0 16px 2px; color: rgba(255,255,255,.75); transition: color 200ms ease; }
.v2h .h-r > a:last-child { margin-right: -16px; }
.v2h .h-r > a:hover, .v2h .h-r > a[data-on="1"] { color: #fff; }
.v2h .h-sf .h-i16 { transition: rotate 380ms cubic-bezier(.3,1.35,.5,1); }
.v2h .h-sf:hover .h-i16 { rotate: 90deg; }
.v2h .hx-mi, .v2h .hx-me .h-av { position: relative; display: block; width: 32px; height: 32px; flex: none; }
.v2h .hx-mi > img { width: 32px; height: 32px; image-rendering: pixelated; transform-origin: 25% 80%; transition: rotate 320ms cubic-bezier(.3,1.35,.5,1); }
.v2h .hx-md:hover .hx-mi > img { rotate: -18deg; }
.v2h .hx-me .k-head { width: 32px; height: 32px; transition: translate 260ms var(--e9); }
.v2h .hx-me:hover .k-head { translate: 0 -3px; }
.v2h .hx-mi .nbd, .v2h .hx-me .nbd { right: -7px; bottom: -6px; }
.v2h .hx-bi { position: relative; display: grid; place-items: center; width: 20px; height: 20px; }
.v2h .hx-bi .ac-li { width: 16px; height: 16px; transform-origin: 50% 0; transition: rotate 380ms cubic-bezier(.3,1.5,.5,1); }
.v2h .hx-bl:hover .hx-bi .ac-li { rotate: -14deg; }
.v2h .hx-bi .nbd { right: -9px; bottom: -8px; }
.v2h .ac-li { display: block; flex: none; width: 16px; height: 16px; justify-self: center; background-color: currentColor; -webkit-mask-image: var(--m); mask-image: var(--m); -webkit-mask-size: 100% 100%; mask-size: 100% 100%; -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-position: center; mask-position: center; transition: translate 260ms var(--e9); }
.v2h .li-bell { --m: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' viewBox='0 0 8 8' shape-rendering='crispEdges' fill='black'%3E%3Crect x='3' y='0' width='1' height='1'/%3E%3Crect x='4' y='0' width='1' height='1'/%3E%3Crect x='2' y='1' width='1' height='1'/%3E%3Crect x='3' y='1' width='1' height='1'/%3E%3Crect x='4' y='1' width='1' height='1'/%3E%3Crect x='5' y='1' width='1' height='1'/%3E%3Crect x='1' y='2' width='1' height='1'/%3E%3Crect x='6' y='2' width='1' height='1'/%3E%3Crect x='1' y='3' width='1' height='1'/%3E%3Crect x='6' y='3' width='1' height='1'/%3E%3Crect x='1' y='4' width='1' height='1'/%3E%3Crect x='6' y='4' width='1' height='1'/%3E%3Crect x='0' y='5' width='1' height='1'/%3E%3Crect x='7' y='5' width='1' height='1'/%3E%3Crect x='0' y='6' width='1' height='1'/%3E%3Crect x='1' y='6' width='1' height='1'/%3E%3Crect x='2' y='6' width='1' height='1'/%3E%3Crect x='3' y='6' width='1' height='1'/%3E%3Crect x='4' y='6' width='1' height='1'/%3E%3Crect x='5' y='6' width='1' height='1'/%3E%3Crect x='6' y='6' width='1' height='1'/%3E%3Crect x='7' y='6' width='1' height='1'/%3E%3Crect x='3' y='7' width='1' height='1'/%3E%3Crect x='4' y='7' width='1' height='1'/%3E%3C/svg%3E"); }
@media (prefers-reduced-motion: no-preference) {
  
  .v2h .nbd[data-v="a"] { animation: bdA 420ms cubic-bezier(.3,1.5,.5,1); }
  .v2h .nbd[data-v="b"] { animation: bdB 420ms cubic-bezier(.3,1.5,.5,1); }
  
  
  
  
  
  
  
  @keyframes bdA { from { scale: 1.6; } }
  @keyframes bdB { from { scale: 1.6; } }
}
/* ══ MOBİL (1b Header - Mobil.dc.html) ═════════════════════════════ */
.v2m .mh { position: relative; z-index: 6; flex: none; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; height: 56px; padding: 0 16px; background: #141312; border-bottom: 2px solid #000; }
.v2m .burg { display: grid; align-content: center; gap: 4px; width: 16px; height: 16px; } .v2m .burg i { display: block; width: 16px; height: 2px; background: #fff; } .v2m .burg i:nth-child(2) { width: 12px; } .v2m .burg i:nth-child(3) { width: 14px; }
.v2m .xic { position: relative; display: block; width: 16px; height: 16px; } .v2m .xic i { position: absolute; left: 1px; top: 1px; width: 2px; height: 2px; background: #fff; box-shadow: 2px 2px #fff, 4px 4px #fff, 6px 6px #fff, 8px 8px #fff, 10px 10px #fff, 12px 12px #fff, 12px 0 #fff, 10px 2px #fff, 8px 4px #fff, 4px 8px #fff, 2px 10px #fff, 0 12px #fff; }
.v2m .mh-logo { width: 112px; height: auto; image-rendering: auto; }
.v2m .mh-r { display: flex; align-items: center; justify-content: flex-end; gap: 18px; }
.v2m .ic16 { width: 16px; height: 16px; }
.v2m .me { position: relative; display: block; } .v2m .me .hd { width: 28px; height: 28px; } .v2m .nbd { position: absolute; top: -7px; right: -11px; z-index: 2; display: grid; place-items: center; min-width: 18px; height: 14px; padding: 1px 4px 0; background: var(--mctr-red); color: #fff; font-family: var(--font-pixel); font-size: 8px; font-style: normal; letter-spacing: 0; line-height: 1; box-shadow: 0 2px 0 rgba(0,0,0,.35); pointer-events: none; }
.v2m .mt { position: relative; display: block; width: 32px; height: 32px; margin: -8px -6px -8px -4px; } .v2m .mt > img { width: 32px; height: 32px; image-rendering: pixelated; } .v2m .mt .nbd { top: -2px; right: -8px; }
.v2m .mb { position: relative; flex: 1; min-height: 0; overflow: hidden; }
.v2m .nv { position: absolute; inset: 0; z-index: 5; display: flex; flex-direction: column; background: #141312; }
.v2m .nv-sc { flex: 1; min-height: 0; overflow: hidden; }
.v2m .chev { width: 9px; height: 7px; justify-self: end; transform: rotate(90deg); opacity: .5; }
.v2m .m-sr { display: flex; align-items: center; gap: 10px; height: 48px; margin: 16px 24px 8px; padding: 0 14px; background: #0A0909; box-shadow: inset 0 0 0 1px rgba(255,255,255,.14); font-size: 15px; color: rgba(255,255,255,.45); transition: box-shadow 200ms ease; }
.v2m .m-sr:hover { box-shadow: inset 0 0 0 1px rgba(255,255,255,.3); color: rgba(255,255,255,.6); }
.v2m .m-sr img { width: 16px; height: 16px; }
.v2m .acc { display: grid; grid-template-columns: 32px minmax(0, 1fr) auto; gap: 12px; align-items: center; min-height: 56px; margin: 0 24px 8px; font-size: 16px; }
.v2m .acc > img { width: 32px; height: 32px; }
.v2m .acc .ui { display: grid; place-items: center; width: 32px; height: 32px; background: #1E1C1B; }
.v2m .acc .ui img { width: 16px; height: 16px; }
.v2m .acc .go { display: flex; align-items: center; gap: 8px; font-size: 14px; color: var(--fg-muted); }
.v2m .tiles { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; padding: 0 24px; }
.v2m .tile { display: flex; flex-direction: column; justify-content: space-between; height: 88px; padding: 14px 16px 12px; background: #1E1C1B; box-shadow: var(--shadow-seat); font-size: 16px; line-height: 1; transition: background 200ms ease, transform 160ms cubic-bezier(.2,.7,.2,1); }
.v2m .tile:hover { background: #262423; }
.v2m .tile:active { transform: translateY(1px); }
.v2m .tile img { width: 32px; height: 32px; }
.v2m .tile img.bars { width: 30px; height: 24px; margin: 4px 0; }
.v2m .tile.cur { box-shadow: inset 0 -3px 0 var(--mctr-red); }
.v2m .tile:last-child:nth-child(odd) { grid-column: 1 / -1; }
.v2m .qt { flex: none; display: flex; justify-content: center; align-items: center; gap: 4px; padding: 0 16px 10px; font-size: 13px; color: var(--fg-muted); }
.v2m .qt a { display: flex; align-items: center; min-height: 44px; padding: 0 4px; transition: color 200ms ease; }
.v2m .qt i { font-style: normal; opacity: .5; }
.v2m .sub-h { display: flex; align-items: center; gap: 2px; min-height: 56px; padding: 0 12px; border-bottom: 1px solid rgba(255,255,255,.06); }
.v2m .bk { display: grid; place-items: center; width: 44px; height: 44px; }
.v2m .bk img { width: 9px; height: 7px; transform: rotate(-90deg); }
.v2m .sub-h b { font-size: 18px; }
.v2m .row { display: grid; grid-template-columns: 32px minmax(0, 1fr) 16px; gap: 14px; align-items: center; min-height: 58px; padding: 0 24px; border-bottom: 1px solid rgba(255,255,255,.05); font-size: 16px; transition: background 200ms ease; }
.v2m .row:hover { background: #1C1B1A; }
.v2m .row > img:first-child { width: 32px; height: 32px; }
.v2m .nf { flex: none; padding: 14px 24px 18px; box-shadow: 0 -2px 0 #000; }
.v2m .nf .k-btn { width: 100%; min-height: 48px; }
@media (prefers-reduced-motion: no-preference) {
.v2m .nv.sub .nv-sc { animation: v2mSubIn 260ms cubic-bezier(.2,.7,.2,1) both; }
.v2m .nv.open .tiles { animation: v2mUp 320ms cubic-bezier(.2,.7,.2,1) both; }
@keyframes v2mSubIn { from { opacity: 0; transform: translateX(16px); } }
@keyframes v2mUp { from { opacity: 0; transform: translateY(8px); } }
}
.v2m .ns { margin: 0; padding: 16px 24px 6px; font-family: var(--font-pixel); font-size: 9px; letter-spacing: 1.4px; text-transform: uppercase; color: rgba(255,255,255,.5); }
.v2m .sr-in { display: flex; align-items: center; gap: 8px; padding: 14px 12px 8px 24px; }
.v2m .sr-f { flex: 1; display: flex; align-items: center; gap: 10px; height: 48px; padding: 0 14px; background: #0A0909; box-shadow: inset 0 0 0 2px #fff; font-size: 15px; color: rgba(255,255,255,.45); }
.v2m .sr-f img { width: 16px; height: 16px; }
.v2m .sr-f .cr { width: 2px; height: 18px; margin-left: -6px; background: #fff; }
.v2m .cl { display: grid; place-items: center; width: 44px; height: 44px; flex: none; }
.v2m .tabs2 { display: flex; gap: 20px; padding: 4px 24px 0; border-bottom: 1px solid rgba(255,255,255,.06); }
.v2m .tabs2 a { display: flex; align-items: center; min-height: 44px; font-size: 14px; color: var(--fg-muted); box-shadow: inset 0 -2px 0 transparent; transition: color 200ms ease, box-shadow 200ms ease; }
.v2m .tabs2 a.on { color: #fff; box-shadow: inset 0 -2px 0 #fff; }
.v2m .rc { display: grid; grid-template-columns: minmax(0, 1fr) 44px; align-items: center; min-height: 48px; padding-left: 24px; border-bottom: 1px solid rgba(255,255,255,.05); font-size: 16px; }
.v2m .rc .xs { justify-self: center; }
.v2m .xs { position: relative; display: block; width: 10px; height: 10px; } .v2m .xs i { position: absolute; left: 0; top: 0; width: 2px; height: 2px; background: rgba(255,255,255,.55); box-shadow: 2px 2px rgba(255,255,255,.55), 4px 4px rgba(255,255,255,.55), 6px 6px rgba(255,255,255,.55), 8px 8px rgba(255,255,255,.55), 8px 0 rgba(255,255,255,.55), 6px 2px rgba(255,255,255,.55), 2px 6px rgba(255,255,255,.55), 0 8px rgba(255,255,255,.55); }
.v2m .tr2 { display: grid; grid-template-columns: 24px minmax(0, 1fr); gap: 12px; align-items: center; min-height: 52px; padding: 0 24px; border-bottom: 1px solid rgba(255,255,255,.05); font-size: 15px; line-height: 1.25; }
.v2m .tr2 i { font-style: normal; font-family: var(--font-display); font-size: 18px; color: rgba(255,255,255,.4); }
@media (prefers-reduced-motion: no-preference) {
.v2m .sr-f .cr { animation: v2mBlink 1.1s ease-in-out infinite alternate; }
@keyframes v2mBlink { from { opacity: 1; } to { opacity: .1; } }
}
/* ══ SİTEYE BAĞLAMA (tasarım kurallarından sonra gelir) ═══════════ */
/* ── masaüstü: .v2h kutu üretmez (display: contents), böylece bar sayfa boyunca yapışık kalır ── */
.v2h { display: contents; }
.v2h .h-bar { position: sticky; top: 0; z-index: 90; }
.admin-bar .v2h .h-bar { top: 32px; }
.v2h-dim { position: fixed; inset: 0; z-index: 85; background: rgba(0,0,0,.62); opacity: 0; visibility: hidden; transition: opacity 280ms ease, visibility 0s linear 280ms; }
.v2h-dim[data-on="1"] { opacity: 1; visibility: visible; transition: opacity 280ms ease, visibility 0s; }
.v2h .h-logo { --mctr-block-size: 40px; }
.v2h .lv-l .zr-none { padding: 20px 0; color: var(--fg-muted); }
.v2h .v2-pane { display: contents; }
.v2h .v2-empty { padding: 14px 10px; font-size: 13px; line-height: 1.4; color: var(--fg-muted); }

.v2m { display: none; position: sticky; top: 0; z-index: 90; }
.admin-bar .v2m { top: 46px; }
.v2m .mh > :first-child { justify-self: start; display: grid; place-items: center; width: 44px; height: 44px; margin-left: -14px; }
.v2m .mh-logo-link { display: block; }
.v2m .mh-r > a, .v2m .mh-r > button { display: grid; place-items: center; min-width: 32px; min-height: 44px; }
.v2m .mb { position: fixed; left: 0; right: 0; top: 56px; bottom: 0; z-index: 89; overflow: hidden; background: #141312; }
.admin-bar .v2m .mb { top: 102px; }
.v2m .nv { position: absolute; inset: 0; z-index: 5; display: flex; flex-direction: column; background: #141312; }
.v2m .nv-sc { overflow-y: auto; overscroll-behavior: contain; }
.v2m .sr-in form { flex: 1; min-width: 0; }
.v2m .sr-f input { flex: 1; min-width: 0; height: 100%; font-size: 15px; color: #fff; }
.v2m .sr-f input::placeholder { color: rgba(255,255,255,.45); }
.v2m .rc a { display: flex; align-items: center; min-height: 48px; }
.v2m .tr2--r { grid-template-columns: 32px minmax(0, 1fr); }
.v2m .tr2--r img { width: 32px; height: 32px; }
.v2m .tr2--r b { display: block; font-weight: 400; color: #fff; }
.v2m .tr2--r small { display: block; margin-top: 2px; font-size: 12px; color: var(--fg-muted); }
.v2m .tr2 .hl { color: var(--mctr-red-soft); }
html.v2-lock, html.v2-lock body { overflow: hidden; }
.v2h .xt-cl .xt-tag { display: grid; place-items: center; width: 44px; height: 44px; background: #1B1A19; border: 1px solid rgba(255,255,255,.16); font-family: var(--font-pixel); font-size: 9px; letter-spacing: 1px; text-transform: uppercase; color: #fff; }
/* sitenin genel input odak çerçevesi tasarımın alanlarına sızmasın; odağı alanın kendi çerçevesi gösterir */
.v2h .zr-in input, .v2h .at-f input, .v2m .sr-f input,
.v2h .zr-in input:focus, .v2h .at-f input:focus, .v2m .sr-f input:focus { border: 0; outline: 0; box-shadow: none; background: transparent; -webkit-appearance: none; appearance: none; }

/* ══ GEÇİŞ: masaüstü ↔ mobil ══════════════════════════════════════ */
@media (max-width: 1099px) {
  .v2h, .v2h-dim { display: none; }
  .v2m { display: block; }
}
@media (max-width: 782px) {
  .admin-bar .v2m { top: 0; }
  .admin-bar .v2m .mb { top: 56px; }
}
@media (prefers-reduced-motion: reduce) {
  .v2h *, .v2m * { animation: none !important; transition: none !important; }
}